
:root{
  --bg:#06142e;--bg2:#0b2452;--panel:#102653;--panel2:#173b79;
  --green:#7fe35d;--green2:#b9ff8a;--yellow:#ffd65a;--text:#f4f8ff;
  --muted:#bdc9df;--line:#ffffff20;--danger:#ff6f83;--blue:#37b9ff;
  --fire:#ff7a1a;--fire2:#ffc65c;--water:#2fb8ff;--water2:#0d6fe0;
  --brand:linear-gradient(100deg,var(--fire),var(--fire2) 35%,var(--water) 65%,var(--water2))
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;background:
radial-gradient(circle at 8% 0,#164385 0,transparent 33%),
radial-gradient(circle at 92% 100%,#ff7a1a1f 0,transparent 35%),
linear-gradient(145deg,var(--bg),var(--bg2));color:var(--text);min-height:100vh}
a{color:inherit;text-decoration:none}button,input,select{font:inherit}
.container{width:min(1160px,92%);margin:auto}
header{position:sticky;top:0;z-index:20;background:#041226ed;border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
nav{min-height:70px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:10px 0}
.brand{font-weight:950;display:flex;align-items:center;gap:10px}.logo{width:44px;height:44px;display:inline-block;font-size:0;color:transparent;background:url(logo-drop-icon.png) center/contain no-repeat}
.game-quickplay{display:flex;align-items:center;gap:6px;flex-shrink:0}
.game-quickplay a{display:flex;flex-direction:column;align-items:center;gap:3px;text-decoration:none;background:linear-gradient(155deg,var(--panel2),#081b3f);border:1px solid var(--line);border-radius:12px;padding:6px 8px 5px;transition:transform .15s ease,background .15s ease}
.game-quickplay a:hover{transform:translateY(-2px);background:linear-gradient(155deg,#1d4693,#0a2249)}
.game-quickplay .icon-fv{width:26px;height:26px;display:inline-block;background-size:contain;background-position:center;background-repeat:no-repeat}
.game-quickplay .icon-fv.icon-cubo{background-image:url(icon-jogo-cubo-gota.svg)}
.game-quickplay .icon-fv.icon-futebol{background-image:url(icon-jogo-futebol.svg)}
.game-quickplay .icon-fv.icon-volei{background-image:url(icon-jogo-volei.svg)}
.game-quickplay .tile-label{font-size:9px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:var(--text,#ededE6);white-space:nowrap}
.code-entry{display:flex;gap:8px}.code-entry input{width:150px;padding:10px 12px;font-weight:900;letter-spacing:.1em}.code-entry .btn{padding:10px 16px}
.menu{display:flex;align-items:center;gap:15px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:13px;padding:13px 18px;font-weight:900;cursor:pointer}
.primary{background:var(--brand);background-size:180% 180%;color:#ffffff;text-shadow:0 1px 3px #00000055}.ghost{background:transparent;border:1px solid var(--line);color:white}.danger{background:var(--danger);color:white}.whatsapp{background:#25D366;color:#05260f;margin-top:14px}
.hero{padding:58px 0 28px}.panel,.card{background:linear-gradient(155deg,var(--panel2),#081b3f);border:1px solid var(--line);border-radius:22px;padding:22px;box-shadow:0 18px 45px #0005}
h1{font-size:clamp(2.3rem,6vw,4.9rem);line-height:.98;margin:.2em 0}.accent{background:linear-gradient(90deg,var(--water),var(--fire));-webkit-background-clip:text;background-clip:text;color:transparent}.muted{color:var(--muted)}
.map-grid,.stats-grid,.rank-grid{display:grid;gap:16px}.map-grid{grid-template-columns:repeat(3,1fr);margin:28px 0}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));margin-bottom:20px}.rank-grid{grid-template-columns:repeat(3,1fr)}
.invite-box{margin-top:20px}.invite-link-row{display:flex;gap:10px;margin:14px 0;flex-wrap:wrap}.invite-link-row input{flex:1;min-width:200px;background:#061a3d;color:var(--text)}.invite-link-row .btn{flex-shrink:0}
.icon{font-size:2rem}.card h2,.card h3{margin:10px 0}.card p{color:var(--muted);line-height:1.55}.tag{display:inline-block;margin-top:10px;color:var(--yellow);font-weight:900}
.card{transition:.2s transform,.2s border-color}.card:hover{transform:translateY(-4px);border-color:#ff7a1a55}
.form-grid{display:grid;gap:14px}.two{grid-template-columns:1fr 1fr}.form-submit{grid-column:1/-1}label{display:grid;gap:6px;font-weight:700;color:#dce6f5}
input,select{width:100%;padding:13px;border-radius:12px;border:1px solid var(--line);background:#061a3d;color:white}
input:focus,select:focus{outline:none;border-color:var(--fire);box-shadow:0 0 0 3px #ff7a1a22}
.notice,.success,.error{padding:13px;border-radius:13px;margin:13px 0}.notice{background:#ffd65a15;border:1px solid #ffd65a44}.success{background:#1a8d4b55}.error{background:#b7324b55}
.empty-state{text-align:center;padding:50px 20px}.empty-state>div{font-size:3rem}
.quiz{max-width:850px;margin:28px auto}.controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}.quiz-top{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:16px 0;color:#d1dcef}
.audio-control .switch-row{display:flex;align-items:center;gap:9px;height:48px}.audio-control .switch-row input{width:auto}
.question{text-align:center;font-size:clamp(2.7rem,8vw,5.2rem);font-weight:950;margin:28px 0}.answers{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.answer{padding:17px;border-radius:13px;border:1px solid var(--line);background:#ffffff0d;color:white;font-weight:900;cursor:pointer}.answer:nth-child(odd){border-color:#ff7a1a44}.answer:nth-child(even){border-color:#2fb8ff44}.answer:hover{background:#ffffff1a}.correct{background:#188a43!important;border-color:transparent!important}.wrong{background:#a72d44!important;border-color:transparent!important}
.feedback{text-align:center;min-height:28px;margin:14px 0;font-weight:900}
.rank-tabs{display:flex;gap:9px;flex-wrap:wrap;margin:18px 0}.rank-tabs a{padding:10px 13px;border-radius:999px;border:1px solid var(--line);background:#ffffff0a;font-weight:850}.rank-tabs a.active{background:var(--brand);color:#ffffff}
.rank-row{display:flex;align-items:center;gap:12px;padding:14px;border-bottom:1px solid var(--line)}.rank-row>span:first-child{width:32px;flex-shrink:0;text-align:center}.rank-row strong{flex:1;min-width:0}.rank-row:last-child{border:0}.pts{color:var(--yellow);font-weight:950;flex-shrink:0}.current-user{outline:2px solid var(--fire);background:#ff7a1a12}
.podium{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:20px 0}.podium .card{text-align:center}.podium .card:first-child{transform:translateY(-10px)}
.kpi strong{display:block;font-size:1.6rem;background:linear-gradient(90deg,var(--water),var(--fire));-webkit-background-clip:text;background-clip:text;color:transparent}
footer{text-align:center;padding:32px;color:#aab7cf;border-top:1px solid var(--line);margin-top:40px}
table{width:100%;border-collapse:collapse}th,td{padding:11px;border-bottom:1px solid var(--line);text-align:left}.scroll{overflow:auto}
@media(max-width:900px){.map-grid,.stats-grid,.rank-grid{grid-template-columns:1fr 1fr}.menu a:not(.btn){display:none}.two{grid-template-columns:1fr}.controls{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.controls{grid-template-columns:1fr}}
@media(max-width:600px){.map-grid,.stats-grid,.rank-grid,.answers,.podium{grid-template-columns:1fr}.podium .card:first-child{transform:none}.rank-row{gap:8px}.rank-row>span:first-child{width:24px}.avatar{width:28px;height:28px;font-size:.9rem}}


/* Matemática Viva 2.5 RC1 - experiência intuitiva */
.hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:24px;align-items:center}
.hero-logo{width:min(300px,80%);display:block;margin:auto;filter:drop-shadow(0 18px 34px #ff7a1a33) drop-shadow(0 -6px 24px #2fb8ff22)}
.hero-pix-box{width:min(360px,90%);margin:auto;background:#ffffff0b;border:1px solid var(--line);border-radius:20px;padding:24px;text-align:center}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.btn-xl{font-size:1.25rem;padding:18px 28px;box-shadow:0 0 0 0 rgba(255,122,26,.45);animation:pulseCTA 2.4s infinite}
@keyframes pulseCTA{0%{box-shadow:0 0 0 0 rgba(255,122,26,.45)}50%{box-shadow:0 0 0 16px rgba(255,122,26,0)}51%{box-shadow:0 0 0 0 rgba(47,184,255,.45)}100%{box-shadow:0 0 0 18px rgba(47,184,255,0)}}
.language-box{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:18px}.language-box select{width:auto;min-width:190px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin:22px 0}.step-card{padding:18px;border:1px solid var(--line);background:#ffffff0b;border-radius:18px;position:relative}.step-card:not(:last-child)::after{content:'→';position:absolute;top:20px;right:-24px;font-size:1.5rem;font-weight:900;color:var(--fire);z-index:2;line-height:1}.step-number{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#05204a;font-weight:950}
.step-card:nth-child(odd) .step-number{background:linear-gradient(135deg,var(--fire),var(--fire2))}.step-card:nth-child(even) .step-number{background:linear-gradient(135deg,var(--water),var(--water2));color:#fff}
.quick-help{position:fixed;right:18px;bottom:18px;z-index:40;border-radius:999px}
.modal-backdrop{position:fixed;inset:0;background:#000b;display:none;align-items:center;justify-content:center;padding:20px;z-index:100}.modal-backdrop.open{display:flex}.modal-card{max-width:620px;width:100%;background:linear-gradient(155deg,var(--panel2),#081b3f);border:1px solid var(--line);border-radius:22px;padding:24px}.modal-card .close{float:right}
.advanced{margin-top:14px}.advanced summary{cursor:pointer;font-weight:900;color:var(--yellow)}
.result-box{text-align:center;padding:24px;border-radius:20px;background:#ffffff0b;border:1px solid var(--line)}
.legal-content{max-width:850px;margin:40px auto;line-height:1.75}.legal-content h2{margin-top:30px}
@media(max-width:800px){.hero-grid{grid-template-columns:1fr}.hero-logo{max-width:220px}.steps{grid-template-columns:1fr;gap:30px}.step-card:not(:last-child)::after{content:'↓';top:auto;right:auto;left:50%;bottom:-22px;transform:translateX(-50%)}.btn-xl{width:100%}}

/* Corrida da Tabuada */
.race-wrap{max-width:900px;margin:28px auto}
.race-mode-tag{text-align:center;margin-bottom:12px}
.race-stage{position:relative;width:100%;border-radius:22px;overflow:hidden;box-shadow:0 18px 45px #0005;touch-action:none}
.race-stage canvas{display:block;width:100%;height:auto;background:#06142e}
.race-hud{position:absolute;top:12px;left:12px;right:12px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;pointer-events:none}
.race-hud span{background:#041226cc;border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-weight:900;color:var(--text);backdrop-filter:blur(6px)}
.race-start-overlay,.race-result-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:16px;background:#020814ee;overflow:auto}
.race-start-overlay[hidden],.race-result-overlay[hidden]{display:none}
.race-start-overlay h1,.race-result-overlay h1{font-size:clamp(1.3rem,5vw,2.6rem);margin:0}
.race-start-overlay p{max-width:480px;color:var(--muted);font-size:clamp(.85rem,2.6vw,1rem)}
#resultActions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
@media(max-width:600px){.race-hud span{font-size:.82rem;padding:6px 10px}}

/* Sala com código */
.room-live{text-align:center}
.room-status{letter-spacing:.05em}
.room-code{font-size:clamp(3rem,12vw,6rem);font-weight:1000;letter-spacing:.15em;background:var(--brand);-webkit-background-clip:text;background-clip:text;color:transparent;margin:16px 0}
.code-entry-label{display:block;color:var(--muted);font-weight:800;letter-spacing:.02em;margin-bottom:6px}
@media(max-width:640px){.code-entry-wrap{width:100%;order:3;margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}.code-entry{width:100%}.code-entry input{width:0;flex:1}}

/* Avatares e trilha da montanha */
.avatar{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;font-size:1.05rem;flex-shrink:0;box-shadow:0 2px 6px #0004}
.avatar-lg{width:56px;height:56px;font-size:1.7rem}
.trail{display:flex;align-items:flex-end;gap:6px;margin:14px 0;overflow-x:auto;padding:4px 2px 8px}
.trail-dot{width:22px;height:22px;min-width:22px;border-radius:50%;background:#ffffff14;border:2px solid var(--line);display:grid;place-items:center;font-size:12px;transition:.2s;color:var(--text)}
.trail-dot.done{background:linear-gradient(135deg,var(--fire),var(--water));border-color:transparent}
.trail-dot.current{width:32px;height:32px;min-width:32px;border-color:var(--fire2);box-shadow:0 0 0 4px #ff7a1a33;font-size:17px}

/* Álgebra PRO */
.alg-panel{display:none}.alg-panel.active{display:block}
.phase-map{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.phase-card{padding:16px;border-radius:16px;background:#ffffff08;border:1px solid var(--line);position:relative}
.phase-card.locked{opacity:.45}
.phase-card.done{border-color:#35d487;background:#35d48712}
.phase-card.current{border-color:var(--fire2);box-shadow:0 0 0 3px #ff7a1a1a}
.phase-card h3{margin:6px 0}
.phase-badge{position:absolute;right:14px;top:14px;font-size:1.2rem}
.alg-study-grid{display:grid;grid-template-columns:1fr 300px;gap:16px}
@media(max-width:800px){.alg-study-grid{grid-template-columns:1fr}}
.alg-progress{height:10px;background:#00000022;border:1px solid var(--line);border-radius:999px;overflow:hidden;margin:10px 0}
.alg-progress>div{height:100%;background:var(--brand);width:0;transition:.3s}
.alg-lesson{display:none;margin-top:16px;padding:17px;border-radius:16px;background:#00000022;border:1px solid var(--line)}
.alg-lesson.show{display:block}
.alg-lesson h3{color:var(--fire2);margin-top:0}
.alg-numberline-wrap{display:none;margin-top:14px;padding:14px;background:#ffffff06;border:1px solid var(--line);border-radius:14px}
.alg-numberline-wrap.show{display:block}
.alg-audio-bar{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.alg-math-tools{margin-top:10px}
.alg-keyboard-toggle{width:100%}
.alg-math-keyboard{display:none;margin-top:10px;padding:12px;border:1px solid var(--line);border-radius:14px;background:#00000022}
.alg-math-keyboard.open{display:block}
.alg-keyboard-head{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}
.alg-keyboard-head strong{color:var(--fire2)}
.alg-key-groups{display:grid;gap:8px}
.alg-key-group{display:grid;grid-template-columns:repeat(8,minmax(38px,1fr));gap:6px}
.alg-math-key{min-height:40px;border:1px solid var(--line);border-radius:10px;background:#ffffff0d;color:var(--text);font-weight:800;font-size:16px;cursor:pointer}
.alg-math-key:hover,.alg-math-key:focus{border-color:var(--fire2)}
.alg-math-key.action{font-size:12px;background:#ffffff08}
.alg-math-key.gold{background:var(--brand);color:#fff;border-color:transparent}
@media(max-width:620px){.alg-key-group{grid-template-columns:repeat(5,minmax(40px,1fr))}}
.certificate{background:#fff;color:#14213d;border:8px double #d6a62a;padding:28px;border-radius:8px;max-width:700px;margin:20px auto;text-align:center}
.certificate h1{font-family:Georgia,serif;font-size:30px;margin:8px}
.certificate .cert-name{font-size:24px;font-weight:800;border-bottom:2px solid #d6a62a;display:inline-block;padding:6px 20px;margin:12px}
@media print{body{background:#fff}header,footer,.rank-tabs,.no-print{display:none!important}.alg-panel{display:none!important}#finalPanel{display:block!important}.panel{border:0;box-shadow:none}}
.trail-flag{font-size:1.4rem;margin-left:2px;flex-shrink:0;align-self:flex-end}

/* Home: bloco 1 (ação imediata) e bloco 2 (turma joga junto) */
.action-block{display:flex;align-items:center;gap:20px;margin-top:26px;flex-wrap:wrap}
.action-block>.btn{white-space:nowrap}
.drop-play{position:relative;width:132px;height:132px;border-radius:50%;background:var(--brand);background-size:180% 180%;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 30px #0006,0 0 0 6px #ffffff0d;flex-shrink:0;text-align:center;padding:10px;animation:pulseCTA 2.4s infinite}
.drop-play-bg{position:absolute;top:50%;left:50%;width:104px;height:104px;transform:translate(-50%,-50%);object-fit:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}
.drop-play-label{position:relative;z-index:2;color:#fff;font-weight:900;font-size:.92rem;line-height:1.25;text-shadow:0 2px 6px rgba(0,0,0,.45)}
.drop-play:hover{filter:brightness(1.06)}
.room-block{margin:28px 0}
.room-block-inner{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.room-block-icon{font-size:3rem;flex-shrink:0}
.room-block-text{flex:1;min-width:240px}
.room-block-text h2{margin:0 0 6px}
.room-block-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:14px;align-items:center}
@media(max-width:600px){.drop-play{width:112px;height:112px}.drop-play-bg{width:88px;height:88px}.action-block{gap:14px}.room-block-inner{flex-direction:column;text-align:center}.room-block-actions{justify-content:center}}
@media(max-width:480px){.room-block-actions{flex-direction:column;align-items:stretch;width:100%}.room-block-actions .code-entry{width:100%;flex-direction:column}.room-block-actions .code-entry input{width:100%;flex:none}.room-block-actions .btn{width:100%}}

/* Home: bloco de ferramentas PRO */
.pro-section{background:linear-gradient(155deg,#3a2a05,#1a1200);border:1px solid #ffd65a44;border-radius:22px;padding:26px;margin:28px 0}
.pro-section h2{margin:0;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pro-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:16px}
@media(max-width:900px){.pro-grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.pro-grid{grid-template-columns:1fr}}
