/* Adelskalender ETF — design-tokens og komponenter (Betaweb-standard: tokens, 1140px container, mobil-kort, lys/mørk) */

/* Selvhostede fonter (ingen CDN). Faller tilbake til systemfonter hvis filene mangler. */
@font-face{font-family:"Oswald";font-style:normal;font-weight:400 700;font-display:swap;src:url("../fonts/oswald.woff2") format("woff2");}
@font-face{font-family:"Source Sans 3";font-style:normal;font-weight:400 700;font-display:swap;src:url("../fonts/source-sans-3.woff2") format("woff2");}

:root{
  --container-maks:1140px;
  --blue:#123a70; --blue-deep:#0d2b52; --blue-soft:#e7eef7;
  --mast-a:#123a70; --mast-b:#0d2b52; /* header-gradient — egen token, så mørkt tema kan gjøre den mye mørkere */
  --gold:#b3852f; --gold-soft:#f3e7cb;
  --ink:#17202b; --muted:#5a6675; --faint:#8a94a2;
  --paper:#ffffff; --ground:#f4f2ec; --line:#dcd7cc; --stripe:#faf9f5;
  --danger:#a23a34;
  --shadow:0 1px 3px rgba(20,30,50,.09), 0 6px 18px rgba(20,30,50,.06);
  --display:"Oswald","Arial Narrow",system-ui,sans-serif;
  --body:"Source Sans 3","Segoe UI",system-ui,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --blue:#5b8fd6; --blue-deep:#0b1a30; --blue-soft:#16263f;
    --mast-a:#0c1a2e; --mast-b:#05090f;
    --gold:#d6a748; --gold-soft:#2a2314;
    --ink:#e7ebf1; --muted:#9aa6b6; --faint:#6f7b8b;
    --paper:#131a25; --ground:#0d131c; --line:#26303f; --stripe:#171f2b;
    --danger:#e0736b;
    --shadow:0 1px 3px rgba(0,0,0,.4), 0 8px 22px rgba(0,0,0,.35);
  }
}
:root[data-theme="dark"]{
  --blue:#5b8fd6; --blue-deep:#0b1a30; --blue-soft:#16263f;
  --mast-a:#0c1a2e; --mast-b:#05090f;
  --gold:#d6a748; --gold-soft:#2a2314;
  --ink:#e7ebf1; --muted:#9aa6b6; --faint:#6f7b8b;
  --paper:#131a25; --ground:#0d131c; --line:#26303f; --stripe:#171f2b;
  --danger:#e0736b;
  --shadow:0 1px 3px rgba(0,0,0,.4), 0 8px 22px rgba(0,0,0,.35);
}

*{box-sizing:border-box;}
html,body{margin:0;}
body{background:var(--ground);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55;}
[hidden]{display:none!important;}
a{color:var(--blue);}
.wrap{max-width:var(--container-maks);margin:0 auto;padding:0 20px 64px;}
.skip{position:absolute;left:-999px;top:8px;background:var(--gold);color:#fff;padding:8px 12px;border-radius:6px;z-index:100;}
.skip:focus{left:12px;}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px;}

/* masthead */
.mast{background:linear-gradient(160deg,var(--mast-a) 0%,var(--mast-b) 100%);color:#fff;border-bottom:4px solid var(--gold);}
.mast .wrap{padding-top:26px;padding-bottom:26px;position:relative;}
.crest{display:flex;align-items:center;gap:16px;}
.crest .logo{height:72px;width:auto;flex:none;display:block;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35));}
.crest h1{font-family:var(--display);font-weight:600;letter-spacing:.02em;margin:0;font-size:clamp(1.5rem,4vw,2.3rem);line-height:1.05;text-wrap:balance;}
.crest .sub{margin-top:3px;color:#cbdcf3;font-size:.86rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;}
.theme-toggle{position:absolute;top:16px;right:20px;background:rgba(255,255,255,.14);color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:8px;font:inherit;font-size:.8rem;padding:5px 10px;cursor:pointer;}

/* notat */
.vintage{background:var(--gold-soft);border:1px solid var(--gold);border-radius:10px;padding:12px 16px;margin:22px 0 26px;font-size:.9rem;display:flex;gap:12px;align-items:flex-start;}
.vintage b{color:var(--gold);}
.vintage .k{font-family:var(--display);font-weight:600;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);border:1px solid var(--gold);border-radius:5px;padding:2px 7px;white-space:nowrap;flex:none;}

/* rekordkort */
.records{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:30px;}
@media(max-width:620px){.records{grid-template-columns:1fr;}}
.rec{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:20px 22px;box-shadow:var(--shadow);position:relative;overflow:hidden;}
.rec::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--gold);}
.rec .lbl{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.1em;font-size:.76rem;color:var(--muted);}
.rec .who{font-family:var(--display);font-weight:600;font-size:1.7rem;margin:4px 0 0;line-height:1.05;}
.rec .num{font-family:var(--display);font-weight:700;font-size:3.2rem;line-height:1;color:var(--blue);font-variant-numeric:tabular-nums;margin-top:8px;}
.rec .num small{font-size:1rem;color:var(--muted);font-weight:500;margin-left:6px;letter-spacing:.04em;}
.rec .meta{margin-top:6px;color:var(--muted);font-size:.9rem;}
/* medalje: minibilde av rekordholderen naar det finnes, ellers ikon (drakt = kamper, ball = maal) */
.rec .medal{position:absolute;top:16px;right:18px;width:44px;height:44px;border-radius:50%;background:var(--gold);color:#fff;display:grid;place-items:center;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,.2);border:2px solid var(--gold);}
.rec .medal img{width:100%;height:100%;object-fit:cover;display:block;}
.rec .medal img.ikon{object-fit:contain;padding:6px;background:#fff;} /* fallback-ballen ligger i hvit sirkel */

/* kontroller */
.controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:16px;}
.controls .search{flex:1 1 220px;position:relative;}
.controls input[type=search]{width:100%;font:inherit;padding:9px 12px 9px 34px;border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--ink);}
.controls .search::before{content:"⌕";position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--faint);font-size:1.1rem;pointer-events:none;}
.controls input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;} /* vi har egen ×-knapp */
.tom-sok{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:30px;height:30px;border:0;border-radius:50%;background:var(--blue-soft);color:var(--ink);font:inherit;font-size:1.25rem;line-height:1;cursor:pointer;display:grid;place-items:center;}
.tom-sok:hover{background:var(--blue);color:#fff;}
.segs{display:flex;gap:4px;background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:3px;}
.segs button{font:inherit;font-size:.86rem;border:0;background:transparent;color:var(--muted);padding:6px 12px;border-radius:6px;cursor:pointer;white-space:nowrap;}
.segs button[aria-pressed=true]{background:var(--blue);color:#fff;font-weight:600;}
.count{color:var(--muted);font-size:.88rem;margin-left:auto;}
.sorter{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.88rem;white-space:nowrap;}
.sorter select{font:inherit;font-size:.9rem;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:7px 10px;cursor:pointer;}

/* typeahead */
.suggest{position:absolute;top:calc(100% + 5px);left:0;right:0;z-index:45;margin:0;padding:4px;list-style:none;background:var(--paper);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);max-height:300px;overflow-y:auto;}
.suggest li{padding:7px 10px;border-radius:7px;cursor:pointer;display:flex;align-items:center;gap:9px;font-size:.96rem;}
.suggest li[aria-selected=true],.suggest li:hover{background:var(--blue-soft);}
.suggest li .mini{width:24px;height:24px;border-radius:50%;object-fit:cover;border:1px solid var(--gold);flex:none;background:var(--blue-soft);}
.suggest li .nomini{width:24px;flex:none;}
.suggest li .m{margin-left:auto;color:var(--muted);font-size:.82rem;font-variant-numeric:tabular-nums;white-space:nowrap;}
.suggest .none{padding:9px 10px;color:var(--muted);}

/* tabell */
.tablewrap{background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden;}
table{width:100%;border-collapse:collapse;}
thead th{background:var(--blue-soft);color:var(--ink);font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-size:.74rem;text-align:right;padding:11px 14px;position:sticky;top:0;cursor:pointer;white-space:nowrap;border-bottom:2px solid var(--line);}
thead th.left{text-align:left;}
thead th[aria-sort]:not([aria-sort=none])::after{content:" ▾";color:var(--blue);}
thead th[aria-sort=ascending]::after{content:" ▴";}
tbody td{padding:9px 14px;text-align:right;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums;}
tbody td.left{text-align:left;}
tbody tr:nth-child(even){background:var(--stripe);}
tbody tr:hover{background:var(--blue-soft);}
.rank{color:var(--faint);font-family:var(--display);font-weight:600;width:2.5rem;}
.rank.top{color:var(--gold);}
.pname{font-weight:600;}
.plink{color:inherit;text-decoration:none;}
.plink:hover,.plink:focus-visible{color:var(--blue);text-decoration:underline;}
.period{color:var(--muted);font-size:.86rem;white-space:nowrap;}
.goals-strong{color:var(--blue);font-weight:700;}
.cards{color:var(--faint);font-size:.85rem;}
.empty{padding:30px;text-align:center;color:var(--muted);}

/* spillerbilde */
.namewrap{display:inline-flex;align-items:center;gap:9px;}
.avatar{width:26px;height:26px;border-radius:50%;object-fit:cover;flex:none;border:2px solid var(--gold);cursor:zoom-in;background:var(--blue-soft);}
.noface{width:26px;flex:none;}
#preview{position:fixed;z-index:60;width:158px;padding:8px;pointer-events:none;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);}
#preview img{width:100%;height:auto;border-radius:8px;display:block;}
#preview .cap{font-family:var(--display);font-weight:600;font-size:.82rem;text-align:center;margin-top:7px;}

/* mobil: kort i stedet for horisontal scroll (Betaweb-regel) */
@media(max-width:600px){
  /* Mobil: logo + tittel fyller hele bredden; temaknappen flyttes under teksten, høyrestilt (Bjørn, 3. sep 2026). */
  .mast .wrap{display:flex;flex-direction:column;padding-top:18px;padding-bottom:14px;}
  .mast .theme-toggle{position:static;order:2;align-self:flex-end;margin-top:12px;}
  .crest .logo{height:60px;}
  /* Den gule infoboksen: årstallsmerket øverst og midtstilt, teksten får hele bredden under. */
  .vintage{flex-direction:column;align-items:center;gap:8px;text-align:left;}
  .vintage .k{align-self:center;}
  .vintage .tb{width:100%;}
  /* Tiårsfilteret: fast rutenett 4 × 2 på mobil — ryddige rader, aldri utenfor kanten (Betaweb-regel). */
  .segs{display:grid;grid-template-columns:repeat(4,1fr);width:100%;gap:4px;}
  .segs button{padding:8px 4px;text-align:center;}
  .segs .lang{display:none;} /* «60-tallet» → «60», som de andre */
  .sorter{width:100%;}
  .sorter select{flex:1;}
  .controls .count{margin-left:auto;margin-right:auto;}
  table{display:block;}
  thead{display:none;}
  tbody{display:block;}
  tbody tr{display:grid;grid-template-columns:1fr;gap:4px 12px;padding:14px 16px;border-bottom:1px solid var(--line);position:relative;}
  tbody tr:hover{background:transparent;}
  tbody td{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:3px 0;border:0;text-align:right;grid-column:1 / -1;}
  tbody td::before{content:attr(data-label);color:var(--muted);font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-size:.72rem;}
  /* Kortets hode: rangnummeret på egen linje øverst, midtstilt, og navnet stort og midtstilt under
     (Bjørn, 3. sep 2026 — likt uansett antall siffer og skjermbredde). */
  tbody td.rank{grid-row:1;justify-content:center;padding:0;width:auto;font-size:2.4rem;line-height:1;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums;}
  /* Tomme etikett-elementer og bildeplassholderen må BORT (display:none), ikke bare tømmes —
     ellers teller de med som flex-elementer og dytter tallet/navnet ut av midten. */
  tbody td.rank::before,tbody td.pname::before{display:none;}
  tbody td.pname{grid-row:2;justify-content:center;text-align:center;font-size:1.32rem;font-weight:700;line-height:1.3;padding:4px 8px 10px;}
  .namewrap{justify-content:center;width:100%;gap:0;}
  .noface{display:none;}
  /* Spillerbildet: stort, rundt, midtstilt mellom etikettene (venstre) og tallene (høyre). */
  .avatar{position:absolute;left:50%;top:96px;bottom:14px;margin:auto 0;transform:translateX(-50%);
          width:clamp(112px,36vw,160px);height:clamp(112px,36vw,160px);border-width:3px;
          box-shadow:0 4px 14px rgba(0,0,0,.18);cursor:default;}
  #preview{display:none;}
}

/* «Vis flere» (30 om gangen) */
.mer{display:flex;justify-content:center;margin:18px 0 6px;}
.mer .knapp{font:inherit;font-weight:600;border:0;cursor:pointer;padding:11px 22px;}
.mer .knapp:hover{filter:brightness(1.08);}

footer{margin-top:26px;color:var(--muted);font-size:.84rem;line-height:1.6;}
footer .src{border-top:1px solid var(--line);padding-top:16px;}
footer b{color:var(--ink);}

/* redigerbare tekster: font/størrelse/farge settes som .tb-<nøkkel> i <style> fra serveren */
.tb{white-space:normal;}
.tb code{font-size:.9em;}

/* spillerside (delbar URL) */
a.crest{color:inherit;text-decoration:none;}
.crest .h1{font-family:var(--display);font-weight:600;letter-spacing:.02em;font-size:clamp(1.3rem,3.4vw,1.9rem);line-height:1.05;}
.brodsmuler{margin:18px 0 14px;font-size:.88rem;color:var(--muted);}
.brodsmuler a{color:var(--muted);}
.brodsmuler span[aria-current]{color:var(--ink);}
.spiller{display:grid;grid-template-columns:minmax(220px,340px) 1fr;gap:30px;align-items:start;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:28px;}
.spiller .portrett img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:16px;border:4px solid var(--gold);display:block;background:var(--blue-soft);}
/* Plasseringen: bare tallet, stort og midtstilt under bildet (Bjørn, 3. sep 2026). */
.spiller .rang{text-align:center;font-family:var(--display);font-weight:700;font-size:3.2rem;line-height:1;color:var(--gold);margin-top:14px;font-variant-numeric:tabular-nums;}
.spiller h1{font-family:var(--display);font-weight:600;font-size:clamp(1.9rem,4.5vw,2.8rem);line-height:1.05;margin:0 0 6px;text-wrap:balance;}
.spiller .periode{color:var(--ink);margin-bottom:18px;font-size:1.05rem;}
.spiller .periode .etikett{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;color:var(--muted);margin-right:2px;}
.spiller .periode .sep{color:var(--faint);margin:0 6px;}
.spiller .tall{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 16px;}
.spiller .tall div{background:var(--stripe);border:1px solid var(--line);border-radius:10px;padding:10px 12px;}
.spiller .tall dt{font-family:var(--display);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:.7rem;color:var(--muted);}
.spiller .tall dd{margin:2px 0 0;font-family:var(--display);font-weight:700;font-size:1.7rem;line-height:1;font-variant-numeric:tabular-nums;}
.spiller .tall dd.sterk{color:var(--blue);}
.spiller .tall dd.ikke-oppgitt{font-family:var(--body);font-weight:500;font-size:.95rem;color:var(--muted);line-height:1.7;}
.spiller .plass{color:var(--muted);font-size:.92rem;margin:0 0 18px;}
.spiller .plass b{color:var(--ink);}
.spiller .handlinger{display:flex;gap:10px;flex-wrap:wrap;}
.spiller .knapp{font:inherit;font-weight:600;border:1px solid transparent;cursor:pointer;padding:10px 18px;}
.spiller .knapp.sekundaer{background:var(--paper);color:var(--ink);border-color:var(--line);}
.spiller .knapp.sekundaer:hover{background:var(--blue-soft);}
.bio{margin-top:26px;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:24px 28px;} /* like bred som spillerboksen (Bjørn) */
.bio h2{font-family:var(--display);font-weight:600;margin:0 0 10px;font-size:1.25rem;letter-spacing:.02em;}
.bio p{margin:0 0 12px;}
.bio p:last-child{margin-bottom:0;}
@media(max-width:720px){
  .spiller{grid-template-columns:1fr;padding:20px;gap:18px;}
  .spiller .portrett{max-width:260px;margin:0 auto;}
  .spiller .info{text-align:center;}
  .spiller .tall dt{text-align:center;}
  .spiller .handlinger{justify-content:center;}
}

/* feilsider */
.feilside{display:grid;place-items:center;min-height:100vh;padding:24px;}
.feil-kort{background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:36px 40px;max-width:520px;text-align:center;border-top:5px solid var(--gold);}
.feil-kode{font-family:var(--display);font-weight:700;font-size:4rem;line-height:1;color:var(--blue);}
.feil-kort h1{font-family:var(--display);font-weight:600;margin:10px 0 8px;}
.feil-kort p{color:var(--muted);margin:0 0 22px;}
.knapp{display:inline-block;background:var(--blue);color:#fff;text-decoration:none;padding:10px 18px;border-radius:9px;font-weight:600;}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}