:root{--panel:#ffffff;--line:#e2e8f0;--text:#0f172a;--ink2:#475569;--muted:#64748b;--accent:#2563eb;--accent-bg:#e6efff;--accent-bd:#b4cdfa;--btn:#f1f5f9;--hover:#e2e8f0;--press:#cbd5e1;--bar:#f1f5f9;--ctl:34px;--r:8px;--shadow:0 6px 20px rgba(15,23,42,.1), 0 1px 3px rgba(15,23,42,.08)}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:#fff;color:var(--text);font:15px/1.4 system-ui,Segoe UI,Arial,sans-serif;overflow:hidden;user-select:none}button,select,input,textarea{font:inherit;color:inherit}button{cursor:pointer}#cv{position:fixed;inset:0;width:100%;height:100%;display:block;background:#fff;touch-action:none}#gridsvg,.base{position:absolute;inset:0;width:100%;height:100%}#gridsvg{pointer-events:none}.base{transform-origin:0 0}.base>svg{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible}#cv.tool-create{cursor:crosshair}#cv.panning{cursor:grabbing}#cv.tool-pencil,#cv.tool-pencil *{cursor:crosshair!important}#cv.tool-eraser,#cv.tool-eraser *{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20'%3E%3Ccircle cx='10' cy='10' r='7' fill='white' fill-opacity='.6' stroke='%23334155' stroke-width='1.5'/%3E%3C/svg%3E") 10 10,crosshair!important}#cv.dragging .conn .hit,#cv.dragging .ov *{pointer-events:none}.shape,.conn{cursor:move}#ed{position:fixed;resize:none;margin:0;border:1.5px dashed var(--accent);outline:none;overflow:hidden;text-align:center;background:transparent;line-height:1.25;user-select:text;z-index:5;font-family:system-ui,Segoe UI,Arial,sans-serif}#ed[hidden]{display:none}.float{position:fixed;z-index:10;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}.float[hidden]{display:none}.row{display:flex;align-items:center;gap:2px}.sep{width:1px;height:22px;align-self:center;background:var(--line);margin:0 6px;flex:none}.btn,.tool,.sq,.packbtn,.ib{height:var(--ctl);min-width:var(--ctl);border:1px solid transparent;border-radius:var(--r);background:var(--btn);color:var(--ink2);padding:0 12px;font-size:14px;font-weight:500;line-height:1;white-space:nowrap;display:inline-grid;place-items:center;transition:background .12s,color .12s,border-color .12s}.tool,.sq,.ib{padding:0;width:var(--ctl)}.btn:hover,.tool:hover,.sq:hover,.packbtn:hover,.ib:hover{background:var(--hover);color:var(--text)}.btn:active,.tool:active,.sq:active,.packbtn:active,.ib:active{background:var(--press)}.btn.on,.tool.on,.sq.on,.packbtn.on,.ib.on{background:var(--accent-bg);border-color:var(--accent-bd);color:var(--accent)}.btn:disabled,.sq:disabled,.ib:disabled{opacity:.38;pointer-events:none}.btn.danger:hover{background:#fef2f2;color:#b91c1c}button:focus-visible,.chk:focus-within{outline:2px solid var(--accent);outline-offset:1px}.ib svg{width:20px;height:20px;display:block}#tb{top:12px;left:50%;transform:translate(-50%);padding:6px 8px;gap:4px;max-width:calc(100vw - 24px);overflow-x:auto}.tool svg{width:24px;height:24px;overflow:hidden}#tb .tool,#tb .packbtn{background:none;height:40px}#tb .tool{width:40px;min-width:40px}#tb .tool:hover,#tb .packbtn:hover{background:var(--btn)}#tb .tool.on,#tb .packbtn.on{background:var(--accent-bg)}.packbtn{font-weight:600;color:var(--text)}#file-bar .ib,#file-bar .btn,#show-bar .btn,#show-bar .tool{background:none;height:40px}#file-bar .ib,#show-bar .tool{width:40px;min-width:40px}#file-bar .btn,#show-bar .btn{font-weight:600;color:var(--text)}#file-bar .ib:hover,#file-bar .btn:hover,#show-bar .btn:hover,#show-bar .tool:hover{background:var(--btn)}#show-bar .btn.on{background:var(--accent-bg);color:var(--accent)}#file-bar .ib svg{width:22px;height:22px}#tb .packall,#tb.compact .packbtn{display:none}#tb.compact .packall{display:inline-grid}.ptabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:8px}.ptabs .btn{height:30px;padding:0 10px;font-size:13px}#narrow{position:fixed;inset:0;z-index:200;background:#f8fafcf7;display:none;place-items:center;text-align:center;padding:24px}#narrow div{max-width:420px;font-size:15px;color:var(--ink2);line-height:1.5}#narrow b{display:block;font-size:18px;color:var(--text);margin-bottom:6px}@media(max-width:1199px){#narrow{display:grid}}body.presenting #narrow{display:none!important}.split{display:flex;align-items:center}#file-bar{top:12px;left:12px;padding:6px 8px}#show-bar{top:12px;right:12px;padding:6px 8px}#zoom-bar{bottom:50px;left:50%;transform:translate(-50%);padding:6px 8px}#tabbar{position:fixed;left:0;right:0;bottom:0;height:42px;z-index:12;background:var(--bar);border-top:1px solid var(--line);display:flex;align-items:center;gap:6px;padding:0 12px;font-size:14px}.dlgback{position:fixed;inset:0;background:#0f172a59;display:grid;place-items:center;z-index:100}.dlg{background:var(--panel);border-radius:14px;box-shadow:0 12px 40px #0f172a40;padding:22px 24px 18px;width:min(420px,calc(100vw - 32px));font-size:14.5px}.dlg h3{margin:0 0 8px;font-size:16px}.dlg.wide{width:min(1120px,calc(100vw - 48px));max-height:calc(100vh - 64px);overflow:auto;padding:28px 32px 24px}.dlg.wide h3{font-size:18px;margin-bottom:6px}.keys{display:grid;grid-template-columns:repeat(3,1fr);gap:0 40px;color:var(--text);font-size:14px}.keys div{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:5px 0;border-bottom:1px solid #f1f5f9}.keys b{grid-column:1/-1;margin:18px 0 4px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.keys b:first-child{margin-top:8px}@media(max-width:1000px){.keys{grid-template-columns:1fr 1fr}}.keys kbd{font:12.5px/1 ui-monospace,Consolas,monospace;background:#f3f4f6;border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;padding:4px 7px;white-space:nowrap}.dlg p{margin:0 0 18px;color:var(--muted);line-height:1.45}.dlg .btns{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}.dlg button{height:var(--ctl);padding:0 16px;border-radius:var(--r);border:1px solid transparent;background:var(--btn);font:inherit;font-size:14px;font-weight:500;color:var(--ink2);cursor:pointer}.dlg button:hover{background:var(--hover);color:var(--text)}.dlg button.pri{background:var(--accent);border-color:var(--accent);color:#fff}.dlg button.pri:hover{background:#1d4ed8;color:#fff}.dlg button.sub{border-color:transparent;background:none;color:var(--muted);margin-right:auto}#tabs{display:flex;gap:4px;min-width:0;flex:0 1 auto;overflow-x:auto;scrollbar-width:none}#tabs::-webkit-scrollbar{display:none}.tab{display:flex;align-items:center;gap:6px;height:30px;padding:0 4px 0 12px;border-radius:var(--r);font-size:14px;font-weight:500;border:1px solid transparent;cursor:pointer;color:var(--ink2);background:#e2e8f0;white-space:nowrap;flex:0 1 auto;min-width:64px}.tab:hover{background:var(--press);color:var(--text)}.tab.on{background:#fff;color:var(--text);border-color:var(--line);font-weight:600;box-shadow:0 1px 2px #0f172a0f}.tab .tn{max-width:180px;min-width:0;overflow:hidden;text-overflow:ellipsis;outline:none;user-select:none}.tab .tn[contenteditable=true]{user-select:text;background:#fff;color:var(--text);padding:0 4px;border-radius:4px;outline:1.5px solid var(--accent);text-overflow:clip}.tab .tx{width:20px;height:20px;border:0;background:none;border-radius:5px;color:inherit;opacity:.55;padding:0;line-height:1;font-size:15px}.tab.dirty .tx:not(:hover){font-size:0;opacity:1;color:var(--accent)}.tab.dirty .tx:not(:hover):after{content:"";display:block;width:8px;height:8px;margin:auto;border-radius:50%;background:currentColor}.tab .tx:hover{background:#0f172a14;opacity:1}.tabadd{width:30px;height:30px;border:1px solid transparent;background:#e2e8f0;border-radius:var(--r);font-size:18px;line-height:1;padding:0;color:var(--ink2);flex:none}.tabadd:hover{background:var(--press);color:var(--text)}#jsize{margin-left:auto;color:var(--muted);font-size:13px;font-variant-numeric:tabular-nums;white-space:nowrap}#privacy{position:relative;display:grid;place-items:center;width:28px;height:28px;margin-left:8px;border-radius:var(--r);color:var(--muted);cursor:default;outline:none}#privacy:hover,#privacy:focus-visible{background:var(--press);color:var(--text)}#privacy svg{width:16px;height:16px}#privacy .tip{position:absolute;right:-6px;bottom:calc(100% + 10px);width:270px;padding:10px 12px;border-radius:10px;background:#0f172a;color:#fff;font-size:13px;line-height:1.45;white-space:normal;box-shadow:var(--shadow);opacity:0;transform:translateY(4px);pointer-events:none;transition:opacity .15s,transform .15s}#privacy .tip b{display:block;font-weight:600;margin-bottom:2px}#privacy .tip:after{content:"";position:absolute;right:15px;top:100%;border:6px solid transparent;border-top-color:#0f172a}#privacy:hover .tip,#privacy:focus-visible .tip{opacity:1;transform:none}#helpbtn{position:fixed;right:16px;bottom:56px;z-index:11;width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--panel);box-shadow:var(--shadow);font-weight:700;font-size:17px;color:var(--ink2);padding:0}#helpbtn:hover{background:var(--hover);color:var(--text)}body.setup #helpbtn,body.presenting #helpbtn{display:none}#zl{min-width:64px;font-variant-numeric:tabular-nums}label.chk{display:flex;gap:8px;align-items:center;cursor:pointer;height:var(--ctl);padding:0 12px;border-radius:var(--r);font-size:14px;font-weight:500;color:var(--ink2);background:var(--btn)}label.chk:hover{background:var(--hover)}label.chk input{width:16px;height:16px;accent-color:var(--accent);margin:0}#side{top:72px;left:12px;width:224px;max-height:calc(100vh - 148px);overflow-y:auto;overflow-x:hidden;padding:4px 10px 8px 12px}@supports not selector(::-webkit-scrollbar){#side,#dbg,#pop{scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent}}#side,#dbg,#pop{scrollbar-gutter:stable}#side::-webkit-scrollbar,#dbg::-webkit-scrollbar,#pop::-webkit-scrollbar{width:4px}#side::-webkit-scrollbar-track,#dbg::-webkit-scrollbar-track,#pop::-webkit-scrollbar-track{background:transparent;margin:10px 0}#side::-webkit-scrollbar-thumb,#dbg::-webkit-scrollbar-thumb,#pop::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}#side::-webkit-scrollbar-thumb:hover,#dbg::-webkit-scrollbar-thumb:hover,#pop::-webkit-scrollbar-thumb:hover{background:#94a3b8}#side .sec{padding:8px 0 4px}#side .sq{background:#f7f9fb}#side .sq:hover{background:#eef2f6}#side .sq.on{background:var(--accent-bg)}#side .att{display:flex;align-items:center;gap:6px;margin-bottom:6px}#side .att span{width:58px;font-size:13px;color:var(--ink2)}#side .att .btn{height:30px;padding:0 12px;font-size:13px}#side h4{margin:0 0 6px;font-size:13px;font-weight:600;color:var(--text)}.sec.off{opacity:.38;pointer-events:none}.g4{display:grid;grid-template-columns:repeat(4,var(--ctl));gap:6px;justify-content:start}.g6{display:grid;grid-template-columns:repeat(6,28px);gap:6px;justify-content:space-between}.sq svg{width:70%;height:auto;max-height:64%;display:block;margin:auto}.sq .cap{font-size:8px;color:var(--muted);line-height:1}.swb,.swc{width:28px;height:28px;border-radius:var(--r);border:1px solid rgba(15,23,42,.18);padding:0;min-width:0;transition:transform .1s}.swb:hover,.swc:hover{transform:scale(1.08)}.swb.on{outline:2px solid var(--accent);outline-offset:2px;border-color:transparent}.swb.none{background-color:#fff;background-image:conic-gradient(#cbd5e1 25%,#fff 0 50%,#cbd5e1 0 75%,#fff 0);background-size:10px 10px}.swc{-webkit-appearance:none;appearance:none;cursor:pointer;overflow:hidden;padding:4px;border:1.5px solid #94a3b8;background:conic-gradient(from 90deg,#ef4444,#f59e0b,#eab308,#22c55e,#06b6d4,#3b82f6,#8b5cf6,#ec4899,#ef4444) content-box,#fff padding-box}.swc.has{background:linear-gradient(var(--last),var(--last)) content-box,#fff padding-box}.swc.on{outline:2px solid var(--accent);outline-offset:2px;border-color:transparent}.swc::-webkit-color-swatch-wrapper{padding:0}.swc::-webkit-color-swatch{border:0;opacity:0}.swc::-moz-color-swatch{border:0;opacity:0}.rng{width:100%;accent-color:var(--accent);margin:2px 0}#dbg{top:68px;right:12px;width:270px;padding:10px 12px;font-size:14px;max-height:calc(100vh - 130px);overflow:auto}#dbg input{width:100%;border:1px solid var(--line);border-radius:5px;padding:1px 4px;font:inherit;background:#fff;user-select:text}#dbg input:focus{outline:2px solid var(--accent);border-color:transparent}#dbg h4{margin:0 0 7px;font-size:13px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}#dbg table{width:100%;border-collapse:collapse;font-family:ui-monospace,Consolas,monospace;font-size:13.5px}#dbg td{padding:1px 0}#dbg td:first-child{color:var(--muted);width:42%}#dbg .blk{border-top:1px solid var(--line);padding:5px 0}#dbg .blk b{font-family:system-ui;font-size:14px}#dbg .dm{color:var(--muted);margin:2px 0 6px}#pop{z-index:30;padding:10px;max-width:400px}#pop h5{margin:6px 4px 4px;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}#pop h5:first-child{margin-top:0}.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.pgrid.w3{grid-template-columns:repeat(3,1fr)}.pi{display:flex;flex-direction:column;align-items:center;gap:4px;border:1px solid transparent;background:none;border-radius:var(--r);padding:8px 4px;width:88px;font-size:13px;color:var(--ink2);line-height:1.15;text-align:center}.pi:hover{background:var(--hover);color:var(--text)}.pi svg{width:44px;height:30px;overflow:hidden}.pe{width:auto;min-width:64px}.pe svg{width:56px;height:22px}.sq.w2{grid-column:span 2;width:auto}.sq.w2 svg{width:84%;max-height:80%}#menu{position:fixed;z-index:50;min-width:290px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px;font-size:14px}#menu[hidden]{display:none}#menu button{display:flex;justify-content:space-between;gap:24px;width:100%;border:0;background:none;text-align:left;padding:7px 10px;border-radius:var(--r);font-size:14px;color:var(--text)}#menu button:hover:not(:disabled){background:var(--hover)}#menu button:disabled{color:#a3acb9;cursor:default}#menu kbd:empty{display:none}#welcome{position:fixed;left:50%;top:46%;transform:translate(-50%,-50%);z-index:5;text-align:center;pointer-events:none;user-select:none}#welcome[hidden],body.presenting #welcome{display:none}#welcome h1{position:relative;opacity:.32;margin:0 0 12px;padding:0 .08em .06em;font-size:clamp(56px,11vw,140px);font-family:Segoe Print,Bradley Hand,Comic Sans MS,cursive;line-height:1.2;font-weight:700;letter-spacing:0;color:transparent;-webkit-text-stroke:6px transparent;background:linear-gradient(135deg,#4f46e5,#2563eb);-webkit-background-clip:text;background-clip:text}#welcome h1:after{content:attr(data-text);position:absolute;left:0;top:0;padding:inherit;color:#fff;-webkit-text-stroke:0;white-space:nowrap}#welcome p{margin:0 auto;max-width:34em;font-size:clamp(16px,1.5vw,20px);line-height:1.6;color:var(--ink2);opacity:.7}#welcome .fmts{margin-top:10px;font-size:13px;letter-spacing:.02em;font-weight:500;color:var(--ink2)}#welcome #welcome-open{position:relative;opacity:.7;display:inline-flex;align-items:center;gap:12px;margin-top:34px;padding:17px 32px 18px 26px;border:0;background:none;color:var(--accent);font:700 18px/1 Segoe Print,Bradley Hand,Comic Sans MS,cursive;white-space:nowrap;cursor:pointer;pointer-events:auto;transition:transform .15s,color .15s}#welcome #welcome-open .frame{position:absolute;inset:0;width:100%;height:100%;overflow:visible}#welcome #welcome-open .hatch{opacity:0;transition:opacity .15s}#welcome #welcome-open .ico{position:relative;flex:none;width:24px;height:24px;stroke:currentColor;stroke-width:2.2}#welcome #welcome-open span{position:relative}#welcome #welcome-open:hover{transform:translateY(-2px) rotate(-.6deg)}#welcome #welcome-open:hover .hatch{opacity:.4}#welcome #welcome-open:active{transform:translateY(0)}#welcome #welcome-open:focus-visible{outline:2px solid var(--accent);outline-offset:6px;border-radius:14px}#hint{position:fixed;top:72px;left:50%;transform:translate(-50%);z-index:9;max-width:calc(100vw - 560px);font-size:13px;line-height:1.35;color:var(--ink2);background:#ffffffe0;backdrop-filter:blur(4px);border:1px solid var(--line);border-radius:999px;padding:5px 14px;pointer-events:none;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#hint[hidden],body.presenting #hint{display:none}body.setup #hint{max-width:calc(100vw - 760px)}#toast{position:fixed;left:50%;bottom:110px;transform:translate(-50%,8px);z-index:150;background:#0f172a;color:#fff;font-size:14px;padding:8px 16px;border-radius:999px;box-shadow:var(--shadow);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}#toast.show{opacity:1;transform:translate(-50%)}#hint b{color:var(--text);font-weight:600}#hint kbd{font:600 11.5px/1 system-ui,sans-serif;background:var(--btn);border:1px solid var(--line);border-radius:4px;padding:2px 5px;color:var(--text)}#hint .dot{color:#cbd5e1;margin:0 6px}#slides{top:68px;right:12px;bottom:54px;width:320px;padding:14px 12px 12px;overflow:auto;font-size:14px;transform:translate(calc(100% + 24px));visibility:hidden;transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s .28s}#slides.open{transform:none;visibility:visible;transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s}#slides h3{margin:0 0 4px;font-size:15px}#slides .hint{color:var(--muted);font-size:13px;line-height:1.4;margin:0 0 12px}#slides .list{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}#slides .sl{display:flex;align-items:center;gap:8px;padding:6px 4px;border-radius:var(--r);background:var(--btn);cursor:grab;position:relative}#slides .sl.dragging{opacity:.4}#slides .sl.drop-before:before,#slides .sl.drop-after:after{content:"";position:absolute;left:4px;right:4px;height:3px;border-radius:2px;background:var(--accent)}#slides .sl.drop-before:before{top:-4px}#slides .sl.drop-after:after{bottom:-4px}#slides .sl .grip{color:#94a3b8;font-size:12px;letter-spacing:-2px;width:10px;flex:none;user-select:none}#slides .sl .th{width:96px;height:60px;flex:none;border-radius:6px;border:1px solid var(--line);display:block;pointer-events:none}#slides .sl:hover{background:var(--hover)}#slides .sl .no{width:22px;height:22px;border-radius:50%;background:var(--accent);color:#fff;font-size:12px;font-weight:600;display:grid;place-items:center;flex:none}#slides .sl .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#slides .sl .ib{--ctl:26px;background:none;font-size:13px}#slides .sl .ib:hover{background:#fff}#slides .empty{color:var(--muted);font-size:13px;padding:10px 8px;background:var(--btn);border-radius:var(--r);margin-bottom:12px}#slides .acts{display:flex;gap:6px;flex-wrap:wrap}#slides .btn.pri{background:var(--accent);color:#fff}.btn .fk{font:600 11px/1 system-ui,sans-serif;margin-left:8px;padding:2px 5px;border-radius:4px;background:#0f172a14;color:inherit;opacity:.8}.btn.pri .fk{background:#ffffff38}#slides .acts .btn{display:inline-flex;align-items:center}#slides .btn.pri:hover{background:#1d4ed8;color:#fff}body.setup #tb,body.setup #side,body.setup #dbg{display:none!important}body.setup #cv{cursor:pointer}body.presenting .float,body.presenting #tabbar{display:none!important}#cv{will-change:transform;transform-origin:0 0}.cvimg{position:fixed;inset:0;width:100%;height:100%;will-change:transform;transform-origin:0 0;pointer-events:none;visibility:hidden}.cvimg.on{visibility:visible}#present{position:fixed;inset:0;z-index:200;cursor:default}#present.laser{cursor:none}#laser{position:fixed;inset:0;width:100%;height:100%;z-index:260;pointer-events:none}#cv.tool-laser,#cv.tool-laser *{cursor:none!important}#present[hidden]{display:none}#pcount{position:fixed;right:18px;bottom:14px;font-size:13px;color:#64748b;background:#ffffffbf;padding:3px 9px;border-radius:999px;font-variant-numeric:tabular-nums;transition:opacity .4s}#present.idle #pcount{opacity:0}.tool{position:relative}.tool[data-key]:after{content:attr(data-key);position:absolute;right:3px;bottom:2px;font:600 8.5px/1 system-ui,sans-serif;color:#a1a8b3;pointer-events:none}.tool.on[data-key]:after{color:#7aa2e8}#tb .tool svg *{vector-effect:non-scaling-stroke;stroke-width:1.6px}#menu kbd{color:var(--muted);font:inherit;font-size:13.5px}#menu .mh{padding:8px 10px 3px;font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}#menu button.danger:hover:not(:disabled){background:#fee2e2;color:#b91c1c}#menu hr{border:0;border-top:1px solid var(--line);margin:4px 2px}