:root{color:#e8edf5;font-synthesis:none;text-rendering:optimizelegibility;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background:#0e131c;font-family:Inter,Pretendard,system-ui,sans-serif}*{box-sizing:border-box}[hidden]{display:none!important}body{min-width:320px;margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.5}:focus-visible{outline-offset:4px;outline:2px solid #74b8ff}.viewer{width:min(100%,1360px);margin:0 auto;padding:40px 28px}.page-header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:28px;display:flex}.eyebrow{color:#8fb8ed;letter-spacing:.2em;margin:0 0 8px;font-size:11px;font-weight:700}h1{letter-spacing:-.04em;margin:0;font-size:clamp(24px,4vw,30px)}h2{margin:0;font-size:15px;font-weight:600}.mode-label{color:#acbcd0;white-space:nowrap;border:1px solid #2c394a;border-radius:6px;padding:7px 10px;font-size:12px}.status-grid{grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px;display:grid}.status-item{background:#151d29;border:1px solid #263142;border-radius:10px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:17px 20px;display:flex}.status-item>span{color:#9facbf;font-size:12px}.status-item strong{align-items:center;gap:7px;font-size:12px;font-weight:600;display:flex}.status-item strong:before{content:"";background:currentColor;border-radius:50%;width:6px;height:6px}[data-tone=good]{color:#79dbb0}[data-tone=warn]{color:#f4c374}[data-tone=bad]{color:#ff9d9d}[data-tone=neutral]{color:#a5b1c3}.screen-panel{background:#141c27;border:1px solid #263142;border-radius:12px;overflow:hidden}.screen-heading{justify-content:space-between;align-items:center;gap:12px;padding:17px 22px;display:flex}#resolution{color:#93a2b7;font-variant-numeric:tabular-nums;font-size:12px}.viewer-screen{aspect-ratio:4/3;background:#05080d;place-items:center;width:100%;display:grid;position:relative}canvas{object-fit:contain;width:100%;height:100%;display:block;position:absolute;inset:0}.placeholder{text-align:center;color:#9aaac0;max-width:440px;padding:28px;font-size:14px;line-height:1.7}.placeholder-icon{color:#425878;margin-bottom:12px;font-size:40px;display:block}.notice{color:#a5b4c8;border-top:1px solid #263142;min-height:48px;margin:0;padding:15px 22px;font-size:12px;line-height:1.5}.connection-panel{background:#151d29;border:1px solid #263142;border-radius:12px;margin-top:20px;padding:22px}.description{color:#93a2b7;margin:8px 0 22px;font-size:12px;line-height:1.6}.fields{grid-template-columns:1fr 1fr;gap:20px;display:grid}label{color:#bac7d9;flex-direction:column;gap:8px;font-size:12px;display:flex}input{color:#e8edf5;background:#0e1520;border:1px solid #34435a;border-radius:6px;width:100%;min-width:0;height:42px;padding:10px 12px;font-size:13px}input:disabled{color:#8b9bb1;border-color:#29364a}small{color:#8f9eb4;font-size:11px;line-height:1.5}.form-actions{gap:10px;margin-top:22px;display:flex}button{color:#0b1b32;background:#82b4fa;border:1px solid #72a8f4;border-radius:6px;min-height:40px;padding:10px 18px;font-size:12px;font-weight:700}button:hover:enabled{background:#a2c9ff}button.secondary{color:#c0cde0;background:0 0;border-color:#3b4d66}button.secondary:hover:enabled{background:#25334a}.form-error{color:#ffb4ac;margin:16px 0 0;font-size:12px;line-height:1.6}.workspace{grid-template-columns:minmax(0,1fr) 460px;align-items:start;gap:20px;display:grid}.screen-panel{position:sticky;top:20px}.control-panel{background:#151d29;border:1px solid #263142;border-radius:12px;min-width:0;padding:22px}.control-heading{justify-content:space-between;align-items:center;gap:12px;display:flex}.control-heading .mode-label{display:inline-block}.control-actions{flex-wrap:wrap;gap:8px;margin-top:18px;display:flex}.control-actions button{padding:8px 12px}.control-actions [aria-pressed=true]{color:#a2c9ff;opacity:1;background:#20344e;border-color:#82b4fa}.control-reason{color:#a8c4e7;min-height:38px;margin:14px 0 8px;font-size:12px;line-height:1.6}.control-help,.control-footnote{color:#93a2b7;margin:0 0 14px;font-size:11px;line-height:1.6}.finger-controls{gap:12px;display:grid}.finger-group{border:1px solid #2c394b;border-radius:8px;min-width:0;margin:0;padding:10px 12px 12px}.finger-group legend{color:#c5d4e8;padding:0 6px;font-size:12px;font-weight:600}.joint-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.joint-control{gap:4px;font-size:11px}.joint-control input[type=range]{accent-color:#82b4fa;cursor:pointer;border:0;height:28px;padding:0}.joint-control input:disabled{cursor:default;opacity:.45}.joint-values{color:#93a2b7;font-variant-numeric:tabular-nums;flex-direction:column;gap:3px;font-size:10px;display:flex}.joint-values>span:first-child{color:#c6dcfa}.request-heading{justify-content:space-between;align-items:center;gap:10px;margin-top:22px;display:flex}.request-heading h3{margin:0;font-size:12px}#queue-status{color:#93a2b7;font-size:10px}.result-notice{color:#bacbe0;min-height:32px;margin:10px 0 0;font-size:11px;line-height:1.6}.request-history{margin:0;padding:0;list-style:none}.request-history li{color:#93a2b7;border-bottom:1px solid #253143;justify-content:space-between;gap:10px;padding:8px 0;font-size:10px;display:flex}.request-history strong{font-size:10px;font-weight:500}.control-footnote{margin:12px 0 0}@media (width<=1000px){.workspace{grid-template-columns:minmax(0,1fr)}.screen-panel{position:static}.finger-controls{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=640px){.viewer{padding:24px 16px}.mode-label{display:none}.status-grid{gap:8px}.status-item{flex-direction:column;align-items:flex-start;padding:13px 10px}.status-item>span,.status-item strong{font-size:11px}.screen-heading{padding:16px}.notice{padding:14px 16px}.connection-panel{padding:18px}.fields{grid-template-columns:1fr;gap:18px}.control-panel{padding:18px}.finger-controls{grid-template-columns:minmax(0,1fr)}.joint-grid{gap:12px}}