@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=Sora:wght@500;600;700&display=swap";:root{--bg-top: #081424;--bg-bottom: #0f2a3a;--panel: rgba(10, 24, 41, .86);--panel-border: rgba(122, 178, 218, .28);--text: #eaf5ff;--muted: #b4c8dd;--accent: #53c4f1;--accent-soft: #82e3c0;--warn: #ffbb63;--danger: #ff7f7f;--radius: 14px}*{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0}body{font-family:IBM Plex Sans,Segoe UI,sans-serif;color:var(--text);background:radial-gradient(circle at 80% 8%,rgba(56,155,194,.24),transparent 48%),radial-gradient(circle at 18% 92%,rgba(63,162,124,.2),transparent 46%),linear-gradient(170deg,var(--bg-top),var(--bg-bottom))}h1,h2,h3,h4{font-family:Sora,IBM Plex Sans,sans-serif;letter-spacing:.01em;margin-top:0}.app-shell{width:min(1500px,100%);margin:0 auto;padding:1rem}.app-header{background:linear-gradient(120deg,#122d4ceb,#0f2435eb);border:1px solid rgba(115,176,219,.24);border-radius:var(--radius);padding:1rem;margin-bottom:1rem;display:grid;gap:.8rem}.app-header h1{font-size:clamp(1.3rem,2.4vw,2rem);margin-bottom:.4rem}.app-header p{margin:0;color:var(--muted)}.header-meta{color:#d8f2ff;font-size:.95rem;border-top:1px solid rgba(106,165,205,.23);padding-top:.7rem}.layout{display:grid;grid-template-columns:1fr;gap:1rem}.stage-column{display:grid;gap:1rem}.panel{border:1px solid var(--panel-border);background:var(--panel);border-radius:var(--radius);padding:.95rem;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.panel h3{margin-bottom:.7rem}.video-panel{overflow:hidden}.video-stage{position:relative;width:100%;aspect-ratio:4 / 3;border-radius:12px;overflow:hidden;background:linear-gradient(150deg,#061225,#11243f);border:1px solid rgba(121,180,212,.32)}.camera-feed,.mock-feed,.overlay-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.camera-feed{object-fit:cover}.mock-feed{display:grid;place-items:center;font-size:1.2rem;color:#c8e9ff;background:radial-gradient(circle at 25% 20%,rgba(77,161,244,.24),transparent 40%),radial-gradient(circle at 80% 74%,rgba(83,199,149,.2),transparent 35%),linear-gradient(140deg,#0a1f39,#0b1a2a)}.overlay-canvas{pointer-events:none}.warning-list{margin-top:.55rem;color:#ffd39b;font-size:.9rem}.muted{margin:.5rem 0 0;color:var(--muted)}.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.75rem}.angle-card{border:1px solid rgba(122,179,222,.2);background:linear-gradient(140deg,#0a1e34e6,#0b1625e6);border-radius:12px;padding:.8rem;min-height:152px}.angle-card__label{color:#cae9ff;font-size:.82rem;margin-bottom:.35rem}.angle-card__value{font-size:clamp(1.55rem,3.4vw,2.3rem);font-weight:700;letter-spacing:.01em;margin-bottom:.35rem}.angle-card__meta{font-size:.83rem;color:#b9d0e1}.panel__header{display:flex;align-items:baseline;justify-content:space-between;gap:.5rem;flex-wrap:wrap}.trend-chart svg{width:100%;height:250px;border-radius:10px;border:1px solid rgba(121,183,212,.27)}.trend-chart__legend{display:flex;gap:.55rem;font-size:.8rem;color:var(--muted)}.legend{padding:.16rem .42rem;border-radius:100px}.legend--raw{background:#91d7ff2b}.legend--filtered{background:#7af2a42b}.legend--calibrated{background:#ffd47b2b}.trend-chart__range{margin-top:.4rem;display:flex;justify-content:space-between;color:var(--muted);font-size:.82rem}.research-panel .research-grid{display:grid;grid-template-columns:1fr;gap:.8rem}.research-primary{border:1px solid rgba(141,196,233,.23);border-radius:10px;padding:.7rem;background:#08192b9e}.research-primary__label{color:#b9d5ea;font-size:.9rem}.research-primary__value{font-size:clamp(2rem,4.8vw,3rem);font-weight:700;margin-top:.32rem}.research-primary__meta{color:#c4dcee;font-size:.86rem}.finger-zoom{width:100%;max-width:250px;border-radius:12px;border:1px solid rgba(130,188,224,.28)}.finger-zoom__placeholder{border:1px dashed rgba(127,183,214,.37);border-radius:10px;min-height:190px;display:grid;place-items:center;color:#aac4d8}.state-compare{margin-top:.8rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.6rem}.state-compare article{border:1px solid rgba(122,181,215,.2);border-radius:10px;padding:.6rem;background:#08131fc2}.state-compare h4{margin:0 0 .35rem;font-size:.86rem;color:#bcd6e9}.controls-panel{display:grid;gap:.8rem;align-content:start}.control-grid{display:grid;gap:.65rem}label{display:grid;gap:.3rem;font-size:.9rem;color:#c5d7e8}select,input[type=range]{width:100%}select{border-radius:8px;border:1px solid rgba(130,186,220,.32);background:#0b1b2ceb;color:#eaf7ff;padding:.42rem .5rem}input[type=range]{accent-color:#79d3ff}.subpanel{border:1px solid rgba(118,173,205,.19);border-radius:10px;padding:.7rem;background:#0714219e}.subpanel h4{margin:0 0 .45rem;font-size:.95rem}.row-toggle{display:flex;align-items:center;gap:.5rem}.row-toggle input{accent-color:#77d5ff}.button-row{display:flex;flex-wrap:wrap;gap:.45rem}button{border:1px solid rgba(121,183,219,.32);border-radius:8px;background:linear-gradient(140deg,#0e2a3ff0,#091926f0);color:#e7f5ff;padding:.45rem .7rem;cursor:pointer;font-weight:600}button:hover{border-color:#95cced94}button:disabled{cursor:not-allowed;opacity:.6}button.recording{border-color:#f88181e6;background:linear-gradient(140deg,#521818eb,#381010eb)}.status-line{margin-top:.36rem;font-size:.85rem;color:#bfd4e7}.status-error{margin-top:.48rem;color:#ffd6d6;font-size:.84rem}.offset-grid{display:grid;gap:.48rem}.test-result{margin-top:.5rem;font-size:.86rem;color:#d3e7f7;display:grid;gap:.2rem}.instruction-list{margin:0;padding-left:1rem;color:#c4d8e8;display:grid;gap:.33rem}.history-list{display:grid;gap:.45rem}.history-item{border:1px solid rgba(126,184,218,.21);border-radius:10px;padding:.6rem;background:#07121dc2;font-size:.88rem;color:#c5d7e8}.debug-panel summary{cursor:pointer;font-weight:600}.debug-grid{margin-top:.6rem;display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.debug-panel pre{margin-top:.5rem;max-height:180px;overflow:auto;background:#050d16d6;border:1px solid rgba(123,175,204,.21);border-radius:9px;padding:.55rem;color:#d0e7f8;font-size:.77rem}@media (min-width: 1020px){.layout{grid-template-columns:minmax(0,1fr) 360px;align-items:start}.controls-panel{position:sticky;top:.8rem}.research-panel .research-grid{grid-template-columns:1fr 270px}}