:root{--hud-bg: rgba(28, 22, 16, .62);--hud-border: rgba(232, 178, 58, .55);--accent-gold: #e8b23a;--accent-gold-bright: #f5cc5a;--text-gold: #f0c24a;--text-primary: #f5efe3;--text-muted: #b9ae98;--text-stroke: rgba(20, 14, 8, .85);--loading-bg: #1a140d;--font-display: "Rubik", system-ui, sans-serif;--font-ui: "Inter", system-ui, sans-serif;--shadow-panel: 0 4px 16px rgba(0, 0, 0, .4), inset 0 1px 0 rgba(255, 224, 176, .15);--shadow-inner: inset 0 2px 6px rgba(0, 0, 0, .35);--text-shadow: 0 2px 4px rgba(0, 0, 0, .6);--gold-glow: 0 0 12px rgba(245, 204, 90, .55);--ease-punch: cubic-bezier(.34, 1.56, .64, 1);--ease-smooth: cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#0d0a07}#app{position:fixed;inset:0}canvas{display:block;width:100%;height:100%}#hud{position:fixed;inset:0;pointer-events:none;font-family:var(--font-ui);z-index:10}.hud-top{position:absolute;top:20px;left:20px;right:20px;display:flex;justify-content:flex-end;align-items:flex-start}.hud-buttons{display:flex;gap:10px}.icon-btn{pointer-events:auto;width:44px;height:44px;border-radius:50%;background:var(--hud-bg);border:2px solid var(--hud-border);box-shadow:var(--shadow-panel);color:var(--text-gold);font-size:20px;display:grid;place-items:center;cursor:pointer;transition:transform .12s var(--ease-smooth),background .12s}.icon-btn:hover{transform:scale(1.06);background:#362a1ccc}.icon-btn:active{transform:scale(.96)}.float-num{position:absolute;font-family:var(--font-display);font-weight:800;font-size:26px;color:var(--text-gold);text-shadow:0 2px 5px rgba(0,0,0,.7);-webkit-text-stroke:1px var(--text-stroke);pointer-events:none;will-change:transform,opacity;transform:translate(-50%,-50%);white-space:nowrap}.float-num.crit{font-size:40px;color:var(--accent-gold-bright)}.settings-panel{pointer-events:auto;position:absolute;top:76px;right:20px;width:230px;padding:16px;background:linear-gradient(160deg,#30261aeb,#1c1610eb);border:2px solid var(--hud-border);border-radius:14px;box-shadow:var(--shadow-panel);color:var(--text-primary);opacity:0;transform:translateY(-8px) scale(.97);transition:opacity .24s var(--ease-smooth),transform .24s var(--ease-smooth);visibility:hidden}.settings-panel.open{opacity:1;transform:none;visibility:visible}.settings-panel h3{margin:0 0 12px;font-family:var(--font-display);font-size:16px;color:var(--text-gold);letter-spacing:.5px}.settings-row{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.settings-row label{font-size:13px;color:var(--text-muted)}.settings-row input[type=range]{width:100%;accent-color:var(--accent-gold)}.toggle-row{display:flex;align-items:center;justify-content:space-between;font-size:13px;color:var(--text-primary)}.toggle-row input{accent-color:var(--accent-gold);width:18px;height:18px}#loading{position:fixed;inset:0;z-index:100;background:radial-gradient(circle at 50% 38%,#3a2c18 0%,var(--loading-bg) 70%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;transition:opacity .4s var(--ease-smooth);font-family:var(--font-ui)}#loading.hide{opacity:0;pointer-events:none}.loading-logo{font-family:var(--font-display);font-weight:800;font-size:42px;color:var(--text-gold);text-shadow:0 4px 18px rgba(232,178,58,.4),var(--text-shadow);letter-spacing:1px;display:flex;align-items:center;gap:14px}.loading-logo .pick{font-size:46px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}.loading-sub{color:var(--text-muted);font-size:15px;margin-top:-10px}.progress-track{width:300px;height:12px;background:#00000073;border:1px solid rgba(232,178,58,.3);border-radius:999px;box-shadow:var(--shadow-inner);overflow:hidden}.progress-fill{height:100%;width:100%;transform:scaleX(0);transform-origin:left center;background:linear-gradient(90deg,var(--accent-gold),var(--accent-gold-bright));border-radius:999px;box-shadow:0 0 10px #f5cc5a99;transition:transform .2s var(--ease-smooth)}.loading-pct{color:var(--text-muted);font-size:13px}#gestureBar{position:fixed;top:14px;right:14px;z-index:30;display:flex;flex-direction:column;align-items:flex-end;gap:6px;pointer-events:none}.gesture-btn{pointer-events:auto;font-family:var(--font-display);font-weight:700;font-size:14px;color:#2a1c08;background:linear-gradient(180deg,var(--accent-gold-bright),var(--accent-gold));border:1px solid rgba(255,232,176,.7);border-radius:12px;padding:9px 14px;cursor:pointer;box-shadow:var(--shadow-panel),var(--gold-glow);transition:transform .14s var(--ease-punch),filter .14s ease}.gesture-btn:hover{transform:translateY(-1px) scale(1.02);filter:brightness(1.06)}.gesture-btn:active{transform:translateY(0) scale(.98)}.gesture-btn:disabled{opacity:.6;cursor:progress}.gesture-status{pointer-events:none;max-width:280px;text-align:right;font-family:var(--font-ui);font-size:11.5px;line-height:1.4;color:var(--text-muted);background:var(--hud-bg);border:1px solid var(--hud-border);border-radius:9px;padding:5px 9px;text-shadow:var(--text-shadow)}.gesture-status.active{color:var(--text-gold)}.gesture-status.error{color:#ff9b7a;border-color:#ff785a80}#gesturePanel{position:fixed;top:92px;right:14px;width:220px;height:165px;z-index:29;border-radius:12px;overflow:hidden;border:2px solid var(--hud-border);box-shadow:var(--shadow-panel);background:#0d0a07;transition:opacity .22s ease,transform .22s var(--ease-punch)}#gesturePanel.off{opacity:0;transform:scale(.92) translateY(-6px);pointer-events:none}#gesturePanel.on{opacity:1;transform:none}#gestureVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}#gestureOverlay{position:absolute;inset:0;width:100%;height:100%}#gestureBadge{position:absolute;left:0;right:0;bottom:0;font-family:var(--font-ui);font-size:10px;letter-spacing:.4px;color:var(--text-gold);background:linear-gradient(0deg,rgba(20,14,8,.85),transparent);padding:8px 8px 4px;text-align:center}.fist-dot{position:absolute;top:6px;left:6px;width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-size:15px;border-radius:999px;background:#140e088c;border:1px solid rgba(255,255,255,.18);filter:grayscale(1) opacity(.5);transition:filter 90ms ease,transform 90ms var(--ease-punch),box-shadow 90ms ease}.fist-dot.active{filter:none;transform:scale(1.12);box-shadow:0 0 12px #f5cc5acc;background:#e8b23a59}