/* ============================================================
   RÅSTOFF – Børsmonitoren (/bors/monitor/)
   Avisen forklarer, terminalen viser: redaksjonell tekst på papir,
   tallene i mørke konsollpaneler. Bygger på tokenene i style.css.
   ============================================================ */

:root {
  --term-bg:     #111512;   /* blekk med et grønt stikk */
  --term-bg-2:   #181E1A;
  --term-linje:  #29322C;
  --term-tekst:  #E9E4D8;   /* papir, dempet */
  --term-dim:    #8E998F;
  --term-svak:   #5D675F;
  --term-gronn:  #7FD39B;   /* fosfor – lys variant av --primary-tag */
  --term-oksid:  #E58A63;   /* lys variant av --oxide */
  --term-gul:    #E3C27A;
  --panel-bredde: max(100%, min(1000px, 100vw - 3rem));
}

/* ---------- Underfaner på Oslo Børs ---------- */
.bors-faner { margin: 1.25rem 0 0.25rem; }
.bors-faner .filter-pill { text-decoration: none; display: inline-flex; align-items: center; gap: 0.45rem; }
.mon-puls {
  width: 0.45rem; height: 0.45rem; border-radius: 50%;
  background: var(--term-gronn); box-shadow: 0 0 0 0 rgba(127, 211, 155, 0.6);
  animation: mon-puls 2.4s ease-out infinite;
}
.filter-pill:not(.active) .mon-puls { background: var(--primary-tag); }
@keyframes mon-puls {
  0%   { box-shadow: 0 0 0 0 rgba(127, 211, 155, 0.55); }
  70%  { box-shadow: 0 0 0 0.45rem rgba(127, 211, 155, 0); }
  100% { box-shadow: 0 0 0 0 rgba(127, 211, 155, 0); }
}

/* ---------- Topp ---------- */
.mon-topp { padding: 1.25rem 0 1.5rem; }
.monitor .story-title { font-size: clamp(2rem, 6vw, 2.9rem); letter-spacing: -0.02em; }
.monitor .story-ingress { font-size: 1.12rem; max-width: 40em; }

.mon-forbehold-topp {
  margin: 0.9rem 0 0; padding: 0.15rem 0 0.15rem 0.75rem;
  border-left: 3px solid var(--primary-tag);
  font-family: var(--font-ui); font-size: 0.84rem; line-height: 1.5; color: var(--ink-soft);
}
.mon-forbehold-topp strong { color: var(--ink); }
.mon-varsel {
  margin: 0 0 1rem; padding: 0.7rem 1rem;
  background: var(--paper-soft); border-left: 3px solid var(--oxide);
  font-family: var(--font-ui); font-size: 0.88rem; color: var(--ink);
}

/* ---------- Panel som bryter ut av tekstkolonnen ---------- */
.mon-panel {
  width: var(--panel-bredde);
  margin-left: calc((100% - var(--panel-bredde)) / 2);
  position: relative;
}

.mon-konsoll {
  background: var(--term-bg);
  color: var(--term-tekst);
  border-radius: 6px;
  border: 1px solid #000;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset, 0 18px 40px -24px rgba(17, 21, 18, 0.55);
  font-family: var(--font-meta);
  overflow: hidden;
  isolation: isolate;
}
/* Skannlinjer – knapt synlige, gir skjermfølelsen */
.mon-konsoll::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 3;
  background: repeating-linear-gradient(to bottom, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 3px);
}
.mon-konsoll--flat { padding: 1.1rem 1.25rem 1.25rem; }

.mon-regn {
  position: absolute; inset: 0; width: 100%; height: 100%;
  z-index: 0; opacity: 0.34; pointer-events: none;
  -webkit-mask-image: linear-gradient(to right, rgba(0,0,0,0.25), #000 55%);
          mask-image: linear-gradient(to right, rgba(0,0,0,0.25), #000 55%);
}

.mon-konsoll-topp {
  position: relative; z-index: 1;
  display: flex; justify-content: space-between; align-items: center; gap: 0.5rem 1rem; flex-wrap: wrap;
  padding: 0.7rem 1.25rem;
  border-bottom: 1px solid var(--term-linje);
  font-size: 0.68rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--term-dim);
  background: linear-gradient(to bottom, rgba(255,255,255,0.03), transparent);
}
.mon-konsoll-navn { display: inline-flex; align-items: center; gap: 0.55rem; color: var(--term-tekst); }
.mon-led { width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--term-gronn); box-shadow: 0 0 8px var(--term-gronn); display: inline-block; }
.mon-led.gammel { background: var(--term-gul); box-shadow: 0 0 8px var(--term-gul); }

/* ---------- Skjermen ---------- */
.mon-skjerm {
  position: relative; z-index: 1;
  padding: 1.1rem 1.25rem 0.5rem;
  min-height: 15.5rem;
  font-size: 0.86rem; line-height: 1.7;
}
.mon-linje { white-space: pre-wrap; word-break: break-word; margin: 0; }
.mon-linje + .mon-linje { margin-top: 0.05rem; }
.mon-luft { height: 0.7rem; }
.mon-prompt { color: var(--term-gronn); }
.mon-prompt::before { content: "$ "; color: var(--term-svak); }
.mon-kommentar { color: var(--term-dim); }
.mon-sig {
  display: grid;
  grid-template-columns: 3.4rem minmax(0, 1fr) auto;
  gap: 0 1rem; align-items: baseline;
  padding: 0.15rem 0;
}
.mon-sig-id { color: var(--term-dim); }
.mon-sig-tekst { color: var(--term-tekst); }
.mon-sig-dom { font-size: 0.68rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--term-svak); white-space: nowrap; }
.mon-sig-dom.holder { color: var(--term-gronn); }
.opp  { color: var(--term-gronn); }
.ned  { color: var(--term-oksid); }
.noy  { color: var(--term-dim); }
.mon-markor {
  display: inline-block; width: 0.55em; height: 1.05em; vertical-align: -0.15em;
  background: var(--term-gronn); animation: mon-blink 1.05s steps(1) infinite;
}
@keyframes mon-blink { 50% { opacity: 0; } }

/* Nøkkeltall under skjermen */
.mon-nokkeltall {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--term-linje);
}
.mon-tall { padding: 0.85rem 1.25rem 0.9rem; border-right: 1px solid var(--term-linje); }
.mon-tall:last-child { border-right: none; }
.mon-tall b {
  display: block; font-family: var(--font-display); font-weight: 500; font-size: 1.75rem; line-height: 1.1;
  color: var(--term-tekst); font-variant-numeric: tabular-nums; letter-spacing: -0.01em;
}
.mon-tall > span { display: block; margin-top: 0.25rem; font-size: 0.64rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--term-dim); }

/* Kurslisten (rulletekst) */
.mon-tape {
  position: relative; z-index: 1; overflow: hidden;
  border-top: 1px solid var(--term-linje); background: rgba(0, 0, 0, 0.25);
  font-size: 0.74rem; white-space: nowrap;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 4%, #000 96%, transparent);
          mask-image: linear-gradient(to right, transparent, #000 4%, #000 96%, transparent);
}
.mon-tape-spor { display: inline-flex; padding: 0.55rem 0; animation: mon-rull 60s linear infinite; }
.mon-tape:hover .mon-tape-spor { animation-play-state: paused; }
.mon-tape-post { padding: 0 1.4rem; color: var(--term-dim); border-right: 1px solid var(--term-linje); }
.mon-tape-post b { color: var(--term-tekst); font-weight: 500; margin: 0 0.45rem; }
@keyframes mon-rull { to { transform: translateX(-50%); } }

/* ---------- Seksjoner på papir ---------- */
.mon-seksjon { padding: 3rem 0 0.5rem; }
.mon-overtittel {
  font-family: var(--font-meta); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--oxide); margin-bottom: 0.35rem;
}
.mon-h2 {
  font-family: var(--font-display); font-weight: 700; font-size: clamp(1.45rem, 4vw, 1.95rem);
  line-height: 1.15; letter-spacing: -0.01em; margin-bottom: 0.6rem; color: var(--ink);
  font-variation-settings: "opsz" 96;
}
.mon-ingress {
  font-family: var(--font-display); font-style: italic; font-size: 1.05rem; line-height: 1.5;
  color: var(--ink-soft); margin-bottom: 1.25rem; max-width: 40em;
}
.mon-ingress b { font-style: normal; font-weight: 700; color: var(--ink); }
.mon-kilde {
  margin-top: 0.75rem; font-family: var(--font-meta); font-size: 0.68rem; line-height: 1.55; color: var(--ink-muted);
}

/* ---------- Filterknapper i konsollen ---------- */
.mon-filter { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 1rem; }
.mon-knapp {
  font-family: var(--font-meta); font-size: 0.68rem; letter-spacing: 0.08em; text-transform: uppercase;
  background: transparent; color: var(--term-dim);
  border: 1px solid var(--term-linje); border-radius: 999px;
  padding: 0.32rem 0.75rem; cursor: pointer; transition: all 0.15s ease;
}
.mon-knapp:hover { color: var(--term-tekst); border-color: var(--term-dim); }
.mon-knapp[aria-pressed="true"] { background: var(--term-tekst); color: var(--term-bg); border-color: var(--term-tekst); }
.mon-knapp b { font-weight: 500; opacity: 0.65; margin-left: 0.3rem; }
.mon-knapp:focus-visible, .hm-celle:focus-visible, .dm-rad:focus-visible { outline: 2px solid var(--term-gronn); outline-offset: 2px; }

/* ---------- Hypotesematrisen ---------- */
.hm-rutenett {
  display: grid; gap: 6px;
  grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
}
.hm-celle {
  position: relative; text-align: left; cursor: pointer;
  font-family: var(--font-meta); color: var(--term-tekst);
  background: var(--term-bg-2); border: 1px solid var(--term-linje); border-radius: 4px;
  padding: 0.55rem 0.6rem 0.6rem; min-height: 5.4rem;
  display: flex; flex-direction: column; justify-content: space-between; gap: 0.3rem;
  transition: transform 0.15s ease, border-color 0.15s ease, opacity 0.25s ease, background 0.15s ease;
  animation: hm-inn 0.5s ease both;
}
@keyframes hm-inn { from { opacity: 0; transform: translateY(4px); } }
.hm-celle:hover { border-color: var(--term-dim); transform: translateY(-1px); }
.hm-celle[aria-pressed="true"] { border-color: var(--term-tekst); box-shadow: 0 0 0 1px var(--term-tekst) inset; }
.hm-celle.dempet { opacity: 0.18; }
.hm-id { font-size: 1.05rem; font-weight: 500; letter-spacing: 0.02em; }
.hm-dom { font-size: 0.58rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--term-dim); }
.hm-verdi { font-size: 0.66rem; color: var(--term-dim); font-variant-numeric: tabular-nums; }
.hm-strek { display: block; height: 2px; background: var(--term-linje); border-radius: 1px; overflow: hidden; }
.hm-strek i { display: block; height: 100%; background: currentColor; }

.hm--holder { background: rgba(127, 211, 155, 0.13); border-color: rgba(127, 211, 155, 0.45); }
.hm--holder .hm-id, .hm--holder .hm-dom { color: var(--term-gronn); }
.hm--holder .hm-strek { color: var(--term-gronn); }
.hm--svak, .hm--ustabil { border-color: rgba(227, 194, 122, 0.5); }
.hm--svak .hm-dom, .hm--ustabil .hm-dom, .hm--svak .hm-id, .hm--ustabil .hm-id { color: var(--term-gul); }
.hm--svak .hm-strek, .hm--ustabil .hm-strek { color: var(--term-gul); }
.hm--avvist .hm-id { color: var(--term-dim); text-decoration: line-through; text-decoration-color: rgba(229, 138, 99, 0.7); text-decoration-thickness: 1px; }
.hm--avvist .hm-strek { color: var(--term-oksid); }
.hm--null, .hm--utslag { border-style: dashed; }
.hm--utestet, .hm--faa, .hm--regime { background: transparent; border-style: dotted; }
.hm--utestet .hm-id, .hm--faa .hm-id, .hm--regime .hm-id { color: var(--term-svak); }
.hm-samtidig {
  position: absolute; top: 0.5rem; right: 0.5rem; width: 0.4rem; height: 0.4rem; border-radius: 50%;
  border: 1px solid var(--term-dim);
}

/* Detaljpanelet */
.hm-detalj { margin-top: 1rem; }
.hm-kort {
  border-top: 1px solid var(--term-linje); padding-top: 1rem;
  display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 1.25rem 2rem;
  animation: hm-inn 0.35s ease both;
}
.hm-kort-topp { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.9rem; }
.hm-kort-id { font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--term-dim); }
.hm-merke {
  font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase;
  border: 1px solid currentColor; border-radius: 999px; padding: 0.12rem 0.55rem;
}
.hm-kort h3 {
  grid-column: 1 / -1;
  font-family: var(--font-display); font-weight: 500; font-size: clamp(1.15rem, 3vw, 1.45rem); line-height: 1.25;
  color: var(--term-tekst); letter-spacing: -0.005em;
}
.hm-forklaring { font-family: var(--font-ui); font-size: 0.88rem; line-height: 1.55; color: var(--term-tekst); }
.hm-forklaring p + p { margin-top: 0.6rem; }
.hm-forklaring .dim { color: var(--term-dim); }
.hm-tallrad { display: grid; grid-template-columns: 1fr auto; gap: 0.15rem 1rem; font-size: 0.78rem; }
.hm-tallrad dt { color: var(--term-dim); }
.hm-tallrad dd { text-align: right; font-variant-numeric: tabular-nums; color: var(--term-tekst); }
.hm-aar { grid-column: 1 / -1; }
.hm-aar-tittel { font-size: 0.64rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--term-dim); margin-bottom: 0.4rem; }
.hm-aar svg { display: block; width: 100%; height: auto; overflow: visible; }

/* ---------- Fasit-loggen ---------- */
.fl-fremdrift { margin-bottom: 1.1rem; }
.fl-fremdrift-tekst { display: flex; justify-content: space-between; gap: 1rem; font-size: 0.7rem; letter-spacing: 0.06em; color: var(--term-dim); margin-bottom: 0.45rem; }
.fl-fremdrift-tekst b { color: var(--term-tekst); font-weight: 500; }
.fl-bar { height: 4px; background: var(--term-linje); border-radius: 2px; overflow: hidden; }
.fl-bar i { display: block; height: 100%; background: var(--term-gronn); box-shadow: 0 0 10px var(--term-gronn); }
.fl-ramme { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 0.25rem; }
.fl-tabell { border-collapse: separate; border-spacing: 4px; font-size: 0.72rem; margin: 0 -4px; }
.fl-tabell th { font-weight: 400; color: var(--term-dim); text-align: center; white-space: nowrap; padding: 0 0 0.2rem; }
.fl-tabell th.fl-navn, .fl-tabell td.fl-navn {
  text-align: left; white-space: nowrap; padding-right: 0.75rem; color: var(--term-tekst);
  position: sticky; left: 0; background: var(--term-bg); z-index: 1;
}
.fl-navn small { display: block; color: var(--term-dim); font-size: 0.64rem; }
.fl-tabell td.fl-sum { text-align: right; padding-left: 0.75rem; white-space: nowrap; color: var(--term-tekst); font-variant-numeric: tabular-nums; }
.fl-tabell td.fl-sum small { display: block; color: var(--term-dim); font-size: 0.62rem; }
.fl-celle {
  display: inline-grid; place-items: center; width: 1.85rem; height: 1.85rem; border-radius: 3px;
  font-style: normal; font-size: 0.72rem; border: 1px solid transparent;
}
.fl-tabell td { text-align: center; padding: 0; }
.fl--treff  { background: rgba(127, 211, 155, 0.2); color: var(--term-gronn); border-color: rgba(127, 211, 155, 0.5); }
.fl--bom    { background: rgba(229, 138, 99, 0.16); color: var(--term-oksid); border-color: rgba(229, 138, 99, 0.45); }
.fl--venter { color: var(--term-tekst); border: 1px dashed var(--term-dim); animation: fl-venter 1.6s ease-in-out infinite; }
.fl--over   { color: var(--term-svak); background: rgba(255, 255, 255, 0.02); }
.fl--null   { color: var(--term-tekst); border-color: var(--term-dim); }
.fl-fasitrad td.opp { color: var(--term-gronn); }
.fl-fasitrad td.ned { color: var(--term-oksid); }
@keyframes fl-venter { 50% { border-color: var(--term-gronn); color: var(--term-gronn); } }
.fl-fasitrad td { font-size: 0.62rem; color: var(--term-dim); opacity: 0.9; white-space: nowrap; padding-top: 0.25rem; font-variant-numeric: tabular-nums; }
.fl-legende { display: flex; flex-wrap: wrap; gap: 0.4rem 1.2rem; margin-top: 0.9rem; font-size: 0.68rem; color: var(--term-dim); }
.fl-legende span { display: inline-flex; align-items: center; gap: 0.4rem; }
.fl-legende .fl-celle { width: 1.2rem; height: 1.2rem; font-size: 0.6rem; animation: none; }

/* ---------- Drivermatrisen ---------- */
.dm-ramme { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.dm-tabell { width: 100%; border-collapse: separate; border-spacing: 0 3px; font-size: 0.78rem; }
.dm-tabell th {
  font-weight: 400; font-size: 0.64rem; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--term-dim); text-align: right; padding: 0 0.6rem 0.35rem; white-space: nowrap;
}
.dm-tabell th:first-child { text-align: left; padding-left: 0.5rem; }
.dm-tabell th button {
  font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; background: none; border: none; cursor: pointer; padding: 0;
}
.dm-tabell th button[aria-pressed="true"] { color: var(--term-tekst); }
.dm-tabell th button[aria-pressed="true"]::after { content: " ↓"; color: var(--term-gronn); }
.dm-rad { cursor: pointer; }
.dm-rad td { padding: 0.5rem 0.6rem; background: var(--term-bg-2); white-space: nowrap; }
.dm-rad td:first-child { border-radius: 3px 0 0 3px; padding-left: 0.5rem; color: var(--term-tekst); font-family: var(--font-ui); font-size: 0.84rem; }
.dm-rad td:last-child { border-radius: 0 3px 3px 0; }
.dm-rad:hover td { background: #1F2621; }
.dm-rad[aria-selected="true"] td { box-shadow: 0 1px 0 var(--term-tekst) inset, 0 -1px 0 var(--term-tekst) inset; }
.dm-rad[aria-selected="true"] td:first-child { box-shadow: 0 1px 0 var(--term-tekst) inset, 0 -1px 0 var(--term-tekst) inset, 1px 0 0 var(--term-tekst) inset; }
.dm-rad[aria-selected="true"] td:last-child { box-shadow: 0 1px 0 var(--term-tekst) inset, 0 -1px 0 var(--term-tekst) inset, -1px 0 0 var(--term-tekst) inset; }
.dm-verdi { text-align: right; font-variant-numeric: tabular-nums; min-width: 4.2rem; transition: background 0.3s ease; }
.dm-mangler { color: var(--term-svak); }
.dm-usikker { color: var(--term-svak); background: transparent; }
.mon-skjerm a, .fl-arkiv { color: inherit; text-decoration: underline; text-decoration-color: var(--term-svak); text-underline-offset: 2px; }
.mon-skjerm a:hover, .fl-arkiv:hover { color: var(--term-gronn); }
.mon-endringer { list-style: none; margin: 0 0 1rem; padding: 0; }
.mon-endringer li { padding: 0.75rem 0; border-bottom: 1px solid var(--rule); font-size: 0.95rem; }
.mon-endringer li:first-child { border-top: 1px solid var(--rule); }
.mon-endringer time { display: block; font-family: var(--font-meta); font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--oxide); margin-bottom: 0.2rem; }
.dm-gnist { width: 9rem; padding-right: 0.5rem !important; }
.dm-gnist svg { display: block; width: 100%; height: 22px; overflow: visible; }
.dm-graf { margin-top: 1.1rem; position: relative; }
.dm-graf-tittel { font-family: var(--font-ui); font-size: 0.86rem; color: var(--term-tekst); margin-bottom: 0.15rem; }
.dm-graf-under { font-size: 0.66rem; color: var(--term-dim); margin-bottom: 0.6rem; }
.dm-graf svg { display: block; width: 100%; height: auto; overflow: visible; touch-action: pan-y; }
.dm-tips {
  position: absolute; pointer-events: none; z-index: 4;
  background: var(--term-tekst); color: var(--term-bg);
  padding: 0.3rem 0.5rem; font-size: 0.7rem; line-height: 1.45; white-space: nowrap; border-radius: 2px;
}

/* ---------- Renteregimet ---------- */
.rg-maaler { margin-bottom: 0.5rem; }
.rg-skala { position: relative; height: 2.6rem; margin: 1.6rem 0 0.4rem; }
.rg-sone { position: absolute; top: 0.9rem; height: 0.8rem; }
.rg-sone--skrekk { left: 0; width: 40%; background: linear-gradient(to right, rgba(229, 138, 99, 0.55), rgba(229, 138, 99, 0.15)); border-radius: 2px 0 0 2px; }
.rg-sone--noytral { left: 40%; width: 20%; background: rgba(255, 255, 255, 0.07); }
.rg-sone--vekst { left: 60%; width: 40%; background: linear-gradient(to right, rgba(127, 211, 155, 0.15), rgba(127, 211, 155, 0.55)); border-radius: 0 2px 2px 0; }
.rg-naal { position: absolute; top: 0; bottom: 0; width: 2px; background: var(--term-tekst); transform: translateX(-1px); transition: left 1.2s cubic-bezier(.2,.8,.2,1); }
.rg-naal::before {
  content: attr(data-verdi); position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%);
  font-size: 0.72rem; color: var(--term-tekst); white-space: nowrap; margin-bottom: 0.2rem;
}
.rg-etiketter { display: flex; justify-content: space-between; font-size: 0.62rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--term-dim); }
.rg-etiketter span:nth-child(2) { text-align: center; }
.rg-etiketter span:last-child { text-align: right; }

/* ---------- Metode ---------- */
.mon-metode { margin-top: 3.5rem; }
.mon-metode .story-body p { margin-bottom: 0.9rem; }

/* ---------- Mobil ---------- */
@media (max-width: 640px) {
  .mon-konsoll { border-radius: 4px; }
  .mon-konsoll--flat { padding: 0.9rem 0.85rem 1rem; }
  .mon-skjerm { padding: 0.9rem 0.85rem 0.4rem; font-size: 0.76rem; min-height: 17rem; }
  .mon-konsoll-topp { padding: 0.6rem 0.85rem; font-size: 0.6rem; }
  .mon-sig { grid-template-columns: 2.6rem minmax(0, 1fr); }
  .mon-sig-dom { grid-column: 2; }
  .mon-nokkeltall { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mon-tall { padding: 0.7rem 0.85rem; border-bottom: 1px solid var(--term-linje); }
  .mon-tall:nth-child(2n) { border-right: none; }
  .mon-tall b { font-size: 1.4rem; }
  .hm-rutenett { grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: 5px; }
  .hm-celle { min-height: 4.8rem; padding: 0.45rem; }
  .hm-kort { grid-template-columns: 1fr; }
  .dm-gnist { display: none; }
  .dm-tabell { font-size: 0.72rem; }
  .dm-tabell th { padding: 0 0.3rem 0.35rem; letter-spacing: 0.04em; }
  .dm-rad td { padding: 0.45rem 0.3rem; }
  .dm-verdi { min-width: 0; }
  .dm-rad td:first-child { font-size: 0.78rem; white-space: normal; }
}

@media (prefers-reduced-motion: reduce) {
  .mon-puls, .mon-markor, .fl--venter, .hm-celle, .hm-kort { animation: none; }
  .mon-tape-spor { animation: none; flex-wrap: wrap; white-space: normal; }
  .rg-naal { transition: none; }
}