:root{font:15px/1.5 system-ui,sans-serif;color:#e4eaf1;background:#0b111b;color-scheme:dark}*{box-sizing:border-box}body{margin:0}header{max-width:1440px;margin:auto;padding:23px 30px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #273040}a{color:#9dbfff;text-decoration:none}.brand{font-size:23px;letter-spacing:-.07em;font-weight:800;color:#fff}.brand span{font-size:11px;letter-spacing:.18em;margin-left:12px;color:#78d3bb}main{max-width:1440px;margin:auto;padding:26px 30px}.intro{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:22px}h1{font-size:29px;letter-spacing:-.03em;margin:0 0 5px}p{margin:6px 0;color:#aebacc}.file-button,button,select,input[type=number]{border:1px solid #354155;background:#182333;color:#eaf2ff;border-radius:6px;padding:9px 13px;font:inherit}button,.file-button{cursor:pointer}button:hover{background:#253650}button:disabled{opacity:.4;cursor:default}.primary,.file-button{background:#205547;border-color:#388b74;color:#ecfff7}.file-button input{display:none}.file-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.native-button{background:#284a65;border-color:#4e91bf}.layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px}.panel{background:#111b29;border:1px solid #293448;border-radius:9px;overflow:hidden}.panel-header{padding:13px 17px;border-bottom:1px solid #293448;display:flex;justify-content:space-between;gap:10px;align-items:center}.tag{font:11px ui-monospace,monospace;text-transform:uppercase;letter-spacing:.07em;color:#81d6bb}.viewport{min-height:460px;display:grid;align-items:center;background:#f8fafc;color:#142033;position:relative}.empty{text-align:center;padding:50px;max-width:460px;margin:auto}.empty h2{font-size:22px;margin-bottom:10px}.empty p{color:#526078}.viewer-host,.native-canvas{width:100%;display:block;aspect-ratio:4/3;max-height:72vh}.native-canvas{background:#0b111b}.transport{padding:16px;border-top:1px solid #293448}.controls{display:flex;align-items:center;flex-wrap:wrap;gap:8px}input[type=range]{width:100%;accent-color:#70d7b5;margin:14px 0}input[type=number]{width:105px;padding:7px}.frame-label{font:13px ui-monospace,monospace;color:#94a9c4;margin-left:auto}.statusline{display:flex;justify-content:space-between;gap:12px;margin-top:12px;font:12px ui-monospace,monospace;color:#8ba0bc}.notice{font-size:12px;margin-top:14px;color:#8d9eb5}.sidebar{padding:17px}.sidebar h2{font-size:16px;margin:0 0 13px}.player-card{padding:13px;background:#192535;border-radius:6px;margin-bottom:10px;border-left:3px solid #76c6b2}.player-name{font-weight:650}.player-meta{font-size:12px;color:#92a8c2}.player-live{font:13px ui-monospace,monospace;margin-top:7px}.toggles{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;padding:15px 0}table{width:100%;font-size:12px;border-collapse:collapse}td,th{text-align:left;padding:7px 4px;border-bottom:1px solid #2a3547}th{color:#a4b6cd;font-weight:500}pre{white-space:pre-wrap;overflow-wrap:anywhere;font:12px/1.5 ui-monospace,monospace;max-height:430px;overflow:auto;margin:0;padding:14px;background:#0d1521}details{border:1px solid #293448;border-radius:6px;margin-top:13px}summary{cursor:pointer;padding:10px;font-size:13px}.error{background:#482531;color:#ffd2d8;border:1px solid #865062;border-radius:7px;padding:13px;margin-bottom:17px}.loading{color:#97aecb}.shortcuts{font-size:12px;color:#7f94ae;margin-top:12px}.sr-only{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #8ce7c7;outline-offset:3px}@media(max-width:1000px){.layout{grid-template-columns:1fr}.intro{align-items:flex-start}.viewport{min-height:260px}.sidebar{display:block}main,header{padding:18px}.frame-label{margin-left:0}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}}