/* =====================================================
   JULECUPEN – felles stilark
   Farger og skrift står samlet øverst (:root).
   ===================================================== */

:root {
  --navy: #112647;        /* toppfelt, kort */
  --navy-dark: #0A1830;   /* bunn */
  --red: #C8102E;         /* knapper, nedtelling */
  --red-dark: #7E0B1E;    /* knappeskygge, lenker hover */
  --red-text: #A50F25;    /* skygge på logoteksten */
  --gold: #F2C14E;        /* små aksenter */
  --ink: #0E1A2B;         /* brødtekst */
  --muted: #4A5568;       /* grå tekst */
  --line: #A9B8CF;        /* rammer på felt */
  --bg: #F4F6FA;          /* sidebakgrunn */
  --pale: #E9EEF5;        /* lyse felt */
  --light: #D6E0F0;       /* lys tekst på blått */
  --note-bg: #FFF6DC;     /* gule notiser */
  --note-ink: #5A3D00;

  --font-body: 'Nunito Sans', system-ui, sans-serif;
  --font-head: 'Arvo', Georgia, serif;
  --font-logo: 'Comic Sans MS', 'Comic Neue', cursive;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--font-body); font-size: 17px; line-height: 1.5; }
a { color: #B0102A; }
a:hover { color: var(--red-dark); }
img { max-width: 100%; }
h1, h2, h3 { font-family: var(--font-head); font-weight: 400; margin: 0; line-height: 1.1; }
p { margin: 0; }

.wrap { max-width: 1180px; margin: 0 auto; padding-left: 24px; padding-right: 24px; }

/* Snø-prikker i bakgrunnen (stillestående) */
.snow { }  /* stillestående snøprikker fjernet */

/* ===== DEMO-STRIPE (fjernes når siden går live) ===== */
.demo-bar { background: var(--gold); color: var(--ink); text-align: center; font-weight: 600; font-size: 15px; padding: 6px 12px; }

/* ===== MENY / TOPP ===== */
.site-header { background-color: var(--navy); color: #fff; }
.site-header .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding-top: 14px; padding-bottom: 14px; }
.brand { display: flex; align-items: center; gap: 16px; color: #fff; text-decoration: none; }
.brand:hover { color: #fff; }
.logo-badge { flex-shrink: 0; width: 124px; height: 124px; border-radius: 50%; background: #fff; border: 4px solid var(--gold); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.logo-badge img { width: 112px; height: 112px; object-fit: contain; }
.brand-text { display: flex; flex-direction: column; gap: 10px; line-height: 1.1; }
.brand-name { font-family: var(--font-logo); font-size: 50px; letter-spacing: 1px; text-shadow: 2px 2px 0 var(--red-text); }
.brand-sub { font-weight: 600; font-size: 15px; letter-spacing: 3px; color: var(--gold); padding-left: 2px; }
.nav { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.nav a { color: #fff; text-decoration: none; padding: 12px; font-weight: 600; border-bottom: 3px solid transparent; }
.nav a:hover { border-bottom-color: rgba(242,193,78,0.5); color: #fff; }
.nav a.aktiv { border-bottom-color: var(--gold); }

/* ===== HERO (blått felt under menyen) ===== */
.hero { background-color: var(--navy); color: #fff; overflow: hidden; }
.hero-edge { display: block; width: 100%; height: 44px; }
.hero h1 { font-size: 64px; }
.hero .lead { font-size: 19px; color: var(--light); }

/* Forside-hero */
.hero-front { display: flex; flex-wrap: wrap; gap: 40px; align-items: center; padding-top: 40px; padding-bottom: 40px; }
.hero-logo { flex: 1 1 300px; display: flex; justify-content: center; }
.hero-logo-badge { width: 230px; height: 230px; border-radius: 50%; background: #fff; border: 6px solid var(--gold); display: flex; align-items: center; justify-content: center; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.35); }
.hero-logo-badge img { width: 190px; height: 190px; object-fit: contain; }
.hero-text { flex: 999 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.eyebrow { font-weight: 600; letter-spacing: 3px; text-transform: uppercase; color: var(--gold); }
.hero-title { font-family: var(--font-logo) !important; font-size: 104px !important; line-height: 0.95; text-shadow: 3px 3px 0 var(--red-text); }
.hero-title span { color: var(--red); text-shadow: 3px 3px 0 #FFFFFF; }
.hero-front .lead { font-size: 22px; max-width: 600px; }
.btn-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.btn { display: inline-block; font: inherit; font-weight: 600; font-size: 19px; padding: 17px 30px; border-radius: 40px; border: 0; text-decoration: none; cursor: pointer; }
.btn-red { background: var(--red); color: #fff; box-shadow: 0 4px 0 var(--red-dark); }
.btn-red:hover { color: #fff; background: #B30E29; }
.btn-white { background: #fff; color: var(--navy); box-shadow: 0 4px 0 var(--line); }
.btn-white:hover { color: var(--navy); }
.btn-ghost { background: transparent; color: var(--ink); border: 2px solid var(--line); font-size: 17px; padding: 14px 24px; }

/* Nedtelling */
.countdown { background: var(--navy-dark); border: 2px solid var(--gold); border-radius: 18px; padding: 22px 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.countdown-title { font-family: var(--font-head); font-size: 28px; }
.countdown-note { color: var(--light); font-size: 16px; }
.countdown-grid { flex: 0 1 460px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; text-align: center; }
.countdown-grid div { background: var(--red); border-radius: 12px; padding: 12px 4px; }
.countdown-grid b { display: block; font-family: var(--font-head); font-weight: 400; font-size: 46px; line-height: 1; }
.countdown-grid span { font-size: 14px; font-weight: 600; }

/* ===== FAKTA-KORT (frist, avgift, betaling, trekning) ===== */
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 16px; padding-top: 24px; }
.fact { background: #fff; border-radius: 16px; padding: 22px; border-top: 6px solid var(--red); display: flex; flex-direction: column; gap: 6px; }
.fact:nth-child(even) { border-top-color: var(--navy); }
.fact-label { font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--muted); }
.fact-value { font-family: var(--font-head); font-size: 30px; color: var(--navy); line-height: 1.15; }
.fact-note { font-size: 15px; color: var(--muted); }

/* ===== INNHOLD I TO KOLONNER ===== */
.cols { display: flex; flex-wrap: wrap; gap: 32px; align-items: flex-start; padding-top: 32px; padding-bottom: 72px; }
.col-main { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }
.col-side { flex: 1 1 290px; display: flex; flex-direction: column; gap: 18px; }
.section-title { font-size: 44px; color: var(--navy); }
.card { background: #fff; border-radius: 16px; padding: 24px; display: flex; flex-direction: column; gap: 10px; }
.card h2 { font-size: 28px; color: var(--navy); }
.card h3 { font-family: var(--font-body); font-size: 25px; font-weight: 600; }
.card .meta { font-size: 14px; color: var(--muted); font-weight: 600; }
.card-dark { background-color: var(--navy); color: #fff; }
.card-dark h2 { color: var(--gold); }
.card-dark p, .card-dark .muted { color: var(--light); }
.big { font-family: var(--font-head); font-size: 32px; }
.note { background: var(--note-bg); color: var(--note-ink); border-radius: 16px; padding: 20px 24px; }
.note a { color: var(--note-ink); }
.sponsors { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; }
.sponsors > a, .sponsors > div { min-height: 64px; padding: 6px; background: #fff; border: 1px solid var(--pale); border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 14px; color: var(--muted); text-decoration: none; }
.sponsors > a:hover { border-color: var(--line); }
.sponsors img { display: block; max-width: 100%; height: auto; }

/* ===== PÅMELDING ===== */
.hero-page { position: relative; min-height: 250px; display: flex; flex-direction: column; justify-content: center; gap: 10px; padding-top: 40px; padding-bottom: 20px; }
.form-card { background: #fff; border-radius: 18px; padding: 32px; display: flex; flex-direction: column; gap: 28px; box-shadow: 0 8px 24px rgba(14,26,43,0.07); }
.form-card h2 { font-size: 30px; color: var(--navy); }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
legend { font-weight: 600; font-size: 17px; margin-bottom: 10px; padding: 0; }
.seg { display: inline-flex; flex-wrap: wrap; gap: 6px; background: var(--pale); padding: 6px; border-radius: 40px; }
.seg button { font: inherit; font-weight: 600; font-size: 16px; padding: 12px 20px; min-height: 44px; border: 0; border-radius: 40px; background: transparent; color: var(--navy); cursor: pointer; }
.seg button[aria-pressed="true"] { background: var(--navy); color: #fff; }
.field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.field label { font-weight: 600; }
.field label small { font-weight: 400; color: var(--muted); font-size: 15px; }
input[type="text"], input[type="tel"], input[type="email"] { font: inherit; font-size: 17px; padding: 13px 14px; border: 2px solid var(--line); border-radius: 10px; background: #fff; color: var(--ink); width: 100%; }
input:focus { outline: 3px solid var(--gold); outline-offset: 1px; }
.grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; }
.row-between { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px; }
.hint { font-size: 15px; color: var(--muted); }
.lock { display: flex; gap: 8px; align-items: center; }
.players { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px 18px; }
.player { display: flex; gap: 10px; align-items: flex-end; }
.player .field { flex: 1; }
.player .field label { font-size: 15px; }
.chk { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; min-height: 48px; white-space: nowrap; }
.chk input, .consent input { width: 20px; height: 20px; accent-color: var(--red); flex-shrink: 0; }
.consent { display: flex; gap: 12px; align-items: flex-start; background: var(--pale); padding: 16px; border-radius: 12px; }
.consent input { margin-top: 3px; }
.step { display: flex; gap: 12px; }
.step b { flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%; background: var(--red); color: #fff; display: flex; align-items: center; justify-content: center; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; } /* robotfelle – skal være usynlig */
[hidden] { display: none !important; }

/* ===== SNØMANN ===== */
.snowman { position: absolute; right: 24px; bottom: 0; width: 250px; height: 250px; overflow: visible; }
.kickball { transform-box: fill-box; transform-origin: center; animation: kick 4s linear infinite; }
@keyframes kick {
  0%, 8%  { transform: translate(72px, 30px) rotate(0deg); opacity: 1; }
  30%     { transform: translate(-170px, -150px) rotate(-400deg); opacity: 1; }
  55%     { transform: translate(-480px, -118px) rotate(-760deg); opacity: 1; }
  62%, 100% { transform: translate(-500px, -110px) rotate(-800deg); opacity: 0; }
}
.kickfx { animation: fx 4s linear infinite; }
@keyframes fx { 0%, 6% { opacity: 0; } 8%, 22% { opacity: 1; } 30%, 100% { opacity: 0; } }

/* ===== PÅMELDTE LAG ===== */
.hero-teams { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 20px; padding-top: 40px; padding-bottom: 20px; }
.hero-teams h1 { max-width: 720px; line-height: 1.05; }
.stats { display: flex; gap: 12px; }
.stat { background: var(--red); border-radius: 14px; padding: 12px 22px; text-align: center; }
.stat b { display: block; font-family: var(--font-head); font-weight: 400; font-size: 40px; line-height: 1; }
.stat span { font-size: 14px; font-weight: 600; }
.teams { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.team { background: #fff; border-radius: 18px; padding: 22px; display: flex; flex-direction: column; gap: 14px; box-shadow: 0 6px 18px rgba(14,26,43,0.07); }
.team-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.team-name { display: flex; gap: 12px; align-items: center; min-width: 0; }
.team-nr { flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; background: var(--navy); color: var(--gold); font-family: var(--font-head); font-size: 22px; display: flex; align-items: center; justify-content: center; }
.team h2 { font-size: 26px; color: var(--navy); }
.team-count { flex-shrink: 0; font-size: 14px; font-weight: 600; color: var(--muted); padding: 6px 0; }
.team ul { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 14px; font-size: 16px; }
.teams-wrap { display: flex; flex-direction: column; gap: 24px; padding-top: 24px; padding-bottom: 72px; }

/* ===== BUNN ===== */
.site-footer { background-color: var(--navy-dark); color: var(--light); font-size: 15px; }
.site-footer .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 28px; padding-bottom: 28px; }
.site-footer a { color: #fff; }

/* ===== MOBIL ===== */
@media (max-width: 760px) {
  .wrap { padding-left: 16px; padding-right: 16px; }
  .brand-name { font-size: 40px; }
  .logo-badge { width: 92px; height: 92px; }
  .logo-badge img { width: 82px; height: 82px; }
  .hero h1 { font-size: 46px; }
  .hero-title { font-size: 68px !important; }
  .hero-front .lead { font-size: 19px; }
  .countdown-grid b { font-size: 34px; }
  .form-card { padding: 20px; }
  .section-title { font-size: 34px; }
  .teams { grid-template-columns: 1fr; }
  /* Snømannen under teksten i stedet for oppå */
  .hero-page { min-height: 0; }
  .snowman { position: static; display: block; margin: 8px auto 0; width: 200px; height: 200px; }
  @keyframes kick {
    0%, 8%  { transform: translate(72px, 30px) rotate(0deg); opacity: 1; }
    35%     { transform: translate(-30px, -60px) rotate(-360deg); opacity: 1; }
    55%     { transform: translate(-60px, -20px) rotate(-560deg); opacity: 1; }
    62%, 100% { transform: translate(-64px, -14px) rotate(-600deg); opacity: 0; }
  }
}

@media (prefers-reduced-motion: reduce) {
  .kickball, .kickfx { animation: none; }
}

/* ===== SNØFALL (bare forsiden) ===== */
.hero { position: relative; }
.hero > .wrap, .hero > .hero-edge { position: relative; z-index: 1; }
.snowfall { position: absolute; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.snowfall i { position: absolute; top: -12px; display: block; border-radius: 50%; background: #fff; animation: snofall linear infinite; }
@keyframes snofall { to { transform: translate(var(--drift, 20px), 900px); } }
@media (prefers-reduced-motion: reduce) { .snowfall { display: none; } }

/* ===== PULJER (puljesiden, f.eks. /historie/2026/puljer2026.asp) ===== */
.puljer { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.pulje { background: #fff; border-radius: 18px; padding: 22px; border-top: 6px solid var(--red); box-shadow: 0 6px 18px rgba(14,26,43,0.07); display: flex; flex-direction: column; gap: 12px; }
.pulje:nth-child(even) { border-top-color: var(--navy); }
.pulje h3 { font-family: var(--font-head); font-size: 28px; color: var(--navy); }
.pulje ol { margin: 0; padding-left: 26px; display: flex; flex-direction: column; gap: 6px; font-size: 18px; }
.pulje li::marker { color: var(--red); font-weight: 600; }
.puljer-tom { background: #fff; border-radius: 16px; padding: 24px; font-size: 18px; }

/* ===== KAMPOPPSETT OG TABELLER ===== */
.tabell-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; background: #fff; border-radius: 16px; box-shadow: 0 6px 18px rgba(14,26,43,0.07); }
.kamper, .tabell { width: 100%; border-collapse: collapse; font-size: 16px; }
.kamper th, .tabell th { background: var(--navy); color: #fff; font-weight: 600; font-size: 14px; text-align: center; padding: 10px 8px; white-space: nowrap; }
.kamper td, .tabell td { padding: 9px 8px; border-bottom: 1px solid var(--pale); text-align: center; white-space: nowrap; }
.kamper tbody tr:nth-child(even), .tabell tbody tr:nth-child(even) { background: #F8FAFD; }
.kamper .lag-h { text-align: right; white-space: normal; }
.kamper .lag-b { text-align: left; white-space: normal; }
.kamper th.lag-h, .kamper th.lag-b { text-align: center; }
.kamper td.maal { font-family: var(--font-head); font-size: 20px; font-weight: 600; color: var(--red); width: 48px; }
.kamper td.kp { color: var(--muted); font-weight: 600; width: 36px; }
.kamper th.lag-b { text-align: left; }
.tabeller { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 480px), 1fr)); gap: 16px; }
.tabeller .pulje { padding: 18px; }
.tabeller .tabell-wrap { box-shadow: none; border-radius: 10px; border: 1px solid var(--pale); }
.tabell .lag { text-align: left; white-space: normal; font-weight: 600; }
.tabell .nr { color: var(--muted); width: 28px; }
.tabell .poeng { font-weight: 700; color: var(--navy); }

/* Resultatføring i admin (kamper.asp) */
.note-feil { background: #FDE8EB; color: #7E0B1E; }
.kamp-oppsett { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; }
.kamp-oppsett input[type="text"] { font: inherit; padding: 11px 12px; border: 2px solid var(--line); border-radius: 10px; }
.kamp-liste { display: flex; flex-direction: column; gap: 10px; }
.kamp-rad { background: #fff; border-radius: 14px; padding: 12px 16px; display: flex; flex-direction: column; gap: 8px; border-left: 6px solid var(--line); scroll-margin-top: 20px; }
.kamp-rad.spilt { border-left-color: #1B6B3A; }
.kamp-rad:target { box-shadow: 0 0 0 3px var(--gold); }
.kamp-info { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; font-size: 15px; color: var(--muted); }
.kamp-info b { color: var(--navy); }
.kamp-score { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto minmax(0, 1fr) auto; gap: 8px; align-items: center; }
.kamp-lag { font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.kamp-lag-h { text-align: right; }
/* Mer spesifikt enn den generelle regelen for tekstfelt, så feltene blir små */
.kamp-rad input.kamp-tid { width: 76px; font-size: 15px; padding: 6px 8px; border: 2px solid var(--line); border-radius: 8px; }
.kamp-rad input.kamp-maal { width: 54px; font-size: 22px; text-align: center; padding: 6px 4px; border: 2px solid var(--line); border-radius: 10px; }
.btn.kamp-lagre { font-size: 15px; padding: 10px 18px; }
@media (max-width: 760px) {
  .kamper { font-size: 14px; }
  .kamper td, .kamper th { padding: 8px 5px; }
  .kamper td.maal { font-size: 17px; width: 30px; }
  .kamp-score { grid-template-columns: minmax(0, 1fr) auto auto auto minmax(0, 1fr); }
  .btn.kamp-lagre { grid-column: 1 / -1; justify-self: center; }
  .kamp-rad input.kamp-maal { width: 46px; font-size: 20px; }
}

/* ===== LAGBILDER ===== */
.lagbilder { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 16px; }
.lagbilder-pulje { grid-column: 1 / -1; font-size: 30px; color: var(--navy); margin-top: 12px; }
.lagkort { background: #fff; border-radius: 18px; overflow: hidden; box-shadow: 0 6px 18px rgba(14,26,43,0.07); display: flex; flex-direction: column; color: var(--ink); text-decoration: none; scroll-margin-top: 20px; }
.lagkort:target { box-shadow: 0 0 0 3px var(--gold); }
a.lagkort-lenke:hover { color: var(--ink); box-shadow: 0 10px 26px rgba(14,26,43,0.16); }
.lagkort-bilde { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--pale); display: block; }
.lagkort-bilde.uten, .lagbilde-stor img.uten { object-fit: contain; padding: 24px; }
.lagkort-tekst { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.lagkort h3 { font-family: var(--font-head); font-weight: 400; font-size: 24px; color: var(--navy); }
.lagkort-knapp { font-size: 16px; padding: 11px 20px; }
.lenkeknapp { background: none; border: 0; padding: 0; font: inherit; font-size: 15px; color: var(--red-dark); text-decoration: underline; cursor: pointer; }
.spillere { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 14px; font-size: 15px; }
.lagbilde-stor { display: grid; grid-template-columns: minmax(0, 2fr) minmax(240px, 1fr); gap: 20px; align-items: start; }
.lagbilde-stor img { width: 100%; border-radius: 18px; background: var(--pale); box-shadow: 0 6px 18px rgba(14,26,43,0.12); display: block; }
.bla-nav { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
@media (max-width: 760px) {
  .lagbilde-stor { grid-template-columns: 1fr; }
  .bla-nav .btn { padding: 12px 18px; font-size: 16px; }
}

/* Faner (Alle | Pulje A | Pulje B ...) */
.faner { display: flex; flex-wrap: wrap; gap: 6px; background: var(--pale); padding: 6px; border-radius: 40px; align-self: flex-start; }
.faner a { padding: 10px 18px; border-radius: 40px; font-weight: 600; color: var(--navy); text-decoration: none; }
.faner a:hover { background: #fff; color: var(--navy); }
.faner a.aktiv { background: var(--navy); color: #fff; }

/* Beskjæring av lagbilder (admin) */
.beskjaer-bak { position: fixed; inset: 0; background: rgba(10,24,48,0.85); z-index: 100; display: flex; align-items: center; justify-content: center; padding: 16px; }
.beskjaer-bak[hidden] { display: none !important; }
.beskjaer-boks { background: #fff; border-radius: 18px; padding: 20px; width: min(760px, 100%); max-height: 100%; overflow: auto; display: flex; flex-direction: column; gap: 14px; }
.beskjaer-boks h2 { font-size: 26px; color: var(--navy); }
.beskjaer-ramme { position: relative; width: 100%; aspect-ratio: 4 / 3; overflow: hidden; background: #fff; border-radius: 10px; outline: 3px solid var(--gold); cursor: grab; touch-action: none; user-select: none; }
.beskjaer-ramme:active { cursor: grabbing; }
.beskjaer-ramme img { position: absolute; left: 0; top: 0; max-width: none; transform-origin: 0 0; pointer-events: none; }
.beskjaer-zoom { display: flex; align-items: center; gap: 12px; font-weight: 600; }
.beskjaer-zoom input { flex: 1; accent-color: var(--red); }
.kamp-innliming { width: 100%; font: 14px/1.5 ui-monospace, Menlo, Consolas, monospace; padding: 12px; border: 2px solid var(--line); border-radius: 10px; resize: vertical; tab-size: 12; white-space: pre; }

/* ===== DAGENS FOTBALLSITAT (forsiden) =====
   Sitatet kommer fra ordtak.no med egen liten ramme. Reglene under
   overstyrer størrelse, ramme og skrift, så sitatet fyller boksen. */
.sitat { display: flex; flex-direction: column; gap: 12px; }
.sitat h2 { font-size: 28px; color: var(--note-ink); }
.sitat-boks { border-left: 6px solid var(--gold); padding-left: 18px; font-family: var(--font-head); font-size: 26px; line-height: 1.35; color: var(--ink); }
.sitat-boks * { width: auto !important; max-width: 100% !important; height: auto !important; border: 0 !important; background: transparent !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; font-family: inherit !important; font-size: inherit !important; line-height: inherit !important; color: inherit !important; text-align: left !important; }
.sitat-boks table { width: 100% !important; border-collapse: collapse; }
.sitat-boks a { font-family: var(--font-body) !important; font-size: 17px !important; color: var(--note-ink) !important; }
.sitat-boks b, .sitat-boks strong { font-family: var(--font-body) !important; font-size: 15px !important; text-transform: uppercase; letter-spacing: 1px; color: var(--muted) !important; }
@media (max-width: 760px) { .sitat-boks { font-size: 22px; } }

/* ===== NYHETSARKIV (nederst på forsiden) ===== */
.arkiv { display: flex; flex-direction: column; gap: 12px; scroll-margin-top: 20px; }
.arkiv .section-title { margin-bottom: -4px; }
.arkiv > .hint { margin: 0 0 4px; }
.arkiv details { scroll-margin-top: 20px; }
.arkiv summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 12px; }
.arkiv summary::-webkit-details-marker { display: none; }
.arkiv summary::after { content: ""; width: 9px; height: 9px; margin-left: auto; flex: none; border-right: 2.5px solid currentColor; border-bottom: 2.5px solid currentColor; transform: rotate(45deg) translate(-2px, -2px); transition: transform .2s; }
.arkiv details[open] > summary::after { transform: rotate(-135deg) translate(-2px, -2px); }
.arkiv summary:focus-visible { outline: 3px solid var(--gold); outline-offset: 2px; }

/* periodene: kort med farget topp, som faktaboksene */
.arkiv-gruppe { background: #fff; border-radius: 16px; border-top: 6px solid var(--navy); box-shadow: 0 6px 18px rgba(14,26,43,0.06); overflow: hidden; }
.arkiv-gruppe:first-of-type { border-top-color: var(--red); }
.arkiv-gruppe > summary { padding: 18px 24px; color: var(--navy); }
.arkiv-gruppe > summary:hover { background: var(--bg); }
.arkiv-periode { font-family: var(--font-head); font-size: 26px; }
.arkiv-antall { font-size: 13px; font-weight: 600; color: var(--muted); background: var(--pale); padding: 3px 10px; border-radius: 20px; white-space: nowrap; }

/* årene inne i en periode */
.arkiv-gruppe[open] > summary { border-bottom: 1px solid var(--pale); }
.arkiv-gruppe details { border-bottom: 1px solid var(--pale); }
.arkiv-gruppe details:last-child { border-bottom: 0; }
.arkiv-gruppe details > summary { padding: 12px 24px; color: var(--navy); border-left: 4px solid transparent; }
.arkiv-gruppe details > summary:hover { background: var(--bg); border-left-color: var(--line); }
.arkiv-gruppe details[open] > summary { background: var(--note-bg); border-left-color: var(--gold); }
.arkiv-aarstall { font-family: var(--font-head); font-size: 20px; min-width: 52px; }

/* sakene: tidslinje */
.arkiv-innhold { padding: 18px 24px 26px 28px; display: flex; flex-direction: column; gap: 22px; border-left: 4px solid var(--gold); }
.arkiv-innhold > p:first-child a { font-weight: 600; }
.arkiv-sak { display: flex; flex-direction: column; gap: 8px; position: relative; padding-left: 22px; border-left: 2px solid var(--pale); }
.arkiv-sak::before { content: ""; position: absolute; left: -7px; top: 4px; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 2px solid var(--red); }
.arkiv-sak h3 { font-family: var(--font-body); font-size: 20px; font-weight: 600; color: var(--navy); }
.arkiv-sak .meta { font-size: 13px; color: var(--muted); font-weight: 600; letter-spacing: .03em; }
.arkiv-liste { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 4px; }
.arkiv-logg { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; }
.arkiv-logg dt { font-weight: 700; color: var(--red-dark); white-space: nowrap; }
.arkiv-logg dd { margin: 0; }
@media (max-width: 600px) {
  .arkiv-gruppe > summary, .arkiv-gruppe details > summary { padding-left: 18px; padding-right: 18px; }
  .arkiv-periode { font-size: 22px; }
  .arkiv-innhold { padding: 16px 16px 20px 18px; }
}

/* ===== FINN SPILLER (historie/finn-spiller.asp) ===== */
.sok-kort { border-top: 6px solid var(--red); }
.sok-label { font-family: var(--font-head); font-size: 24px; color: var(--navy); }
.sok-felt { width: 100%; font: inherit; font-size: 20px; padding: 14px 18px; border: 2px solid var(--line); border-radius: 12px; background: #fff; color: var(--ink); }
.sok-felt:focus { outline: none; border-color: var(--navy); box-shadow: 0 0 0 4px var(--pale); }
.sok-status { font-weight: 600; color: var(--muted); margin: 0; min-height: 1.4em; }
.sok-treff { display: flex; flex-direction: column; gap: 14px; }
.spiller { gap: 12px; }
.spiller-topp { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px; }
.spiller-topp h3 { font-size: 24px; color: var(--navy); }
.spiller-tall { display: flex; flex-wrap: wrap; gap: 6px; }
.spiller-tall span { background: var(--pale); color: var(--navy); border-radius: 20px; padding: 4px 12px; font-size: 14px; }
.spiller-ar { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--pale); }
.spiller-ar li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; padding: 9px 0; border-bottom: 1px solid var(--pale); }
.spiller-ar li:last-child { border-bottom: 0; }
.spiller-ar .ar { font-family: var(--font-head); font-size: 18px; min-width: 48px; text-decoration: none; }
.ar-info { flex: 1 1 200px; }
.ar-mal { color: var(--muted); }
.ar-merker { display: flex; flex-wrap: wrap; gap: 6px; }
.merke { font-size: 13px; font-weight: 600; border-radius: 20px; padding: 3px 10px; white-space: nowrap; }
.merke-gull { background: #FCEFC7; color: #6B4A00; }
.merke-solv { background: #E6EAF0; color: #3B4656; }
.merke-bronse { background: #F6E1D3; color: #6E3A12; }
.merke-pris { background: #FBE3E6; color: var(--red-dark); }
.sok-overskrift { font-size: 26px; color: var(--navy); margin-top: 8px; }
.lagtreff { border-left: 6px solid var(--navy); }
.ar-spillere { flex: 1 1 100%; font-size: 14px; color: var(--muted); line-height: 1.6; padding-left: 62px; }
.ar-spillere a { color: var(--muted); }
.ar-spillere a:hover { color: var(--red-dark); }
@media (max-width: 600px) { .ar-spillere { padding-left: 0; } }