:root{--brand-teal: #00a486;--brand-teal-hover: #14c29f;--brand-ink: #004149;--bg: #06282c;--surface: #0a3238;--surface-2: #0f434a;--primary: var(--brand-teal);--primary-hover: var(--brand-teal-hover);--text: #eafaf6;--muted: #8bb3b3;--success: #26de81;--danger: #ff5e57;--accent-a: #00a486;--accent-b: #0984b8;--accent-c: #f6b93b;--accent-d: #e55039;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% 50%,#0e1732,#06282c);background-attachment:fixed;color:var(--text);min-height:100vh}a{color:var(--primary-hover)}.app-shell{max-width:960px;margin:0 auto;padding:24px 16px 64px}html,body{overflow-x:hidden}@media (max-width: 560px){.app-shell{padding:16px 12px 48px}.card{padding:16px}.big-pin{font-size:36px;letter-spacing:5px}}.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 0;border-bottom:1px solid var(--surface-2);margin-bottom:24px}.topbar-centered{justify-content:center}.brand-link{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:inherit}.brand-link:hover{text-decoration:none}.brand-logo{height:96px;width:auto;display:block;background:#fff;padding:2px 6px;border-radius:14px}.brand-sep{width:1px;height:34px;background:var(--surface-2)}.brand-title{font-weight:700;font-size:16px;letter-spacing:.2px;color:var(--muted)}@media (max-width: 560px){.brand-sep,.brand-title{display:none}.brand-logo{height:60px}.topbar,.topbar .row{flex-wrap:wrap;gap:8px}.topbar .muted{max-width:40vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}.card{background:var(--surface);border:1px solid var(--surface-2);border-radius:14px;padding:20px;margin-bottom:16px}button{font:inherit;border:none;border-radius:10px;padding:10px 16px;cursor:pointer;background:var(--primary);color:#fff;font-weight:600;transition:background .15s ease,transform .05s ease}button:hover{background:var(--primary-hover)}button:active{transform:translateY(1px)}button:disabled{opacity:.5;cursor:not-allowed}button.ghost{background:transparent;border:1px solid var(--surface-2);color:var(--text);transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease,transform .05s ease}button.ghost:hover{background:transparent;border-color:var(--brand-teal);color:var(--brand-teal-hover);box-shadow:0 6px 20px #00a48647}button.danger{background:var(--danger)}input,textarea{font:inherit;width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--surface-2);background:var(--bg);color:var(--text)}label{display:block;font-size:13px;color:var(--muted);margin:12px 0 4px}.row{display:flex;gap:12px;align-items:center}.grid-answers{display:grid;grid-template-columns:1fr 1fr;gap:12px}.answer-btn{min-height:96px;font-size:18px;font-weight:700;display:flex;align-items:center;justify-content:center;text-align:center}.answer-a{background:var(--accent-a)}.answer-b{background:var(--accent-b)}.answer-c{background:var(--accent-c);color:#2a2a2a}.answer-d{background:var(--accent-d)}.center{text-align:center}.big-pin{font-size:48px;font-weight:900;letter-spacing:8px;color:var(--accent-c)}.muted{color:var(--muted)}.player-chip{display:inline-block;background:var(--surface-2);border-radius:999px;padding:6px 14px;margin:4px;font-weight:600}.leaderboard{list-style:none;padding:0;margin:0}.leaderboard li{display:flex;justify-content:space-between;padding:12px 16px;border-radius:10px;background:var(--surface-2);margin-bottom:8px;font-weight:600}.leaderboard li.rank-1{background:linear-gradient(90deg,#f7b733,#fc4a1a)}.leaderboard li.rank-2{background:linear-gradient(90deg,#757f9a,#d7dde8);color:#222}.leaderboard li.rank-3{background:linear-gradient(90deg,#cb2d3e,#ef473a)}.error{background:#ff5e5726;border:1px solid var(--danger);color:#ffb0ac;padding:10px 14px;border-radius:10px;margin-bottom:12px}.logo-card{padding:0;overflow:hidden;display:flex;justify-content:center;align-items:center;line-height:0;cursor:default;width:100%;max-width:462px;margin-left:auto;margin-right:auto;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;animation:logo-card-catch .55s cubic-bezier(.2,.8,.3,1.2) both}@keyframes logo-card-catch{0%{opacity:0;transform:translateY(-18px) scale(.9)}60%{transform:translateY(0) scale(1.04)}to{opacity:1;transform:translateY(0) scale(1)}}.logo-card:hover{border-color:var(--brand-teal);box-shadow:0 10px 30px #00a48647;transform:translateY(-3px)}.logo-card-video{display:block;width:100%;height:auto;object-fit:cover;border-radius:inherit}.intro-card{text-align:center}.intro-title{font-size:34px;margin:0 0 10px;min-height:1.3em;font-weight:800}.intro-runner{display:inline-block;height:1.15em;width:auto;vertical-align:-.2em;margin-left:2px;animation:intro-runner-bob .45s ease-in-out infinite}@keyframes intro-runner-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.type-caret{display:inline-block;width:3px;height:1em;margin-left:3px;vertical-align:text-bottom;background:var(--brand-teal-hover);animation:caret-blink 1s steps(1) infinite}@keyframes caret-blink{0%,50%{opacity:1}50.01%,to{opacity:0}}@media (max-width: 560px){.intro-title{font-size:26px}}.qr-box{background:#fff;padding:16px;border-radius:14px;display:inline-block}.timer{font-size:28px;font-weight:800;color:var(--accent-c)}.celebrate{font-size:72px;line-height:1;margin-bottom:4px;animation:pop-bounce .9s ease both}@keyframes pop-bounce{0%{transform:scale(.2) rotate(-12deg);opacity:0}60%{transform:scale(1.25) rotate(6deg);opacity:1}to{transform:scale(1) rotate(0)}}.podium{display:flex;align-items:flex-end;justify-content:center;gap:12px;margin:24px 0 8px}.podium-col{flex:1;max-width:130px;display:flex;flex-direction:column;align-items:center;gap:4px}.podium-medal{font-size:30px;line-height:1}.podium-name{font-weight:700;font-size:14px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.podium-score{font-weight:800;color:var(--brand-teal-hover);font-size:15px}.podium-bar{width:100%;border-radius:10px 10px 0 0;display:flex;align-items:flex-start;justify-content:center;padding-top:8px;font-weight:800;color:#06282c}.podium-1 .podium-bar{height:96px;background:linear-gradient(180deg,#f7c948,#f0932b)}.podium-2 .podium-bar{height:68px;background:linear-gradient(180deg,#d7dde8,#9aa5b1)}.podium-3 .podium-bar{height:48px;background:linear-gradient(180deg,#e8917a,#cb4a34)}.podium-col.is-me .podium-name{color:var(--brand-teal-hover)}.podium-col.is-me .podium-bar{box-shadow:0 0 0 3px var(--brand-teal-hover)}.leaderboard li.is-me{outline:2px solid var(--brand-teal-hover);outline-offset:-2px}@media (max-width: 420px){.celebrate{font-size:56px}.podium-col{max-width:96px}}.auth-loading{min-height:100vh;display:flex;align-items:center;justify-content:center}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#03141699;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:1000;animation:overlay-in .2s ease both}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}.signin-card{position:relative;width:100%;max-width:400px;border-radius:20px;padding:32px 30px 26px;background:linear-gradient(180deg,var(--surface) 0%,#082b30 100%);border:1px solid var(--surface-2);box-shadow:0 24px 60px #00000073;animation:card-in .25s cubic-bezier(.2,.8,.3,1) both}@keyframes card-in{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.signin-card:before{content:"";position:absolute;top:0;left:0;right:0;height:5px;border-radius:20px 20px 0 0;background:linear-gradient(90deg,var(--brand-ink),var(--brand-teal))}.modal-close{position:absolute;top:12px;right:12px;width:32px;height:32px;padding:0;border-radius:8px;font-size:22px;line-height:1;background:transparent;color:var(--muted)}.modal-close:hover{background:var(--surface-2);color:var(--text)}.signin-brand{display:flex;justify-content:center;margin:4px 0 18px}.signin-brand img{height:64px;width:auto;background:#e6ebe9;padding:8px 16px;border-radius:14px}.signin-title{text-align:center;margin:0 0 4px;font-size:22px;font-weight:800}.signin-sub{text-align:center;margin:0 0 20px;color:var(--muted);font-size:14px}.signin-hint{color:var(--muted);font-size:12px;margin:6px 2px 0}.input-with-action{position:relative}.input-with-action input{padding-right:64px}.reveal-btn{position:absolute;right:6px;top:50%;transform:translateY(-50%);padding:6px 10px;font-size:12px;font-weight:700;background:transparent;color:var(--brand-teal-hover);border-radius:8px}.reveal-btn:hover{background:var(--surface-2)}.signin-submit{width:100%;margin-top:20px;padding:13px;font-size:15px;font-weight:700;display:flex;align-items:center;justify-content:center;min-height:46px}.signin-foot{text-align:center;margin:16px 0 0;font-size:12px;letter-spacing:.3px}.spinner{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;display:inline-block;animation:spin .7s linear infinite}.auth-loading .spinner{width:34px;height:34px;border-width:3px;border-color:var(--surface-2);border-top-color:var(--brand-teal)}@keyframes spin{to{transform:rotate(360deg)}}.question-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:8px}.question-head p{margin:0}.timer-ring{position:relative;flex:0 0 auto;width:92px;height:92px;color:var(--brand-teal-hover)}.timer-value{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:800;color:var(--text)}.timer-ring.urgent{color:var(--danger);animation:timer-pulse 1s ease-in-out infinite}.timer-ring.urgent .timer-value{color:var(--danger)}@keyframes timer-pulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.runner{display:flex;justify-content:center;margin:8px 0 20px}.runner-scene{position:relative;width:180px;height:150px;overflow:hidden}.runner-figure{position:absolute;left:50%;bottom:26px;width:96px;height:96px;margin-left:-48px;transform-origin:50% 90%;animation:runner-bob .5s ease-in-out infinite;filter:drop-shadow(0 6px 8px rgba(0,0,0,.35))}@keyframes runner-bob{0%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-9px) rotate(-7deg)}to{transform:translateY(0) rotate(-4deg)}}.runner-speed{position:absolute;height:4px;border-radius:2px;background:linear-gradient(90deg,rgba(20,194,159,0) 0%,var(--brand-teal-hover) 60%,var(--brand-teal-hover) 100%);right:-60px;opacity:0;animation:runner-speed .9s linear infinite}.runner-speed.line-1{top:46px;width:46px;animation-delay:0s}.runner-speed.line-2{top:74px;width:64px;animation-delay:.3s}.runner-speed.line-3{top:100px;width:38px;animation-delay:.6s}@keyframes runner-speed{0%{right:-60px;opacity:0}15%{opacity:.9}85%{opacity:.9}to{right:190px;opacity:0}}.runner-track{position:absolute;left:0;right:0;bottom:18px;height:4px;border-radius:2px;background-image:repeating-linear-gradient(90deg,var(--surface-2) 0 14px,transparent 14px 28px);background-size:28px 4px;animation:runner-track .4s linear infinite}@keyframes runner-track{0%{background-position-x:0}to{background-position-x:-28px}}@media (prefers-reduced-motion: reduce){.runner-figure,.runner-speed,.runner-track{animation:none}.runner-speed{opacity:.5}}.tabs{display:flex;gap:6px;margin-bottom:20px;border-bottom:1px solid var(--surface-2)}.tab{background:transparent;color:var(--muted);border-radius:10px 10px 0 0;padding:10px 20px;font-weight:700;border-bottom:3px solid transparent}.tab:hover{background:var(--surface);color:var(--text)}.tab.active{color:var(--text);border-bottom-color:var(--brand-teal);background:var(--surface)}select{font:inherit;width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--surface-2);background:var(--bg);color:var(--text)}.switch-label{display:block;font-size:14px;color:var(--text);cursor:pointer}.switch-hint{display:block;font-size:12px;color:var(--muted);margin-top:2px}.choice-row{display:flex;align-items:center;gap:8px;color:var(--text);font-size:15px;margin:8px 0;cursor:pointer}.choice-row input{width:auto}.rating-row{display:flex;gap:6px;margin-top:6px}.rating-star{background:transparent;color:var(--surface-2);font-size:30px;line-height:1;padding:2px 4px;border-radius:8px;transition:color .12s ease,transform .05s ease}.rating-star:hover{background:transparent;color:var(--brand-teal-hover)}.rating-star.on{color:var(--accent-c)}textarea{resize:vertical}.bar-row{margin-bottom:12px}.bar-label{display:flex;justify-content:space-between;font-size:14px;margin-bottom:4px}.bar-track{height:12px;background:var(--surface-2);border-radius:999px;overflow:hidden}.bar-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--brand-teal),var(--brand-teal-hover));transition:width .3s ease}.text-answers{margin:0;padding-left:18px}.text-answers li{margin:6px 0;color:var(--text)}.results-table{width:100%;border-collapse:collapse;font-size:14px}.results-table th,.results-table td{text-align:left;padding:8px 10px;border-bottom:1px solid var(--surface-2);white-space:nowrap}.results-table th{color:var(--muted);font-weight:700}.feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}button.feature{margin-bottom:0;display:block;width:100%;text-align:left;font:inherit;color:var(--text);cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}button.feature:hover{background:var(--surface);border-color:var(--brand-teal);box-shadow:0 10px 30px #00a48647;transform:translateY(-3px)}button.feature:hover h3{color:var(--brand-teal-hover)}.feature h3{margin:0 0 6px;transition:color .18s ease}.feature p{margin:0}.feature-cta{display:inline-block;margin-top:14px;font-weight:700;font-size:14px;color:var(--brand-teal-hover)}@media (max-width: 640px){.feature-grid{grid-template-columns:1fr}}.splash-cine{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;overflow:hidden;cursor:pointer;background:#05060f;animation:cine-in .3s ease both}.splash-cine.leaving{animation:cine-out .6s cubic-bezier(.6,0,.35,1) forwards}.splash-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block}.splash-cine-logo{position:absolute;top:50%;left:50%;width:96vw;height:96vh;max-width:96vw;max-height:96vh;object-fit:contain;transform:translate(-50%,-50%) scale(.7);opacity:0;filter:drop-shadow(0 0 30px rgba(90,140,255,.6));transition:opacity .7s ease,transform .9s cubic-bezier(.2,.7,.2,1);pointer-events:none}.splash-cine-logo.in{opacity:1;transform:translate(-50%,-50%) scale(1)}.splash-cine.leaving .splash-cine-logo.in{transform:translate(-50%,-50%) scale(2.6);opacity:0}@keyframes cine-in{0%{opacity:0}to{opacity:1}}@keyframes cine-out{0%{opacity:1;filter:brightness(1)}35%{filter:brightness(1.6)}to{opacity:0;visibility:hidden;filter:brightness(1)}}@media (prefers-reduced-motion: reduce){.splash-cine{background:#0a0e2a}}.field-card{transition:box-shadow .15s ease,border-color .15s ease,opacity .15s ease}.drag-handle{cursor:grab;-webkit-user-select:none;user-select:none;font-size:20px;line-height:1;color:var(--muted);padding:2px 6px;border-radius:6px}.drag-handle:hover{color:var(--brand-teal-hover);background:var(--surface-2)}.drag-handle:active{cursor:grabbing}.field-card.dragging{opacity:.5}.field-card.drag-over{border-color:var(--brand-teal);box-shadow:0 -3px 0 0 var(--brand-teal) inset}.reveal-card{border-width:2px;transition:border-color .2s ease,background .2s ease}.reveal-card.reveal-correct{border-color:var(--success);background:linear-gradient(180deg,rgba(38,222,129,.12),var(--surface))}.reveal-card.reveal-wrong{border-color:var(--danger);background:linear-gradient(180deg,rgba(255,94,87,.12),var(--surface))}.reveal-burst{width:96px;height:96px;margin:4px auto 8px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:52px;font-weight:900;color:#fff;animation:burst-in .5s cubic-bezier(.2,.9,.3,1.4) both}.reveal-burst.correct{background:radial-gradient(circle,#2be58a,#16a34a);box-shadow:0 0 #26de8199;animation:burst-in .5s cubic-bezier(.2,.9,.3,1.4) both,pulse-ring-green 1.1s ease-out .4s infinite}.reveal-burst.wrong{background:radial-gradient(circle,#ff6b63,#d0342a);animation:burst-in .45s cubic-bezier(.2,.9,.3,1.4) both,shake .4s ease .35s}.reveal-points{font-size:34px;font-weight:900;color:var(--success);margin:0}@keyframes burst-in{0%{transform:scale(.2) rotate(-20deg);opacity:0}70%{transform:scale(1.15) rotate(4deg);opacity:1}to{transform:scale(1) rotate(0)}}@keyframes pulse-ring-green{0%{box-shadow:0 0 #26de8180}to{box-shadow:0 0 0 22px #26de8100}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}