/* .309 · Klikkspråket (Antonin: «hva som kan klikkes på og ikke er ikke intuitivt»). Én regel på tvers av fanene:
   1) HANDLING  = har ramme eller fylt flate + hånd-markør + reagerer på hover/trykk.
   2) MERKELAPP = flat, fylt bakgrunn, INGEN ramme, vanlig markør — ser aldri ut som en knapp.
   3) LÅST      = blek (40 %) + «ikke tillatt»-markør, ingen hover.
   Lastes sist, så den vinner over enkeltfilene uten å røre dem. */

/* 1 · Handlinger */
button:not(:disabled), select:not(:disabled), [role=button]:not([aria-disabled=true]), .chip, span.mini, label[for] input[type=checkbox] { cursor: pointer; }
button:not(:disabled):hover, [role=button]:not([aria-disabled=true]):hover { box-shadow: inset 0 0 0 999px rgba(46, 58, 34, .07); }
button:not(:disabled):active { transform: translateY(1px); }
select:not(:disabled):hover { border-color: var(--forest); }
button:focus-visible, select:focus-visible, input:focus-visible, .chip:focus-visible, span.mini:focus-visible { outline: 2px solid var(--olive); outline-offset: 1px; }

/* Tekstknapper som så ut som etiketter (+ nytt · lagre · lagre privat · standard, Nullstill · Alt til 0,
   Velg alle · Ingen, × lukk) får en lett ramme så de leses som knapper. */
#secAlloc .crumb .cbtn, #secAlloc .crumb #nyPlanBtn, #secEDA .oppcrumb .cbtn,
#secAlloc .conhead button:not(.tgl), :is(#secAlloc, #secDaily) .advhead .mini,
.edaScope .evall .mini, .edaScope .evgrp .mini {
  border: 1px solid var(--line); border-radius: 3px; padding: 2px 7px; background: var(--white); text-decoration: none;
}
#secAlloc .crumb .cbtn:not(:disabled):hover, #secAlloc .crumb #nyPlanBtn:hover, #secEDA .oppcrumb .cbtn:not(:disabled):hover,
#secAlloc .conhead button:not(.tgl):hover, :is(#secAlloc, #secDaily) .advhead .mini:hover,
.edaScope .evall .mini:hover, .edaScope .evgrp .mini:hover { border-color: var(--forest); }
#secAlloc .crumb .cbtn, #secEDA .oppcrumb .cbtn { margin-left: 4px; padding: 1px 5px; }
#secAlloc .crumb .cvelg, #secEDA .oppcrumb .cvelg { border: 1px solid var(--line); border-radius: 3px; padding: 1px 5px; margin-left: 4px; background: var(--white); }
#secAlloc .advopen { border: 1px solid var(--line); border-radius: 3px; background: var(--white); padding: 5px 10px; }
#secAlloc .advopen:hover { border-color: var(--forest); }

/* 2 · Merkelapper (status, ikke handling): ingen ramme */
#secAlloc .flag, #secAlloc .tag, .edaScope .evtag, #secDaily .flag { border-color: transparent !important; cursor: inherit; }
#secAlloc .tag { background: var(--line-soft); }
.edaScope .evtag { background: var(--line-soft); }
#secAlloc .pill { border: 0; background: var(--line-soft); color: var(--muted); border-radius: 2px; }
#secAlloc .flag[title], #secAlloc .pill[title], .edaScope .evtag[title] { cursor: help; }
#secAlloc button .flag[title] { cursor: inherit; }
#secAlloc .mm, #secAlloc #mmmChips .mmchip, #secAlloc #reachChips .mmchip { cursor: default; }

/* 3 · Låst / ikke tilgjengelig */
button:disabled, select:disabled, input:disabled, [aria-disabled=true] { opacity: .4; cursor: not-allowed !important; box-shadow: none !important; transform: none !important; }
input[readonly] { cursor: not-allowed; background: var(--line-soft) !important; }

/* 4 · «Beregner …» (.310) — animert med transform, så den glir også mens siden er blokkert av tunge beregninger */
#travel { position: fixed; inset: 0 0 auto 0; z-index: 10000; pointer-events: none; }
#travel .travel-bar { height: 3px; background: rgba(46, 58, 34, .15); overflow: hidden; }
#travel .travel-bar i { display: block; width: 35%; height: 100%; background: var(--forest); will-change: transform; animation: travel 1.1s cubic-bezier(.4, 0, .2, 1) infinite; }
#travel .travel-lbl { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 7px; background: var(--forest); color: #fff; font-family: var(--mono); font-size: 11px; letter-spacing: .04em; padding: 5px 12px; border-radius: 999px; box-shadow: 0 2px 8px rgba(22, 24, 15, .2); }
#travel .travel-spin { width: 10px; height: 10px; border: 2px solid rgba(255, 255, 255, .35); border-top-color: #fff; border-radius: 50%; will-change: transform; animation: travelspin .8s linear infinite; }
html.travler, html.travler * { cursor: progress !important; }
@keyframes travel { from { transform: translateX(-100%); } to { transform: translateX(290%); } }
@keyframes travelspin { to { transform: rotate(360deg); } }
/* velkomstlastingen: bjelken får et glidende skjær så den ser levende ut også når prosenten står i et tungt steg */
#startScreen .cl-progress:not(.feil) .cl-bar { position: relative; }
#startScreen .cl-progress:not(.feil) .cl-bar::after { content: ''; position: absolute; inset: 0; width: 30%; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent); will-change: transform; animation: travel 1.3s ease-in-out infinite; }
#startScreen .cl-progress .ikon .spin { display: inline-block; width: 11px; height: 11px; border: 2px solid var(--line); border-top-color: var(--forest); border-radius: 50%; vertical-align: -1px; will-change: transform; animation: travelspin .8s linear infinite; }
@media (prefers-reduced-motion: reduce) { #travel .travel-bar i { animation-duration: 2.4s; } }

/* 5 · Små skjermer (.311) — «kompakt» settes av src/kompakt.js under 1536 px.
   Assistenten blir en 34 px stripe med «◂ Cortex»; åpnet ligger den som panel over innholdet. */
.chatrail { display: none; }
html.chatstripe .chatrail { display: block; font-family: var(--mono); font-size: 10px; letter-spacing: .08em; color: var(--forest); background: var(--white); border: 0; border-bottom: 1px solid var(--line); padding: 12px 8px; cursor: pointer; text-align: center; }
html.chatstripe:not(.chat-open) .chatrail { writing-mode: vertical-rl; transform: rotate(180deg); border: 0; }
html.chatstripe #secAlloc .wrap { grid-template-columns: 308px minmax(0, 1fr) 34px; }   /* .314: assistenten er en stripe på alle skjermer (Antonin: «colaps the chat window on open») */
html.kompakt #secAlloc .wrap { grid-template-columns: 280px minmax(0, 1fr) 34px; }
html.chatstripe #secPlan, html.chatstripe #secProd, html.chatstripe #secEDA .edawrap { grid-template-columns: minmax(0, 1fr) 34px; }
html.chatstripe :is(#secAlloc, #secPlan, #secProd, #secEDA) aside.agent { display: flex; }
html.chatstripe:not(.chat-open) :is(#secAlloc, #secPlan, #secProd, #secEDA) aside.agent > :not(.chatrail) { display: none !important; }
html.chatstripe.chat-open :is(#secAlloc, #secPlan, #secProd, #secEDA) aside.agent {
  position: fixed; top: 56px; right: 0; bottom: 0; width: min(400px, 92vw); height: auto; z-index: 900;
  box-shadow: -8px 0 24px rgba(22, 24, 15, .18); overflow: auto;
}
html.kompakt #secDaily { --advcol: 360px; }
/* topplinjen: pilot-teksten og byggnummeret viker; fanene tettere og på én linje */
html.kompakt div.topbar { gap: 10px; padding: 0 14px; }
html.kompakt div.topbar > .crumb:not(#buildStamp) { display: none; }
html.kompakt .tabbtn { padding: 6px 8px; font-size: .8rem; }
@media (max-width: 1366px) {
  html.kompakt #buildStamp { display: none; }
  html.kompakt #secAlloc .wrap { grid-template-columns: 264px minmax(0, 1fr) 34px; }
}

/* fane 6: Enkel/Avansert-knappene var ustilte (nettleserknapper) */
#secDaily .dseg { display: inline-flex; border: 1px solid var(--line); border-radius: 2px; overflow: hidden; background: var(--white); vertical-align: middle; }
#secDaily .dseg button { background: none; border: 0; padding: 5px 12px; font-family: var(--mono); font-size: 11px; color: var(--muted); cursor: pointer; }
#secDaily .dseg button.on { background: var(--forest); color: #fff; font-weight: 600; }

/* .311: «Neste»-linjen rett under resultatet — erstatter knapperaden som lå under chatten */
#secAlloc .nextbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 12px 26px; border-bottom: 1px solid var(--line); background: var(--white); }
#secAlloc .nextbar .nexttxt { font-size: 12px; color: var(--muted); min-width: 0; flex: 1 1 260px; }
#secAlloc .nextbar .btn { flex: 0 0 auto; }

/* fane 4: verktøyknappene og navnefeltet var nettleserens standardknapper */
#secPlan .plantools, #secPlan #planSaveRow { align-items: center; }
#secPlan button.seg { border: 1px solid var(--line); border-radius: 3px; background: var(--white); color: var(--ink); font-family: var(--ui); font-size: 12px; font-weight: 500; }
#secPlan button.seg:not(:disabled):hover { border-color: var(--forest); }
#secPlan #planPub { background: var(--forest); border-color: var(--forest); color: #fff; font-weight: 600; }
#secPlan #planSaveName { border: 1px solid var(--line); border-radius: 3px; padding: 7px 10px; font-family: var(--ui); font-size: 12px; background: var(--white); min-width: 0; flex: 1 1 auto; }
#secPlan #planSaveName:focus { border-color: var(--forest); outline: none; }

/* .312 · Enkel / Avansert i fane 3 */
#secAlloc.enkel .kunavansert { display: none !important; }
#secAlloc .visw button.on { background: var(--forest); color: #fff; }
#secAlloc .advibruk { font-size: 10.5px; line-height: 1.5; color: var(--clay); background: rgba(138, 75, 42, .08); border-radius: 3px; padding: 7px 9px; margin-bottom: 14px; }
#secAlloc .advibruk .mini { margin-left: 4px; border: 1px solid var(--clay); color: var(--clay); background: var(--white); border-radius: 3px; padding: 1px 6px; font-size: 10px; }

/* .313 · Stegstripe og Lagre-meny i fane 3 */
.skjult { display: none !important; }
#secAlloc .allocsteg { display: flex; align-items: stretch; gap: 6px; flex-wrap: wrap; padding: 12px 26px; border-bottom: 1px solid var(--line); background: var(--paper); }
#secAlloc .allocsteg .pil { align-self: center; color: var(--olive-soft); font-size: 12px; }
#secAlloc .allocsteg .steg { display: flex; align-items: center; gap: 8px; text-align: left; border: 1px solid var(--line); border-radius: 4px; background: var(--white); padding: 6px 10px; min-width: 0; flex: 1 1 140px; }
#secAlloc .allocsteg .steg .nr { flex: 0 0 auto; width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-size: 10.5px; font-weight: 700; background: var(--line-soft); color: var(--muted); }
#secAlloc .allocsteg .steg .tx { display: flex; flex-direction: column; min-width: 0; }
#secAlloc .allocsteg .steg b { font-size: 11.5px; font-weight: 600; color: var(--ink); }
#secAlloc .allocsteg .steg small { font-size: 10px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#secAlloc .allocsteg .steg.ok .nr { background: var(--forest); color: #fff; }
#secAlloc .allocsteg .steg.neste { border-color: var(--forest); box-shadow: 0 0 0 1px var(--forest); }
#secAlloc .allocsteg .steg.neste .nr { background: var(--olive); color: #fff; }
#secAlloc .blink { animation: stegblink 1.2s ease-out; }
@keyframes stegblink { 0% { box-shadow: 0 0 0 3px rgba(138, 128, 70, .55); } 100% { box-shadow: 0 0 0 0 rgba(138, 128, 70, 0); } }
#secAlloc .scencrumb { position: relative; }
#secAlloc .crumb .lagremeny { background: var(--forest) !important; color: #fff !important; border-color: var(--forest) !important; font-weight: 600; }
#secAlloc .menypop { position: absolute; top: calc(100% + 6px); left: 0; z-index: 950; width: 340px; background: var(--white); border: 1px solid var(--line); border-radius: 4px; box-shadow: 0 8px 24px rgba(22, 24, 15, .16); padding: 6px; text-transform: none; letter-spacing: 0; }
#secAlloc .menypop button { display: flex; flex-direction: column; gap: 2px; width: 100%; text-align: left; background: none; border: 0; border-radius: 3px; padding: 8px 10px; font-family: var(--ui); }
#secAlloc .menypop button b { font-size: 12.5px; font-weight: 600; color: var(--ink); }
#secAlloc .menypop button small { font-size: 11px; line-height: 1.4; color: var(--muted); }
#secAlloc .menypop hr { border: 0; border-top: 1px solid var(--line-soft); margin: 4px 6px; }
#secAlloc .menyhint { position: absolute; top: calc(100% + 6px); left: 0; z-index: 951; background: var(--clay); color: #fff; font-size: 11px; padding: 6px 10px; border-radius: 3px; white-space: nowrap; text-transform: none; letter-spacing: 0; }

/* .314 · Klikkspråket, runde 2 (Antonin: «too many highlighters looking like buttons that are not clickable» · «use best
   practices for buttons we actually want users to click»). Regelen er nå strengere enn i .309:
   KNAPP     = setningsstil (ikke VERSALER), ≥ 12 px tekst, ≥ 28 px høy, hvit flate + ramme, hånd + hover. Valgt = mørk fylt.
   BRYTER    = av/på vises som en bryter (spor + knott), aldri som en knapp eller en avkrysning.
   MERKELAPP = bare tekst med en liten farget prikk — ingen flate, ingen ramme, aldri versaler. Vises bare for AVVIK.
   Grafer    = én tynn fordelingsstripe; ingenting som ser ut som en glidebryter uten å være det. */


/* merkelapper */
#secAlloc .flag, #secAlloc .tag, #secDaily .flag, .edaScope .evtag {
  background: none !important; border: 0 !important; padding: 0 !important; border-radius: 0; margin-left: 8px;
  font-family: var(--ui); font-size: 11px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--muted);
  display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; vertical-align: baseline;
}
#secAlloc .flag::before, #secAlloc .tag::before, #secDaily .flag::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--olive-soft); flex: 0 0 auto; }
#secAlloc .flag-inh, #secAlloc .flag-hist { color: var(--clay) !important; } #secAlloc .flag-inh::before, #secAlloc .flag-hist::before { background: var(--clay); }
#secAlloc .flag-none, #secAlloc .flag-weak { color: #8A2A2A !important; } #secAlloc .flag-none::before, #secAlloc .flag-weak::before { background: #8A2A2A; }
#secAlloc .flag-wgt, #secAlloc .flag-cpm { color: var(--forest) !important; } #secAlloc .flag-wgt::before, #secAlloc .flag-cpm::before { background: var(--forest); }
#secAlloc .tag.max { color: var(--clay); } #secAlloc .tag.max::before { background: var(--clay); }
.edaScope .evtag { margin-left: 0; color: var(--muted); }

/* knapper — tekstknappene i topplinjer, rammehoder og skuffer */
:is(#secAlloc, #secEDA) .crumb .cbtn, :is(#secAlloc, #secEDA) .crumb .cvelg, #secEDA .oppcrumb .cbtn,
#secAlloc .conhead button:not(.tgl), :is(#secAlloc, #secDaily) .advhead .mini, #secAlloc #advClose {
  font-family: var(--ui) !important; font-size: 12px !important; font-weight: 500; letter-spacing: 0 !important; text-transform: none !important;
  color: var(--ink) !important; background: var(--white) !important; border: 1px solid var(--line) !important; border-radius: 5px !important;
  min-height: 28px; padding: 3px 11px !important; margin-left: 6px; display: inline-flex; align-items: center; gap: 4px; max-width: none; line-height: 1.2;
}
:is(#secAlloc, #secEDA) .crumb .cbtn:not(:disabled):hover, :is(#secAlloc, #secEDA) .crumb .cvelg:hover, #secAlloc .conhead button:not(.tgl):hover,
:is(#secAlloc, #secDaily) .advhead .mini:hover { border-color: var(--forest) !important; }
#secAlloc .crumb .lagremeny { background: var(--white) !important; color: var(--ink) !important; border-color: var(--line) !important; }
#secAlloc .conhead { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; } #secAlloc .conhead button:not(.tgl) { margin-left: 0; }

/* Spenn · Fast · Ute: én segmentert kontroll over hele bredden */
#secAlloc .con-t { flex-wrap: wrap; row-gap: 8px; }
#secAlloc .con-n { font-size: 13px; }
#secAlloc .con-mode { flex: 1 0 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: var(--white); }
#secAlloc .con-mode button { font-family: var(--ui) !important; font-size: 12.5px !important; font-weight: 500; letter-spacing: 0 !important; text-transform: none !important;
  min-height: 32px; padding: 0 6px !important; border: 0 !important; border-left: 1px solid var(--line) !important; border-radius: 0 !important; background: var(--white); color: var(--ink); }
#secAlloc .con-mode button:first-child { border-left: 0 !important; }
#secAlloc .con-mode button.on { background: var(--forest) !important; color: #fff !important; font-weight: 600; }
#secAlloc .con-mode button:not(.on):hover { background: var(--cream) !important; }
#secAlloc .con-off { font-size: 11.5px; color: var(--muted); padding: 2px 0 0; }

/* brytere (AO-kanaler, + Search, fane 6) */
.bryter { display: inline-flex !important; align-items: center; gap: 8px; background: none !important; border: 0 !important; padding: 4px 6px !important;
  font-family: var(--ui) !important; font-size: 12.5px !important; font-weight: 500; letter-spacing: 0 !important; text-transform: none !important; color: var(--ink) !important; cursor: pointer; white-space: nowrap; box-shadow: none !important; }
.bryter .spor { position: relative; width: 30px; height: 18px; border-radius: 999px; background: var(--line); transition: background .15s; flex: 0 0 auto; }
.bryter .spor i { position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(22, 24, 15, .3); transition: transform .15s; }
button.bryter.on .spor, label.bryter input:checked + .spor { background: var(--forest); }
button.bryter.on .spor i, label.bryter input:checked + .spor i { transform: translateX(12px); }
label.bryter input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
label.bryter:has(input:disabled) { opacity: .4; cursor: not-allowed; }
label.bryter:has(input:focus-visible) .spor, button.bryter:focus-visible .spor { outline: 2px solid var(--olive); outline-offset: 2px; }
button.bryter:hover .spor, label.bryter:not(:has(input:disabled)):hover .spor { box-shadow: 0 0 0 3px rgba(46, 58, 34, .12); }
#secAlloc .aosw { border: 0 !important; gap: 4px; } #secAlloc .aosw .aosok { border-left: 0 !important; padding: 4px 6px !important; }

/* resultatet: én fordelingsstripe + rene tekstrader */
#secAlloc .psplit { display: flex; height: 10px; margin: 16px 26px 4px; border-radius: 5px; overflow: hidden; gap: 2px; background: var(--white); }
#secAlloc .psplit i { display: block; min-width: 3px; }
#secAlloc .prow-b { cursor: default !important; padding: 11px 26px 12px; }
#secAlloc .prow-b:hover { background: none !important; box-shadow: none !important; }
#secAlloc .prow-t { display: grid; grid-template-columns: minmax(0, 1fr) auto 56px; align-items: baseline; gap: 12px; }
#secAlloc .prow .pname { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 0 2px; min-width: 0; }
#secAlloc .pdot { width: 10px; height: 10px; border-radius: 3px; margin-right: 8px; flex: 0 0 auto; align-self: center; }
#secAlloc .prow-m { margin-left: 18px !important; }
#secAlloc .prow .pbar, #secAlloc .prow .tacs { display: none !important; }

/* stegstripen: rolig sti i stedet for fem bokser */
#secAlloc .allocsteg { gap: 2px; padding: 6px 22px; background: var(--white); }
#secAlloc .allocsteg .steg { flex: 0 1 auto; border: 0; background: none; padding: 4px 8px; border-radius: 5px; gap: 6px; }
#secAlloc .allocsteg .steg:hover { background: var(--cream); box-shadow: none; }
#secAlloc .allocsteg .steg small { display: none; }
#secAlloc .allocsteg .steg b { font-weight: 500; color: var(--muted); font-size: 12px; }
#secAlloc .allocsteg .steg .nr { width: 16px; height: 16px; font-size: 9.5px; }
#secAlloc .allocsteg .steg.ok b { color: var(--ink); }
#secAlloc .allocsteg .steg.neste { box-shadow: none; border: 0; }
#secAlloc .allocsteg .steg.neste b { color: var(--forest); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
#secAlloc .allocsteg .pil { font-size: 11px; color: var(--line); }

/* topplinjen i fane 3: dempet, så optimeringen får oppmerksomheten */
#secAlloc .topbar { gap: 12px; background: var(--paper); }
#secAlloc .topbar .crumb { font-family: var(--ui); font-size: 12px; letter-spacing: 0; display: flex; align-items: center; flex-wrap: nowrap; white-space: nowrap; }
#secAlloc .visw { border-radius: 6px; } #secAlloc .visw button { font-family: var(--ui); font-size: 12px; font-weight: 500; padding: 5px 12px; min-height: 28px; }
#secAlloc .picker { border-radius: 6px; background: var(--white); padding: 4px 10px; min-height: 30px; }
#secAlloc .picker .lab { font-family: var(--ui); text-transform: none; letter-spacing: 0; font-size: 11px; }
@media (max-width: 900px) { html.chatstripe #secAlloc .wrap { grid-template-columns: 1fr; } }

/* .316 · «Ute» skal ikke forsvinne (Antonin: «when a channel is out how do I get it back»). I AO-modus skjules bare kanaler
   UTENFOR AO-omfanget (.utenfor) — en kanal brukeren selv satte «Ute» blir stående, dempet, med «Ta med igjen». */
body.aomodus #secAlloc .prow.ex:not(.utenfor), body.aomodus #secAlloc .con[data-mode="ex"]:not(.utenfor),
body.aomodus #secAlloc .cgrid .card.ex:not(.utenfor), body.aomodus #secAlloc li.gone:not(.utenfor) { display: revert; }
#secAlloc .cgrid .card.ex:not(.utenfor) { display: block; opacity: .55; }
body.aomodus #secAlloc .utenfor { display: none !important; }
#secAlloc .con[data-mode="ex"] .con-n { color: var(--muted); }
#secAlloc .con[data-mode="ex"] { background: rgba(46, 58, 34, .04); border-radius: 6px; padding-left: 8px; padding-right: 8px; }
#secAlloc .prow.ex .pname { color: var(--muted); }
#secAlloc .prow .tamed { margin-left: 10px; font-family: var(--ui); font-size: 12px; font-weight: 600; color: var(--forest); background: var(--white);
  border: 1px solid var(--forest); border-radius: 5px; min-height: 28px; padding: 3px 11px; letter-spacing: 0; text-transform: none; }
#secAlloc .prow .tamed:hover { background: var(--forest); color: #fff; }
/* datagrunnlag-linjen over hovedtallene er tatt bort (Antonin: «no need for this comment») — teksten finnes fortsatt for chatten */
#secAlloc #dataPill { display: none !important; }

/* .317 · plattformfarger: kurve, punkt og glider i kanalkortet følger kanalens farge (--kf settes per kort) */
#secAlloc .cgrid .card .slide { accent-color: var(--kf, var(--accent)); }
#secAlloc .cgrid .card h4 { display: flex; align-items: center; flex-wrap: wrap; }
#secAlloc .cgrid .card h4 .pdot { width: 9px; height: 9px; margin-right: 6px; }
#secAlloc .psplit i, #secAlloc .pdot { box-shadow: inset 0 0 0 1px rgba(22, 24, 15, .12); }
#secAlloc .con-n { display: inline-flex; align-items: center; flex-wrap: wrap; } #secAlloc .con-n .pdot { width: 9px; height: 9px; margin-right: 7px; }

/* ===== .318 · tom start, Avansert ved siden av kanalpanelet ===== */
#secAlloc.venter .mid-head .eff, #secAlloc.venter #devi, #secAlloc.venter #plan, #secAlloc.venter #nextBar, #secAlloc.venter #mmmBar { display: none !important; }
#secAlloc .startkort { margin: 18px 0 22px; padding: 18px 20px; background: var(--white); border: 1px solid var(--line); border-radius: 4px; max-width: 760px; }
#secAlloc .startkort ol { margin: 8px 0 0; padding: 0; list-style: none; counter-reset: st; display: grid; gap: 12px; }
#secAlloc .startkort li { counter-increment: st; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; font-size: 13px; line-height: 1.5; color: var(--ink); }
#secAlloc .startkort li::before { content: counter(st); flex: 0 0 22px; height: 22px; border-radius: 50%; border: 1px solid var(--line); display: inline-flex; align-items: center; justify-content: center; font-family: var(--mono); font-size: 11px; color: var(--muted); }
#secAlloc .startkort li b { min-width: 64px; }
#secAlloc .startkort .btn.primary { font-size: 12px; padding: 6px 12px; }
#secAlloc .startkort .mini { font-family: var(--ui); font-size: 12px; min-height: 28px; padding: 0 10px; border: 1px solid var(--line); border-radius: 3px; background: var(--white); color: var(--ink); cursor: pointer; text-transform: none; letter-spacing: 0; }
#secAlloc .startkort .mini:hover { border-color: var(--forest); }
/* Avansert: ved siden av railen, ikke over den */
#secAlloc.advved .advdrawer { bottom: 0; transform: translateX(-12px); opacity: 0; pointer-events: none; transition: transform .18s ease, opacity .18s ease; box-shadow: 8px 0 24px rgba(0,0,0,.06); z-index: 40; }
#secAlloc.advved .advdrawer.open { transform: none; opacity: 1; pointer-events: auto; }
#secAlloc.advskyv .wrap > .mid { margin-left: var(--advw, 420px); transition: margin-left .18s ease; }
#secAlloc.advved .advdrawer:not(.open) { visibility: hidden; }
/* kompakte kanalrader: navn + beløp på én linje, Spenn/Fast/Ute + Min/maks på neste, feltene bare ved behov */
#secAlloc .con { padding: 9px 0 10px; }
#secAlloc .con-t { flex-wrap: nowrap; margin-bottom: 6px; }
#secAlloc .con-kr { flex: 0 0 auto; font-size: 12px; font-variant-numeric: tabular-nums; color: var(--ink); font-weight: 600; }
#secAlloc .con[data-mode="ex"] .con-kr { color: var(--muted); font-weight: 400; }
#secAlloc .con-ctl { display: flex; gap: 6px; align-items: stretch; }
#secAlloc .con-ctl .con-mode { flex: 1 1 auto; }
#secAlloc .con-mode button { min-height: 28px !important; padding: 0 4px !important; font-size: 12px !important; }
#secAlloc .con-rm { flex: 0 0 auto; font-family: var(--ui); font-size: 11.5px; padding: 0 8px; min-height: 28px; border: 1px solid var(--line); border-radius: 6px; background: var(--white); color: var(--ink); cursor: pointer; white-space: nowrap; }
#secAlloc .con-rm:hover:not(:disabled) { border-color: var(--forest); }
#secAlloc .con-rm.on { background: var(--cream); border-color: var(--forest); }
#secAlloc .con-rm:disabled { cursor: default; color: var(--muted); background: var(--cream); }
#secAlloc .con .con-mm { margin-top: 7px; }
#secAlloc .con[data-mode="ex"] .con-n { color: var(--muted); }
#secAlloc.venter .mid-head { display: none; }

/* .318b: «Lagre ▾»-menyen arvet white-space:nowrap fra topplinjen — teksten rant ut over siden */
#secAlloc .menypop, #secAlloc .menypop * { white-space: normal; }
#secAlloc .menypop { width: 300px; }
#secAlloc .menypop button { min-height: 0; height: auto; }
#secAlloc .menypop button:hover { background: var(--cream); }

/* .320: hurtigvalg for periodelengde — segmentert kontroll + «Mer …» */
#secAlloc .perhurtig { display: flex; margin-top: 8px; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; background: var(--white); }
#secAlloc .perhurtig button, #secAlloc .perhurtig select { flex: 1 1 0; min-width: 0; min-height: 30px; padding: 0 4px; border: 0; border-left: 1px solid var(--line); background: var(--white); color: var(--ink); font-family: var(--ui); font-size: 12px; cursor: pointer; white-space: nowrap; }
#secAlloc .perhurtig button:first-child { border-left: 0; }
#secAlloc .perhurtig select { flex: 1.15 1 0; text-align: center; text-align-last: center; appearance: none; -webkit-appearance: none; }
#secAlloc .perhurtig button:not(.on):hover, #secAlloc .perhurtig select:not(.on):hover { background: var(--cream); }
#secAlloc .perhurtig button.on, #secAlloc .perhurtig select.on { background: var(--forest); color: #fff; font-weight: 600; }

/* .321: «Data» i stegstripen åpner Avansert (rail-knappen er fjernet) — ser ut som en knapp */
#secAlloc .allocsteg .steg[data-k="data"] { border: 1px solid var(--line) !important; background: var(--white) !important; border-radius: 6px !important; padding: 4px 10px !important; }
#secAlloc .allocsteg .steg[data-k="data"]:hover { border-color: var(--forest) !important; }
#secAlloc .allocsteg .steg[data-k="data"].aapen { background: var(--cream) !important; border-color: var(--forest) !important; }
#secAlloc .allocsteg .stegpil { font-style: normal; font-size: 11px; color: var(--ink); margin-left: 4px; display: inline-block; transition: transform .15s; }
#secAlloc .allocsteg .steg.aapen .stegpil { transform: rotate(180deg); }

/* .324: AO-/Search-bryterne øverst i kanallisten (Antonin: «should be on the top of channel selectors») */
#secAlloc .aosw.aorail { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 12px; margin: 2px 0 8px; padding: 6px 0 8px; border-bottom: 1px solid var(--line-soft); }
#secAlloc .aosw.aorail .bryter { padding: 4px 0 !important; font-size: 12.5px; }
#secAlloc .aosw.aorail #aoTgl { font-weight: 600; }
