@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap";:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#242424;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}html,body{height:100%;margin:0;padding:0;overflow:hidden}body{min-width:320px}#root{height:100%;overflow:hidden}.btn{--btn-bg:#ffffff0f;--btn-bg-hover:#ffffff1f;--btn-bg-active:#ffffff2e;--btn-fg:#fffffff0;--btn-shadow-hover:0 8px 20px #0000002e;--btn-focus-ring:#78b1ffcc;appearance:none;background:var(--btn-bg);color:var(--btn-fg);cursor:pointer;border:0;border-radius:26px;min-height:40px;padding:10px 20px;font-family:inherit;font-size:15px;font-weight:500;line-height:1;transition:background-color .16s,border-color .16s,box-shadow .16s,transform .1s,opacity .16s}.btn:hover{background:var(--btn-bg-hover);box-shadow:var(--btn-shadow-hover)}.btn:active{background:var(--btn-bg-active);transform:scale(.98)}.btn:focus{outline:none}.btn:focus-visible{outline:2px solid var(--btn-focus-ring);outline-offset:2px}.btn:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}.btn-primary{--btn-bg:#80b6ff29;--btn-bg-hover:#80b6ff3d;--btn-bg-active:#80b6ff52}.btn-icon{justify-content:center;align-items:center;width:42px;min-width:42px;height:42px;padding:0;font-size:16px;display:inline-flex}.btn-menu{justify-content:flex-start;align-items:center;width:100%;padding:10px 14px;font-size:15px;display:inline-flex}.btn-danger{--btn-bg:#ff686824;--btn-bg-hover:#ff686838;--btn-bg-active:#ff68684d}body.theme-light .btn{--btn-bg:#141a220a;--btn-bg-hover:#141a2214;--btn-bg-active:#141a2224;--btn-fg:#161d24eb;--btn-focus-ring:#4579c5b8;--btn-shadow-hover:0 6px 16px #2c3d521f}body.theme-dark .btn{--btn-bg:var(--surface-panel,#2a2a2a);--btn-bg-hover:var(--surface-elevated,#333);--btn-bg-active:color-mix(in srgb, var(--surface-elevated,#333) 70%, var(--surface-border,#3a3a3a) 30%);--btn-fg:var(--text-primary,#eaeaea);--btn-focus-ring:color-mix(in srgb, var(--text-secondary,#b3b3b3) 72%, #7fb9ff 28%);--btn-shadow-hover:0 8px 18px #00000047}.btn__icon{justify-content:center;align-items:center;line-height:1;display:inline-flex}.btn__icon-svg{flex:none;width:16px;height:16px;display:block}.btn__label{margin-left:8px;display:inline-block}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.canvas-viewport{--canvas-scale:1;--canvas-inverse-scale:1;--transform-border-color:#b2becfeb;--transform-handle-border:#808fa2c7;--transform-handle-fill:#fffffffa;--transform-handle-hover-fill:#fff;--transform-border-size:1px;--transform-handle-size:7px;background:var(--canvas-bg,#000);background-image:radial-gradient(var(--canvas-grid-dot,#ffffff1a) 1px, transparent 1px);background-size:var(--canvas-grid-size,24px) var(--canvas-grid-size,24px);cursor:default;position:fixed;inset:0;overflow:hidden}.canvas-viewport.is-space-pan-ready{cursor:grab}.canvas-viewport.is-panning{cursor:grabbing}.canvas-viewport.is-crop-key-held,.canvas-viewport.is-crop-key-held .canvas-image{cursor:url(/knife-cursor.svg) 6 6,crosshair}.canvas-viewport.is-comment-mode .canvas-image,.canvas-viewport.is-comment-mode .canvas-image-node{cursor:crosshair}.canvas-viewport.is-locked .canvas-image,.canvas-viewport.is-locked .canvas-image-node,.canvas-viewport.is-locked .canvas-selection-outline,.canvas-viewport.is-locked .canvas-resize-handle{cursor:default}.canvas-viewport.is-locked.is-comment-mode .canvas-image,.canvas-viewport.is-locked.is-comment-mode .canvas-image-node{cursor:crosshair}.canvas-camera{position:absolute;top:0;left:0}.canvas-world{position:relative}.canvas-world-origin{width:40px;height:40px;color:var(--nav-fg-muted,#ffffffd6);opacity:.2;pointer-events:none;position:absolute;top:0;left:0;transform:translate(-50%,-50%)}.canvas-world-origin:before,.canvas-world-origin:after{content:"";background:currentColor;position:absolute}.canvas-world-origin:before{width:1px;height:100%;top:0;left:50%;transform:translate(-50%)}.canvas-world-origin:after{width:100%;height:1px;top:50%;left:0;transform:translateY(-50%)}.canvas-hint{width:max-content;max-width:min(90vw,460px);color:var(--nav-fg-muted,#ffffffd6);text-align:center;opacity:.6;-webkit-user-select:none;user-select:none;pointer-events:none;padding:0 12px;font-size:15px;line-height:1.6;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.canvas-image{object-fit:contain;cursor:grab;-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute;top:0;left:0}.canvas-image:active{cursor:grabbing}.canvas-image-node{cursor:grab;position:absolute}.canvas-image-node:active{cursor:grabbing}.canvas-selection-outline{pointer-events:none;box-sizing:border-box;box-shadow:inset 0 0 0 calc(1px * var(--canvas-inverse-scale)) #4c8dff;z-index:19;position:absolute}.canvas-resize-handle{--handle-offset:calc(4px * var(--canvas-inverse-scale));width:calc(12px * var(--canvas-inverse-scale));height:calc(12px * var(--canvas-inverse-scale));border:calc(1px * var(--canvas-inverse-scale)) solid #ffffffeb;border-radius:calc(2px * var(--canvas-inverse-scale));cursor:nwse-resize;z-index:20;background:#4c8dff;padding:0;transition:filter .12s,transform .12s;position:absolute;transform:translate(-50%,-50%)scale(1)}.canvas-resize-handle:hover{filter:brightness(1.06)}.canvas-resize-handle.is-nw{cursor:nwse-resize;transform:translate(calc(-50% - var(--handle-offset)), calc(-50% - var(--handle-offset))) scale(1)}.canvas-resize-handle.is-ne{cursor:nesw-resize;transform:translate(calc(-50% + var(--handle-offset)), calc(-50% - var(--handle-offset))) scale(1)}.canvas-resize-handle.is-se{cursor:nwse-resize;transform:translate(calc(-50% + var(--handle-offset)), calc(-50% + var(--handle-offset))) scale(1)}.canvas-resize-handle.is-sw{cursor:nesw-resize;transform:translate(calc(-50% - var(--handle-offset)), calc(-50% + var(--handle-offset))) scale(1)}.canvas-resize-handle.is-n{cursor:ns-resize;transform:translate(-50%, calc(-50% - var(--handle-offset))) scale(1)}.canvas-resize-handle.is-s{cursor:ns-resize;transform:translate(-50%, calc(-50% + var(--handle-offset))) scale(1)}.canvas-resize-handle.is-e{cursor:ew-resize;transform:translate(calc(-50% + var(--handle-offset)), -50%) scale(1)}.canvas-resize-handle.is-w{cursor:ew-resize;transform:translate(calc(-50% - var(--handle-offset)), -50%) scale(1)}.canvas-crop-frame{border:calc(var(--transform-border-size) * var(--canvas-inverse-scale)) solid var(--transform-border-color);box-shadow:none;cursor:move;z-index:24;position:absolute}.canvas-crop-mask-layer{pointer-events:none;z-index:22;position:absolute;overflow:hidden}.canvas-crop-mask{pointer-events:none;background:#00000073;position:absolute}.canvas-crop-mask.is-top{width:100%;top:0;left:0}.canvas-crop-mask.is-bottom{width:100%;bottom:0;left:0}.canvas-crop-mask.is-left{left:0}.canvas-crop-mask.is-right{right:0}.canvas-quick-crop-frame{pointer-events:none;z-index:23;background:#5090e629;border:1px solid #a0cdfff2;position:absolute}.canvas-crop-handle{width:calc(var(--transform-handle-size) * var(--canvas-inverse-scale));height:calc(var(--transform-handle-size) * var(--canvas-inverse-scale));border:calc(var(--transform-border-size) * var(--canvas-inverse-scale)) solid var(--transform-handle-border);background:var(--transform-handle-fill);z-index:25;border-radius:0;padding:0;transition:background-color .12s,transform .12s;position:absolute;transform:translate(-50%,-50%)scale(1)}.canvas-crop-handle:hover{background:var(--transform-handle-hover-fill);transform:translate(-50%,-50%)scale(1.08)}.canvas-crop-handle:before,.canvas-crop-handle:after,.canvas-crop-handle.is-corner:before,.canvas-crop-handle.is-corner:after{display:none}.canvas-crop-handle.is-n,.canvas-crop-handle.is-s,.canvas-crop-handle.is-e,.canvas-crop-handle.is-w{width:calc(var(--transform-handle-size) * var(--canvas-inverse-scale));height:calc(var(--transform-handle-size) * var(--canvas-inverse-scale))}.canvas-crop-handle.is-nw,.canvas-crop-handle.is-se{cursor:nwse-resize}.canvas-crop-handle.is-ne,.canvas-crop-handle.is-sw{cursor:nesw-resize}.canvas-crop-handle.is-n,.canvas-crop-handle.is-s{cursor:ns-resize}.canvas-crop-handle.is-e,.canvas-crop-handle.is-w{cursor:ew-resize}body.theme-dark .canvas-viewport{--transform-border-color:#b9c5d6e0;--transform-handle-border:#8695a9d1;--transform-handle-fill:#fffffffa;--transform-handle-hover-fill:#fff}body.theme-light .canvas-viewport{--transform-border-color:#667589b8;--transform-handle-border:#56667aad;--transform-handle-fill:#fffffffa;--transform-handle-hover-fill:#fff}.canvas-smart-guide{pointer-events:none;z-index:26;color:var(--nav-fg-muted,#ffffffd6);opacity:.55;position:absolute}.canvas-smart-guide.is-vertical{background:currentColor;width:1px;transform:translate(-.5px)}.canvas-smart-guide.is-horizontal{background:currentColor;height:1px;transform:translateY(-.5px)}.canvas-marquee{pointer-events:none;z-index:30;background:#64a0ff29;border:1px solid #86b8ffcc;position:fixed}.canvas-context-menu{z-index:40;border-radius:var(--floating-surface-radius,18px);min-width:236px;color:var(--menu-fg,#eaeaea);background:var(--menu-bg,#2a2a2a);border:1px solid var(--floating-surface-border,var(--menu-divider,#3a3a3a));box-shadow:var(--floating-surface-shadow,0 14px 30px #0000003d, 0 4px 10px #00000029);-webkit-backdrop-filter:blur(14px);transform-origin:0 0;flex-direction:column;gap:2px;padding:8px;animation:.14s ease-out canvas-menu-in;display:flex;position:fixed}.canvas-context-menu__divider{background:var(--menu-divider,#3a3a3a);height:1px;margin:6px 4px}.canvas-menu-item{color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:13px;align-items:center;gap:12px;width:100%;min-height:44px;padding:12px 14px;font-family:inherit;font-size:15px;font-weight:500;transition:background-color .13s,transform .1s,color .13s;display:flex}.canvas-menu-item:hover{background:var(--menu-item-hover,#333)}.canvas-menu-item:active{transform:scale(.985)}.canvas-menu-item.is-disabled,.canvas-menu-item:disabled{opacity:.45;cursor:default;pointer-events:none}.canvas-menu-item.is-disabled:hover,.canvas-menu-item:disabled:hover{background:0 0}.canvas-menu-item:focus{outline:none}.canvas-menu-item:focus-visible{box-shadow:inset 0 0 0 2px var(--menu-focus,#7eb6ffd1)}.canvas-menu-item__icon{width:18px;height:18px;color:var(--menu-icon,#d4e5fff5);flex:none;justify-content:center;align-items:center;display:inline-flex}.canvas-menu-item__icon svg{width:18px;height:18px;display:block}.canvas-menu-item__label{white-space:nowrap;flex:1}.canvas-menu-item__badge{letter-spacing:.05em;color:var(--menu-badge-fg,#c9e2fff2);background:var(--menu-badge-bg,#6aa0e847);border-radius:999px;padding:3px 7px;font-size:10px;font-weight:600}.canvas-menu-item__state-icon{color:var(--menu-icon,#d4e5fff5);opacity:.95;flex:none;justify-content:center;align-items:center;display:inline-flex}.canvas-menu-item.is-danger{color:var(--menu-danger,#ffa0a0f5)}.canvas-menu-item.is-danger:hover{background:var(--menu-danger-hover,#ff5d5d2e)}.canvas-menu-submenu,.canvas-menu-submenu__trigger{width:100%;position:relative}.canvas-menu-submenu__chevron{opacity:.72;font-size:16px;line-height:1}.canvas-menu-submenu:after{content:"";width:8px;height:100%;position:absolute;top:0;right:-8px}.canvas-menu-submenu__panel{border-radius:var(--floating-surface-radius,18px);min-width:230px;color:var(--menu-fg,#eaeaea);background:var(--menu-bg,#2a2a2a);border:1px solid var(--floating-surface-border,var(--menu-divider,#3a3a3a));box-shadow:var(--floating-surface-shadow,0 14px 30px #0000003d, 0 4px 10px #00000029);-webkit-backdrop-filter:blur(14px);z-index:70;opacity:0;pointer-events:none;flex-direction:column;gap:2px;padding:8px;transition:opacity .14s,transform .14s;display:flex;position:absolute;top:0;left:100%;transform:translate(4px)}.canvas-menu-submenu:hover .canvas-menu-submenu__panel,.canvas-menu-submenu:focus-within .canvas-menu-submenu__panel{opacity:1;pointer-events:auto;transform:translate(0)}.canvas-menu-submenu__panel .canvas-menu-item{min-height:40px;padding:11px 14px}body.theme-dark .canvas-context-menu{--menu-bg:var(--surface-panel,#2a2a2a);--menu-fg:var(--text-primary,#eaeaea);--menu-item-hover:var(--surface-elevated,#333);--menu-divider:var(--surface-border,#3a3a3a);--menu-icon:var(--text-secondary,#b3b3b3);--menu-focus:color-mix(in srgb, var(--text-secondary,#b3b3b3) 72%, #7fb9ff 28%);--menu-badge-bg:color-mix(in srgb, var(--surface-elevated,#333) 80%, #7aa8e8 20%);--menu-badge-fg:var(--text-primary,#eaeaea);--menu-danger:#d98b8b;--menu-danger-hover:color-mix(in srgb, var(--surface-elevated,#333) 74%, #9e4f4f 26%)}body.theme-light .canvas-context-menu{--menu-bg:#fcfdffed;--menu-fg:#18202af5;--menu-item-hover:#1c263214;--menu-divider:#22304024;--menu-icon:#2a3a4ceb;--menu-focus:#447ac9b8;--menu-badge-bg:#5484c929;--menu-badge-fg:#304c77eb;--menu-danger:#aa3434f0;--menu-danger-hover:#bd464629}@keyframes canvas-menu-in{0%{opacity:0;transform:translateY(6px)scale(.985)}to{opacity:1;transform:translateY(0)scale(1)}}.canvas-snapping-indicator{color:#bedefff2;pointer-events:none;background:#23405e8c;border:1px solid #85bcff57;border-radius:999px;padding:4px 8px;font-size:11px;position:fixed;bottom:56px;right:16px}.canvas-feedback-indicator{color:#bedefff2;pointer-events:none;background:#23405e8c;border:1px solid #85bcff57;border-radius:999px;padding:4px 8px;font-size:11px;position:fixed;bottom:88px;right:16px}.canvas-lock-toast{color:#f5babaf5;pointer-events:none;-webkit-backdrop-filter:blur(10px);z-index:60;background:#58262694;border:1px solid #d676766b;border-radius:999px;align-items:center;gap:8px;padding:6px 10px;font-size:12px;font-weight:500;animation:.17s ease-out canvas-lock-toast-in;display:inline-flex;position:fixed;bottom:88px;right:16px;box-shadow:0 8px 20px #00000042,0 2px 6px #0000002e}.canvas-lock-toast__icon{opacity:.95;justify-content:center;align-items:center;display:inline-flex}@keyframes canvas-lock-toast-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.canvas-comment-pin{width:calc(22px * var(--canvas-inverse-scale));height:calc(18px * var(--canvas-inverse-scale));background:var(--comment-pin-color,#6f8ba6);color:#fffffff5;border-radius:calc(8px * var(--canvas-inverse-scale));z-index:21;cursor:pointer;box-shadow:0 calc(2px * var(--canvas-inverse-scale)) calc(5px * var(--canvas-inverse-scale)) #0003, inset 0 0 0 calc(1px * var(--canvas-inverse-scale)) #ffffff38;border:none;justify-content:center;align-items:center;padding:0;transition:transform .11s,box-shadow .13s,filter .13s;display:inline-flex;position:absolute;transform:translate(-50%,-50%)}.canvas-comment-pin__glyph{width:calc(10px * var(--canvas-inverse-scale));height:calc(10px * var(--canvas-inverse-scale));justify-content:center;align-items:center;display:inline-flex}.canvas-comment-pin__glyph svg{width:100%;height:100%;display:block}.canvas-comment-pin__glyph path{fill:currentColor}.canvas-comment-pin:after{content:"";left:calc(5px * var(--canvas-inverse-scale));bottom:calc(-2px * var(--canvas-inverse-scale));width:calc(6px * var(--canvas-inverse-scale));height:calc(6px * var(--canvas-inverse-scale));border-radius:calc(2px * var(--canvas-inverse-scale));background:inherit;pointer-events:none;position:absolute;transform:rotate(45deg)}.canvas-comment-pin:hover,.canvas-comment-pin.is-active{filter:brightness(1.08);box-shadow:0 calc(3px * var(--canvas-inverse-scale)) calc(8px * var(--canvas-inverse-scale)) #0000003d, inset 0 0 0 calc(1px * var(--canvas-inverse-scale)) #ffffff57;transform:translate(-50%,-50%)scale(1.04)}.canvas-comment-pin.is-active{box-shadow:0 calc(3px * var(--canvas-inverse-scale)) calc(8px * var(--canvas-inverse-scale)) #0000003d, inset 0 0 0 calc(1px * var(--canvas-inverse-scale)) #ffffff57, 0 0 0 calc(1px * var(--canvas-inverse-scale)) #ffffffad}.canvas-comment-pin.is-draft{filter:saturate(.92);opacity:.95}.canvas-comment-editor{width:min(272px,100vw - 24px);color:var(--menu-fg,#f5f8fcf5);--comment-input-fg:var(--menu-fg,#f5f8fcf5);--comment-input-placeholder:var(--menu-icon,#d4e5fff5);--comment-input-caret:var(--menu-fg,#f5f8fcf5);--comment-footer-divider:var(--menu-divider,#ffffff1a);--comment-send-bg:#70a5f638;--comment-send-bg-hover:#70a5f64d;--comment-send-bg-active:#70a5f666;background:var(--menu-bg,#14181de6);-webkit-backdrop-filter:blur(14px);z-index:42;transform-origin:0 0;border:0;border-radius:24px;padding:8px;transition:box-shadow .12s,border-color .12s;animation:.14s ease-out canvas-menu-in;position:fixed;overflow:hidden;box-shadow:0 14px 30px #0000003d,0 4px 10px #00000029}.canvas-comment-editor:focus-within{border-color:color-mix(in srgb, var(--menu-fg,#f5f8fcf5) 26%, var(--menu-divider,#ffffff1a) 74%);box-shadow:0 14px 30px #0000003d, 0 4px 10px #00000029, 0 0 0 1px color-mix(in srgb, var(--menu-fg,#f5f8fcf5) 18%, transparent)}.canvas-comment-editor__input{resize:none;width:100%;min-height:96px;max-height:216px;color:var(--comment-input-fg);caret-color:var(--comment-input-caret);opacity:1;appearance:none;font:inherit;background:0 0;border:0;border-radius:0;padding:10px 12px;font-size:15px;font-weight:400;line-height:1.45}.canvas-comment-editor__input::placeholder{color:var(--comment-input-placeholder);opacity:1}.canvas-comment-editor__input:focus{box-shadow:none;outline:none}.canvas-comment-editor__footer{border-top:1px solid var(--comment-footer-divider);align-items:center;gap:8px;margin-top:2px;padding-top:8px;display:flex}.canvas-comment-editor__icon-btn{--btn-bg:#ffffff0a;--btn-bg-hover:#ffffff1a;--btn-bg-active:#ffffff29;--btn-shadow-hover:none;border-radius:999px;width:34px;min-width:34px;height:34px;min-height:34px;position:static}.canvas-comment-editor__save-state{letter-spacing:.05em;text-transform:uppercase;color:var(--menu-icon,#d4e5fff5);opacity:0;pointer-events:none;margin-right:auto;font-size:10px;line-height:1;transition:opacity .14s,transform .14s;transform:translateY(2px)}.canvas-comment-editor__save-state.is-visible{opacity:.9;transform:translateY(0)}.canvas-comment-editor__send-btn{--btn-bg:var(--comment-send-bg);--btn-bg-hover:var(--comment-send-bg-hover);--btn-bg-active:var(--comment-send-bg-active);--btn-shadow-hover:none;border-radius:999px;width:34px;min-width:34px;height:34px;min-height:34px}.canvas-comment-editor__send-btn svg{transform:translate(1px)}body.theme-dark .canvas-comment-editor{--comment-send-bg:color-mix(in srgb, var(--surface-elevated,#333) 82%, #7aa8e8 18%);--comment-send-bg-hover:color-mix(in srgb, var(--surface-elevated,#333) 74%, #7aa8e8 26%);--comment-send-bg-active:color-mix(in srgb, var(--surface-elevated,#333) 66%, #7aa8e8 34%)}body.theme-light .canvas-comment-editor{--comment-send-bg:#5485ce33;--comment-send-bg-hover:#5485ce47;--comment-send-bg-active:#5485ce5c}.canvas-comment-editor__icon-btn.is-danger{--btn-bg:#ff68681f;--btn-bg-hover:#ff686833;--btn-bg-active:#ff686847}body.theme-light .canvas-comment-editor__icon-btn{--btn-bg:#141a220d;--btn-bg-hover:#141a221c;--btn-bg-active:#141a2229}body.theme-light .canvas-comment-pin{box-shadow:0 calc(2px * var(--canvas-inverse-scale)) calc(5px * var(--canvas-inverse-scale)) #2d415a38, inset 0 0 0 calc(1px * var(--canvas-inverse-scale)) #ffffff57}body.theme-light .canvas-comment-pin.is-active{box-shadow:0 calc(3px * var(--canvas-inverse-scale)) calc(8px * var(--canvas-inverse-scale)) #2d415a3d, inset 0 0 0 calc(1px * var(--canvas-inverse-scale)) #ffffff73, 0 0 0 calc(1px * var(--canvas-inverse-scale)) #243d6075}body.theme-light .canvas-comment-editor__input{background:0 0}.app-shell{min-height:100vh;padding-top:0}body.theme-dark{--canvas-bg:#212121;--surface-panel:#2a2a2a;--surface-elevated:#333;--surface-border:#3a3a3a;--text-primary:#eaeaea;--text-secondary:#b3b3b3;--text-muted:#8a8a8a;--logo-color:var(--text-primary);--nav-fg:var(--text-primary);--nav-fg-muted:var(--text-secondary);--toast-fg:var(--text-primary);--toast-bg:var(--surface-elevated);--toast-border:var(--surface-border);--canvas-grid-dot:#eaeaea1f;--menu-bg:var(--surface-panel);--menu-fg:var(--text-primary);--menu-item-hover:var(--surface-elevated);--menu-divider:var(--surface-border);--menu-icon:var(--text-secondary);--floating-surface-border:color-mix(in srgb, var(--menu-divider) 70%, transparent);--floating-surface-shadow:0 14px 30px #0000003d, 0 4px 10px #00000029;--floating-surface-radius:18px}body.theme-light{--logo-color:#111;--nav-fg:#101010eb;--nav-fg-muted:#101010d1;--toast-fg:#1e2c3df2;--toast-bg:#ecf5fff2;--toast-border:#7ca0cb8c;--canvas-bg:#f7f8fa;--canvas-grid-dot:#0000001a;--menu-bg:#fcfdffed;--menu-fg:#18202af5;--menu-item-hover:#1c263214;--menu-divider:#22304024;--menu-icon:#2a3a4ceb;--floating-surface-border:color-mix(in srgb, var(--menu-divider) 88%, transparent);--floating-surface-shadow:0 14px 30px #0000003d, 0 4px 10px #00000029;--floating-surface-radius:18px}.top-nav{height:auto;box-shadow:none;z-index:1000;pointer-events:none;background:0 0;border:0;justify-content:space-between;align-items:center;padding:0;display:flex;position:fixed;top:12px;left:16px;right:16px}.top-nav__left,.top-nav__right{align-items:center;gap:8px;display:flex}.left-toolbar{border:1px solid var(--floating-surface-border,var(--menu-divider));background:color-mix(in srgb, var(--menu-bg) 86%, transparent);box-shadow:var(--floating-surface-shadow);-webkit-backdrop-filter:blur(14px);z-index:1100;pointer-events:auto;border-radius:18px;flex-direction:column;align-items:center;gap:8px;padding:10px 8px;display:inline-flex;position:fixed;top:50%;left:16px;transform:translateY(-50%)}.left-toolbar__boards{position:relative}.left-toolbar__divider{background:var(--menu-divider);opacity:.75;width:22px;height:1px;margin:2px 0}.left-toolbar__button{color:var(--nav-fg);transition:transform .11s;position:relative}.left-toolbar__button:hover{transform:translateY(-1px)}.left-toolbar__button:after{content:attr(data-tooltip);opacity:0;pointer-events:none;white-space:nowrap;color:var(--menu-fg);border:1px solid var(--floating-surface-border,var(--menu-divider));background:color-mix(in srgb, var(--menu-bg) 90%, transparent);-webkit-backdrop-filter:blur(10px);box-shadow:var(--floating-surface-shadow);border-radius:999px;padding:6px 8px;font-size:11px;line-height:1;transition:opacity .12s;position:absolute;top:50%;left:calc(100% + 12px);transform:translateY(-50%)}.left-toolbar__button:hover:after{opacity:1}.left-toolbar__button.is-active{--btn-bg:color-mix(in srgb, var(--surface-panel,#2a2a2a) 86%, #7aa8e8 14%);--btn-bg-hover:color-mix(in srgb, var(--surface-elevated,#333) 80%, #7aa8e8 20%);--btn-bg-active:color-mix(in srgb, var(--surface-elevated,#333) 74%, #7aa8e8 26%);--btn-fg:color-mix(in srgb, var(--text-primary,#eaeaea) 84%, #8bb8ff 16%)}body.theme-light .left-toolbar__button.is-active{--btn-bg:#6188c549;--btn-bg-hover:#5c82bb5a;--btn-bg-active:#5b81b96e;--btn-fg:#223858f2}.left-toolbar__boards-panel{top:50%;left:calc(100% + 10px);right:auto;transform:translateY(-50%)}.top-nav__boards{pointer-events:auto;position:relative}.top-nav__boards-panel{border-radius:var(--floating-surface-radius,18px);min-width:260px;max-width:min(88vw,340px);color:var(--menu-fg);background:var(--menu-bg);border:1px solid var(--floating-surface-border,var(--menu-divider));box-shadow:var(--floating-surface-shadow);-webkit-backdrop-filter:blur(14px);z-index:1100;flex-direction:column;gap:6px;padding:8px;display:flex;position:absolute;top:calc(100% + 8px);right:0}.top-nav__boards-title{letter-spacing:.05em;text-transform:uppercase;color:var(--menu-icon);padding:6px 8px 2px;font-size:12px;line-height:1}.top-nav__boards-list{flex-direction:column;gap:2px;max-height:260px;display:flex;overflow:auto}.top-nav__boards-row{position:relative}.top-nav__boards-item{color:inherit;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:12px;flex-direction:column;align-items:flex-start;gap:4px;width:100%;min-height:42px;padding:8px 68px 8px 10px;font-family:inherit;transition:background-color .13s,transform .1s;display:flex}.top-nav__boards-item:hover{background:var(--menu-item-hover)}.top-nav__boards-item:active{transform:scale(.99)}.top-nav__boards-item--editing{cursor:default}.top-nav__boards-item-name{font-size:14px;font-weight:500;line-height:1.2}.top-nav__boards-item-meta{color:var(--menu-icon);font-size:11px;line-height:1}.top-nav__boards-empty{color:var(--menu-icon);padding:8px 10px;font-size:13px}.top-nav__boards-actions{align-items:center;gap:4px;display:inline-flex;position:absolute;top:50%;right:8px;transform:translateY(-50%)}.top-nav__boards-edit,.top-nav__boards-delete{width:26px;height:26px;color:var(--menu-icon);opacity:0;cursor:pointer;background:0 0;border:0;border-radius:999px;justify-content:center;align-items:center;transition:opacity .12s,background-color .12s,color .12s;display:inline-flex}.top-nav__boards-row:hover .top-nav__boards-edit,.top-nav__boards-row:hover .top-nav__boards-delete,.top-nav__boards-row:focus-within .top-nav__boards-edit,.top-nav__boards-row:focus-within .top-nav__boards-delete{opacity:.88}.top-nav__boards-edit:hover,.top-nav__boards-delete:hover{background:var(--menu-item-hover);color:var(--menu-fg)}.top-nav__boards-name-input{width:100%;color:var(--menu-fg);font:inherit;background:0 0;border:0;outline:none;margin:0;padding:0;font-size:14px;font-weight:500;line-height:1.2}.top-nav__boards-name-input::placeholder{color:var(--menu-icon);opacity:1}.top-nav__logo{color:var(--logo-color);pointer-events:auto;align-items:center;gap:8px;display:inline-flex}.top-nav__logo-mark{width:24px;height:24px;color:var(--logo-color);background:color-mix(in srgb, var(--logo-color) 10%, transparent);border:1px solid color-mix(in srgb, var(--logo-color) 20%, transparent);border-radius:8px;justify-content:center;align-items:center;display:inline-flex}.top-nav__logo-wordmark{letter-spacing:.01em;align-items:center;font-family:inherit;font-size:19px;font-weight:400;line-height:1;display:inline-flex}.top-nav__logo-svg{width:auto;height:20px;color:var(--logo-color);pointer-events:auto;opacity:.98}.top-nav__button{pointer-events:auto;color:var(--nav-fg);opacity:.95}.top-nav__button:hover{opacity:1}.top-nav__button--primary{opacity:.9;align-items:center;display:inline-flex}.top-nav__icon-button{pointer-events:auto;color:var(--nav-fg-muted);opacity:.94}.top-nav__icon-button:hover{opacity:1}.top-nav__toast{color:var(--toast-fg);background:var(--toast-bg);border:1px solid var(--toast-border);z-index:1001;pointer-events:none;border-radius:6px;padding:6px 10px;font-size:12px;position:fixed;top:64px;right:16px}.app-version{opacity:.6;pointer-events:none;z-index:2000;color:#fff;font-size:12px;position:fixed;bottom:10px;right:12px}@media (width<=900px){.top-nav{top:10px;left:12px;right:12px}.top-nav__left,.top-nav__right{gap:6px}.top-nav__logo{gap:7px}.top-nav__logo-mark{width:22px;height:22px}.top-nav__logo-wordmark{font-size:17px}.left-toolbar{top:auto;bottom:max(12px, env(safe-area-inset-bottom));flex-direction:row;gap:6px;max-width:calc(100vw - 24px);padding:8px;left:50%;transform:translate(-50%)}.left-toolbar__divider{width:1px;height:22px;margin:0 2px}.left-toolbar__button:after{display:none}.left-toolbar__boards-panel{max-width:min(92vw,340px);inset:auto auto calc(100% + 10px) 50%;transform:translate(-50%)}.top-nav__toast{top:58px;right:12px}}@media (width<=640px){.top-nav{top:8px;left:8px;right:8px}.top-nav__left,.top-nav__right{gap:4px}.top-nav__logo{gap:6px}.top-nav__logo-mark{border-radius:7px;width:20px;height:20px}.top-nav__logo-wordmark{font-size:16px}.top-nav__boards-panel{max-width:min(94vw,340px)}.left-toolbar{bottom:max(8px, env(safe-area-inset-bottom));border-radius:16px;gap:4px;padding:6px}}
