@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#0b1020;--surface:#111c30;--line:#26334b;--text:#f4f7fc;--muted:#a7b5cb;--mint:#83edc2;--cyan:#54d6f5;--orange:#ffbd77}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 0 0,#143346 0,transparent 48%),var(--bg);color:var(--text);font:16px/1.55 'DM Sans',sans-serif;min-width:320px;min-height:100vh}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button,a,input,textarea{touch-action:manipulation}button,.btn{cursor:pointer;border:1px solid var(--line);background:#1b2941;color:var(--text);border-radius:12px;padding:12px 18px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px}button:hover,.btn:hover{filter:brightness(1.12)}button:disabled{opacity:.4;cursor:default}.primary{background:var(--mint);color:#092d28;border-color:var(--mint)}.quiet{background:transparent}.danger{color:#ffb5b5}.shell{max-width:1240px;margin:auto;padding:0 28px}header{height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;align-items:center;gap:12px;font-family:Manrope,sans-serif;font-weight:800}.brand img{width:52px;height:52px;border-radius:12px;background:white}.back{color:var(--muted);font-size:14px}.eyebrow{font-size:12px;letter-spacing:.15em;text-transform:uppercase;color:var(--mint);font-weight:700}h1,h2,h3{font-family:Manrope,sans-serif;line-height:1.16;letter-spacing:-.04em}h1{font-size:clamp(38px,5vw,62px);margin:15px 0 18px}h1 span{color:var(--mint)}h2{font-size:24px;margin:0 0 12px}p{color:var(--muted)}.intro{padding:64px 0 36px;max-width:780px}.intro p{font-size:18px;max-width:630px}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-bottom:64px}.card,.panel{border:1px solid var(--line);border-radius:24px;background:linear-gradient(130deg,#17263b,#111a2d);padding:28px}.card{min-height:310px;display:flex;flex-direction:column;align-items:flex-start;position:relative;overflow:hidden}.card h2{margin-top:25px}.card .btn{margin-top:auto}.badge{font-size:12px;color:var(--mint);border:1px solid #326657;border-radius:100px;padding:5px 11px}.symbol{font:800 66px Manrope;color:var(--mint);float:right;position:absolute;right:32px;top:30px}.muted{color:var(--muted)}footer{border-top:1px solid var(--line);padding:24px 0;color:var(--muted);font-size:12px}.page-title{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:30px 0 24px}.page-title h1{font-size:32px;margin:5px 0}.page-title p{margin:0;font-size:14px}.workspace{display:grid;grid-template-columns:340px minmax(0,1fr);gap:24px;align-items:start;margin-bottom:32px}.settings{padding:24px}.settings h2{font-size:19px}.step{color:var(--mint);font-size:12px;letter-spacing:.09em;font-weight:700;text-transform:uppercase;margin:22px 0 10px}.settings label{display:block;font-size:13px;font-weight:600;margin:12px 0 6px}textarea,input[type=number]{width:100%;background:#0c1424;border:1px solid #34415a;border-radius:10px;color:var(--text);padding:10px}textarea{resize:vertical;min-height:145px;font-size:14px}input[type=file]{width:100%;font-size:12px;color:var(--muted)}input::file-selector-button{background:#24334d;color:white;border:0;border-radius:7px;padding:8px;cursor:pointer}.pair{display:grid;grid-template-columns:1fr 1fr;gap:12px}.help{font-size:12px;margin:8px 0;color:var(--muted)}.check{display:flex!important;align-items:flex-start;gap:8px;font-weight:400!important}.wide{width:100%;margin-top:12px}.stage{min-height:550px;position:relative;display:flex;flex-direction:column;text-align:center;padding:28px;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,#1e3a47,transparent 70%),#101a2d}.stage-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:12px;color:var(--muted)}.live-dot{color:var(--mint)}.student{font:800 clamp(26px,4vw,46px)/1.15 Manrope;overflow-wrap:anywhere;margin:34px 0 8px}.prompt{font-size:14px;color:var(--muted);margin:0}.equation{font:800 clamp(52px,7vw,100px)/1.2 Manrope;letter-spacing:-.05em;margin:24px 0;color:white}.answer{color:var(--mint)}.clock{font:800 38px Manrope;color:var(--cyan)}.clock small{font:400 13px 'DM Sans';color:var(--muted)}.timebar{height:6px;border-radius:5px;background:#2a3548;max-width:300px;width:100%;margin:12px auto}.timebar>div{height:100%;background:var(--cyan);border-radius:5px;width:100%;transition:width .15s linear}.expired .clock{color:var(--orange)}.expired .timebar>div{background:var(--orange)}.stage-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin-top:auto;padding-top:24px}.stage-note{min-height:24px;font-size:13px;color:var(--muted);margin:14px 0 0}.results{margin-top:20px;padding:22px}.results-top{display:flex;justify-content:space-between;align-items:center;gap:16px}.results h2{font-size:18px;margin:0}.history{list-style:none;padding:0;margin:15px 0 0;max-height:280px;overflow:auto}.history li{padding:12px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;font-size:14px}.history small{color:var(--muted)}.notice{min-height:24px;font-size:13px;color:var(--mint)}.stage:fullscreen{border-radius:0;max-width:none;min-height:100vh;width:100vw;padding:4vh 5vw;justify-content:center}.stage:fullscreen .student{font-size:clamp(38px,6vw,90px)}.stage:fullscreen .equation{font-size:clamp(80px,12vw,180px)}.stage:fullscreen .clock{font-size:64px}.stage:fullscreen .stage-actions{margin-top:20px}.stage:fullscreen .stage-top{position:absolute;top:24px;left:32px;right:32px}:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}[hidden]{display:none!important}@media(max-width:950px){.workspace{grid-template-columns:290px minmax(0,1fr)}.shell{padding:0 18px}.stage{padding:22px 16px}.equation{font-size:60px}}@media(max-width:740px){.workspace,.cards{grid-template-columns:1fr}.page-title{align-items:flex-start}.page-title h1{font-size:27px}.stage{min-height:520px}.settings{order:0}header{height:76px}.brand span{font-size:14px}.back{font-size:12px}.intro{padding-top:40px}.stage-actions button{padding:10px 12px;font-size:14px}.equation{font-size:clamp(48px,12vw,80px)}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Últimos cinco segundos: destaque em toda a janela. */
.stage.urgent{position:fixed;inset:0;z-index:1000;width:100%;height:100dvh;min-height:0;border-radius:0;padding:24px 4vw;justify-content:center;overflow:auto;background:radial-gradient(ellipse at center,#411c30,#0b1020 75%)}
.stage.urgent .student{font-size:clamp(24px,4vw,56px);margin:20px 0 8px}
.stage.urgent .equation{font-size:clamp(38px,var(--urgent-size,14vw),180px);margin:24px 0;line-height:1.25}
.stage.urgent #question{display:inline-block;color:#ff5c6e;animation:urgent-pulse 1s ease-in-out infinite;transform-origin:center}
.stage.urgent .clock{color:#ff5c6e;font-size:clamp(36px,5vw,64px)}
.stage.urgent .timebar>div{background:#ff5c6e}
.stage.urgent .stage-actions{margin-top:12px;padding-top:12px}
.stage.urgent .stage-top{flex-shrink:0}
@keyframes urgent-pulse{0%,100%{transform:scale(.9)}45%{transform:scale(1.08)}}
@media(max-height:600px){.stage.urgent{justify-content:flex-start;padding:12px 3vw}.stage.urgent .student{margin:8px 0;font-size:24px}.stage.urgent .equation{font-size:clamp(36px,17vh,100px);margin:10px 0}.stage.urgent .clock{font-size:30px}.stage.urgent .stage-note{margin:4px 0}.stage.urgent .stage-actions button{padding:8px 12px}}
@media(prefers-reduced-motion:reduce){.stage.urgent #question{animation:none}}

/* Configuração em duas colunas e jogo em modal de tela inteira. */
.setup-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px;padding:0;margin-bottom:24px;align-items:stretch}
.setup-grid h2{font-size:25px}.setup-grid .step{margin-top:0}.setup-grid .roster-panel textarea{min-height:330px}.start-game{min-height:56px;font-size:17px;margin-top:22px}
#gameModal{padding:0;margin:0;border:0;max-width:none;max-height:none;width:100vw;height:100dvh;background:var(--bg);color:var(--text);overflow:auto}
#gameModal::backdrop{background:#0b1020}
#gameModal .stage{border:0;border-radius:0;min-height:100dvh;width:100%;padding:24px 4vw;justify-content:center}
#gameModal .stage-top{flex-wrap:wrap;justify-content:center}#gameModal .stage-top .live-dot{margin-right:auto}
#gameModal .student{font-size:clamp(28px,4vw,60px)}
#gameModal .equation{font-size:clamp(48px,10vw,150px)}
#gameModal .stage-actions{margin-top:12px}
#gameModal .stage.urgent .equation{font-size:clamp(38px,var(--urgent-size,14vw),180px)}
body:has(#gameModal[open]){overflow:hidden}
@media(max-width:740px){.setup-grid{grid-template-columns:1fr}.setup-grid .roster-panel textarea{min-height:220px}#gameModal .stage{padding:16px}#gameModal .stage-top button{font-size:12px;padding:8px}#gameModal .equation{font-size:clamp(34px,10vw,90px)}#gameModal .stage.urgent .equation{font-size:clamp(34px,var(--urgent-size,14vw),120px)}}
@media(max-height:600px){#gameModal .stage{padding:12px 3vw;justify-content:flex-start}#gameModal .student{font-size:24px;margin:8px 0}#gameModal .equation,#gameModal .stage.urgent .equation{font-size:clamp(34px,15vh,90px);margin:10px 0}}
