/* Teorie list, narrow-screen fixes, part tabs, AI result per point, target grade, help, footer icons, EN options and figures */
/* Teorie list, Khan Academy style: outline on the left, plain unit blocks, lessons as links */
.thk{display:grid;grid-template-columns:240px minmax(0,1fr);gap:36px;align-items:start;margin-top:10px}
.thk-nav{position:sticky;top:calc(var(--toph-v,var(--toph)) + 16px);display:flex;flex-direction:column;gap:16px;font-size:14px}
.thk-nt{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.thk-ng{display:flex;flex-direction:column;gap:3px}
.thk-ng>span{font-weight:800;font-size:13px;color:var(--sc);margin-bottom:4px}
.thk-ng a{display:flex;gap:10px;align-items:center;padding:7px 10px;border-radius:10px;color:var(--ink);text-decoration:none;font-weight:600;border:1px solid transparent}
.thk-ng a i{font-style:normal;font-size:12px;font-weight:800;width:22px;height:22px;border-radius:7px;display:grid;place-items:center;flex:none;background:var(--sc-w);color:var(--sc)}
.thk-ng a:hover{background:var(--card);border-color:color-mix(in srgb,var(--sc) 45%,var(--line));color:var(--sc)}
.thk-main{min-width:0}
.thk-gh{font-size:18px;font-weight:900;margin:4px 0 10px;color:var(--sc)}
.thk-gh span{font-size:13px;font-weight:600;color:var(--muted);margin-left:6px}
.thk-gh:not(:first-child){margin-top:26px}
.thk-us{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch}
.thk-u{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;scroll-margin-top:calc(var(--toph) + 16px)}
.thk-uh{display:grid;grid-template-columns:30px minmax(0,1fr) auto;align-items:center;gap:12px;width:calc(100% - 20px);margin:10px 10px 4px;padding:11px 12px;border:1.5px solid color-mix(in srgb,var(--sc) 40%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--sc-w) 55%,var(--card));font:inherit;color:inherit;text-align:left;cursor:pointer;transition:border-color .12s,box-shadow .12s,transform .12s}
.thk-uh:hover{border-color:var(--sc);box-shadow:0 6px 16px color-mix(in srgb,var(--sc) 18%,transparent);transform:translateY(-1px)}
.thk-uh:active{transform:translateY(0);box-shadow:none}
.thk-uh:focus-visible{outline:2px solid var(--sc);outline-offset:2px}
.thk-n{width:30px;height:30px;background:var(--card)!important;border-radius:8px;display:grid;place-items:center;background:var(--sc-w);font-size:13px;font-weight:800;color:var(--sc)}
.thk-ut{display:flex;flex-direction:column;min-width:0}
.thk-ut b{font-size:16px;font-weight:800;color:var(--sc)}
.thk-ut span{font-size:12.5px;color:var(--muted)}
.thk-go{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:800;color:var(--sc);background:var(--card);border:1px solid color-mix(in srgb,var(--sc) 35%,var(--line));border-radius:999px;padding:5px 12px;white-space:nowrap}
.thk-go i{font-style:normal;transition:transform .12s}
.thk-uh:hover .thk-go{background:var(--sc);color:#fff;border-color:var(--sc)}
.thk-uh:hover .thk-go i{transform:translateX(3px)}
.thk-ls{list-style:none;margin:0;padding:6px 16px 12px 64px;counter-reset:l}
.thk-ls li{counter-increment:l}
.thk-ls button{display:flex;gap:8px;width:100%;border:none;background:none;padding:4px 0;font:inherit;font-size:14px;color:var(--ink);text-align:left;cursor:pointer}
.thk-ls button::before{content:counter(l) ".";color:var(--muted);min-width:18px}
.thk-ls button:hover{color:var(--acc);text-decoration:underline;text-underline-offset:3px}
@media (max-width:900px){.thk{grid-template-columns:1fr;gap:18px}.thk-nav{position:static;gap:10px}.thk-nt{display:none}
  .thk-ng{flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px}.thk-ng>span{flex:1 1 100%;margin:0}
  .thk-ng a{background:var(--card);border-color:var(--line);padding:6px 10px 6px 6px;font-size:13.5px}}
@media (max-width:1100px){.thk-us{grid-template-columns:1fr}}
@media (max-width:700px){.thk-ls{padding-left:22px}.thk-go{padding:5px 9px;font-size:0;gap:0}.thk-go i{font-size:14px}}
/* long formulas scroll inside their box instead of pushing the page wider */
.th-art{min-width:0}
.fc,.th-note,.th-def{min-width:0;overflow-x:auto;overflow-y:hidden}
.th-art .katex-display{overflow-x:auto;overflow-y:hidden;padding-bottom:2px}
/* simulation / test bar on narrow phones: timer, pause (icon), submit and × on one row */
@media (max-width:520px){.sim-bar{gap:8px}.sb-t{font-size:20px;line-height:30px;padding:3px 10px}.sb-r{gap:6px}
  #sim-cnt,#ts-cnt2,.pz-t{display:none}.sb-r .btn{padding:8px 11px;font-size:14px}.sb-x{width:36px;height:36px}}
/* practice header on phones: a running simulation's pill gets its own row so the arrows stay on screen */
@media (max-width:700px){.app.prac .qhead:has(.simpill){flex-wrap:wrap!important;row-gap:8px}.qhead .simpill{order:9;flex:1 1 100%;max-width:100%;justify-content:center}}
/* tablets: the full navigation, but the brand shows only its logo and "Exersează" only its icon, so the right side stays on screen */
/* exercise page, phones: "‹ Capitole" back button; the AI panel compact, with aligned full-width buttons */
.q-home{display:none}
@media (max-width:700px){
  .q-home{display:inline-flex;align-items:center;gap:4px;flex:none;height:36px;padding:0 12px 0 9px;border-radius:10px;border:1.5px solid var(--line2);background:var(--card);color:var(--ink);font:inherit;font-size:14px;font-weight:800;cursor:pointer}
  .q-home span{font-size:20px;line-height:1;margin-top:-2px;color:var(--acc)}
  .app.prac .qhead .eyebrow .q-w{display:none}
  .aip{padding:14px;margin-top:12px}
  .aip .aih h3{font-size:16px}
  .aip .help{font-size:12.5px;line-height:18px;margin:4px 0 10px}
  .aip textarea{min-height:110px;font-size:14.5px;line-height:22px;padding:10px 12px}
  .aiu{display:grid;grid-template-columns:1fr;gap:8px}
  .aiu .btn,.aia .btn{width:100%;justify-content:center;text-align:center;min-height:44px;font-size:15px}
  .aiu #ai-imgname{text-align:center;margin:0}
  .aia{display:block;margin-top:8px}
}

/* part tabs a) b) c): three raised cards in a row, letter badge + state in words; the chosen one lifts */
.ptabs{display:grid!important;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);align-self:center;width:100%;max-width:560px;gap:10px!important;margin:14px auto 8px!important;padding:0;background:none;border:none}
.ptabs button{flex-direction:row;align-items:center!important;justify-content:center;gap:10px!important;min-width:0;border:1px solid var(--line2)!important;background:var(--card)!important;border-radius:12px!important;padding:9px 12px!important;color:var(--ink);box-shadow:0 1px 2px rgba(40,30,20,.06),0 2px 6px rgba(40,30,20,.05)!important;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
.ptabs button b{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--panel);font-size:16px;line-height:1;font-weight:900;transition:background .15s ease,color .15s ease}
.ptabs .pt-s{display:inline-flex;align-items:center;gap:4px;min-width:0;font-size:13px!important;font-weight:700;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ptabs .pt-s svg{flex:none;width:13px;height:13px;color:var(--good)}
.ptabs button.d .pt-s{color:var(--good)}
.ptabs button.p .pt-s{color:var(--org)}
.ptabs button:not([aria-selected="true"]):hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(40,30,20,.10)!important}
.ptabs button[aria-selected="true"]{transform:translateY(-2px);border-color:var(--acc)!important;box-shadow:0 6px 16px rgba(40,30,20,.12),0 0 0 1px var(--acc)!important}
.ptabs button[aria-selected="true"] b{background:var(--acc);color:var(--on-acc)}
[data-theme="dark"] .ptabs button{box-shadow:0 2px 8px rgba(0,0,0,.35)!important}
[data-theme="dark"] .ptabs button[aria-selected="true"]{box-shadow:0 6px 18px rgba(0,0,0,.45),0 0 0 1px var(--acc)!important}
@media (prefers-reduced-motion:reduce){.ptabs button,.ptabs button:hover,.ptabs button[aria-selected="true"]{transform:none;transition:none}}
@media (max-width:520px){.ptabs{gap:8px!important}.ptabs button{flex-direction:column;justify-content:center;gap:4px!important;padding:8px 4px!important}.ptabs button b{width:28px;height:28px;font-size:15px}.ptabs .pt-s{font-size:11.5px!important}}
/* AI result for a whole problem: one block per point */
.ai-pt{border:1px solid var(--line);border-radius:12px;margin-top:10px;overflow:hidden}
.ai-pth{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:var(--panel);font-size:14.5px}
.ai-pt.full .ai-pth span{color:var(--good)}.ai-pt.half .ai-pth span{color:var(--org)}.ai-pt.zero .ai-pth span{color:var(--bad)}
.ai-pth span{font-weight:900}
.ai-pt .sol{margin:0;padding:4px 12px 8px}

/* account: target grade chips */
.au-row.au-row1{grid-template-columns:minmax(0,1fr)}
/* the target grade: a big value, a slider with −/+ (step 0,05), faint until the student picks one */
.au-tg{margin-top:6px;border:1.5px solid var(--line2);border-radius:14px;background:var(--card);padding:10px 12px 8px}
.au-tgh{display:flex;align-items:baseline;gap:10px;min-height:34px}
.au-tgh b{font-size:28px;font-weight:900;line-height:1;color:var(--acc);font-variant-numeric:tabular-nums}
.au-tgh span{font-size:13px;color:var(--muted)}
.au-tgh .lnk{margin-left:auto;font-size:13px;color:var(--muted)}
.au-tg.empty .au-tgh b{color:var(--muted)}
.au-tgr{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:8px}
.au-tgb{height:44px;border:1.5px solid var(--line2);border-radius:12px;background:var(--card);color:var(--ink);font:900 20px var(--font);cursor:pointer;touch-action:manipulation}
.au-tgb:hover{border-color:var(--acc);color:var(--acc)}
.au-tgr input[type=range]{width:100%;height:44px;margin:0;accent-color:var(--acc);cursor:pointer;touch-action:pan-y}
.au-tg.empty .au-tgr input[type=range]{opacity:.45}
.au-tgs{display:flex;justify-content:space-between;padding:0 58px;font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums}
.pf-goals{display:flex;flex-wrap:wrap;gap:6px 14px;margin:6px 0 0;font-size:14px;color:var(--muted)}
.pf-goals b{color:var(--ink)}
/* the countdown card is a plain card now (educato look): its text follows the theme, so it shows in light mode too */
.pg-clock{color:var(--ink)!important}
.pg-clock h3{color:var(--ink)!important}
.pg-clock .pg-note,.pg-clock .clk span,.pg-clock .w-yr{color:var(--muted)!important}
.pg-clock .clk div{background:var(--panel)!important;border:1px solid var(--line)}
.pg-clock .clk b{color:var(--ink)!important}
.pg-clock .wall{filter:drop-shadow(0 6px 14px rgba(40,30,20,.18))}
/* review of a simulation / test: your answer and the right one; long formulas scroll in place, one column on phones */
.cmp>div{min-width:0}
.cmp .v{overflow-x:auto;overflow-y:hidden}
@media (max-width:700px){.cmp{grid-template-columns:1fr!important}}
.th-ex{margin:6px 0 14px}

/* help: a small "?" in the bottom-left corner (not on an exercise, a simulation or a test in progress, which have their own) */
.help-fab{position:fixed;left:18px;bottom:18px;z-index:35;width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line2);background:var(--card);color:var(--acc);font:900 21px/1 var(--font);cursor:pointer;box-shadow:0 6px 18px rgba(40,30,20,.12);display:grid;place-items:center;transition:transform .12s,box-shadow .12s}
.help-fab:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(40,30,20,.18);border-color:var(--acc)}
body.focus .help-fab,.app.prac~.help-fab{display:none}
.help-dlg .help-h{display:flex;justify-content:space-between;align-items:center;gap:12px}
.help-dlg .help-h h2{margin:0}
.help-dlg textarea,.help-dlg input{width:100%;margin-top:10px;border:1.5px solid var(--line2);border-radius:12px;background:var(--bg);color:var(--ink);font:inherit;padding:10px 12px;resize:vertical}
.help-dlg textarea:focus,.help-dlg input:focus{outline:none;border-color:var(--acc)}
.help-dlg .rep-b a.btn{text-decoration:none;display:inline-flex;align-items:center}
.help-f{margin:12px 0 0;font-size:13px;color:var(--muted);line-height:1.45}
.help-f a{color:var(--acc)}
@media (max-width:700px){.help-fab{left:12px;bottom:calc(72px + env(safe-area-inset-bottom,0px));width:40px;height:40px;font-size:19px}}
.acct-in .ai-m{display:none}
@media (max-width:700px){.acct-in .ai-d{display:none}.acct-in .ai-m{display:inline-flex}}
.au-go2{margin-top:10px!important}
/* account button: an orange dot while a temă is unfinished (the consent dot, yellow, wins when both apply) */
.acct-me.tm-due:not(.pending)::after{content:'';position:absolute;top:-1px;right:-1px;width:12px;height:12px;border-radius:50%;background:var(--tm,#f08c00);border:2px solid var(--bg)}
.top .acct-me.tm-due:not(.pending)::after{border-color:var(--hd-bg)}
.acct-me{position:relative}
/* phones: help lives in the account menu, so no floating "?" */
@media (max-width:700px){.help-fab{display:none!important}}
/* footer: Instagram, TikTok, Facebook in their own colours, with a label (plain links: nothing is loaded from those sites) */
.lf-brand:has(.lf-soc){max-width:440px}
.lf-soch{margin-top:18px;font-size:14px;font-weight:800;color:var(--ink)}
.lf-soc{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.lf-soc a{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px 0 12px;border-radius:12px;color:#fff;font:800 15px var(--font);text-decoration:none;box-shadow:0 4px 12px rgba(40,30,20,.15);transition:transform .12s,box-shadow .12s}
.lf-soc a:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(40,30,20,.22)}
.lf-soc svg{width:22px;height:22px;flex:none}
.lf-soc .s-ig{background:linear-gradient(45deg,#f9a33c,#e1306c 50%,#8a3ab9)}
.lf-soc .s-tt{background:#111}
.lf-soc{flex-wrap:nowrap}
.lf-by{margin:14px 0 0;font-size:13.5px;color:var(--muted)}.lf-by b{color:var(--ink);font-weight:800}
@media (max-width:480px){.lf-soc{gap:6px}.lf-soc a{height:40px;padding:0 10px 0 8px;gap:6px;font-size:13.5px}.lf-soc svg{width:19px;height:19px}}
.lf-soc .s-fb{background:#1877f2}
/* ---------- EN (Evaluarea Națională): multiple-choice options and the figures cropped from the official PDF ---------- */
.fields:has(> .mcq){display:block;width:100%}
.mc-lab{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mcq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;width:100%;max-width:640px;margin:0 auto}
.mcq button{display:flex;align-items:center;gap:12px;min-height:52px;padding:10px 16px;border:2px solid var(--line2);border-radius:14px;background:var(--card);color:var(--ink);font:500 17px var(--font);text-align:left;cursor:pointer;transition:border-color .15s ease,background .15s ease,transform .1s ease}
.mcq button b{display:inline-grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;background:var(--panel);color:var(--ink);font-weight:800;font-size:15px}
.mcq button span{min-width:0}
.mcq button:hover:not(:disabled){border-color:var(--acc)}
.mcq button:active:not(:disabled){transform:scale(.98)}
.mcq button[aria-checked="true"]{border-color:var(--acc);background:var(--acc-w)}
.mcq button[aria-checked="true"] b{background:var(--acc);color:var(--on-acc)}
.mcq button.ok{border-color:var(--good);background:var(--good-w)}
.mcq button.ok b{background:var(--good);color:var(--on-good)}
.mcq button.no{border-color:var(--bad);background:var(--bad-w)}
.mcq button.no b{background:var(--bad);color:var(--card)}
.mcq button.right{border-color:var(--good)}
.mcq button.right b{background:var(--good);color:var(--on-good)}
.mcq button:disabled{cursor:default}
.mcq button:disabled:not([aria-checked="true"]){opacity:.7}
.mcq.mc-need{animation:mcneed .35s ease}
@keyframes mcneed{25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.sq-a .mcq,#rec-f .mcq{max-width:560px;margin:6px 0 0}
.sq-a .mcq button{min-height:44px;font-size:15px;padding:8px 12px}
.exfig{display:block;width:auto;height:auto;max-width:min(100%,440px);max-height:260px;margin:12px auto 4px;object-fit:contain}
.st .katex-display{margin:.6em 0;overflow-x:auto;overflow-y:hidden}
/* practice page on a wide screen: the figure sits beside the text, as in the paper ("figura alăturată"), so it fits one screen */
@media (min-width:1000px){
  .app.prac .qleft.ql-2{flex-direction:row;align-items:center;gap:32px;text-align:left}
  .app.prac .ql-2>.ql-txt{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;align-items:stretch}
  .app.prac .ql-2>.ql-txt>.src{align-self:flex-start}
  .app.prac .ql-2>.exfig{flex:none;max-width:38%;max-height:230px;margin:0}
  .app.prac .st>.exfig.mid{max-height:200px}
}
:root[data-theme="dark"] .exfig{filter:invert(.88)}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .exfig{filter:invert(.88)}}
@media (max-width:700px){
  .mcq{gap:8px}
  .mcq button{min-height:46px;padding:8px 10px;gap:8px;font-size:15px}
  .mcq button b{width:26px;height:26px;font-size:13px}
  .exfig{max-height:200px}
}

/* "Vezi enunțul inițial" (origBtn, origDlg in bank.js) */
.orig-b{border:none;background:none;padding:2px 4px;font:600 13px var(--font);color:var(--muted);cursor:pointer;white-space:nowrap;border-radius:6px;text-decoration:underline dotted;text-underline-offset:3px}
.orig-b:hover{color:var(--acc);background:var(--acc-w)}
.st+.orig-b{display:inline-block;margin:6px 0 0 -4px}
.orig-dlg.dlg{width:min(640px,calc(100vw - 32px))}
.orig-dlg .help-h{display:flex;justify-content:space-between;align-items:center;gap:12px}
.orig-dlg .rep-s{margin:2px 0 12px}
.orig-dlg .og-stem{margin-bottom:10px}
.orig-dlg .og-p{padding:8px 10px;border-radius:10px;margin:4px 0;line-height:1.55}
.orig-dlg .og-p.on{background:var(--acc-w)}
.orig-dlg .og-mc{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:6px}
.orig-dlg .exfig{max-width:100%;display:block;margin:8px auto}
.orig-dlg .katex-display{overflow-x:auto;overflow-y:hidden}
@media (max-width:600px){.orig-b{font-size:12px}}