/* Øverum — fælles stil.
   Layout: app-shell med topbar i fagets farve, ternet "kladdepapir" bag, hvide kort, ét trin ad gangen.
   Farver: kølige neutraler + én fag-farve (sættes med data-fag på <body>). */
:root{
  --bg:#fbfcfe; --paper:#ffffff; --grid:#eef1f6; --raise:#f3f5f9;
  --ink:#121a2b; --ink-soft:#5b6779; --line:#d3dae6;
  --fag:#1f54ff; --fag-ink:#ffffff; --fag-soft:#e6ecff; --fag-deep:#1640c4; --fag-edge:#1238b0;
  --warm:#ffb020; --warm-edge:#d98b00; --warm-soft:#fff3d6; --warm-ink:#5a3a00;
  --mark:#ffe88a; --mark-ink:#5a4700;
  --ok:#168a4e; --ok-soft:#dcf5e6; --bad:#c8413c; --bad-soft:#fde3e1; --point:#e8602c;
  --display:'Bricolage Grotesque','Segoe UI',system-ui,sans-serif;
  --body:'Atkinson Hyperlegible','Segoe UI',system-ui,sans-serif;
  --r:16px; --shadow:0 1px 2px rgba(18,26,43,.06),0 6px 20px -8px rgba(18,26,43,.12);
}
body[data-fag="dansk"]{--fag:#e8423a;--fag-soft:#fde5e3;--fag-deep:#b22e28;--fag-edge:#a22722}
body[data-fag="engelsk"]{--fag:#16a065;--fag-soft:#dff3e9;--fag-deep:#117a4c;--fag-edge:#0e6a42}
body[data-fag="fysik"]{--fag:#8a3ff0;--fag-soft:#ece3fc;--fag-deep:#6530b8;--fag-edge:#5527a0}
body[data-fag="tysk"]{--fag:#e0a100;--fag-soft:#fff3cc;--fag-deep:#a67500;--fag-edge:#8f6500}
body[data-fag="biologi"]{--fag:#4f9a1f;--fag-soft:#e6f4da;--fag-deep:#3a7314;--fag-edge:#2f5f10}
body[data-fag="geografi"]{--fag:#0b9aa8;--fag-soft:#d9f3f5;--fag-deep:#08737e;--fag-edge:#066069}
body[data-fag="historie"]{--fag:#b5562a;--fag-soft:#f8e5dc;--fag-deep:#8a3f1d;--fag-edge:#733416}
body[data-fag="samfundsfag"]{--fag:#c2367f;--fag-soft:#fbe1ee;--fag-deep:#93275f;--fag-edge:#7a1f4e}
/* fag-farver på kort i oversigten */
.module[data-fag="dansk"]{--fag:#e8423a;--fag-deep:#b22e28;--fag-edge:#a22722}
.module[data-fag="engelsk"]{--fag:#16a065;--fag-deep:#117a4c;--fag-edge:#0e6a42}
.module[data-fag="tysk"]{--fag:#e0a100;--fag-deep:#a67500;--fag-edge:#8f6500}
.module[data-fag="fysik"]{--fag:#8a3ff0;--fag-deep:#6530b8;--fag-edge:#5527a0}
.module[data-fag="biologi"]{--fag:#4f9a1f;--fag-deep:#3a7314;--fag-edge:#2f5f10}
.module[data-fag="geografi"]{--fag:#0b9aa8;--fag-deep:#08737e;--fag-edge:#066069}
.module[data-fag="historie"]{--fag:#b5562a;--fag-deep:#8a3f1d;--fag-edge:#733416}
.module[data-fag="samfundsfag"]{--fag:#c2367f;--fag-deep:#93275f;--fag-edge:#7a1f4e}
@media (prefers-color-scheme:dark){ :root:not([data-theme="light"]){
  --bg:#0e131c; --paper:#161d2a; --grid:#1c2432; --raise:#1c2533;
  --ink:#eaf0fa; --ink-soft:#9fabc0; --line:#2a3447;
  --fag:#5f87ff; --fag-ink:#0b1220; --fag-soft:#1b2a4f; --fag-deep:#8eabff; --fag-edge:#3a63d6;
  --warm:#ffb020; --warm-edge:#c98300; --warm-soft:#3a2a08; --warm-ink:#ffd27a;
  --mark:#8a7320; --mark-ink:#fff1b0;
  --ok:#5fd08f; --ok-soft:#133526; --bad:#ff8a84; --bad-soft:#3d1d1c; --point:#ff8f5e;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -10px rgba(0,0,0,.6); color-scheme:dark }
  :root:not([data-theme="light"]) body[data-fag="dansk"]{--fag:#ff7a72;--fag-soft:#4a2320;--fag-deep:#ffa39d;--fag-edge:#c9524c}
  :root:not([data-theme="light"]) body[data-fag="engelsk"]{--fag:#4fcf92;--fag-soft:#163a2a;--fag-deep:#8ae4b8;--fag-edge:#2f9a69}
  :root:not([data-theme="light"]) body[data-fag="fysik"]{--fag:#ac86ff;--fag-soft:#2c1f50;--fag-deep:#c9b0ff;--fag-edge:#7d5bd0}
  :root:not([data-theme="light"]) body[data-fag="tysk"]{--fag:#ffc83d;--fag-soft:#473a0f;--fag-deep:#ffd970;--fag-edge:#c99a1e}
  :root:not([data-theme="light"]) body[data-fag="biologi"]{--fag:#7fc94a;--fag-soft:#213a12;--fag-deep:#a9df80;--fag-edge:#5a9a30}
  :root:not([data-theme="light"]) body[data-fag="geografi"]{--fag:#3fc5d3;--fag-soft:#123a3f;--fag-deep:#86dde6;--fag-edge:#2a96a1}
  :root:not([data-theme="light"]) body[data-fag="historie"]{--fag:#e0845a;--fag-soft:#44261a;--fag-deep:#f0ad8e;--fag-edge:#b0603a}
  :root:not([data-theme="light"]) body[data-fag="samfundsfag"]{--fag:#e86aa9;--fag-soft:#46203a;--fag-deep:#f3a1c9;--fag-edge:#b84a84}
}
:root[data-theme="dark"]{
  --bg:#0e131c; --paper:#161d2a; --grid:#1c2432; --raise:#1c2533;
  --ink:#eaf0fa; --ink-soft:#9fabc0; --line:#2a3447;
  --fag:#5f87ff; --fag-ink:#0b1220; --fag-soft:#1b2a4f; --fag-deep:#8eabff; --fag-edge:#3a63d6;
  --warm:#ffb020; --warm-edge:#c98300; --warm-soft:#3a2a08; --warm-ink:#ffd27a;
  --mark:#8a7320; --mark-ink:#fff1b0;
  --ok:#5fd08f; --ok-soft:#133526; --bad:#ff8a84; --bad-soft:#3d1d1c; --point:#ff8f5e;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -10px rgba(0,0,0,.6); color-scheme:dark }
:root[data-theme="dark"] body[data-fag="dansk"]{--fag:#ff7a72;--fag-soft:#4a2320;--fag-deep:#ffa39d;--fag-edge:#c9524c}
:root[data-theme="dark"] body[data-fag="engelsk"]{--fag:#4fcf92;--fag-soft:#163a2a;--fag-deep:#8ae4b8;--fag-edge:#2f9a69}
:root[data-theme="dark"] body[data-fag="fysik"]{--fag:#ac86ff;--fag-soft:#2c1f50;--fag-deep:#c9b0ff;--fag-edge:#7d5bd0}
:root[data-theme="dark"] body[data-fag="tysk"]{--fag:#ffc83d;--fag-soft:#473a0f;--fag-deep:#ffd970;--fag-edge:#c99a1e}
:root[data-theme="dark"] body[data-fag="biologi"]{--fag:#7fc94a;--fag-soft:#213a12;--fag-deep:#a9df80;--fag-edge:#5a9a30}
:root[data-theme="dark"] body[data-fag="geografi"]{--fag:#3fc5d3;--fag-soft:#123a3f;--fag-deep:#86dde6;--fag-edge:#2a96a1}
:root[data-theme="dark"] body[data-fag="historie"]{--fag:#e0845a;--fag-soft:#44261a;--fag-deep:#f0ad8e;--fag-edge:#b0603a}
:root[data-theme="dark"] body[data-fag="samfundsfag"]{--fag:#e86aa9;--fag-soft:#46203a;--fag-deep:#f3a1c9;--fag-edge:#b84a84}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{color-scheme:light dark}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.55;
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:32px 32px}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--fag)}
h1,h2,h3{font-family:var(--display);line-height:1.08;text-wrap:balance;margin:0;letter-spacing:-.01em}
h1{font-size:2.3rem;font-weight:800}
h2{font-size:1.5rem;font-weight:800}
h3{font-size:1.15rem;font-weight:700}
p{margin:.5em 0;max-width:62ch}
a{color:var(--fag-deep)}
ul,ol{padding-left:1.2em;margin:.4em 0}li{margin:.3em 0}
.tiny{font-size:.9rem;color:var(--ink-soft)}
.sub{color:var(--ink-soft);font-size:1.05rem}
mark{background:var(--mark);color:var(--mark-ink);padding:0 .2em;border-radius:4px}
button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid var(--mark);outline-offset:2px}

/* Topbar */
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:9;background:var(--fag);color:var(--fag-ink);
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.topbar .in{max-width:760px;margin:0 auto;display:flex;align-items:center;gap:12px;min-height:56px}
.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;font-family:var(--display);font-weight:800;font-size:1.2rem}
.logo{display:inline-grid;place-items:center;width:34px;height:34px;color:var(--fag-ink)}
.logo svg{display:block;border-radius:10px}
.topbar .fagchip{margin-left:auto;color:inherit;text-decoration:none;font-family:var(--display);font-weight:700;font-size:.95rem;
  padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.18)}
.topbar .fagchip:hover{background:rgba(255,255,255,.28)}
.topbar .theme{margin-left:8px;width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.18);color:inherit;font-size:1.1rem;cursor:pointer;display:grid;place-items:center;line-height:1}
.topbar .theme:hover{background:rgba(255,255,255,.28)}
.topbar .brand+.theme{margin-left:auto}
.theme .moon{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .theme .sun{display:none}:root:not([data-theme="light"]) .theme .moon{display:inline}}
:root[data-theme="dark"] .theme .sun{display:none}:root[data-theme="dark"] .theme .moon{display:inline}

.wrap{max-width:760px;margin:0 auto;padding-block:22px 72px;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.hero{display:flex;flex-direction:column;gap:6px;margin-bottom:18px}
.eyebrow{font-family:var(--display);font-weight:700;font-size:.85rem;letter-spacing:.08em;text-transform:uppercase;color:var(--fag-deep)}

/* Faner */
nav.tabs{display:flex;gap:6px;margin:16px 0 22px;padding:5px;background:var(--paper);border:2px solid var(--line);border-radius:999px}
nav.tabs button{flex:1;font-family:var(--display);font-weight:700;font-size:1.05rem;padding:11px;border-radius:999px;border:0;background:transparent;color:var(--ink-soft);cursor:pointer}
nav.tabs button[aria-selected="true"]{background:var(--fag);color:var(--fag-ink);box-shadow:0 3px 0 var(--fag-edge)}

section.view{display:flex;flex-direction:column;gap:18px}
.card{background:var(--paper);border:2px solid var(--line);border-radius:var(--r);padding:20px 22px;min-width:0}
.card>h2{margin-bottom:6px}
.eq{font-family:var(--display);font-size:1.75rem;font-weight:700;text-align:center;letter-spacing:.01em;font-variant-numeric:tabular-nums;margin:10px 0;overflow-wrap:anywhere}
.steps{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;align-items:baseline;margin:10px 0 0;font-variant-numeric:tabular-nums}
.steps .do{color:var(--ink-soft);font-size:.95rem}
.steps .is{font-family:var(--display);font-size:1.3rem;font-weight:700}
.steps .final{color:var(--fag-deep)}
@media (max-width:480px){.steps{grid-template-columns:1fr}.steps .do{margin-top:8px}}
.rule{background:var(--fag-soft);border-left:6px solid var(--fag);border-radius:12px;padding:16px 20px;font-size:1.1rem}
.rule b{font-family:var(--display);font-size:1.2rem}
.fig{display:block;max-width:100%;height:auto;margin:6px auto}

/* Niveau-sti */
.levels{display:flex;gap:6px;overflow-x:auto;padding:4px 2px 8px;scrollbar-width:none}
.levels::-webkit-scrollbar{display:none}
.levels button{flex:0 0 auto;position:relative;width:54px;height:54px;border-radius:50%;font-family:var(--display);font-weight:800;font-size:1.15rem;
  border:2px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;box-shadow:0 4px 0 var(--line)}
.levels button:active{transform:translateY(3px);box-shadow:0 1px 0 var(--line)}
.levels button[aria-pressed="true"]{border-color:var(--fag);background:var(--fag);color:var(--fag-ink);box-shadow:0 4px 0 var(--fag-edge)}
.levels button.done{border-color:var(--ok);background:var(--ok-soft);color:var(--ok)}
.levels button.done[aria-pressed="true"]{background:var(--ok);color:#fff;box-shadow:0 4px 0 #0f6a3a}
.levels button.done::after{content:"✓";position:absolute;right:-4px;top:-4px;width:18px;height:18px;border-radius:50%;background:var(--ok);color:#fff;font-size:.7rem;line-height:18px;text-align:center;border:2px solid var(--paper)}
.lvlname{font-family:var(--display);font-weight:700;margin-top:4px}
.lvlhelp{color:var(--ink-soft);font-size:.92rem;margin:0}

/* Opgave */
.task{display:flex;flex-direction:column;gap:14px;align-items:stretch;border-top:5px solid var(--fag)}
.task .eq{font-size:2.1rem}
.task .prompt{text-align:center;font-size:1.1rem;margin:0;color:var(--ink-soft)}
.answer{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;align-items:center}
.answer label{font-family:var(--display);font-size:1.4rem;font-weight:700}
.answer input{width:6ch;font:inherit;font-size:1.5rem;font-variant-numeric:tabular-nums;padding:9px 10px;border-radius:12px;border:2px solid var(--line);background:var(--raise);color:var(--ink);text-align:center}
.answer input:focus{border-color:var(--fag)}
.answer input.wide{width:8ch}
.btn{font-family:var(--display);font-weight:800;font-size:1.05rem;padding:11px 22px;border-radius:14px;border:0;cursor:pointer;background:var(--fag);color:var(--fag-ink);text-decoration:none;display:inline-block;
  box-shadow:0 4px 0 var(--fag-edge);transform:translateY(0)}
.btn:active{transform:translateY(4px);box-shadow:0 0 0 var(--fag-edge)}
.btn.ghost{background:var(--paper);color:var(--fag-deep);border:2px solid var(--line);box-shadow:0 4px 0 var(--line)}
.btn.ghost:active{box-shadow:0 0 0 var(--line)}
.btn.ghost:hover{border-color:var(--fag)}
.btn.ghost.sm{font-size:.95rem;padding:7px 14px}
.btn.neg{font-size:1.4rem;padding:5px 14px;line-height:1}
.btnrow{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.feedback{border-radius:12px;padding:12px 16px;font-size:1.1rem}
.feedback:empty{display:none}
.feedback.ok{background:var(--ok-soft);color:var(--ok);font-weight:700}
.feedback.bad{background:var(--bad-soft);color:var(--bad)}
.feedback.hint{background:var(--fag-soft);color:var(--ink)}
.feedback.win{background:var(--warm);color:var(--warm-ink);font-family:var(--display);font-weight:800;font-size:1.25rem;text-align:center}
.sol{border-top:1px dashed var(--line);padding-top:12px}
details summary{cursor:pointer;font-family:var(--display);font-weight:700;color:var(--fag-deep)}

/* Fremdrift: 5 prikker + tal */
.progress{display:flex;flex-direction:column;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:12px}
.dots{display:flex;gap:8px}
.dots span{width:14px;height:14px;border-radius:50%;background:var(--line)}
.dots span.on{background:var(--warm);box-shadow:0 2px 0 var(--warm-edge)}
.dots+.tiny{margin:0}
.stats{display:flex;gap:18px;flex-wrap:wrap;color:var(--ink-soft);font-size:.9rem;justify-content:center;font-variant-numeric:tabular-nums}
.stats b{color:var(--ink);font-family:var(--display);font-size:1.15rem}

/* Brøker */
.frac{display:inline-flex;flex-direction:column;vertical-align:middle;text-align:center;line-height:1.05;margin:0 .15em;font-variant-numeric:tabular-nums}
.frac>span{padding:0 .25em}
.frac>span:first-child{border-bottom:2px solid currentColor}
.eq .frac{font-size:.85em}
.op{margin:0 .25em}
/* Koordinatsystem */
.plot{display:block;width:100%;max-width:420px;height:auto;margin:0 auto;touch-action:manipulation;border-radius:12px;border:1px solid var(--line)}
.plot.tap{cursor:crosshair}
.plot text{font-family:var(--body);font-size:11px;fill:var(--ink-soft)}

/* Oversigter (forside og fag) */
.modules{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.module{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:inherit;border:2px solid var(--line);border-radius:var(--r);padding:18px 20px;background:var(--paper);box-shadow:0 4px 0 var(--line);border-top:5px solid var(--fag)}
.module:hover{border-color:var(--fag);box-shadow:0 4px 0 var(--fag-edge)}
.module h2{font-size:1.35rem}
.module p{margin:0}
.module .prog{color:var(--ink-soft);font-size:.92rem;font-variant-numeric:tabular-nums}
.module .trin{font-family:var(--display);font-weight:700;font-size:.78rem;letter-spacing:.05em;text-transform:uppercase;color:var(--fag);background:color-mix(in srgb,var(--fag) 14%,transparent);padding:3px 9px;border-radius:999px;width:max-content;margin-top:2px}
.module .bar{height:6px;border-radius:3px;background:var(--line);overflow:hidden;margin-top:4px}
.module .bar i{display:block;height:100%;background:var(--warm);width:0}
.module .go{color:var(--fag-deep);font-family:var(--display);font-weight:700;margin-top:auto;padding-top:6px}
.module.soon{box-shadow:none;background:transparent;border-style:dashed;opacity:.8}
.module.soon h2{color:var(--ink-soft)}
.module.soon .go{color:var(--ink-soft)}
.module.soon .fagdot{opacity:.6}
.fagrow{display:flex;align-items:center;gap:10px}
.fagdot{width:12px;height:12px;border-radius:50%;background:var(--fag)}

/* Konfetti */
#confetti{position:fixed;inset:0;pointer-events:none;z-index:50}
@media (prefers-reduced-motion:no-preference){
  .feedback.ok,.feedback.win{animation:pop .25s ease-out}
  @keyframes pop{from{transform:scale(.96);opacity:.5}to{transform:none;opacity:1}}
  .module{transition:transform .15s}
}
/* Login/sync */
.topbar .login{display:flex;align-items:center;gap:8px;margin-left:auto}
.topbar .login+.theme{margin-left:0}
.topbar .brand+.login{margin-left:auto}
.topbar .fagchip+.login{margin-left:8px}
.topbar .fagchip{margin-left:auto}
.topbar #syncstatus{color:inherit;opacity:.8;font-size:.8rem;cursor:help}
.topbar .loginbtn{font-size:1rem;font-family:var(--display);font-weight:800}
.topbar .loginbtn.on{background:var(--warm);color:var(--warm-ink)}
@media (max-width:600px){.topbar #syncstatus{display:none}}

/* Login-dialog (sync.js) */
.ovdlg{position:fixed;inset:0;z-index:100;background:rgba(10,14,22,.55);display:flex;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(3px)}
.ovdlg[hidden]{display:none!important}
.ovbox{position:relative;width:100%;max-width:420px;max-height:calc(100vh - 32px);overflow:auto;background:var(--paper);color:var(--ink);border:2px solid var(--line);border-radius:var(--r);padding:24px 22px 20px;box-shadow:0 18px 50px rgba(0,0,0,.25)}
.ovbox h2{margin:0 0 6px;font-family:var(--display);font-size:1.45rem}
.ovbox p{margin:0 0 14px}
.ovx{position:absolute;top:10px;right:10px;width:36px;height:36px;border-radius:50%;border:2px solid var(--line);background:var(--raise);color:var(--ink);font-size:1.3rem;line-height:1;cursor:pointer}
.ovf{display:block;margin:0 0 12px}
.ovf span{display:block;font-size:.9rem;color:var(--ink-soft);margin-bottom:4px}
.ovf input{width:100%;box-sizing:border-box;font:inherit;font-size:1.05rem;padding:10px 12px;border-radius:12px;border:2px solid var(--line);background:var(--raise);color:var(--ink)}
.ovf input:focus{outline:none;border-color:var(--fag)}
.ovrow{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:16px 0 10px}
.ovrow .btn{font-size:1rem;padding:10px 18px}
.ovbox .btn.busy{opacity:.6;cursor:wait}
.ovmsg{min-height:1.2em;margin:0;color:var(--bad);font-size:.95rem}
.ovmsg.ok{color:var(--ok)}
.ovbox a{color:var(--fag-deep)}
.ovdanger{margin-top:14px;border-top:2px solid var(--line);padding-top:10px}
.ovdanger summary{cursor:pointer;color:var(--ink-soft);font-size:.95rem}
.ovdanger .btn.danger{color:var(--bad);margin-top:4px}
body.ovdlg-open{overflow:hidden}

/* Sprogfag: sætninger, ordsvar og svarknapper */
.task .eq.text{font-family:var(--body);font-weight:400;font-size:1.35rem;line-height:1.5;text-align:center;letter-spacing:0;font-variant-numeric:normal;padding:0 6px}
.answer input.word{width:min(100%,16ch);text-align:left;font-size:1.25rem;font-variant-numeric:normal}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.choices{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:14px 0 6px}
.choices[hidden]{display:none!important}
.choice{font-family:var(--display);font-weight:700;font-size:1.15rem;padding:11px 20px;border-radius:14px;border:2px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;box-shadow:0 4px 0 var(--line)}
.choice:hover{border-color:var(--fag)}
.choice:active{transform:translateY(3px);box-shadow:0 1px 0 var(--line)}
.choice.right{background:var(--ok-soft);border-color:var(--ok);color:var(--ok)}
.choice.wrong{background:var(--bad-soft);border-color:var(--bad);color:var(--bad)}

/* Automatisk næste opgave (autonext.js) */
.feedback .autonext{display:block;margin-top:8px;font-size:.9rem;font-weight:400;color:var(--ink-soft)}
.feedback .autonext b{font-variant-numeric:tabular-nums;color:var(--ink)}
.feedback .autonext button{font:inherit;font-weight:700;color:var(--fag-deep);background:none;border:0;padding:0;cursor:pointer;text-decoration:underline}

/* Forside som landingsside */
.hero.landing{margin-bottom:22px}
.hero.landing .cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.hero.landing .stats{color:var(--ink-soft);font-size:.95rem;margin:8px 0 0}
.hero.landing .stats b{color:var(--ink);font-family:var(--display)}
.screens{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:0 0 26px}
.screens figure{margin:0;background:var(--paper);border:2px solid var(--line);border-radius:var(--r);padding:10px;display:flex;flex-direction:column;gap:8px}
.screens img{width:100%;height:auto;max-height:300px;object-fit:cover;object-position:top;border-radius:10px;border:1px solid var(--line)}
.screens figcaption{font-size:.9rem;color:var(--ink-soft)}
.h2{font-size:1.5rem;margin:0 0 12px}

/* Guides (artikler til forældre og elever) */
.article{max-width:720px;margin:0 auto}
.article .meta{color:var(--ink-soft);font-size:.9rem;margin:0 0 6px}
.article .lead{font-size:1.15rem;color:var(--ink-soft);margin:0 0 22px}
.article h2{font-size:1.4rem;margin:30px 0 10px}
.article h3{font-size:1.1rem;margin:20px 0 6px}
.article p,.article li{line-height:1.65}
.article .proev{background:var(--fag-soft);border-left:6px solid var(--fag);border-radius:12px;padding:16px 20px;margin:24px 0}
.article .proev h2,.article .proev h3{margin:0 0 8px;font-size:1.1rem}
.article .proev ul{margin:0;padding-left:20px}
.article .proev a{font-weight:700;color:var(--fag-deep)}
.article .ex{background:var(--paper);border:2px solid var(--line);border-radius:12px;padding:14px 18px;margin:14px 0;font-variant-numeric:tabular-nums}
.article .faq details{border-top:2px solid var(--line);padding:10px 0}
.article .faq summary{font-family:var(--display);font-weight:700;cursor:pointer;font-size:1.05rem}
.article .faq details p{margin:8px 0 0}
.article .more{margin-top:34px;padding-top:18px;border-top:2px solid var(--line)}
.article .more a{display:block;padding:6px 0;font-weight:700;color:var(--fag-deep)}
.guides .module{gap:6px}
.guides .module .kat{font-family:var(--display);font-weight:700;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--fag-deep)}