
:root{
  --s-page-gutter:24px;
  --s-page-inset-left:max(var(--s-page-gutter),env(safe-area-inset-left,0px));
  --s-page-inset-right:max(var(--s-page-gutter),env(safe-area-inset-right,0px));
  /* Approved Soft depth replaces Sage canvas, 18 October2026.
     Existing text, identity, status and data palettes are preserved. */
  --s-bg:#edf1ef; --s-surface:#ffffff; --s-ink:#1b1e20; --s-muted:#646b6e; --s-faint:#646b6e;
  --s-line:#e5ebe7; --s-line-soft:#eef1f0;
  --s-accent:#2f7d54; --s-accent-ink:#266a47; --s-accent-soft:#eef3ee;
  --s-nav-bg:#eef1f3; --s-nav-line:#d3dde1; --s-nav-muted:#526a5c; --s-scroll-thumb:#a8d8b9;
  --s-pos:#1f7a4d; --s-warn:#8f6314; --s-risk:#b23b3b;
  /* · data-accenter (bars.md-forslaget indført jul 2026): orange = value/sandsynligheds-barer,
     blå = sekundær serie (marked/ude-hold). Nye barer bruger tokens, aldrig rå hex. · */
  --s-data:#c2540a; --s-data-2:#246d9e;
  /* Model graphics and small model text have separate orange tokens.
     Blue remains the second series; unrelated charts keep their existing roles. */
  --s-data-ink:#ad4a08;
  /* · translucent flade til blur-lag (samme kulør som --s-bg): ÉT sted, så ingen snippet
     hardkoder rgba-varianter af baggrunden. Brug ALTID med -webkit-backdrop-filter. · */
  --s-bg-blur:rgba(237,241,239,.86); --s-shadow-lift:0 6px 22px rgba(28,27,23,.09);
  /* · Sticky navigations-strimler (kampsidens sektions-hop, statistik-sidens liga-faner) har
     INGEN egne tokens: de står på --s-bg / --s-bg-blur + --s-line + --s-accent som alt andet.
     Den mørke bar med guld-chips (--s-bar/--s-gold/--s-neon, jul 2026) er FJERNET aug 2026:
     et sort fremmedlegeme oven på en off-white side, to rækker høj på mobil. Se STYLING.md §16. · */
  /* · shape & rhythm · */
  --s-radius:16px; --s-radius-sm:12px; --s-match-radius:16px; --s-pad:20px; --s-gap:24px;
  --s-title-size:1.125rem; --s-title-icon-size:18px;
  /* · APP-LAGET (aug 2026). Et site foeles som en app naar de samme faa beslutninger gaelder
     overalt: en hoejde-stige, en elevations-stige, en bevaegelse, en fokus-ring. Foer laa de
     spredt som raa vaerdier i ni filer, og resultatet var fire slags faner, tre knap-former og
     en fokus-ring paa 1,12:1. Tokens under her er KONTRAKTEN. · */
  /* Kontrol-hoejder. 44 er husreglen og Apples/Googles minimum; 36 er til taette tabel-raekker
     paa PEGEUDSTYR og maa aldrig bruges som eneste target paa touch. */
  --s-tap:46px; --s-tap-sm:36px;
  /* Elevations-stige. Tre trin, ikke ni: flad (i flow), loeftet (kort), svaevende (overlay). */
  --s-e0:none;
  --s-e1:0 1px 2px rgba(20,35,26,.04), 0 4px 12px rgba(20,35,26,.05);
  --s-e2:0 6px 22px -8px rgba(28,27,23,.16);
  --s-e3:0 18px 44px -16px rgba(28,27,23,.28);
  /* Bevaegelse. En varighed til mikro-feedback, en til lag der kommer og gaar. Samme easing
     overalt, saa sitet bevaeger sig som EN ting. */
  --s-dur:.10s; --s-dur-lg:.16s; --s-ease:cubic-bezier(.2,.7,.3,1);
  /* Fokus-ringen som TOKEN. Den gamle --s-accent-soft-ring maalte 1,12:1 mod hvid og var reelt
     usynlig; denne er over 3:1 og virker paa baade lyse og moerke flader. */
  --s-focus:0 0 0 2px var(--s-surface), 0 0 0 4px var(--s-accent);
  /* Skrift-gulv. Audit fandt 22 stoerrelser under .6rem, ned til .42rem = 6,7px. Under .68rem
     (10,9px) loeser man ikke pladsproblemer, man skjuler information. · */
  --s-fs-min:.68rem;
  --s-font:"Inter","Plus Jakarta Sans",system-ui,sans-serif;
  --s-num:"Inter","Plus Jakarta Sans",system-ui,sans-serif;
  --s-shadow:0 1px 2px rgba(20,35,26,.04), 0 4px 12px rgba(20,35,26,.05);

  /* ══ DESIGN-SYSTEM, RUNDE 2 (redesign sep 2026) ═══════════════════════════════════════
     ⚠️ Maalt foer: 18 forskellige border-radius-vaerdier (inkl. 7, 9 og 11 px), ~25
     font-size-vaerdier, og 75 steder med ``border-radius:999px``. Naar alt er en pille,
     er intet fremhaevet, og naar hver komponent vaelger sin egen radius, ser siden
     samlet ud frem for designet. Tokens herunder er den ene stige. Nye komponenter
     bruger DEM, aldrig raa vaerdier. */

  /* AFSTAND. Én stige, 4-baseret. Stop med vilkaarlige margins. */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px;

  /* RADIUS. Fire trin plus pillen. ``--s-radius``/``--s-radius-sm`` beholdes som alias,
     saa eksisterende regler ikke skal roeres i samme commit. */
  --s-r-sm:8px; --s-r-md:12px; --s-r-lg:16px; --s-r-xl:16px; --s-r-pill:999px;

  /* TYPOGRAFI. Navngivne trin, saa en komponent ikke opfinder sin egen stoerrelse.
     Alt ligger paa eller over --s-fs-min (.68rem = 10,9px). */
  --s-t-display:1.75rem;   /* ét tal i en hero, aldrig broedtekst */
  --s-t-h1:1.75rem; --s-t-h2:1.375rem; --s-t-h3:1.125rem;
  --s-t-body:1rem;         /* body and analysis, 16px */
  --s-t-small:.8125rem;    /* 13px: sekundaer tekst */
  --s-t-label:.75rem;      /* 12px: etiketter, versaler */
  --s-t-caption:.75rem;    /* 12px: labels; secondary metadata uses --s-t-small */
  --s-t-metric-lg:1.5rem;  /* den ENE sandsynlighed en sektion handler om */
  --s-t-metric:1rem;  /* tal i en raekke */

  /* VAEGT. Kun tre. "Alt kan ikke vaere bold." */
  --s-w-reg:400; --s-w-med:500; --s-w-bold:650;

  /* RISIKO/STATUS som SMAA signaler, ikke flader. Farverne er de eksisterende; det nye
     er at de bruges til en prik eller en tynd streg, aldrig en stor farvet baggrund. */
  --s-risk-low:var(--s-pos); --s-risk-mid:var(--s-warn); --s-risk-high:var(--s-risk);

  /* APP-LAGET: hoejder paa de raekker der gentages. En fixture-raekke og en markeds-raekke
     skal have SAMME rytme, ellers scanner oejet forkert. */
  --s-row-h:56px;          /* kompakt raekke, mobil */
  --s-row-h-lg:64px;       /* raekke m. to linjer */
  --s-gutter:16px;         /* mobilens sidemargen, ÉT tal */
}

/* ══ FAELLES KOMPONENT-PRIMITIVER ════════════════════════════════════════════════════
   Alt herunder er delt af flere snippets. En ny side bruger dem i stedet for at skrive
   sin egen variant, saa "samme slags information" ogsaa SER ens ud. */

/* ⚠️ KAMPSIDEN HAR INGEN ``.sushi-app``-ROD. Maalt i browseren: paa match.html stod
   ``min-height`` paa 0 px for hver eneste ``.s-row``, fordi HELE komponent-laget haenger
   paa rod-klassen (CLAUDE.md: "Design-systemet gaelder KUN inde i .sushi-app ... Fem
   sidetyper havde ingen"). Kampsiden styles via body-klassen ``single-sushi_match``, saa
   hver komponent-regel naevner BEGGE. Uden det ser komponenterne rigtige ud i dumpen af
   app-siderne og staar ustylede paa den vigtigste side vi har. */
/* Tal-typografi: tabular numerals, saa kolonner af procenter og odds staar i lod. */
.sushi-app .s-num,.single-sushi_match .s-num,.sushi-app .s-pct,.single-sushi_match .s-pct,.sushi-app .s-odds,.single-sushi_match .s-odds,.sushi-app td.s-n,.single-sushi_match td.s-n,.sushi-app th.s-n,.single-sushi_match th.s-n{
  font-variant-numeric:tabular-nums lining-nums; font-feature-settings:"tnum" 1,"lnum" 1;}

/* SEKTIONS-HOVED. Titel + valgfri ÉN linje kontekst. Ikke tre saetninger. */
.sushi-app .s-sec,.single-sushi_match .s-sec{margin:var(--s-6) 0 var(--s-3);}
.sushi-app .s-sec h2,.single-sushi_match .s-sec h2,.sushi-app .s-sec h3,.single-sushi_match .s-sec h3{margin:0; line-height:1.25;--s-hlh:1.25;}
.sushi-app .s-sec-sub,.single-sushi_match .s-sec-sub{margin:var(--s-1) 0 0; font-size:var(--s-t-small); color:var(--s-muted);
  max-width:64ch;}

/* MARKEDS-RAEKKE: husets mest genbrugte komponent. Venstre = udfald, hoejre = tal + handling.
   Samme skema for maal, hjoerner, kort, skud, spiller-props og odds-siden. */
.sushi-app .s-row,.single-sushi_match .s-row{display:flex; align-items:center; gap:var(--s-3);
  min-height:var(--s-row-h); padding:var(--s-2) 0;
  border-bottom:1px solid var(--s-line-soft);}
.sushi-app .s-row:last-child,.single-sushi_match .s-row:last-child{border-bottom:0;}
.sushi-app .s-row-main,.single-sushi_match .s-row-main{flex:1 1 auto; min-width:0;}   /* min-width:0 = tekst maa forkortes */
.sushi-app .s-row-name,.single-sushi_match .s-row-name{font-size:var(--s-t-body); font-weight:var(--s-w-med); color:var(--s-ink);
  overflow-wrap:anywhere; hyphens:none;}
.sushi-app .s-row-sub,.single-sushi_match .s-row-sub{font-size:var(--s-t-caption); color:var(--s-muted); margin-top:1px;}
.sushi-app .s-row-val,.single-sushi_match .s-row-val{flex:0 0 auto; text-align:right; font-size:var(--s-t-metric);
  font-weight:var(--s-w-bold); color:var(--s-ink);
  font-variant-numeric:tabular-nums lining-nums;}
.sushi-app .s-row-val small,.single-sushi_match .s-row-val small{display:block; font-size:var(--s-t-caption); font-weight:var(--s-w-reg);
  color:var(--s-muted);}
.sushi-app .s-row-act,.single-sushi_match .s-row-act{flex:0 0 auto; display:flex; align-items:center;}

/* BYLINE: attribution er metadata. ⚠️ Den arvede broedtekst-stoerrelse og fyldte TO linjer
   oeverst paa hver kampside, foer noget om kampen. Den skal kunne findes, ikke laeses foerst. */
.sushi-app .sushi-byline,.single-sushi_match .sushi-byline{
  margin:0 0 var(--s-3,12px)!important;font-size:var(--s-t-caption,.6875rem)!important;
  line-height:1.4!important;color:var(--s-muted)!important;}
.sushi-app .sushi-byline b,.single-sushi_match .sushi-byline b{font-weight:600;}
.sushi-app .sushi-byline span,.single-sushi_match .sushi-byline span{margin-left:.35ch;}

/* PREDICTION SUMMARY: kompakt beslutnings-hoved. ⚠️ Foer brugte blokken en halv skaerm
   paa ét tal med et stort tomt felt omkring. Reglen er: ét kald, ét tal, én pris, én linje
   kontekst. Alt andet er raekker. */
.sushi-app .psum-head,.single-sushi_match .psum-head{
  position:relative;display:flex;flex-direction:column;gap:2px;
  padding:var(--s-4,16px) 0 var(--s-3,12px);border-bottom:1px solid var(--s-line-soft);}
.sushi-app .psum-k,.single-sushi_match .psum-k{
  font-size:var(--s-t-label,.75rem);font-weight:var(--s-w-bold,650);letter-spacing:.08em;
  text-transform:uppercase;color:var(--s-muted);}
.sushi-app .psum-main,.single-sushi_match .psum-main{
  display:flex;align-items:baseline;gap:var(--s-3,12px);flex-wrap:wrap;}
.sushi-app .psum-name,.single-sushi_match .psum-name{
  /* ⚠️ FLYDENDE, FORDI NAVNET NU HAR SIN EGEN STOERRELSE IGEN. Da skrift-gulvet holdt op
     med at klemme alt ned til foraelderens 16 px, stod "Brentford" paa 22 px og braekkede
     midt i ordet ved 320 px. Gulvet er husets brødtekst, loftet den designede h1. */
  font-size:clamp(var(--s-t-body,.9375rem),5.5vw,var(--s-t-h1,1.375rem));
  font-weight:var(--s-w-bold,650);color:var(--s-ink);
  line-height:1.2;overflow-wrap:break-word;word-break:normal!important;}
.sushi-app .psum-pct,.single-sushi_match .psum-pct{
  font-size:var(--s-t-metric-lg,1.5rem);font-weight:var(--s-w-bold,650);color:var(--s-ink);
  line-height:1.1;margin-left:auto;}
.sushi-app .psum-sub,.single-sushi_match .psum-sub{
  font-size:var(--s-t-small,.8125rem);color:var(--s-muted);}
/* Plusset foelger ejer-reglen for en BOKS: oeverst til hoejre, fast indryk. */
.sushi-app .psum-act,.single-sushi_match .psum-act{
  position:absolute;top:var(--s-3,12px);right:0;}
.sushi-app .psum-flat,.single-sushi_match .psum-flat{
  margin:var(--s-3,12px) 0 0;font-size:var(--s-t-small,.8125rem);color:var(--s-muted);}
/* "Model read" er LUKKET som standard: prosa maa ikke eje den foerste skaerm. */
.sushi-app .sm-psum-read>summary,.single-sushi_match .sm-psum-read>summary{
  display:flex;align-items:center;gap:var(--s-2,8px);cursor:pointer;list-style:none;
  padding:var(--s-3,12px) 0;}
.sushi-app .sm-psum-read>summary::-webkit-details-marker,
.single-sushi_match .sm-psum-read>summary::-webkit-details-marker{display:none;}
.sushi-app .sm-psum-read h4,.single-sushi_match .sm-psum-read h4{
  margin:0;font-size:var(--s-t-h3,1rem);font-weight:var(--s-w-med,560);--s-hfs:var(--s-t-h3,1rem);}
.sushi-app .sm-psum-read .chev,.single-sushi_match .sm-psum-read .chev{
  margin-left:auto;color:var(--s-faint);transition:transform var(--s-dur,.16s) var(--s-ease,ease);}
.sushi-app .sm-psum-read[open] .chev,.single-sushi_match .sm-psum-read[open] .chev{
  transform:rotate(180deg);}
.sushi-app .sm-psum-read p,.single-sushi_match .sm-psum-read p{
  margin:0 0 var(--s-4,16px);font-size:var(--s-t-small,.8125rem);line-height:1.6;
  color:var(--s-muted);max-width:68ch;}

/* RAEKKE-GRUPPEN: ét kort pr. markedsgruppe, ikke ét kort pr. marked.
   ⚠️ Foer laa hvert marked i sit eget kort i et grid. Fire markeder = fire rammer, fire
   skygger og fire tomme felter. Nu er GRUPPEN kortet og markederne dens raekker: samme
   information, en fjerdedel af pladsen, og en lodret liste man kan scanne. */
.sushi-app .s-block,.single-sushi_match .s-block{margin:0 0 var(--s-5,24px);}
.sushi-app .s-rows,.single-sushi_match .s-rows{background:var(--s-surface); border:1px solid var(--s-line);
  border-radius:var(--s-r-md,10px); padding:0 var(--s-4,16px); overflow:hidden;}
/* Hele raekken er klikbar naar den har et maal: man sigter ikke efter en 16 px pil. */
.sushi-app .s-row-link,.single-sushi_match .s-row-link{display:block; color:inherit; text-decoration:none!important;}
.sushi-app .s-row-link:hover .s-row-name,.single-sushi_match .s-row-link:hover .s-row-name{color:var(--s-accent-ink,#266a47);}

@media(max-width:560px){
  /* MOBIL: listen gaar til kanten. Den ER sidens indhold, ikke et kort paa en side.
     Det fjerner ét visuelt lag (kort-i-kort-i-side), som er en af de stoerste kilder
     til at fladen foeles tung. */
  /* ⚠️ Ingen gaettet bleed. En negativ margin skal kende foraelderens padding; gaetter den,
     klippes indholdet af side-skallen uden at siden overhovedet kan scrolles derhen.
     Maalt paa fixture-listen: 412 px indhold i en 390 px skaerm, usynligt. */
  .sushi-app .s-rows,.single-sushi_match .s-rows{border-left:0; border-right:0;
    border-radius:0; padding:0;}
}

/* RISIKO som PRIK. Ikke en overskrift, ikke en kasse, ikke en farvet flade. */
.sushi-app .s-risk,.single-sushi_match .s-risk{display:inline-flex; align-items:center; gap:6px;
  font-size:var(--s-t-caption); color:var(--s-muted); white-space:nowrap;}
.sushi-app .s-risk::before,.single-sushi_match .s-risk::before{content:""; width:7px; height:7px; border-radius:var(--s-r-pill);
  background:var(--s-faint); flex:0 0 auto;}
.sushi-app .s-risk--low::before,.single-sushi_match .s-risk--low::before{background:var(--s-risk-low);}
.sushi-app .s-risk--mid::before,.single-sushi_match .s-risk--mid::before{background:var(--s-risk-mid);}
.sushi-app .s-risk--high::before,.single-sushi_match .s-risk--high::before{background:var(--s-risk-high);}

/* CHEVRON: "tryk for detaljer", ikke "SE HER". Daempet, lille, aldrig accent-groen. */
.sushi-app .s-chev,.single-sushi_match .s-chev{flex:0 0 auto; width:16px; height:16px; color:var(--s-faint); opacity:.75;}

/* ⚠️ TEKST-KLEMME. Genereret tekst maa ALDRIG kunne saette komponentens hoejde.
   Uden det her braekker en lang agent-begrundelse hver eneste raekke i feedet. */
/* ⚠️ ``!important`` ER MED VILJE. En klemme er en UTILITY: den skal vinde over komponentens
   egen ``display``, ellers er den bare et forslag. Maalt paa ekstrem-navne-siden:
   ``.s-row-name.s-clamp-1`` stod med ``display:flow-root`` og klemte INTET, saa et langt
   markedsnavn braekkede raekken og raekkerne stod 55-84 px. */
.sushi-app .s-clamp-1,.single-sushi_match .s-clamp-1,.sushi-app .s-clamp-2,.single-sushi_match .s-clamp-2,.sushi-app .s-clamp-3,.single-sushi_match .s-clamp-3{
  display:-webkit-box!important; -webkit-box-orient:vertical; overflow:hidden;}
.sushi-app .s-clamp-1,.single-sushi_match .s-clamp-1{-webkit-line-clamp:1;}
.sushi-app .s-clamp-2,.single-sushi_match .s-clamp-2{-webkit-line-clamp:2;}
.sushi-app .s-clamp-3,.single-sushi_match .s-clamp-3{-webkit-line-clamp:3;}

/* ══ IKONER STAAR NOEGNE ══════════════════════════════════════════════════════════════
   ⚠️ Ejer-oenske sep 2026: "ingen baggrundsfarver bag vores ikoner". Sitet satte vores
   egne SVG-ikoner i farvede cirkler og afrundede felter (accent-soft, graa, gul), saa et
   ikon fyldte 34-54 px for at vise en 18 px glyf - og to ikoner ved siden af hinanden
   lignede to KNAPPER frem for to maerker. Glyfen baerer betydningen; feltet bag den bar
   ingenting. Ikon-registret (``sushi_icon_defs``) kan desuden erstattes af ejeren, og en
   erstatning skal ikke arve en baggrund den ikke har bedt om.
   Gaelder VORES ikon-holdere. Klub-crests og liga-maerker er billeder, ikke ikoner, og
   roeres ikke (de har deres egen reserverede boks). */
.sushi-app .ic,.single-sushi_match .ic,
.sushi-app .sf-tr .ic,.sushi-app .sf-kpi .ic,.sushi-app .st-pc .ic,
.sushi-app .st-edit-h .ic,.sushi-app .st-lock-ic,.sushi-app .st-legs-empty-ic{
  background:none!important; border:0!important; border-radius:0!important;
  width:auto!important; height:auto!important; padding:0!important;}
.sushi-app .ic svg,.single-sushi_match .ic svg{display:block;}

/* ══ ENTITETS-KONTRAKT: ET HOLDNAVN BRAEKKER ALDRIG ════════════════════════════════════
   ⚠️ Dette er en INVARIANT, ikke en stil. Ejerens skaermbilleder viste "Manchest/er City",
   "Brist/ol City", "Linc/oln" og "Mill/wall" - fordi hver komponent selv bestemte hvordan
   den ville haandtere for lidt plads, og de daarligste valgte ``overflow-wrap:anywhere``.
   ⚠️ REGLERNE ER BEVIDST USCOPEDE (ingen ``.sushi-app``-praefiks). Komponenten er et BLAD:
   den skal opfoere sig ens uanset hvilken sidetype den lander paa, og kampsiden viste
   praecis hvad der sker ellers - hele komponent-laget var dødt dér, fordi roden manglede.
   Klassenavnene (``s-team*``) er vores egne og kan ikke kollidere med temaet.
   Reglen her gaelder hele sitet og kan ikke slaas fra af en enkelt side:
     mangler der plads, vaelger PHP en KORTERE FORM (sushi_team_name), og sidste udvej er
     ellipsis. Bogstaverne i et klubnavn deles ALDRIG. */
.s-team{
  display:inline-flex; align-items:center; gap:var(--s-2,8px); min-width:0; max-width:100%;}
/* Fast boks: crestet ligger OVEN PAA initialerne, saa hoejden er den samme uanset om det
   eksterne billede naaede frem. Et manglende logo er et dempet maerke, aldrig et hul. */
.s-team-crest{
  position:relative; flex:0 0 auto; width:var(--cs,18px); height:var(--cs,18px);
  display:inline-flex; align-items:center; justify-content:center; line-height:0;}
.s-team-ini{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:calc(var(--cs,18px) * .46); font-weight:650; letter-spacing:-.02em;
  color:var(--s-faint); background:var(--s-line-soft); border-radius:4px;}
.sushi-app .s-team-crest img,.single-sushi_match .s-team-crest img,
.sushi-app .s-team-crest svg,.single-sushi_match .s-team-crest svg,
.sushi-app .s-team-crest .sushi-badge,.single-sushi_match .s-team-crest .sushi-badge{
  position:relative; z-index:1; width:var(--cs,18px)!important; height:var(--cs,18px)!important;
  object-fit:contain; margin:0!important; vertical-align:middle!important;}
.sushi-app .s-team-crest img,.single-sushi_match .s-team-crest img,
.sushi-app .s-team-crest .sushi-badge,.single-sushi_match .s-team-crest .sushi-badge{
  margin:0!important; vertical-align:middle!important;}
.s-team-name{
  min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  word-break:normal!important; overflow-wrap:normal!important; hyphens:none!important;}

/* Samme invariant paa ALT der baerer et entitets-navn, uanset hvilken komponent det er.
   ⚠️ ``anywhere`` og ``break-all`` er forbudt her: de er praecis det der saver ordet over. */
.sushi-app .fxs-team,.single-sushi_match .fxs-team,
.sushi-app .ff-teams .t span,.single-sushi_match .ff-teams .t span,
.sushi-app .sm-team b,.single-sushi_match .sm-team b,
.sushi-app .s-row-name,.single-sushi_match .s-row-name{
  word-break:normal!important; overflow-wrap:break-word!important; hyphens:none!important;}

/* ⚠️ HOLDNAVNE MAA ALDRIG BRAEKKE MIDT I ET ORD ("Manchest/er City").
   Den opstaar naar en flex-kolonne mangler min-width:0 og faar word-break:break-all paa
   som plaster. Reglen her er den rigtige: bryd mellem ORD, aldrig inde i et. */
.sushi-app .s-team,.sushi-app .s-row-name,.sushi-app .s-fx-team{
  word-break:normal!important; overflow-wrap:break-word; hyphens:none;}

/* · page canvas (only our pages) · */
body.single-sushi_match,body.post-type-archive-sushi_match,.sushi-app{
  background:var(--s-bg); color:var(--s-ink); color-scheme:light;
  font-family:var(--s-font); font-size:var(--s-t-body); font-weight:var(--s-w-reg); -webkit-font-smoothing:antialiased; line-height:1.55;
  -webkit-tap-highlight-color:transparent; -webkit-text-size-adjust:100%;
}

/* · content rhythm & headings (scoped to our content) · */
/* .sushi-app saetter INGEN bredde. Klassen giver skrift, links, fokus og tap-highlight - den
   er en identitet, ikke et layout. Foer stod her max-width:46rem, og fordi det klemte de brede
   sider blev der lagt en .sushi-app.sushi-board{max-width:none}-liste ovenpaa. Den liste vandt
   saa paa specificitet (0,2,0) over hver sides EGEN cap (0,1,0), og dermed mistede boardet sine
   1180, indstillingerne sine 820 og sporet sine 1080: alle sider laa pludselig i fuld
   container-bredde. Praecis den faelde CLAUDE.md advarer mod. Laesemaalet paa 46rem hoerer til
   PROSA og staar derfor kun paa de rødder der faktisk er prosa. */
.single-sushi_match .entry-content{max-width:46rem;}
.sushi-app{margin-inline:auto;}
/* De to roedder der ALDRIG har haft en egen bredde: uden en cap her ville de gaa fra 46rem til
   fuld container. Alle andre app-roedder saetter selv deres bredde i deres egen snippet. */
.sushi-app.sushi-value{max-width:1180px;}
.sushi-app.sushi-ledger{max-width:1040px;}
.single-sushi_match .entry-content > p:first-of-type{font-size:1.06rem; color:var(--s-muted);}
.single-sushi_match .entry-content h3,.sushi-app h3{
  font-size:var(--s-t-h3); font-weight:600; letter-spacing:-.01em; margin:calc(var(--s-gap) + 6px) 0 .6em;--s-hfs:var(--s-t-h3);}
.single-sushi_match .entry-content h4,.sushi-app h4{
  font-size:var(--s-t-h3); font-weight:600; letter-spacing:-.005em; color:var(--s-ink);
  margin:var(--s-gap) 0 .55em;--s-hfs:var(--s-t-h3);}
.single-sushi_match .entry-content h5,.sushi-app h5{
  font-size:.74rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em;
  color:var(--s-faint); margin:1.3em 0 .5em;--s-hfs:.74rem;}
/* Visuelt-skjult men skærmlæser-synlig (audit jul 2026): giver match-parent en ægte h1
   uden at ændre det designede hero (Astra-titlen er CSS-skjult på app-sider). */
/* Pin the clipped label to its containing block. Its implicit static position could
   otherwise widen a no-JS page from inside an offscreen carousel item. */
.sushi-sr{position:absolute!important;inset:0 auto auto 0!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
/* Den generiske link-farve. RØR IKKE specificiteten her (0,1,1): et forsoeg paa at undtage
   knapper med :not(.sushi-btn) lagde argumentets specificitet oveni -> (0,2,1), og saa slog
   reglen forsidens .sushi-front .sf-btn--green (0,2,0), som blev groen tekst paa groen bund.
   Knapperne vinder i stedet paa DERES side, via a.sushi-btn.sushi-btn--* i snippet 48. */
/* ⚠️ HAARLINJEN ER EN INSET-SKYGGE, ALDRIG EN BORDER (audit 11/9 2026).
   Den var `border-bottom:1px solid transparent`, og en border paa hvert eneste <a> gaar i
   krig med ethvert anker der tegner sin EGEN kasse: et kort, en KPI-flise, en medalje. Ni
   snippets slukkede den derfor med `border-bottom:0!important`, og DEN regel aad saa kortets
   egen bundkant. Maalt paa dumpen: 30+ kort-formede links stod med ramme paa tre sider og
   INGEN bund, paa forsiden og begge predictions-sider.
   En inset-skygge tegner samme streg, men kan ikke kollidere med en border og optager ingen
   plads i box-modellen. Det er samme greb projektet allerede bruger til skillelinjer.
   Konsekvens: de gamle `border-bottom:0!important`-regler er unoedvendige, og de er fjernet
   der hvor de aad en kasse. */
/* ⚠️ `text-decoration:none` SKAL vaere !important. Temaets `.entry-content a{text-decoration:
   underline}` vejer (0,1,1) praecis som `.sushi-app a`, og ved lige specificitet vinder den
   der staar sidst: paa det live site er det temaet. Uden !important stod HVER eneste
   kort-raekke, tal og pille understreget (ejer-fund 11/9 2026, set paa markeds-siden).
   CLAUDE.md dokumenterer allerede greb og aarsag for forsidens links; her ligger det ÉT sted
   for hele sitet i stedet for pr. side. Et link der VIL understreges (fx foden i baren) goer
   det med sin egen !important-regel og en hoejere specificitet. */
.single-sushi_match .entry-content a,.sushi-app a{
  color:var(--s-accent); text-decoration:none!important;
  transition:box-shadow var(--s-dur) var(--s-ease);
}
/* ⚠️ FARVE-PINNET GAELDER KUN PROSA-LINKS, OG DET ER HELE POINTEN. Temaets
   ``.entry-content a{color:...}`` vejer praecis det samme som vores og staar senere, saa
   den vandt: 156 links stod i temaets blaa. Et ``!important`` paa ALLE links lukkede det,
   men slog samtidig hver eneste komponent-farve ihjel, fordi de er skrevet uden important.
   Maalt i browseren 11/9 2026: 27 link-familier fik tvunget accent-groen paa sig, deriblandt
   hvert kort-link (der vil have ``--s-ink``), forsidens groenne CTA (der vil have hvid) og
   den AKTIVE facet-pille (hvid paa accent) - sidstnaevnte blev dermed en ensfarvet groen
   klat uden laesbar tekst, kontrast 1,00:1 (ejer-fund samme dag).
   Et link MED en klasse har pr. definition sin egen regel og skal bestemme selv; det er kun
   det UKLASSEDE prosa-link temaet kan naa uimodsagt. Det er praecis det skel her.
   ⚠️ OG DEN HAEVER IKKE SPECIFICITETEN. ``:not([class])`` ville lægge (0,1,0) oveni, og en
   tidligere session laaste netop det fordi en haevet link-regel slog ``.sf-btn--green`` (0,2,0)
   ihjel. ``:where()`` bidrager med NUL, saa reglen bliver staaende paa (0,1,1): den slaar
   temaet (ikke-important taber altid til important), men taber paa raekkefoelge til enhver af
   VORES egne pinnede regler, fordi snippet 40-99 alle staar efter 50. */
.single-sushi_match .entry-content a:where(:not([class])),.sushi-app a:where(:not([class])){
  color:var(--s-accent-ink)!important;
}
/* Inline prose and footer links must remain identifiable without colour alone.
 * Component/card controls keep their own visual treatment. Saved designs still
 * occupy their existing later cascade positions. */
:is(.sushi-app,.single-sushi_match .entry-content) :is(p,.sushi-data-links) a:where(:not([class])),
.sushi-app .sf-clean-note>a{ text-decoration:underline!important;text-underline-offset:3px; }
.sushi-app.fxs .fxs-tabs:focus-visible{outline:2px solid var(--s-accent-ink);outline-offset:2px;}
/* ⚠️ INGEN ``box-shadow`` I HVILE HER. Reglen vejer (0,2,1) og satte foer
   ``inset 0 -1px 0 transparent`` paa HVERT link, hvilket slog kortenes egne hvile-skygger
   ((0,2,0)) ihjel: maalt 11/9 2026 stod 34 kort-links paa forsiden, 143 paa predictions,
   51 paa fixtures og 6 paa markeds-siden HELT uden elevation. Haarlinjen animerer fint fra
   ``none``, saa hvile-erklaeringen kostede kun kortene deres dybde.
   ⚠️ Og ``color`` er pinnet nu: temaets ``.entry-content a{color:...}`` vejer PRAECIS det
   samme (0,1,1) og staar senere, saa 156 links paa tvaers af de 28 sidetyper stod i temaets
   blaa. Det er samme argument som understregningen, bare paa farven. Links der VIL noget
   andet saetter allerede ``color:inherit!important`` og er upaavirkede. */
@media (hover:hover){.single-sushi_match .entry-content a:hover,.sushi-app a:hover{
  box-shadow:inset 0 -1px 0 var(--s-accent);}}
.single-sushi_match .entry-content a:focus-visible,.sushi-app a:focus-visible{outline:2px solid var(--s-accent); outline-offset:2px; border-radius:3px;}
/* INGEN understregning i knapper eller overskrifter - noget sted. To kilder skulle lukkes:
   temaets egen .entry-content a{text-decoration:underline} (0,1,1), som slog .sushi-btn (0,1,0)
   og gav "Change password" en understregning, OG vores egen hover-haarlinje (border-bottom)
   herover, som ellers ville tegne en streg under et link i en overskrift. [class*="btn"] fanger
   hele knap-familien (sushi-btn, sf-btn, st-btn, eb-sel-btn ...) uden en liste der kan blive
   forældet. !important fordi temaet ogsaa kan bruge det. */
.sushi-app [class*="btn"],.single-sushi_match .entry-content [class*="btn"],
.sushi-app :is(h1,h2,h3,h4,h5,h6),.single-sushi_match .entry-content :is(h1,h2,h3,h4,h5,h6),
.sushi-app :is(h1,h2,h3,h4,h5,h6) a,.single-sushi_match .entry-content :is(h1,h2,h3,h4,h5,h6) a{
  text-decoration:none!important; box-shadow:none!important;
}
/* kamp-links (round/uge13/ranked): arver tekstfarve, ikke blå/grøn; subtil hover */
a.sushi-mlink{color:inherit!important; text-decoration:none!important; box-shadow:none!important;}
@media (hover:hover){a.sushi-mlink:hover{color:var(--s-accent)!important;}}

/* · data tables: clean rows, NO header fill, hairline dividers, plenty of air · */
table.sushi{
  width:100%; border-collapse:separate; border-spacing:0; margin:.6em 0 1.4em;
  font-size:.92rem; background:var(--s-surface); border:1px solid var(--s-line);
  border-radius:var(--s-radius); box-shadow:var(--s-shadow); overflow:hidden;
}
table.sushi th,table.sushi td{
  padding:.62em .9em; text-align:left; border:0; border-bottom:1px solid var(--s-line-soft);
  vertical-align:baseline;
}
table.sushi tr:last-child th,table.sushi tr:last-child td{border-bottom:0;}
table.sushi thead th{
  font-size:.7rem; font-weight:600; text-transform:uppercase; letter-spacing:.05em;
  color:var(--s-faint); background:transparent; border-bottom:1px solid var(--s-line);
}
table.sushi tbody th{color:var(--s-muted); font-weight:500;}          /* inline labels */
table.sushi td{color:var(--s-ink); font-weight:560; font-variant-numeric:tabular-nums;}
table.sushi td:first-child,table.sushi th:first-child{padding-left:1.1em;}
table.sushi td:last-child,table.sushi th:last-child{padding-right:1.1em;}
/* ⚠️ TOKEN, IKKE HEX. #faf9f6 er fra den VARME palet, som blev droppet for den koelige
   (--s-bg:#f5f7f8), og den stod i selve filen der forbyder raa hex. */
@media (hover:hover){table.sushi tbody tr:hover{background:var(--s-bg);}}   /* hover kun på pegeudstyr (touch sidder ikke fast) */

/* ── APP-LAGET: faelles adfaerd for HELE sitet (aug 2026) ────────────────────────────────
   Reglerne her er bevidst faa og bevidst brede. De loeser problemer der ellers skulle loeses
   igen i hver enkelt snippet, og som derfor blev loest FORSKELLIGT ni steder. ── */

/* 1) EN synlig fokus-ring overalt. Tastaturbrugere kunne foer ikke se hvor de var paa
      sidebar-toggle, bankroll-felter og odds-felter, og "erstatnings-ringen" var usynlig. */
.sushi-app :focus-visible,[class*="sushi-"] :focus-visible,
.sushi-app:focus-visible,[class*="sushi-"]:focus-visible{
  outline:2px solid var(--s-accent); outline-offset:2px; border-radius:6px;
}
/* ⚠️ ET BILLED-IKON MAA ALDRIG BLIVE STOERRE END SIN VAERT. Hele sitet sizer ikoner med
      selektorer paa ``svg`` (``.ic svg{width:21px}``), og et <img> matcher ingen af dem, saa
      en PNG fra mediebiblioteket blev tegnet i sin NATURLIGE stoerrelse. Render-siden giver
      den nu registrets dokumenterede px; det her er sikkerhedsnettet, saa den under ingen
      omstaendigheder kan vokse ud af boksen den staar i. */
/* ⚠️ OG NETTET MAA ALDRIG SIGE ``width:auto``. CSS slaar HTML-attributter, saa ``width:auto``
      ophaevede netop de ``width="18" height="18"`` render-siden saetter, og billedet faldt
      tilbage til sin naturlige stoerrelse: maalt paa det live site 16/10 2026, da ejerens
      .webp-ikoner kom paa, stod chevronen 256 px og et nav-ikon 1.254 px paa 21 steder.
      Loftet er ``max-*``; stoerrelsen er attributten, eller vaertens egen regel.
   ⚠️ INGEN KASSE BAG ET BILLED-IKON (ejer-krav 16/10 2026: "ingen kasser bag ikoner, vi har
      gjort dem gennemsigtige selv"). Temaet giver ethvert <img> i en artikel en 30 px skygge
      (``.ast-article-single img``), saa hvert bogmaerke stod paa en grå flise. */
[class*="sushi-"] .sushi-ico-img{
  max-width:100%; max-height:100%;
  object-fit:contain; vertical-align:middle; flex:0 0 auto;
  background:transparent !important; box-shadow:none !important;
  border:0 !important; border-radius:0 !important;
}
/* Vaerter der KUN baerer ikonet og selv maler en flise eller cirkel. Stoerrelsen bliver, saa
   intet flytter sig; malingen gaar. En SVG-fallback beholder sin oprindelige flise. */
[class*="sushi-"] :is(.st-dico,.sm-shield):has(> .sushi-ico-img){
  background:transparent !important; box-shadow:none !important;
}

/* 2) Skrift-gulv paa alt der kan TRYKKES eller LAESES som data. Ren dekoration maa gerne
      vaere mindre; en label, et tal eller en knap maa ikke. */
[class*="sushi-"] button,[class*="sushi-"] a,[class*="sushi-"] label,
[class*="sushi-"] input,[class*="sushi-"] select,[class*="sushi-"] textarea,
/* ⚠️ OGSAA DE ELEMENTER DER BAERER TAL OG LABELS. Gulvet daekkede kun det klikbare, saa
   315 <small> og 315 <span class="fxs-lg"> stod paa 9,92 px og MISS-chipperne paa 9,6 px:
   under .68rem loeser man ikke et pladsproblem, man skjuler information. Ren dekoration
   (::before, ikoner) er uroert, for den baerer ikke data. */
/* ⚠️ ``max(var(--s-fs-min),1em)`` ER IKKE ET GULV. ``1em`` i en ``font-size`` oploeses mod
   FORAELDEREN, ikke mod elementets egen erklaerede stoerrelse, saa udtrykket er i praksis
   "saet stoerrelsen til foraelderens". Og reglen vejede (0,2,1) og slog dermed hver eneste
   komponent-regel (0,2,0). Maalt paa kampsiden: 212 af 431 klassede span/i/b stod paa
   foraelderens stoerrelse i stedet for deres egen. "43,4 %" i pris-opsummeringen stod 16 px
   hvor 50s EGEN typeskala 293 linjer hoejere oppe siger 24 px; kickoff 12,8 mod 18,4;
   "Model top convictions" 16 mod 12; sektions-navens faner 16 mod 13,1, hvilket alene
   gjorde stribens indhold 446 px bredt i et 380 px felt.
   ⚠️ OG DET VAERSTE: fejlen gjorde vores EGEN skrift-gulv-maaling groen. ux_sweep fandt intet
   for smaat, fordi reglen havde pustet alt op til foraelderens stoerrelse. En laas der
   aldrig er set roed er ikke en laas (Q-01), og her var det laasen selv der skjulte fundene.
   ``:where()`` bidrager med NUL specificitet: gulvet gaelder stadig alt der ikke selv har
   sagt en stoerrelse, og enhver komponent der HAR sagt det vinder. De komponenter der
   derefter stod under gulvet er rettet ved KILDEN i samme commit, for det er der de hoerer. */
/* ⚠️ OG ``[class]`` UDEN FOR ``:where()`` ER STADIG (0,1,0). Halvdelen af fejlen overlevede
   foerste rettelse: et attribut-vaelg uden for parentesen vejer praecis som ÉN klasse, saa
   gulvet vandt over enhver komponent-regel med ét klassenavn der stod TIDLIGERE i
   stylesheet-raekkefoelgen. Maalt paa kampsiden 375px: ``.sm-side-foot`` (og dens
   ``.sm-dec-why``) stod 16px - foraelderens stoerrelse - hvor mobil-blokkens egen regel
   siger 11px, saa heroens fod laeste som to forskellige tekststoerrelser paa to
   baselinjer. Hele vaelgeren hoerer i ``:where()``. */
:where([class*="sushi-"]) :where(small,th,td),
:where([class*="sushi-"]) :where(span[class],i[class],b[class]){
  font-size:max(var(--s-fs-min),1em);
}
/* 3) Touch-gulv paa formular-kontroller. Tabeller maa bruge --s-tap-sm paa pegeudstyr, men
      aldrig paa touch, hvor fingeren ikke er 3px bred. */
@media (pointer:coarse){
  /* :not(.sushi-add) er et LIVE-fund (aug 2026, kun synligt paa touch/DevTools-emulering):
     min-height alene strakte den RUNDE tilfoej-knap til en 26x44-oval paa hver eneste
     kampside, mens alle muse-maalinger saa den perfekt. Knappen ejer sine egne
     touch-stoerrelser i 44 (baade bredde OG hoejde, saa den forbliver en cirkel). */
  [class*="sushi-"] button,[class*="sushi-"] select,[class*="sushi-"] input:not([type="checkbox"]):not([type="radio"]),
  [class*="sushi-"] [role="button"]:not(.sushi-add){min-height:var(--s-tap);}
  /* ⚠️ OG LINKS. Gulvet stod kun paa formular-kontroller, saa maalte tap-maal var 24 px paa
     agent-navnene i ranglisten og 21 px paa "All fixtures" i kommando-baren, mod projektets
     eget gulv paa 44. Kun blok-/flex-satte links: et link MIDT i en saetning maa ikke vokse
     til 44 px og braekke linjehoejden, saa inline-links er uroerte. */
  /* ⚠️ --s-tap-sm er "lille paa en MUS", ikke "lille altid": paa touch loeftes den til det
     fulde gulv. Fem regler i 47 stod med et haardkodet 24 px og vandt paa specificitet, saa
     "All matches ->" og agent-navnene laa paa 24-30 px paa en telefon. Tokenet omdefineres
     her i stedet for at jage hver regel: en ny lille-target arver rettelsen automatisk. */
  [class*="sushi-"]{--s-tap-sm:var(--s-tap);}
  [class*="sushi-"] a:not(.sushi-add){min-height:var(--s-tap);}
  /* ⚠️ DEN HER REGEL GJORDE HELE SITET SKAEVT PAA EN TELEFON, OG DUMPEN KUNNE IKKE SE DET.
     Den vejede (0,3,1) og satte ``align-items:center`` paa ETHVERT link, altsaa ogsaa paa
     hvert kort-formet link der selv siger ``align-items:flex-start`` (KPI-fliserne,
     kupon-benene, niche-raekkerne, kampsidens raekker: 20+ komponenter vejer (0,1,0) og
     tabte alle). Maalt paa forsiden i en TOUCH-kontekst: KPI-tallenes venstrekanter stod
     34 / 218,1 / 34 / 238,6 px, altsaa 20,5 px fra hinanden i samme kolonne.
     ⚠️ Og den var USYNLIG i alle vores maalinger, fordi hele blokken her staar bag
     ``@media (pointer:coarse)`` og dumpen som standard er en MUS.
     ``:where()`` bidrager med NUL specificitet, saa reglen er nu (0,0,0): et link uden en
     egen layout-regel bliver stadig centreret i sit 44 px felt, og enhver komponent der
     selv har sagt hvordan den ligger, vinder. Samme greb som link-farve-pinnet.
     ``min-height`` bliver paa fuld specificitet: DET er platform-gulvet der skal vinde. */
  :where([class*="sushi-"] a:not(.sushi-add):not([class*="btn"])){
    display:inline-flex;align-items:center;}
  [class*="sushi-"] p a,[class*="sushi-"] li a,[class*="sushi-"] span > a,
  [class*="sushi-"] td a,[class*="sushi-"] .sushi-disc a{min-height:0;display:inline;}
  [class*="sushi-"] input[type="checkbox"],[class*="sushi-"] input[type="radio"]{min-width:20px;min-height:20px;}
  /* ⚠️ 16px ER GRAENSEN, ikke en smagssag: iOS Safari zoomer ind paa hele siden naar man
     rammer et felt med mindre skrift, og den zoomer ALDRIG ud igen af sig selv. Brugeren
     staar tilbage paa en side der pludselig er for bred, og det er det tydeligste tegn paa
     "det her er en hjemmeside, ikke en app". Maalt 11/9 2026: seks felter paa settings- og
     tracker-siderne laa paa 13,1-14,7 px. Reglen bor HER, saa et nyt felt arver den.
     !important er med vilje: en sides egen .st-curh{font-size:.82rem} vinder ellers paa
     specificitet, og saa er gulvet kun et forslag. Dette er en PLATFORM-graense, ikke en
     smagssag, saa den maa ikke kunne overskrives af en enkelt side. */
  [class*="sushi-"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  [class*="sushi-"] select,[class*="sushi-"] textarea{font-size:max(16px,1em)!important;}
}
/* 4) Ingen tekst-markering ved dobbelt-tap paa kontroller (foeles som en app, ikke et dokument). */
[class*="sushi-"] button,[class*="sushi-"] [role="button"],[class*="sushi-"] summary{
  -webkit-user-select:none; user-select:none; -webkit-tap-highlight-color:transparent;
}
/* Native touch scrolling. A finger starting a scroll also activates its card or
 * link, so scaling :active made whole sections shrink and grow on release.
 * Keep touch targets and local horizontal scrolling, without a zoom effect. */
@media (pointer:coarse){
  [class*="sushi-"] a,[class*="sushi-"] button,[class*="sushi-"] [role="button"],
  [class*="sushi-"] summary,[class*="sushi-"] label{touch-action:manipulation;}
  /* Scrollere holder deres egen gestus: overscroll-behavior stopper kaeden ved elementet. */
  [class*="sushi-"] .st-wrap,[class*="sushi-"] .sm-csgrid,[class*="sushi-"] .sushi-scroll,
  [class*="sushi-"] [class$="-wrap"]{overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch;}
}
@media (prefers-reduced-motion:reduce){
  [class*="sushi-"] button:active,[class*="sushi-"] [role="button"]:active,
  [class*="sushi-"] .sushi-btn:active,[class*="sushi-"] .sm-card:active,
  .sushi-add:active{transform:none;}
}
/* 5) EN bevaegelse. Alt der reagerer paa pegeudstyr bruger samme varighed og easing, saa
      sitet ikke har tre forskellige hastigheder side om side. */
@media (hover:hover){
  [class*="sushi-"] a,[class*="sushi-"] button,[class*="sushi-"] label,[class*="sushi-"] summary{
    transition:color var(--s-dur) var(--s-ease),background-color var(--s-dur) var(--s-ease),
               border-color var(--s-dur) var(--s-ease),box-shadow var(--s-dur) var(--s-ease),
               transform var(--s-dur) var(--s-ease);
  }
}
/* Touch must not scale a control or the large card underneath a scroll gesture.
 * Important also defeats older local button/bookmark press defaults. Rotated
 * disclosure chevrons, probability pulses and admin preview scaling stay intact. */
@media (pointer:coarse){
  :is(.sushi-app,.sm) :is(a,button,[role="button"],summary,label,.sm-card):active,.sushi-add:active{
    transform:none!important;
  }
}
@media (prefers-reduced-motion:reduce){
  [class*="sushi-"] *{transition-duration:.01ms!important;animation-duration:.01ms!important;
    animation-iteration-count:1!important;}
  [class*="sushi-"] a:active,[class*="sushi-"] button:active{transform:none;}
}
/* 7) SEGMENTED CONTROL: EN kanonisk vaelger. Repoet havde fire (fyldt groen pille, understregning,
      aria-selected-pille, radio-labels), og de stod side om side i navigationen. Denne er
      standarden fremover: skinne + glidende markoer, som i en native app. */
.sushi-seg{display:inline-flex;align-items:stretch;gap:2px;padding:3px;border-radius:999px;
  background:var(--s-bg);border:1px solid var(--s-line);max-width:100%;overflow-x:auto;
  scrollbar-width:none;-ms-overflow-style:none;}
.sushi-seg::-webkit-scrollbar{display:none;}
.sushi-seg>*{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:.5ch;
  min-height:38px;padding:0 14px;border:0;background:none;border-radius:999px;cursor:pointer;
  font:inherit;font-size:.85rem;font-weight:620;line-height:1;color:var(--s-muted);white-space:nowrap;}
.sushi-seg>.is-on,.sushi-seg>[aria-selected="true"],.sushi-seg>[aria-pressed="true"]{
  background:var(--s-surface);color:var(--s-ink);font-weight:700;box-shadow:var(--s-e1);}
@media (hover:hover){.sushi-seg>*:hover{color:var(--s-ink);}}
@media (pointer:coarse){.sushi-seg>*{min-height:var(--s-tap);}}

/* 8) KOMPAKT-TILSTAND. Kontakten i settings skal have en virkning, ellers er den tom.
      Den strammer RYTMEN (padding, raekkehoejde, kort-luft), aldrig skriftstoerrelsen: at goere
      teksten mindre er praecis den fejl type-gulvet ovenfor findes for at forhindre. */
body.sushi-compact [class*="sushi-"]{--s-pad:15px;--s-gap:17px;}
body.sushi-compact table.sushi th,body.sushi-compact table.sushi td{padding:.42em .75em;}
body.sushi-compact .sushi-honest{padding:15px 17px;margin:17px 0;}
body.sushi-compact [class*="sushi-"] .set-row,body.sushi-compact [class*="sushi-"] .set-field{padding:11px 0;}

/* 7c) INGEN LISTE-MARKOERER I VORES EGNE KOMPONENTER (ejer-fund 11/9 2026: "hvad fanden er
      de bullets?"). Komponenterne satte `list-style:none` paa <ul>, men temaet saetter den
      paa <li>, og en regel paa barnet slaar en arvet vaerdi fra foraelderen. Resultatet var
      sorte prikker foran hver raekke i elleve lister paa otte sider.
      ⚠️ Kun lister MED en klasse: det er vores egne komponenter. En bar <ul> i broedtekst
      (metode-siden, admin-hjaelpen) er en rigtig punktliste og skal beholde sine prikker. */
[class*="sushi-"] ul[class],[class*="sushi-"] ol[class],
[class*="sushi-"] ul[class]>li,[class*="sushi-"] ol[class]>li{
  list-style:none!important;
}
[class*="sushi-"] ul[class],[class*="sushi-"] ol[class]{padding-left:0!important;}

/* 8a) ÉN HOVER-KONTRAKT FOR KORT-FORMEDE LINKS (ejer-krav 11/9 2026: "gør det site wide
      ens flot, dem med grønne omrids").
      Foer laa der mindst otte forskellige varianter spredt i ni snippets: nogle loeftede
      2 px, nogle 1 px, nogle skiftede kun rammefarve, nogle skiftede farve OG baggrund, og
      to skygger var haandskrevne rgba-vaerdier i stedet for elevations-tokenet. Et site der
      reagerer forskelligt paa den samme handling foeles ustabilt.
      KONTRAKTEN: groen ramme uden loeft eller ekstra skygge. Kun paa
      pegeudstyr (en finger "hover" ikke), og bevaegelsen respekterer reduced-motion via
      reglen laengere nede. Listen er de kort-formede links sitet FAKTISK har; en ny slags
      kort skal skrives ind her i stedet for at faa sin egen variant. */
@media (hover:hover){
  .sushi-app a.sf-kpi:hover,.sushi-app a.pcard:hover,.sushi-app a.bb:hover,
  .sushi-app a.rc:hover,.sushi-app a.bc:hover,.sushi-app a.gc-row:hover,
  .sushi-app a.sf-learn:hover,.sushi-app a.fx-card:hover,.sushi-app a.fxs-row:hover,
  .sushi-app a.tt-card:hover,.sushi-app a.pb-card:hover,.sushi-app a.eb-medal:hover,
  .sushi-app a.eb-ml-row:hover,.sushi-app a.fx-more-btn:hover,.sushi-app a.mk-other:hover,
  .sushi-app a.mk-read:hover,.sushi-app a.mk-agent:hover{
    border-color:var(--s-accent)!important;
    transform:none;
  }
}
/* Overgangen hoerer paa hvile-tilstanden, ellers "snapper" kortet tilbage uden animation. */
.sushi-app a.sf-kpi,.sushi-app a.pcard,.sushi-app a.bb,.sushi-app a.rc,.sushi-app a.bc,
.sushi-app a.gc-row,.sushi-app a.sf-learn,.sushi-app a.fx-card,.sushi-app a.fxs-row,
.sushi-app a.tt-card,.sushi-app a.pb-card,.sushi-app a.eb-medal,.sushi-app a.eb-ml-row,
.sushi-app a.fx-more-btn,.sushi-app a.mk-other,.sushi-app a.mk-read,.sushi-app a.mk-agent{
  transition:border-color var(--s-dur) var(--s-ease),background-color var(--s-dur) var(--s-ease),color var(--s-dur) var(--s-ease);
}
/* Tastatur skal se det SAMME. En fokus-ring alene siger ikke "det her er et kort du kan
   aabne", og en bruger der tabber sig gennem siden fortjener samme signal som musen. */
.sushi-app a.sf-kpi:focus-visible,.sushi-app a.pcard:focus-visible,.sushi-app a.bb:focus-visible,
.sushi-app a.fx-card:focus-visible,.sushi-app a.fxs-row:focus-visible,
.sushi-app a.pb-card:focus-visible,.sushi-app a.mk-read:focus-visible{
  border-color:var(--s-accent)!important;
}

/* 8b) MOBIL-TAETHED (ejer-krav 11/9 2026: "på mobil skal det være mere app følelse, SÅ MEGET
      mindre tekst"). En telefon er ikke en smal desktop: den samme rytme giver 20 skaerms
      rulning paa forsiden, og det foeles som et dokument, ikke som en app.
      To greb, og kun to:
      1. KOMPAKT-RYTMEN er default paa telefon. Den er allerede designet og afproevet ovenfor
         som en indstilling; den fjerner luft, ikke information. Kontakten i settings kan
         stadig taende den paa desktop.
      2. Inter precision bevarer 16px broedtekst paa mobil. Den kompakte apptekst
         og sekundaere noter har deres egne roller. Overskrifter bruger den
         responsive skala; tekst stoerrelse maa ikke betale for mindre afstand. */
@media (max-width:560px){
  [class*="sushi-"]{--s-pad:16px;--s-gap:16px;}
  [class*="sushi-"] table.sushi th,[class*="sushi-"] table.sushi td{padding:.42em .7em;}
  .sushi-app p,.sushi-app li{font-size:var(--s-t-body);line-height:1.55;}
  .sushi-app .sub,.sushi-app .sushi-note{font-size:var(--s-t-small);line-height:1.4;}
  .sushi-app h1{font-size:var(--s-t-h1);line-height:1.25;--s-hfs:var(--s-t-h1);--s-hlh:1.25;}
  .sushi-app h2{font-size:var(--s-t-h2);margin-top:calc(var(--s-gap) - 2px);--s-hfs:var(--s-t-h2);}
  .sushi-app h3{font-size:var(--s-t-h3);--s-hfs:var(--s-t-h3);}
  .sushi-honest{padding:14px 15px;margin:16px 0;}
}

/* 9) PAUSE. Sat af brugeren selv i settings. Betslip-gaten i 44 fjerner allerede knapperne;
      denne regel fanger alt der maatte naa DOM alligevel, saa der aldrig staar en doed knap. */
body.sushi-paused .sushi-add,body.sushi-paused .sushi-slip-bar,
body.sushi-paused #sushi-slip-pending{display:none!important;}

/* · calm cards (no coloured callouts) · */
.sushi-honest{
  background:var(--s-surface); border:1px solid var(--s-line); border-radius:var(--s-radius);
  box-shadow:var(--s-shadow); padding:var(--s-pad) calc(var(--s-pad) + 2px);
  margin:var(--s-gap) 0;
}
.sushi-honest h3{margin-top:0;}
.sushi-honest p{color:var(--s-muted); margin:.6em 0;}
.sushi-honest b{color:var(--s-ink); font-weight:620;}

/* · expandable market spectrum: quiet rows, chevron, no heavy fill · */
details.sushi-spec{
  background:var(--s-surface); border:1px solid var(--s-line); border-radius:var(--s-radius-sm);
  margin:.5em 0; overflow:hidden;
}
details.sushi-spec > summary{
  cursor:pointer; list-style:none; padding:.85em 1.05em; font-weight:580; color:var(--s-ink);
  display:flex; align-items:center; gap:.5ch; user-select:none;
}
details.sushi-spec > summary::-webkit-details-marker{display:none;}
details.sushi-spec > summary::after{
  content:""; margin-left:auto; width:.5em; height:.5em; border-right:1.6px solid var(--s-faint);
  border-bottom:1.6px solid var(--s-faint); transform:rotate(45deg); transition:transform .18s ease;
}
details.sushi-spec[open] > summary::after{transform:rotate(225deg);}
details.sushi-spec[open] > summary{border-bottom:1px solid var(--s-line-soft);}
@media (hover:hover){details.sushi-spec > summary:hover{background:var(--s-bg);}}
details.sushi-spec > summary:focus-visible{outline:2px solid var(--s-accent); outline-offset:-2px;}
details.sushi-spec table.sushi{border:0; border-radius:0; box-shadow:none; margin:.2em 0;}
details.sushi-spec > *:not(summary){padding:.2em 1.05em .6em;}

/* · calibration chip: a tiny dot + muted label (colour as accent, never a fill) · */
/* ⚠️ ``white-space:nowrap`` gjorde chippen 630 px bred paa AI Experts, og side-skallen
   klippede den vaek uden at siden kunne scrolles derhen: teksten var bare BORTE fra 320 til
   430 px. En chip er en etiket, ikke et tal: den maa bryde. Kun PRIKKEN skal blive hos
   sit foerste ord, saa den aldrig staar alene paa en linje. */
.sushi-chip{
  display:inline-flex; align-items:center; gap:.45ch; font-size:.74rem; font-weight:560;
  color:var(--s-muted); margin-left:.5ch; white-space:normal; max-width:100%;
  overflow-wrap:break-word; word-break:normal;
}
.sushi-chip .dot{width:.5em; height:.5em; border-radius:50%; background:var(--s-faint); flex:0 0 auto;}
.sushi-chip--green{color:var(--s-pos);}  .sushi-chip--green .dot{background:var(--s-pos);}
.sushi-chip--amber{color:var(--s-warn);} .sushi-chip--amber .dot{background:var(--s-warn);}
.sushi-chip--red{color:var(--s-risk);}   .sushi-chip--red .dot{background:var(--s-risk);}

/* · ranked list (uge-13) · */
ul.sushi-tr{list-style:none; padding:0; margin:1em 0;
  background:var(--s-surface); border:1px solid var(--s-line); border-radius:var(--s-radius);
  box-shadow:var(--s-shadow); overflow:hidden;}
ul.sushi-tr li{padding:.7em 1.1em; border-bottom:1px solid var(--s-line-soft);
  display:flex; align-items:baseline; gap:.35ch .8ch; flex-wrap:wrap;}  /* wrap på ALLE bredder: lange hold+reason må aldrig klippes (overflow:hidden på ul) */
ul.sushi-tr li:last-child{border-bottom:0;}

/* · captions & semantic text helpers · */
.sushi-note,.sushi-disc{color:var(--s-faint); font-size:.82rem; line-height:1.5; margin:.4em 0 1em;}
/* ══ INFO-FOLDNING (ejer-oenske sep 2026) ══════════════════════════════════════════════
   Forklaringen bliver i DOMen, men fylder kun et ikon indtil nogen spoerger. Markupen
   kommer fra ``sushi_info_button()``/``sushi_info_panel()`` i 00, og hele sitet gaar gennem
   den ene port, saa DEN HER blok er det eneste sted udseendet bor.

   ⚠️ IKONET SIDDER I TITLEN, TIL HOEJRE FOR TEKSTEN, og panelet er en POPOVER.
   Foerste udgave foldede ud i flowet lige under overskriften. Paa forsiden er
   overskrifts-raekken ``.sushi-front .sec{display:flex}``, saa panelet blev et TREDJE
   flex-item: titlen blev presset ned i en smal soejle og hele sektionen braekkede
   (ejer-fund paa det live site). En popover ligger i browserens TOP-LAG og kan derfor
   hverken blive et flex-item, blive klippet af en ``overflow:hidden``-foraelder, eller
   flytte én eneste pixel paa siden.

   ⚠️ UDEN JS ER DET BARE ET AFSNIT. ``[popover]`` er skjult af UA-stylesheetet, saa
   attributten saettes af scriptet. Indtil da (og for altid uden JS) er ``.si-panel``
   almindelig, synlig broedtekst - praecis det den var foer foldningen. */
/* ⚠️ SIDSTE ORD + IKON ER ÉN ENHED. Linjeombrydning tillader et brud foran en atomisk
   inline-kasse ogsaa uden mellemrum, saa ikonet faldt ned paa sin egen linje under
   titlen (maalt: 25 overskrifter over syv bredder). Et ikon uden en titel ved siden af
   peger paa ingenting. Kun det SIDSTE ord bindes, saa resten af titlen bryder frit. */
.si-nw{white-space:nowrap;}
.si-btn{display:none;}
.si-js .si-btn{display:inline-flex; align-items:center; justify-content:flex-start; gap:.5ch;
  /* ⚠️ TAP-MAALET ER HUSREGLEN (40+ px), men knappen sidder inde i en overskrift: en
     44 px hoej inline-block ville vokse linjen. Margin-kassen er kun de 14 px
     grafik, mens knappen reserverer hele sin bredde fri af andre kontroller. */
  min-width:max(44px,var(--s-tap)); height:max(44px,var(--s-tap)); margin:calc((14px - max(44px,var(--s-tap))) / 2) 0 calc((14px - max(44px,var(--s-tap))) / 2) 4px; padding:0; border:0; background:none; box-shadow:none;
  /* ⚠️ ``vertical-align:middle`` centrerer paa baseline + halv X-HOEJDE, ikke paa de store
     bogstavers midte. Maalt med skriftens egne tal (canvas TextMetrics) stod ikonet
     1,6-2,5px for LAVT i hver eneste overskrift, voksende med overskriftens stoerrelse.
     Forskellen er (cap - x)/2, altsaa ca. 0,1em, og skrevet i em skalerer den med titlen.
     ``position:relative`` flytter ingen anden pixel. Maalt af wordpress/tests/icon_place.js. */
  position:relative; top:-.1em;
  vertical-align:middle; cursor:pointer; color:var(--s-muted); text-align:left;
  font:inherit; -webkit-tap-highlight-color:transparent;}
/* Neutral og gennemsigtig MED VILJE: samme knap staar baade paa hvide kort og paa
   kampsidens moerke hero. En fast lys flade ville vaere en fremmed hvid plet paa heroen.
   currentColor bevarer lokale farvevalg; fotooverskrifter arver deres lyse tekstfarve. */
.si-ic{display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto;
  width:14px; height:14px; border-radius:0; border:0;
  background:none; opacity:1; color:inherit;
  transition:color .16s ease;}
.si-ic :is(svg,img){width:14px; height:14px; object-fit:contain; stroke:currentColor; stroke-width:1.9; fill:none;}
/* Forbeholdet der ikke maa foldes vaek. Det bor I KNAPPEN, ikke som en soeskende, saa det
   ikke kan blive et ekstra flex-item i en overskrifts-raekke. Daempet og normal vaegt, saa
   det laeses som et forbehold og ikke som en del af titlen. */
.si-teaser{font-size:.72rem; font-weight:500; line-height:1.25; color:var(--s-faint);
  letter-spacing:.01em; text-transform:none;}
@media (hover:hover){ .si-btn:hover .si-ic{color:var(--s-accent-ink);} }
.si-btn:focus-visible{outline:2px solid var(--s-accent); outline-offset:2px; border-radius:var(--s-r-sm);}
.si-btn[aria-expanded="true"] .si-ic{color:var(--s-accent-ink);}
/* Photo headers inherit their existing light heading colour, including open/hover. */
:is(.sm-hero,.sushi-page-hero,.sushi-ph,.eb-hero,.sf-hero) .si-btn,
:is(.sm-hero,.sushi-page-hero,.sushi-ph,.eb-hero,.sf-hero) .si-btn .si-ic{color:inherit;}
/* UDEN JS: almindelig broedtekst, ingen kasse, ingen stribe i venstre side. */
.si-panel{color:var(--s-muted); font-size:.82rem; line-height:1.55; font-weight:400;
  margin:.4em 0 1em; max-width:70ch;}
.si-panel p{margin:0 0 .6em;} .si-panel p:last-child{margin-bottom:0;}
/* MED JS: en rigtig popup-kasse i top-laget. Positionen saettes af scriptet (fixed), saa
   ``inset``/``margin`` fra UA-stylesheetets [popover]-regel skal nulstilles her. */
.si-js .si-panel{display:none; position:fixed; inset:auto; margin:0; z-index:2147483000;
  color:var(--s-ink); background:var(--s-surface); border:1px solid var(--s-line);
  border-radius:var(--s-r-md); box-shadow:var(--s-e3); padding:.85em 1em;
  max-width:min(340px, calc(100vw - 24px)); width:max-content;
  font-size:.84rem; line-height:1.55; overflow:auto; max-height:min(60vh, 420px);}
.si-js .si-panel:popover-open{display:block;}
.si-js .si-panel.is-open{display:block;}   /* fallback hvis browseren ikke kender popover */
/* ⚠️ PRINT OG SOEGE-I-SIDEN. En foldet forklaring kan ikke findes med Ctrl+F i aeldre
   browsere og forsvinder ved print. Begge dele er tilstande hvor "mindre tekst" ikke er
   oensket, saa der folder vi ALT ud, som almindelig tekst. */
@media print{
  .si-js .si-panel{display:block; position:static; box-shadow:none; border:0; padding:0;
    max-width:none; max-height:none; background:none;}
  .si-btn,.si-js .si-btn{display:none;}
}
.sushi-disc{margin-top:1.2em;}
.s-pos{color:var(--s-pos); font-weight:600;} .s-warn{color:var(--s-warn); font-weight:600;}
.s-risk{color:var(--s-risk); font-weight:600;}

/* ============================================================
   RESPONSIVE · perfekt på desktop OG mobil. Datatabellerne er label/værdi-grids;
   på smalle skærme scroller de horisontalt i deres EGET kort i stedet for at sprænge
   sidens layout. Type skaleres, luft strammes, touch-targets holdes ~44px. Alt scoped
   · rører aldrig resten af temaet.
   ============================================================ */
.sushi-app *,table.sushi,table.sushi *,.sushi-honest,details.sushi-spec,ul.sushi-tr{box-sizing:border-box;}

@media (max-width:768px){
  /* KUN prosa-roden. .sushi-app maa ikke staa her: max-width:100% paa den rammer samme
     specificitet (0,1,0) som hver sides egen cap, og hvem der vinder afhaenger saa af
     indlaesningsraekkefoelgen. En rod under 768 px er alligevel smallere end sin egen cap. */
  .single-sushi_match .entry-content{max-width:100%;}
}
@media (max-width:560px){
  .sushi-app{padding:24px 0 56px;}   /* mobil: ingen ekstra side-padding → sektioner helt ud til #content-kanten (8px) */
  .single-sushi_match .entry-content > p:first-of-type{font-size:1rem;}
  .single-sushi_match .entry-content h3,.sushi-app h3{font-size:1.08rem; margin-top:1.7em;--s-hfs:1.08rem;}
  .single-sushi_match .entry-content h4,.sushi-app h4{font-size:.96rem;--s-hfs:.96rem;}
  table.sushi{display:block; overflow-x:auto; -webkit-overflow-scrolling:touch;
    font-size:.85rem; border-radius:var(--s-radius-sm);}
  table.sushi th,table.sushi td{padding:.5em .65em; white-space:nowrap;}
  /* prosa-celler (Decision colspan, kamp-kolonnen) må gerne ombrydes · ellers ligger
     beslutningen 300px off-screen på en 360px-skærm (mobil-audit-fund) */
  table.sushi td[colspan],table.sushi td:first-child,table.sushi th:first-child{white-space:normal;}
  table.sushi td:first-child,table.sushi th:first-child{padding-left:.85em;}
  table.sushi td:last-child,table.sushi th:last-child{padding-right:.85em;}
  .sushi-honest{padding:18px 16px;}
  details.sushi-spec > summary{padding:.85em .9em; min-height:44px;}
  details.sushi-spec > *:not(summary){padding:.2em .6em .55em;}
  details.sushi-spec table.sushi{margin:.2em 0;}
  ul.sushi-tr li{padding:.7em .9em; flex-wrap:wrap; gap:.35ch .8ch;}
  .sushi-chip{margin-left:0;}
}
@media (max-width:380px){
  .sushi-app{padding:22px 12px 44px;}
  table.sushi{font-size:.82rem;}
  table.sushi th,table.sushi td{padding:.45em .55em;}
}

/* · hub-/indeks-lister (95/96): rolige kolonner, hairline-skel · */
ul.sushi-index{list-style:none; padding:0; margin:1em 0; column-width:18em; column-gap:2.2em;}  /* aldrig smallere kolonner end et kampnavn */
ul.sushi-index li{padding:.45em 0; border-bottom:1px solid var(--s-line-soft); break-inside:avoid;}
@media (max-width:640px){ ul.sushi-index{columns:1;} }

/* · respektér reduceret-bevægelse (scoped til vores flader) · */
@media (prefers-reduced-motion:reduce){
  .sushi-app a,.single-sushi_match .entry-content a,details.sushi-spec > summary::after,table.sushi tbody tr{
    transition-duration:.001ms!important;
  }
}
