:root{--bg:#f4f5f7;--panel:#fff;--line:#d9dce1;--ink:#1f2328;--mute:#6b7280;--accent:#2563eb;--ok:#16a34a;--bad:#dc2626;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#16181d;--panel:#1f2229;--line:#323744;--ink:#e6e8ec;--mute:#98a0ae;--accent:#5b8def;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font:13px/1.4 system-ui,-apple-system,Segoe UI,sans-serif}button{font:inherit;color:inherit;background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:6px;padding:4px 10px}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.45;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.app{grid-template-rows:44px 1fr;grid-template-columns:250px 1fr 300px;height:100%;display:grid}header{background:var(--panel);border-bottom:1px solid var(--line);grid-column:1/-1;align-items:center;gap:8px;padding:0 12px;display:flex}header .sp{flex:1}.count{color:var(--mute)}.name{font:inherit;color:inherit;border:1px solid var(--line);background:0 0;border-radius:6px;width:190px;padding:3px 8px}.msg{color:var(--ok);text-overflow:ellipsis;white-space:nowrap;max-width:46ch;overflow:hidden}.msg.bad{color:var(--bad)}aside{background:var(--panel);border-right:1px solid var(--line);min-height:0;overflow-y:auto}aside.right{border-right:0;border-left:1px solid var(--line);padding:10px 12px}.thumbs{border-bottom:1px solid var(--line);grid-template-columns:1fr 1fr;gap:6px;padding:8px;display:grid}.thumb{flex-direction:column;align-items:stretch;gap:2px;padding:3px;display:flex}.thumb svg{background:var(--bg);border-radius:4px;width:100%;height:74px}.thumb span{color:var(--mute);text-align:left;font-size:11px}.thumb.on{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.parts{padding:6px 8px 16px}.parts h4{text-transform:capitalize;color:var(--mute);letter-spacing:.06em;margin:10px 0 4px;font-size:11px}.part{text-align:left;text-transform:capitalize;background:0 0;border:1px solid #0000;align-items:center;gap:6px;width:100%;padding:3px 6px;display:flex}.part .dot{border:1.5px solid var(--mute);border-radius:50%;width:8px;height:8px}.part.drawn .dot{background:var(--ok);border-color:var(--ok)}.part.mirrored .dot{background:var(--accent);border-color:var(--accent)}.part.on{background:color-mix(in srgb, var(--accent) 14%, transparent);border-color:var(--accent)}.part em{color:var(--mute);border:1px solid var(--line);border-radius:4px;padding:0 3px;font-size:10px;font-style:normal}.part small{color:var(--mute);margin-left:auto}main{background:repeating-conic-gradient(var(--bg) 0 25%, color-mix(in srgb, var(--bg) 92%, var(--ink)) 0 50%) 0 0 / 22px 22px;min-width:0;min-height:0;position:relative}#stage{width:100%;height:100%;display:block;position:absolute;inset:0}.hint{color:var(--mute);background:var(--panel);border:1px solid var(--line);pointer-events:none;border-radius:6px;padding:2px 8px;font-size:11px;position:absolute;bottom:8px;left:10px}.inspector h3{text-transform:capitalize;margin:0 0 8px}.inspector h3 small{color:var(--mute);text-transform:none;font-weight:400}.inspector h4{color:var(--mute);letter-spacing:.06em;text-transform:uppercase;margin:14px 0 4px;font-size:11px}.tools{grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px;display:grid}.tools button{justify-content:space-between;display:flex}.tools button.on{background:var(--accent);border-color:var(--accent);color:#fff}kbd{opacity:.7;font:10px ui-monospace,monospace}.row{align-items:center;gap:8px;margin:6px 0;display:flex}.row input[type=range]{flex:1}.row input[type=color]{border:1px solid var(--line);background:0 0;width:34px;height:24px;padding:0}.note{background:color-mix(in srgb, var(--accent) 14%, transparent);border:1px solid var(--accent);border-radius:6px;margin:6px 0;padding:6px 8px}.mirror{border:1px solid var(--line);border-radius:8px;flex-direction:column;gap:4px;margin-top:12px;padding:8px;display:flex}.mirror small{color:var(--mute)}.paths{margin:0;padding:0;list-style:none}.paths li{cursor:pointer;border:1px solid #0000;border-radius:5px;align-items:center;gap:6px;padding:3px 4px;display:flex}.paths li.on{border-color:var(--accent)}.paths .sw{border:2px solid;border-radius:3px;width:14px;height:14px}.paths .acts{gap:2px;margin-left:auto;display:flex}.paths .acts button{padding:0 5px}.fatal{max-width:520px;margin:14vh auto;padding:0 20px}.side{color:var(--mute);margin:-4px 0 10px;font-size:12px}.views{color:var(--mute);align-items:center;gap:6px;display:flex}.views select{font:inherit;color:inherit;background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:3px 6px}.props{border-top:1px solid var(--line);margin-top:18px;padding-top:10px}.props summary{cursor:pointer;font-weight:600}.props summary em{color:var(--accent);font-style:normal;font-weight:400}.hint2{color:var(--mute);margin:6px 0;font-size:12px}.bone span{width:112px;font-size:12px}.bone output{text-align:right;font-variant-numeric:tabular-nums;width:44px;color:var(--mute)}.joints{grid-template-columns:1fr 1fr;gap:4px 10px;margin-bottom:10px;display:grid}.jrow{color:var(--mute);flex-direction:column;font-size:11px;display:flex}.jrow input{font:inherit;color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:5px;width:100%;padding:2px 6px}.props select{font:inherit;color:inherit;background:var(--panel);border:1px solid var(--line);border-radius:6px;flex:1;padding:3px 6px}.right{padding-bottom:40px}.color .seg{color:var(--mute);align-items:center;gap:4px;margin:6px 0;font-size:12px;display:flex}.color .seg button{padding:1px 7px}.color .seg button.on{background:var(--accent);border-color:var(--accent);color:#fff}.color .active{gap:3px;margin-left:auto;display:flex}.color .active i{border:1px solid var(--line);border-radius:4px;width:18px;height:18px}.wheel{cursor:crosshair;touch-action:none;border-radius:50%;width:180px;height:180px;margin:6px auto;display:block}.color .lbl{width:62px;font-size:12px}.color output{text-align:right;width:30px;color:var(--mute)}.color .hex{background:var(--panel);width:78px;color:var(--ink);border:1px solid var(--line);border-radius:5px;padding:2px 4px;font:12px ui-monospace,monospace}.zones{text-align:center;grid-template-columns:repeat(4,1fr);gap:6px;margin:8px 0;display:grid}.zones small{color:var(--mute);display:block}.zones code{color:var(--mute);font-size:9px}.ccell{border:1px solid var(--line);border-radius:4px;width:100%;height:22px;padding:0}.ccell.big{height:34px}.ccell.empty{background:0 0;border-style:dashed}.color .bar{grid-auto-columns:1fr;grid-auto-flow:column;gap:0;display:grid}.color .bar .ccell{border-radius:0}.color .pal{grid-template-columns:repeat(6,1fr);gap:4px;display:grid}.color h5{color:var(--mute);text-transform:uppercase;letter-spacing:.06em;margin:10px 0 4px;font-size:11px}.color h5 small{text-transform:none;letter-spacing:0}.ball{width:170px;height:170px;margin:8px auto 2px;display:block}.ball .zone{cursor:pointer}.ball .zone:hover{filter:brightness(1.12)}.filebtn{font:inherit;background:var(--panel);border:1px solid var(--line);cursor:pointer;border-radius:6px;padding:4px 10px;display:inline-block}
