:root,.ljus{--c-graphite:#3d4249;--c-slate:#6f8191;--c-mist:#cbd2d9;--bg:#f7f7f7;--panel:#fff;--panel-2:#f1f2ec;--text:#1c1f1b;--text-dim:#4e5a52;--muted:#4e5a52;--line:#1c1f1b;--route:#1c1f1b;--here:#c4460b;--map-ink:#1c1f1b;--accent:#c4460b;--accent-ink:#c24a06;--accent-soft:#c4460b1a;--on-accent:#fff;--ok:#2f7a55;--ok-soft:#2f7a551a;--fs-red:#c0392b;--tag-bg:#1c1f1b;--tag-ink:#fff;--oliv-900:#2f3629;--oliv-700:#5e6858;--oliv-500:#8c9586;--oliv-100:#e4e8de;--ink:#1c1f1b;--signal:#c4460b;--signal-m:#9e3a04;--gul:#ffc000;--radie:2px;--display:"Barlow Condensed", "Arial Narrow", sans-serif;--sans:"Barlow", "Segoe UI", system-ui, sans-serif;--mono:"IBM Plex Mono", ui-monospace, Consolas, monospace;--surface:#fff;--head-bg:#2f3629;--foot-bg:#5e6858;--fill:#1c1f1b;--on-fill:#fff;--on-gul:#1c1f1b;--tips-bg:#e4e8de8c;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#121611;--surface:#1c211a;--panel:#1c211a;--panel-2:#262d23;--text:#e9ece5;--text-dim:#b8c1b1;--muted:#b8c1b1;--line:#8e9987;--route:#e9ece5;--map-ink:#8e9987;--ink:#e9ece5;--c-mist:#4a5347;--oliv-900:#c9d1c2;--oliv-700:#a7b1a0;--oliv-500:#6b7666;--oliv-100:#263022;--accent-ink:#ff9f66;--accent-soft:#e8662a2e;--ok:#5fc08a;--ok-soft:#5fc08a26;--fs-red:#ff7b6b;--fill:#e9ece5;--on-fill:#121611;--tips-bg:#1f261c;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}.ljus{background:var(--surface);color:var(--text)}.ljus.yta{border-radius:var(--radie);padding:12px}}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--sans);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font-size:1.125rem;line-height:1.6}::selection{background:var(--accent);color:var(--on-accent)}:focus-visible{outline:3px solid var(--ink);outline-offset:2px;box-shadow:0 0 0 6px var(--gul)}.sr{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.skip{z-index:50;background:var(--head-bg);color:#fff;border-radius:var(--radie);padding:10px 14px;position:absolute;top:-60px;left:12px}.skip:focus{top:12px}.wrap{width:min(1160px,100% - 32px);margin-inline:auto}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}}a{color:var(--accent-ink)}code{font-family:var(--mono);background:var(--panel-2);border-radius:2px;padding:1px 6px;font-size:.9em}main.page{flex-direction:column;width:100%;max-width:880px;min-height:100vh;margin:0 auto;padding:24px clamp(16px,5vw,72px) 48px;display:flex}h1,h2,h3{text-wrap:balance;margin:0 0 14px;line-height:1.05}h1{font-family:var(--display);font-size:clamp(40px,6vw,68px);font-weight:700}h2{font-family:var(--display);font-size:clamp(32px,5vw,52px);font-weight:700}h3{font-family:var(--display);margin-top:28px;font-size:26px;font-weight:700}.eyebrow-num{font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--here);margin:0 0 8px;font-size:13px;font-weight:600}.subtitle{color:var(--text-dim);max-width:60ch;margin:0 0 32px;font-size:18px}.top-nav{border-bottom:2px solid var(--map-ink);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:24px;padding-bottom:10px;display:flex}.sidhuvud{background:var(--head-bg);color:#fff;border-bottom:4px solid var(--gul)}.sidhuvud .wrap{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:16px;padding:14px 0;display:flex}.sidhuvud .namn{font:800 1.7rem/1 var(--display);color:#fff;text-decoration:none}.sidhuvud-slogan{color:#e4e8de;font-size:.95rem}.sidhuvud-hoger{color:#e4e8de;flex-wrap:wrap;align-items:baseline;gap:16px;font-size:.95rem;display:flex}.sidhuvud-hoger form{margin:0}.sidhuvud .sidhuvud-lank{all:unset;box-sizing:border-box;cursor:pointer;color:#fff;text-underline-offset:4px;min-height:32px;padding:6px 2px;font-size:.95rem;text-decoration:underline}.sidhuvud .sidhuvud-lank:hover{color:var(--gul)}.sidhuvud .sidhuvud-lank:focus-visible{outline-offset:2px;box-shadow:0 0 0 6px var(--gul);outline:3px solid #fff}@media (max-width:640px){.sidhuvud-slogan{display:none}}main.page.med-sidhuvud{min-height:calc(100vh - 66px);padding-top:28px}label{font-family:var(--mono);color:var(--text-dim);margin:12px 0 4px;font-size:13px;display:block}input{border:2px solid var(--map-ink);border-radius:var(--radie);width:100%;font-size:16px;font-family:var(--mono);background:var(--panel);color:var(--text);padding:10px 12px}input:focus-visible{outline:3px solid var(--ink);outline-offset:0;border-color:var(--ink)}button,.btn{all:unset;box-sizing:border-box;cursor:pointer;font-family:var(--sans);text-align:center;background:var(--here);color:var(--on-accent);border:2px solid var(--map-ink);border-radius:var(--radie);justify-content:center;align-items:center;gap:10px;min-height:52px;margin-top:14px;padding:10px 22px;font-size:1.1rem;font-weight:600;line-height:1.2;text-decoration:none;transition:background .15s;display:inline-flex}button:hover,.btn:hover{background:var(--signal-m)}button:focus-visible,.btn:focus-visible{outline:3px solid var(--ink);outline-offset:2px;box-shadow:0 0 0 6px var(--gul)}button.secondary,.btn.secondary{background:var(--panel);color:var(--text)}button.secondary:hover,.btn.secondary:hover{background:var(--panel-2)}button.ghost{border:2px dashed var(--c-mist);color:var(--text-dim);font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase;background:0 0;min-height:0;font-size:13px;font-weight:600}button.ghost:hover{color:var(--here);opacity:1;background:0 0}button:disabled{opacity:.4;cursor:not-allowed}button:disabled:hover{background:var(--here)}button.secondary:disabled:hover{background:var(--panel)}.progress-bar-outer{background:var(--oliv-100);border:1px solid var(--oliv-500);border-radius:var(--radie);height:8px;margin-top:8px;overflow:hidden}.progress-bar-inner{background:var(--signal);height:100%}.badge{font-family:var(--mono);text-transform:uppercase;letter-spacing:.1em;background:var(--foot-bg);color:#fff;border-radius:var(--radie);margin:8px 0;padding:3px 8px;font-size:11px;display:inline-block}.option-item{all:unset;box-sizing:border-box;cursor:pointer;text-transform:none;letter-spacing:normal;border:2px solid var(--map-ink);border-radius:var(--radie);cursor:pointer;background:var(--panel);width:100%;color:var(--text);text-align:left;width:100%;min-height:44px;margin-bottom:10px;padding:13px 15px;font-family:inherit;font-size:16px;font-weight:400;transition:background .15s,border-color .15s;display:block}.option-item:hover{background:var(--panel-2)}.option-item.selected{border-color:var(--signal);box-shadow:inset 0 0 0 2px var(--signal);background:var(--panel);font-weight:600}.option-item.correct{border-color:var(--ok);box-shadow:inset 0 0 0 2px var(--ok);background:var(--ok-soft);font-weight:600}.option-item.dim{opacity:.55}.feedback-box{border:2px solid var(--map-ink);border-left:8px solid var(--oliv-700);border-radius:var(--radie);background:var(--oliv-100);margin-top:14px;padding:16px 18px;font-size:16px}.feedback-box.ok{border-left-color:var(--ok);background:var(--ok-soft)}.feedback-box.fel{border-left-color:var(--signal);background:#c4460b14}.feedback-box p{color:var(--text);margin:8px 0 0;font-size:16px}footer.nav-controls{border-top:2px solid var(--map-ink);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:24px;display:flex}footer.nav-controls button{margin-top:0}@media (max-width:700px){footer.nav-controls{flex-direction:column;align-items:stretch;padding-top:20px}footer.nav-controls button{width:100%}}.stat-row{gap:12px;margin:20px 0;display:flex}.stat-box{border:2px solid var(--map-ink);text-align:center;background:var(--panel);border-radius:var(--radie);flex:1;padding:16px}.stat-box .num{font-family:var(--display);font-size:30px;font-weight:700}.stat-box .label{font-family:var(--mono);color:var(--text-dim);letter-spacing:.08em;text-transform:uppercase;font-size:12px}.login-error{color:var(--fs-red);font-family:var(--mono);min-height:18px;margin-top:8px;font-size:13px}.auth-wrap{width:100%;max-width:460px;margin:0 auto}.auth-wrap .subtitle{margin-bottom:24px}.auth-box{background:var(--panel);width:100%;max-width:460px;margin:0 auto;padding:22px}.fblock{background:var(--surface);border:2px solid var(--ink);border-radius:var(--radie);width:100%;overflow:hidden}.fblock-head{background:var(--head-bg);color:#fff;border-bottom:4px solid var(--signal);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin:0;padding:10px 18px;font-size:1.6rem;font-weight:700;line-height:1.1;display:flex}.fblock-head a{color:#fff;font:500 .95rem var(--sans);text-underline-offset:4px;padding:8px 2px;text-decoration:underline}.fblock-head a:hover{color:var(--gul)}.fblock-head a:focus-visible{outline-offset:2px;box-shadow:0 0 0 6px var(--gul);outline:3px solid #fff}.fblock-body{padding:18px}.fblock-body>:first-child{margin-top:0}.fblock-body .subtitle{margin-bottom:12px;font-size:1rem}.fblock-body h2{font-size:clamp(1.9rem,5vw,2.6rem)}.fblock-body footer.nav-controls{margin-top:18px}.lesson-intro>p,.lesson-intro>ul,.lesson-intro>ol,.lesson-intro>h3{max-width:66ch}.lesson-intro>h3{font-family:var(--display);text-transform:none;border-top:3px solid var(--map-ink);margin-top:40px;padding-top:14px;font-size:34px;font-weight:700}.lesson-intro>ul,.lesson-intro>ol{margin:8px 0 16px;padding-left:22px}.lesson-intro li{margin-bottom:6px}.lesson-intro ul li::marker{color:var(--here)}.lesson-intro ol li::marker{color:var(--here)}.lesson-intro>img{border:2px solid var(--map-ink);background:#fff;width:100%;height:auto;margin:18px 0}.lesson-intro>div{max-width:none}.mils-grader{grid-template-columns:1fr 1fr;align-items:center;gap:16px;padding:16px;display:grid}.mils-grader svg{width:100%;height:auto;display:block}.gradskiva-skiva{outline:none;width:calc(50% - 24px)}.gradskiva-skiva svg{touch-action:none;cursor:grab;width:100%;height:auto;display:block}@media (max-width:760px){.mils-grader{grid-template-columns:1fr}.gradskiva-skiva{width:calc(100% - 32px)}}.kr-steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:0 0 14px;padding:0;list-style:none;display:grid}.kr-steps>li,.kr-steps>button{all:unset;box-sizing:border-box;border:2px solid var(--oliv-500);border-radius:var(--radie);background:var(--panel);min-height:40px;color:var(--oliv-700);font-family:var(--mono);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap;text-align:center;justify-content:center;align-items:center;margin:0;padding:4px;font-size:13px;font-weight:600;display:flex}.kr-steps>button{cursor:pointer;min-height:44px}.kr-steps>button:hover{border-color:var(--signal)}.kr-steps>button:focus-visible{outline:3px solid var(--ink);outline-offset:2px}.kr-steps>.now{background:var(--signal);border-color:var(--signal);color:#fff}.kr-steps>.ok{color:#2f7a55;border-color:#2f7a55}.kr-wrap{grid-template:"media head""media ctrl""media."1fr/minmax(0,1fr) minmax(0,1fr);align-items:start;column-gap:24px;display:grid}.kr-head{grid-area:head}.kr-head h4{font-size:inherit;margin:0 0 6px}.kr-head{margin-bottom:12px}.kr-head p{margin:0}.kr-media{grid-area:media}.kr-media svg{border:1px solid var(--line);background:#fff;width:100%;height:auto;display:block}.kr-svg{touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}.kr-svg:active{cursor:grabbing}.kr-ctrl{grid-area:ctrl}.kr-ctrl button{margin-top:0}.kr-turn{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;display:grid}.kr-turn button{white-space:nowrap;min-width:0;min-height:44px;padding:6px 2px;font-size:1rem}.kr-act{flex-wrap:wrap;align-items:flex-end;gap:8px;margin-top:8px;display:flex}.kr-act label{flex-direction:column;gap:4px;font-weight:600;display:flex}.kr-act input{width:7em;min-height:52px;font-size:1.1rem}.kr-fb{min-height:1.4em;margin:10px 0 0;font-weight:600}.kr-fb:empty{min-height:0;margin:0}.kr-fb.ok{color:#2f7a55}.kr-fb.bad{color:#b03a2e}.kr-hint{color:var(--muted);margin:10px 0 0;font-size:14px}.kr-choice{flex-direction:column;gap:8px;display:flex}.kr-choice button{text-align:left;justify-content:flex-start}.kr-ctrl button.kr-ny{all:unset;cursor:pointer;color:var(--muted);margin-top:12px;font-size:14px;text-decoration:underline;display:inline-block}.kr-ctrl button.kr-ny:hover{color:var(--text)}.kr-ctrl button.kr-ny:focus-visible{outline:3px solid var(--ink);outline-offset:2px}@media (max-width:760px){.kr-wrap{grid-template-rows:none;grid-template-columns:1fr;grid-template-areas:"head""media""ctrl"}.kr-media{width:100%;max-width:48svh;margin:0 auto}.kr-ctrl{margin-top:10px}}.exercise-result{color:var(--muted);margin:-8px 0 16px;font-size:13px}.review-size{color:var(--oliv-900);align-items:center;gap:8px;margin:0 0 18px;font-size:.95rem;display:flex}.review-size-label{font-weight:600}.review-size button{border:2px solid var(--ink);border-radius:var(--radie);background:var(--surface);min-width:44px;min-height:44px;color:var(--text);font-weight:700;font-family:var(--mono);cursor:pointer;padding:0 12px}.review-size button.active{background:var(--head-bg);color:#fff}.review-size button:disabled{opacity:.6;cursor:wait}.review-size{flex-wrap:wrap}.review-size-fel{color:var(--fs-red);font-weight:600}.teckenforklaring{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px 20px;margin:0;padding:0;list-style:none;display:grid}.teckenforklaring li{align-items:center;gap:12px;margin:0;display:flex}.sw{box-sizing:border-box;background:#fff;border:1px solid #afbbc7;flex:none;width:40px;height:24px;display:inline-block}.sw-brown{background:linear-gradient(#0000 7px,#8b5a2b 7px 9px,#0000 9px 15px,#8b5a2b 15px 17px,#0000 17px),#fff}.sw-green{background:#c3ddbe}.sw-white{background:#fff}.sw-blue{background:#c5ddef;border:2px solid #2f5f7a}.sw-road{background:linear-gradient(#0000 7px,#3d4249 7px 8.5px,#d2454b 8.5px 15.5px,#3d4249 15.5px 17px,#0000 17px),#fff}.sw-path{background:radial-gradient(circle,#3d4249 1.3px,#0000 1.7px) 1px/6px 6px repeat-x,#fff}.sw-minor{background:linear-gradient(#0000 10.5px,#3d4249 10.5px 13.5px,#0000 13.5px),#fff}.sw-track{background:repeating-linear-gradient(90deg,#3d4249 0 10px,#0000 10px 15px) 50%/100% 2.5px no-repeat,#fff}.sw-house{background:radial-gradient(#3d4249,#3d4249) 50%/11px 11px no-repeat,#fff}.sw-aker{background:#f6eba3}.karttecken{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px 24px;margin:0 0 18px;padding:0;list-style:none;display:grid}.karttecken li{align-items:center;gap:12px;margin:0;line-height:1.3;display:flex}.karttecken svg{background:#fff;flex:none;display:block}