:root{
  /* Identidade visual: Azul (#106EBE) + Menta (#0FFCBE) + Branco */
  --azul:#106EBE; --azul-d:#0c5491; --azul-bg:#e3f1fc; --azul-claro:#1f8fe0;
  --menta:#0FFCBE; --menta-d:#06c39a; --menta-dd:#048f6f; --menta-bg:#dafff7;
  --navy:#0a3a63; --navy-d:#072a49;
  /* compatibilidade semântica do motor */
  --verde:#06c39a; --verde-d:#048f6f; --verde-bg:#dafff7;   /* sucesso = menta-teal */
  --roxo:#0a3a63; --roxo-d:#072a49;                          /* navy */
  --laranja:#1f8fe0; --laranja-d:#1572b8;                    /* azul-claro */
  --vermelho:#ff4b6a; --vermelho-d:#e22a4e; --vermelho-bg:#ffe2e8;
  --ouro:#0FFCBE;
  --tinta:#13314d; --tinta-2:#6b7c8c; --linha:#e2e8ef; --linha-2:#c9d4de;
  --fundo:#fff; --painel:#f3f7fb; --card:#fff;
  --texto:#33485e; --toast-bg:#13314d;
  --tp-bg:#eaf1f8; --tp-fg:#0a3a63; --ok-text:#064d3a; --menta-bd:#93f3da;
  --azul-on:#0c5491; --menta-on:#048f6f; --verde-on:#064d3a; --vermelho-on:#e22a4e;
  --sombra:0 2px 0; --raio:16px;
  --fonte:'Nunito',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}
/* ===== MODO NOTURNO ===== */
html[data-theme="dark"]{
  --fundo:#0d1826; --painel:#1a2940; --card:#16253b;
  --tinta:#eef3fa; --tinta-2:#9fb1c4; --texto:#d4dfec;
  --linha:#2a3b52; --linha-2:#3b4f6b; --toast-bg:#22344c;
  /* fundos de destaque escuros + texto claro no modo noturno */
  --azul-bg:#15324f; --menta-bg:#0e3a30; --verde-bg:#0e3a30; --tp-bg:#1c2f48; --vermelho-bg:#3f1f2a;
  --azul-on:#8ac7f7; --menta-on:#3ee9bc; --verde-on:#3ee9bc; --vermelho-on:#ff93a6; --tp-fg:#aecae9;
  --menta-bd:#1f6a55; --ok-text:#3ee9bc;
}
/* acentos legíveis sobre superfícies escuras */
html[data-theme="dark"] .page-title,
html[data-theme="dark"] .subj-card h3,
html[data-theme="dark"] .mode-card h3,
html[data-theme="dark"] .acc-head h3,
html[data-theme="dark"] .review h3,
html[data-theme="dark"] .result h2,
html[data-theme="dark"] .q-enun,
html[data-theme="dark"] .fc-front .q,
html[data-theme="dark"] .mm-branch li b{color:#ffffff}
html[data-theme="dark"] .brand{color:#5ab0f2}
html[data-theme="dark"] .brand-accent{color:#2fe9bd}
html[data-theme="dark"] .crumbs a{color:#5ab0f2}
html[data-theme="dark"] .stat.fire{color:#5ab0f2}
html[data-theme="dark"] .stat.xp,html[data-theme="dark"] .stat.gem{color:#2fe9bd}
html[data-theme="dark"] .ring .pct{color:#5ab0f2}
html[data-theme="dark"] .fc-front .lbl{color:#5ab0f2}
html[data-theme="dark"] .btn.ghost{color:#5ab0f2}
/* botão de alternância de tema */
.icon-btn{width:40px;height:40px;border-radius:12px;border:2px solid var(--linha);background:var(--card);font-size:18px;line-height:1;display:grid;place-items:center;color:var(--tinta);transition:background .15s,transform .06s}
.icon-btn:hover{background:var(--painel)} .icon-btn:active{transform:scale(.92)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:var(--fonte);background:var(--fundo);color:var(--tinta);-webkit-font-smoothing:antialiased;line-height:1.5}
button{font-family:inherit;cursor:pointer;border:none;background:none}
img{max-width:100%}
.hidden{display:none!important}

/* TOP BAR */
.topbar{position:sticky;top:0;z-index:50;background:var(--card);border-bottom:2px solid var(--linha);display:flex;align-items:center;gap:14px;padding:10px 18px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:18px;color:var(--azul-d)}
.brand-accent{color:var(--menta-dd)}
.brand .logo{width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--azul),var(--menta-d));display:grid;place-items:center;color:#fff;font-size:18px;box-shadow:0 3px 0 var(--menta-d)}
.spacer{flex:1}
.stat{display:flex;align-items:center;gap:6px;font-weight:800;font-size:15px;padding:6px 12px;border-radius:30px;border:2px solid var(--linha)}
.stat.fire{color:var(--azul-d)} .stat.xp{color:var(--menta-dd)} .stat.gem{color:var(--menta-dd)}
.crumbs{max-width:1080px;margin:18px auto 0;padding:0 18px;font-weight:700;color:var(--tinta-2);font-size:14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.crumbs a{color:var(--azul-d);text-decoration:none;cursor:pointer}
.crumbs a:hover{text-decoration:underline}

.wrap{max-width:1080px;margin:0 auto;padding:24px 18px 80px}
.page-title{font-size:26px;font-weight:800;margin:6px 0 4px}
.page-sub{color:var(--tinta-2);font-weight:600;margin-bottom:22px}

/* SUBJECT CARDS */
.grid{display:grid;gap:18px}
.grid.subjects{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.subj-card{position:relative;border:2px solid var(--linha);border-radius:var(--raio);padding:22px;text-align:left;background:var(--card);transition:transform .12s,box-shadow .12s;display:flex;flex-direction:column;gap:12px}
.subj-card:hover{transform:translateY(-3px)}
.subj-card .ico{width:60px;height:60px;border-radius:16px;display:grid;place-items:center;font-size:30px;color:#fff}
.subj-card h3{font-size:19px;font-weight:800}
.subj-card p{color:var(--tinta-2);font-weight:600;font-size:13px}
.subj-card .prof{font-size:12px;color:var(--tinta-2);font-weight:700}
.pbar{height:12px;background:var(--linha);border-radius:10px;overflow:hidden}
.pbar > i{display:block;height:100%;background:linear-gradient(90deg,var(--azul),var(--menta));border-radius:10px;transition:width .5s}
.subj-card.soon{opacity:.6}
.badge-soon{position:absolute;top:14px;right:14px;background:var(--painel);border:2px solid var(--linha);color:var(--tinta-2);font-size:11px;font-weight:800;padding:3px 9px;border-radius:20px}

/* MODE CARDS */
.grid.modes{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.mode-card{border:2px solid var(--linha);border-bottom-width:4px;border-radius:var(--raio);padding:24px 20px;text-align:left;background:var(--card);display:flex;gap:16px;align-items:flex-start;transition:transform .12s}
.mode-card:hover{transform:translateY(-3px)}
.mode-card .ico{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;font-size:26px;color:#fff;flex-shrink:0}
.mode-card h3{font-size:18px;font-weight:800;margin-bottom:3px}
.mode-card p{color:var(--tinta-2);font-weight:600;font-size:13px}
.mode-card .tag{display:inline-block;margin-top:8px;font-size:12px;font-weight:800;color:var(--tinta-2);background:var(--painel);padding:3px 9px;border-radius:20px}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:800;font-size:15px;border-radius:14px;padding:13px 22px;color:#fff;background:var(--azul);box-shadow:0 4px 0 var(--azul-d);transition:transform .06s,box-shadow .06s;text-transform:uppercase;letter-spacing:.4px}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--azul-d)}
.btn.azul{background:var(--menta-d);box-shadow:0 4px 0 var(--menta-dd)} .btn.azul:active{box-shadow:0 1px 0 var(--menta-dd)}
.btn.cinza{background:#e5e5e5;color:#afafaf;box-shadow:0 4px 0 #cfcfcf;cursor:not-allowed}
.btn.ghost{background:var(--card);color:var(--azul-d);border:2px solid var(--linha);box-shadow:0 2px 0 var(--linha)}
.btn.lg{font-size:16px;padding:15px 28px}
.btn.block{display:flex;width:100%}
.back{display:inline-flex;align-items:center;gap:6px;font-weight:800;color:var(--tinta-2);background:none;font-size:14px;margin-bottom:14px}
.back:hover{color:var(--tinta)}

/* RESUMO */
.accordion{border:2px solid var(--linha);border-radius:var(--raio);overflow:hidden;margin-bottom:14px;background:var(--card)}
.acc-head{width:100%;display:flex;align-items:center;gap:14px;padding:18px;text-align:left;background:var(--card)}
.acc-head:hover{background:var(--painel)}
.acc-head .num{width:34px;height:34px;border-radius:10px;background:var(--azul-bg);color:var(--azul-on);font-weight:800;display:grid;place-items:center;flex-shrink:0}
.acc-head h3{font-size:16px;font-weight:800;flex:1}
.acc-head .uni{font-size:11px;font-weight:800;color:var(--menta-on);background:var(--menta-bg);padding:3px 9px;border-radius:20px;white-space:nowrap}
.acc-head .chev{color:var(--tinta-2);font-size:20px;transition:transform .2s}
.acc-body{padding:0 22px 22px 22px;display:none}
.acc-body.open{display:block}
.accordion.open .chev{transform:rotate(180deg)}
.res-block{margin-top:16px}
.res-block h4{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--azul-on);display:flex;align-items:center;gap:7px;margin-bottom:6px}
.res-block.f h4{color:var(--azul-on)} .res-block.j h4{color:var(--menta-on)} .res-block.p h4{color:var(--tp-fg)}
.res-block p,.res-block li{font-size:15px;color:var(--texto);font-weight:500}
.res-block ul{margin:4px 0 0 20px} .res-block li{margin-bottom:5px}
.res-block.f{background:var(--azul-bg);border-radius:12px;padding:12px 16px}
.res-block.j{background:var(--menta-bg);border-radius:12px;padding:12px 16px}
.res-block.p{background:var(--tp-bg);border-radius:12px;padding:12px 16px}
.frase{margin-top:16px;border-left:5px solid var(--menta);background:var(--menta-bg);padding:12px 16px;border-radius:0 12px 12px 0;font-weight:800;color:var(--menta-on)}
.keyword{background:var(--card);border:1px solid var(--linha);border-radius:6px;padding:0 5px;font-weight:800;font-family:monospace;font-size:13px;color:var(--tp-fg)}

/* MAPA MENTAL */
.map-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.map-tab{padding:9px 15px;border-radius:30px;border:2px solid var(--linha);font-weight:800;font-size:13px;color:var(--tinta-2);background:var(--card)}
.map-tab.active{background:var(--azul);border-color:var(--azul);color:#fff;box-shadow:0 3px 0 var(--azul-d)}
.mindmap{display:flex;flex-direction:column;align-items:center;gap:0;padding:8px 0 20px}
.mm-central{background:linear-gradient(135deg,var(--azul),var(--menta-d));color:#fff;font-weight:800;font-size:18px;padding:16px 26px;border-radius:16px;text-align:center;box-shadow:0 6px 22px rgba(16,110,190,.25),0 4px 0 var(--menta);max-width:480px}
.mm-branches{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;width:100%;margin-top:26px;position:relative}
.mm-branch{border:2px solid var(--linha);border-top:5px solid var(--rama,var(--azul));border-radius:14px;padding:14px 16px;background:var(--card)}
.mm-branch h4{font-size:15px;font-weight:800;margin-bottom:8px;color:var(--rama,var(--azul-d))}
.mm-branch ul{list-style:none;display:flex;flex-direction:column;gap:6px}
.mm-branch li{font-size:13.5px;font-weight:600;color:var(--texto);padding-left:16px;position:relative}
.mm-branch li::before{content:"";position:absolute;left:0;top:8px;width:7px;height:7px;border-radius:50%;background:var(--rama,var(--azul))}
.mm-branch li b{color:var(--tinta);font-weight:800}

/* FLASHCARDS */
.fc-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:16px}
.chip{padding:8px 14px;border-radius:30px;border:2px solid var(--linha);font-weight:800;font-size:13px;color:var(--tinta-2);background:var(--card)}
.chip.active{background:var(--azul);border-color:var(--azul);color:#fff;box-shadow:0 3px 0 var(--azul-d)}
.fc-stage{display:flex;flex-direction:column;align-items:center;gap:18px}
.fc-progress{font-weight:800;color:var(--tinta-2);font-size:14px}
.flashcard{width:100%;max-width:560px;height:330px;perspective:1600px;cursor:pointer}
.fc-inner{position:relative;width:100%;height:100%;transition:transform .55s;transform-style:preserve-3d}
.flashcard.flip .fc-inner{transform:rotateY(180deg)}
.fc-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:20px;border:2px solid var(--linha);border-bottom-width:5px;padding:28px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:var(--card)}
.fc-front .lbl{color:var(--azul-d)}
.fc-face .lbl{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:1px;position:absolute;top:16px;left:0;right:0}
.fc-front .q{font-size:21px;font-weight:800;color:var(--tinta)}
.fc-back{transform:rotateY(180deg);background:var(--verde-bg);border-color:var(--verde)}
.fc-back .lbl{color:var(--verde-on)}
.fc-back .r{font-size:18px;font-weight:700;color:var(--verde-on)}
.fc-base{margin-top:14px;font-size:13px;font-weight:800;color:var(--menta-on);background:var(--menta-bg);border-radius:10px;padding:7px 12px;border:1px solid var(--menta-bd)}
.fc-hint{position:absolute;bottom:14px;left:0;right:0;font-size:12px;font-weight:700;color:var(--tinta-2)}
.fc-actions{display:flex;gap:12px}
.fc-nav{display:flex;gap:12px;align-items:center}

/* QUIZ */
.q-setup .seg{margin-bottom:22px}
.q-setup label{display:block;font-weight:800;margin-bottom:10px;font-size:15px}
.diff-opts,.topic-opts{display:flex;flex-wrap:wrap;gap:10px}
.opt-pill{padding:10px 16px;border-radius:12px;border:2px solid var(--linha);border-bottom-width:4px;font-weight:800;font-size:14px;background:var(--card);color:var(--tinta)}
.opt-pill.on{border-color:var(--verde);background:var(--verde-bg);color:var(--verde-on)}
.opt-pill.f.on{border-color:var(--azul);background:var(--azul-bg);color:var(--azul-on)}
.qbar{height:16px;background:var(--linha);border-radius:10px;overflow:hidden;margin-bottom:6px}
.qbar > i{display:block;height:100%;background:var(--verde);border-radius:10px;transition:width .35s}
.q-meta{display:flex;justify-content:space-between;font-weight:800;font-size:13px;color:var(--tinta-2);margin-bottom:18px}
.q-card{border:2px solid var(--linha);border-radius:var(--raio);padding:22px}
.q-tagrow{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.q-tag{font-size:11px;font-weight:800;padding:3px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:.4px}
.q-tag.facil{background:var(--azul-bg);color:var(--azul-on)}
.q-tag.medio{background:var(--menta-bg);color:var(--menta-on)}
.q-tag.dificil{background:var(--vermelho-bg);color:var(--vermelho-on)}
.q-tag.tp{background:var(--tp-bg);color:var(--tp-fg)}
.q-enun{font-size:18px;font-weight:800;margin-bottom:18px;line-height:1.4}
.answers{display:flex;flex-direction:column;gap:12px}
.answer{display:flex;align-items:center;gap:14px;width:100%;text-align:left;padding:15px 17px;border:2px solid var(--linha);border-bottom-width:4px;border-radius:14px;font-weight:700;font-size:15.5px;background:var(--card);transition:.1s}
.answer:hover:not(:disabled){border-color:var(--azul);background:var(--azul-bg)}
.answer .key{width:30px;height:30px;border-radius:8px;border:2px solid var(--linha-2);display:grid;place-items:center;font-weight:800;flex-shrink:0;color:var(--tinta-2)}
.answer.correct{border-color:var(--verde);background:var(--verde-bg);color:var(--verde-on)} .answer.correct .key{border-color:var(--verde-d);background:var(--verde);color:#fff}
.answer.wrong{border-color:var(--vermelho);background:var(--vermelho-bg);color:var(--vermelho-on)} .answer.wrong .key{border-color:var(--vermelho-d);background:var(--vermelho);color:#fff}
.answer:disabled{cursor:default}
.feedback{margin-top:18px;border-radius:14px;padding:16px 18px;font-weight:600;font-size:14.5px;display:none}
.feedback.show{display:block;animation:slideup .25s}
.feedback.ok{background:var(--verde-bg);color:var(--verde-on)}
.feedback.no{background:var(--vermelho-bg);color:var(--vermelho-on)}
.feedback h4{font-size:15px;font-weight:800;margin-bottom:5px;text-transform:uppercase;letter-spacing:.5px}
.feedback .why{margin-top:8px;font-size:13.5px;opacity:.9}
@keyframes slideup{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}

/* RESULT */
.result{text-align:center;padding:10px 0}
.result .emoji{font-size:64px;line-height:1}
.ring{width:170px;height:170px;margin:14px auto;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--azul) var(--deg,0deg),var(--linha) 0deg)}
.ring .inner{width:132px;height:132px;border-radius:50%;background:var(--card);display:grid;place-items:center;flex-direction:column}
.ring .pct{font-size:38px;font-weight:800;color:var(--azul-d)}
.ring .lbl{font-size:12px;font-weight:800;color:var(--tinta-2)}
.result h2{font-size:24px;font-weight:800;margin:6px 0}
.result .msg{font-weight:700;color:var(--tinta-2);max-width:440px;margin:0 auto 8px}
.res-stats{display:flex;justify-content:center;gap:24px;margin:18px 0}
.res-stats .s b{display:block;font-size:26px;font-weight:800}
.res-stats .s span{font-size:12px;font-weight:700;color:var(--tinta-2)}
.res-stats .s-ok{color:var(--verde-on)} .res-stats .s-no{color:var(--vermelho-on)} .res-stats .s-xp{color:var(--azul-on)}
.review{margin-top:24px;text-align:left}
.review h3{font-size:17px;font-weight:800;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.rev-card{border:2px solid var(--vermelho);border-radius:14px;padding:16px;margin-bottom:12px;background:var(--card)}
.rev-card .renun{font-weight:800;margin-bottom:10px}
.rev-line{font-size:14px;font-weight:700;padding:5px 0}
.rev-line.c{color:var(--verde-on)} .rev-line.x{color:var(--vermelho-on);text-decoration:line-through;opacity:.8}

.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(120px);background:var(--toast-bg);color:#fff;font-weight:800;padding:13px 22px;border-radius:30px;z-index:99;transition:transform .3s;box-shadow:0 6px 16px rgba(0,0,0,.2)}
.toast.show{transform:translateX(-50%) translateY(0)}
.empty{text-align:center;color:var(--tinta-2);font-weight:700;padding:50px 0}
.foot{text-align:center;color:var(--tinta-2);font-size:12px;font-weight:600;padding:30px 0 0}
@media(max-width:600px){.page-title{font-size:22px}.flashcard{height:300px}.q-enun{font-size:16px}}
