:root{--ink: #0a0f2c;--ink-2: #1a2a6c;--paper: #fcfaf5;--white: #ffffff;--soft: #efece2;--brand: #3b5cff;--brand-deep: #1e2fa6;--accent: #3b5cff;--accent-deep:#1e2fa6;--on-accent: #ffffff;--line: rgba(10, 15, 44, .12);--ring: #0a0f2c;--muted: #555c7d;--shadow-sm: 2px 2px 0 var(--ring);--shadow: 4px 4px 0 var(--ring);--shadow-lg: 6px 6px 0 var(--ring)}[data-theme=dark]{--ink: #f5f5f0;--ink-2: #ffffff;--paper: #0d1226;--white: #1a2143;--soft: #15193a;--brand: #5b7bff;--brand-deep: #3b5cff;--accent: #5b7bff;--accent-deep:#3b5cff;--on-accent: #ffffff;--line: rgba(255, 255, 255, .12);--ring: #3b5cff}[data-motion=reduce] *,[data-motion=reduce] *:before,[data-motion=reduce] *:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}*{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%}body{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased;overflow-x:hidden}button{font-family:inherit;cursor:pointer}a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}#app{min-height:100vh;display:flex;flex-direction:column}.container{width:100%;max-width:1180px;margin:0 auto;padding:0 24px}.screen{flex:1;display:flex;align-items:center;justify-content:center;padding:32px 20px;position:relative}.screen.wide{align-items:flex-start;padding-top:32px}.screen.flush{padding:0;display:block}.screen.flush>.card{margin-inline:auto}.screen.game-stage{align-items:flex-start;padding-top:max(32px,calc((100vh - 520px)/2))}.site-header{position:sticky;top:0;z-index:50;background:var(--paper);border-bottom:2px solid var(--ink)}.site-header .inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:18px;padding:14px 24px}.site-header .logo{display:flex;align-items:center;gap:10px;color:var(--ink);transition:transform .15s ease;transform-origin:left center}.site-header .logo:hover{transform:scale(1.05);text-decoration:none}.site-header .logo img{width:40px;height:40px;border-radius:10px;border:2px solid var(--ink)}.site-header .logo .name{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:900;font-size:22px;letter-spacing:-.02em;color:var(--ink)}.site-header nav{display:flex;gap:2px;margin-left:18px}.site-header nav a{padding:8px 14px;border-radius:8px;color:var(--ink);font-weight:600;font-size:14px}.site-header nav a:hover{background:var(--soft);text-decoration:none}.site-header .spacer{flex:1}.site-header .me{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}.site-header .me .pill{background:var(--soft);color:var(--ink-2);padding:4px 10px;border-radius:6px;font-weight:600;font-size:12px;border:1.5px solid var(--ink)}.site-header .me .pill.ok{background:#d6f0d6;color:#15532e}@media (max-width: 720px){.site-header nav{display:none}.site-header .me .username{display:none}}.site-footer{margin-top:auto;background:var(--paper);border-top:2px solid var(--ink);padding:20px 24px}.site-footer .inner{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:13px;color:var(--muted)}.site-footer .inner .left{display:flex;align-items:center;gap:10px}.site-footer .inner img{width:24px;height:24px;border-radius:6px;border:1.5px solid var(--ink)}.site-footer .links{display:flex;gap:16px}.site-footer .links a{color:var(--muted);font-weight:500}.site-footer .links a:hover{color:var(--ink);text-decoration:none}.hero{padding:80px 24px 60px;position:relative}.hero .grid-2{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}.hero .grid-2>*{min-width:0}.hero h1{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:900;font-size:clamp(48px,7.5vw,96px);letter-spacing:-.04em;line-height:.95;margin:0 0 22px;color:var(--ink)}.hero h1 .ul{display:inline-block;position:relative}.hero h1 .ul:after{content:"";position:absolute;left:-2%;right:-2%;bottom:4px;height:14px;background:var(--accent);z-index:-1;transform:skew(-3deg)}.hero p.lede{font-size:19px;line-height:1.5;color:var(--ink);opacity:.78;max-width:480px;margin:0 0 30px}.hero .cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:18px}.hero .signed-in{font-size:13px;color:var(--muted)}@media (max-width: 880px){.hero{padding:56px 20px 40px}.hero .grid-2{grid-template-columns:1fr;gap:36px}}.demo-card{background:var(--white);border:2px solid var(--ink);border-radius:22px;box-shadow:var(--shadow-lg);padding:24px;position:relative;transform:rotate(-1.2deg)}.demo-card .meta-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}.demo-card .meta-row .live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#e11d48;margin-right:6px;vertical-align:middle;animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.7)}}.demo-card .timer-bar{height:8px;border-radius:6px;background:var(--soft);border:1.5px solid var(--ink);overflow:hidden;margin-bottom:18px}.demo-card .timer-fill{height:100%;background:var(--brand);transition:width .35s linear}.demo-card .q{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:700;font-size:22px;letter-spacing:-.01em;line-height:1.2;margin:0 0 16px}.demo-card .opts{display:grid;gap:10px}.demo-card .opt{position:relative;display:flex;align-items:center;gap:12px;padding:13px 16px;background:var(--white);border:2px solid var(--ink);border-radius:12px;font-weight:700;font-size:15px;color:var(--ink);box-shadow:2px 2px 0 var(--ring);transition:background .25s,transform .15s}.demo-card .opt .letter{width:26px;height:26px;border-radius:6px;background:var(--soft);color:var(--ink);display:grid;place-items:center;font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-size:13px;border:1.5px solid var(--ink)}.demo-card .opt .reaction{margin-left:auto;background:var(--ink);color:var(--paper);padding:3px 8px;border-radius:6px;font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:700;font-size:12px;animation:pop-in .25s ease}@keyframes pop-in{0%{opacity:0;transform:translateY(4px) scale(.85)}to{opacity:1;transform:translateY(0) scale(1)}}.demo-card .opt.correct{background:#d6f0d6}.demo-card .opt.wrong{background:#fbd7d7}.marquee{background:var(--ink);color:var(--paper);padding:14px 0;overflow:hidden;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}.marquee .track{display:flex;gap:36px;white-space:nowrap;animation:scroll-left 60s linear infinite;font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:700;font-size:17px;letter-spacing:.02em}.marquee .track span{flex-shrink:0}.marquee .track .dot{color:var(--accent);font-size:22px;line-height:1;align-self:center}@keyframes scroll-left{0%{transform:translate(0)}to{transform:translate(-50%)}}.section{padding:56px 24px;position:relative}.section .head{text-align:left;max-width:720px;margin:0 0 32px}.section .head .kicker{display:inline-block;font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;background:var(--accent);color:var(--on-accent);padding:4px 10px;border:1.5px solid var(--ink);border-radius:6px;margin-bottom:14px}.section .head h2{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-size:clamp(32px,4.5vw,52px);letter-spacing:-.025em;line-height:1;margin:0 0 12px}.section .head p{color:var(--muted);font-size:17px;line-height:1.5;margin:0}.genre-cloud{display:flex;flex-wrap:wrap;gap:12px}.genre-chip{display:inline-flex;align-items:center;gap:8px;padding:14px 20px;background:var(--white);border:2px solid var(--ink);border-radius:999px;font-weight:700;font-size:15px;box-shadow:var(--shadow-sm);transition:transform .12s,box-shadow .12s}.genre-chip:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ring)}.genre-chip .e{font-size:20px}.genre-chip:nth-child(odd){transform:rotate(-1deg)}.genre-chip:nth-child(2n){transform:rotate(1deg)}.genre-chip:nth-child(3n){background:var(--accent);color:var(--on-accent)}.lobby-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.lobby-card{background:var(--white);border:2px solid var(--ink);border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:12px;box-shadow:var(--shadow);transition:transform .12s,box-shadow .12s;cursor:pointer}.lobby-card:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ring)}.lobby-card:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ring)}.lobby-card .top{display:flex;align-items:center;justify-content:space-between}.lobby-card .emoji-wrap{font-size:40px;line-height:1}.lobby-card .code{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:900;letter-spacing:4px;font-size:22px;color:var(--ink)}.lobby-card .meta-row{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted)}.lobby-card .players-pill{background:var(--accent);color:var(--on-accent);padding:4px 10px;border-radius:6px;font-weight:800;font-size:12px;border:1.5px solid var(--ink)}.card{background:var(--white);border:2px solid var(--ink);border-radius:22px;box-shadow:var(--shadow);padding:32px;max-width:560px;width:100%}.card.lg{max-width:760px;margin-inline:auto}.card.xl{max-width:960px;margin-inline:auto}.brand{display:flex;align-items:center;gap:12px}.brand img{width:44px;height:44px;border-radius:10px;border:2px solid var(--ink)}.brand h1{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:900;font-size:28px;letter-spacing:-.02em;margin:0;color:var(--ink)}h1{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:900;letter-spacing:-.02em}h2{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:700;letter-spacing:-.01em;margin:0}h3{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:700}.muted{color:var(--muted)}.tag{display:inline-flex;align-items:center;gap:6px;background:var(--soft);color:var(--ink);padding:4px 10px;border-radius:6px;font-size:12px;font-weight:700;border:1.5px solid var(--ink)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:2px solid var(--ink);border-radius:12px;padding:12px 22px;font-weight:800;font-size:15px;font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--white);color:var(--ink);box-shadow:var(--shadow);transition:transform .12s ease,box-shadow .12s ease,background .15s}.btn:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 var(--ring);text-decoration:none}.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ring)}.btn.primary{background:var(--accent);color:var(--on-accent)}.btn.solid{background:var(--brand);color:#fff}.btn.solid:hover{background:var(--brand)}.btn.ghost{background:var(--white)}.btn.danger{background:#ef4444;color:#fff}.btn.lg{padding:16px 30px;font-size:17px;border-radius:14px}.btn.xl{padding:22px 38px;font-size:20px;border-radius:16px}.btn.block{width:100%}.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:var(--shadow)}.btn[disabled]:hover{transform:none;box-shadow:var(--shadow)}.input,.select{display:block;width:100%;padding:13px 16px;border:2px solid var(--ink);border-radius:12px;font-size:15px;font-weight:600;font-family:inherit;color:var(--ink);background:var(--white);box-shadow:var(--shadow-sm);transition:box-shadow .15s,transform .12s}.input:focus,.select:focus{outline:none;transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ring)}.input.code{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:900;font-size:28px;text-align:center;letter-spacing:12px;padding-left:12px}.label{display:block;font-size:13px;font-weight:700;color:var(--ink);margin-bottom:8px}.grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.pick{position:relative;background:var(--white);border:2px solid var(--ink);border-radius:14px;padding:14px 12px;text-align:center;cursor:pointer;box-shadow:var(--shadow-sm);transition:transform .12s,box-shadow .12s;-webkit-user-select:none;user-select:none}.pick:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ring)}.pick.on{background:var(--accent);color:var(--on-accent)}.pick.on .lbl,.pick.on .sub{color:var(--on-accent)}.pick .emoji{font-size:26px;display:block;margin-bottom:2px}.pick .lbl{font-weight:800;font-size:13px}.pick .sub{display:block;font-size:11px;color:var(--muted);margin-top:2px}.create-step.step-enter{animation:createStepIn .42s cubic-bezier(.16,1,.3,1) both}@keyframes createStepIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.create-mode-title{font-size:28px;font-weight:900;letter-spacing:-.02em;margin:6px 0;animation:createStepIn .5s .04s cubic-bezier(.16,1,.3,1) both}.create-mode-sub{margin:0 0 22px;font-size:15px;animation:createStepIn .5s .1s cubic-bezier(.16,1,.3,1) both}.mode-hero{display:grid;gap:16px;grid-template-columns:1fr 1fr}@media (max-width: 620px){.mode-hero{grid-template-columns:1fr}}.mode-hero-card{display:flex;flex-direction:column;gap:8px;padding:26px 22px 22px;border:2px solid var(--ink);border-radius:18px;background:var(--white);color:inherit;font:inherit;text-align:left;width:100%;cursor:pointer;box-shadow:var(--shadow-sm);position:relative;overflow:hidden;transition:transform .15s,box-shadow .15s,background .15s;animation:modeHeroPop .55s cubic-bezier(.18,1.25,.4,1) both}.mode-hero-card:nth-child(1){animation-delay:.12s}.mode-hero-card:nth-child(2){animation-delay:.24s}.mode-hero-card:hover{transform:translate(-3px,-3px);box-shadow:6px 6px 0 var(--ring);background:var(--paper)}.mode-hero-card:active{transform:translate(0);box-shadow:2px 2px 0 var(--ring)}.mode-hero-emoji{font-size:46px;line-height:1}.mode-hero-title{font-weight:900;font-size:22px}.mode-hero-desc{color:var(--muted);font-size:14px;line-height:1.45;flex:1;margin:0}@keyframes modeHeroPop{0%{opacity:0;transform:translateY(22px) scale(.94)}60%{opacity:1;transform:translateY(-4px) scale(1.015)}to{opacity:1;transform:translateY(0) scale(1)}}.chosen-mode{display:flex;align-items:center;gap:12px;padding:12px 16px;margin-top:4px;border:2px solid var(--ink);border-radius:12px;background:color-mix(in srgb,var(--brand) 8%,var(--white))}.chosen-mode-emoji{font-size:26px;line-height:1}.chosen-mode-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.chosen-mode-title{font-weight:900;font-size:16px}.lb-row{display:grid;grid-template-columns:44px 1fr 92px 92px 78px;align-items:center;gap:10px;padding:10px 14px;margin-bottom:8px;border:2px solid var(--ink);border-radius:12px;background:var(--white)}.lb-row.lb-head{background:transparent;border:none;padding:0 14px 6px;margin-bottom:4px}.lb-head .lb-rank,.lb-head .lb-player,.lb-head .lb-stat{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:700}.lb-rank{font-weight:900;font-size:16px;color:var(--ink-2);text-align:center}.lb-player{display:flex;align-items:center;gap:10px;min-width:0}.lb-name{font-weight:800;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lb-sub{font-size:11px;color:var(--muted)}.lb-stat{text-align:right;font-weight:700;font-size:14px}.lb-stat.primary{font-weight:900;color:var(--ink-2)}.lb-stat-label{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700}.lb-row.me{background:color-mix(in srgb,var(--brand) 12%,var(--white));border-color:var(--brand)}.lb-yours{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin:18px 0 6px}@media (max-width: 560px){.lb-row{grid-template-columns:32px 1fr 70px}.lb-row .lb-stat:not(.primary),.lb-head .lb-stat:not(.primary){display:none}}.game-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.game-card{border:2px solid var(--ink);border-radius:16px;background:var(--white);padding:16px 18px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column}.game-card-head{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}.game-card-name{font-weight:900;font-size:18px}.game-card .btn{font-size:13px;padding:8px 12px}.song-list{display:flex;flex-direction:column;gap:8px}.song-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.song-row .song-idx{width:20px;flex:0 0 auto;font-weight:800;color:var(--muted);font-size:13px;text-align:center}.song-row .input{flex:1 1 130px;min-width:0;padding:10px 12px}.song-row .song-year{flex:0 0 72px;text-align:center}.song-row .song-del{flex:0 0 auto;padding:9px 12px}.year-input-row{display:flex;gap:10px;align-items:stretch;margin-top:8px}.year-input{flex:1;min-width:0;font-size:28px;font-weight:900;letter-spacing:4px;text-align:center;border:2px solid var(--ink);border-radius:12px;padding:12px;background:var(--white);color:var(--ink)}.year-input:focus{outline:none;box-shadow:3px 3px 0 var(--ring)}.year-input:disabled{opacity:.7}.year-reveal{margin-top:18px;text-align:center}.year-reveal .big{font-size:40px;font-weight:900;color:var(--ink-2);letter-spacing:2px}.year-reveal .lbl{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.year-guess-pill{display:inline-flex;align-items:center;gap:8px;margin-top:10px;padding:6px 14px;border-radius:999px;border:2px solid var(--ink);font-weight:800;font-size:14px}.year-guess-pill.exact{background:var(--accent);color:var(--on-accent)}.players{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.player{display:flex;align-items:center;gap:10px;background:var(--paper);border:2px solid var(--ink);border-radius:14px;padding:10px 12px}.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;color:#fff;font-size:14px;background:var(--brand);border:2px solid var(--ink);flex-shrink:0}.avatar.bot{color:#1f2937}.avatar.bot svg,.avatar.human svg{width:100%;height:100%;display:block}.genre-icon{display:inline-grid;place-items:center;border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);flex-shrink:0;overflow:hidden}.genre-icon svg{width:78%;height:78%;display:block}.avatar.photo{background:var(--soft)}.avatar-edit{display:flex;align-items:center;gap:18px;margin-bottom:8px;flex-wrap:wrap}.avatar-edit .avatar{box-shadow:4px 4px 0 var(--ink)}.avatar-edit-body{flex:1;min-width:220px}.cropper-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:grid;place-items:center;padding:20px;background:#0f172a8c;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.cropper-modal{background:var(--white);border:2px solid var(--ink);border-radius:18px;box-shadow:8px 8px 0 var(--ink);padding:24px;width:min(360px,100%);display:flex;flex-direction:column;align-items:center;gap:12px}.cropper-title{font-weight:900;font-size:20px;margin:0;align-self:flex-start}.cropper-hint{color:var(--muted);font-size:13px;margin:0;align-self:flex-start;line-height:1.4}.cropper-stage{position:relative;width:280px;height:280px;touch-action:none}.cropper-canvas{width:280px;height:280px;display:block;border-radius:14px;background:var(--soft);border:2px solid var(--ink);cursor:grab}.cropper-canvas:active{cursor:grabbing}.cropper-mask{position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;width:240px;height:240px;border-radius:50%;box-shadow:0 0 0 9999px #0f172a80;border:2px solid rgba(255,255,255,.9);pointer-events:none}.cropper-zoom-row{display:flex;align-items:center;gap:10px;width:100%}.cropper-zoom-ico{font-size:14px;opacity:.7}.cropper-zoom{flex:1;accent-color:var(--brand);cursor:pointer}.cropper-actions{display:flex;gap:10px;width:100%}.cropper-actions .btn{flex:1}.player .name{font-weight:700;font-size:14px}.player .meta{font-size:11px;color:var(--muted)}.player.host{background:var(--accent);color:var(--on-accent)}.player.host .name,.player.host .meta{color:var(--on-accent)}.dot{width:8px;height:8px;border-radius:50%;background:#94a3b8;border:1.5px solid var(--ink)}.dot.ready{background:#4ade80}.player.removable-bot{cursor:pointer}.avatar-removable{position:relative;flex-shrink:0;line-height:0}.avatar-remove-overlay{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;display:grid;place-items:center;background:#dc2626d1;color:#fff;font-weight:900;font-size:24px;line-height:1;border:2px solid var(--ink);opacity:0;transition:opacity .12s ease;pointer-events:none}.player.removable-bot:hover .avatar-remove-overlay,.player.removable-bot:focus-visible .avatar-remove-overlay{opacity:1}.round-shell{width:100%;max-width:640px;margin:0 auto}.round-shell .card{max-width:none;margin-inline:auto}.round-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.timer{height:10px;border-radius:999px;overflow:hidden;background:var(--soft);margin-bottom:22px;border:1.5px solid var(--ink)}.timer-fill{height:100%;width:100%;background:var(--brand);transform-origin:left center;will-change:transform}.answering-countdown{height:10px;margin-bottom:22px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:15px;letter-spacing:.04em;color:var(--brand);font-variant-numeric:tabular-nums}.prompt{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-size:34px;font-weight:700;line-height:1.25;letter-spacing:-.01em;margin:0 0 26px;text-align:center}.choices{display:grid;gap:12px}@media (min-width: 640px){.choices{grid-template-columns:1fr 1fr}}.choice{text-align:left;background:var(--white);border:2px solid var(--ink);padding:18px 22px;border-radius:14px;font-size:17px;font-weight:700;display:flex;align-items:center;gap:12px;box-shadow:var(--shadow-sm);transition:transform .12s,box-shadow .12s,background .2s}.choice:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ring)}.choice:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ring)}.choice .letter{width:28px;height:28px;border-radius:6px;background:var(--soft);color:var(--ink);display:grid;place-items:center;font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-size:13px;border:1.5px solid var(--ink);flex-shrink:0}.choice.picked{background:color-mix(in srgb,var(--brand) 14%,var(--white))}.choice.correct{background:#d6f0d6}.choice.wrong{background:#fbd7d7}.choice[disabled]{opacity:.9;cursor:default}[data-theme=dark] .choice{background:#fff;color:#0a0f2c;border-color:#0a0f2c}[data-theme=dark] .choice .letter{background:#eef1f6;color:#0a0f2c;border-color:#0a0f2c}[data-theme=dark] .choice.picked{background:#dbe4ff;color:#0a0f2c}[data-theme=dark] .choice.correct{background:#15803d;color:#fff}[data-theme=dark] .choice.wrong{background:#b91c1c;color:#fff}[data-theme=dark] .choice.correct .letter,[data-theme=dark] .choice.wrong .letter{background:#ffffff38;color:#fff}[data-theme=dark] .card.your-preview{background:#fcfaf5;color:#0a0f2c;border-color:#0a0f2c;box-shadow:6px 6px #0a0f2c}[data-theme=dark] .card.your-preview .muted{color:#555c7d}[data-theme=dark] .card.your-preview .btn{border-color:#0a0f2c}.music-cta{border:2px solid var(--brand);border-radius:16px;padding:16px;background:color-mix(in srgb,var(--brand) 10%,var(--white));box-shadow:4px 4px 0 var(--brand)}.music-cta-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:12px}.music-cta-emoji{font-size:28px;line-height:1.1;flex-shrink:0}.music-cta-title{font-weight:900;font-size:17px}.music-cta-sub{color:inherit;opacity:.72;font-size:13px;margin-top:2px;line-height:1.35}.music-cta-badge{flex-shrink:0;align-self:flex-start;background:var(--brand);color:#fff;font-size:11px;font-weight:800;letter-spacing:.04em;padding:4px 9px;border-radius:999px;border:2px solid var(--ink);white-space:nowrap}.music-cta-status{font-size:12px;font-weight:700;margin-top:10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.music-cta-status.ok{color:var(--brand-deep)}.scoreboard{display:grid;gap:8px}.sb-row{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:12px;padding:10px 14px;background:var(--paper);border:2px solid var(--ink);border-radius:12px}.sb-rank{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--muted);font-size:14px}.sb-row.win{background:var(--accent);color:var(--on-accent)}.sb-row.win .sb-rank,.sb-row.win .sb-score{color:var(--on-accent)}.sb-score{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif}.podium{display:flex;align-items:flex-end;justify-content:center;gap:16px;margin:26px auto 0;max-width:560px;border-bottom:3px solid var(--ink)}.podium-spot{display:flex;flex-direction:column;align-items:center;flex:1 1 0;min-width:0}.podium-figure{display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:14px;max-width:100%}.podium-figure .avatar{box-shadow:4px 4px 0 var(--ink)}.podium-crown{font-size:26px;line-height:1;margin-bottom:-2px}.podium-name{font-weight:800;font-size:15px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.podium-score{font-weight:900;font-size:16px;color:var(--ink-2)}.podium-score span{font-weight:700;font-size:11px;color:var(--muted);margin-left:3px}.podium-block{width:100%;border:2px solid var(--ink);border-bottom:none;border-radius:14px 14px 0 0;display:flex;align-items:flex-start;justify-content:center;padding-top:12px;font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:900;font-size:44px;color:#0a0f2c;box-shadow:inset 0 -8px #0000001a}.podium-block.p1{height:156px;background:#fbbf24}.podium-block.p2{height:116px;background:#cbd5e1}.podium-block.p3{height:86px;background:#e0a36b}@media (max-width: 520px){.podium{gap:8px}.podium-block{font-size:34px}.podium-block.p1{height:132px}.podium-block.p2{height:100px}.podium-block.p3{height:76px}.podium-name{font-size:13px}}.turn-transition{text-align:center;padding:56px 32px 64px;position:relative;overflow:hidden;animation:tt-card-in .55s cubic-bezier(.16,1,.3,1) both}.turn-transition:before{content:"";position:absolute;top:50%;left:50%;width:360px;height:360px;transform:translate(-50%,-50%);background:radial-gradient(circle,color-mix(in srgb,var(--brand) 22%,transparent) 0%,transparent 60%);border-radius:50%;z-index:0;animation:tt-glow-in .8s ease-out both}.turn-transition>*{position:relative;z-index:1}.transition-kicker{font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--brand);margin-bottom:22px;animation:tt-fade-up .5s .15s ease both}.transition-avatar{display:flex;justify-content:center;margin-bottom:18px;animation:tt-avatar-pop .7s .1s cubic-bezier(.18,1.4,.4,1) both}.transition-avatar .avatar{box-shadow:6px 6px 0 var(--ink)}.transition-name{font-size:38px;font-weight:900;margin:0 0 6px;letter-spacing:-.02em;animation:tt-fade-up .55s .3s ease both}.transition-sub{font-size:16px;color:var(--muted);margin:0;font-weight:600;animation:tt-fade-up .55s .42s ease both}@keyframes tt-card-in{0%{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes tt-avatar-pop{0%{opacity:0;transform:scale(.4) rotate(-8deg)}60%{opacity:1;transform:scale(1.08) rotate(2deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes tt-fade-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes tt-glow-in{0%{transform:translate(-50%,-50%) scale(.6);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}@media (prefers-reduced-motion: reduce){.turn-transition,.turn-transition:before,.transition-kicker,.transition-avatar,.transition-name,.transition-sub{animation:none}}.lobby-list{display:grid;gap:10px}.lobby-row{display:grid;grid-template-columns:110px 1fr 100px 80px 100px;align-items:center;gap:12px;padding:12px 16px;background:var(--paper);border:2px solid var(--ink);border-radius:14px}.lobby-row .code{font-family:Inter,-apple-system,Segoe UI,Roboto,sans-serif;letter-spacing:4px;font-size:18px;color:var(--ink)}.lobby-row .meta{font-size:12px;color:var(--muted)}.lobby-row .players-c{font-weight:800;font-size:14px}@media (max-width: 640px){.lobby-row{grid-template-columns:100px 1fr 60px}.lobby-row .meta-extra,.lobby-row .players-c{display:none}}.row{display:flex;gap:10px}.row.wrap{flex-wrap:wrap}.spacer{flex:1}.center{text-align:center}.mt-8{margin-top:8px}.mt-16{margin-top:16px}.mt-24{margin-top:24px}.mt-32{margin-top:32px}.mt-40{margin-top:40px}.mt-48{margin-top:48px}.gap-16>*+*{margin-top:16px}.gap-24>*+*{margin-top:24px}.tabs{display:inline-flex;background:var(--white);border:2px solid var(--ink);border-radius:999px;padding:4px;box-shadow:var(--shadow-sm)}.tab{padding:8px 16px;border-radius:999px;font-weight:700;font-size:13px;color:var(--muted);cursor:pointer}.tab.on{background:var(--accent);color:var(--on-accent)}.ad-slot{background:var(--white);border:2px dashed var(--ink);border-radius:16px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;position:relative;overflow:hidden}.ad-slot.banner{min-height:96px;margin:32px auto;max-width:728px;width:100%}.ad-slot.sidebar{min-height:240px}.ad-slot.in-card{min-height:90px;margin-top:16px}.ad-slot .live{color:var(--brand)}#toast-root{position:fixed;bottom:24px;left:50%;transform:translate(-50%);z-index:1000;display:flex;flex-direction:column;gap:8px}.toast{background:var(--ink);color:var(--paper);padding:12px 18px;border:2px solid var(--ink);border-radius:12px;box-shadow:var(--shadow);font-size:14px;font-weight:600;animation:pop .25s ease}.toast.err{background:#b91c1c}.toast.ok{background:#15803d}@keyframes pop{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 640px){.container{padding:0 16px}.hero{padding:32px 0 28px}.hero .grid-2{gap:28px}.hero h1{font-size:clamp(34px,10vw,56px)}.hero p.lede{font-size:16px;max-width:none}.hero .cta-row{flex-direction:column;align-items:stretch}.section{padding:36px 0}.section .head{margin-bottom:22px}.lobby-cards,.game-grid,.players{grid-template-columns:1fr}.screen{padding:22px 14px}.screen.game-stage{padding-top:16px}.site-header .inner{padding:12px 16px;gap:10px}.site-header .logo .name{font-size:20px}.btn.xl{padding:15px 22px;font-size:16px}.demo-card{padding:20px}.demo-card .opt{min-width:0}}@media (max-width: 540px){.card{padding:22px;border-radius:18px}.prompt{font-size:22px}.input.code{font-size:24px;letter-spacing:9px}.demo-card{transform:rotate(0)}}@media (max-width: 380px){.hero h1{font-size:32px}.input.code{font-size:20px;letter-spacing:6px}.btn{padding:11px 16px;font-size:14px}.card{padding:18px}}