:root{--bg: #eef3f8;--surface: rgba(255,255,255,.82);--solid: #ffffff;--ink: #12243a;--muted: #65768b;--line: rgba(199, 214, 232, .86);--accent: #205da8;--accent-soft: #eaf3ff;--danger: #d94d4d;--shadow: 0 22px 68px rgba(24, 46, 80, .17);--shadow-soft: 0 10px 26px rgba(24, 46, 80, .1);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--ink);background:var(--bg)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;overflow:hidden}button,input,select{font:inherit}button{border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{opacity:.42;cursor:not-allowed}input,select{width:100%;border:1px solid var(--line);background:#fffffff2;color:var(--ink);border-radius:15px;padding:12px 13px;outline:none}input:focus,select:focus{border-color:#9dbde6;box-shadow:0 0 0 4px #275eaa1a}.hidden-file{display:none}.eyebrow{margin:0;text-transform:uppercase;letter-spacing:.13em;font-size:10px;font-weight:560;color:#7a8ba0}.lead{color:var(--muted);line-height:1.58;margin:10px 0 0}.subtle{color:var(--muted);font-size:12px}.divider{height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent);margin:18px 0}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:8px}.primary,.secondary,.danger{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:16px;padding:0 16px;font-weight:560;letter-spacing:-.01em}.primary{background:linear-gradient(135deg,#2f6fc4,#1a4f91);color:#fff;box-shadow:0 14px 30px #245dac40}.secondary{background:#f4f8fd;color:#244c81;border:1px solid #d9e6f5}.danger{background:#fff0f0;color:#b93737;border:1px solid #f1cccc}.login-shell{min-height:100%;display:grid;place-items:center;padding:22px;background:radial-gradient(circle at 15% 10%,rgba(63,124,213,.16),transparent 28%),radial-gradient(circle at 85% 88%,rgba(71,184,132,.12),transparent 30%),linear-gradient(135deg,#f9fcff,#edf3f9 62%,#e7eef7)}.login-panel.premium-login{width:min(430px,calc(100vw - 32px));padding:30px;border-radius:32px;background:#ffffffd6;border:1px solid rgba(204,218,235,.86);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.login-logo{width:58px;height:58px;border-radius:21px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#2d6bc0,#173f75);box-shadow:0 20px 34px #2352983b;margin-bottom:18px}.login-panel h1{margin:8px 0 0;font-size:38px;letter-spacing:-.06em;font-weight:620}.login-fields{display:grid;gap:9px;margin-top:22px}.login-fields label{font-size:12px;color:var(--muted)}.register-details{color:var(--muted);font-size:13px}.register-details summary{cursor:pointer;margin-bottom:12px}.register-details[open]{display:grid;gap:9px}.inspector-pills{margin-top:14px;display:flex;gap:7px;flex-wrap:wrap}.inspector-pills span,.inspector-pill{padding:5px 9px;border-radius:999px;color:#3c5a7e;background:#edf5ff;border:1px solid #d5e5f7;font-size:11px}.inspector-pill{cursor:pointer;font:inherit;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:transform .16s ease,border-color .16s ease,background .16s ease}.inspector-pill:hover{transform:translateY(-1px);background:#f7fbff;border-color:#bcd3ee}.app-shell{height:100%;position:relative;overflow:hidden;background:radial-gradient(circle at 0% 0%,rgba(76,135,220,.09),transparent 30%),linear-gradient(135deg,#f8fbff,#edf3f9 58%,#e8eff7)}.topbar.tablet-topbar{position:fixed;inset:0 0 auto 0;height:58px;z-index:48;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:8px 12px;border-bottom:1px solid rgba(198,214,233,.74);background:#ffffffbd;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}.compact-brand{display:flex;align-items:center;gap:10px;min-width:0}.brand-mini{width:36px;height:36px;border-radius:14px;display:grid;place-items:center;font-size:12px;font-weight:650;color:#fff;background:linear-gradient(135deg,#2d6bc0,#173f75);box-shadow:0 10px 24px #2352982e}.topbar h1{margin:1px 0 0;font-size:14px;letter-spacing:-.02em;font-weight:600;max-width:34vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-actions{display:flex;align-items:center;gap:7px}.top-button,.top-icon,.identity-chip,.page-mini{min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:14px;background:#ffffffd1;color:#39536f;border:1px solid rgba(204,218,235,.9);box-shadow:0 8px 20px #23406212;padding:0 11px;font-size:12px}.open-button{background:linear-gradient(135deg,#2d69ba,#174884);color:#fff;border-color:transparent;box-shadow:0 12px 25px #2863b438}.top-icon{width:38px;padding:0}.top-icon.active{background:#edf5ff;color:var(--accent);border-color:#bed5ef}.identity-chip{background:#edf5ff;color:#244f87}.page-mini{padding:0 5px;gap:2px}.page-mini button{width:29px;height:29px;border-radius:10px;display:grid;place-items:center;background:transparent;color:#4b627c}.page-mini span{min-width:56px;text-align:center}.workspace.drawing-workspace{position:absolute;top:58px;right:0;bottom:0;left:0;display:block}.page-stage{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto;padding:22px 22px 106px;display:grid;place-items:start center}.page-wrap{position:relative;background:#fff;border-radius:8px;overflow:hidden;touch-action:none;box-shadow:0 22px 65px #17284533;outline:1px solid rgba(30,45,70,.08)}.page-wrap canvas{position:absolute;top:0;right:0;bottom:0;left:0}.markup-layer{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;cursor:crosshair}.tool-select .markup-layer{cursor:default}.tool-pen .markup-layer,.tool-trace .markup-layer{cursor:crosshair}.highlight-stroke,.preview-highlight,.live-highlight{stroke-linecap:round;stroke-linejoin:round;opacity:.36;mix-blend-mode:normal;pointer-events:visibleStroke}.preview-highlight,.live-highlight{opacity:.36;pointer-events:none;filter:drop-shadow(0 0 .35px rgba(255,255,255,.28))}.highlighter-visual rect{filter:url(#wm-soft-edge)}.highlighter-hit-stroke{stroke:transparent;fill:none;stroke-linecap:round;stroke-linejoin:round;pointer-events:stroke}.selected-hairline{stroke:#1f66b4;opacity:.9;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;filter:drop-shadow(0 0 1.2px rgba(31,102,180,.3))}.pen-stroke,.live-pen{stroke-linecap:round;stroke-linejoin:round;opacity:.88;pointer-events:visibleStroke}.issue-stroke{stroke-linecap:round;stroke-linejoin:round;opacity:.95;pointer-events:visibleStroke}.selected-border{stroke:#1f66b4;opacity:.86;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;filter:drop-shadow(0 0 1.2px rgba(31,102,180,.24))}.selected-box{fill:none;stroke:#1f66b4;stroke-width:1.2;opacity:.78;pointer-events:none}.text-chip-bg{fill:#ffffffeb;stroke:#1f66b452;stroke-width:.7}.micro-tag rect{fill:#ffffffeb;stroke:#234c7c42;stroke-width:.55}.svg-tag{font-size:6.2px;font-weight:630;fill:#173450;letter-spacing:.02em;pointer-events:none}.svg-text{font-size:6.8px;fill:#16314f;font-weight:520;pointer-events:none}.line-comment rect{fill:#ffffffe6;stroke:#1f539442;stroke-width:.55;filter:drop-shadow(0 1px 2px rgba(18,45,80,.1))}.svg-line-comment{font-size:7px;fill:#173450;font-weight:560;letter-spacing:.005em;pointer-events:none}.anchor-dot{fill:#fff;stroke:#1f66b4;stroke-width:1.35;cursor:grab;filter:drop-shadow(0 1px 2px rgba(20,55,96,.25))}.anchor-dot:active{cursor:grabbing}.draft-anchor{fill:#fff;stroke:#1f66b4;stroke-width:1.15;opacity:.95;pointer-events:none}.empty-drawing-state{align-self:center;justify-self:center;max-width:430px;text-align:center;display:grid;place-items:center;gap:14px;padding:30px;border:1px dashed #c7d8ec;border-radius:30px;background:#ffffffa3;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.empty-icon{width:56px;height:56px;border-radius:21px;display:grid;place-items:center;color:#1f5da5;background:#edf5ff;border:1px solid #d5e5f7}.empty-drawing-state h2{margin:0;font-size:24px;letter-spacing:-.04em;font-weight:620}.empty-drawing-state p{margin:0;color:var(--muted);line-height:1.55}.tool-dock{position:fixed;left:50%;bottom:18px;transform:translate(-50%);z-index:42;display:flex;align-items:center;gap:10px;padding:8px;border-radius:24px;background:#ffffffd6;border:1px solid rgba(202,216,234,.88);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:var(--shadow)}.segmented{display:inline-flex;gap:4px;padding:4px;border-radius:18px;background:#e6eef8d1;border:1px solid rgba(204,218,235,.86)}.segmented button{display:inline-flex;align-items:center;gap:7px;min-height:40px;border-radius:14px;padding:0 12px;color:#4d6076;background:transparent;white-space:nowrap;transition:.18s ease}.segmented button span{font-size:13px}.segmented button.active{background:#fff;color:var(--accent);box-shadow:0 10px 24px #1c447824}.dock-actions{display:inline-flex;align-items:center;gap:5px;border-left:1px solid var(--line);padding-left:8px;color:var(--muted);font-size:12px}.dock-actions button{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:#ffffffc2;border:1px solid rgba(204,218,235,.9);color:#40536b}.dock-actions span{min-width:40px;text-align:center}.floating-palette{position:fixed;left:50%;bottom:84px;transform:translate(-50%);z-index:45;display:flex;gap:8px;padding:9px;border-radius:22px;background:#ffffffe0;border:1px solid rgba(202,216,234,.88);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);box-shadow:var(--shadow-soft);animation:paletteIn .18s ease both}@keyframes paletteIn{0%{opacity:0;transform:translate(-50%,6px)}to{opacity:1;transform:translate(-50%)}}.palette-dot{width:30px;height:30px;border-radius:999px;border:2px solid transparent;box-shadow:0 6px 14px #172d491f}.palette-dot.active{box-shadow:0 0 0 3px #1f66b433,0 8px 16px #172d4924}.layers-panel{position:fixed;right:13px;top:70px;bottom:64px;width:min(304px,calc(100vw - 26px));z-index:44;transform:translate(calc(100% + 22px));transition:transform .23s cubic-bezier(.2,.8,.2,1);border-radius:24px;background:#ffffffdb;border:1px solid rgba(204,218,235,.86);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);box-shadow:var(--shadow);padding:12px;display:flex;flex-direction:column;min-height:0}.layers-panel.open{transform:translate(0)}.layers-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:2px 2px 10px}.layers-head h2{margin:3px 0 0;font-size:17px;letter-spacing:-.03em;font-weight:620}.layers-head button{width:32px;height:32px;display:grid;place-items:center;border-radius:12px;background:#f4f8fd;border:1px solid #dce7f5;color:#40536b}.selected-layer-card{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px;margin-bottom:9px;border-radius:17px;background:#edf5ff;border:1px solid #cfe0f5}.selected-layer-card div:first-child{display:grid;gap:2px;min-width:0}.selected-layer-card b{font-size:13px}.selected-layer-card span{font-size:11px;color:#5b718b;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.selected-layer-actions{display:flex;gap:5px}.selected-layer-actions button{width:31px;height:31px;border-radius:11px;background:#fff;color:#245a9e;border:1px solid #cfdded}.selected-layer-actions .danger-icon{color:#bd3434;background:#fff4f4;border-color:#f1d0d0}.layer-list{display:grid;gap:6px;overflow:auto;padding-right:3px}.layer-row{display:grid;grid-template-columns:12px 1fr auto;align-items:center;gap:9px;text-align:left;padding:9px;border-radius:14px;background:#f7faffdb;border:1px solid #e1ebf6;color:var(--ink)}.layer-row.active{background:#edf5ff;border-color:#a9c8ee;box-shadow:0 8px 18px #1f559a1a}.layer-color{width:10px;height:24px;border-radius:999px;border:1px solid rgba(15,45,80,.08)}.layer-main{display:grid;gap:1px;min-width:0}.layer-main b{font-size:12px}.layer-main small{font-size:10.5px;color:var(--muted)}.layer-inspector{font-size:10.5px;color:#476482;padding:3px 6px;border-radius:999px;background:#eef5fd}.selection-popover{position:fixed;right:16px;bottom:96px;z-index:43;min-width:244px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 10px 10px 14px;border-radius:19px;background:#ffffffe0;border:1px solid rgba(204,218,235,.86);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.selection-popover div{display:grid;gap:2px}.selection-popover b{font-size:14px}.selection-popover span{font-size:11px;color:var(--muted)}.selection-popover button{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:#edf5ff;color:#1e5799;border:1px solid #cfe0f5}.selection-popover .delete-mini{background:#fff0f0;color:#bd3434;border-color:#f2caca}.draft-hint{position:fixed;left:50%;bottom:86px;transform:translate(-50%);z-index:43;display:flex;align-items:center;gap:8px;padding:8px 9px 8px 12px;border-radius:18px;background:#ffffffe6;border:1px solid var(--line);box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.draft-hint span{font-size:12px;color:var(--muted)}.draft-hint button{min-height:30px;border-radius:11px;padding:0 10px;background:#edf5ff;color:#245a9e;border:1px solid #cfe0f5;font-size:12px}.draft-hint button:last-child{background:#fff;color:#66768b}.status-strip{position:fixed;left:12px;bottom:12px;z-index:38;display:flex;gap:6px;align-items:center;pointer-events:none}.status-strip span{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border-radius:999px;background:#ffffffc7;border:1px solid rgba(204,218,235,.88);color:#51677f;font-size:11px;box-shadow:0 7px 18px #203a5b0f}.status-strip .online{background:#eefaf2;color:#247246;border-color:#caecd5}.status-strip .local{background:#fff8e9;color:#815a13;border-color:#f2deaa}.toast{position:fixed;left:50%;bottom:18px;transform:translate(-50%);z-index:100;background:#122236f0;color:#fff;border-radius:999px;padding:10px 15px;font-size:12px;box-shadow:0 18px 46px #00000038}@media(max-width:900px){.top-button span,.top-button:not(.open-button){display:none}.topbar h1{max-width:25vw}.tool-dock{max-width:calc(100vw - 22px);overflow-x:auto}.segmented button span{display:none}.segmented button{width:42px;justify-content:center;padding:0}.dock-actions span{min-width:38px;text-align:center}.page-stage{padding:15px 14px 102px}.selection-popover{left:14px;right:14px;bottom:92px;min-width:0}.status-strip span:nth-child(3){display:none}}.inspector-login .lead{font-size:14px}.generated-code-preview{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:8px;min-height:42px;padding:8px 11px;border-radius:15px;background:linear-gradient(135deg,#edf5fff2,#f7faffeb);border:1px solid #d5e5f7;color:#45617f}.generated-code-preview span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#7b8fa7}.generated-code-preview b{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:26px;border-radius:999px;background:#fff;color:#1f5da5;border:1px solid #c8def6;font-size:13px;letter-spacing:.03em}.generated-code-preview small{justify-self:end;color:#6a7d93;font-size:11px}.inspector-pills span,.inspector-pill{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media(max-width:520px){.generated-code-preview{grid-template-columns:1fr auto}.generated-code-preview small{grid-column:1 / -1;justify-self:start}}.topbar.tablet-topbar{transform:translateY(0);opacity:1;transition:transform .42s cubic-bezier(.2,.8,.2,1),opacity .32s ease,filter .32s ease;will-change:transform,opacity}.topbar.tablet-topbar.hidden{transform:translateY(-66px);opacity:0;pointer-events:none;filter:blur(2px)}.top-peek{position:fixed;top:8px;left:50%;transform:translate(-50%,-22px);z-index:52;width:82px;height:22px;border-radius:0 0 18px 18px;background:#ffffffdb;border:1px solid rgba(201,216,235,.92);border-top:0;box-shadow:0 12px 30px #1c345421;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);opacity:0;transition:transform .32s cubic-bezier(.2,.8,.2,1),opacity .25s ease}.top-peek span{display:block;width:34px;height:3px;margin:8px auto 0;border-radius:999px;background:linear-gradient(90deg,#25569a2e,#25569a8c,#25569a2e)}.workspace.drawing-workspace{top:0;right:0;bottom:0;left:0}.page-stage{padding-top:80px;transition:padding-top .32s ease}.tool-eraser .markup-layer{cursor:crosshair}.selection-box{fill:#2563b113;stroke:#1f66b4b8;stroke-width:1.1;stroke-dasharray:5 4;pointer-events:none;filter:drop-shadow(0 4px 12px rgba(31,102,180,.1))}.selection-popover.top-compact{top:72px;right:16px;bottom:auto;min-width:238px;max-width:min(390px,calc(100vw - 32px));padding:8px 8px 8px 12px;border-radius:17px;box-shadow:0 18px 50px #182e5024;transition:top .36s cubic-bezier(.2,.8,.2,1),transform .22s ease,opacity .22s ease,width .22s ease}.selection-popover.top-compact.header-hidden{top:8px}.selection-popover.top-compact.editing{min-width:min(390px,calc(100vw - 32px))}.selection-popover.top-compact b{font-size:13px;letter-spacing:-.01em}.selection-popover.top-compact span{font-size:10.8px}.selection-popover.top-compact button{width:31px;height:31px;border-radius:11px}.selection-info{min-width:0}.selection-info b,.selection-info span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.selection-actions{display:flex;align-items:center;gap:6px}.comment-editor{display:flex!important;align-items:center;gap:6px!important;min-width:210px}.comment-editor input{width:min(220px,40vw);height:31px;min-height:31px;padding:6px 9px;border-radius:11px;font-size:12px;box-shadow:none}.selection-popover .save-comment{width:auto;min-width:48px;padding:0 10px;font-size:11px;font-weight:560;background:linear-gradient(135deg,#2f6fc4,#1a4f91);color:#fff;border-color:transparent}.pin-recovery-details{margin-top:12px;border-top:1px solid rgba(204,218,235,.72);padding-top:12px}.pin-recovery-details small.subtle{display:block;line-height:1.45}.segmented button.active .lucide-eraser,.tool-dock .segmented button.active svg{transform:translateY(-.5px)}.layer-row.active .layer-main b{color:#1f5da5}@media(max-width:900px){.page-stage{padding-top:72px}.selection-popover.top-compact{left:auto;right:10px;top:70px;bottom:auto;transform:none;width:min(360px,calc(100vw - 20px))}.selection-popover.top-compact.header-hidden{top:8px}.comment-editor input{width:min(190px,42vw)}}:root{--glass: rgba(255,255,255,.58);--glass-strong: rgba(255,255,255,.68);--glass-line: rgba(210,224,240,.58);--glass-shadow: 0 18px 58px rgba(23,45,74,.13), inset 0 1px 0 rgba(255,255,255,.72);--glass-shadow-soft: 0 10px 30px rgba(23,45,74,.1), inset 0 1px 0 rgba(255,255,255,.68)}.topbar.tablet-topbar,.tool-dock,.layers-panel,.selection-popover,.floating-palette,.draft-hint,.empty-drawing-state,.toast,.status-chip{background:linear-gradient(135deg,#ffffffad,#f5faff75);border-color:var(--glass-line);-webkit-backdrop-filter:blur(22px) saturate(145%);backdrop-filter:blur(22px) saturate(145%);box-shadow:var(--glass-shadow)}.topbar.tablet-topbar{background:linear-gradient(180deg,#ffffffb8,#f4faff80);border-bottom-color:#d2e0f09e}.top-button,.top-icon,.identity-chip,.page-mini,.segmented,.segmented button.active,.dock-actions,.layers-head button,.selected-layer-card,.layer-row,.selection-popover button,.draft-hint button{background:#ffffff7a;border-color:#d0deee94;-webkit-backdrop-filter:blur(14px) saturate(138%);backdrop-filter:blur(14px) saturate(138%);box-shadow:inset 0 1px #ffffff9e,0 7px 20px #182e500f}.open-button,.selection-popover .save-comment,.primary{background:linear-gradient(135deg,#2f6fc4f0,#1a4f91f0);color:#fff;border-color:#ffffff2e}.top-peek{top:0;height:18px;width:92px;border-radius:0 0 18px 18px;background:linear-gradient(180deg,#ffffffb8,#f4faff80);border-color:#d2e0f0a8;border-top:0;-webkit-backdrop-filter:blur(22px) saturate(145%);backdrop-filter:blur(22px) saturate(145%);box-shadow:0 10px 30px #172d4a1f,inset 0 1px #ffffffb3;transform:translate(-50%,-20px)}.top-peek.visible{transform:translate(-50%);opacity:1}.top-peek span{width:31px;height:2.5px;margin-top:6px}.selection-popover.top-compact{right:12px;top:66px;min-width:0;width:auto;max-width:min(330px,calc(100vw - 24px));min-height:34px;padding:5px 6px 5px 9px;border-radius:16px;gap:7px;background:linear-gradient(135deg,#ffffff9e,#f4faff6b);border:1px solid rgba(210,224,240,.62);box-shadow:0 12px 38px #172d4a21,inset 0 1px #ffffffad}.selection-popover.top-compact.header-hidden{top:4px}.selection-popover.top-compact.editing{min-width:min(310px,calc(100vw - 24px));max-width:min(360px,calc(100vw - 24px));padding:6px}.selection-popover.top-compact .selection-info{display:grid;gap:0;max-width:190px}.selection-popover.top-compact b{font-size:11.8px;font-weight:620;letter-spacing:-.01em;line-height:1.12}.selection-popover.top-compact span{font-size:9.6px;line-height:1.12;opacity:.9}.selection-popover.top-compact .selection-actions{display:flex;gap:4px}.selection-popover.top-compact button{width:27px;height:27px;min-width:27px;border-radius:10px}.selection-popover.top-compact button svg{width:13px;height:13px}.selection-popover.top-compact .delete-mini{background:#ffeeee80;border-color:#f1c6c694;color:#b83a3a}.comment-editor{min-width:0;gap:5px!important}.comment-editor input{width:min(218px,42vw);height:28px;min-height:28px;padding:5px 8px;border-radius:10px;font-size:11px;background:#ffffff9e}.selection-popover .save-comment{height:28px;min-height:28px;min-width:43px;font-size:10.5px;border-radius:10px}.layers-panel{background:linear-gradient(135deg,#ffffff9e,#f4faff6b);border-color:#d2e0f09e}.layer-row{background:#ffffff5c;border-color:#d2e0f075}.layer-row.active{background:#e7f3ff94;border-color:#94beeeb8}.selected-layer-card{background:#e7f3ff94}.floating-palette{background:linear-gradient(135deg,#ffffff9e,#f4faff6b);border-color:#d2e0f09e}.tool-dock{background:linear-gradient(135deg,#ffffffa8,#f4faff70);border-color:#d2e0f09e}.status-strip{pointer-events:none}.status-chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(210,224,240,.62);color:#51677f;display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border-radius:999px;font-size:11px;pointer-events:auto;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease}.status-chip:hover{transform:translateY(-1px);border-color:#96b8e2c7}.status-chip.online{background:#edfaf294;color:#247246;border-color:#b4e8c69e}.status-chip.saved{background:#f0f7ff94;color:#335f93}.status-chip.warn{background:#fff8e99e;color:#815a13;border-color:#f2deaab3}.status-chip.error{background:#ffeeee9e;color:#b83a3a;border-color:#f1c6c6b3}.status-chip.local{background:#fff8e99e;color:#815a13;border-color:#f2deaab3}.status-chip.hash{background:#ffffff80}@media(max-width:900px){.selection-popover.top-compact{left:auto;right:8px;top:64px;width:auto;max-width:min(330px,calc(100vw - 16px))}.selection-popover.top-compact.header-hidden{top:4px}.selection-popover.top-compact .selection-info{max-width:160px}.comment-editor input{width:min(190px,42vw)}.top-peek{top:0}}:root{--font-ui: "Aptos", "Aptos Display", "Inter", "SF Pro Display", "Segoe UI Variable", "Segoe UI", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, sans-serif;--glass-lite: rgba(255, 255, 255, .4);--glass-lite-2: rgba(246, 251, 255, .3);--glass-control: rgba(255, 255, 255, .36);--glass-control-hover: rgba(255, 255, 255, .58);--glass-hairline: rgba(230, 240, 252, .56);--glass-hairline-strong: rgba(180, 207, 238, .48);--lux-shadow: 0 24px 70px rgba(16, 35, 62, .14), 0 8px 22px rgba(16, 35, 62, .07), inset 0 1px 0 rgba(255,255,255,.62);--lux-shadow-soft: 0 12px 36px rgba(16, 35, 62, .1), inset 0 1px 0 rgba(255,255,255,.54)}html,body,#root,button,input,select,textarea{font-family:var(--font-ui);font-optical-sizing:auto;text-rendering:geometricPrecision;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{letter-spacing:-.006em}.eyebrow{font-weight:520;letter-spacing:.155em}.login-panel.premium-login,.topbar.tablet-topbar,.tool-dock,.layers-panel,.selection-popover,.floating-palette,.draft-hint,.empty-drawing-state,.toast,.status-chip{background:linear-gradient(135deg,#ffffff75,#f5faff4a),radial-gradient(circle at 12% 8%,rgba(255,255,255,.44),transparent 38%);border-color:var(--glass-hairline);-webkit-backdrop-filter:blur(30px) saturate(168%);backdrop-filter:blur(30px) saturate(168%);box-shadow:var(--lux-shadow)}.topbar.tablet-topbar{background:linear-gradient(180deg,#ffffff80,#f4faff45),radial-gradient(circle at 20% 0%,rgba(255,255,255,.42),transparent 44%);border-bottom-color:#e2eefa85}.login-panel.premium-login{width:min(420px,calc(100vw - 34px));background:linear-gradient(135deg,#ffffff80,#f4faff4d),radial-gradient(circle at 0% 0%,rgba(255,255,255,.5),transparent 42%);box-shadow:0 30px 92px #122a4c29,inset 0 1px #ffffff9e}.login-panel h1{font-size:36px;font-weight:560;letter-spacing:-.055em}.login-panel .lead{font-size:13.2px;line-height:1.56}.brand-mini{width:34px;height:34px;border-radius:13px;font-weight:580;letter-spacing:.04em;background:linear-gradient(145deg,#2d6bc0eb,#123b6ff0),radial-gradient(circle at 24% 20%,rgba(255,255,255,.38),transparent 38%);box-shadow:0 14px 30px #15498d30,inset 0 1px #ffffff47}.topbar h1{font-weight:540;letter-spacing:-.026em}.top-button,.top-icon,.identity-chip,.page-mini,.page-mini button,.segmented,.segmented button,.segmented button.active,.dock-actions,.dock-actions button,.layers-head button,.selected-layer-card,.layer-row,.layer-inspector,.selected-layer-actions button,.selection-popover button,.draft-hint button,.palette-dot,.primary,.secondary,.danger,.inspector-pill,.status-chip,.generated-code-preview,.empty-icon{background:var(--glass-control);border-color:#dceaf88a;-webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%);box-shadow:inset 0 1px #ffffff8f,0 8px 24px #112a480f}.open-button,.primary,.selection-popover .save-comment{background:linear-gradient(135deg,#2f6fc4e6,#174884ed),radial-gradient(circle at 18% 12%,rgba(255,255,255,.28),transparent 42%);color:#fff;border-color:#ffffff38;box-shadow:0 16px 35px #1d549c33,inset 0 1px #ffffff47}.secondary{color:#22486f}.top-button,.top-icon,.identity-chip,.page-mini button,.segmented button,.dock-actions button,.layers-head button,.layer-row,.selected-layer-actions button,.selection-popover button,.draft-hint button,.palette-dot,.primary,.secondary,.danger,.inspector-pill,.status-chip,.empty-drawing-state .primary{transition:transform .22s cubic-bezier(.18,1.42,.34,1),box-shadow .22s ease,background .22s ease,border-color .22s ease,color .22s ease,opacity .18s ease;will-change:transform}@media(hover:hover)and (pointer:fine){.top-button:hover:not(:disabled),.top-icon:hover:not(:disabled),.identity-chip:hover,.page-mini button:hover:not(:disabled),.segmented button:hover:not(:disabled),.dock-actions button:hover:not(:disabled),.layers-head button:hover:not(:disabled),.layer-row:hover:not(:disabled),.selected-layer-actions button:hover:not(:disabled),.selection-popover button:hover:not(:disabled),.draft-hint button:hover:not(:disabled),.palette-dot:hover:not(:disabled),.primary:hover:not(:disabled),.secondary:hover:not(:disabled),.danger:hover:not(:disabled),.inspector-pill:hover:not(:disabled),.status-chip:hover:not(:disabled){transform:translateY(-1.5px) scale(1.018);background:var(--glass-control-hover);border-color:#a2c5e994;box-shadow:inset 0 1px #ffffffb8,0 13px 34px #112a481a}}.top-button:active:not(:disabled),.top-icon:active:not(:disabled),.identity-chip:active,.page-mini button:active:not(:disabled),.segmented button:active:not(:disabled),.dock-actions button:active:not(:disabled),.layers-head button:active:not(:disabled),.layer-row:active:not(:disabled),.selected-layer-actions button:active:not(:disabled),.selection-popover button:active:not(:disabled),.draft-hint button:active:not(:disabled),.palette-dot:active:not(:disabled),.primary:active:not(:disabled),.secondary:active:not(:disabled),.danger:active:not(:disabled),.inspector-pill:active:not(:disabled),.status-chip:active:not(:disabled){transform:translateY(.8px) scale(.955);transition-duration:78ms;box-shadow:inset 0 2px 8px #0c24421f,0 4px 12px #112a4814}.segmented{background:#e7f0fa66;padding:3px}.segmented button{color:#2b3d53d1;font-weight:500}.segmented button.active{background:#ffffff94;color:#19579b;box-shadow:inset 0 1px #ffffffb3,0 12px 28px #1347821f}.tool-dock{padding:7px;background:linear-gradient(135deg,#ffffff70,#f4faff47),radial-gradient(circle at 50% 0%,rgba(255,255,255,.42),transparent 45%);border-color:#e2eefa8a;box-shadow:0 22px 64px #0f223a26,inset 0 1px #ffffff9e}.floating-palette{padding:7px;gap:7px;background:linear-gradient(135deg,#ffffff6b,#f4faff47);box-shadow:var(--lux-shadow-soft)}.palette-dot{width:29px;height:29px;border-width:1.5px;box-shadow:inset 0 1px #ffffff94,0 9px 18px #132d481c}.layers-panel{right:12px;background:linear-gradient(135deg,#ffffff6b,#f4faff45),radial-gradient(circle at 18% 0%,rgba(255,255,255,.38),transparent 42%);border-color:#e2eefa8f}.layer-row{background:#ffffff4d;border-color:#e0ecf975}.layer-row.active{background:#e2f1ff80;border-color:#85b4e6a8;box-shadow:0 14px 36px #1f559a1a,inset 0 1px #ffffff9e}.layer-main b,.selected-layer-card b,.selection-popover.top-compact b{font-weight:560}.selection-popover.top-compact{min-height:32px;padding:4px 5px 4px 8px;border-radius:15px;background:linear-gradient(135deg,#fff6,#f4faff40),radial-gradient(circle at 0% 0%,rgba(255,255,255,.35),transparent 40%);border-color:#e2eefa8a;box-shadow:0 18px 52px #0f223a21,inset 0 1px #ffffff94}.selection-popover.top-compact .selection-info{max-width:174px}.selection-popover.top-compact b{font-size:11.2px;letter-spacing:-.006em}.selection-popover.top-compact span{font-size:9.2px;color:#485b70db}.selection-popover.top-compact button{width:25px;height:25px;min-width:25px;border-radius:9px}.selection-popover.top-compact button svg{width:12px;height:12px}.comment-editor input{background:#ffffff6b;border-color:#dae8f78f;font-size:10.8px}.top-peek{top:0!important;left:50%;height:17px;width:96px;border-radius:0 0 18px 18px;background:linear-gradient(180deg,#ffffff7a,#f4faff42);border-color:#e2eefa8f;border-top:0;box-shadow:0 12px 34px #0f223a1f,inset 0 1px #ffffff94;-webkit-backdrop-filter:blur(30px) saturate(165%);backdrop-filter:blur(30px) saturate(165%)}.top-peek.visible{transform:translate(-50%)!important}.top-peek span{background:linear-gradient(90deg,#20569c1f,#20569c80,#20569c1f)}.status-chip{background:#ffffff5c;font-weight:500}.status-chip.online{background:#e7faee6b}.status-chip.saved{background:#e9f4ff6b}.status-chip.warn,.status-chip.local{background:#fff8e875}.status-chip.error{background:#ffecec75}.status-chip.hash{background:#ffffff52}.toast{background:#0f1f33b8;border:1px solid rgba(255,255,255,.12);color:#fffffff0}.svg-tag,.svg-text,.svg-line-comment{font-family:var(--font-ui);font-weight:520}.login-db-status{margin-top:16px;min-height:34px;display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:14px;font-size:12px;line-height:1.35;color:#2f5f43;background:#e5f8ed8f;border:1px solid rgba(151,218,177,.62);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.login-db-status.warn{color:#835222;background:#fff1d6a3;border-color:#eebf6fa8}.login-help{margin:11px 0 0;color:#6a7b8f;font-size:11.5px;line-height:1.48}:root{--accent: #1e5fa8;--accent-deep: #174a87;--lux-ink: #142237;--lux-muted: #65788e}.login-shell{padding:18px;overflow:hidden}.login-panel.premium-login.split-auth-panel{width:min(430px,calc(100vw - 36px));max-height:min(760px,calc(100vh - 40px));overflow:hidden;padding:28px 30px 26px;border-radius:34px}.login-topline{display:flex;align-items:center;justify-content:space-between;gap:16px}.login-topline .login-logo{margin-bottom:16px}.auth-mode-chip{align-self:flex-start;display:inline-flex;align-items:center;height:31px;padding:0 12px;border-radius:999px;color:#255784;font-size:11px;font-weight:560;letter-spacing:.04em;background:#eff7ff8f;border:1px solid rgba(202,222,244,.62);box-shadow:inset 0 1px #ffffffb8,0 10px 28px #18365614;-webkit-backdrop-filter:blur(16px) saturate(145%);backdrop-filter:blur(16px) saturate(145%)}.login-panel.split-auth-panel h1{margin-top:6px}.login-panel.split-auth-panel .lead{min-height:42px;margin-top:9px}.login-db-status.compact{margin-top:14px;font-size:11.2px;padding:8px 10px;min-height:32px;max-height:52px;overflow:hidden}.auth-form{margin-top:18px;gap:8px}.auth-form label{margin-top:2px;font-size:11px;letter-spacing:.02em;color:#4f657feb}.auth-form input,.auth-form select{min-height:48px;border-radius:16px;background:#ffffffa3;border-color:#cddff2b3;box-shadow:inset 0 1px #ffffffb8,0 7px 22px #122d4b0a}.auth-submit{width:100%;margin-top:4px;min-height:48px;border-radius:17px;font-size:14px;font-weight:620}.auth-links{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px}.auth-links.single{justify-content:center}.auth-links button{color:#2c5d91;background:#ffffff57;border:1px solid rgba(212,229,247,.54);border-radius:999px;min-height:34px;padding:0 13px;font-size:12px;font-weight:500;box-shadow:inset 0 1px #fff9,0 8px 22px #122d4b0a;-webkit-backdrop-filter:blur(16px) saturate(145%);backdrop-filter:blur(16px) saturate(145%);transition:transform .22s cubic-bezier(.18,1.42,.34,1),box-shadow .22s ease,background .22s ease,border-color .22s ease,color .22s ease}.quick-inspectors{display:flex;gap:7px;flex-wrap:wrap;margin-top:7px;max-height:68px;overflow:hidden}.compact-code-preview{min-height:38px;grid-template-columns:1fr auto auto;background:#f1f8ff80}.compact-code-preview b{min-width:42px;height:25px}.compact-code-preview small{font-size:10.5px}.primary,.open-button,.selection-popover .save-comment,.empty-drawing-state .primary{color:#fff!important;background:linear-gradient(135deg,#2d6dc1f5,#154986fa),radial-gradient(circle at 18% 12%,rgba(255,255,255,.32),transparent 42%)!important;border-color:#ffffff3d!important;box-shadow:0 18px 40px #1e58a338,inset 0 1px #ffffff4d!important}@media(hover:hover)and (pointer:fine){.primary:hover:not(:disabled),.open-button:hover:not(:disabled),.selection-popover .save-comment:hover:not(:disabled),.empty-drawing-state .primary:hover:not(:disabled){color:#fff!important;background:linear-gradient(135deg,#3a7ed7fa,#19549afa),radial-gradient(circle at 18% 12%,rgba(255,255,255,.38),transparent 42%)!important;border-color:#ffffff52!important;box-shadow:0 22px 48px #1e58a34d,inset 0 1px #ffffff61!important}.secondary:hover:not(:disabled),.danger:hover:not(:disabled),.auth-links button:hover:not(:disabled){color:#1d4f84;background:#ffffffb8}}.primary:active:not(:disabled),.open-button:active:not(:disabled),.selection-popover .save-comment:active:not(:disabled){transform:translateY(.8px) scale(.97)!important}.selection-popover.top-compact{border-radius:18px;min-height:35px;padding:5px 6px 5px 10px}.comment-editor{gap:7px!important}.selection-popover .save-comment{min-width:76px!important;width:auto!important;padding:0 15px!important;height:32px!important;min-height:32px!important;border-radius:12px!important;font-size:11.5px!important;letter-spacing:-.01em}.comment-editor input{height:32px;min-height:32px;width:min(235px,41vw)}.micro-tag.inline-tag rect{fill:#ffffffb8;stroke:#1f53945c;stroke-width:.55;filter:drop-shadow(0 .6px 1.4px rgba(15,33,56,.13))}.micro-tag.inline-tag .svg-tag,.svg-tag{font-size:6.05px;font-weight:580;fill:#122e4eeb;letter-spacing:.015em}.highlighter-visual rect{opacity:1}.preview-highlight,.live-highlight{opacity:.34}@media(max-height:760px){.login-panel.premium-login.split-auth-panel{padding:22px 28px}.login-logo{width:50px;height:50px;border-radius:18px;margin-bottom:12px}.login-panel.split-auth-panel h1{font-size:32px}.login-panel.split-auth-panel .lead{min-height:34px;font-size:12.5px}.login-db-status.compact{margin-top:10px}.auth-form{margin-top:12px;gap:6px}.auth-form input,.auth-form select,.auth-submit{min-height:44px}}.micro-tag.inline-tag rect{fill:#ffffff59!important;stroke:none!important;stroke-width:0!important;filter:none!important}.micro-tag.inline-tag .svg-tag,.svg-tag{fill:#0e2a4694!important;font-weight:560!important}.status-strip{position:fixed;left:16px;bottom:16px;z-index:60;display:flex;align-items:center;gap:7px;pointer-events:auto!important;transform-origin:left bottom;transition:transform .34s cubic-bezier(.19,1,.22,1),opacity .24s ease}.status-strip .status-chip-row{display:flex;align-items:center;gap:7px;transform-origin:left center;transition:opacity .28s ease,transform .34s cubic-bezier(.19,1,.22,1),max-width .38s cubic-bezier(.19,1,.22,1),filter .28s ease;max-width:min(820px,calc(100vw - 86px));overflow:hidden}.status-strip.collapsed .status-chip-row{opacity:0;transform:translate(-8px) scaleX(.92);max-width:0;pointer-events:none;filter:blur(2px)}.status-strip.open .status-chip-row{opacity:1;transform:translate(0) scaleX(1);pointer-events:auto;filter:blur(0)}.status-peek-chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(210,224,240,.46);width:42px;height:34px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:3px;color:#48637f;cursor:pointer;background:linear-gradient(135deg,#ffffff70,#f2f8ff47);-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);box-shadow:0 9px 28px #162d4c1a,inset 0 1px #ffffff9e;transition:transform .22s cubic-bezier(.2,.95,.2,1.25),box-shadow .2s ease,background .2s ease,border-color .2s ease}.status-peek-chip span{font-size:9.5px;line-height:1;font-weight:620;letter-spacing:-.02em}.status-peek-chip:hover{transform:translateY(-2px) scale(1.035);border-color:#96b8e2ad;box-shadow:0 13px 32px #162d4c24,inset 0 1px #ffffffb8}.status-peek-chip:active{transform:translateY(0) scale(.965)}.status-peek-chip.online{color:#247246;background:linear-gradient(135deg,#e7faee85,#f5fff94d);border-color:#b1e5c28a}.status-peek-chip.warn,.status-peek-chip.local{color:#815a13;background:linear-gradient(135deg,#fff8e88f,#fffdf64d);border-color:#efdca98f}.status-peek-chip.error{color:#b83a3a;background:linear-gradient(135deg,#ffecec8f,#fff8f852);border-color:#f1c6c69e}.status-chip{background:linear-gradient(135deg,#ffffff75,#f4faff47)!important;-webkit-backdrop-filter:blur(20px) saturate(145%)!important;backdrop-filter:blur(20px) saturate(145%)!important;box-shadow:0 9px 26px #162d4c1a,inset 0 1px #ffffffa3!important}.status-chip:hover{transform:translateY(-2px) scale(1.018)!important;box-shadow:0 13px 34px #162d4c24,inset 0 1px #ffffffb8!important}.status-chip:active{transform:translateY(0) scale(.97)!important}@media(max-width:760px){.status-strip{left:10px;bottom:10px}.status-chip.hash{display:none}.status-strip .status-chip-row{max-width:calc(100vw - 64px)}}