.ui-layer{position:fixed;inset:0;z-index:10;pointer-events:none;display:flex;flex-direction:column}.ui-layer>*{pointer-events:auto}.panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:18px;padding:32px;backdrop-filter:blur(10px) saturate(140%);-webkit-backdrop-filter:blur(10px) saturate(140%);box-shadow:0 8px 60px #b400ff2e,inset 0 0 0 1px #ffffff0a}.btn{position:relative;display:inline-flex;align-items:center;gap:10px;padding:14px 26px;font-size:18px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text);background:linear-gradient(135deg,#ff2f8a29,#00e6ff29);border:1px solid rgba(255,255,255,.16);border-radius:999px;cursor:pointer;transition:transform .12s ease,box-shadow .22s ease,border-color .22s ease}.btn:hover{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 0 30px #ff2f8a66;transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent-3));border-color:transparent;box-shadow:0 0 30px #ff2f8a8c}.btn.ghost{background:transparent}.hud{position:absolute;inset:0;pointer-events:none;font-variant-numeric:tabular-nums;z-index:15}.hud .corner{position:absolute;padding:12px 18px;background:#0802188c;border:1px solid rgba(255,255,255,.08);border-radius:14px;backdrop-filter:blur(6px)}.hud .corner.tl{top:16px;left:16px}.hud .corner.tr{top:16px;right:16px}.hud .corner.bl{bottom:16px;left:16px}.hud .label{color:var(--muted);font-size:11px;letter-spacing:.18em;text-transform:uppercase}.hud .value{font-size:28px;font-weight:700;line-height:1.1;color:var(--text);text-shadow:var(--hud-shadow)}.hud .value.huge{font-size:56px;letter-spacing:-.02em}.hud .combo{position:absolute;top:16px;left:50%;transform:translate(-50%);padding:6px 18px;border-radius:999px;background:linear-gradient(135deg,#ff2f8a4d,#b400ff4d);color:#fff;font-weight:800;letter-spacing:.12em;text-transform:uppercase;border:1px solid rgba(255,255,255,.18)}@keyframes catch-toast-flash{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}15%{opacity:1;transform:translate(-50%,-52%) scale(1.15)}70%{opacity:1;transform:translate(-50%,-52%) scale(1)}to{opacity:0;transform:translate(-50%,-62%) scale(.95)}}.catch-toast-flash{animation:catch-toast-flash 1s ease-out forwards}.catch-toast-text{font-size:clamp(56px,10vw,120px);font-weight:900;letter-spacing:.02em;color:#ffe44a;text-shadow:0 0 12px #ffe44a,0 0 28px rgba(255,47,138,.85),0 0 56px rgba(180,0,255,.65),0 4px 0 rgba(0,0,0,.35);line-height:1}.catch-toast-points{font-size:clamp(20px,2.6vw,30px);font-weight:800;letter-spacing:.18em;color:#fff;text-shadow:0 0 14px rgba(255,228,74,.9),0 0 28px rgba(255,47,138,.5)}.menu{position:fixed;inset:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 30%,rgba(180,0,255,.2),transparent 50%)}.menu .title{font-size:clamp(48px,8vw,96px);font-weight:900;letter-spacing:-.02em;background:linear-gradient(135deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 40px rgba(255,47,138,.5);text-align:center;margin-bottom:8px}.menu .subtitle{text-align:center;color:var(--muted);letter-spacing:.2em;text-transform:uppercase;font-size:12px;margin-bottom:28px}.menu .diff-row{display:flex;gap:12px;justify-content:center;margin:18px 0 6px}.menu .diff-row .btn{padding:10px 18px;font-size:14px}.menu .diff-row .btn.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 0 22px #ff2f8a66}.webcam-pip{position:fixed;bottom:16px;right:16px;width:200px;height:150px;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.12);background:#00000080;pointer-events:none;z-index:9}.webcam-pip video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.webcam-pip .indicator{position:absolute;top:8px;left:8px;width:10px;height:10px;border-radius:50%;background:var(--bad);box-shadow:0 0 8px var(--bad);transition:background .2s ease}.webcam-pip .indicator.active{background:var(--good);box-shadow:0 0 8px var(--good)}.results-card{width:min(560px,92vw);text-align:center}.results-card h2{font-size:14px;letter-spacing:.3em;color:var(--muted);text-transform:uppercase;margin:0 0 12px}.results-card .score{font-size:96px;font-weight:900;background:linear-gradient(135deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;color:transparent}.results-card .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:24px 0}.results-card .stat .num{font-size:28px;font-weight:800}.results-card .stat .lbl{font-size:11px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}.calibration-overlay{position:fixed;inset:0;background:#05010fd9;display:grid;place-items:center;z-index:20}.calibration-card{width:min(440px,92vw);text-align:center}.calibration-card .ring{margin:18px auto;width:96px;height:96px;border-radius:50%;border:3px solid var(--accent);box-shadow:0 0 30px #ff2f8a99 inset;display:grid;place-items:center}.calibration-card .ring.ok{border-color:var(--good);box-shadow:0 0 30px #2dffaa66 inset}@media (max-width: 640px){.webcam-pip{width:130px;height:100px}.hud .value.huge{font-size:40px}.hud .corner{padding:8px 12px}}:root{--brand-blue: #24b1e6;--brand-navy: #1e4ca1;--brand-orange: #fbad17;--bg: #05091f;--bg-2: #0a1a3c;--accent: var(--brand-orange);--accent-2: var(--brand-blue);--accent-3: var(--brand-navy);--text: #f4f6ff;--muted: rgba(244, 246, 255, .6);--panel: rgba(10, 26, 60, .72);--panel-border: rgba(36, 177, 230, .45);--good: #2dffaa;--bad: #ff3b5c;--hud-shadow: 0 0 24px rgba(251, 173, 23, .55), 0 0 64px rgba(36, 177, 230, .3);font-family:Rajdhani,Inter,Segoe UI,system-ui,sans-serif;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:radial-gradient(circle at 50% 20%,#0c2c66 0%,var(--bg) 72%)}button{font-family:inherit}canvas{display:block;outline:none;touch-action:none}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}