/* Delekatalog — Norscode-designet (mørkt først, cyan → lilla → magenta). Lys/mørk via data-theme eller systemval. */
:root{color-scheme:dark;--bg:#05060d;--rail:#090a14;--panel:#0d0f1c;--soft:#141728;--line:#272b45;--text:#eef7fb;--muted:#9aa2c4;--accent:#22d3ff;--accent2:#e83dff;--accent3:#9d4edd;--grad:linear-gradient(120deg,#22d3ff,#9d4edd 52%,#e83dff);--green:#62e989;--amber:#ffd166;--red:#ff6ea1;--shadow:0 10px 30px rgba(0,0,0,.45);--ark:#fff;--hl:rgba(232,61,255,.16);--hl2:rgba(34,211,255,.12);--topp:58px}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]){color-scheme:light;--bg:#f3f4f9;--rail:#fff;--panel:#fff;--soft:#eef1f9;--line:#dbe0ee;--text:#141634;--muted:#5b6280;--accent:#0891c7;--accent2:#c026d3;--accent3:#7c3aed;--grad:linear-gradient(120deg,#0891c7,#7c3aed 52%,#c026d3);--green:#15803d;--amber:#b45309;--red:#be123c;--shadow:0 8px 22px rgba(20,22,52,.10);--hl:rgba(192,38,211,.12);--hl2:rgba(8,145,199,.10)}}
:root[data-theme="light"]{color-scheme:light;--bg:#f3f4f9;--rail:#fff;--panel:#fff;--soft:#eef1f9;--line:#dbe0ee;--text:#141634;--muted:#5b6280;--accent:#0891c7;--accent2:#c026d3;--accent3:#7c3aed;--grad:linear-gradient(120deg,#0891c7,#7c3aed 52%,#c026d3);--green:#15803d;--amber:#b45309;--red:#be123c;--shadow:0 8px 22px rgba(20,22,52,.10);--hl:rgba(192,38,211,.12);--hl2:rgba(8,145,199,.10)}
*{box-sizing:border-box;margin:0;padding:0}
html{font-size:15px;scroll-padding-top:calc(var(--topp) + 64px)}
body{background:var(--bg);color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;line-height:1.5;min-height:100vh}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
h1{font-size:1.45rem;letter-spacing:-.01em;line-height:1.25}h2{font-size:1.05rem;margin:22px 0 12px}h3{font-size:.98rem}
code,.kode{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:.86em}
.kode{color:var(--accent);font-weight:600;letter-spacing:.01em}
.mut{color:var(--muted)}.liten{font-size:.8rem}
.zh{display:none;color:var(--muted);font-size:.78rem}
body.vis-zh .zh,.zh.vis{display:block}
[hidden]{display:none!important}
.berre-lys{display:none}
:root[data-theme="light"] .berre-lys{display:inline}:root[data-theme="light"] .berre-mork{display:none}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .berre-lys{display:inline}:root:not([data-theme="dark"]) .berre-mork{display:none}}

/* Topp */
.topp{position:sticky;top:0;z-index:50;height:var(--topp);display:flex;align-items:center;gap:16px;padding:0 18px;background:var(--rail);border-bottom:1px solid var(--line)}
.merke{display:flex;align-items:center;gap:10px;color:var(--text);flex:0 0 auto}.merke:hover{text-decoration:none}
.merke img{width:32px;height:32px;border-radius:9px;box-shadow:0 0 0 1px var(--line),0 0 14px rgba(34,211,255,.25)}
.merke b{display:block;font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1.1}
.merke small{display:block;color:var(--muted);font-size:.7rem}
.toppsok{position:relative;flex:1;max-width:620px}
.toppsok input{width:100%;padding:8px 40px 8px 14px;background:var(--soft);border:1px solid var(--line);border-radius:10px;color:var(--text);font:inherit}
.toppsok input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--hl2)}
.toppsok kbd{position:absolute;right:10px;top:50%;transform:translateY(-50%);font:600 .72rem ui-monospace,monospace;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:1px 6px;pointer-events:none}
.forslag{position:absolute;left:0;right:0;top:calc(100% + 6px);background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);overflow:hidden;max-height:70vh;overflow-y:auto}
.forslag a{display:grid;grid-template-columns:150px 1fr auto;gap:10px;align-items:baseline;padding:9px 14px;color:var(--text);border-bottom:1px solid var(--line)}
.forslag a:hover,.forslag a.valt{background:var(--soft);text-decoration:none}
.forslag a code{color:var(--accent);font-weight:600;overflow:hidden;text-overflow:ellipsis}
.forslag a em{font-style:normal;color:var(--muted);font-size:.76rem}
.forslag a.alle{display:block;color:var(--accent);font-weight:600}
.forslag-tom{padding:12px 14px;color:var(--muted);font-size:.88rem}
.verktoy{display:flex;gap:8px;margin-left:auto;flex:0 0 auto}

/* Knappar */
.knapp{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:10px;border:1px solid var(--line);background:var(--soft);color:var(--text);font:inherit;font-weight:600;font-size:.88rem;cursor:pointer;white-space:nowrap}
.knapp:hover{border-color:var(--accent);text-decoration:none}
.knapp.pri{background:var(--grad);color:#04121a;border:0}
.knapp.fare:hover{border-color:var(--red);color:var(--red)}
.knapp.spak{font-size:.85rem}.knapp.ikon{padding:8px 11px;font-size:1rem;line-height:1}
.knapp.aktiv{border-color:var(--accent);color:var(--accent);background:var(--hl2)}
.merkelapp{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--grad);color:#04121a;font-size:.72rem;font-weight:800}
.dunk{animation:dunk .5s}
@keyframes dunk{30%{transform:scale(1.12)}}

/* Ramme */
main{max-width:1240px;margin:0 auto;padding:18px 20px 40px}
main.smal{max-width:1040px}
main.katalog{max-width:1320px}
main.breidd{max-width:none;padding:10px 14px 0}
.fot{color:var(--muted);font-size:.78rem;text-align:center;padding:26px 16px}
main.breidd~.fot{display:none}
.smule{display:flex;flex-wrap:wrap;gap:7px;align-items:center;font-size:.82rem;color:var(--muted);margin-bottom:12px}
.smule span{opacity:.6}
.tom{text-align:center;color:var(--muted);padding:40px 16px}
.tom p+p{margin-top:8px}
.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

/* Forside */
.helt{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;padding:18px 0 14px;flex-wrap:wrap}
.helt h1{font-size:1.9rem;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.helt p{color:var(--muted);max-width:560px;margin-top:4px}
.nokkeltal{display:flex;gap:0;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.nokkeltal div{padding:10px 18px;border-left:1px solid var(--line);min-width:110px}
.nokkeltal div:first-child{border-left:0}
.nokkeltal b{display:block;font-size:1.25rem;letter-spacing:-.02em;line-height:1.2}
.nokkeltal span{color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.05em}
.filterlinje{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:14px 0}
.filterlinje.klebrig{position:sticky;top:var(--topp);z-index:10;background:var(--bg);padding:10px 0;margin:0 0 6px}
.filterlinje input{flex:1;min-width:240px;max-width:460px;padding:9px 12px;background:var(--soft);border:1px solid var(--line);border-radius:10px;color:var(--text);font:inherit}
.filterlinje input:focus{outline:none;border-color:var(--accent)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{padding:5px 11px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--text);font:inherit;font-size:.8rem;font-weight:600;cursor:pointer}
.chip:hover{border-color:var(--accent)}.chip.aktiv{background:var(--grad);color:#04121a;border-color:transparent}
.modellblokk{margin-top:18px}
.modellblokk h2{display:flex;align-items:center;gap:10px;margin:0 0 8px}
.modell{display:inline-block;font:700 .74rem ui-monospace,monospace;padding:2px 8px;border-radius:6px;background:var(--hl2);color:var(--accent)}
.modell.stor{font-size:.85rem}
.kontrakt{color:var(--muted);font:600 .8rem ui-monospace,monospace}
table.kataloger{table-layout:fixed}
table.kataloger th:first-child{width:120px}table.kataloger th.num{width:88px}
table.kataloger td.namn a{color:var(--text);font-weight:600}
table.kataloger td.typekode{font-family:ui-monospace,monospace;font-size:.8rem}
tr[data-href]{cursor:pointer}
tr[data-href]:hover{background:var(--hl2)}
.merke-gul{color:var(--amber)}

/* Katalogside */
.katalogtopp{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;padding-bottom:14px;border-bottom:1px solid var(--line);margin-bottom:4px}
.katalogtopp h1{margin:6px 0 4px;font-size:1.6rem}
.fakta-linje{color:var(--muted);font-size:.88rem}
.fakta-linje i{font-style:normal;margin:0 8px;opacity:.5}
.bussok{display:flex;gap:8px;min-width:320px;flex:0 1 420px}
.bussok input{flex:1;padding:9px 12px;background:var(--soft);border:1px solid var(--line);border-radius:10px;color:var(--text);font:inherit}
.katalogoppsett{display:grid;grid-template-columns:250px minmax(0,1fr);gap:22px;align-items:start}
.kapnav{position:sticky;top:calc(var(--topp) + 12px);display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - var(--topp) - 24px);overflow:auto}
.kapnav nav{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:8px}
.kapnav nav>b{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:6px 10px 8px}
.kapnav nav a{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:6px 10px;border-radius:8px;color:var(--text);font-size:.82rem;line-height:1.25}
.kapnav nav a:hover{background:var(--soft);text-decoration:none}
.kapnav nav a.aktiv{background:var(--hl2);font-weight:700}
.kapnav nav a small{color:var(--muted)}
.kapnav .boks{padding:10px 12px}
.kapnav .boks summary{font-size:.85rem}
.kapnr{font:700 .74rem ui-monospace,monospace;color:#04121a;background:var(--grad);border-radius:6px;padding:1px 6px}
.grupper{min-width:0}
.kapittel{margin-top:14px}
.kapittel h2{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:14px 0 8px}
.kapittel h2 .zh{display:inline}
body:not(.vis-zh) .kapittel h2 .zh{display:none}
.grupperader{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.grupperad{display:grid;grid-template-columns:104px minmax(0,1fr) auto auto 20px;align-items:center;gap:16px;padding:8px 14px 8px 8px;color:var(--text);border-top:1px solid var(--line);transition:background .12s}
.grupperad:first-child{border-top:0}
.grupperad:hover{background:var(--soft);text-decoration:none}
.thumb{display:grid;place-items:center;width:104px;height:66px;background:var(--ark);border:1px solid var(--line);border-radius:8px;overflow:hidden;color:#999}
.thumb img{width:100%;height:100%;object-fit:contain;padding:3px}
.gruppetekst{display:flex;flex-direction:column;gap:1px;min-width:0}
.gruppetekst b{font-size:.92rem;line-height:1.3}
.gruppetal{display:flex;flex-direction:column;align-items:flex-end;min-width:56px;line-height:1.15}
.gruppetal b{font-size:.95rem;font-variant-numeric:tabular-nums}
.gruppetal small{color:var(--muted);font-size:.7rem;text-transform:uppercase;letter-spacing:.04em}
.pil{color:var(--muted);font-size:1.3rem;text-align:right}
.boks{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 16px}
.boks summary{cursor:pointer;font-weight:700}
.boks[open] summary{margin-bottom:8px}
.enkel{width:100%;border-collapse:collapse;font-size:.84rem}
.enkel td{padding:6px 2px;border-top:1px solid var(--line);vertical-align:top}
.enkel td small{display:block}
.vinliste{list-style:none;display:flex;flex-direction:column;gap:3px;max-height:260px;overflow:auto;font-size:.8rem}
.varsel{background:rgba(255,209,102,.1);border:1px solid var(--amber);color:var(--amber);border-radius:10px;padding:9px 12px;font-size:.86rem;margin:10px 0}

/* Gruppeside: innhald | teikning | deleliste */
.gruppeoppsett{display:grid;grid-template-columns:230px minmax(0,1.5fr) minmax(360px,1fr);gap:12px;height:calc(100vh - var(--topp) - 46px)}
.gruppeoppsett>*{min-height:0}
.innhald{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.innhald-topp{display:flex;flex-direction:column;gap:8px;padding:10px;border-bottom:1px solid var(--line)}
.innhald-topp input,.listehovud input{width:100%;padding:7px 10px;background:var(--soft);border:1px solid var(--line);border-radius:8px;color:var(--text);font:inherit;font-size:.85rem}
.navtre{overflow:auto;padding:6px 6px 14px;flex:1}
.navkap{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:12px 8px 4px}
.navtre a{display:block;padding:5px 8px;border-radius:7px;color:var(--text);font-size:.82rem;line-height:1.3}
.navtre a .kode{display:block;font-size:.72rem}
.navtre a:hover{background:var(--soft);text-decoration:none}
.navtre a.aktiv{background:var(--hl2);box-shadow:inset 3px 0 var(--accent);font-weight:700}
.teikning{display:flex;flex-direction:column;gap:8px}
.gruppehovud{display:flex;align-items:center;justify-content:space-between;gap:12px}
.gruppetittel{flex:1;min-width:0}
.gruppehovud h1{font-size:1.2rem}
.blaing{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.blaing .knapp{padding:6px 12px;font-size:1.1rem}
.innhaldsknapp{display:none}
.visar{position:relative;flex:1;min-height:260px;background:var(--ark);border:1px solid var(--line);border-radius:14px;overflow:hidden;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;outline:none}
.visar:focus-visible{box-shadow:0 0 0 3px var(--hl2)}
.visar.drar{cursor:grabbing}
.visar:fullscreen{border-radius:0;border:0}
.visar.pseudofull{position:fixed;inset:0;z-index:100;border-radius:0}
.flate{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
.flate.anim{transition:transform .28s cubic-bezier(.2,.7,.2,1)}
.flate img{display:block;width:100%;height:100%;pointer-events:none}
.pkt{position:absolute;margin:0;padding:0;border:0;background:transparent;border-radius:6px;cursor:pointer;transform:scale(1.5);transform-origin:center;outline:calc(1.5px / var(--skala,1)) solid transparent;transition:background .12s,outline-color .12s}
.pkt:hover,.pkt.hover{background:rgba(34,211,255,.22);outline-color:#0891c7}
.pkt.aktiv{background:rgba(232,61,255,.28);outline:calc(2.5px / var(--skala,1)) solid #c026d3;animation:puls 1.4s ease-out infinite}
@keyframes puls{0%{box-shadow:0 0 0 0 rgba(232,61,255,.55)}100%{box-shadow:0 0 0 calc(14px / var(--skala,1)) rgba(232,61,255,0)}}
.zoomknappar{position:absolute;right:10px;top:10px;display:flex;flex-direction:column;gap:4px;z-index:3}
.zoomknappar button{width:34px;height:34px;border-radius:9px;border:1px solid #d4d8e8;background:rgba(255,255,255,.94);color:#141634;font-size:1.05rem;font-weight:700;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.zoomknappar button:hover{border-color:#0891c7;color:#0891c7}
.pkt-info{position:absolute;z-index:4;width:300px;max-width:calc(100% - 16px);background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:8px 10px 10px;cursor:default}
.pkt-info-topp{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}
.pkt-info .lukk{border:0;background:none;color:var(--muted);font-size:1.2rem;cursor:pointer;line-height:1}
.pkt-rad{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:5px 0;border-top:1px solid var(--line)}
.pkt-rad div{display:flex;flex-direction:column;min-width:0}
.pkt-rad code{color:var(--accent);font-weight:600}
.pkt-rad span{font-size:.84rem}
.bileteval{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
.bileteknapp{flex:0 0 auto;width:86px;height:62px;border:2px solid var(--line);border-radius:9px;background:var(--ark);padding:3px;cursor:pointer}
.bileteknapp img{width:100%;height:100%;object-fit:contain}
.bileteknapp.aktiv{border-color:var(--accent2)}
.hjelp{padding:0 2px 8px}
.deleliste{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.listehovud{display:flex;align-items:center;gap:12px;padding:10px 12px;border-bottom:1px solid var(--line)}
.listehovud b{flex:0 0 auto}
.deleliste .tabellboks{flex:1;overflow:auto;border:0;border-radius:0}

/* Tabellar */
.tabellboks{overflow:auto;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
table.deler{width:100%;border-collapse:collapse;font-size:.86rem}
table.deler th{position:sticky;top:0;z-index:1;background:var(--panel);text-align:left;color:var(--muted);font-weight:600;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;padding:9px 10px;border-bottom:1px solid var(--line)}
table.deler td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
table.deler tbody tr:last-child td{border-bottom:0}
table.deler td small{display:block;color:var(--muted);font-size:.76rem}
table.deler td small.zh{display:none}
body.vis-zh table.deler td small.zh{display:block}
table.deler .spes{font-family:ui-monospace,monospace}
table.deler .merknad{color:var(--amber)}
.num{text-align:right!important;font-variant-numeric:tabular-nums}
#deler tbody tr{cursor:pointer;transition:background .1s}
#deler tbody tr:hover,#deler tbody tr.hover{background:var(--hl2)}
#deler tbody tr.aktiv{background:var(--hl);box-shadow:inset 3px 0 var(--accent2)}
#deler td.pos{font-weight:700;color:var(--muted)}
#deler tr.har-pkt td.pos{color:var(--accent2)}
#deler tr.har-pkt td.pos::after{content:"◉";font-size:.6rem;margin-left:3px;vertical-align:middle}
/* Innlogging */
main.innlogging{min-height:100vh;display:grid;place-items:center;padding:20px}
.innloggingsboks{width:100%;max-width:360px;display:flex;flex-direction:column;gap:14px;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px 24px;box-shadow:var(--shadow)}
.innloggingsboks .merke{margin-bottom:6px}
.innloggingsboks label{display:flex;flex-direction:column;gap:6px;font-size:.85rem;color:var(--muted)}
.innloggingsboks input{padding:10px 12px;background:var(--soft);border:1px solid var(--line);border-radius:10px;color:var(--text);font:inherit}
.innloggingsboks input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--hl2)}
.innloggingsboks .knapp{justify-content:center;padding:11px}
.innloggingsboks .varsel{margin:0}

/* Lagerstatus frå Eurobus Nordic */
.lager{display:inline-block;white-space:nowrap;font-size:.72rem;font-weight:700;padding:2px 7px;border-radius:999px;border:1px solid transparent;text-decoration:none!important}
.lager-paa{color:var(--green);background:rgba(98,233,137,.12);border-color:rgba(98,233,137,.35)}
.lager-fjern{color:var(--accent);background:var(--hl2);border-color:rgba(34,211,255,.35)}
.lager-best{color:var(--amber);background:rgba(255,209,102,.1);border-color:rgba(255,209,102,.35)}
.lager-ukjend{color:var(--muted);font-weight:600;border-color:var(--line)}
.lager:hover{filter:brightness(1.15)}
.lager.stor{font-size:.85rem;padding:5px 12px}
td.lagercelle{white-space:nowrap}
#deler th,#deler td{padding-left:6px;padding-right:6px}
#deler .lager{font-size:.68rem;padding:2px 6px}
.butikk{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:12px;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px 18px}
.butikk>div:first-child{display:flex;flex-direction:column;gap:2px}
.butikk-hoyre{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
@media(max-width:860px){#deler th:nth-child(5),#deler td.lagercelle{display:none}}
.leggtil{width:28px;height:28px;border-radius:8px;border:1px solid var(--line);background:var(--soft);color:var(--text);font-size:1rem;font-weight:700;cursor:pointer;flex:0 0 auto}
.leggtil:hover{background:var(--grad);color:#04121a;border-color:transparent}

/* Delside */
.delhovud{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;flex-wrap:wrap;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 20px}
.kode.stor{font-size:1.05rem}
.delhovud h1{margin-top:4px}
.delhandling{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.antal{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:.85rem}
.antal input,.antalfelt{width:72px;padding:7px 8px;background:var(--soft);border:1px solid var(--line);border-radius:8px;color:var(--text);font:inherit;text-align:right}

/* Bestillingsliste */
.listetopp{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.knapperad{display:flex;flex-wrap:wrap;gap:8px}
.listetabell tfoot td{padding:10px 8px;color:var(--muted)}
.kjelder{font-size:.78rem}
.fjern{border:0;background:none;color:var(--muted);font-size:1.3rem;cursor:pointer;line-height:1}
.fjern:hover{color:var(--red)}

/* Melding */
.melding{position:fixed;left:50%;bottom:22px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--panel);border:1px solid var(--accent);color:var(--text);padding:10px 16px;border-radius:12px;box-shadow:var(--shadow);font-size:.9rem;font-weight:600;transition:.2s;z-index:200}
.melding.vis{opacity:1;transform:translate(-50%,0)}

/* Mellomstore skjermar */
@media (max-width:1280px){
  .gruppeoppsett{grid-template-columns:minmax(0,1.3fr) minmax(330px,1fr)}
  .innhald{position:fixed;left:0;top:var(--topp);bottom:0;width:300px;z-index:60;border-radius:0 14px 14px 0;transform:translateX(-105%);transition:transform .2s;box-shadow:var(--shadow)}
  body.vis-innhald .innhald{transform:none}
  .innhaldsknapp{display:inline-flex}
}
@media (max-width:980px){
  .katalogoppsett{grid-template-columns:1fr}
  .kapnav{position:static;max-height:none}
  .kapnav nav{display:flex;flex-wrap:wrap;gap:4px}
  .kapnav nav>b{width:100%}
  .kapnav nav a{display:inline-flex;gap:6px;padding:4px 9px;border:1px solid var(--line);border-radius:999px}
  .kapnav nav a small{display:none}
}
/* Mobil */
@media (max-width:860px){
  .topp{gap:10px;padding:0 12px}
  .merke span,.toppsok kbd,#vis-zh{display:none}
  .verktoy .knapp:not(.ikon){padding:8px 10px;font-size:0}
  .verktoy .knapp .merkelapp{font-size:.72rem}
  .verktoy a.knapp::before{content:"🧾";font-size:1rem}
  main{padding:14px 14px 30px}
  main.breidd{padding:10px 12px 20px}
  .helt{padding-top:8px}
  .nokkeltal{width:100%;display:grid;grid-template-columns:repeat(2,1fr)}
  .nokkeltal div{border-left:0;border-top:1px solid var(--line)}
  .nokkeltal div:nth-child(-n+2){border-top:0}
  .nokkeltal div:nth-child(even){border-left:1px solid var(--line)}
  table.kataloger td.typekode,table.kataloger th:nth-child(3){display:none}
  .grupperad{grid-template-columns:80px minmax(0,1fr) auto 14px;gap:10px}
  .thumb{width:80px;height:54px}
  .grupperad .gruppetal+.gruppetal{display:none}
  .gruppeoppsett{display:flex;flex-direction:column;height:auto}
  .visar{height:62vh;flex:none}
  .deleliste .tabellboks{overflow:visible}
  .forslag a{grid-template-columns:1fr;gap:2px}
  .gruppehovud{flex-wrap:wrap}
  .hjelp{display:none}
  .bussok{min-width:0;width:100%}
}
@media print{
  .topp,.fot,.smule,.knapperad,.fjern,.melding{display:none!important}
  body{background:#fff;color:#000}
  .tabellboks{border:0}
  .antalfelt{border:0;background:none}
  a{color:#000}
}