:root{--header-h: 64px;--bg-app: #f3f6fb;--bg-shell: #ffffff;--bg-sidebar: #0f172a;--bg-sidebar-soft: #111c34;--bg-panel: #ffffff;--bg-toolbar: #ffffff;--bg-subtoolbar: #f7f9fd;--bg-grid: #eef3f9;--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #64748b;--text-inverse: #e2e8f0;--line-soft: #dde6f1;--line-strong: #c6d4e6;--accent: #1d4ed8;--accent-strong: #1e40af;--danger: #be123c;--success: #0f766e;--radius-sm: 10px;--radius-md: 14px;--radius-lg: 18px;--shadow-sm: 0 2px 8px rgba(15, 23, 42, .08);--shadow-md: 0 10px 28px rgba(15, 23, 42, .12)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;color:var(--text-primary);font-family:Sora,Segoe UI,Helvetica Neue,sans-serif;background:radial-gradient(circle at 0% 0%,#e6eefb,transparent 38%),radial-gradient(circle at 100% 100%,#e7eef7,transparent 40%),var(--bg-app)}.app-root{min-height:100%}.global-header{position:fixed;top:0;left:0;right:0;height:var(--header-h);z-index:120;background:#ffffffeb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid #dbe3f2;display:flex;align-items:center;justify-content:space-between;padding:0 16px}.brand-link{text-decoration:none;color:#0f172a;font-size:22px;font-weight:500;letter-spacing:-.02em;line-height:1}.global-nav{display:inline-flex;align-items:center;gap:8px}.nav-btn{text-decoration:none;border:1px solid #cdd9ef;border-radius:10px;padding:8px 12px;background:#fff;color:#0f172a;font-weight:600;cursor:pointer}.nav-btn.active{background:#1d4ed8;color:#fff;border-color:#1d4ed8}.app-page{min-height:calc(100vh - var(--header-h));padding-top:var(--header-h)}.app-root.no-global-header .app-page{min-height:100vh;padding-top:0}button,input,textarea{font:inherit}.auth-shell{min-height:calc(100vh - var(--header-h));display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 10% 0%,rgba(29,78,216,.12),transparent 42%),radial-gradient(circle at 100% 100%,rgba(15,118,110,.12),transparent 36%)}.auth-shell.auth-shell-signup{background-image:url(/landing-bg.svg);background-repeat:no-repeat;background-size:cover;background-position:center top}.auth-card{width:min(500px,96vw);background:linear-gradient(180deg,#fff,#f9fbff);border:1px solid var(--line-soft);border-radius:var(--radius-lg);padding:30px;box-shadow:var(--shadow-md)}.auth-kicker{display:inline-block;margin-bottom:10px;padding:6px 10px;border-radius:var(--radius-sm);box-sizing:border-box;border:1px solid #cdd9ef;background:#edf3ff;color:#1e40af;font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase}.auth-card h1{margin:0;letter-spacing:-.02em;font-size:34px}.auth-card p{margin:8px 0 14px;color:var(--text-secondary)}.auth-highlights{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}.auth-highlights span{padding:6px 10px;border-radius:var(--radius-sm);box-sizing:border-box;background:#e2e8f0;color:#334155;font-size:12px;font-weight:600}.auth-form{display:grid;gap:10px}.auth-form input,.board-create input{border:1px solid var(--line-strong);border-radius:var(--radius-sm);padding:10px 12px;outline:none;background:#fff}.auth-form input:focus,.board-create input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #1d4ed824}.auth-form button,.boards-page button,.board-route-header button,.sidebar button,.canvas-toolbar button,.canvas-subtoolbar button{border:0;border-radius:var(--radius-sm);padding:9px 12px;background:var(--accent);color:#fff;cursor:pointer;transition:transform .12s ease,background .12s ease,opacity .12s ease}.auth-form button:hover,.boards-page button:hover,.board-route-header button:hover,.sidebar button:hover,.canvas-toolbar button:hover,.canvas-subtoolbar button:hover{background:var(--accent-strong)}.auth-form button:active,.boards-page button:active,.board-route-header button:active,.sidebar button:active,.canvas-toolbar button:active,.canvas-subtoolbar button:active{transform:translateY(1px)}.auth-switch{display:flex;gap:8px}.auth-switch button{flex:1;background:#dbe5f4;color:#0f172a}.auth-switch button.active{background:var(--accent);color:#fff}.error{margin-top:8px;color:#b91c1c;font-size:14px}.app-shell{min-height:100vh;display:grid;grid-template-columns:320px 1fr;overflow:hidden}.boards-page{min-height:calc(100vh - var(--header-h));display:block;background:#fff}.boards-sidebar{width:280px;position:fixed;left:0;top:0;bottom:0;z-index:30;background:#fff;padding:calc(var(--header-h) + 12px) 14px 14px;border-right:1px solid #d9dde5;overflow:auto}.boards-profile{padding-bottom:14px}.boards-nickname{font-size:24px;font-weight:600;letter-spacing:-.02em;color:#111827}.boards-email{margin-top:6px;color:#6b7280;font-size:14px;overflow-wrap:anywhere}.boards-main{margin-left:280px;display:grid;grid-template-rows:auto 1fr;min-width:0;min-height:calc(100vh - var(--header-h));background:#fff}.boards-header{display:flex;justify-content:space-between;align-items:center;background:transparent;padding:18px 28px 0}.boards-header h1{margin:0;letter-spacing:-.02em;font-size:30px;line-height:1.1;font-weight:600;color:#0f172a}.boards-content{padding:12px 28px 24px;overflow:auto}.boards-controls{margin-top:2px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.boards-control-group{display:inline-flex;align-items:center;gap:8px}.boards-control-group label,.boards-control-label{color:#111827;font-size:16px;font-weight:500;white-space:nowrap}.boards-select-trigger{min-width:190px;width:100%;display:inline-flex;justify-content:space-between;align-items:center;border:1px solid #e5e7eb;border-radius:8px;background:#fff;color:#111827;padding:9px 12px;box-shadow:0 12px 28px #0f172a14;font-size:16px;font-weight:500;cursor:pointer}.boards-select-control{position:relative;min-width:190px}.boards-select-trigger:hover{border-color:#d1d5db!important;background-color:#f3f4f6!important}.boards-select-caret{width:8px;height:8px;border-right:2px solid #6b7280;border-bottom:2px solid #6b7280;transform:rotate(45deg) translateY(-1px);flex:0 0 auto}.boards-select-menu{position:absolute;left:0;top:calc(100% + 8px);z-index:50;width:100%;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 12px 28px #0f172a29;padding:6px}.boards-select-option{width:100%;border:0;background:#fff!important;color:#111827;border-radius:8px;padding:10px;text-align:left;font-weight:600;cursor:pointer;box-shadow:none}.boards-select-option:hover,.boards-select-option.active{background:#f3f4f6!important;color:#111827}.boards-page .boards-select-trigger,.boards-page .boards-select-option{background:#fff;color:#111827;border-color:#d1d5db}.boards-page .boards-select-trigger{background:#fff!important;border:1px solid #d1d5db!important}.boards-page .boards-select-trigger:hover{background:#f3f4f6!important;border-color:#d1d5db!important}.boards-page .boards-select-trigger:active,.boards-page .boards-select-trigger:focus-visible{background:#f3f4f6!important;border-color:#c7cdd7!important}.board-title-trigger{border:0!important;background:transparent!important;color:#0f172a!important;font-weight:600;font-size:18px;padding:0 12px!important;height:40px;display:flex;align-items:center;width:auto;max-width:min(60vw,960px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;justify-content:flex-start;text-align:left;border-radius:4px!important;user-select:none;-webkit-user-select:none}.board-title-trigger:hover{background:#eef2f6!important}.board-title-input{border:1px solid #c7d2fe;background:#fff;color:#0f172a;border-radius:8px;font-weight:600;font-size:18px;padding:0 12px;height:40px;display:flex;align-items:center;min-width:120px;width:auto;max-width:min(60vw,960px)}.board-title-input:focus{outline:none;border-color:#94a3b8;box-shadow:0 0 0 3px #94a3b82e}.boards-select-trigger:focus-visible,.boards-select-option:focus-visible{border-color:#c7cdd7;outline:none}.boards-create input{border:1px solid var(--line-strong);border-radius:var(--radius-sm);padding:10px 12px;outline:none;background:#fff}.boards-create input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #1d4ed824}.boards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;align-content:start;margin-top:18px}.board-card{border:1px solid var(--line-soft);border-radius:var(--radius-md);background:var(--bg-shell);padding:14px;box-shadow:var(--shadow-sm);cursor:pointer;display:flex;flex-direction:column;gap:10px;min-height:220px;aspect-ratio:1 / 1;position:relative;outline:none;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.board-card:hover{border-color:#b8c6e5;box-shadow:0 16px 35px #0f172a40;transform:translateY(-2px) scale(1.02)}.board-card h3{margin:auto 0 0;font-size:18px;line-height:1.2;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:calc(100% - 34px)}.board-preview{width:100%;height:150px;margin-bottom:10px;border-radius:6px;overflow:hidden;background:#f8fafc;border:1px solid #e2e8f0;box-shadow:inset 0 0 0 1px #0f172a14}.board-preview:hover{border-color:#93c5fd;box-shadow:inset 0 0 0 1px #0f172a38}.board-preview svg{width:100%;height:100%;display:block}.board-card-meta{display:flex;justify-content:space-between;align-items:center;color:var(--text-muted);font-size:13px;gap:8px}.boards-page .board-menu-btn{position:absolute;right:10px;top:8px;width:28px;height:28px;min-width:28px;border-radius:8px;padding:0;border:1px solid #d1d5db;background:#fff;color:#111827;display:inline-flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;opacity:0;pointer-events:none}.board-card:hover .board-menu-btn,.board-card:focus-within .board-menu-btn{opacity:1;pointer-events:auto}.boards-page .board-menu-btn:hover,.boards-page .board-menu-btn:active,.boards-page .board-menu-btn:focus-visible{background:#f9fafb;border-color:#c7cdd7;transform:none;outline:none}.boards-page .board-menu-btn span{width:3px;height:3px;border-radius:50%;background:#111827;display:block}.board-menu{position:absolute;right:10px;top:40px;z-index:2;min-width:172px;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 12px 28px #0f172a29;padding:6px}.boards-page .board-menu-action{width:100%;display:inline-flex;align-items:center;gap:10px;justify-content:flex-start;border:0;background:#fff;color:#111827;border-radius:8px;padding:9px 12px;font-weight:600;text-align:left}.boards-page .board-menu-action:hover{background:#f3f4f6}.boards-page .board-menu-action.delete{color:#111827}.board-menu-trash{font-size:14px;line-height:1;width:18px;text-align:center}.board-menu-pen{font-size:13px;line-height:1;width:18px;text-align:center}.board-menu-action span:last-child{text-align:left}.board-delete-dialog-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;background:#0f172a59;display:grid;place-items:center}.board-delete-dialog{width:min(420px,92vw);background:#fff;border:1px solid #dbe3f2;border-radius:14px;box-shadow:0 24px 60px #0f172a4d;padding:16px}.board-delete-dialog h3{margin:0 0 8px}.board-delete-dialog p{margin:0;color:#475569}.board-rename-input{margin-top:10px;width:100%;border:1px solid #c6d4e6;border-radius:10px;padding:9px 11px;outline:none;background:#fff}.board-rename-input:focus{border-color:#1d4ed8;box-shadow:0 0 0 3px #1d4ed81f}.board-delete-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.boards-error,.board-route-error{margin:0}@media (max-width: 980px){.boards-page{display:block}.boards-sidebar{position:static;width:auto;top:auto;bottom:auto;z-index:auto;border-bottom:1px solid #d9dde5}.boards-main{margin-left:0;min-height:auto}}.board-route{height:calc(100vh - var(--header-h));display:flex;flex-direction:column;background:#eef2f7;position:relative}.app-root.no-global-header .board-route{height:100vh}.board-route-header{position:absolute;left:12px;top:12px;z-index:42;min-height:60px;width:fit-content;max-width:calc(100vw - 24px);border:1px solid #dfe5ef;border-radius:8px;background:#fffffff5;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 10px 26px #0f172a1f;display:grid;grid-template-columns:auto auto auto;align-items:center;gap:6px;padding:8px 12px}.board-route-header>strong{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.board-route-actions{display:flex;gap:4px;position:relative}.board-brand-link{text-decoration:none;color:#0f172a;font-size:22px;font-weight:600;letter-spacing:-.02em;line-height:1;user-select:none;-webkit-user-select:none}.board-top-menu-btn{width:40px;height:40px;min-width:40px;border-radius:4px!important;padding:0!important;border:0!important;background:transparent!important;color:#111827!important;display:inline-flex;align-items:center;justify-content:center;flex-direction:column;gap:3px}.board-top-menu-btn span{width:3px;height:3px;border-radius:50%;background:#111827;display:block}.board-top-menu-btn:hover,.board-top-menu-btn:focus-visible{background:#eef2f6!important;outline:none}.board-top-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:188px;z-index:40;background:#fff;border:1px solid #dfe5ef;border-radius:8px;box-shadow:0 10px 26px #0f172a1f;padding:4px}.context-menu{position:fixed;z-index:100;background:#fffffffa;color:#111827;padding:4px;border-radius:10px;border:1px solid #dfe5ef;display:grid;gap:4px;box-shadow:0 10px 26px #0f172a1f}.board-top-menu .board-menu-action{width:100%;display:inline-flex;align-items:center;gap:10px;justify-content:flex-start;border:0;background:#fff;color:#111827;border-radius:4px;padding:9px 12px;font-weight:600;text-align:left}.board-top-menu .board-menu-action:hover{background:#f3f4f6}.board-route-canvas{height:100%;min-height:100%}.board-route-canvas .canvas-shell{height:100%}.board-route-empty{min-height:calc(100vh - var(--header-h));display:grid;place-items:center;gap:10px}.landing-page{min-height:calc(100vh - var(--header-h));padding:40px 24px 60px;background-image:url(/landing-bg.svg);background-repeat:no-repeat;background-size:cover;background-position:center top}.landing-hero{width:min(900px,100%);margin:0 auto;text-align:center}.landing-hero h1{margin:0;font-size:clamp(34px,5vw,58px);line-height:1.1;letter-spacing:-.03em;font-weight:550}.landing-hero p{margin:14px auto 0;max-width:700px;color:#475569;font-size:19px}.landing-actions{margin-top:22px;display:inline-flex;gap:10px}.landing-actions a{text-decoration:none;border-radius:12px;padding:10px 14px;font-weight:600}.landing-actions .primary{background:#1d4ed8;color:#fff}.landing-actions .secondary{background:#fff;color:#0f172a;border:1px solid #c6d4e6}.landing-grid{width:min(1000px,100%);margin:38px auto 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.landing-grid article{background:#fff;border:1px solid #dbe3f2;border-radius:14px;padding:14px;box-shadow:var(--shadow-sm)}.landing-grid h3{margin:0;font-weight:550}.landing-grid p{margin:8px 0 0;color:#55637a}.sidebar{height:100vh;display:flex;flex-direction:column;overflow:hidden;position:relative;padding:14px;border-right:1px solid #13243f;color:var(--text-inverse);background:linear-gradient(180deg,var(--bg-sidebar) 0%,var(--bg-sidebar-soft) 100%)}.sidebar-resizer{position:absolute;top:0;right:0;width:6px;height:100%;z-index:2;touch-action:none;cursor:col-resize;background:transparent}.sidebar-resizer:hover{background:#94a3b859}.sidebar-header{display:flex;justify-content:space-between;align-items:center}.sidebar-content{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding-right:4px}.sidebar-header h2{margin:0;letter-spacing:.01em}.sidebar-header button{background:#94a3b833}.sidebar-header button:hover{background:#94a3b859}.profile{margin:10px 0 12px;padding:10px;border:1px solid rgba(148,163,184,.28);border-radius:var(--radius-sm);background:#0f172a52;font-size:12px;color:#cbd5e1}.board-create{display:grid;grid-template-columns:1fr auto;gap:8px}.board-create input{background:#fffffff5}.board-list{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:8px;min-width:0}.board-list li{display:grid;grid-template-columns:1fr auto;gap:8px;min-width:0}.board-list button{width:100%;text-align:left;background:#dbe7fb;color:#1e3a8a;font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board-list button.selected{background:#1d4ed8;color:#fff}.board-list button.danger{width:auto;background:var(--danger);color:#fff}.app-shell.sidebar-collapsed{grid-template-columns:68px 1fr}.sidebar.collapsed{padding:12px 8px}.sidebar-header-actions{display:flex;align-items:center;gap:8px}.ghost-btn{border:1px solid rgba(148,163,184,.35);background:#94a3b833;color:#e2e8f0;width:32px;min-width:32px;height:32px;padding:0;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;line-height:1}.ghost-btn svg{width:16px;height:16px}.sidebar.collapsed .sidebar-header{justify-content:center}.sidebar.collapsed .sidebar-header-actions{width:100%;justify-content:center}.workspace{overflow:hidden;display:flex;flex-direction:column}.empty-state{margin:auto;color:var(--text-secondary);font-weight:600}.canvas-shell{height:100vh;display:flex;flex-direction:column}.canvas-toolbar{min-height:58px;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:14px;padding:8px 12px;background:var(--bg-toolbar)}.tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;flex:1;justify-content:center}.icon-btn{width:38px;height:36px;padding:0;display:inline-flex;align-items:center;justify-content:center}.icon-btn svg{width:20px;height:20px}.icon-btn.active{background:var(--success)}.icon-btn.danger{background:var(--danger)}.icon-btn:disabled,.canvas-subtoolbar button:disabled,.canvas-toolbar button:disabled{opacity:.45;cursor:not-allowed}.canvas-subtoolbar{height:44px;border-bottom:1px solid var(--line-soft);display:flex;align-items:center;gap:8px;padding:0 12px;background:var(--bg-subtoolbar)}.canvas-subtoolbar span{color:var(--text-secondary);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.swatches{display:inline-flex;gap:6px;flex-wrap:wrap}.swatch{width:24px;height:24px;padding:0;border:1px solid rgba(15,23,42,.28);border-radius:50%;box-sizing:border-box;cursor:pointer}.swatch.active{box-shadow:0 0 0 2px #2563eb}.swatch.palette{width:32px;height:32px;border-radius:50%;border:2px solid rgba(15,23,42,.26);position:relative}.swatch.palette.active{box-shadow:0 0 0 2px #0f172a14}.swatch.palette.active:after{content:"";position:absolute;left:10px;top:6px;width:7px;height:12px;border-right:3px solid #111827;border-bottom:3px solid #111827;transform:rotate(45deg)}.selection-overlay-toolbar{position:absolute;z-index:44;display:block;pointer-events:auto}.selection-overlay-main{position:relative;display:inline-flex;align-items:center;gap:3px;width:100%;background:#fffffff5;border:1px solid #dfe5ef;border-radius:8px;box-shadow:0 10px 26px #0f172a1f;padding:4px}.selection-overlay-btn{border:0;background:transparent;color:#0f172a;border-radius:4px;width:40px;min-width:40px;height:40px;padding:0;display:inline-flex;align-items:center;justify-content:center;gap:0;font-weight:600;cursor:pointer}.selection-overlay-btn svg{width:24px;height:24px;display:block}.selection-overlay-btn:hover{background:#eef2f6}.selection-overlay-btn.active{background:#e7edf6}.selection-overlay-btn.icon-only{padding:0;justify-content:center}.selection-overlay-btn.icon-only svg{width:24px;height:24px}.selection-overlay-btn:disabled{opacity:.45;cursor:not-allowed}.selection-overlay-spacer{flex:0 0 1px;width:1px;margin:-4px 4px;background:#cfd7e3;border:0;align-self:stretch;transform:none}.selection-font-stepper{min-width:64px;height:32px;padding:0 4px 0 6px;border-radius:4px;border:0;background:#fff;color:#0f172a;display:inline-flex;align-items:center;justify-content:space-between;gap:8px}.selection-font-size-value{font-size:20px;line-height:1;font-weight:500;letter-spacing:.01em}.selection-font-size-arrows{display:grid;gap:1px}.selection-font-arrow{border:0;width:22px;height:15px;border-radius:3px;background:transparent;color:#334155;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}.selection-font-arrow svg{width:14px;height:14px}.selection-font-arrow:hover{background:#eef2f6}.selection-overlay-btn.dots{justify-content:center;padding:0;flex-direction:column;gap:3px}.selection-overlay-btn.dots span{width:3px;height:3px;border-radius:50%;background:#111827}.selection-current-color{width:22px;height:22px;border-radius:50%;border:1px solid rgba(15,23,42,.24);display:inline-block}.selection-current-color.text{width:14px;height:14px}.selection-current-color.transparent{background-image:linear-gradient(45deg,#e2e8f0 25%,transparent 25%),linear-gradient(-45deg,#e2e8f0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e2e8f0 75%),linear-gradient(-45deg,transparent 75%,#e2e8f0 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0}.selection-overlay-popup{position:absolute;background:#fffffff5;border:1px solid #dfe5ef;border-radius:10px;box-shadow:0 10px 26px #0f172a1f;padding:8px 12px}.selection-overlay-popup.colors{left:0;top:calc(100% + 8px);min-width:0;width:fit-content}.selection-overlay-popup.colors .swatches{display:grid;grid-template-columns:repeat(4,32px);gap:8px;justify-content:center}.selection-overlay-popup.more{left:calc(100% + 8px);top:0;min-width:180px;display:grid;gap:2px}.selection-overlay-popup.more button{border:0;background:#fff;color:#111827;border-radius:10px;padding:9px 12px;text-align:left;font-weight:600}.selection-overlay-popup.more button:hover{background:#f3f4f6}.selection-overlay-popup.more button:disabled{opacity:.45}.selection-overlay-popup.more .submenu-trigger{display:inline-flex;align-items:center;justify-content:space-between}.selection-overlay-popup.more .submenu-arrow{font-size:18px;line-height:1}.selection-overlay-popup.align-submenu{left:calc(100% + 8px);top:0}.canvas-subtoolbar .hint{margin-left:auto;color:var(--text-muted);text-transform:none;letter-spacing:0;font-weight:500}.canvas-layout{flex:1;display:flex;position:relative;min-height:0}.canvas{flex:1;min-height:0;position:relative;overflow:hidden;--zoom: 1;--inv-zoom: 1;background-color:var(--bg-grid);background-image:linear-gradient(rgba(15,23,42,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(15,23,42,.04) 1px,transparent 1px);background-size:40px 40px}.canvas.tool-rectangle,.canvas.tool-rounded,.canvas.tool-circle,.canvas.tool-line,.canvas.tool-triangle,.canvas.tool-diamond,.canvas.tool-star,.canvas.tool-speech,.canvas.tool-arrow{cursor:crosshair}.canvas.tool-sticky{cursor:cell}.canvas.tool-text{cursor:text}.shape-toolbox-stack{position:absolute;left:10px;top:50%;transform:translateY(-50%);z-index:36;display:grid;gap:14px}.shape-toolbox{width:auto;padding:4px;border-radius:8px;border:1px solid #dfe5ef;background:#fffffff5;box-shadow:0 10px 26px #0f172a1f;display:grid;gap:1px;place-items:center}.shape-toolbox.secondary{width:auto}.shape-tool-btn{border:0;border-radius:4px;background:transparent;color:#111827;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;cursor:pointer}.shape-tool-btn svg{width:24px;height:24px}.shape-tool-btn:hover{background:#eef2f6}.shape-tool-btn.active{background:#e7edf6;color:#0f172a}.shape-tool-btn:disabled{opacity:.45;cursor:not-allowed}.world{position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;transform-origin:0 0}.connector-layer{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:5}.connector-line{pointer-events:stroke;cursor:pointer}.connector-hit-area{pointer-events:stroke;stroke:transparent;stroke-width:calc(16px * var(--inv-zoom));fill:none;cursor:pointer}.connector-line.selected{filter:none}.connector-line-selection{pointer-events:none}.connector-line.draft{opacity:.95}.connector-snap-point{fill:#fff;stroke:#3b82f6}.connector-snap-point.active{fill:#3b82f6;stroke:#fff}.selection-box{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.selection-line{position:absolute;background:transparent;pointer-events:auto;box-sizing:border-box;--resize-hit: calc(12px * var(--inv-zoom));--resize-stroke: calc(1px * var(--inv-zoom))}.selection-line.top{top:calc(-1 * var(--resize-hit));left:0;right:0;height:var(--resize-hit);border-bottom:var(--resize-stroke) solid #2f5bff;cursor:ns-resize}.selection-line.right{top:0;bottom:0;right:calc(-1 * var(--resize-hit));width:var(--resize-hit);border-left:var(--resize-stroke) solid #2f5bff;cursor:ew-resize}.selection-line.bottom{left:0;right:0;bottom:calc(-1 * var(--resize-hit));height:var(--resize-hit);border-top:var(--resize-stroke) solid #2f5bff;cursor:ns-resize}.selection-line.left{top:0;bottom:0;left:calc(-1 * var(--resize-hit));width:var(--resize-hit);border-right:var(--resize-stroke) solid #2f5bff;cursor:ew-resize}.handle{position:absolute;width:calc(12px * var(--inv-zoom));height:calc(12px * var(--inv-zoom));border-radius:50%;box-sizing:border-box;pointer-events:none}.handle.corner{display:block;width:calc(14px * var(--inv-zoom));height:calc(14px * var(--inv-zoom));border:calc(3px * var(--inv-zoom)) solid #b5b5b5;background:#fff;box-shadow:var(--shadow-sm);border-radius:50%;box-sizing:border-box;padding:0;min-width:calc(14px * var(--inv-zoom));min-height:calc(14px * var(--inv-zoom));line-height:0;-moz-appearance:none;appearance:none;-webkit-appearance:none;pointer-events:auto}.handle.corner.nw{left:calc(-8px * var(--inv-zoom));top:calc(-8px * var(--inv-zoom));cursor:nwse-resize}.handle.corner.ne{right:calc(-8px * var(--inv-zoom));top:calc(-8px * var(--inv-zoom));cursor:nesw-resize}.handle.corner.sw{left:calc(-8px * var(--inv-zoom));bottom:calc(-8px * var(--inv-zoom));cursor:nesw-resize}.handle.corner.se{right:calc(-8px * var(--inv-zoom));bottom:calc(-8px * var(--inv-zoom));cursor:nwse-resize}.handle.rotate{display:block;width:calc(24px * var(--inv-zoom));height:calc(24px * var(--inv-zoom));border:none;background:#2563eb;border-radius:50%;box-shadow:var(--shadow-sm);padding:0;min-width:calc(24px * var(--inv-zoom));min-height:calc(24px * var(--inv-zoom));line-height:0;-moz-appearance:none;appearance:none;-webkit-appearance:none;pointer-events:auto;cursor:grab;right:calc(-54px * var(--inv-zoom));top:50%;transform:translateY(-50%);background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 4v6h6M23 20v-6h-6"/><path d="M20.49 9A9 9 0 5 1 5.64 5.64"/></svg>');background-size:calc(14px * var(--inv-zoom)) calc(14px * var(--inv-zoom));background-position:center;background-repeat:no-repeat}.handle.rotate:hover{background-color:#1d4ed8}.handle.rotate:active{cursor:grabbing}.handle.connector-port{display:block;width:calc(12px * var(--inv-zoom));height:calc(12px * var(--inv-zoom));min-width:calc(12px * var(--inv-zoom));min-height:calc(12px * var(--inv-zoom));border:calc(2px * var(--inv-zoom)) solid #ffffff;border-radius:50%;background:#3b82f6;box-shadow:0 0 0 calc(1px * var(--inv-zoom)) #3b82f6e6;pointer-events:auto;padding:0;margin:0;-moz-appearance:none;appearance:none;-webkit-appearance:none;z-index:3}.handle.connector-port.n{left:50%;top:calc(-20px * var(--inv-zoom));transform:translate(-50%);cursor:crosshair}.handle.connector-port.e{top:50%;right:calc(-20px * var(--inv-zoom));transform:translateY(-50%);cursor:crosshair}.handle.connector-port.s{left:50%;bottom:calc(-20px * var(--inv-zoom));transform:translate(-50%);cursor:crosshair}.handle.connector-port.w{top:50%;left:calc(-20px * var(--inv-zoom));transform:translateY(-50%);cursor:crosshair}.connector-end-handle-hit{fill:transparent;cursor:grab;pointer-events:all}.connector-end-handle-outer{fill:#3b82f6;pointer-events:none}.connector-end-handle-inner{fill:#fff;pointer-events:none}.sticky-text{width:100%;height:100%;box-sizing:border-box;padding:12px;line-height:1.35;overflow:hidden;color:#0f172a;-webkit-user-select:none;user-select:none;display:grid;place-items:center;text-align:center}.sticky-text-content{width:100%;display:block;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;text-align:center}.shape{--shape-base-shadow: var(--shadow-sm);position:absolute;border:1px solid #0f172a;background:transparent;cursor:move;transform-origin:center;box-shadow:var(--shape-base-shadow);z-index:2}.shape.selected{outline:calc(1px * var(--inv-zoom)) solid #2563eb;outline-offset:0;box-shadow:var(--shape-base-shadow)}.shape.circle{border-radius:50%;box-sizing:border-box}.shape.rectangle,.shape.rounded,.shape.circle{border-width:2px}.shape.sticky{--shape-base-shadow: 0 1px 2px rgba(15, 23, 42, .12), 0 8px 20px rgba(15, 23, 42, .16);padding:6px;border:0;border-radius:0}.shape.vector{--shape-base-shadow: none;border:0}.shape.vector.contour-by-path.selected{outline:none;box-shadow:none}.shape-svg{width:100%;height:100%;display:block}.shape-picker-overlay{position:absolute;left:calc(100% + 8px);top:0;width:140px;padding:4px;border-radius:8px;border:1px solid #dfe5ef;background:#fffffff7;box-shadow:0 10px 26px #0f172a1f;z-index:42}.sticky-picker-overlay{--sticky-cell: clamp(48px, 6.6vh, 66px);--sticky-gap: 9px;--sticky-pad: 8px;position:absolute;left:calc(100% + 8px);top:50%;transform:translateY(-50%);width:calc(var(--sticky-cell) * 2 + var(--sticky-gap) + var(--sticky-pad) * 2);padding:var(--sticky-pad);border-radius:14px;border:1px solid #dfe5ef;background:#fff;box-shadow:0 12px 30px #0f172a24;z-index:42}.sticky-picker-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sticky-gap)}.sticky-picker-btn{position:relative;width:var(--sticky-cell);height:var(--sticky-cell);border:2px solid rgba(15,23,42,.18);border-radius:2px;box-shadow:0 2px 8px #0f172a24;cursor:pointer;will-change:transform;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}.sticky-picker-btn:hover{transform:scale(1.06);box-shadow:0 6px 14px #0f172a29}.sticky-picker-btn.active{border-color:#2563eb;box-shadow:0 0 0 2px #2563eb38,0 6px 14px #0f172a29}.sticky-picker-btn.active:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:14px;height:8px;border-left:3px solid #0f172a;border-bottom:3px solid #0f172a;transform:translateY(-2px) rotate(-45deg);pointer-events:none}.shape-picker-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.shape-picker-btn{width:40px;height:40px;border:0;border-radius:4px;background:transparent;color:#111827;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}.shape-picker-btn:hover{background:#eef2f6}.shape-picker-btn.active{background:#dfe6ff;color:#1d4ed8}.shape-picker-btn svg{width:24px;height:24px}.shape.text{--shape-base-shadow: none;border:0;background:transparent}.canvas-text{width:100%;height:100%;box-sizing:border-box;padding:4px 6px;line-height:1.3;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;overflow:hidden;-webkit-user-select:none;user-select:none}.text-editor{width:100%;height:100%;box-sizing:border-box;padding:4px 6px;line-height:1.3;border:0;background:transparent;resize:none;outline:none;color:inherit;font:inherit;font-family:Sora,Segoe UI,Helvetica Neue,sans-serif;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;overflow:hidden}.shape.sticky textarea{width:100%;height:100%;box-sizing:border-box;padding:12px;line-height:1.35;border:0;background:transparent;resize:none;outline:none;color:#1f2937;font-family:Sora,Segoe UI,Helvetica Neue,sans-serif;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;overflow:hidden;-webkit-user-select:text;user-select:text;text-align:center}.canvas-floating-controls{position:absolute;left:16px;bottom:16px;transform:none;display:inline-flex;align-items:center;gap:1px;padding:4px;border-radius:8px;background:#fffffff5;border:1px solid #dfe5ef;box-shadow:0 10px 26px #0f172a1f;z-index:35}.floating-btn{border:0;border-radius:4px;width:40px;height:40px;padding:0;background:transparent;color:#0f172a;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1}.floating-btn svg{width:24px;height:24px;display:block}.floating-btn:hover{background:#eef2f6}.floating-btn.active{background:#e7edf6;color:#0f172a}.floating-btn.zoom svg{width:24px;height:24px}.floating-btn.icon svg{width:24px;height:24px}.floating-btn.icon.reset{display:inline-flex;align-items:center;justify-content:center}.floating-btn.icon.reset svg{width:24px;height:24px}.floating-zoom{min-width:66px;text-align:center;font-weight:700;color:#0f172a}.event-log{background:var(--bg-panel);padding:0;position:absolute;right:12px;top:12px;bottom:12px;width:300px;z-index:40;box-shadow:-10px 0 28px #0f172a1a;border-radius:8px;border:1px solid #dbe3f2;overflow:hidden;clip-path:inset(0 round 8px)}.event-log-scroll{height:100%;overflow:auto;padding:12px}.event-log h3{margin:0 0 10px;font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary)}.event-log ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}.event-log li{border:1px solid var(--line-soft);border-radius:var(--radius-sm);padding:8px;background:#fbfdff}.event-log li span{display:block;font-size:11px;color:var(--text-muted)}.event-log li p{margin:4px 0 0;font-size:13px}.event-log li.empty{color:var(--text-muted);text-align:center}@media (max-width: 1200px){.event-log{width:min(320px,70vw)}}@media (max-width: 980px){.app-shell{grid-template-columns:1fr;grid-template-rows:320px 1fr}.sidebar{height:100%;border-right:0;border-bottom:1px solid #11233e}.sidebar-resizer,.canvas-subtoolbar .hint{display:none}.canvas-toolbar,.canvas-subtoolbar{overflow-x:auto;white-space:nowrap}}.shape.rounded{border-radius:18px}.swatch.transparent{background-image:linear-gradient(45deg,#e2e8f0 25%,transparent 25%),linear-gradient(-45deg,#e2e8f0 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e2e8f0 75%),linear-gradient(-45deg,transparent 75%,#e2e8f0 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0px;border:1px solid #94a3b8}.context-menu{position:fixed;z-index:100;background:#fffffffa;color:#111827;padding:6px;border-radius:8px;border:1px solid #dfe5ef;display:grid;gap:4px;box-shadow:0 10px 26px #0f172a1f}.context-menu button{background:#fff;border:0;color:inherit;padding:9px 12px;text-align:left;border-radius:4px;font-weight:600;display:flex;align-items:center;justify-content:space-between;gap:20px;min-width:220px}.context-menu button:hover{background:#f3f4f6}.context-menu button:disabled{opacity:.5}.context-menu-shortcut{color:#64748b;font-weight:500;white-space:nowrap}.selection-layer{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:20}.selection-overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:auto;cursor:move}.marquee-box{position:absolute;border:1px solid rgba(47,91,255,.9);background:#2f5bff24;pointer-events:none;z-index:25}.marquee-preview-bounds{position:absolute;border:1px solid rgba(47,91,255,.95);background:transparent;pointer-events:none;z-index:26}.auth-shell.auth-shell-signin{background-image:url(/landing-bg.svg);background-repeat:no-repeat;background-size:cover;background-position:center top}