:root{font-family:IBM Plex Sans,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;--font-display: "Archivo", "IBM Plex Sans", system-ui, sans-serif}:root,:root[data-theme=light]{--bg: #f6f5f1;--bg-2: #faf9f5;--panel: rgba(255, 255, 255, .86);--panel-solid: #ffffff;--border: #e4e2da;--text: #0e0f10;--muted: #6b6c70;--accent: #e85a2a;--accent-strong: #d24e20;--danger: #c13b2f;--app-bg: #edece6;--board-gradient: radial-gradient(circle at 50% 6%, #ffffff 0%, #faf9f5 38%, #f1efe9 72%, #eae8e1 100%);--btn-hover: #f0eee8;--accent-ink: #ffffff;--info-text: #1f6feb;--danger-text: #c13b2f;--danger-ink: #ffffff;--accent-rgb: 232, 90, 42;--vignette-corner: rgba(14, 15, 16, .08)}:root[data-theme=dark]{--bg: #0b1220;--bg-2: #0f172a;--panel: rgba(17, 25, 40, .82);--panel-solid: #111827;--border: rgba(148, 163, 184, .18);--text: #e2e8f0;--muted: #94a3b8;--accent: #38bdf8;--accent-strong: #0ea5e9;--danger: #f87171;--app-bg: #05080f;--board-gradient: radial-gradient(circle at 50% 6%, #16263f 0%, #0e1a2e 38%, #0a121f 72%, #05080f 100%);--btn-hover: #161f33;--accent-ink: #04121f;--info-text: #bae6fd;--danger-text: #fca5a5;--danger-ink: #1a0a0a;--accent-rgb: 56, 189, 248;--vignette-corner: rgba(0, 0, 0, .66)}*{box-sizing:border-box}html,body,#app{margin:0;height:100%;width:100%}body{background:var(--app-bg);color:var(--text);overflow:hidden}button{font:inherit;cursor:pointer}.btn{background:var(--panel-solid);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:7px 12px;font-size:13px;font-weight:500;transition:background .12s,border-color .12s,transform .05s}.btn:hover{border-color:#94a3b866;background:var(--btn-hover)}.btn:active{transform:translateY(1px)}.btn--accent{background:var(--accent-strong);border-color:var(--accent-strong);color:var(--accent-ink);font-weight:600}.btn--accent:hover{background:var(--accent);border-color:var(--accent)}.btn--danger{color:var(--danger)}.btn[disabled]{opacity:.35;pointer-events:none}.btn--icon{padding:6px 11px;font-size:16px;line-height:1}.btn--icon svg{display:block}.topbar__group{display:flex;gap:4px}.editor{position:absolute;inset:0;overflow:hidden;background:var(--board-gradient)}.editor__canvas{position:absolute;inset:0;touch-action:none;user-select:none;background:transparent}.editor__canvas canvas{display:block}.tabletop-vignette{position:absolute;inset:0;pointer-events:none;z-index:5;background:radial-gradient(circle at 50% 24%,rgba(var(--accent-rgb),.12),transparent 44%),radial-gradient(circle at 50% 58%,rgba(var(--accent-rgb),.06),transparent 50%),radial-gradient(ellipse at 50% 52%,transparent 54%,var(--vignette-corner) 100%)}.topbar{position:absolute;top:12px;left:12px;right:12px;height:44px;display:flex;align-items:center;gap:10px;z-index:20}.topbar__menu{flex-shrink:0;transition:opacity .15s ease,visibility .15s ease}.editor--drawer-open .topbar__menu{visibility:hidden;opacity:0;pointer-events:none}.topbar__slide{flex:1;min-width:0;display:flex;align-items:center;gap:10px;transition:transform .22s ease}.editor--drawer-open .topbar__slide{transform:translate(var(--drawer-w, 280px))}.topbar__spacer{flex:1}.topbar__name{background:transparent;border:1px solid transparent;color:var(--text);font-size:14px;font-weight:600;padding:6px 10px;border-radius:8px;width:220px}.topbar__name:hover{border-color:var(--border)}.topbar__name:focus{outline:none;border-color:var(--accent);background:var(--bg-2)}.banner{position:absolute;top:64px;left:50%;transform:translate(-50%);background:rgba(var(--accent-rgb),.16);border:1px solid rgba(var(--accent-rgb),.4);color:var(--info-text);padding:7px 14px;border-radius:999px;font-size:12.5px;z-index:10}.toolbar{position:absolute;left:12px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:6px;padding:8px;background:var(--panel);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:14px;z-index:10;transition:transform .22s ease}.editor--drawer-open .toolbar{transform:translate(var(--drawer-w, 280px),-50%)}.toolbar__sep{height:1px;background:var(--border);margin:2px 4px}.tool{position:relative;width:38px;height:38px;display:grid;place-items:center;border-radius:10px;border:1px solid transparent;background:transparent;color:var(--muted)}.tool svg{display:block}.tool__kbd{position:absolute;right:3px;bottom:1px;font-size:9px;font-weight:700;line-height:1;color:var(--muted);opacity:.7;pointer-events:none}.tool:hover .tool__kbd,.tool.is-active .tool__kbd{opacity:1}.tool.is-active .tool__kbd{color:var(--accent)}.tool:hover{background:var(--btn-hover);color:var(--text)}.tool.is-active{background:rgba(var(--accent-rgb),.16);border-color:rgba(var(--accent-rgb),.5);color:var(--accent)}.recenter-btn{position:absolute;top:64px;left:50%;display:flex;align-items:center;gap:7px;padding:8px 16px;background:var(--accent-strong);border:1px solid var(--accent-strong);color:var(--accent-ink);font-size:13px;font-weight:600;border-radius:999px;box-shadow:0 8px 24px #020c1880;z-index:15;opacity:0;pointer-events:none;transform:translate(-50%) translateY(-8px);transition:opacity .18s ease,transform .18s ease,background .12s,border-color .12s}.recenter-btn.is-visible{opacity:1;pointer-events:auto;transform:translate(-50%) translateY(0)}.recenter-btn:hover{background:var(--accent);border-color:var(--accent)}.recenter-btn:active{transform:translate(-50%) translateY(1px)}.recenter-btn svg{display:block}.zoombar{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:6px;padding:6px;background:var(--panel);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:10px;z-index:10;transition:transform .22s ease}.editor--drawer-open .zoombar{transform:translate(var(--drawer-w, 280px))}.zoombar__label{min-width:48px;text-align:center;font-size:12.5px;color:var(--muted)}.zoombar__sep{width:1px;align-self:stretch;margin:2px;background:var(--border)}.controls-help{position:fixed;inset:0;z-index:60;display:none;align-items:center;justify-content:center;padding:24px;background:#02061794;backdrop-filter:blur(3px)}.controls-help.is-open{display:flex}.controls-help__card{width:min(440px,100%);max-height:100%;overflow-y:auto;padding:18px 20px 20px;background:var(--panel-solid, #0d1626);border:1px solid var(--border);border-radius:16px;box-shadow:0 30px 80px #02061799}.controls-help__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.controls-help__head h2{margin:0;font-size:16px;letter-spacing:-.02em}.controls-help__close{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--border);border-radius:8px;background:transparent;color:var(--muted);cursor:pointer}.controls-help__close:hover{color:var(--text);border-color:#94a3b866}.controls-help__rows{display:flex;flex-direction:column;gap:2px}.controls-help__row{display:grid;grid-template-columns:1fr 1.3fr;gap:12px;align-items:baseline;padding:7px 4px;border-bottom:1px solid rgba(148,163,184,.08)}.controls-help__action{font-size:13px;font-weight:600;color:var(--text)}.controls-help__how{font-size:12px;color:var(--muted);line-height:1.45}.controls-help__toggle{display:flex;align-items:flex-start;gap:10px;margin-top:16px;padding:12px;border:1px solid var(--border);border-radius:10px;background:rgba(var(--accent-rgb),.06);cursor:pointer}.controls-help__check{margin-top:2px;width:16px;height:16px;accent-color:var(--accent);cursor:pointer}.controls-help__toggle span{display:block;font-size:13px}.controls-help__toggle-sub{margin-top:2px;font-size:11.5px;color:var(--muted)}.confirm-dialog{position:fixed;inset:0;z-index:1100;display:none;align-items:center;justify-content:center;padding:24px;background:#02061794;backdrop-filter:blur(3px)}.confirm-dialog.is-open{display:flex}.confirm-dialog__card{width:min(380px,100%);padding:20px 22px 18px;background:var(--panel-solid, #0d1626);border:1px solid var(--border);border-radius:16px;box-shadow:0 30px 80px #02061799}.confirm-dialog__title{margin:0 0 8px;font-size:16px;letter-spacing:-.02em}.confirm-dialog__message{margin:0 0 18px;font-size:13px;line-height:1.5;color:var(--muted)}.confirm-dialog__actions{display:flex;justify-content:flex-end;gap:8px}.confirm-dialog__btn{padding:8px 14px;font-size:13px;font-weight:600;border-radius:9px;border:1px solid var(--border);background:transparent;color:var(--text);cursor:pointer}.confirm-dialog__btn--ghost{color:var(--muted)}.confirm-dialog__btn--ghost:hover{color:var(--text);border-color:#94a3b866}.confirm-dialog__btn--danger{background:var(--danger);border-color:var(--danger);color:var(--danger-ink)}.confirm-dialog__btn--danger:hover{filter:brightness(1.08)}.confirm-dialog__btn--primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.confirm-dialog__btn--primary:hover{filter:brightness(1.08)}.confirm-dialog__btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.style-panel{position:absolute;bottom:12px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:14px;padding:8px 14px;background:var(--panel);backdrop-filter:blur(12px);border:1px solid var(--border);border-radius:12px;z-index:10;transition:transform .22s ease}.editor--drawer-open .style-panel{transform:translate(calc(-50% + var(--drawer-w, 280px)))}.field{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--muted)}.swatch-wrap{position:relative;display:inline-flex}.swatch{width:30px;height:26px;padding:0;border:1px solid var(--border);border-radius:7px;cursor:pointer}.swatch.is-open{border-color:var(--accent);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.25)}.swatch--none{background-color:var(--panel-solid);background-image:linear-gradient(to top right,transparent calc(50% - 1.2px),var(--danger) calc(50% - 1.2px),var(--danger) calc(50% + 1.2px),transparent calc(50% + 1.2px))}.size-picker{display:inline-flex;gap:3px}.size-btn{min-width:30px;height:26px;padding:0 7px;font-size:11.5px;font-weight:600;color:var(--muted);background:var(--panel-solid);border:1px solid var(--border);border-radius:7px;cursor:pointer}.size-btn:hover{color:var(--text);border-color:var(--accent)}.size-btn.is-active{color:var(--text);border-color:var(--accent);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.25)}.swatch-pop{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:10px;background:var(--panel-solid);border:1px solid var(--border);border-radius:10px;box-shadow:0 12px 32px #00000073;z-index:20}.swatch-pop--portal{position:fixed;bottom:auto;transform:none;z-index:1000}.swatch-pop__chip{width:26px;height:26px;padding:0;border:1px solid var(--border);border-radius:6px;cursor:pointer;transition:transform .08s ease,box-shadow .08s ease}.swatch-pop__chip:hover{transform:scale(1.12)}.swatch-pop__chip.is-active{box-shadow:0 0 0 2px var(--panel-solid),0 0 0 4px var(--accent)}.text-editor{position:absolute;z-index:50;display:flex;align-items:center;justify-content:center;text-align:center;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;padding:4px 6px;border-radius:8px;border:2px solid var(--accent);box-shadow:0 8px 24px #0006;caret-color:var(--accent);line-height:1.25;white-space:pre-wrap;word-break:break-word;overflow:hidden;outline:none}.icon-palette{position:absolute;z-index:60;top:50%;left:76px;transform:translateY(-50%);width:300px;background:var(--panel-solid);border:1px solid var(--border);border-radius:12px;box-shadow:0 20px 50px #0000008c;overflow:hidden}.icon-palette__input{width:100%;border:none;border-bottom:1px solid var(--border);background:transparent;color:var(--text);font-size:15px;padding:12px 14px;outline:none}.icon-palette__list{max-height:360px;overflow-y:auto}.icon-row{display:flex;align-items:center;gap:10px;padding:7px 12px;font-size:13px;cursor:pointer}.icon-row__preview{flex:0 0 auto;border-radius:6px;background:#ffffff0a}.icon-row__key{flex:1;font-weight:600;text-transform:capitalize}.icon-row__kw{color:var(--muted);font-size:11.5px;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%}.icon-row.is-active{background:rgba(var(--accent-rgb),.16)}.icon-row--empty{color:var(--muted);justify-content:center;cursor:default}.icon-palette__hint{padding:8px 14px;font-size:11px;color:var(--muted);border-top:1px solid var(--border)}.ai-panel-backdrop{position:absolute;inset:0;z-index:80;display:grid;place-items:center;padding:20px;background:#0206176b;backdrop-filter:blur(2px)}.ai-panel{width:min(560px,100%);background:var(--panel-solid);border:1px solid var(--border);border-radius:14px;box-shadow:0 24px 70px #0009;overflow:hidden}.ai-panel__header{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:16px 18px 14px;border-bottom:1px solid var(--border)}.ai-panel__header h2{margin:0;font-size:16px}.ai-panel__header p{margin:5px 0 0;color:var(--muted);font-size:12.5px;line-height:1.4}.ai-panel__close{flex:0 0 auto;width:28px;height:28px;border:1px solid var(--border);border-radius:7px;background:transparent;color:var(--muted)}.ai-panel__close:hover{color:var(--text);border-color:#94a3b866;background:var(--btn-hover)}.ai-panel__form{display:grid;gap:13px;padding:16px 18px 18px}.ai-panel__modes{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;background:var(--bg-2);border:1px solid var(--border);border-radius:10px}.ai-panel__mode{min-height:31px;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--muted);font-size:12.5px;font-weight:600}.ai-panel__mode:hover:not(:disabled){color:var(--text);background:var(--btn-hover)}.ai-panel__mode.is-active{color:var(--accent);border-color:rgba(var(--accent-rgb),.45);background:rgba(var(--accent-rgb),.14)}.ai-panel__mode:disabled{opacity:.4;cursor:default}.ai-panel__field{display:grid;gap:7px;color:var(--muted);font-size:12.5px}.ai-panel__input,.ai-panel__textarea{width:100%;border:1px solid var(--border);border-radius:9px;background:var(--bg-2);color:var(--text);font:inherit;font-size:13px;outline:none}.ai-panel__input{padding:9px 11px}.ai-panel__textarea{min-height:118px;padding:10px 11px;line-height:1.45;resize:vertical}.ai-panel__input:focus,.ai-panel__textarea:focus{border-color:var(--accent);box-shadow:0 0 0 2px rgba(var(--accent-rgb),.2)}.ai-panel__input:disabled,.ai-panel__textarea:disabled{opacity:.65}.ai-panel__error{display:none;color:var(--danger-text);background:#f871711f;border:1px solid rgba(248,113,113,.28);border-radius:9px;padding:8px 10px;font-size:12.5px;line-height:1.4}.ai-panel__error.is-visible{display:block}.ai-panel__footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:2px}.ai-panel__hint{color:var(--muted);font-size:11px}.ctx-menu{position:absolute;z-index:70;min-width:184px;padding:5px;background:var(--panel-solid);border:1px solid var(--border);border-radius:10px;box-shadow:0 20px 50px #0000008c}.ctx-menu__item{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:7px 10px;border:none;border-radius:6px;background:transparent;color:var(--text);font-size:13px;text-align:left}.ctx-menu__item:hover:not(:disabled){background:rgba(var(--accent-rgb),.16)}.ctx-menu__item:disabled{color:var(--muted);cursor:default}.ctx-menu__hint{color:var(--muted);font-size:11.5px;font-variant-numeric:tabular-nums}.board-drawer__backdrop{position:absolute;inset:0;z-index:25;background:#02061773;opacity:0;pointer-events:none;transition:opacity .22s ease}.board-drawer__backdrop.is-visible{opacity:1;pointer-events:auto}.board-drawer{position:absolute;top:0;left:0;bottom:0;z-index:26;display:flex;flex-direction:column;gap:12px;padding:16px 14px 20px;background:#0b1220f5;border-right:1px solid var(--border);backdrop-filter:blur(16px);transform:translate(-100%);transition:transform .22s ease;overflow:hidden}.board-drawer.is-open{transform:translate(0)}.board-drawer__header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 2px}.board-drawer__header h2{margin:0;font-size:16px;letter-spacing:-.02em}.board-drawer__close{width:32px;height:32px;border:1px solid var(--border);border-radius:8px;background:transparent;color:var(--muted);font-size:20px;line-height:1}.board-drawer__close:hover{color:var(--text);border-color:#94a3b866}.board-drawer__new{width:100%}.board-drawer__list{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.board-drawer__empty{margin:24px 0 0;text-align:center;color:var(--muted);font-size:13px}.board-drawer__item{position:relative;display:flex;align-items:center;gap:10px;width:100%;padding:8px;border:1px solid var(--border);border-radius:12px;background:var(--panel-solid);color:var(--text);text-align:left;cursor:pointer;transition:border-color .12s,background .12s}.board-drawer__item:hover{border-color:rgba(var(--accent-rgb),.45);background:var(--btn-hover)}.board-drawer__item[aria-current=true]{border-color:rgba(var(--accent-rgb),.65);background:rgba(var(--accent-rgb),.1)}.board-drawer__thumb{width:52px;height:34px;border-radius:6px;object-fit:cover;flex-shrink:0;background:var(--bg)}.board-drawer__thumb--empty{display:grid;place-items:center;font-size:18px;color:#94a3b873}.board-drawer__meta{min-width:0;flex:1}.board-drawer__name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.board-drawer__sub{margin-top:2px;font-size:11px;color:var(--muted)}.board-drawer__delete{position:absolute;top:6px;right:6px;width:26px;height:26px;border:none;border-radius:6px;background:#020617a6;color:var(--danger-text);font-size:12px;opacity:0;transition:opacity .1s}.board-drawer__item:hover .board-drawer__delete,.board-drawer__item:focus-within .board-drawer__delete{opacity:1}.board-drawer__delete:hover{background:#020617e6}.layers-panel{position:absolute;top:64px;right:12px;bottom:12px;width:244px;z-index:12;display:flex;flex-direction:column;gap:10px;padding:12px 12px 14px;background:var(--panel);border:1px solid var(--border);border-radius:14px;backdrop-filter:blur(16px);box-shadow:0 18px 50px #02061780;transform:translate(0);opacity:1;transition:transform .22s ease,opacity .22s ease}.layers-panel.is-collapsed{transform:translate(calc(100% + 16px));opacity:0;pointer-events:none}.layers-panel__header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 2px}.layers-panel__header h2{margin:0;font-size:15px;letter-spacing:-.02em}.layers-panel__header-actions{display:flex;align-items:center;gap:6px}.layers-panel__collapse{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--border);border-radius:8px;background:transparent;color:var(--muted)}.layers-panel__collapse:hover{color:var(--text);border-color:#94a3b866}.layers-panel__add{width:30px;height:30px;display:grid;place-items:center;border:1px solid var(--border);border-radius:8px;background:transparent;color:var(--accent)}.layers-panel__add:hover{background:rgba(var(--accent-rgb),.16);border-color:rgba(var(--accent-rgb),.4)}.layers-panel__list{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:6px}.layers-panel__item{display:flex;flex-direction:column;gap:4px;padding:6px 8px;border:1px solid var(--border);border-radius:10px;background:var(--panel-solid);color:var(--text);text-align:left;cursor:pointer;transition:border-color .12s,background .12s,box-shadow .12s}.layers-panel__top,.layers-panel__bottom{display:flex;align-items:center;gap:6px}.layers-panel__item:hover{border-color:rgba(var(--accent-rgb),.4);background:var(--btn-hover)}.layers-panel__item[aria-current=true]{border-color:var(--accent);background:rgba(var(--accent-rgb),.1);box-shadow:0 0 0 1px rgba(var(--accent-rgb),.5),0 0 22px rgba(var(--accent-rgb),.22) inset}.layers-panel__item.is-hidden{background:#02061766}.layers-panel__item.is-hidden .layers-panel__name,.layers-panel__item.is-hidden .layers-panel__sub{opacity:.5}.layers-panel__eye{flex:0 0 auto;width:30px;height:30px;display:grid;place-items:center;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--accent)}.layers-panel__eye:hover{background:rgba(var(--accent-rgb),.16);border-color:rgba(var(--accent-rgb),.4)}.layers-panel__item.is-hidden .layers-panel__eye{color:var(--muted)}.layers-panel__solo{flex:0 0 auto;width:26px;height:26px;display:grid;place-items:center;border:1px solid transparent;border-radius:8px;background:transparent;color:var(--muted);transition:color .12s,background .12s,border-color .12s}.layers-panel__solo:hover:not(:disabled){color:var(--text);background:rgba(var(--accent-rgb),.16);border-color:rgba(var(--accent-rgb),.4)}.layers-panel__solo[aria-pressed=true]{color:var(--accent);background:rgba(var(--accent-rgb),.16);border-color:rgba(var(--accent-rgb),.5)}.layers-panel__solo:disabled{opacity:.3;pointer-events:none}.layers-panel__color{flex:0 0 auto}.layers-panel__color .swatch{width:18px;height:18px;border-radius:50%;box-shadow:0 0 7px rgba(var(--accent-rgb),.25)}.layers-panel__item.is-hidden .layers-panel__color{opacity:.5}.layers-panel__name{flex:1;min-width:0;font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layers-panel__sub{flex:1;min-width:0;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layers-panel__actions{display:flex;gap:2px;flex:0 0 auto;opacity:0;transition:opacity .1s}.layers-panel__item:hover .layers-panel__actions,.layers-panel__item:focus-within .layers-panel__actions,.layers-panel__item[aria-current=true] .layers-panel__actions{opacity:1}.layers-panel__action{width:26px;height:26px;border:none;border-radius:6px;background:#0206178c;color:var(--muted);font-size:12px;line-height:1}.layers-panel__action:hover:not(:disabled){color:var(--text);background:rgba(var(--accent-rgb),.18)}.layers-panel__action:disabled{opacity:.3;pointer-events:none}.layers-panel__action--danger:hover:not(:disabled){color:var(--danger-text);background:#f8717129}.layers-panel__spread{display:flex;flex-direction:column;gap:7px;padding:10px 2px 2px;border-top:1px solid var(--border)}.layers-panel__spread>span{font-size:11.5px;color:var(--muted)}.layers-panel__spread-range{width:100%;accent-color:var(--accent);cursor:pointer}.layers-panel__spread.is-disabled{opacity:.4}.layers-panel__spread.is-disabled .layers-panel__spread-range{cursor:default}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,12px);background:var(--panel-solid);border:1px solid var(--border);color:var(--text);padding:10px 16px;border-radius:10px;font-size:13px;box-shadow:0 12px 30px #00000080;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s;z-index:100}.toast.is-visible{opacity:1;transform:translate(-50%)}@media(max-width:700px),(max-height:560px){.btn{min-height:40px;padding:7px 10px}.btn--icon{min-width:40px;padding:8px 10px}.topbar{top:max(8px,env(safe-area-inset-top));left:8px;right:8px;height:42px;gap:6px}.topbar__slide{gap:6px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}.topbar__slide::-webkit-scrollbar{display:none}.topbar__slide>*{flex:0 0 auto}.topbar__group{gap:3px}.topbar__spacer{display:none}.topbar__name{width:clamp(112px,34vw,160px);padding:7px 8px}.topbar__slide a[href*=github]{display:none}.banner,.recenter-btn{top:calc(max(8px,env(safe-area-inset-top)) + 98px);max-width:calc(100vw - 24px);white-space:normal;text-align:center}.toolbar{left:50%;top:auto;bottom:calc(10px + env(safe-area-inset-bottom));max-width:calc(100vw - 20px);flex-direction:row;gap:4px;padding:6px;overflow-x:auto;overscroll-behavior-x:contain;border-radius:16px;transform:translate(-50%);scrollbar-width:none;-webkit-overflow-scrolling:touch}.toolbar::-webkit-scrollbar{display:none}.editor--drawer-open .toolbar{transform:translate(-50%)}.toolbar__sep{width:1px;height:auto;margin:4px 2px}.tool{flex:0 0 auto;width:40px;height:40px}.tool__kbd{display:none}.zoombar{left:8px;right:auto;top:calc(max(8px,env(safe-area-inset-top)) + 50px);bottom:auto;width:auto;max-width:max-content;padding:5px}.editor--drawer-open .zoombar{transform:none}.zoombar__label,.zoombar__sep,.zoombar .btn[title="Zoom out"],.zoombar .btn[title="Zoom in"]{display:none}.style-panel{left:8px;right:8px;bottom:calc(66px + env(safe-area-inset-bottom));transform:none;justify-content:center;gap:8px;padding:7px 8px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.style-panel::-webkit-scrollbar{display:none}.editor--drawer-open .style-panel{transform:none}.field{flex:0 0 auto}.size-btn{min-width:28px;height:28px;padding:0 6px}.icon-palette{left:10px;right:10px;top:auto;bottom:calc(66px + env(safe-area-inset-bottom));width:auto;max-height:min(58vh,380px);transform:none}.icon-palette__list{max-height:min(42vh,280px)}.ai-panel-backdrop,.controls-help,.confirm-dialog{align-items:flex-end;padding:max(10px,env(safe-area-inset-top)) 10px calc(10px + env(safe-area-inset-bottom))}.ai-panel,.controls-help__card,.confirm-dialog__card{width:100%;max-height:calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;border-radius:16px}.ai-panel__header,.ai-panel__form{padding-left:14px;padding-right:14px}.ai-panel__footer{align-items:stretch;flex-direction:column}.ai-panel__hint{order:2;text-align:center}.ai-panel__footer .btn{width:100%}.controls-help__row{grid-template-columns:1fr;gap:3px}.confirm-dialog__actions{flex-direction:column-reverse}.confirm-dialog__btn{width:100%;min-height:40px}.board-drawer{width:min(86vw,320px)!important;padding-top:max(14px,env(safe-area-inset-top));padding-bottom:calc(16px + env(safe-area-inset-bottom))}.editor--drawer-open .topbar__slide{transform:none}.layers-panel{top:auto;left:10px;right:10px;bottom:calc(116px + env(safe-area-inset-bottom));width:auto;max-height:min(44vh,320px);padding:10px;z-index:30;transform:translateY(0)}.layers-panel.is-collapsed{transform:translateY(calc(100% + 90px))}.layers-panel__item{padding:8px}.layers-panel__actions{opacity:1}.toast{left:10px;right:10px;bottom:calc(116px + env(safe-area-inset-bottom));transform:translateY(12px);text-align:center}.toast.is-visible{transform:translateY(0)}}@media(max-width:390px){.topbar__name{width:104px}.topbar__group{display:none}.style-panel{bottom:calc(62px + env(safe-area-inset-bottom))}}.auth-gate{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;background:radial-gradient(1200px 600px at 50% -10%,var(--bg-2),var(--app-bg) 70%)}.auth-card{width:min(360px,calc(100vw - 32px));display:flex;flex-direction:column;gap:12px;padding:28px 26px;background:var(--panel-solid);border:1px solid var(--border);border-radius:16px;box-shadow:0 24px 60px #00000080}.auth-title{margin:0;font-family:var(--font-display);font-size:24px;font-weight:700;letter-spacing:-.01em}.auth-sub{margin:0 0 8px;color:var(--muted);font-size:13px}.auth-label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--muted)}.auth-input{padding:10px 12px;background:var(--bg-2);border:1px solid var(--border);border-radius:10px;color:var(--text);font-size:14px}.auth-input:focus{outline:none;border-color:var(--accent)}.auth-submit{margin-top:6px;padding:10px;font-size:14px;cursor:pointer}.auth-error{margin:0;color:var(--danger);font-size:13px}.topbar--viewer{gap:8px;padding:0 2px}.viewer__name{font-family:var(--font-display);font-weight:600;font-size:15px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45vw;padding-left:4px}.viewer__badge{font-size:11px;font-weight:600;letter-spacing:.02em;color:var(--muted);background:var(--panel);border:1px solid var(--border);padding:4px 9px;border-radius:999px;white-space:nowrap}.editor--viewer .layers-panel,.editor--viewer .board-drawer,.editor--viewer .board-drawer__backdrop,.editor--viewer .toolbar,.editor--viewer .style-panel{display:none!important}