:root{--bg: #05060a;--surface: #0e1018;--glass: rgba(255,255,255,.05);--glass-b: rgba(255,255,255,.1);--border: rgba(255,255,255,.1);--border-b: rgba(255,255,255,.18);--cyan: #00e5ff;--green: #00ff87;--orange: #ff6b35;--yellow: #ffd166;--txt: #f0f2ff;--txt-2: rgba(240,242,255,.65);--r-sm: 12px;--r-md: 20px;--r-lg: 28px;--r-xl: 32px;--ease-out-expo: cubic-bezier(.16,1,.3,1);font-family:Inter,system-ui,sans-serif;color:var(--txt);background:var(--bg)}*{box-sizing:border-box}body,#root,.app-root{margin:0;width:100%;height:100dvh;background:var(--bg)}.app-root:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:radial-gradient(circle at 10% 0%,rgba(0,229,255,.12),transparent 35%),radial-gradient(circle at 90% 100%,rgba(0,255,135,.09),transparent 35%);z-index:0}.topbar{position:fixed;top:0;left:0;right:0;z-index:30;display:flex;justify-content:space-between;align-items:center;padding:0 14px;background:#05060ab8;-webkit-backdrop-filter:blur(20px) saturate(1.3);backdrop-filter:blur(20px) saturate(1.3);border-bottom:1px solid var(--border)}.topbar-logo{display:flex;align-items:center;gap:8px;font-weight:800;letter-spacing:-.01em}.topbar-logo-icon{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--green));color:#03121a;box-shadow:0 0 18px #00e5ff59;font-size:12px}.topbar-game-name{font-size:12px;opacity:.85;text-transform:uppercase;letter-spacing:.06em}.topbar-btn{border:1px solid var(--border-b);border-radius:var(--r-sm);padding:8px 12px;background:var(--glass-b);color:var(--txt)}.game-stage{margin-top:56px;position:relative;overflow:hidden}.camera-video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:var(--camera-object-position, center center);transform:scaleX(-1)}.game-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10}.spotlight-frame{position:absolute;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;font-weight:700;border:3px solid #f97316;box-shadow:0 0 0 9999px #00000073;background:transparent}.spotlight-frame.eyes{top:29%;width:min(560px,74vw);height:150px;border-radius:18px}.spotlight-frame.face{top:16%;width:min(360px,72vw);height:min(460px,44vh);border-radius:42px}.spotlight-frame.face{border:none;box-shadow:none;overflow:visible}.spotlight-frame.face .face-frame-text{position:absolute;bottom:22%;left:50%;transform:translate(-50%);text-align:center;width:80%}.spotlight-frame.ok{border-color:#22c55e}.spotlight-frame.bad{border-color:#f97316}.face-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.face-overlay-shade{fill:#00000073}.face-overlay-contour{fill:none;stroke-width:.65;vector-effect:non-scaling-stroke}.face-overlay.ok .face-overlay-contour{stroke:#22c55e}.face-overlay.bad .face-overlay-contour{stroke:#f97316}.controls{position:absolute;left:12px;right:12px;bottom:12px;background:#0e1018ad;border:1px solid var(--border);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:var(--r-md);padding:12px;display:flex;flex-direction:column;gap:8px}.controls button{font-size:22px;border-radius:12px;border:1px solid var(--border-b);padding:12px;background:linear-gradient(135deg,#00e5fff2,#00ff87e6);color:#03121a;font-weight:700}.controls button:disabled{opacity:.6}.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.share-button{background:linear-gradient(135deg,#6366f1f2,#a855f7eb)!important;color:#f7f8ff!important}.share-toast{position:absolute;bottom:106px;left:50%;transform:translate(-50%);z-index:22;background:#0e1018eb;border:1px solid var(--border-b);border-radius:999px;padding:8px 12px;font-size:13px}.menu-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;background:#05060acc;-webkit-backdrop-filter:blur(26px);backdrop-filter:blur(26px);display:grid;place-items:center;animation:fadeIn .35s var(--ease-out-expo)}.menu-card{width:min(520px,94vw);background:#0e1018e6;border:1px solid var(--border-b);border-radius:var(--r-xl);padding:22px;display:flex;flex-direction:column;gap:12px;animation:slideUp .4s var(--ease-out-expo);box-shadow:0 24px 48px #00000073}.menu-eyebrow{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan);margin:0 0 8px}.menu-title{margin:0;font-size:30px}.menu-desc{margin:0;font-size:13px;line-height:1.5;color:var(--txt-2);background:var(--glass);border:1px solid var(--border);border-radius:var(--r-sm);padding:12px}.btn-camera{border:0;border-radius:var(--r-md);padding:14px;background:linear-gradient(135deg,var(--cyan),var(--green));color:#061018;font-size:15px;font-weight:700}.games-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.game-card{text-align:left;border:1px solid var(--border);border-radius:var(--r-md);background:var(--glass);color:var(--txt);padding:14px;display:flex;flex-direction:column;gap:6px}.game-card:disabled{opacity:.45}.game-card-title{font-weight:700}.game-card-sub{font-size:12px;color:var(--txt-2)}.game-card-tag{align-self:flex-start;border:1px solid currentColor;border-radius:8px;padding:2px 8px;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.game-card[data-game=blink]{color:var(--cyan)}.game-card[data-game=face-iq]{color:var(--green)}.game-card[data-game=nose-maze]{color:var(--orange)}.game-card[data-game=nose-pong]{color:var(--yellow)}.menu-error{color:#ff8aa5;font-size:12px}.error{color:#fecaca}.progress{height:10px;border-radius:999px;background:#fff3;overflow:hidden}.progress span{display:block;height:100%;background:#22c55e}.upload-pill{position:absolute;top:10px;right:12px;z-index:15;background:#0e1018c7;border:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:6px 10px;border-radius:999px;font-size:12px}.loading-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:18;background:#00000059;display:grid;place-items:center;pointer-events:none}.loading-card{width:min(420px,88vw);background:#000000b8;border:1px solid rgba(255,255,255,.22);border-radius:14px;padding:14px;display:grid;gap:8px;justify-items:center;text-align:center}.spinner{width:28px;height:28px;border-radius:50%;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.timer{font-size:40px;font-weight:800;line-height:1}.debug-overlay{position:absolute;left:8px;top:8px;z-index:25;background:#000000b8;padding:8px;border-radius:8px;font-size:11px;max-width:320px;max-height:55vh;overflow:auto}.maze-board{position:absolute;top:72px;left:50%;transform:translate(-50%);width:min(92vw,420px);aspect-ratio:1/1;display:grid;grid-template-columns:repeat(var(--maze-size),1fr);grid-template-rows:repeat(var(--maze-size),1fr);background:#0e101894;border:1px solid var(--border-b);border-radius:16px;overflow:hidden;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.maze-cell.wall{background:#141414eb}.maze-cell.path{background:#ffffff14}.maze-cell.start{background:#22c55e73}.maze-cell.finish{background:#ef444473}.nose-cursor{position:absolute;width:14px;height:14px;border-radius:50%;background:#38bdf8;border:2px solid #fff;transform:translate(-50%,-50%);pointer-events:none;z-index:2}.pong-arena{position:absolute;top:12vh;left:50%;transform:translate(-50%);width:min(92vw,520px);height:min(62vh,620px);background:#0e10187a;border:1px solid var(--border-b);border-radius:16px;overflow:hidden;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.pong-ball{position:absolute;width:20px;height:20px;border-radius:50%;background:#facc15;border:2px solid #fff;transform:translate(-50%,-50%)}.pong-paddle{position:absolute;transform:translate(-50%);background:#22c55e;border-radius:999px;box-shadow:0 0 14px #22c55e80}.pong-score{position:absolute;top:10px;left:10px;z-index:2;font-weight:700;font-size:18px;text-shadow:0 1px 2px #000}.pong-hint{position:absolute;left:50%;bottom:54%;transform:translate(-50%);background:#0000008c;padding:8px 10px;border-radius:10px;font-weight:600;z-index:2}@media (max-width:640px){.pong-arena{top:11vh;height:min(58vh,560px)}.pong-score{font-size:16px}}