/* Bussräknaren – page styles. Copied from the inline styles of lastviktsraknare.html (left unchanged there) + bus rules. */
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}body{margin:0}[hidden]{display:none!important}img{max-width:100%}
#axpanel h3{margin-bottom:10px}
.ax-ctl{display:grid;grid-template-columns:auto 1fr 1fr;gap:10px 14px;align-items:end;margin-bottom:10px}
@media (max-width:640px){.ax-ctl{grid-template-columns:1fr 1fr}.ax-bks{grid-column:1/-1}}
.ax-bks{display:flex;gap:4px}.ax-bks button{font-family:var(--f-display);font-weight:800;padding:7px 12px}
.ax-bks button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--panel)}
.ax-slide{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center;margin-bottom:6px}
.ax-slide label{grid-column:1/-1;display:flex;justify-content:space-between;gap:8px;font-size:.82rem;color:var(--muted)}
.ax-slide input[type=range]{width:100%;padding:0;accent-color:var(--accent)}
.ax-svg{display:block;width:100%;height:auto;margin:4px 0}
.ax-v{border-radius:8px;padding:9px 12px;font-size:.9rem}.ax-v .fa{display:block;margin-top:2px}
.ax-v.ok{background:var(--ok-soft);color:var(--ok)}.ax-v.lash{background:var(--warn-soft);color:var(--warn)}.ax-v.bad{background:var(--bad-soft);color:var(--bad)}
.ax-facts{list-style:none;padding:0;margin:10px 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}
.ax-facts li{background:var(--field);border:1px solid var(--line);border-radius:8px;padding:8px 10px;display:flex;flex-direction:column;gap:2px}
.ax-facts b{font-family:var(--f-display);font-size:1.15rem}.ax-facts span{font-size:.8rem;color:var(--muted)}.ax-facts .fa{display:block}
.ax-warn{background:var(--warn-soft);color:var(--warn);border-radius:6px;padding:8px 10px;font-size:.86rem}.ax-warn .fa{display:block}

.ax-ctl{grid-template-columns:auto repeat(auto-fit,minmax(150px,1fr))!important}
.ax-wide{min-width:240px}
.ax-more{margin:4px 0 10px;padding:6px 10px}.ax-more summary{font-size:.86rem}
.ax-ctl2{margin:8px 0 2px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))!important}
.ax-btns{display:flex;gap:6px;flex-wrap:wrap}
.ax-plan{background:var(--field);border:1px solid var(--line);border-radius:8px;padding:10px 14px;margin-top:10px}
.ax-plan h4{margin:0 0 6px;font-family:var(--f-display)}
.ax-plan ol{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:5px;font-size:.9rem}
.ax-plan .fa{display:block;color:var(--muted);font-size:.85rem}
.ax-plan .ax-sec{color:var(--warn)}
[hidden].f{display:none}

.ax-tools{display:flex;flex-direction:column;gap:8px;margin:6px 0}
.ax-mode{margin:0;font-size:.84rem;color:var(--accent);font-weight:600}
.ax-add{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 8px;align-items:end}
.ax-add label{grid-column:1/-1;display:flex;justify-content:space-between;gap:8px;font-size:.78rem;color:var(--muted)}
.ax-selbar{display:flex;flex-wrap:wrap;gap:6px;align-items:center;background:var(--accent-soft);border-radius:8px;padding:6px 8px;font-size:.86rem}
.ax-selbar span{flex:1 1 220px}.ax-selbar .fa{display:inline;margin-inline-start:6px}
#ax-svgwrap{touch-action:pan-y;border-radius:8px;outline-offset:2px}
#ax-svgwrap .ax-item{cursor:grab}#ax-svgwrap .ax-item.sel{cursor:grabbing}
.ax-issues{list-style:none;padding:0;margin:8px 0;display:flex;flex-direction:column;gap:4px}
.ax-issues li{border-radius:6px;padding:6px 10px;font-size:.86rem}.ax-issues li .fa{display:block}
.ax-issues li.warn{background:var(--warn-soft);color:var(--warn)}.ax-issues li.bad{background:var(--bad-soft);color:var(--bad)}
.ax-list{list-style:none!important;padding:0!important}
.ax-list li{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:4px 10px;align-items:center;padding:3px 0;border-bottom:1px solid var(--line)}
.ax-list li.sel{background:var(--accent-soft)}.ax-list li.bad{color:var(--bad)}
.ax-list li button{padding:2px 8px;font-weight:700}.ax-list .fa{display:inline!important;margin-inline-start:6px}

.ax-bkinfo{margin:0 0 8px;font-size:.88rem;background:var(--accent-soft);border-radius:6px;padding:7px 10px}
.ax-bkinfo .fa{display:block;color:var(--muted)}.ax-same{color:var(--warn)}
#cards .bk[data-bk]{cursor:pointer}
#cards .bk.on{outline:3px solid var(--accent);outline-offset:-1px}

.ax-sec2{border:2px solid var(--line);border-radius:8px;padding:10px 14px;margin-top:10px}
.ax-sec2 h4{margin:0 0 4px;font-family:var(--f-display)}.ax-sec2 .hint .fa,.ax-sec2 h4 .fa{display:block}
.sec-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px;margin:8px 0}
.sec-c{border-radius:8px;padding:8px 10px;display:flex;flex-direction:column;gap:2px;font-size:.84rem;position:relative}
.sec-c.ok{background:var(--ok-soft)}.sec-c.bad{background:var(--bad-soft)}.sec-c.lash{background:var(--warn-soft)}.sec-c.lash .sec-big{color:var(--warn)}.sec-st{font-weight:600}
.sec-c b{font-family:var(--f-display);font-size:1rem}.sec-c .fa{display:block;color:var(--muted);font-size:.8rem}
.sec-big{position:absolute;top:6px;right:10px;font-size:1.4rem;font-weight:800}.sec-c.ok .sec-big{color:var(--ok)}.sec-c.bad .sec-big{color:var(--bad)}

#axpanel{overflow-anchor:none}
#ax-svgwrap .ax-item{touch-action:none}
.ax-tools{margin-top:4px}
.ax-selbar span#ax-selname{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
#axpanel .hint .fa{display:block}


/* Layout: registreringsbevis-style form on the left, four road-class columns (BK1–BK4) on the right; reference tables below. */
:root{
  --bg:#eef1f4; --panel:#ffffff; --ink:#18212b; --muted:#5b6876; --line:#d3dae2; --field:#f6f8fa;
  --sign-yellow:#f7b500; --sign-red:#d7192a; --accent:#0b5fa5; --accent-soft:#e3eef8;
  --ok:#1f7a45; --ok-soft:#e1f2e8; --bad:#b4232c; --bad-soft:#fbe5e6; --warn-soft:#fff4d4; --warn:#8a5a00;
  --head:#dfe5eb;
  --f-display:"Archivo","Helvetica Neue",Arial,sans-serif;
  --f-body:"IBM Plex Sans","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --f-fa:"Vazirmatn",Tahoma,sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#0f151b; --panel:#17202a; --ink:#e6ecf2; --muted:#9aa8b6; --line:#2c3a48; --field:#1d2834;
  --accent:#6fb2ee; --accent-soft:#16304a; --ok:#5fcf8f; --ok-soft:#173727; --bad:#ff7b84; --bad-soft:#3d1c20;
  --warn-soft:#3a2f12; --warn:#f2c76b; --head:#223040; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0f151b; --panel:#17202a; --ink:#e6ecf2; --muted:#9aa8b6; --line:#2c3a48; --field:#1d2834;
  --accent:#6fb2ee; --accent-soft:#16304a; --ok:#5fcf8f; --ok-soft:#173727; --bad:#ff7b84; --bad-soft:#3d1c20;
  --warn-soft:#3a2f12; --warn:#f2c76b; --head:#223040; color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.5}
.wrap{max-width:1240px;margin:0 auto;padding-inline:20px;padding-block:24px 48px}
.fa{font-family:var(--f-fa);direction:rtl;unicode-bidi:isolate}
header.top{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:flex-end;justify-content:space-between;margin-bottom:20px}
h1{font-family:var(--f-display);font-weight:800;font-size:clamp(1.6rem,3.2vw,2.3rem);letter-spacing:-.01em;margin:0;text-wrap:balance}
h1 .fa{display:block;font-size:.55em;font-weight:600;color:var(--muted);margin-top:4px}
.lede{color:var(--muted);max-width:62ch;margin:6px 0 0}
.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
label.small{font-size:.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
select,input{font:inherit;color:var(--ink);background:var(--field);border:1px solid var(--line);border-radius:6px;padding:7px 9px;width:100%}
input{font-family:var(--f-mono)}
select:focus-visible,input:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
button{font:inherit;cursor:pointer;border-radius:6px;border:1px solid var(--line);background:var(--panel);color:var(--ink);padding:7px 12px}
button.primary{background:var(--accent);border-color:var(--accent);color:var(--panel);font-weight:600}
.grid{display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:20px;align-items:start}
@media (max-width:900px){.grid{grid-template-columns:minmax(0,1fr)}}
.cert{background:var(--panel);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.cert h2{margin:0;font-family:var(--f-display);font-size:.95rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;background:var(--head);padding:7px 14px;display:flex;justify-content:space-between;gap:8px}
.cert h2 .fa{text-transform:none;letter-spacing:0;font-weight:600}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px;padding:12px 14px 14px}
.fields .full{grid-column:1/-1}
.f label{display:flex;justify-content:space-between;gap:6px;font-size:.78rem;color:var(--muted);margin-bottom:3px}
.f label b{font-family:var(--f-mono);color:var(--ink);font-weight:600;margin-right:4px}
.f label .fa{font-size:.78rem}
.hint{font-size:.76rem;color:var(--muted);margin-top:3px}
.check{display:flex;gap:8px;align-items:flex-start;font-size:.86rem}
.check input{width:auto;margin-top:4px;flex:none}
.f.check label{display:block;font-size:.86rem;color:var(--ink);margin:0}
.f.check label b{font-family:var(--f-body);margin:0}
.f.check label .fa{display:block;color:var(--muted);margin-top:2px}
.results{display:flex;flex-direction:column;gap:16px;min-width:0}
.bkrow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media (max-width:640px){.bkrow{grid-template-columns:repeat(2,minmax(0,1fr))}}
.bk{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:14px;display:flex;flex-direction:column;gap:6px;min-width:0}
.bk .sign{width:52px;height:52px;border-radius:50%;background:var(--sign-yellow);border:6px solid var(--sign-red);display:grid;place-items:center;font-family:var(--f-display);font-weight:800;font-size:.9rem;color:#111}
.bk .lbl{font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.bk .num{font-family:var(--f-display);font-weight:800;font-size:clamp(1.4rem,2.6vw,2rem);font-variant-numeric:tabular-nums;line-height:1.1}
.bk .num small{font-size:.5em;font-weight:600;color:var(--muted);margin-left:3px}
.bk .gross{font-family:var(--f-mono);font-size:.8rem;color:var(--muted)}
.pill{display:inline-block;font-size:.74rem;padding:2px 8px;border-radius:99px;background:var(--accent-soft);color:var(--accent);font-weight:600;width:fit-content}
.pill.ok{background:var(--ok-soft);color:var(--ok)} .pill.bad{background:var(--bad-soft);color:var(--bad)}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:14px 16px;min-width:0}
.panel h3{margin:0 0 8px;font-family:var(--f-display);font-size:1.05rem}
.scroll{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
th,td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
th:first-child,td:first-child{text-align:left;white-space:normal}
thead th{background:var(--head);font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}
td.k{font-family:var(--f-mono);font-size:.84rem}
tr.low td{font-weight:700}
tr.final td{font-weight:800;background:var(--accent-soft)}
td.min{color:var(--accent);font-weight:700}
.note{background:var(--warn-soft);color:var(--ink);border-radius:6px;padding:10px 12px;font-size:.86rem}
.note b{color:var(--warn)}
details{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 14px}
details+details{margin-top:10px}
summary{cursor:pointer;font-family:var(--f-display);font-weight:700}
.tabs3{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:10px}
.tabs3 table th,.tabs3 table td{padding:3px 6px;font-size:.82rem}
.steps{margin:0;padding-left:20px} .steps li{margin-bottom:4px}
footer{margin-top:24px;font-size:.84rem;color:var(--muted)}
footer a{color:var(--accent)}
.section-title{font-family:var(--f-display);font-size:1.2rem;margin:8px 0 10px}
.nav{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.nav a{font-family:var(--f-display);font-weight:700;text-decoration:none;color:var(--ink);border:1px solid var(--line);background:var(--panel);border-radius:6px;padding:6px 12px}
.nav a.on{background:var(--accent);border-color:var(--accent);color:var(--panel)}
.exp-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 12px}
.exp-tabs button{font-weight:700;font-family:var(--f-display)}
.exp-tabs button[aria-selected="true"]{background:var(--accent);border-color:var(--accent);color:var(--panel)}
.exp-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;counter-reset:st}
.exp-steps li{display:grid;grid-template-columns:2.2rem minmax(0,1fr);gap:4px 10px;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--field)}
.exp-steps li::before{counter-increment:st;content:counter(st);grid-row:1/span 3;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--head);display:grid;place-items:center;font-family:var(--f-display);font-weight:800}
.exp-steps li.win{border-color:var(--accent)}
.exp-steps li.res{background:var(--accent-soft);border-color:var(--accent)}
.exp-steps h4{margin:0;font-family:var(--f-display);font-size:.95rem}
.exp-steps p{margin:0}
.exp-steps li>*{grid-column:2}
.exp-steps .src{font-size:.78rem;color:var(--muted)}
.exp-steps .calc{font-family:var(--f-mono);font-size:.86rem}
.exp-steps .fa{font-size:.9rem}
.gt-bar{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:flex-end;margin:10px 0 8px}
.gt-bar .exp-tabs{margin:0}
.gt-look{display:flex;flex-direction:column;gap:3px;font-size:.78rem;color:var(--muted);min-width:180px}
.gt-look input{width:170px}
.gt-ans{flex:1 1 260px;min-width:0;background:var(--accent-soft);border-radius:8px;padding:8px 12px;font-size:.9rem}
.gt-ans b{font-family:var(--f-display);font-size:1.1rem}
.gt-wrap{max-height:460px;overflow:auto;border:1px solid var(--line);border-radius:8px;background:var(--panel)}
.gt-wrap table th,.gt-wrap table td{padding:5px 10px;font-size:.88rem}
.gt-wrap thead th{position:sticky;top:0;z-index:1;white-space:normal;vertical-align:bottom}
.gt-wrap td.n{color:var(--muted);font-size:.75rem}
.gt-wrap td.t{font-family:var(--f-display);font-weight:700}
.gt-wrap tr.zebra td{background:var(--field)}
.gt-wrap tr.hit td{background:var(--sign-yellow);color:#111;font-weight:700}
.gt-wrap tr.hit td.n{color:#111}
.gt-wrap tr.rule td{font-style:italic}
.gt-sub{margin:14px 0 6px;font-family:var(--f-display);font-size:.95rem}
.ax-tbl td{vertical-align:middle}
.ax-tbl td:nth-child(2),.ax-tbl th:nth-child(2){text-align:left;white-space:normal;min-width:200px}
@media (max-width:640px){.ax-tbl td.pic{width:120px}.ax-tbl svg{width:115px}}
.ax-tbl td.pic{width:170px;padding:4px 8px}
.ax-tbl svg{display:block;width:160px;height:auto;color:var(--ink)}
.ax-tbl .sub{display:block;font-size:.76rem;color:var(--muted)}
.ax-tbl tr.grp td{background:var(--head);font-family:var(--f-display);font-weight:700}
.ax-tbl tr.hit td{background:var(--warn-soft)}
.ax-tbl tr.hit td:first-child{box-shadow:inset 4px 0 0 var(--sign-yellow)}
.ax-legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:.78rem;color:var(--muted);margin:6px 0}
.ax-legend i{display:inline-block;width:11px;height:11px;border-radius:50%;vertical-align:-1px;margin-right:4px}
@media (prefers-reduced-motion:no-preference){.bk .num{transition:color .2s}}

/* ---- bus ---- */
.bk .pax{font-size:.84rem;font-weight:600;margin-top:2px;color:var(--muted)}.bk .pax .fa{display:block;font-weight:400;font-size:.8rem}
#bus-svgwrap .bus-seat{cursor:pointer}#bus-svgwrap .bus-seat:focus{outline:none}#bus-svgwrap .bus-seat:focus rect{stroke:var(--accent);stroke-width:3}
#buspanel h3{margin-bottom:10px}#buspanel .hint .fa{display:block}
.vmode{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0 0 12px;padding:8px 12px;border-radius:8px;background:var(--accent-soft);font-size:.92rem}
.vmode b{font-family:var(--f-display);font-size:1.02rem}.vmode .fa{color:var(--muted)}.vmode .vm-ic{display:inline-flex;width:30px;height:22px;flex:none}
