:root{--paper:#ffffff;--ink:#111110;--grid:#b4b0a4;--bg:#ffffff;--text:#1c1b18;--accent:#ef5b43;--glas:linear-gradient(to bottom, rgba(255,255,255,.66) 0%, rgba(255,255,255,.5) 50%, rgba(255,255,255,.62) 100%);--tinte:rgba(16,16,20,.86);--glas-boden:rgba(255,255,255,.22);--saum-hell:rgba(255,255,255,.95);--saum-dunkel:rgba(108,122,148,.22);--kante:rgba(116,130,158,.26);--glas-schatten:0 10px 24px -12px rgba(30,40,62,.18);--chip:rgba(255,255,255,.55);--chip-hover:rgba(255,255,255,.72);--r-sm:10px;--r-control:clamp(0px, calc(var(--r-sm) * .62), 12px);--r-pop:clamp(0px, calc(var(--r-sm) + 1px), 16px);--r-panel:clamp(0px, calc(var(--r-sm) + 8px), 30px);--ctrl:38px;--bar-top:56px;--bar-bottom:42px;--font:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",system-ui,sans-serif;--mono:"SF Mono",ui-monospace,"JetBrains Mono",Menlo,monospace}*{box-sizing:border-box}html,body{margin:0;height:100%}body{font-family:var(--font);color:var(--text);background:var(--bg);overflow:hidden;-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none}button{font-family:inherit}#app{position:fixed;top:0;right:0;bottom:0;left:0;min-height:420px}.glassbar{position:absolute;left:0;right:0;z-index:10;background:linear-gradient(to bottom,#ffffff8c,#fff0) 0 0/100% 38% no-repeat,var(--glas),var(--glas-boden);-webkit-backdrop-filter:blur(20px) saturate(1.5);backdrop-filter:blur(20px) saturate(1.5);color:var(--tinte)}#topbar{top:0;display:flex;align-items:center;gap:10px;height:var(--bar-top);padding:0 14px;box-shadow:inset 0 1px 0 var(--saum-hell),inset 0 -1px 0 var(--saum-dunkel),0 1px 0 var(--kante),var(--glas-schatten);overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}.sep{flex:0 0 auto;width:1px;height:26px;background:var(--kante);margin:0 2px}#topbar .sep{background:#fff3}.spacer{flex:1 1 auto;min-width:8px}.dlwrap{position:relative;flex:0 0 auto}.dlwrap .btn .chev{display:inline-flex;margin-left:-2px}.dlwrap .btn .chev svg{width:11px;height:11px}.dlmenu{position:fixed;z-index:30;display:none;flex-direction:column;min-width:132px;padding:4px;background:linear-gradient(to bottom,#ffffff8c,#fff0) 0 0/100% 38% no-repeat,var(--glas),#ffffff6b;-webkit-backdrop-filter:blur(28px) saturate(1.5);backdrop-filter:blur(28px) saturate(1.5);border-radius:var(--r-pop);color:var(--tinte);box-shadow:inset 0 1px 0 var(--saum-hell),inset 0 -1px 0 var(--saum-dunkel),0 0 0 1px var(--kante),0 18px 40px -16px #1e283e6b}.dlmenu.open{display:flex}.dlmenu .btn{width:100%;height:36px;justify-content:flex-start;padding:0 10px;border-radius:max(0px,calc(var(--r-pop) - 4px));background:transparent;box-shadow:none}.dlmenu .btn:hover{background:var(--chip-hover);box-shadow:none}.rwrap{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto}.tslider{display:flex;align-items:center;gap:7px;white-space:nowrap;flex:0 0 auto}.tslider .ico{display:inline-flex;flex:0 0 auto;color:var(--tinte);opacity:.62}.tslider .ico svg{width:15px;height:15px;display:block}.tslider input[type=range]{width:96px}.tslider.compact input[type=range]{width:70px}.tslider .val{font-family:var(--mono);font-size:11.5px;color:var(--tinte);min-width:40px;text-align:right}.iseg{display:inline-flex;flex:0 0 auto;background:var(--chip);border:0;border-radius:var(--r-control);overflow:hidden;height:var(--ctrl);box-shadow:inset 0 1px 0 var(--saum-hell),0 0 0 1px var(--kante)}.iseg button{-moz-appearance:none;appearance:none;-webkit-appearance:none;border:0;border-right:1px solid var(--kante);background:transparent;cursor:pointer;color:var(--tinte);display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:0 11px;font-size:12.5px;font-weight:600;min-width:42px}.iseg button:last-child{border-right:0}.iseg button:hover{background:var(--chip-hover)}.iseg button[aria-pressed=true]{background:var(--tinte);color:#fff}.iseg button[aria-pressed=true]:hover{background:var(--tinte)}.iseg button svg{width:16px;height:16px}.btn{-moz-appearance:none;appearance:none;-webkit-appearance:none;flex:0 0 auto;height:var(--ctrl);border:0;background:var(--chip);color:var(--tinte);box-shadow:inset 0 1px 0 var(--saum-hell),0 0 0 1px var(--kante);border-radius:var(--r-control);padding:0 13px;font-size:12.5px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:7px}.btn:hover{background:var(--chip-hover)}.btn svg{width:16px;height:16px}.btn.icon{width:var(--ctrl);padding:0}.btn.on{background:var(--tinte);color:#fff}.swatch{-moz-appearance:none;appearance:none;-webkit-appearance:none;flex:0 0 auto;width:var(--ctrl);height:var(--ctrl);padding:0;margin:0;border:0;border-radius:var(--r-control);background:none;cursor:pointer;box-shadow:inset 0 1px 0 var(--saum-hell),0 0 0 1px var(--kante)}.swatch::-webkit-color-swatch-wrapper{padding:3px}.swatch::-webkit-color-swatch{border:1px solid var(--kante);border-radius:max(0px,calc(var(--r-control) - 3px))}.swatch::-moz-color-swatch{border:1px solid var(--kante);border-radius:max(0px,calc(var(--r-control) - 3px))}#stagewrap{position:absolute;top:0;right:0;bottom:0;left:0}#stage{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:stretch;padding:0}#board{position:relative;background:var(--paper);touch-action:none;overflow:hidden}canvas{display:block}.drophint{position:absolute;top:0;right:0;bottom:0;left:0;display:none;place-items:center;pointer-events:none;background:#ef5b431a;border:2px dashed var(--accent);z-index:5}.drophint span{background:var(--accent);color:var(--tinte);padding:8px 14px;font-weight:600;font-size:13px;border-radius:var(--r-control);box-shadow:inset 0 1px #ffffff73}#board.dragover .drophint{display:grid}#guidelink{position:fixed;top:calc(var(--bar-top) + 12px);right:14px;z-index:6;font-family:var(--mono);font-size:11px;letter-spacing:.03em;color:var(--tinte);text-decoration:none;padding:4px 7px;border-radius:var(--r-control);background:#ffffffdb;box-shadow:0 0 0 1px var(--kante)}#guidelink:hover{background:#fffffff5;text-decoration:underline;text-underline-offset:3px}#statusbar{bottom:0;display:flex;align-items:center;gap:13px;height:var(--bar-bottom);padding:0 14px;box-shadow:inset 0 -1px 0 var(--saum-hell),inset 0 1px 0 var(--saum-dunkel),0 -1px 0 var(--kante),0 -10px 24px -12px #1e283e2e;color:var(--tinte);font-family:var(--mono);font-size:12px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}#statusbar span{white-space:nowrap}#statusbar b{color:var(--tinte);font-weight:700}#statusbar .cap{color:var(--accent)}.mslider{display:flex;align-items:center;gap:6px;flex:1;min-width:0}.mslider .ico{display:inline-flex;flex:0 0 auto;color:var(--tinte);opacity:.62}.mslider .ico svg{width:14px;height:14px;display:block}.mslider input[type=range]{flex:1;min-width:30px}.mslider b{min-width:34px;text-align:right;white-space:nowrap}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:24px;background:transparent;cursor:pointer;margin:0;vertical-align:middle}input[type=range]::-webkit-slider-runnable-track{height:3px;background:#1c22303d;border-radius:2px}input[type=range]::-moz-range-track{height:3px;background:#1c22303d;border-radius:2px}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin-top:-7px;width:14px;height:16px;border-radius:max(0px,calc(var(--r-control) - 4px));background:var(--tinte);border:2px solid #fff;box-shadow:0 0 0 1px var(--kante)}input[type=range]::-moz-range-thumb{width:14px;height:16px;border-radius:max(0px,calc(var(--r-control) - 4px));background:var(--tinte);border:2px solid #fff;box-shadow:0 0 0 1px var(--kante)}input[type=range]:focus-visible{outline:none}input[type=range]:focus-visible::-webkit-slider-thumb{outline:2px solid var(--tinte);outline-offset:2px}input[type=range]:focus-visible::-moz-range-thumb{outline:2px solid var(--tinte);outline-offset:2px}:where(.btn,.iseg button,.swatch,.dlmenu .btn,#guidelink,#statusbar .storelink,#custopanel button):focus-visible{outline:2px solid var(--tinte);outline-offset:2px;border-radius:var(--r-control)}@media(prefers-reduced-motion:reduce){body.customize #topbar>*{animation:none}}#dbg{position:fixed;left:14px;bottom:calc(var(--bar-bottom) + 4px);width:248px;background:#111110ed;color:#e8e5dc;border-radius:var(--r-pop);z-index:60;display:none;font-family:var(--mono);font-size:11px;border:1px solid #000;overflow:hidden;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}#dbg.show{display:block}#dbg .h{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.12)}#dbg .h b{font-size:11px;color:#fff}#dbg .h .tag{margin-left:auto;color:#9a948a}#dbg .rows{padding:8px 10px;display:grid;grid-template-columns:auto 1fr;gap:3px 12px}#dbg .rows span:nth-child(odd){color:#9a948a}#dbg .rows span:nth-child(2n){color:#fff;text-align:right;word-break:break-all}#dbg .log{padding:6px 10px 9px;border-top:1px solid rgba(255,255,255,.12);max-height:96px;overflow:auto;color:#b9b3a7;white-space:pre-wrap;line-height:1.45}#statusbar .storelink{margin-left:auto;color:var(--tinte);opacity:.72;text-decoration:none;white-space:nowrap}#statusbar .storelink:hover{opacity:1;text-decoration:underline;text-underline-offset:3px}body.customize #topbar>*{display:inline-flex!important;outline:1.5px dashed rgba(239,91,67,.65);outline-offset:3px;cursor:grab;animation:pxwiggle 1.7s ease-in-out infinite}body.customize #topbar>.spacer{min-width:38px;outline-style:dotted}body.customize #topbar>.dragging{opacity:.35;animation:none}body.customize #topbar :is(.iseg button,.tslider input,.rwrap input,.rwrap button){pointer-events:none}@keyframes pxwiggle{0%,to{transform:rotate(0)}25%{transform:rotate(.6deg)}75%{transform:rotate(-.6deg)}}#custopanel{position:fixed;top:calc(var(--bar-top) + 12px);right:14px;z-index:40;width:236px;background:linear-gradient(to bottom,#ffffff8c,#fff0) 0 0/100% 30% no-repeat,var(--glas),#ffffff6b;-webkit-backdrop-filter:blur(28px) saturate(1.5);backdrop-filter:blur(28px) saturate(1.5);border-radius:var(--r-panel);overflow:hidden;box-shadow:inset 0 1px 0 var(--saum-hell),inset 0 -1px 0 var(--saum-dunkel),0 0 0 1px var(--kante),0 18px 40px -16px #1e283e6b;color:var(--tinte);display:none;font-size:12px}#custopanel.show{display:block}#custopanel .hd{display:flex;align-items:center;gap:8px;padding:9px 12px;border-bottom:1px solid var(--kante);cursor:grab;touch-action:none}#custopanel .hd b{font-size:12px;letter-spacing:.03em}#custopanel .hd .tag{color:var(--tinte);opacity:.62;font-family:var(--mono);font-size:10.5px}#custopanel .hd .x{margin-left:auto;-moz-appearance:none;appearance:none;-webkit-appearance:none;border:0;background:transparent;color:var(--tinte);opacity:.62;font-size:17px;line-height:0;cursor:pointer;width:26px;height:26px;display:grid;place-items:center;border-radius:var(--r-control)}#custopanel .hd .x:hover{opacity:1;background:var(--chip-hover)}#custopanel .fonts{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:11px 12px 4px}#custopanel .fonts button{-moz-appearance:none;appearance:none;-webkit-appearance:none;height:34px;background:var(--chip);border:0;box-shadow:inset 0 1px 0 var(--saum-hell),0 0 0 1px var(--kante);border-radius:var(--r-control);color:var(--tinte);font-size:14px;cursor:pointer}#custopanel .fonts button:hover{background:var(--chip-hover)}#custopanel .fonts button[aria-pressed=true]{background:var(--tinte);color:#fff}#custopanel .row{display:flex;align-items:center;gap:9px;padding:9px 12px}#custopanel .row .ico{display:inline-flex;color:var(--tinte);opacity:.62}#custopanel .row .ico svg{width:15px;height:15px;display:block}#custopanel .row input[type=range]{flex:1;min-width:0}#custopanel .row b{min-width:36px;text-align:right;font-family:var(--mono);font-size:11px;font-weight:600}#custopanel .rst{-moz-appearance:none;appearance:none;-webkit-appearance:none;display:inline-flex;align-items:center;justify-content:center;width:34px;height:30px;background:var(--chip);border:0;box-shadow:inset 0 1px 0 var(--saum-hell),0 0 0 1px var(--kante);border-radius:var(--r-control);color:var(--tinte);cursor:pointer}#custopanel .rst:hover{background:var(--chip-hover)}#custopanel .rst svg{width:15px;height:15px}