:root{
  --hartie:#FAFBFE; --grila:rgba(40,70,160,.075); --cerneala:#1D2B5C; --cerneala-2:#2E4590;
  --text:#1E2333; --text-2:#4A5373; --linie:#D8DDEB; --alb:#FFFFFF;
  --pix:#B93A1E; --pix-fond:#FBEDE8; --marker:#FFE45C; --marker-fond:#FFF7C2;
  --bine:#1F7A4A; --bine-fond:#E6F4EC;
  --r-mic:8px; --r:14px;
  --ui:'Atkinson Hyperlegible',system-ui,sans-serif; --carte:'Literata',Georgia,serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--hartie);color:var(--text);font:17px/1.5 var(--ui);
  background-image:linear-gradient(var(--grila) 1px,transparent 1px),linear-gradient(90deg,var(--grila) 1px,transparent 1px);
  background-size:24px 24px;min-height:100vh;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
main{max-width:620px;margin:0 auto;padding:calc(16px + env(safe-area-inset-top)) 16px 24px}
h1,h2,h3{font-family:var(--carte);color:var(--cerneala);line-height:1.2;margin:0}
h1{font-size:30px;font-weight:700;letter-spacing:-.01em}
h2{font-size:22px;font-weight:600}
h3{font-size:18px;font-weight:600}
p{margin:0}
a{color:var(--cerneala-2)}
button,input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--cerneala-2);outline-offset:2px}
.stiva{display:flex;flex-direction:column;gap:14px}
.rand{display:flex;gap:10px;align-items:center}
.mic{font-size:14px;color:var(--text-2)}
.antet{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.inapoi{width:44px;height:44px;border-radius:22px;border:1px solid var(--linie);background:var(--alb);
  display:grid;place-items:center;flex:none;cursor:pointer}
.foaie{background:var(--alb);border:1px solid var(--linie);border-radius:var(--r);padding:16px}
.buton{min-height:48px;border-radius:12px;border:0;background:var(--cerneala);color:#fff;font-weight:700;
  padding:0 18px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none}
.buton.secundar{background:var(--alb);color:var(--cerneala);border:1.5px solid var(--cerneala)}
.buton.lat{width:100%}
.buton[disabled]{opacity:.55;cursor:default}
label{font-weight:700;font-size:15px;color:var(--text-2)}
input[type=text],input[type=password],textarea,select{width:100%;border:1.5px solid var(--linie);border-radius:10px;
  background:var(--alb);padding:12px;min-height:48px}
textarea{min-height:140px;resize:vertical;line-height:1.5}
.ai-nota{font-size:14px;color:var(--text-2);display:flex;gap:8px;align-items:flex-start}
.ai-nota svg{flex:none;margin-top:2px}

/* Acasă */
.salut{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.unelte{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.unealta{background:var(--alb);border:1px solid var(--linie);border-radius:var(--r);padding:16px;min-height:132px;
  display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--text);cursor:pointer;text-align:left}
.unealta strong{font-size:17px;color:var(--cerneala)}
.unealta span{font-size:14px;color:var(--text-2)}
.bac-card{background:var(--cerneala);color:#fff;border-radius:var(--r);padding:18px;display:flex;justify-content:space-between;
  align-items:center;text-decoration:none;border:0;width:100%;cursor:pointer;text-align:left}
.bac-card strong{font-size:18px;font-family:var(--carte)}
.bac-card span{color:#C9D2EE;font-size:14px}
.banda{border-radius:var(--r);padding:14px 16px;font-size:15px}
.banda.pauza{background:var(--marker-fond);border:1px solid #EBD86A}
.banda.eroare{background:var(--pix-fond);color:#7A2410;border:1px solid #EBC3B6}

/* marker "tu faci": elementul memorabil */
.tu{background:linear-gradient(transparent 55%,var(--marker) 55%,var(--marker) 92%,transparent 92%);padding:0 2px}
.tu-bloc{background:var(--marker-fond);border:1px dashed #D9C24A;border-radius:var(--r);padding:16px}

/* Materii și lecții */
.lista{display:flex;flex-direction:column;background:var(--alb);border:1px solid var(--linie);border-radius:var(--r);overflow:hidden}
.lista button,.lista a{all:unset;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:14px 16px;border-top:1px solid var(--linie);min-height:24px}
.lista>:first-child{border-top:0}
.lista button:focus-visible{outline:3px solid var(--cerneala-2);outline-offset:-3px}
.cap-titlu{font-family:var(--carte);font-weight:600;color:var(--cerneala);font-size:16px;margin:14px 2px 6px}
.bifa{width:22px;height:22px;border-radius:11px;flex:none;border:2px solid var(--linie)}
.bifa.facuta{background:var(--bine);border-color:var(--bine)}
.file{display:flex;gap:6px;background:var(--alb);border:1px solid var(--linie);border-radius:12px;padding:4px}
.file button{flex:1;min-height:42px;border:0;border-radius:9px;background:transparent;font-weight:700;color:var(--text-2);cursor:pointer}
.file button[aria-selected=true]{background:var(--cerneala);color:#fff}
.lectura{font-family:var(--carte);font-size:18px;line-height:1.7}
.lectura h3{margin:18px 0 6px}
.lectura p{margin:0 0 12px}
.lectura ul{margin:0 0 12px;padding-left:22px}
.termen{border-top:1px solid var(--linie);padding:10px 0}
.termen:first-child{border-top:0}
.cartonas{min-height:220px;border-radius:18px;background:var(--cerneala);color:#fff;padding:22px;display:flex;flex-direction:column;
  justify-content:space-between;border:0;width:100%;text-align:left;cursor:pointer}
.cartonas.intors{background:var(--alb);color:var(--text);border:2px solid var(--cerneala)}
.cartonas .t{font-family:var(--carte);font-size:22px;line-height:1.3}
.cartonas small{opacity:.75}
.varianta{all:unset;cursor:pointer;display:block;border:1.5px solid var(--linie);border-radius:12px;padding:12px 14px;background:var(--alb)}
.varianta:focus-visible{outline:3px solid var(--cerneala-2)}
.varianta.corecta{border-color:var(--bine);background:var(--bine-fond)}
.varianta.gresita{border-color:var(--pix);background:var(--pix-fond)}
.progres-bara{height:6px;background:var(--linie);border-radius:3px;overflow:hidden}
.progres-bara i{display:block;height:100%;background:var(--cerneala)}

/* Pași */
.pas{display:flex;gap:12px}
.pas .nr{flex:none;width:30px;height:30px;border-radius:15px;background:var(--cerneala);color:#fff;display:grid;place-items:center;font-weight:700}
.pas .calc{font-family:ui-monospace,Menlo,monospace;font-size:15px;background:var(--hartie);border-radius:8px;padding:8px 10px;margin-top:6px;white-space:pre-wrap;overflow-wrap:anywhere}
.ascuns{filter:blur(6px);user-select:none}
.poza-mini{width:100%;max-height:220px;object-fit:contain;border-radius:12px;background:#E9ECF5}

/* Ciornă */
.ciorna-text{font-family:var(--carte);font-size:17px;line-height:1.8;white-space:pre-wrap}
mark.gr{background:none;border-bottom:2.5px solid var(--pix);color:inherit;cursor:pointer;padding:0 1px}
mark.gr.activ{background:var(--pix-fond)}
.greseala{border-left:0;border-top:1px solid var(--linie);padding:12px 0}
.greseala:first-child{border-top:0}
.eticheta{font-size:13px;font-weight:700;color:var(--pix)}

/* Chat operă */
.bula{max-width:86%;border-radius:16px;padding:12px 14px;line-height:1.45}
.bula.elev{align-self:flex-end;background:var(--cerneala);color:#fff;border-bottom-right-radius:4px}
.bula.ai{align-self:flex-start;background:var(--alb);border:1px solid var(--linie);border-bottom-left-radius:4px}
.mic-btn{width:76px;height:76px;border-radius:38px;border:0;background:var(--pix);display:grid;place-items:center;cursor:pointer;margin:0 auto}
.mic-btn.asculta{animation:puls 1.2s ease-in-out infinite}
@keyframes puls{50%{box-shadow:0 0 0 12px rgba(185,58,30,.18)}}
@media (prefers-reduced-motion:reduce){.mic-btn.asculta{animation:none;outline:4px solid rgba(185,58,30,.4)}}

/* BAC */
.scor{font-family:var(--carte);font-size:52px;font-weight:700;line-height:1;color:#fff}
.scor small{font-size:22px;color:#C9D2EE}
.item-rand{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid var(--linie)}
.item-rand:first-child{border-top:0}
.ok{color:var(--bine);font-weight:700}.ko{color:var(--pix);font-weight:700}

/* Tab bar */
#tabbar{position:fixed;left:0;right:0;bottom:0;background:var(--alb);border-top:1px solid var(--linie);
  display:flex;justify-content:space-around;padding:6px 6px calc(6px + env(safe-area-inset-bottom));z-index:5}
#tabbar button{all:unset;cursor:pointer;flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:12px;
  color:var(--text-2);min-height:52px;justify-content:center;border-radius:10px}
#tabbar button[aria-current=page]{color:var(--cerneala);font-weight:700}
#tabbar button:focus-visible{outline:3px solid var(--cerneala-2)}

.spinner{width:28px;height:28px;border:3px solid var(--linie);border-top-color:var(--cerneala);border-radius:50%;animation:rot .9s linear infinite;margin:0 auto}
@keyframes rot{to{transform:rotate(360deg)}}
.centrat{text-align:center}
.comutator{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:52px;border-top:1px solid var(--linie)}
.comutator:first-child{border-top:0}
.comutator input{width:26px;height:26px;flex:none}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.tabel{overflow-x:auto;margin:0 0 12px}
.tabel table{border-collapse:collapse;font-family:var(--ui);font-size:15px;min-width:100%}
.tabel th,.tabel td{border:1px solid var(--linie);padding:6px 10px;text-align:left}
.tabel th{background:var(--hartie)}
.azi-card{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--marker);color:var(--cerneala);
  border-radius:var(--r);padding:18px;text-decoration:none;border:2px solid #E5C93A}
.azi-card strong{display:block;font-family:var(--carte);font-size:21px}
.azi-card span{font-size:14px;color:#4A4210}
.serie{text-align:center;flex:none;min-width:70px}
.serie b{display:block;font-family:var(--carte);font-size:36px;line-height:1}
.serie small{font-size:12px}
.serie-mare{font-family:var(--carte);font-size:64px;font-weight:700;color:var(--cerneala);line-height:1}
.sunet{width:40px;height:40px;border-radius:20px;border:1.5px solid var(--linie);background:var(--alb);color:var(--cerneala);
  display:inline-grid;place-items:center;cursor:pointer;vertical-align:middle}
.cartonas:not(.intors)+span .sunet,.cartonas:not(.intors) ~ span .sunet{border-color:transparent}
.banda.bine{background:var(--bine-fond);border:1px solid #B9DEC8}
.schema{margin:0}
.schema figcaption{margin-bottom:10px;color:var(--cerneala)}
.cron{list-style:none;margin:0;padding:0 0 0 18px;border-left:3px solid var(--cerneala)}
.cron li{position:relative;padding:0 0 12px 12px}
.cron li::before{content:"";position:absolute;left:-26px;top:5px;width:13px;height:13px;border-radius:50%;background:var(--marker);border:2px solid var(--cerneala)}
.cron b{display:block;font-family:var(--carte);color:var(--cerneala)}
.flux{counter-reset:p;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.flux li{counter-increment:p;background:var(--hartie);border:1px solid var(--linie);border-radius:10px;padding:10px 12px 10px 44px;position:relative}
.flux li::before{content:counter(p);position:absolute;left:10px;top:9px;width:24px;height:24px;border-radius:12px;background:var(--cerneala);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:700}
