:root{--planet-x:84%;--planet-y:70%}body{font-size:15px}.studio{display:grid;grid-template-columns:310px 1fr;gap:1rem;align-items:start}.panel,.toolbar,.viewport,.results{background:var(--glass-sheen),var(--glass);border:1px solid var(--glass-border);box-shadow:var(--glass-edge),var(--shadow);border-radius:var(--r-lg)}.controls{padding:1rem;display:flex;flex-direction:column;gap:1.2rem;position:sticky;top:92px}.head{text-transform:uppercase;letter-spacing:.13em;font-size:.7rem;font-weight:700;color:var(--faint);margin-bottom:.55rem}.drop{width:100%;padding:1rem;border:1.5px dashed var(--border-2);border-radius:14px;background:rgba(255,255,255,.03);color:var(--text);font:inherit;cursor:pointer}.drop strong,.drop small{display:block}.drop small,.hint{color:var(--faint);font-size:.72rem}.field{display:block;font-size:.75rem;color:var(--dim);margin:.65rem 0}.field select,.field input{display:block;width:100%;margin-top:.25rem;background:var(--inset);border:1px solid var(--glass-border);border-radius:9px;color:var(--text);padding:.4rem;font:inherit}.wide{width:100%;margin-top:.5rem}.ratio{display:grid;grid-template-columns:48px 1fr 48px;align-items:center;gap:.4rem;font-size:.72rem;color:var(--dim);margin:.5rem 0}.ratio input{width:100%;accent-color:var(--accent)}.work{min-width:0}.toolbar{display:flex;align-items:center;gap:.4rem;padding:.5rem .7rem;margin-bottom:.8rem}.toolbar #status{margin-left:auto;color:var(--dim);font-size:.75rem}.tab{border:1px solid transparent;background:none;color:var(--dim);border-radius:999px;padding:.35rem .7rem;font:inherit;font-size:.75rem;cursor:pointer}.tab.active{background:var(--glass-strong);border-color:var(--glass-border);color:var(--accent)}.viewport{height:clamp(380px,65vh,720px);position:relative;overflow:hidden;background:radial-gradient(circle at 50% 40%,#30353a,#101214 72%)}.viewport canvas{width:100%;height:100%;display:block;touch-action:none}.badge{position:absolute;left:12px;top:12px;border-radius:999px;padding:.25rem .6rem;background:rgba(0,0,0,.5);font-size:.62rem;color:var(--dim);pointer-events:none}.results{margin-top:.8rem;padding:.75rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.5rem}.result{padding:.65rem;border-radius:12px;background:rgba(255,255,255,.035);font-size:.73rem;color:var(--dim)}.result b{display:block;color:var(--text);font-size:.85rem}#toast{position:fixed;right:18px;bottom:18px;padding:.6rem 1rem;border-radius:999px;background:var(--glass-strong);border:1px solid var(--glass-border);opacity:0;transition:.2s;z-index:20}#toast.show{opacity:1}@media(max-width:850px){.studio{grid-template-columns:1fr}.controls{position:static}.viewport{height:60vw;min-height:340px}}