:root{--bg: #eef0f2;--panel: #f8f9fa;--raised: #ffffff;--line: #d5d9de;--fg: #1d2329;--muted: #66707a;--accent: #d9741c;--accent-ink: #ffffff;--stage-top: #e4e8ec;--stage-bottom: #c9d0d7;--sel: rgba(217, 116, 28, .12);--danger: #c4413a;--good: #3f9d6b;--edited: #3d84d6;--check: #d2503d;--x: #e5534b;--y: #57ab5a;--z: #539bf5;--fs-title: 18px;--fs-section: 12px;--fs-body: 13px;--fs-meta: 12px;--font-ui: "IBM Plex Sans", "Noto Sans TC", system-ui, sans-serif;--font-head: "Noto Sans TC", "IBM Plex Sans", system-ui, sans-serif;--font-mono: "IBM Plex Mono", ui-monospace, Consolas, monospace}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--bg: #15191d;--panel: #1b2025;--raised: #222830;--line: #2c333a;--fg: #e3e7eb;--muted: #8b949d;--accent: #f0913a;--accent-ink: #1a1208;--stage-top: #262c32;--stage-bottom: #121518;--sel: rgba(240, 145, 58, .14);--good: #5cc28a;--edited: #6aa9f0;--check: #e5624f;color-scheme:dark}}:root[data-theme=dark]{--bg: #15191d;--panel: #1b2025;--raised: #222830;--line: #2c333a;--fg: #e3e7eb;--muted: #8b949d;--accent: #f0913a;--accent-ink: #1a1208;--stage-top: #262c32;--stage-bottom: #121518;--sel: rgba(240, 145, 58, .14);--good: #5cc28a;--edited: #6aa9f0;--check: #e5624f;color-scheme:dark}[hidden]{display:none!important}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font-family:var(--font-ui);font-size:var(--fs-body)}button:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible,[role=button]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}code{font-family:var(--font-mono)}.app{height:100%;display:grid;grid-template-columns:minmax(0,1fr) 420px}.stage{position:relative;min-width:0;min-height:0;background:linear-gradient(var(--stage-top),var(--stage-bottom))}.stage canvas{display:block;width:100%;height:100%;touch-action:none}.stage-head{position:absolute;top:14px;left:16px;right:16px;pointer-events:none;display:grid;gap:2px}.stage-head h1{margin:0;font-family:var(--font-head);font-size:var(--fs-title);font-weight:700;letter-spacing:.02em}.stage-head p{margin:0;color:var(--muted);font-size:var(--fs-meta)}.stage-foot{position:absolute;left:16px;right:16px;bottom:14px;display:grid;gap:6px;max-width:440px}.stage-foot .row{background:color-mix(in srgb,var(--panel) 80%,transparent);border:1px solid var(--line);border-radius:8px;padding:6px 10px}.hover-tag{font-family:var(--font-mono);font-size:var(--fs-meta);color:var(--muted);min-height:1.3em}.loading{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;color:var(--muted);white-space:pre-line;text-align:center;padding:16px}.panel{background:var(--panel);border-left:1px solid var(--line);overflow-y:auto;min-height:0;padding:16px 16px 24px;display:flex;flex-direction:column;gap:18px}section{display:grid;gap:8px}@media (max-width: 760px){.app{grid-template-columns:1fr;grid-template-rows:58vh auto;height:auto}html,body{height:auto}.panel{border-left:none;border-top:1px solid var(--line);overflow:visible}}.label{font-size:var(--fs-section);font-weight:600;letter-spacing:.08em;color:var(--muted);display:flex;justify-content:space-between;align-items:center;gap:8px}.label .btns,.label button,.label .seg{letter-spacing:0}.hint,.note{margin:0;font-size:var(--fs-meta);color:var(--muted);line-height:1.5}.sub-label{font-size:var(--fs-meta);font-weight:500;color:var(--muted)}.toast{font-size:var(--fs-meta);color:var(--accent);min-height:1em}.count{font-size:var(--fs-meta);color:var(--muted);font-weight:400;margin-left:4px}.tag{font-size:var(--fs-meta);font-weight:600;color:var(--accent);border:1px solid var(--accent);border-radius:4px;padding:0 4px;margin-left:6px;flex-shrink:0}.btns{display:flex;gap:6px;flex-wrap:wrap}button.act{font:inherit;font-size:var(--fs-body);padding:6px 10px;border-radius:6px;border:1px solid var(--line);background:transparent;color:var(--fg);cursor:pointer}button.act:hover{border-color:var(--accent)}button.act.on,button.act.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}button.act.primary{font-weight:600}button.act:disabled{opacity:.5;cursor:default}.check{display:flex;align-items:center;gap:8px;font-size:var(--fs-body);cursor:pointer}.check input,input[type=range]{accent-color:var(--accent)}input[type=range]{width:100%}select{font:inherit;font-size:var(--fs-body);background:var(--panel);color:var(--fg);border:1px solid var(--line);border-radius:6px;padding:4px 6px;min-width:0}.row{display:grid;grid-template-columns:64px minmax(0,1fr) 44px;align-items:center;gap:10px;font-size:var(--fs-body)}.row output{font-family:var(--font-mono);font-size:var(--fs-meta);text-align:right;font-variant-numeric:tabular-nums;color:var(--muted)}.seg{display:inline-flex;border:1px solid var(--line);border-radius:6px;overflow:hidden}.seg button{font:inherit;font-size:var(--fs-body);font-weight:500;padding:4px 12px;border:none;background:transparent;color:var(--muted);cursor:pointer}.seg button[aria-pressed=true]{background:var(--accent);color:var(--accent-ink)}.eye{border:none;background:transparent;color:var(--muted);cursor:pointer;padding:3px;border-radius:4px;line-height:0}.eye:hover{color:var(--fg);background:var(--sel)}.eye svg{width:18px;height:18px}.chips{display:flex;flex-shrink:0}.chips i{width:12px;height:12px;border-radius:50%;border:1px solid rgba(0,0,0,.2);margin-left:-3px}.chips i:first-child{margin-left:0}details.grp>summary{list-style:none;display:grid;grid-template-columns:12px minmax(0,1fr) auto 26px;align-items:center;gap:8px;padding:6px 4px 6px 6px;border-radius:6px;cursor:pointer;font-size:var(--fs-body);font-weight:500}details.grp>summary::-webkit-details-marker{display:none}details.grp>summary:before{content:"▸";font-size:10px;color:var(--muted);transition:transform .15s}details.grp[open]>summary:before{transform:rotate(90deg)}details.grp>summary:hover{background:var(--sel)}details.grp>summary .chips i{width:10px;height:10px}.parts{display:grid;gap:2px;padding:2px 0 6px 18px}.part{display:grid;grid-template-columns:18px minmax(0,1fr) auto 26px;align-items:center;gap:10px;padding:6px 4px 6px 6px;border-radius:6px;cursor:pointer}.part:hover{background:var(--sel)}.part.on{background:var(--sel);box-shadow:inset 0 0 0 1px var(--accent)}.part.off .dot,.part.off .pname,.part.off .hex{opacity:.4}.dot{width:18px;height:18px;border-radius:50%;border:1px solid rgba(0,0,0,.18)}.pname{min-width:0;display:grid}.pname b{font-weight:500;font-size:var(--fs-body);display:flex;align-items:center;min-width:0}.pname b .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.pname code{font-size:var(--fs-meta);color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hex{font-family:var(--font-mono);font-size:var(--fs-meta);color:var(--muted)}.editor{margin:4px 0 8px;padding:12px;background:var(--raised);border:1px solid var(--line);border-radius:8px;display:grid;gap:12px}.ed-head{display:flex;justify-content:space-between;align-items:start;gap:8px}.ed-head b{font-size:var(--fs-body);font-weight:600}.ed-head .dims{font-family:var(--font-mono);font-size:var(--fs-meta);color:var(--muted)}.close{border:none;background:transparent;color:var(--muted);font-size:18px;line-height:1;cursor:pointer;padding:2px 6px;border-radius:4px}.close:hover{color:var(--fg);background:var(--sel)}.cpick{display:grid;gap:10px}.cpick .sv{position:relative;height:150px;border-radius:6px;cursor:crosshair;touch-action:none}.cpick .hue{position:relative;height:14px;border-radius:7px;cursor:pointer;touch-action:none;background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.cpick .knob{position:absolute;width:14px;height:14px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #00000073,0 1px 3px #0006;transform:translate(-50%,-50%);pointer-events:none}.cpick .hue .knob{top:50%}.cpick .hexrow{display:grid;grid-template-columns:32px minmax(0,1fr);gap:8px;align-items:center}.cpick .preview{height:32px;border-radius:6px;border:1px solid var(--line)}.cpick .hexbox{display:flex;align-items:center;border:1px solid var(--line);border-radius:6px;background:var(--panel);padding:0 8px;height:32px}.cpick .hexbox span{color:var(--muted);font-family:var(--font-mono)}.cpick .hexbox input{border:none;outline:none;background:transparent;color:var(--fg);font-family:var(--font-mono);font-size:var(--fs-body);width:100%;text-transform:uppercase;padding:0 4px}.cpick .hexbox:focus-within{border-color:var(--accent)}.cpick .hexbox.bad{border-color:var(--danger)}.cpick .sw-label{font-size:var(--fs-meta);color:var(--muted)}.cpick .swatches{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px}.cpick .swatches button{aspect-ratio:1;max-width:100%;border-radius:50%;border:1px solid rgba(0,0,0,.18);cursor:pointer;padding:0}.cpick .swatches button:hover{transform:scale(1.1)}.cpick .swatches button.cur{box-shadow:0 0 0 2px var(--raised),0 0 0 4px var(--accent)}.presets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.preset{display:flex;align-items:center;gap:8px;padding:7px 8px;border:1px solid var(--line);border-radius:6px;background:transparent;color:var(--fg);font:inherit;font-size:var(--fs-body);cursor:pointer;text-align:left;min-width:0}.preset:hover{border-color:var(--accent)}.preset span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.preset.mine{border-style:dashed}.preset-user{position:relative;display:grid}.preset-user .preset{padding-right:30px}.preset-user .del{position:absolute;right:4px;top:50%;transform:translateY(-50%);border:none;background:transparent;color:var(--muted);font:inherit;font-size:var(--fs-meta);padding:3px 6px;border-radius:4px;cursor:pointer}.preset-user .del:hover{color:var(--fg);background:var(--sel)}.preset-user .del.armed{color:var(--accent-ink);background:var(--accent)}.save-form{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px}.save-form input{font:inherit;font-size:var(--fs-body);padding:6px 8px;border:1px solid var(--line);border-radius:6px;background:var(--raised);color:var(--fg);min-width:0}.save-form input:focus{outline:none;border-color:var(--accent)}.toggles{display:grid;gap:6px}