*,:before,:after{box-sizing:border-box}body{margin:0}*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f0f13;--surface:#1a1a24;--surface2:#252535;--border:#2e2e45;--text:#e8e8f0;--muted:#88a;--accent:#6c63ff;--accent-glow:#6c63ff59;--ai:#10b981;--ai-glow:#10b98159;--win:#f59e0b;--win-glow:#f59e0b66;--danger:#ef4444;--radius:10px;--font:"Inter", system-ui, sans-serif}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;min-height:100vh}.app{flex-direction:column;min-height:100vh;display:flex}.lang-top{justify-content:flex-end;padding:12px 20px 0;display:flex}.btn-ghost{border:1px solid var(--border);color:var(--text);border-radius:var(--radius);cursor:pointer;touch-action:manipulation;background:0 0;padding:6px 14px;font-size:13px;transition:border-color .15s,background .15s}.btn-ghost:hover{border-color:var(--accent);background:var(--surface2)}.btn-primary{background:var(--accent);color:#fff;border-radius:var(--radius);cursor:pointer;touch-action:manipulation;border:none;padding:8px 18px;font-size:14px;font-weight:600;transition:opacity .15s,box-shadow .15s}.btn-primary:hover{opacity:.88;box-shadow:0 0 12px var(--accent-glow)}.mode-selector{flex-direction:column;flex:1;align-items:center;padding:20px 20px 40px;display:flex}.logo{letter-spacing:-2px;color:var(--text);margin-bottom:8px;font-size:clamp(3rem,10vw,6rem);font-weight:900;line-height:1}.logo span{color:var(--accent)}.tagline{color:var(--muted);text-align:center;max-width:480px;margin-bottom:36px;font-size:15px}.mode-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;width:100%;max-width:860px;display:grid}.mode-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;text-align:left;touch-action:manipulation;flex-direction:column;gap:6px;padding:20px;transition:border-color .15s,box-shadow .15s,transform .1s;display:flex}.mode-card:hover{border-color:var(--accent);box-shadow:0 0 16px var(--accent-glow);transform:translateY(-2px)}.mode-card--formal{background:linear-gradient(135deg, var(--surface), #1a1330);border-color:#8b5cf666}.mode-card--formal:hover{border-color:#a78bfa;box-shadow:0 0 20px #8b5cf666}.mode-card--formal .mode-name{color:#a78bfa}.mode-divider{width:100%;max-width:860px;color:var(--muted);letter-spacing:1px;text-transform:uppercase;align-items:center;gap:12px;margin:8px 0 4px;font-size:12px;display:flex}.mode-divider:before,.mode-divider:after{content:"";background:var(--border);flex:1;height:1px}.mode-grid--special{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));max-width:860px}.mode-card--collective{background:linear-gradient(135deg, var(--surface), #0f1f1a);border-color:#10b98159}.mode-card--collective:hover{border-color:var(--ai);box-shadow:0 0 20px var(--ai-glow)}.mode-card--collective .mode-name{color:var(--ai)}.mode-card--consulting{background:linear-gradient(135deg, var(--surface), #1f1700);border-color:#f59e0b59}.mode-card--consulting:hover{border-color:var(--win);box-shadow:0 0 20px var(--win-glow)}.mode-card--consulting .mode-name{color:var(--win)}.mode-card--publishing{background:linear-gradient(135deg, var(--surface), #1f0f18);border-color:#ec489959}.mode-card--publishing:hover{border-color:#f472b6;box-shadow:0 0 20px #ec489966}.mode-card--publishing .mode-name{color:#f472b6}.mode-card--booktrade{background:linear-gradient(135deg, var(--surface), #0a1f22);border-color:#22d3ee59}.mode-card--booktrade:hover{border-color:#22d3ee;box-shadow:0 0 20px #22d3ee59}.mode-card--booktrade .mode-name{color:#22d3ee}.mode-card--socialsciences{background:linear-gradient(135deg, var(--surface), #140f2a);border-color:#a78bfa59}.mode-card--socialsciences:hover{border-color:#a78bfa;box-shadow:0 0 20px #a78bfa66}.mode-card--socialsciences .mode-name{color:#a78bfa}.mode-name{color:var(--text);font-size:16px;font-weight:700}.mode-desc{color:var(--muted);font-size:12px;line-height:1.4}.game-header{background:var(--surface);border-bottom:1px solid var(--border);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:10px 20px;display:flex}.header-left,.header-right{align-items:center;gap:10px;display:flex}.header-center{align-items:center;gap:16px;display:flex}.mode-badge{background:var(--surface2);border:1px solid var(--border);color:var(--muted);border-radius:20px;padding:4px 10px;font-size:12px}.score-display{flex-direction:column;align-items:center;line-height:1;display:flex}.score-label{color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-size:10px}.score-value{color:var(--accent);font-size:24px;font-weight:800}.timer{font-variant-numeric:tabular-nums;color:var(--muted);font-size:18px;font-weight:600}.game-layout{flex:1;justify-content:center;align-items:flex-start;gap:16px;padding:16px;display:flex}.bingo-grid{grid-template-columns:repeat(var(--grid-size), 1fr);width:min(calc(var(--grid-size) * 130px), calc(100vw - 300px), 650px);flex-shrink:0;gap:8px;display:grid}.bingo-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;text-align:center;touch-action:manipulation;min-height:80px;font-family:var(--font);-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;padding:10px 8px;transition:background .15s,border-color .15s,transform .1s,box-shadow .15s;display:flex;position:relative}.bingo-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.bingo-card:hover{border-color:var(--accent);background:var(--surface2);z-index:2;transform:scale(1.03)}.bingo-card.marked{background:var(--surface2);border-color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent), 0 0 10px var(--accent-glow)}.bingo-card.marked .term-text{color:var(--muted);text-decoration:line-through}.bingo-card.marked:after{content:"✓";color:var(--accent);font-size:11px;font-weight:700;position:absolute;top:4px;right:6px}.bingo-card.ai-term{border-color:#10b9814d}.bingo-card.ai-term.marked{border-color:var(--ai);box-shadow:inset 0 0 0 2px var(--ai), 0 0 10px var(--ai-glow)}.bingo-card.winning{animation:1s ease-in-out infinite pulse-win}@keyframes pulse-win{0%,to{box-shadow:0 0 8px var(--win-glow);border-color:var(--win)}50%{box-shadow:0 0 20px var(--win-glow);border-color:var(--win)}}.term-text{color:var(--text);font-size:clamp(10px,1.5vw,13px);font-weight:600;line-height:1.3}.ai-badge{color:var(--ai);letter-spacing:.5px;font-size:9px;font-weight:700;position:absolute;top:4px;left:6px}.tooltip{border:1px solid var(--border);color:var(--muted);white-space:normal;z-index:100;pointer-events:none;background:#1e1e2e;border-radius:8px;width:200px;padding:8px 12px;font-size:12px;font-style:italic;line-height:1.4;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);box-shadow:0 4px 20px #00000080}.score-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;flex-shrink:0;gap:12px;width:220px;padding:16px;display:flex}.score-panel h3{color:var(--muted);text-transform:uppercase;letter-spacing:1px;font-size:13px}.score-events{flex-direction:column;gap:6px;min-height:120px;list-style:none;display:flex}.score-event{color:var(--text);background:var(--surface2);border-radius:6px;padding:4px 8px;font-size:12px;transition:opacity .3s}.bdi-box{background:var(--surface2);border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:4px;margin-top:auto;padding:12px;display:flex}.bdi-label{color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-size:10px;line-height:1.3}.bdi-value{color:var(--win);font-size:28px;font-weight:800;line-height:1}.bdi-unit{color:var(--muted);font-size:11px}.win-overlay{z-index:1000;opacity:0;background:#000000bf;justify-content:center;align-items:center;transition:opacity .3s;display:flex;position:fixed;inset:0}.win-overlay.visible{opacity:1}.win-card{background:var(--surface);border:1px solid var(--border);text-align:center;border-radius:16px;flex-direction:column;align-items:center;gap:16px;padding:40px 48px;animation:.4s cubic-bezier(.34,1.56,.64,1) pop-in;display:flex;box-shadow:0 0 60px #6c63ff4d}@keyframes pop-in{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.win-emoji{font-size:60px}.win-title{color:var(--win);letter-spacing:-2px;font-size:56px;font-weight:900}.win-score{color:var(--muted);font-size:20px}.win-score strong{color:var(--text);font-size:28px}.win-btn{margin-top:8px;padding:12px 32px;font-size:16px}.confetti-container{pointer-events:none;z-index:999;position:fixed;inset:0;overflow:hidden}.confetti-piece{border-radius:2px;width:10px;height:10px;animation:linear forwards fall;position:absolute;top:-12px}@keyframes fall{to{opacity:0;transform:translateY(110vh)rotate(720deg)}}@media (width<=760px){.game-header{flex-wrap:wrap;gap:6px;padding:8px 12px}.header-left{flex:1;order:1}.header-right{order:2}.header-center{order:3;justify-content:center;gap:20px;width:100%}.mode-badge{display:none}.score-value{font-size:20px}.timer{font-size:16px}.btn-ghost,.btn-primary{padding:8px 12px;font-size:13px}.game-layout{flex-direction:column;align-items:center;gap:10px;padding:10px 8px}.bingo-grid{gap:5px;width:min(96vw,500px)}.bingo-card{aspect-ratio:1;min-width:0;min-height:0;padding:4px 2px}.term-text{font-size:clamp(7px, calc(14vw / var(--grid-size,5)), 13px);line-height:1.2}.ai-badge{font-size:7px}.bingo-card.marked:after{font-size:9px}.tooltip{width:min(180px,80vw);font-size:11px}.score-panel{flex-flow:wrap;gap:8px;width:100%;max-width:100%;padding:10px 12px}.score-panel h3{width:100%;margin-bottom:0;font-size:11px}.score-events{flex-direction:column;flex:1;gap:4px;min-width:0;min-height:0}.score-event{padding:3px 6px;font-size:11px}.bdi-box{min-width:100px;margin-top:0;padding:8px 10px}.bdi-value{font-size:22px}.win-card{border-radius:14px;margin:16px;padding:28px 24px}.win-emoji{font-size:44px}.win-title{font-size:40px}.win-score{font-size:16px}.win-score strong{font-size:22px}.win-btn{padding:12px 24px;font-size:15px}.mode-grid,.mode-grid--special{grid-template-columns:1fr 1fr;gap:8px}.mode-card{padding:14px 12px}.mode-name{font-size:13px}.mode-desc{font-size:11px}.tagline{margin-bottom:20px;font-size:13px}}@media (width<=380px){.mode-grid,.mode-grid--special{grid-template-columns:1fr}.bingo-card{aspect-ratio:auto;min-height:calc((100vw - 32px - var(--grid-size) * 5px) / var(--grid-size) * .8)}}
