:root{--bg:#121212;--bg-elev:#1a1a1a;--bg-card:#1c1c1c;--ink:#fff;--muted:#9a9a9a;--accent:#fc0;--accent-deep:#f0a800;--accent-soft:#ffcc0024;--line:#ffcc0038;--line-soft:#ffffff14;--danger:#ff6b6b;--ok:#5fbf88;--radius:18px;--radius-pill:999px;--font-display:"Fraunces", Georgia, serif;--font-body:"Outfit", system-ui, sans-serif;color:var(--ink);background:var(--bg);font-family:var(--font-body);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}*,:before,:after{box-sizing:border-box}html,body,#root{min-height:100dvh;margin:0}body{background:var(--bg);overflow-x:hidden}button,input{font:inherit;color:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}.app-shell{max-width:440px;min-height:100dvh;padding:max(1rem, env(safe-area-inset-top)) 1.15rem max(1.25rem, env(safe-area-inset-bottom));flex-direction:column;margin:0 auto;display:flex;position:relative}.atmosphere{pointer-events:none;z-index:-1;background:radial-gradient(70% 45% at 50% -5%,#ffcc0024,#0000 55%),#121212;position:fixed;inset:0}.atmosphere:before,.atmosphere:after{content:none}.qmarks{pointer-events:none;z-index:0;position:absolute;inset:0;overflow:hidden}.lobby-screen>:not(.qmarks):not(.lobby-footer){z-index:1;position:relative}.qmark{font-family:var(--font-display);color:#ffffff0e;-webkit-user-select:none;user-select:none;font-weight:700;line-height:1;position:absolute}.qmark.q1{font-size:9rem;top:8%;left:-4%;transform:rotate(-22deg)}.qmark.q2{font-size:7.5rem;top:22%;right:-6%;transform:rotate(16deg)}.qmark.q3{opacity:.85;font-size:5.5rem;top:48%;left:4%;transform:rotate(8deg)}.qmark.q4{font-size:8rem;top:58%;right:2%;transform:rotate(-12deg)}.qmark.q5{font-size:4.5rem;bottom:18%;left:18%;transform:rotate(24deg)}.qmark.q6{opacity:.7;font-size:3.8rem;top:34%;left:42%;transform:rotate(-28deg)}.qmark.q7{opacity:.8;font-size:6rem;bottom:28%;right:22%;transform:rotate(6deg)}.screen{flex-direction:column;flex:1;gap:.85rem;animation:.45s cubic-bezier(.22,1,.36,1) rise;display:flex}.home-screen,.handoff-screen{text-align:center;justify-content:center;padding-block:.5rem}.home-hero,.lobby-hero{object-fit:contain;width:min(100%,340px);height:auto;margin:0 auto;display:block}.home-hero{width:min(100%,360px);margin-bottom:-.35rem;animation:.7s cubic-bezier(.22,1,.36,1) hero-in}.site-qr-trigger{width:100%;margin-top:.15rem;margin-bottom:.15rem;animation:.55s cubic-bezier(.22,1,.36,1) .12s both rise}.site-qr-backdrop{z-index:40;background:radial-gradient(70% 45% at 50% 0,#ffcc001f,#0000 55%),#080808c7;place-items:center;padding:1.25rem;animation:.22s qr-fade;display:grid;position:fixed;inset:0}.site-qr-panel{border:1px solid var(--line);border-radius:var(--radius);text-align:center;background:linear-gradient(#1f1c14 0%,#171717 55%);flex-direction:column;gap:.75rem;width:min(100%,360px);padding:1.35rem 1.2rem 1.2rem;animation:.35s cubic-bezier(.22,1,.36,1) qr-pop;display:flex;box-shadow:0 18px 48px #00000073}.site-qr-title{font-family:var(--font-display);letter-spacing:-.02em;margin:0;font-size:1.65rem}.site-qr-text{color:var(--muted);margin:0;font-size:.98rem;line-height:1.4}.site-qr-frame{aspect-ratio:1;background:#fff;border-radius:16px;place-items:center;width:min(100%,280px);margin:.35rem auto 0;padding:.7rem;display:grid}.site-qr-frame img{width:100%;height:auto;display:block}.site-qr-loading{background:linear-gradient(90deg,#ececec,#f7f7f7,#ececec) 0 0/200% 100%;border-radius:8px;width:48%;height:48%;animation:1.1s ease-in-out infinite qr-shimmer}.site-qr-url{color:var(--muted);word-break:break-all;margin:.15rem 0 0;font-size:.82rem;line-height:1.35}@keyframes qr-fade{0%{opacity:0}to{opacity:1}}@keyframes qr-pop{0%{opacity:0;transform:translateY(10px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes qr-shimmer{0%{background-position:100% 0}to{background-position:-100% 0}}.lobby-hero{width:min(100%,220px);margin:-.25rem auto .15rem}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.eyebrow{text-transform:uppercase;letter-spacing:.18em;color:var(--accent);margin:0;font-size:.72rem;font-weight:700}.brand{font-family:var(--font-display);letter-spacing:-.02em;margin:.15rem 0 0;font-size:clamp(2.4rem,10vw,3.2rem);font-weight:700;line-height:1.05}.handoff-name{font-size:clamp(2.2rem,10vw,3rem)}.lede{max-width:28ch;color:var(--muted);margin:.35rem auto .75rem;font-size:1.05rem;line-height:1.45}.screen-title{font-family:var(--font-display);letter-spacing:-.02em;margin:0;font-size:2rem}.screen-sub{color:var(--muted);margin:-.25rem 0 .5rem;line-height:1.4}.how-to,.done-list{text-align:left;gap:.65rem;margin:1rem 0 0;padding:0;list-style:none;display:grid}.how-to li,.done-list li{border:1px solid var(--line-soft);border-radius:var(--radius);background:var(--bg-card);color:var(--muted);padding:.85rem 1rem}.done-list li{color:var(--ink);justify-content:space-between;gap:.75rem;display:flex}.done-muted{color:var(--muted);font-size:.9rem}.done-ok{color:var(--accent);font-size:.9rem}.btn{appearance:none;border-radius:var(--radius-pill);border:none;padding:.95rem 1.4rem;font-size:1rem;font-weight:700;transition:transform .15s,background .2s,opacity .2s}.btn:active:not(:disabled){transform:scale(.98)}.btn-primary{background:linear-gradient(180deg, #ffe14a, var(--accent) 45%, var(--accent-deep));color:#14110a;margin-top:.35rem;box-shadow:0 10px 28px #ffcc0047}.btn-ghost{border:1px solid var(--line-soft);color:var(--ink);background:0 0}.btn-muted{color:#8a8070;background:#2a2418;border:1px solid #ffcc0014;margin-top:.35rem}.back-link-gold{color:var(--accent);font-weight:600}.btn-spark{justify-content:center;align-items:center;gap:.55rem;width:100%;display:inline-flex;position:relative}.btn-svg{flex-shrink:0}.btn-muted .btn-svg{opacity:.7}.back-link{color:var(--muted);background:0 0;border:none;align-self:flex-start;padding:0;font-size:.95rem;font-weight:500}.players-form{flex-direction:column;flex:1;gap:.85rem;display:flex}.form-hint{text-align:center;color:var(--muted);margin:0;font-size:.9rem}.form-error{color:var(--danger);text-align:center;margin:0;font-size:.92rem}.name-list{gap:.65rem;display:grid}.name-row{grid-template-columns:2rem 1fr auto;align-items:center;gap:.5rem;display:grid}.name-index{background:var(--accent-soft);width:2rem;height:2rem;color:var(--accent);border-radius:50%;place-items:center;font-size:.85rem;font-weight:600;display:grid}.field{border:1px solid var(--line-soft);background:var(--bg-card);border-radius:14px;outline:none;width:100%;padding:.85rem 1rem}.field:focus{border-color:#ffcc008c}.field-lg{padding:1rem 1.1rem;font-size:1.15rem}.icon-btn{border:1px solid var(--line-soft);width:2.25rem;height:2.25rem;color:var(--muted);background:0 0;border-radius:50%;font-size:1.25rem;line-height:1}.label{color:var(--muted);margin-top:.35rem;font-size:.85rem;font-weight:600}.theme-grid{flex-wrap:wrap;gap:.45rem;display:flex}.theme-chip{border:1px solid var(--line-soft);background:var(--bg-card);color:var(--muted);border-radius:var(--radius-pill);padding:.45rem .8rem;font-size:.88rem;font-weight:500}.theme-chip.is-active{background:var(--accent-soft);color:var(--accent);border-color:#ffcc008c}.mode-cards{text-align:left;gap:.85rem;width:100%;margin-top:.5rem;display:grid}.mode-card{border-radius:var(--radius);border:1px solid var(--line);background:var(--bg-card);text-align:left;gap:.45rem;padding:1.15rem 1.2rem;transition:border-color .2s,transform .15s;display:grid}.mode-card:active{transform:scale(.99)}.mode-card:hover{border-color:#ffcc008c}.mode-card-title{font-family:var(--font-display);color:var(--ink);font-size:1.35rem}.mode-card-text{color:var(--muted);font-size:.95rem;line-height:1.4}.mode-toggle{flex-wrap:wrap;gap:.45rem;display:flex}.lobby-screen{gap:.75rem;padding-bottom:.25rem;position:relative;overflow:hidden}.lobby-hero{filter:drop-shadow(0 12px 28px #ffcc002e);width:min(100%,240px);margin:-.35rem auto .1rem}.lobby-heading{justify-content:space-between;align-items:baseline;gap:.75rem;display:flex}.lobby-heading .screen-title{margin:0}.room-people{border-radius:var(--radius-pill);color:#7dcca0;background:#121212e6;border:1px solid #5fbf888c;align-items:center;gap:.4rem;margin:0;padding:.35rem .75rem;font-size:.82rem;font-weight:600;display:inline-flex}.room-people-lg{flex-shrink:0;font-size:.88rem}.room-people-home{justify-content:center;align-self:center;margin-top:.35rem}.room-people-dot{background:var(--ok);border-radius:50%;width:.5rem;height:.5rem;box-shadow:0 0 0 3px #5fbf8833}.theme-row{border:1px solid var(--line);background:var(--bg-card);text-align:left;border-radius:18px;align-items:center;gap:.85rem;width:100%;padding:.85rem 1rem;display:flex}.theme-row-icon{background:0 0;border-radius:12px;flex-shrink:0;place-items:center;width:2.6rem;height:2.6rem;display:grid}.theme-mini-cards{display:none}.theme-row-text{min-width:0;color:var(--ink);flex:1;margin:0;font-size:.98rem}.theme-row-text strong{color:var(--accent);font-weight:700}.theme-row-chevron{color:var(--accent);font-size:1.2rem;font-weight:700}.theme-picker{border:1px solid var(--line);background:#1c1c1cf2;border-radius:18px;gap:.65rem;padding:.85rem;display:grid}.player-card-list{gap:.55rem;margin:.15rem 0 0;padding:0;list-style:none;display:grid}.player-card{border:1px solid var(--line);background:#181818eb;border-radius:18px;align-items:center;gap:.75rem;padding:.8rem .9rem;display:flex;position:relative}.player-card.is-you{background:linear-gradient(90deg,#ffcc0014,#181818f2 55%);border-color:#ffcc0059}.player-card:has(.player-crown){padding-right:.9rem}.player-avatar{width:2.55rem;height:2.55rem;font-family:var(--font-body);color:#fff;background:#3a3a3a;border-radius:50%;flex-shrink:0;place-items:center;font-size:1.05rem;font-weight:700;display:grid}.player-card.is-you .player-avatar{color:#fff;background:#3a3a3a}.player-card-actions{flex-shrink:0;align-items:center;gap:.45rem;margin-left:auto;display:flex}.player-crown{filter:drop-shadow(0 2px 4px #ffcc0059);place-items:center;display:grid;position:static;top:auto;right:auto;transform:none}.player-menu{color:var(--muted);opacity:.75;place-items:center;display:grid}.player-card-main{flex:1;min-width:0}.player-card-line{justify-content:space-between;align-items:baseline;gap:.5rem;display:flex}.player-card-name{font-family:var(--font-body);color:var(--ink);text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:1.05rem;font-weight:700;line-height:1.2;overflow:hidden}.player-status{display:none}.player-card-sub{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin:.18rem 0 0;font-size:.82rem;line-height:1.3;overflow:hidden}.player-sep{color:var(--muted)}.player-word{color:var(--ink);font-weight:600}.player-word.is-hidden,.player-word.is-pending{color:var(--muted);font-weight:500}.lobby-actions{gap:.65rem;margin-top:auto;padding-top:.5rem;display:grid}.lobby-footer{pointer-events:none;z-index:1;height:110px;margin:.75rem -1.15rem -1.25rem;position:relative;overflow:hidden}.lobby-footer-glow{filter:blur(2px);background:radial-gradient(#ffcc0073,#0000 70%);width:220px;height:120px;position:absolute;bottom:-20px;left:50%;transform:translate(-50%)}.lobby-footer-curve{background:linear-gradient(#e0b000,#b8860b);border-radius:100% 100% 0 0/48px;position:absolute;inset:48px 0 0}.lobby-footer-cards{justify-content:center;align-items:flex-end;gap:2rem;padding-bottom:.55rem;display:flex;position:absolute;inset:0}.lobby-footer-card{background:#f7f2e4;border:3px solid #fc0;border-radius:12px;width:62px;height:80px;position:relative;box-shadow:0 10px 22px #0006,0 0 0 2px #111}.lobby-footer-card:before,.lobby-footer-card:after{content:"";background:linear-gradient(#fc0,#fc0) 50%/2px 100% no-repeat,linear-gradient(#fc0,#fc0) 50%/100% 2px no-repeat;width:10px;height:10px;position:absolute}.lobby-footer-card:before{top:-8px;left:-8px}.lobby-footer-card:after{bottom:-8px;right:-8px}.lobby-footer-card-person{background-image:radial-gradient(circle at 50% 34%,#1a1a1a 0 8px,#0000 9px),radial-gradient(at 50% 78%,#1a1a1a 0 14px,#0000 15px);background-repeat:no-repeat}.lobby-footer-card-idea{background-image:radial-gradient(circle at 50% 36%,#1a1a1a 0 10px,#0000 11px),linear-gradient(#1a1a1a,#1a1a1a);background-position:50%,50% 74%;background-repeat:no-repeat;background-size:auto,9px 11px}.lobby-footer-card:first-child{transform:rotate(-16deg)translateY(8px)}.lobby-footer-card:last-child{transform:rotate(16deg)translateY(8px)}.reveal-screen{text-align:center;flex-direction:column;flex:1;align-items:center;gap:.5rem;animation:.45s cubic-bezier(.22,1,.36,1) rise;display:flex}.reveal-screen.is-closing{opacity:0;transition:opacity .25s,transform .25s;transform:translateY(12px)}.reveal-meta{color:var(--accent);text-transform:uppercase;letter-spacing:.14em;margin:0;font-size:.72rem;font-weight:700}.reveal-name{font-family:var(--font-display);margin:0;font-size:2rem}.reveal-hint{color:var(--muted);max-width:28ch;margin:0 0 .5rem;line-height:1.4}.reveal-stage{flex:1;place-items:center;width:100%;min-height:320px;display:grid}.reveal-card{aspect-ratio:3/4.1;touch-action:none;-webkit-user-select:none;user-select:none;cursor:grab;border-radius:28px;width:min(100%,300px);position:relative;box-shadow:0 24px 60px #00000073,inset 0 1px #ffffff0f}.reveal-card:active{cursor:grabbing}.reveal-card-face{border-radius:inherit;backface-visibility:hidden;flex-direction:column;justify-content:center;align-items:center;padding:1.5rem;display:flex;position:absolute;inset:0}.reveal-card-front{background:linear-gradient(160deg,#242424 0%,#151515 55%,#0e0e0e 100%);border:1px solid #ffcc0047;gap:1.25rem;transition:opacity .35s}.reveal-card.is-revealed .reveal-card-front{opacity:0;pointer-events:none}.reveal-card-back{opacity:0;background:linear-gradient(165deg,#2a2a2a 0%,#171717 60%,#101010 100%);border:1px solid #ffcc0073;transition:opacity .35s,transform .35s;transform:scale(.96)}.reveal-card.is-revealed .reveal-card-back{opacity:1;transform:scale(1)}.reveal-orb{pointer-events:none;background:radial-gradient(circle,#ffcc0059,#0000 70%);border-radius:50%;width:140px;height:140px;position:absolute;top:22%}.pull-affordance{color:var(--accent);z-index:1;flex-direction:column;align-items:center;gap:.2rem;font-size:.95rem;font-weight:700;animation:1.6s ease-in-out infinite bob;display:flex}.pull-chevron{font-size:1.6rem;line-height:1}.front-label{z-index:1;font-family:var(--font-display);letter-spacing:-.02em;margin:0;font-size:1.55rem}.back-theme{text-transform:uppercase;letter-spacing:.16em;color:var(--accent);margin:0;font-size:.72rem;font-weight:700}.back-word{font-family:var(--font-display);letter-spacing:-.02em;margin:.75rem 0;font-size:clamp(1.8rem,8vw,2.35rem);line-height:1.15}.back-note,.back-pass{color:var(--muted);max-width:22ch;margin:0;font-size:.95rem;line-height:1.4}.back-pass strong{color:var(--ink)}.reveal-footer{color:var(--muted);margin:.5rem 0 0;font-size:.9rem}.reveal-screen .btn-primary{width:100%;max-width:300px}.forehead-countdown{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.5rem;min-height:70dvh;padding:1.5rem;display:flex}.forehead-countdown-label{text-transform:uppercase;letter-spacing:.18em;color:var(--accent);margin:0;font-size:.8rem;font-weight:700}.forehead-countdown-number{font-family:var(--font-display);letter-spacing:-.04em;color:var(--ink);margin:0;font-size:clamp(5.5rem,28vw,8rem);line-height:1;animation:.45s cubic-bezier(.22,1,.36,1) countdown-pop}@keyframes countdown-pop{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.forehead-live{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.75rem;min-height:70dvh;padding:1.5rem;animation:.45s cubic-bezier(.22,1,.36,1) rise;display:flex}.forehead-theme{text-transform:uppercase;letter-spacing:.18em;color:var(--accent);margin:0;font-size:.8rem;font-weight:700}.forehead-word{font-family:var(--font-display);letter-spacing:-.02em;margin:0;font-size:clamp(2.4rem,12vw,3.6rem);line-height:1.1}.forehead-caption{color:var(--muted);margin:0}.host-bar{justify-content:center;padding-top:.75rem;display:flex;position:sticky;bottom:0}@keyframes rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes hero-in{0%{opacity:0;transform:translateY(18px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width>=480px){.app-shell{border-inline:1px solid var(--line-soft)}}
