:root{
  --bg:#F5F3EE; --surface:#FFFFFF; --surface2:#F0ECE4; --border:#E5E0D5;
  --text:#1C2130; --muted:#667085; --faint:#9AA3B2;
  --side-bg:#121729; --side-text:#C6CCDC; --side-text-dim:#7C86A0; --side-active:#212B47; --side-border:#232C46;
  --accent:#3457A6; --accent-2:#7C93D6; --accent-dim:#3457A614;
  --success:#1E8E5A; --success-dim:#1E8E5A14; --warn:#B8790A; --warn-dim:#B8790A14;
  --danger:#C13A2E; --danger-dim:#C13A2E14; --info:#2F6FE0; --info-dim:#2F6FE014;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif;
  --serif:"Iowan Old Style","Palatino Linotype",Georgia,serif;
  --r:8px; --r2:12px;
  --editor-bg:#10162A; --editor-border:#232C46; --editor-text:#D7DEEB;
}
[data-theme="dark"]{
  --bg:#0B0E17; --surface:#131828; --surface2:#182036; --border:#232B44;
  --text:#E7EAF3; --muted:#8A93AC; --faint:#57607A;
  --side-bg:#0A0D18; --side-text:#C6CCDC; --side-text-dim:#6B7590; --side-active:#1D2740; --side-border:#1B2236;
  --accent:#8BA0E4; --accent-2:#4F63A0; --accent-dim:#8BA0E41F;
  --success:#3DDC97; --success-dim:#3DDC971A; --warn:#F0A868; --warn-dim:#F0A8681A;
  --danger:#F0685C; --danger-dim:#F0685C1A; --info:#6FA8FF; --info-dim:#6FA8FF1A;
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none !important}
html,body{height:100%}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,select,input,textarea{font-family:inherit}
.app{display:grid;grid-template-columns:240px 1fr;height:100vh;overflow:hidden}

/* ---------- SIDEBAR ---------- */
.side{background:var(--side-bg);border-right:1px solid var(--side-border);display:flex;flex-direction:column;overflow-y:auto;color:var(--side-text)}
.brand{padding:17px 16px 13px;display:flex;align-items:center;gap:9px;border-bottom:1px solid var(--side-border)}
.logo{width:30px;height:30px;object-fit:contain;flex:0 0 30px;display:block}
.brand b{font-size:14px;letter-spacing:-.2px;color:#F1F3F9}
.brand span{display:block;font-size:10px;color:var(--side-text-dim);letter-spacing:.06em;text-transform:uppercase;margin-top:1px}
.navgrp{padding:14px 10px 4px}
.navlabel{font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:var(--side-text-dim);padding:0 8px 7px;font-weight:600}
.nav{display:flex;align-items:center;gap:10px;padding:8px 9px;border-radius:var(--r);color:var(--side-text);cursor:pointer;font-size:13px;margin-bottom:1px}
.nav:hover{background:#FFFFFF0C;color:#F1F3F9}
.nav.active{background:var(--side-active);color:#F1F3F9;font-weight:600;box-shadow:inset 2px 0 0 var(--accent-2)}
.nav .ic{width:16px;text-align:center;font-size:13px;opacity:.85}
.nav .badge{margin-left:auto;background:#FFFFFF14;color:var(--side-text-dim);font-size:10.5px;padding:1px 6px;border-radius:20px;font-variant-numeric:tabular-nums}
.nav.active .badge{background:var(--accent-2);color:#0B0E17}
.sidefoot{margin-top:auto;padding:14px;border-top:1px solid var(--side-border)}
.wk{font-size:11px;color:var(--side-text-dim);display:flex;justify-content:space-between;margin-bottom:6px}
.wk b{color:#F1F3F9}
.bar{height:5px;background:#FFFFFF14;border-radius:20px;overflow:hidden}
.bar>i{display:block;height:100%;background:var(--accent-2);border-radius:20px}

/* ---------- MAIN ---------- */
.main{display:flex;flex-direction:column;overflow:hidden}
.top{height:54px;flex:0 0 54px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:14px;padding:0 22px;background:var(--surface)}
.crumb{font-size:12.5px;color:var(--muted)}
.crumb b{color:var(--text);font-weight:600}
.iconbtn{width:31px;height:31px;border-radius:var(--r);border:1px solid var(--border);background:var(--bg);color:var(--muted);cursor:pointer;font-size:13px;margin-left:auto}
.iconbtn:hover{color:var(--text);border-color:var(--faint)}
.view{flex:1;overflow-y:auto;padding:26px 32px 60px}
.view[hidden]{display:none}
.wrap{max-width:1120px;margin:0 auto}

/* ---------- PRIMITIVES ---------- */
h1{font-size:25px;letter-spacing:-.5px;margin-bottom:4px;font-weight:680}
h2{font-size:15.5px;margin:0 0 12px;letter-spacing:-.2px;display:flex;align-items:center;gap:9px}
h2 .tag{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--faint);font-weight:600}
.sub{color:var(--muted);font-size:13px;margin-bottom:18px}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r2);padding:17px}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.g23{grid-template-columns:2fr 1fr}
.stat .lab{font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--faint);margin-bottom:6px;font-weight:600}
.stat .val{font-size:25px;font-weight:660;letter-spacing:-.6px;font-variant-numeric:tabular-nums}
.stat .val small{font-size:12px;color:var(--muted);font-weight:400}
.stat .delta{font-size:11px;margin-top:5px}
.ok{color:var(--success)}.wa{color:var(--warn)}.da{color:var(--danger)}.mu{color:var(--muted)}.inf{color:var(--info)}
.pill{display:inline-flex;align-items:center;gap:5px;font-size:11px;padding:2px 8px;border-radius:20px;background:var(--surface2);color:var(--muted);border:1px solid var(--border)}
.pill.a{background:var(--accent-dim);color:var(--accent);border-color:transparent}
.pill.g{background:var(--success-dim);color:var(--success);border-color:transparent}
.pill.w{background:var(--warn-dim);color:var(--warn);border-color:transparent}
.pill.d{background:var(--danger-dim);color:var(--danger);border-color:transparent}
.pill.i{background:var(--info-dim);color:var(--info);border-color:transparent}
.btn{display:inline-flex;align-items:center;gap:7px;background:var(--accent);color:#fff;border:0;border-radius:var(--r);padding:8px 14px;font-size:12.5px;font-weight:620;cursor:pointer}
.btn:hover{filter:brightness(1.08)}
.btn:disabled{opacity:.5;cursor:default}
.btn.ghost{background:transparent;color:var(--muted);border:1px solid var(--border)}
.btn.ghost:hover{color:var(--text);border-color:var(--faint)}
.btn.sm{padding:5px 10px;font-size:11.5px}
table{width:100%;border-collapse:collapse;font-size:12.5px}
th{text-align:left;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--faint);padding:0 10px 8px;font-weight:600}
td{padding:9px 10px;border-top:1px solid var(--border);vertical-align:middle}
tr:hover td{background:var(--surface2)}
code{font-family:var(--mono);font-size:12px;background:var(--surface2);padding:1px 5px;border-radius:4px;color:var(--accent)}
.chipbar{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:18px;align-items:center}
.fchip{font-size:12px;padding:6px 12px;border-radius:20px;border:1px solid var(--border);background:var(--surface);color:var(--muted);cursor:pointer}
.fchip.on{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.empty{color:var(--faint);font-size:12.5px;padding:14px 4px;text-align:center}
select.fsel,input.finput{font-size:12px;padding:6px 10px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--text)}

/* ---------- CODE / EDITOR ---------- */
.cb{background:var(--editor-bg);border:1px solid var(--editor-border);border-radius:var(--r);margin:16px 0;font-family:var(--mono);font-size:12.5px;overflow:hidden}
.cb .h{display:flex;align-items:center;gap:8px;padding:7px 11px;border-bottom:1px solid var(--editor-border);font-size:10.5px;color:#7C86A0;text-transform:uppercase;letter-spacing:.07em}
.cb pre{padding:13px;overflow-x:auto;line-height:1.65;color:var(--editor-text);white-space:pre-wrap}
.editor{border:1px solid var(--editor-border);border-radius:var(--r);overflow:hidden;background:var(--editor-bg)}
.editor .ebar{display:flex;gap:6px;align-items:center;padding:8px 11px;border-bottom:1px solid var(--editor-border)}
.editor .ebar .dot{width:8px;height:8px;border-radius:50%;background:#3A4360}
.editor .ebar span{font-size:10.5px;color:#7C86A0;font-family:var(--mono);margin-left:4px}
.editor textarea{width:100%;background:transparent;border:0;color:var(--editor-text);font-family:var(--mono);font-size:12.5px;padding:13px;min-height:150px;outline:none;line-height:1.7;resize:vertical}
.answer{width:100%;background:var(--bg);border:1px solid var(--border);border-radius:var(--r);padding:12px;color:var(--text);font-family:var(--sans);font-size:13px;min-height:110px;resize:vertical;outline:none;line-height:1.65}
.answer:focus{border-color:var(--accent)}
.note{border-left:3px solid var(--warn);background:var(--warn-dim);padding:11px 14px;border-radius:0 var(--r) var(--r) 0;margin:18px 0;font-size:13px}

/* ---------- HOME ---------- */
.barchart{display:flex;align-items:flex-end;gap:9px;height:150px;padding-top:16px}
.barchart .bar{flex:1;background:var(--accent-2);opacity:.55;border-radius:6px 6px 3px 3px;position:relative;min-height:4px}
.barchart .bar.now{background:var(--accent);opacity:1}
.barchart .bar .v{position:absolute;top:-18px;left:0;right:0;text-align:center;font-size:10px;color:var(--muted);font-variant-numeric:tabular-nums}
.barlabels{display:flex;gap:9px;margin-top:6px}
.barlabels span{flex:1;text-align:center;font-size:10px;color:var(--faint)}
.donutwrap{display:flex;align-items:center;gap:18px}
.rankrow{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--border)}
.rankrow:first-child{border-top:0}
.rankrow .nm{font-size:12.5px;flex:0 0 150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rankrow .rb{flex:1;height:7px;background:var(--surface2);border-radius:20px;overflow:hidden}
.rankrow .rb>i{display:block;height:100%;border-radius:20px}
.rankrow .lv{font-size:11.5px;color:var(--muted);width:36px;text-align:right;font-variant-numeric:tabular-nums}
.actrow{display:flex;align-items:center;gap:11px;padding:10px 0;border-top:1px solid var(--border)}
.actrow:first-child{border-top:0}
.actic{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;font-size:13px;flex:0 0 28px}
.actrow .t{font-size:12.5px;font-weight:560}
.actrow .m{font-size:11px;color:var(--faint)}
.actrow .r{margin-left:auto;font-size:12px;font-weight:660}

/* ---------- PLANNER ---------- */
.pmeta{display:flex;gap:9px;flex-wrap:wrap;margin:10px 0 18px;align-items:center}
.deplink{font-size:11.5px;padding:5px 10px;border-radius:20px;border:1px dashed var(--border);color:var(--muted);cursor:pointer}
.deplink:hover{border-color:var(--accent);color:var(--accent)}
.doclist .drow{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--border)}
.doclist .drow:first-child{border-top:0}
.dic{width:24px;text-align:center;font-size:13px;flex:0 0 24px}
.drow .t{font-size:12.5px}
.drow .m{margin-left:auto;font-size:10.5px;color:var(--faint)}

.plangrid{display:grid;grid-template-columns:150px 1fr;gap:12px;margin-top:8px}
.backlog{display:flex;flex-direction:column;gap:8px}
.backlog h3{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--faint);margin-bottom:2px}
.chip-drag{border:1px solid var(--border);border-left:3px solid var(--c,var(--accent));background:var(--surface);border-radius:var(--r);padding:8px 9px;font-size:11.5px;cursor:grab}
.chip-drag:active{cursor:grabbing}
.chip-drag b{display:block;font-size:12px;margin-bottom:1px}
.chip-drag small{color:var(--faint);font-size:10px}
.chip-drag.dragging{opacity:.35}

.weeknav{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.weeknav b{font-size:12.5px}

.calwrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--r2);overflow:hidden}
.calhead{display:grid;grid-template-columns:46px repeat(7,1fr);border-bottom:1px solid var(--border)}
.calhead div{padding:9px 6px;font-size:11px;color:var(--muted);text-align:center;font-weight:600;border-left:1px solid var(--border)}
.calhead div:first-child{border-left:0}
.calbody{display:grid;grid-template-columns:46px repeat(7,1fr);position:relative}
.timecol{display:flex;flex-direction:column}
.timecol div{height:34px;font-size:9.5px;color:var(--faint);text-align:right;padding-right:6px;transform:translateY(-5px)}
.pcol{position:relative;border-left:1px solid var(--border);height:544px;
  background-image:repeating-linear-gradient(to bottom,var(--border) 0,var(--border) 1px,transparent 1px,transparent 34px)}
.pcol.dragover{background-color:var(--accent-dim)}
.pblock{position:absolute;left:3px;right:3px;border-radius:6px;padding:4px 6px;font-size:10.5px;overflow:hidden;cursor:grab;border-left:3px solid;box-shadow:0 1px 2px #0002}
.pblock b{display:block;font-size:10.5px;line-height:1.25;font-weight:620}
.pblock small{font-size:9px;opacity:.8}
.pblock.dragging{opacity:.3}
.pblock.is-done{opacity:.5}
.pblock.is-done b{text-decoration:line-through}
.pactions{position:absolute;top:2px;right:3px;display:flex;gap:5px;font-size:10px;opacity:0}
.pblock:hover .pactions{opacity:1}
.pactions span{cursor:pointer}
.pactions span:hover{filter:brightness(0.7)}
.pblock.leitura{background:var(--info-dim);border-color:var(--info);color:var(--info)}
.pblock.aula{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}
.pblock.exercicio{background:var(--warn-dim);border-color:var(--warn);color:var(--warn)}
.pblock.entregavel{background:var(--danger-dim);border-color:var(--danger);color:var(--danger)}
.pblock.revisao{background:var(--success-dim);border-color:var(--success);color:var(--success)}

/* ---------- AULAS ---------- */
.lessonlist .lrow{display:flex;align-items:center;gap:12px;padding:13px 0;border-top:1px solid var(--border)}
.lessonlist .lrow:first-child{border-top:0}
.lstatus{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:12px;flex:0 0 24px;border:1.5px solid var(--border);color:var(--faint)}
.lstatus.gen{background:var(--success-dim);border-color:var(--success);color:var(--success)}
.lrow .t{font-size:13.5px;font-weight:580}
.lrow .m{font-size:11px;color:var(--faint)}
.promptbox{background:var(--editor-bg);border:1px solid var(--editor-border);border-radius:var(--r);padding:13px;margin-top:10px;font-family:var(--mono);font-size:12px;color:var(--editor-text);line-height:1.6}

.tabs{display:flex;gap:4px;background:var(--surface2);border:1px solid var(--border);border-radius:20px;padding:3px;width:fit-content;margin-bottom:16px}
.tabs button{border:0;background:transparent;padding:7px 15px;border-radius:20px;font-size:12.5px;color:var(--muted);cursor:pointer;font-family:inherit;font-weight:560}
.tabs button.on{background:var(--surface);color:var(--accent);box-shadow:0 1px 3px #0001}
.tabpanel[hidden]{display:none}
.resumobox textarea{width:100%;min-height:260px;background:var(--bg);border:1px solid var(--border);border-radius:var(--r);padding:14px;font-family:var(--sans);font-size:13.5px;line-height:1.7;color:var(--text);outline:none;resize:vertical}
.resumobox textarea:focus{border-color:var(--accent)}

.lesson-body{font-size:14px;line-height:1.75;color:var(--text)}
.lesson-body h1{font-size:21px;margin:4px 0 12px;letter-spacing:-.3px}
.lesson-body h2{font-size:16.5px;margin:24px 0 9px;letter-spacing:-.2px;border-top:1px solid var(--border);padding-top:18px}
.lesson-body h2:first-child{border-top:0;padding-top:0}
.lesson-body h3{font-size:14px;margin:16px 0 6px;color:var(--accent)}
.lesson-body h4,.lesson-body h5,.lesson-body h6{font-size:13px;margin:12px 0 6px;color:var(--muted)}
.lesson-body p{margin:10px 0}
.lesson-body ul,.lesson-body ol{margin:8px 0 12px 22px}
.lesson-body li{margin:5px 0}
.lesson-body blockquote{border-left:3px solid var(--accent-2);padding:6px 14px;color:var(--muted);margin:12px 0;background:var(--surface2);border-radius:0 var(--r) var(--r) 0}
.lesson-body hr{border:0;border-top:1px solid var(--border);margin:20px 0}
.lesson-body table{width:100%;border-collapse:collapse;margin:14px 0;font-size:12.5px}
.lesson-body th,.lesson-body td{border:1px solid var(--border);padding:7px 9px;text-align:left;vertical-align:top}
.lesson-body th{background:var(--surface2);font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.lesson-body .cb{margin:14px 0}

/* ---------- EXERCÍCIOS ---------- */
.exlayout{display:grid;grid-template-columns:290px 1fr;gap:20px}
.extopic{margin-bottom:16px}
.extopic .th{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px}
.extopic .th b{font-size:12px}
.extopic .th span{font-size:11px;color:var(--faint)}
.exitem{display:flex;align-items:center;gap:8px;padding:8px 9px;border-radius:var(--r);cursor:pointer;font-size:12px;border:1px solid transparent}
.exitem:hover{background:var(--surface2)}
.exitem.on{background:var(--accent-dim);border-color:var(--accent);color:var(--accent);font-weight:600}
.exitem .st{width:14px;height:14px;border-radius:50%;border:1.5px solid var(--faint);flex:0 0 14px}
.exitem .st.done{background:var(--success);border-color:var(--success)}
.exhead{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.exnum{font-family:var(--mono);font-size:11px;color:var(--faint)}
.fb{border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:0 var(--r) var(--r) 0;background:var(--surface);padding:15px;margin-top:14px;white-space:pre-wrap;font-size:13px;color:var(--muted)}
.selfscore{display:flex;gap:6px;align-items:center;margin-top:10px}
.selfscore button{width:28px;height:28px;border-radius:50%;border:1px solid var(--border);background:var(--surface);cursor:pointer;font-size:12px}
.selfscore button.on{background:var(--accent);color:#fff;border-color:var(--accent)}

/* ---------- FLASHCARD ---------- */
.fcwrap{max-width:620px;margin:10px auto 0}
.fcstats{display:flex;gap:10px;margin-bottom:16px}
.fcstats .card{flex:1;padding:12px 14px;text-align:center}
.fcstats .lab{font-size:10px;color:var(--faint);text-transform:uppercase;letter-spacing:.07em;margin-bottom:4px}
.fcstats .val{font-size:19px;font-weight:680}
.dots{display:flex;gap:5px;justify-content:center;margin-bottom:16px;flex-wrap:wrap}
.dots i{width:20px;height:4px;border-radius:3px;background:var(--border);display:block}
.dots i.done{background:var(--success)}
.dots i.cur{background:var(--accent)}
.fc{background:linear-gradient(155deg,var(--surface),var(--surface2));border:1px solid var(--border);border-radius:16px;padding:46px 34px;min-height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;text-align:center}
.fc:hover{border-color:var(--accent-2)}
.fc .q{font-size:19px;line-height:1.5;max-width:44ch;font-weight:560}
.fc .fcback{max-height:0;opacity:0;overflow:hidden;transition:max-height .28s ease,opacity .28s ease,margin-top .28s ease}
.fcpanel.revealed .fc .fcback{max-height:600px;opacity:1;margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}
.fc .a{font-size:14.5px;color:var(--muted);line-height:1.65;max-width:52ch}
.grades{display:none;gap:8px;justify-content:center;margin-top:18px}
.fcpanel.revealed .grades{display:flex}
.fcpanel.revealed .hint{display:none}
.grade{flex:1;max-width:130px;padding:10px 6px;border-radius:var(--r);border:1px solid var(--border);background:var(--surface);cursor:pointer;font-size:12px;color:var(--muted);border-bottom:3px solid var(--gc,var(--border))}
.grade:hover{filter:brightness(0.98)}
.grade b{display:block;font-size:13px;margin-bottom:2px;color:var(--text)}
.grade small{font-size:10px;color:var(--faint)}

/* ---------- CURRÍCULO ---------- */
.etapa{background:var(--surface);border:1px solid var(--border);border-radius:var(--r2);padding:18px}
.etapa .eh{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.etapa .en{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-weight:700;font-size:13px;color:#fff}
.etapa .et{font-size:14.5px;font-weight:660}
.etapa .es{font-size:11.5px;color:var(--faint)}
.modrow{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--border)}
.modrow:first-child{border-top:0}
.modrow .nm{font-size:12.5px;flex:1;font-weight:560}
.modrow .nm small{display:block;font-weight:400;color:var(--faint);font-size:10.5px;margin-top:1px}

/* ---------- BIBLIOTECA ---------- */
.tema{background:var(--surface);border:1px solid var(--border);border-radius:var(--r2);overflow:hidden;margin-bottom:12px}
.temahead{display:flex;align-items:center;gap:12px;padding:15px 17px;cursor:pointer}
.temahead .ti{font-size:13.5px;font-weight:640;flex:1}
.temahead .ti small{display:block;font-weight:400;color:var(--faint);font-size:11px;margin-top:1px}
.temabooks{border-top:1px solid var(--border);padding:6px 17px 12px}
.temabooks[hidden]{display:none}
.book{display:flex;gap:12px;padding:10px 0;border-top:1px solid var(--border);align-items:center}
.book:first-child{border-top:0}
.cover{width:34px;height:46px;flex:0 0 34px;border-radius:4px;background:linear-gradient(150deg,var(--surface2),var(--border));border:1px solid var(--border)}
.book .t{font-size:12.5px;font-weight:580}
.book .bb{width:80px;height:5px;background:var(--surface2);border-radius:20px;overflow:hidden;margin-left:auto;flex:0 0 80px}
.book .bb>i{display:block;height:100%;background:var(--accent)}
.book .pc{font-size:11px;color:var(--muted);width:32px;text-align:right}
.book input.finput{width:64px;padding:4px 6px;font-size:11px}

.loading{padding:40px;text-align:center;color:var(--faint);font-size:12.5px}

/* ---------- SIDEBAR: usuário / logout ---------- */
.sideuser{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding-top:14px;border-top:1px solid var(--side-border);font-size:12px;color:var(--side-text)}
.linkbtn{background:transparent;border:0;color:var(--side-text-dim);font-size:11.5px;cursor:pointer;padding:0}
.linkbtn:hover{color:#F1F3F9;text-decoration:underline}

/* ---------- BOOT / AUTH GATE ---------- */
.bootloading{height:100vh;display:grid;place-items:center;color:var(--faint);font-size:13px;background:var(--bg)}
.authgate{min-height:100vh;background:var(--bg);display:flex;align-items:center;justify-content:center;padding:32px}
.authcard{width:100%;max-width:460px;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:34px 36px;box-shadow:0 8px 30px #0002}
.authbrand{display:flex;align-items:center;gap:10px;margin-bottom:22px}
.authbrand.full{flex-direction:column;gap:6px;text-align:center;margin-bottom:26px}
.authbrand .logobadge{width:132px;height:132px;object-fit:contain}
/* o selo tem texto azul-marinho: no tema escuro ganha um disco claro atrás,
   para o "DATA" não sumir no fundo */
[data-theme="dark"] .authbrand .logobadge{background:#F4F6FA;border-radius:50%;padding:6px}
.authbrand b{font-size:15px}
.authbrand span{display:block;font-size:10.5px;color:var(--faint);text-transform:uppercase;letter-spacing:.06em}
.authcard h1{font-size:20px;margin-bottom:6px}
.authcard .sub{margin-bottom:20px}
.field{margin-bottom:16px}
.field label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:6px}
.field input[type=text],.field input[type=password],.field input[type=number],.field input[type=date]{
  width:100%;padding:10px 12px;border-radius:var(--r);border:1px solid var(--border);background:var(--bg);
  color:var(--text);font-size:13.5px;outline:none;font-family:inherit}
.field input:focus{border-color:var(--accent)}
.field .hint{font-size:11px;color:var(--faint);margin-top:5px}
.field .err{font-size:11.5px;color:var(--danger);margin-top:5px}
.obdots{display:flex;gap:6px;justify-content:center;margin-bottom:24px}
.obdots i{width:22px;height:4px;border-radius:3px;background:var(--border);display:block}
.obdots i.on{background:var(--accent)}
.obactions{display:flex;justify-content:space-between;align-items:center;margin-top:24px}
.trilhas{display:flex;flex-direction:column;gap:8px}
.trilhacard{display:flex;align-items:flex-start;gap:11px;border:1px solid var(--border);border-radius:var(--r);padding:11px 13px;cursor:pointer}
.trilhacard:hover{border-color:var(--accent-2)}
.trilhacard.on{border-color:var(--accent);background:var(--accent-dim)}
.trilhacard input{margin-top:3px}
.trilhacard .tt{font-size:13px;font-weight:620}
.trilhacard .td{font-size:11.5px;color:var(--muted);margin-top:2px}
.themepick{display:flex;gap:10px}
.themebtn{flex:1;border:1px solid var(--border);border-radius:var(--r);padding:14px;text-align:center;cursor:pointer;font-size:12.5px}
.themebtn.on{border-color:var(--accent);background:var(--accent-dim);color:var(--accent);font-weight:600}
.llmstatusbox{display:flex;gap:10px;align-items:center;border:1px solid var(--border);border-radius:var(--r);padding:12px 14px;font-size:12.5px;margin-top:6px}
.llmdot{width:9px;height:9px;border-radius:50%;flex:0 0 9px}
.llmdot.on{background:var(--success)}
.llmdot.off{background:var(--danger)}

@media(max-width:1100px){.exlayout{grid-template-columns:1fr}}
@media(max-width:760px){.app{grid-template-columns:1fr}.side{display:none}.g4,.g3,.g2,.g23{grid-template-columns:1fr}.view{padding:18px}.plangrid{grid-template-columns:1fr}}

/* -------- aula em partes -------- */
.part-nav{display:flex;flex-wrap:wrap;gap:7px;margin:2px 0 16px;padding-bottom:14px;border-bottom:1px solid var(--border)}
.pchip{font-size:12px;padding:5px 13px;border-radius:20px;border:1px solid var(--border);background:var(--surface);color:var(--muted);cursor:pointer;font-family:inherit;font-weight:560}
.pchip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.pchip:hover:not(.on){border-color:var(--accent-2);color:var(--accent)}
.part-toc{font-size:12px;color:var(--muted);background:var(--surface2);border:1px solid var(--border);border-radius:var(--r);padding:10px 14px;margin-bottom:14px;line-height:1.8}
.part-toc em{font-style:normal;color:var(--accent)}
.part-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:22px;padding-top:16px;border-top:1px solid var(--border)}
.part-pos{font-size:12px;color:var(--faint)}

/* -------- exercícios: abas por dia -------- */
.daytabs{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px}
.daychip{display:flex;align-items:center;gap:7px;font-size:12.5px;padding:7px 14px;border-radius:20px;border:1px solid var(--border);background:var(--surface);color:var(--muted);cursor:pointer;font-family:inherit;font-weight:560}
.daychip span{font-size:11px;color:var(--faint);background:var(--surface2);border-radius:10px;padding:1px 6px}
.daychip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.daychip.on span{background:rgba(255,255,255,.22);color:#fff}
.daychip.today:not(.on){border-color:var(--accent-2);color:var(--accent)}
.daychip:hover:not(.on){border-color:var(--accent-2)}

/* -------- busca global -------- */
.gsearch{flex:1;max-width:420px;margin-left:20px;background:var(--surface2);border:1px solid var(--border);border-radius:20px;padding:7px 15px;font-size:12.5px;font-family:inherit;color:var(--text);outline:none}
.gsearch:focus{border-color:var(--accent);background:var(--surface)}
.searchresults{position:absolute;top:52px;left:50%;transform:translateX(-50%);width:min(620px,90vw);max-height:60vh;overflow-y:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--r);box-shadow:0 12px 40px #0002;z-index:60;padding:8px}
.sresult{padding:10px 12px;border-radius:var(--r);cursor:pointer}
.sresult:hover{background:var(--surface2)}
.sresult .h{display:flex;align-items:center;gap:8px;font-size:12.5px;margin-bottom:4px}
.sresult .ex{font-size:11.5px;color:var(--muted);line-height:1.6}

/* -------- tela Hoje -------- */
.todayblock{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:var(--r);font-size:12.5px;border:1px solid var(--border);margin-bottom:7px}
.todayblock.done{opacity:.55;text-decoration:line-through}
.todayblock .t{font-family:var(--mono);font-size:11.5px;color:var(--faint);min-width:42px}
.todayblock .pill{margin-left:auto}
.suggestion{border:1px solid var(--border);border-radius:var(--r);padding:12px;margin-bottom:9px;background:var(--surface2)}
.suggestion .q{font-size:12.5px;font-weight:600;margin-bottom:6px}
.suggestion .a{font-size:12px;color:var(--muted);line-height:1.65;margin-bottom:10px}
.suggestion .acts{display:flex;gap:8px}
.badge.alert{background:var(--warn);color:#0B0E17}

/* -------- heatmap de constância -------- */
.heatmap{display:grid;grid-template-rows:repeat(7,11px);grid-auto-flow:column;grid-auto-columns:11px;gap:3px;margin:12px 0 8px;overflow-x:auto;padding-bottom:4px}
.hm{width:11px;height:11px;border-radius:2px;background:var(--surface2);display:block}
.hm.l1{background:var(--accent-2);opacity:.45}
.hm.l2{background:var(--accent-2);opacity:.7}
.hm.l3{background:var(--accent)}
.hm.l4{background:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.hmlegend{display:flex;align-items:center;gap:4px;font-size:10.5px;color:var(--faint)}
.hmlegend .hm{width:9px;height:9px}

/* -------- modal (quiz) -------- */
.modal{position:fixed;inset:0;background:#0008;display:grid;place-items:center;z-index:100;padding:20px}
.modalbox{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:24px;width:min(560px,94vw);box-shadow:0 20px 60px #0004}
.modalbox .fcq{font-size:15px;font-weight:600;line-height:1.6}
.modalbox .fca{font-size:13px;color:var(--muted);line-height:1.7;margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}
.todayblock{cursor:pointer;transition:border-color .12s}
.todayblock:hover{border-color:var(--accent-2)}
.todayblock .chk{color:var(--faint);font-size:13px;min-width:14px}
.todayblock.done .chk{color:var(--success)}
.warnbox{border-color:var(--warn)}

/* -------- configurações -------- */
.kv{display:flex;flex-direction:column;gap:8px}
.kv>div{display:flex;justify-content:space-between;align-items:center;font-size:12.5px;padding:7px 0;border-bottom:1px solid var(--border)}
.kv>div:last-child{border-bottom:0}
.kv span{color:var(--muted)}
.field select{width:100%;background:var(--bg);border:1px solid var(--border);border-radius:var(--r);padding:9px 11px;font-size:13px;font-family:inherit;color:var(--text);outline:none}
.field select:focus{border-color:var(--accent)}
.field .hint{display:block}

/* Tags de tecnologia dos módulos mensais — ocupam o espaço à direita do
   cabeçalho e respondem "o que eu vou aprender a usar neste mês". */
.mtags{margin-left:auto;display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-end;max-width:52%}
.mtag{font-size:10.5px;line-height:1;padding:5px 8px;border-radius:999px;
      border:1px solid var(--border);background:var(--bg);color:var(--muted);white-space:nowrap}
.etapa details-marker,.etapa summary::-webkit-details-marker{display:none}
@media (max-width:900px){.mtags{max-width:100%;justify-content:flex-start;margin-left:0;margin-top:8px}
  .etapa .eh{flex-wrap:wrap}}

/* Abas da tela de acesso (Entrar / Criar conta) */
.authtabs{display:flex;gap:4px;background:var(--bg);border:1px solid var(--border);
          border-radius:var(--r);padding:4px;margin:0 0 18px}
.authtab{flex:1;padding:8px 10px;border:0;background:transparent;border-radius:calc(var(--r) - 3px);
         font:inherit;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer}
.authtab.on{background:var(--surface);color:var(--text);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.authtab:hover:not(.on){color:var(--text)}

/* Dúvidas ancoradas no texto da aula */
.dvfloat{position:absolute;z-index:60;box-shadow:0 6px 18px rgba(0,0,0,.22)}
.dvbadge{display:inline-block;min-width:16px;padding:1px 5px;margin-left:4px;border-radius:999px;
         background:var(--accent);color:#fff;font-size:10px;line-height:14px;text-align:center}
.dvtrecho{margin:0 0 8px;padding:6px 10px;border-left:3px solid var(--accent);
          background:var(--bg);color:var(--muted);font-size:12.5px;font-style:italic}

/* Fim da aula: a marcação de "assistida". Fica depois do conteúdo e da
   navegação de partes — é o último elemento da aula, que é onde o aluno
   está quando termina de ler. */
.aula-fim { margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--border); }
.aula-fim-in {
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px; flex-wrap: wrap;
}
.aula-fim-in.feita { color: var(--success); font-weight: 600; font-size: 14px; }
.aula-fim-in.feita .sub { font-weight: 400; }