:root{--bg:#0f1113;--bg-2:#16191d;--bg-3:#1d2126;--line:#2a2f36;--line-2:#363c45;--text:#e6e8eb;--text-2:#a3a9b2;--text-3:#6f7782;--accent:#3fc1a5;--accent-2:#2a8f7a;--accent-ink:#06231d;--warn:#f2b13c;--danger:#ec5a5f;--x:#ec6a6a;--y:#6ccf7e;--z:#6aa6ec;--radius:6px;--mono:"IBM Plex Mono", ui-monospace, Consolas, monospace;--sans:"IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--text);font:13px/1.4 var(--sans);margin:0;overflow:hidden}button,input,select,textarea{font:inherit;color:inherit}#app{grid-template:"top top top"46px"tools view panel"1fr"status status status"28px/58px 1fr 312px;height:100vh;display:grid}.topbar{background:var(--bg-2);border-bottom:1px solid var(--line);grid-area:top;align-items:center;gap:18px;padding:0 12px;display:flex}.brand{letter-spacing:.02em;white-space:nowrap;align-items:center;gap:9px;font-weight:600;display:flex}.logo{border-radius:6px;width:28px;height:28px;display:block}a.brand{color:var(--text);border-radius:var(--radius);margin-left:-3px;padding:3px 6px 3px 3px;text-decoration:none}a.brand:hover{background:var(--bg-3)}a.brand:hover .help-badge{color:var(--accent);border-color:var(--accent)}.help-badge{border:1px solid var(--line-2);width:16px;height:16px;color:var(--text-3);font:500 10px/1 var(--mono);border-radius:50%;place-items:center;display:grid}.top-actions{flex:1;gap:6px;display:flex}.top-right{gap:6px;display:flex}.view-seg{margin-left:10px}.view-seg .seg{flex:none;padding:5px 10px}.btn{background:var(--bg-3);border:1px solid var(--line-2);border-radius:var(--radius);cursor:pointer;white-space:nowrap;padding:5px 10px;transition:background .12s,border-color .12s}.btn:hover:not(:disabled){background:#252a31;border-color:#4a525d}.btn:disabled{opacity:.4;cursor:default}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}.btn.primary:hover:not(:disabled){background:#56d3b8;border-color:#56d3b8}.btn.danger{color:#ffb3b5;border-color:#6b2e31}.btn.small{padding:3px 8px;font-size:12px}.btn-row{flex-wrap:wrap;gap:6px;margin:6px 0 2px;display:flex}.btn-row .btn{flex:1}.link{color:var(--accent);cursor:pointer;background:0 0;border:none;padding:0;text-decoration:underline}.toolbar{background:var(--bg-2);border-right:1px solid var(--line);scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;flex-direction:column;grid-area:tools;align-items:center;gap:2px;min-height:0;padding:4px 0 8px;display:flex;overflow:hidden auto}.toolbar::-webkit-scrollbar{width:5px;height:0}.toolbar::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:3px}.toolbar::-webkit-scrollbar-track{background:0 0}.toolbar>*{flex:none}.tool-group{text-align:center;letter-spacing:.06em;text-transform:uppercase;width:100%;color:var(--text-3);border-top:1px solid var(--line);cursor:default;white-space:nowrap;text-overflow:clip;margin-top:3px;padding:7px 0 2px;font-size:8px;font-weight:600;overflow:hidden}.tool-group:first-child{border-top:0;margin-top:0;padding-top:3px}.tool{border-radius:var(--radius);cursor:pointer;width:44px;height:44px;color:var(--text-2);background:0 0;border:1px solid #0000;flex-direction:column;justify-content:center;align-items:center;gap:1px;display:flex;position:relative}.tool svg{stroke:currentColor;fill:none;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px}.tool .key{font:9px var(--mono);color:var(--text-3);position:absolute;top:2px;right:4px}.tool .name{letter-spacing:.02em;font-size:8.5px}.tool:hover{background:var(--bg-3);color:var(--text)}.tool.active{border-color:var(--accent-2);color:#d8fff5;background:#1b3a33}.tool.active .key{color:#8fd8c6}.toolbar .sep{background:var(--line);width:30px;height:1px;margin:5px 0}.viewport{background:#15171a;grid-area:view;position:relative;overflow:hidden}.viewport canvas{touch-action:none;display:block}.empty{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.empty-card{pointer-events:auto;text-align:center;border:1px dashed var(--line-2);background:#15171acc;border-radius:12px;padding:28px 36px}.empty-card h1{margin:0 0 10px;font-size:20px;font-weight:600}.empty-logo{filter:drop-shadow(0 4px 18px #3fc8a838);width:150px;height:150px;margin:-6px auto 10px;display:block}.empty.hidden{display:none}.start-shapes{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.muted{color:var(--text-3);font-size:12px}.drop{border:2px dashed var(--accent);pointer-events:none;background:#3fc1a515;border-radius:12px;justify-content:center;align-items:center;font-size:18px;display:none;position:absolute;inset:10px}.drop.show{display:flex}.busy{z-index:20;background:#0f1113aa;justify-content:center;align-items:center;gap:12px;font-weight:500;display:none;position:absolute;inset:0}.busy.show{display:flex}.spinner{border:3px solid #fff2;border-top-color:var(--accent);border-radius:50%;width:22px;height:22px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.toasts{z-index:30;flex-direction:column;gap:6px;max-width:460px;display:flex;position:absolute;bottom:12px;left:12px}.toast{background:var(--bg-3);border:1px solid var(--line-2);border-left:3px solid var(--accent);border-radius:var(--radius);align-items:center;gap:10px;padding:8px 10px;animation:.18s ease-out toast-in;display:flex;box-shadow:0 6px 20px #0008}.toast.warn{border-left-color:var(--warn)}.toast.error{border-left-color:var(--danger)}.toast .msg{flex:1}.toast .x{color:var(--text-3);cursor:pointer;background:0 0;border:none;font-size:15px}@keyframes toast-in{0%{opacity:0;transform:translateY(6px)}}.boolean-bar{background:var(--bg-3);border:1px solid var(--line-2);z-index:15;border-radius:10px;align-items:center;gap:8px;padding:6px 8px 6px 12px;display:none;position:absolute;top:12px;left:50%;transform:translate(-50%);box-shadow:0 6px 24px #0009}.boolean-bar.show{display:flex}.panel{background:var(--bg-2);border-left:1px solid var(--line);scrollbar-width:thin;scrollbar-color:var(--line-2) transparent;grid-area:panel;min-height:0;overflow:hidden auto}.panel::-webkit-scrollbar{width:6px;height:0}.panel::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:3px}.panel-group{letter-spacing:.1em;text-transform:uppercase;color:var(--accent);opacity:.75;border-bottom:1px solid var(--line);padding:12px 12px 4px;font-size:10px;font-weight:700}.tool-hint{color:var(--text-2);background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);padding:6px 8px;font-size:12px;line-height:1.4}.tool-hint b{color:var(--text)}.tool-hint kbd{font:10px var(--mono);border:1px solid var(--line-2);color:var(--text-2);border-radius:3px;padding:0 4px}.brush-block{flex-direction:column;gap:6px;display:flex}.sym-wrap{align-items:center;gap:6px;display:flex}.sym-wrap .segmented{flex:1}.btn.icon-btn{padding:3px 8px;font-size:13px;line-height:1}.section{border-bottom:1px solid var(--line)}.section>summary{cursor:pointer;text-transform:uppercase;letter-spacing:.07em;color:var(--text-2);-webkit-user-select:none;user-select:none;align-items:center;gap:8px;padding:10px 12px;font-size:12px;font-weight:600;list-style:none;display:flex}.section>summary::-webkit-details-marker{display:none}.section>summary:before{content:"";border-right:1.5px solid var(--text-3);border-bottom:1.5px solid var(--text-3);width:6px;height:6px;transition:transform .15s;transform:rotate(-45deg)}.section[open]>summary:before{transform:rotate(45deg)}.section>summary:hover{color:var(--text)}.section.highlight>summary{color:var(--accent)}.section-body{flex-direction:column;gap:6px;padding:0 12px 12px;display:flex}.subhead{color:var(--text-3);text-transform:uppercase;letter-spacing:.06em;margin-top:8px;font-size:11px}.row{grid-template-columns:96px 1fr;align-items:center;gap:8px;min-height:26px;display:grid}.row>label{color:var(--text-2);font-size:12px}.slider-row{grid-template-columns:74px 1fr 76px}.num-wrap{align-items:center;gap:4px;display:flex}.num-wrap.wide input{width:100%}.unit{color:var(--text-3);font:11px var(--mono);min-width:14px}input[type=number],input[type=text],select,textarea{background:var(--bg);border:1px solid var(--line-2);width:100%;min-width:0;font-family:var(--mono);border-radius:4px;padding:3px 6px;font-size:12px}select{font-family:var(--sans)}input:focus,select:focus{outline:1px solid var(--accent-2);border-color:var(--accent-2)}input[type=number]::-webkit-inner-spin-button{opacity:.4}input[type=range]{width:100%;accent-color:var(--accent)}.check-row{cursor:pointer;color:var(--text-2);gap:8px;font-size:12px;display:flex}.check-row input{accent-color:var(--accent);margin:0}.vec3{grid-template-columns:70px 1fr 18px}.vec3-inputs{grid-template-columns:repeat(3,1fr);gap:4px;display:grid}.axis{align-items:center;gap:3px;display:flex}.axis b{font:600 10px var(--mono)}.axis-x b{color:var(--x)}.axis-y b{color:var(--y)}.axis-z b{color:var(--z)}.segmented{border:1px solid var(--line-2);border-radius:var(--radius);display:flex;overflow:hidden}.seg{background:var(--bg);border:none;border-right:1px solid var(--line-2);cursor:pointer;color:var(--text-2);flex:1;padding:5px 4px;font-size:12px}.seg:last-child{border-right:none}.seg:hover{color:var(--text)}.seg.active{color:#d8fff5;background:#1b3a33}.seg.axis-x.active{color:#ffd0d0;background:#4a2326}.seg.axis-y.active{color:#d0ffd9;background:#20402a}.seg.axis-z.active{color:#d0e4ff;background:#1f3350}.hint{color:var(--text-3);margin:0;font-size:11.5px}.result-box{font:11.5px/1.5 var(--mono);background:var(--bg);border:1px solid var(--line);color:var(--text-2);white-space:pre-wrap;border-radius:4px;padding:6px 8px}.result-box .ok{color:var(--accent)}.result-box .bad{color:var(--danger)}.legend{border-radius:4px;height:8px;margin-top:2px;display:flex;overflow:hidden}.legend-labels{font:10px var(--mono);color:var(--text-3);justify-content:space-between;display:flex}.statusbar{background:var(--bg-2);border-top:1px solid var(--line);font:11.5px var(--mono);color:var(--text-2);white-space:nowrap;grid-area:status;align-items:center;gap:18px;padding:0 12px;display:flex;overflow:hidden}.statusbar .ok{color:var(--accent)}.statusbar .bad{color:var(--danger)}.statusbar .spacer{flex:1}.statusbar .msg{color:var(--text-3)}kbd{font:10px var(--mono);background:var(--bg);border:1px solid var(--line-2);color:var(--text-2);border-bottom-width:2px;border-radius:3px;padding:0 4px}.shortcuts{color:var(--text-2);grid-template-columns:auto 1fr;gap:3px 10px;font-size:11.5px;display:grid}textarea{resize:vertical;font-family:var(--sans);font-size:13px;line-height:1.35}.textarea-row{align-items:start}.textarea-row>label{padding-top:4px}.palette{grid-template-columns:repeat(4,1fr);gap:6px;display:grid}.swatch{background:var(--bg);border:1px solid var(--line-2);border-radius:var(--radius);cursor:pointer;font:600 12px var(--mono);color:var(--text-2);align-items:center;gap:6px;padding:4px 6px;display:flex;position:relative}.swatch:hover{color:var(--text);border-color:#4a525d}.swatch.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset;color:var(--text)}.swatch .chip{border-radius:4px;flex:none;width:16px;height:16px;box-shadow:inset 0 0 0 1px #0007}.swatch input[type=color]{opacity:0;pointer-events:none;position:absolute;inset:0}.swatch .edit{color:var(--text-3);cursor:pointer;background:0 0;border:none;margin-left:auto;padding:0 2px;font-size:10px}.swatch .edit:hover{color:var(--accent)}.paint-stats{font:11px var(--mono);color:var(--text-3)}.restore{border:1px solid var(--accent);border-radius:var(--radius);text-align:left;background:#14261f;margin-bottom:14px;padding:10px 12px}.restore-title{color:#d8fff5;font-weight:600}.restore-info{color:var(--text-2);margin:3px 0 4px;font-size:12px}.statusbar .saved{color:var(--text-3);white-space:nowrap}.btn.toggle.active{border-color:var(--accent);color:#d8fff5;background:#1b3a33}.face-info{line-height:1.5}.face-info .bad{color:#ff9b9b}
