:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#dfebea;background:#101c23;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button{border:1px solid #38525d;background:#1a303a;color:#e4eded;border-radius:7px;padding:.65rem .85rem;cursor:pointer;transition:background .15s}button:hover{background:#2b4a55}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #f2c581;outline-offset:3px}main{min-height:100vh;padding:24px 30px}header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}.eyebrow{font:11px ui-monospace,monospace;letter-spacing:.18em;color:#8eaeae}h1{font-size:clamp(24px,3vw,38px);font-weight:500;letter-spacing:-.04em;margin:8px 0 0}h2{font-weight:500;font-size:28px;margin:6px 0}h3{font-weight:550;font-size:15px;letter-spacing:.02em;margin:0 0 14px}.header-actions,.row{display:flex;align-items:center;flex-wrap:wrap;gap:9px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:28px}.viewport{position:relative;width:100%;height:clamp(340px,53vh,800px);border:1px solid #38525d;border-radius:14px;overflow:hidden;background:radial-gradient(ellipse at center,#304755,#0e1a22)}.viewport canvas{display:block;width:100%;height:100%}.crosshair{position:absolute;left:50%;top:50%;pointer-events:none;color:#faf3dabb;font-size:27px;font-weight:200}.view-label{position:absolute;bottom:15px;left:18px;font:10px ui-monospace,monospace;letter-spacing:.12em;background:#0a161bbb;padding:8px;border-radius:4px}.gpu-error{position:absolute;top:30%;left:10%;right:10%;padding:22px;background:#14272e;border:1px solid #e9bc75;line-height:1.6}.stage-caption{display:flex;align-items:center;justify-content:space-between;margin-top:24px}.badge{font:11px ui-monospace,monospace;border:1px solid #456370;border-radius:99px;padding:10px 14px;color:#bed1d5}.intro{font-size:17px;line-height:1.6;color:#b7c6ca;max-width:750px}.nav-grid{display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #2e4650;border-bottom:1px solid #2e4650;padding:20px 0}.pad{text-align:center;flex-shrink:0}.pad button{min-width:44px;padding:8px;font-size:20px}.pad>button{margin-bottom:4px}.pad div{display:flex;gap:4px}.pose{display:grid;gap:7px}.pose b{font:10px ui-monospace;color:#839fa8;letter-spacing:.1em}code{font:12px ui-monospace,monospace;color:#efc581;overflow-wrap:anywhere}.small{font-size:12px;color:#9ab0b9;line-height:1.65}.trace{background:#13242b;border-radius:10px;padding:18px;margin-top:25px}.trace .row{justify-content:space-between}.trace span{font:11px ui-monospace;color:#9bb4bc}.trace ol{padding-left:20px;font-size:12px;color:#b7cbd0}.trace li{padding:5px}.trace li code{display:block;margin-top:4px}.trace input{width:100%}.status{margin-top:18px;color:#e4c998;font-size:13px;min-height:25px}.warning{color:#f8c0a1;border-left:3px solid;padding:12px;font-size:13px}aside{display:flex;flex-direction:column;gap:14px}aside section,aside details{border:1px solid #2d444f;padding:18px;border-radius:10px;background:#14252e}aside p{font-size:12px;line-height:1.65;color:#a7bdc6}.study-buttons{display:grid;gap:6px;margin:13px 0}.study-buttons button{text-align:left;background:#1d3440}.study-buttons button:first-child{border-color:#9d8460}label{display:block;color:#aabfc5;font-size:12px;margin-bottom:12px}label input:not([type=checkbox]),select,textarea{display:block;width:100%;margin-top:6px;padding:9px;border:1px solid #3b5561;border-radius:5px;background:#0e1d25;color:#e5efed}input[type=range],input[type=checkbox]{accent-color:#d5ae74}.quiet{display:flex;align-items:center;gap:7px;margin:0}.triple,.pose-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.triple label{min-width:0}textarea{height:240px;font:11px ui-monospace;resize:vertical}.upload{margin-top:16px}summary{cursor:pointer;font-size:13px;color:#d5e2e3}details[open] summary{margin-bottom:16px}footer{font:9px ui-monospace;letter-spacing:.12em;color:#718e99;margin-top:35px;border-top:1px solid #2d444f;padding:22px 0}@media(min-width:1600px){.layout{grid-template-columns:minmax(0,1fr) 400px}.viewport{height:62vh}}@media(max-width:900px){main{padding:18px}.layout{grid-template-columns:1fr}header{align-items:flex-start}.header-actions{justify-content:flex-end}.nav-grid{flex-wrap:wrap}.viewport{height:50vh;min-height:320px}aside{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){header{flex-direction:column}.header-actions{justify-content:flex-start}aside{display:flex}.pose code{font-size:10px}.stage-caption h2{font-size:22px}.badge{font-size:9px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
