@import"https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&display=swap";:root{color-scheme:dark;--bg: #111111;--surface: #1a1a1a;--surface-warm: #222222;--surface-hover: #2a2a2a;--text: #e8e6e3;--text-secondary: #9a9590;--text-tertiary: #6b6560;--line: #2a2725;--line-dark: #3a3633;--accent: #e8e6e3;--accent-soft: rgba(232, 230, 227, .08);--spy-red: #ef4444;--spy-red-soft: rgba(239, 68, 68, .1);--safe-green: #4ade80;--safe-green-soft: rgba(74, 222, 128, .1);--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;font-family:IBM Plex Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{color:var(--text);background:var(--bg)}.app-shell{width:100%;min-height:100%;display:flex;flex-direction:column}.brand-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:1rem 1.25rem;border-bottom:1px solid var(--line);background:var(--surface);position:sticky;top:0;z-index:100}.brand-badge,.brand-kicker{display:none}.brand-title{font-family:"Instrument Serif",Georgia,serif;font-size:1.5rem;font-weight:400;letter-spacing:-.01em;text-align:center;line-height:1}.hero{display:none}.panels{flex:1;display:flex;flex-direction:column;gap:0;max-width:480px;width:100%;margin:0 auto;padding:0 1.25rem 2rem}.panel{display:flex;flex-direction:column;gap:0;background:transparent;border:none;border-radius:0;padding:0}.panel h3{font-family:"Instrument Serif",Georgia,serif;font-size:1.35rem;font-weight:400;letter-spacing:-.01em;padding:1.25rem 0 .75rem;border-bottom:1px solid var(--line);margin-bottom:.75rem}.panel-copy{color:var(--text-secondary);font-size:.875rem;line-height:1.5;margin-bottom:.75rem}.splash{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1.5rem;max-width:480px;width:100%;margin:0 auto;min-height:100dvh}.splash-content{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:1.25rem}.splash-title{font-family:"Instrument Serif",Georgia,serif;font-size:clamp(3rem,12vw,4.5rem);font-weight:400;letter-spacing:-.02em;line-height:1.05;color:var(--text)}.splash-tagline{font-size:1rem;line-height:1.55;color:var(--text-secondary);max-width:28ch}.splash-bottom{width:100%;display:flex;flex-direction:column;align-items:center;gap:.875rem;padding-bottom:2.5rem}.splash-htp-link{background:none;border:none;font-family:inherit;font-size:.875rem;font-weight:500;color:var(--text-secondary);cursor:pointer;padding:.25rem 0;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line-dark);transition:color .15s ease}.splash-htp-link:active{color:var(--text)}.control-block{display:flex;align-items:center;justify-content:space-between;padding:.875rem 0;border-bottom:1px solid var(--line)}.control-block label{font-size:.9375rem;font-weight:500;color:var(--text)}.control-right{display:flex;align-items:center;gap:.625rem}.stepper-value{font-family:"Instrument Serif",Georgia,serif;font-size:1.5rem;font-weight:400;color:var(--text);-webkit-user-select:none;user-select:none;min-width:1.75rem;text-align:right;line-height:1}.stepper{display:flex;align-items:center;border:1px solid var(--line-dark);border-radius:var(--radius-sm);overflow:hidden;background:transparent}.stepper-btn{display:flex;align-items:center;justify-content:center;width:32px;height:26px;background:none;border:none;color:var(--text-secondary);cursor:pointer;font-family:inherit;transition:color .1s ease,background .1s ease;-webkit-tap-highlight-color:transparent}.stepper-btn:first-child{border-right:1px solid var(--line-dark)}.stepper-btn:active:not(:disabled){background:var(--surface-hover);color:var(--text)}.stepper-btn:disabled{color:var(--text-tertiary);opacity:.3;cursor:not-allowed}.mode-toggle{padding:.875rem 0;border-bottom:1px solid var(--line);border:none;border-radius:0;background:transparent}.mode-toggle p{font-size:.9375rem;font-weight:500;color:var(--text);text-transform:none;letter-spacing:0;margin-bottom:.625rem}.mode-toggle small{display:block;margin-top:.5rem;color:var(--text-tertiary);font-size:.8125rem;line-height:1.4}.pill-row{display:inline-flex;gap:0;border:1.5px solid var(--line-dark);border-radius:var(--radius-md);padding:3px;background:var(--surface-warm)}.pill-btn{border:none;border-radius:calc(var(--radius-md) - 3px);padding:.5rem 1rem;font-family:inherit;font-size:.875rem;font-weight:500;color:var(--text-secondary);background:transparent;cursor:pointer;transition:all .2s ease}.pill-btn.active{background:var(--surface-hover);color:var(--text);box-shadow:0 1px 4px #0000004d;border:none}.category-tabs{display:flex;gap:.375rem;padding:.25rem 0 .75rem;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}.category-tabs::-webkit-scrollbar{display:none}.category-tab{display:inline-flex;align-items:center;gap:.375rem;border:1.5px solid var(--line-dark);border-radius:var(--radius-xl);padding:.4375rem .75rem;font-family:inherit;font-size:.8125rem;font-weight:500;color:var(--text-secondary);background:var(--surface-warm);cursor:pointer;white-space:nowrap;transition:all .15s ease}.category-tab:active{background:var(--surface-hover)}.category-tab.active{background:var(--accent);color:var(--bg);border-color:var(--accent)}.category-count{font-size:.6875rem;font-weight:600;opacity:.7}.category-actions{display:flex;gap:.75rem;padding-bottom:.5rem}.text-btn{background:none;border:none;font-family:inherit;font-size:.75rem;font-weight:600;color:var(--text-secondary);cursor:pointer;padding:.25rem 0;text-decoration:underline;text-underline-offset:2px}.text-btn:active{color:var(--text)}.spicy-notice{font-size:.75rem;color:#ef4444;background:#ef444414;border:1px solid rgba(239,68,68,.15);border-radius:var(--radius-sm);padding:.5rem .75rem;margin-bottom:.5rem;overflow:hidden}.pack-grid{display:grid;grid-template-columns:1fr 1fr;gap:.625rem;margin-top:.25rem}.pack-card{position:relative;border:1.5px solid var(--line);border-radius:var(--radius-md);background:var(--surface);color:inherit;text-align:center;padding:1rem .75rem .75rem;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.375rem;font-family:inherit;transition:border-color .2s ease,background .2s ease,box-shadow .2s ease}.pack-card:active{background:var(--surface-warm)}.pack-card.selected{border-color:var(--accent);background:var(--accent-soft)}.pack-icon{font-size:1.75rem;line-height:1;margin-bottom:.25rem}.pack-select-indicator{position:absolute;top:.625rem;right:.625rem;display:flex;align-items:center;justify-content:center}.pack-card h4{font-size:.875rem;font-weight:600;margin:0;line-height:1.2}.pack-card p{font-size:.6875rem;color:var(--text-secondary);line-height:1.35;margin:0}.pack-meta{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:auto;padding-top:.5rem}.pack-difficulty{font-size:.5625rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;padding:.1875rem .5rem;border-radius:999px;line-height:1.2;color:var(--text-tertiary);border:1px solid var(--line)}.pack-word-count{font-size:.6875rem;font-weight:500;color:var(--text-tertiary)}.pack-examples{font-size:.625rem;font-style:italic;color:var(--text-tertiary);line-height:1.3;margin:0}.pack-picker-section{margin-top:.75rem}.pack-picker-section>p{font-size:.8125rem;font-weight:500;color:var(--text-secondary);margin-bottom:.5rem}.pack-picker-trigger{width:100%;display:flex;flex-direction:column;gap:.375rem;padding:.875rem 1rem;border:1.5px solid var(--line-dark);border-radius:var(--radius-md);background:var(--surface-warm);cursor:pointer;font-family:inherit;color:inherit;text-align:left;transition:border-color .15s ease,background .15s ease}.pack-picker-trigger:active{background:var(--surface-hover);border-color:var(--accent)}.pack-picker-trigger-top{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.pack-picker-trigger-label{font-size:.875rem;font-weight:600}.pack-picker-trigger-count{font-size:.6875rem;font-weight:500;color:var(--text-tertiary);flex-shrink:0}.pack-picker-trigger-bottom{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.pack-picker-trigger-preview{font-size:.75rem;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pack-picker-trigger-action{font-size:.75rem;font-weight:600;color:var(--text-secondary);flex-shrink:0}.picker-controls{flex-shrink:0;padding:.75rem 1.25rem 0;display:flex;flex-direction:column;gap:.5rem}.picker-controls-row{display:flex;flex-direction:column;gap:.5rem}.picker-controls .category-tabs{padding:0}.picker-actions{display:flex;gap:.75rem}.picker-scroll{flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:.75rem 1.25rem}.cta-row{display:flex;flex-direction:column;gap:.5rem;padding:1.25rem 0 .5rem}.cta-row.centered{align-items:center}.cta-hint{font-size:.75rem;color:var(--text-tertiary);text-align:center;padding:0 0 .25rem}.primary-btn,.secondary-btn{width:100%;border-radius:var(--radius-xl);padding:.9375rem 1.25rem;font-size:.9375rem;font-weight:600;text-transform:none;letter-spacing:0;transition:all .15s ease}.primary-btn{background:#e8e6e3;color:#111;border:none}.primary-btn:active{transform:scale(.98);background:#d4d1cd}.primary-btn:disabled{opacity:.3;pointer-events:none}.secondary-btn{background:var(--surface-warm);color:var(--text);border:1.5px solid var(--line-dark)}.secondary-btn:active{background:var(--surface-hover)}.reveal-panel{flex:1;display:flex;flex-direction:column;background:transparent;border:none;border-radius:0;padding:0;gap:0}.progress-row{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1.25rem}.back-link{background:none;border:none;font-family:inherit;font-size:.8125rem;font-weight:500;color:var(--text-secondary);cursor:pointer;padding:.25rem 0;text-decoration:underline;text-underline-offset:2px}.back-link:active{color:var(--text)}.progress-row label{font-size:.8125rem;font-weight:500;text-transform:none;letter-spacing:0;color:var(--text-secondary)}.progress-row strong{font-family:IBM Plex Sans,sans-serif;font-size:.875rem;font-weight:600}progress{width:100%;height:3px;border-radius:0;overflow:hidden;border:none;display:block}progress::-webkit-progress-bar{background:var(--line)}progress::-webkit-progress-value{background:var(--accent);transition:width .3s ease}progress::-moz-progress-bar{background:var(--accent)}.reveal-card{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem 1.5rem;gap:0;border:none;border-radius:0;background:transparent;perspective:1000px;min-height:65vh}.pass-label{font-size:.8125rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-tertiary);margin-bottom:.75rem}.reveal-card h3{font-family:"Instrument Serif",Georgia,serif;font-size:1.5rem;font-weight:400;margin-bottom:1.5rem;line-height:1.2}.word-display{font-family:"Instrument Serif",Georgia,serif;font-size:clamp(2.5rem,12vw,4rem);font-weight:400;letter-spacing:-.02em;line-height:1.1;margin-bottom:.75rem;padding:1rem 0}.word-display.spy{color:var(--spy-red)}.role-note{font-size:.875rem;color:var(--text-secondary);margin-bottom:.5rem;padding:.5rem 1rem;background:var(--surface-warm);border-radius:var(--radius-sm)}.reveal-card .cta-row{width:100%;max-width:320px;padding-top:2rem}.debate-card{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem 1.5rem;gap:1rem;border:none;border-radius:0;background:transparent;min-height:65vh}.debate-card h3{font-family:"Instrument Serif",Georgia,serif;font-size:1.5rem;font-weight:400;line-height:1.2}.debate-card>p{color:var(--text-secondary);font-size:.9375rem;line-height:1.5;max-width:36ch}.debate-metadata{display:flex;flex-wrap:wrap;justify-content:center;gap:.375rem}.debate-metadata span{padding:.375rem .75rem;border:1px solid var(--line);border-radius:var(--radius-xl);font-size:.75rem;font-weight:500;color:var(--text-secondary);text-transform:none;letter-spacing:0}.timer-box{font-family:"Instrument Serif",Georgia,serif;font-size:clamp(3rem,15vw,5rem);font-weight:400;line-height:1;letter-spacing:-.02em;padding:.75rem 0;color:var(--text);transition:color .3s ease}.timer-box.urgent{color:var(--spy-red)}.alert-banner{border-radius:var(--radius-sm);border:1px solid var(--line);background:var(--surface-warm);padding:.75rem 1rem;text-align:center;font-size:.8125rem;color:var(--text-secondary);max-width:360px}.debate-card .cta-row{width:100%;max-width:320px;padding-top:1rem}.hero-chip{display:inline-block;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-tertiary);border:none;border-radius:0;padding:0;background:none;margin-bottom:.5rem}.hero-metrics{display:flex;justify-content:center;gap:.5rem;padding:.75rem 1.25rem;border-bottom:1px solid var(--line);flex-wrap:wrap}.hero-metrics span{font-size:.75rem;font-weight:500;color:var(--text-tertiary);padding:.25rem .625rem;background:var(--surface-warm);border-radius:var(--radius-xl);border:none}@media (max-width: 740px){.brand-title{font-size:1.35rem}.pack-grid{grid-template-columns:1fr 1fr}}@media (min-width: 741px){.panels{max-width:560px}.pack-grid{grid-template-columns:repeat(3,1fr)}.reveal-card,.debate-card{min-height:70vh}}.card-flip-container{width:100%;max-width:320px;aspect-ratio:3 / 4;perspective:1200px;cursor:pointer}.card-flip-inner{position:relative;width:100%;height:100%;transition:transform .6s cubic-bezier(.4,0,.2,1);transform-style:preserve-3d}.card-flip-inner.flipped{transform:rotateY(180deg)}.card-face{position:absolute;width:100%;height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:var(--radius-lg);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 1.5rem;gap:.75rem;border:1.5px solid var(--line-dark)}.card-front{background:var(--surface)}.card-front-pattern{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;opacity:.06;background-image:repeating-linear-gradient(45deg,var(--text) 0px,var(--text) 1px,transparent 1px,transparent 12px);pointer-events:none}.card-front-icon{font-family:"Instrument Serif",Georgia,serif;font-size:3.5rem;line-height:1;color:var(--text);margin-bottom:.5rem}.card-front-label{font-size:.8125rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--text-secondary)}.card-front-hint{font-size:.75rem;color:var(--text-tertiary);margin-top:auto}.card-back{background:var(--surface);transform:rotateY(180deg)}.card-back.spy{border-color:var(--spy-red);background:var(--spy-red-soft)}.card-back-pack{font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--text-tertiary);opacity:.7;background:#ffffff0f;padding:.2rem .6rem;border-radius:999px;margin-bottom:.25rem}.card-back-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-tertiary)}.card-back-word{font-family:"Instrument Serif",Georgia,serif;font-size:clamp(2rem,8vw,3rem);font-weight:400;letter-spacing:-.02em;line-height:1.1;color:var(--text)}.card-back.spy .card-back-word{color:var(--spy-red)}.card-back-role{font-size:.8125rem;color:var(--text-secondary);padding:.375rem .875rem;background:var(--surface-warm);border-radius:var(--radius-sm)}.card-back.spy .card-back-role{background:#ef44441f}.spy-icon{width:56px;height:56px;color:var(--spy-red)}.card-back-instruction{font-size:.75rem;line-height:1.4;color:var(--text-tertiary);text-align:center;max-width:22ch;margin-top:auto}.card-back.spy .card-back-instruction{color:#ef444499}.card-tap-hint{font-size:.8125rem;font-weight:500;color:var(--text-tertiary);margin-top:1rem;text-align:center}.player-dots{display:flex;gap:6px;justify-content:center;padding:.5rem 0}.player-dot{width:8px;height:8px;border-radius:50%;background:var(--line);transition:all .3s ease}.player-dot.done{background:var(--accent)}.player-dot.active{background:var(--accent);transform:scale(1.3)}.how-to-play-btn{justify-self:end;display:inline-flex;align-items:center;gap:.375rem;background:none;border:1.5px solid var(--line-dark);border-radius:var(--radius-xl);padding:.375rem .75rem;font-family:inherit;font-size:.75rem;font-weight:500;color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.how-to-play-btn:active{background:var(--surface-warm);color:var(--text)}.how-to-play-btn svg{flex-shrink:0}.htp-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#000000bf;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;align-items:flex-end;justify-content:center;padding:0}.htp-modal{width:100%;max-width:520px;max-height:92vh;background:var(--surface);border-radius:var(--radius-xl) var(--radius-xl) 0 0;display:flex;flex-direction:column;overflow:hidden}.htp-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.25rem .75rem;border-bottom:1px solid var(--line);flex-shrink:0}.htp-header h2{font-family:"Instrument Serif",Georgia,serif;font-size:1.35rem;font-weight:400}.htp-close{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.25rem;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:color .15s ease}.htp-close:active{color:var(--text)}.htp-content{overflow-y:auto;overscroll-behavior:contain;padding:1.25rem;display:flex;flex-direction:column;gap:1.25rem;-webkit-overflow-scrolling:touch}.htp-step{display:flex;flex-direction:column;gap:.75rem}.htp-step-illustration{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-md);padding:.5rem;display:flex;align-items:center;justify-content:center}.htp-step-illustration svg{width:100%;max-width:240px;height:auto}.htp-step-text{display:flex;gap:.75rem;align-items:flex-start}.htp-step-number{flex-shrink:0;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line-dark);display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;color:var(--text);margin-top:.1rem}.htp-step-text h4{font-size:.9375rem;font-weight:600;margin-bottom:.25rem}.htp-step-text p{font-size:.8125rem;line-height:1.5;color:var(--text-secondary)}.htp-divider{height:1px;background:var(--line);margin:.25rem 0}.htp-section-title{font-family:"Instrument Serif",Georgia,serif;font-size:1.15rem;font-weight:400}.htp-modes{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.htp-mode-card{border:1.5px solid var(--line);border-radius:var(--radius-md);padding:.875rem;display:flex;flex-direction:column;gap:.5rem}.htp-mode-illustration{background:var(--bg);border-radius:var(--radius-sm);padding:.375rem;display:flex;align-items:center;justify-content:center}.htp-mode-illustration svg{width:100%;height:auto}.htp-mode-card h4{font-size:.875rem;font-weight:600}.htp-mode-card p{font-size:.75rem;line-height:1.4;color:var(--text-secondary)}.htp-mode-card ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:.25rem}.htp-mode-card li{font-size:.6875rem;color:var(--text-tertiary);padding-left:.875rem;position:relative;line-height:1.4}.htp-mode-card li:before{content:"";position:absolute;left:0;top:.4em;width:4px;height:4px;border-radius:50%;background:var(--text-tertiary)}.htp-tip{display:flex;gap:.75rem;align-items:flex-start;padding:.875rem;background:var(--spy-red-soft);border:1px solid rgba(239,68,68,.15);border-radius:var(--radius-md)}.htp-tip-icon{flex-shrink:0;color:var(--spy-red);margin-top:.1rem}.htp-tip strong{font-size:.8125rem;font-weight:600;color:var(--spy-red);display:block;margin-bottom:.25rem}.htp-tip p{font-size:.75rem;line-height:1.5;color:#ef4444b3}.htp-got-it{margin:.75rem 1.25rem 1.25rem;flex-shrink:0;width:calc(100% - 2.5rem)}.mode-description{overflow:hidden}.mode-description-inner{margin-top:.625rem;padding:.75rem;background:var(--surface-warm);border:1px solid var(--line);border-radius:var(--radius-sm);display:flex;flex-direction:column;gap:.25rem}.mode-description-inner strong{font-size:.8125rem;font-weight:600;color:var(--text)}.mode-description-inner span{font-size:.75rem;line-height:1.5;color:var(--text-secondary)}@media (min-width: 741px){.htp-overlay{align-items:center;padding:2rem}.htp-modal{border-radius:var(--radius-xl);max-height:85vh}}@media (max-width: 420px){.how-to-play-btn span{display:none}}@media (max-width: 360px){.htp-modes{grid-template-columns:1fr}}.site-footer{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1.5rem 1.25rem 2rem;border-top:1px solid var(--line);margin-top:auto}.site-footer span{font-size:.75rem;color:var(--text-tertiary)}.footer-socials{display:flex;gap:.75rem}.footer-socials a{color:var(--text-tertiary);transition:color .15s ease;display:flex;align-items:center;justify-content:center;padding:.25rem}.footer-socials a:active{color:var(--text)}