:root {
  color-scheme: light;
  /* Brand and semantic colours. Keep these aliases for existing page styles. */
  --navy: #0B1F33;
  --blue: #1769AA;
  --gold: #E2B500;
  --green: #18794E;
  --red: #B42318;
  --page: #F2F5F7;
  --card: #FFFFFF;
  --text: #102235;
  --muted: #5A6B7F;
  --line: #D6DFE8;
  /* Shared surfaces, borders, elevations and component dimensions. */
  --surface: var(--card);
  --surface-subtle: #EAF0F5;
  --border: var(--line);
  --text-secondary: var(--muted);
  --height-control: 2.75rem;
  --height-mobile-nav: 4.5rem;
  --radius-small: 0.6rem;
  --radius-card: 1rem;
  --shadow: 0 0.25rem 1.2rem rgb(11 31 51 / 6%);
  --shadow-menu: 0 0.5rem 2rem rgb(11 31 51 / 18%);
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2rem;
  --page-width: 72rem;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.5;
}

* { box-sizing: border-box; }
body { min-width: 0; margin: 0; color: var(--text); background: var(--page); }
a { color: var(--blue); text-underline-offset: 0.16em; }
a:hover { color: var(--navy); }
.site-shell { min-height: 100vh; }
.site-header { background: var(--navy); color: white; box-shadow: 0 0.25rem 0.75rem rgb(11 31 51 / 18%); }
.site-header__inner, .page-shell, .site-main, .site-footer, .site-private__inner { width: min(100% - 2rem, var(--page-width)); margin-inline: auto; }
.site-header__inner { display: flex; align-items: center; gap: var(--space-2); min-height: 4.75rem; }
.brand { display: inline-flex; min-width: max-content; min-height: var(--height-control); align-items: center; gap: 0.7rem; color: white; text-decoration: none; }
.brand:hover { color: white; }
.brand-logo { width: 4rem; height: 3rem; object-fit: contain; border-radius: var(--radius-small); background: white; }
.brand-name { font-size: 1.05rem; font-weight: 800; letter-spacing: -0.025em; }
/* Desktop header and mobile bottom bar share one accessible navigation macro. */
.site-nav { display: flex; min-width: 0; margin-left: auto; gap: 0.25rem; align-items: center; }
.site-nav a, .site-nav summary, .site-nav button { display: flex; min-height: var(--height-control); align-items: center; gap: 0.4rem; padding: 0.55rem 0.85rem; border-radius: var(--radius-small); font-weight: 700; text-decoration: none; white-space: nowrap; }
.site-nav--desktop > a, .site-nav--desktop > details > summary { color: #F6FAFE; }
.site-nav--desktop > a:hover, .site-nav--desktop > details > summary:hover { background: rgb(255 255 255 / 12%); color: white; }
.site-nav--desktop > .nav-link--active, .site-nav--desktop > details > .nav-link--active, .site-nav--desktop > details[open] > summary { background: rgb(255 255 255 / 18%); }
.nav-link__symbol { font-size: 1.35rem; line-height: 1; font-weight: 600; }
.site-nav--desktop .nav-link__symbol { display: none; }
.site-nav--desktop .site-nav__more .nav-link__symbol { display: inline; }
.site-nav--mobile { display: none; }
.site-nav__more { position: relative; padding: 0; }
.site-nav__more > summary { list-style: none; cursor: pointer; }
.site-nav__more > summary::-webkit-details-marker { display: none; }
.site-nav--desktop .site-nav__more > summary::after { content: "⌄"; margin-left: 0.2rem; }
.site-nav__panel { position: absolute; z-index: 30; top: calc(100% + 0.5rem); right: 0; width: 15rem; max-width: calc(100vw - 2rem); padding: 0.5rem; border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--surface); box-shadow: var(--shadow-menu); }
.site-nav__panel a, .site-nav__panel button { width: 100%; color: var(--text); }
.site-nav__panel a:hover, .site-nav__panel .nav-link--active, .site-nav__panel button:hover { background: var(--surface-subtle); color: var(--navy); }
.site-nav__panel form { margin-top: 0.35rem; padding-top: 0.35rem; border-top: 1px solid var(--border); }
.site-nav__panel .button-quiet { justify-content: flex-start; border-color: transparent; background: transparent; font-weight: 700; }
.site-main { padding-block: var(--space-3) var(--space-4); }
.status-strip { margin: 0 0 var(--space-3); padding: 0.75rem 0.9rem; border: 1px solid var(--border); border-radius: var(--radius-small); background: var(--surface-subtle); color: #30475F; font-size: 0.9rem; }
.status-strip p { margin: 0.4rem 0 0; }
.status-strip .error { color: var(--red); }
h1, h2, h3 { line-height: 1.16; letter-spacing: -0.035em; }
h1 { margin: 0 0 0.7rem; font-size: clamp(1.9rem, 5vw, 2.7rem); }
h2 { margin: 0 0 0.55rem; font-size: clamp(1.25rem, 3vw, 1.6rem); }
h3 { margin: 0 0 0.45rem; }
p, ul, ol, dl, table { margin-top: 0; }
article, .card, .app-card, .site-private__card { margin-block: var(--space-2); padding: var(--space-3); border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--surface); box-shadow: var(--shadow); }
.page-intro { max-width: 50rem; margin-bottom: 1.25rem; }
.page-intro p { color: var(--muted); font-size: 1.05rem; }
.home-hero { margin-bottom: var(--space-2); }
.home-hero p { margin-bottom: 0; }
.candidate-day { margin-top: var(--space-4); }
.candidate-day > h2 { display: flex; align-items: center; gap: var(--space-1); margin-bottom: var(--space-1); color: var(--navy); }
.candidate-day > h2::before { width: 0.5rem; height: 0.5rem; border-radius: 999px; background: var(--gold); content: ""; }
.action-row.quick-actions { margin-block: var(--space-2) var(--space-3); }
.candidate-card { border-top: 0.25rem solid var(--blue); }
.candidate-card h2 > a { display: inline-flex; align-items: center; min-height: var(--height-control); }
.candidate-card__overview { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: var(--space-3); align-items: start; }
.candidate-card__decision { padding: var(--space-2); border-radius: var(--radius-small); background: var(--surface-subtle); }
.candidate-card__decision p:last-child { margin-bottom: 0; }
.candidate-card__odds { font-size: 1.15rem; color: var(--navy); }
.candidate-card__metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); margin-bottom: 0.4rem; }
.candidate-card__metrics > div { min-width: 0; padding: 0.75rem; border: 1px solid var(--border); border-radius: var(--radius-small); }
.candidate-card__metrics dt { color: var(--text-secondary); font-size: 0.9rem; }
.candidate-card__metrics dd { margin: 0; font-size: 1.3rem; font-variant-numeric: tabular-nums; }
.candidate-card__context { margin-bottom: 0; font-size: 0.9rem; }
.candidate-card > details { border-top: 1px solid var(--border); }
.result-tips { border-top: 0.25rem solid var(--gold); }
.result-tips h3 { margin-top: var(--space-3); }
.result-tips h4 { margin: var(--space-2) 0 var(--space-1); }
.tip-list { margin: 0; padding: 0; list-style: none; }
.tip-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0.25rem var(--space-2); align-items: center; padding: 0.75rem 0; border-top: 1px solid var(--border); }
.tip-row__match { display: flex; gap: 0.6rem; align-items: baseline; min-width: 0; }
.tip-row__match strong, .tip-row__match .muted { display: block; overflow-wrap: anywhere; }
.tip-row__match .muted { font-size: 0.9rem; }
.tip-row__position { flex: none; min-width: 1.5rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.tip-sign { display: inline-flex; flex-direction: column; align-items: center; min-width: 4.5rem; padding: 0.3rem 0.6rem; border-radius: var(--radius-small); background: var(--navy); color: white; font-size: 1.3rem; font-weight: 800; line-height: 1.1; }
.tip-sign small { font-size: 0.7rem; font-weight: 600; }
.tip-row__numbers { grid-column: 1 / -1; margin: 0; font-size: 0.95rem; font-variant-numeric: tabular-nums; }
.tip-odds-only { margin-top: var(--space-2); padding: var(--space-2); border-radius: var(--radius-small); background: var(--surface-subtle); }
.tip-odds-only > p { margin: 0 0 0.25rem; }
.tip-odds-only .tip-sign { background: var(--muted); }
.result-tips > details > summary, .home-guide > details > summary { cursor: pointer; color: var(--navy); font-size: 1.25rem; font-weight: 800; }
.result-tips > details[open] > summary, .home-guide > details[open] > summary { margin-bottom: var(--space-2); }
.coupon-odds-panel { border-top: 0.25rem solid var(--gold); }
.coupon-odds-scroll { overflow-x: auto; }
.t9r-overview-odds + .t9r-overview-odds { margin-top: var(--space-2); }
.t9r-overview-odds > summary { cursor: pointer; padding: 0.6rem 0; color: var(--navy); font-weight: 800; }
.t9r-overview-odds[open] > summary { margin-bottom: var(--space-1); }
.coupon-odds { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.coupon-odds th, .coupon-odds td { padding: 0.45rem 0.3rem; border-top: 1px solid var(--border); text-align: right; vertical-align: top; }
.coupon-odds th:nth-child(2), .coupon-odds td:nth-child(2) { text-align: left; width: 100%; overflow-wrap: anywhere; }
.coupon-odds td:nth-child(2) .muted { display: block; font-size: 0.85rem; }
.coupon-odds td[colspan] { text-align: right; white-space: nowrap; }
.coupon-odds__position { color: var(--muted); }
.coupon-odds__lowest { font-weight: 800; }
.coupon-odds-panel > p { margin: 0.5rem 0 0; font-size: 0.85rem; }
.coupon-form { display: grid; gap: 0.2rem; margin-top: 0.35rem; }
.team-form { display: flex; flex-wrap: wrap; align-items: center; gap: 0.2rem 0.35rem; min-width: 0; font-size: 0.85rem; }
.team-form__name { flex: 1 1 6rem; min-width: 0; color: var(--text-secondary); overflow-wrap: anywhere; }
.team-form__rank { font-weight: 800; }
.team-form__missing { color: var(--muted); font-style: italic; }
.form-results { display: inline-flex; gap: 0.15rem; }
.form-result { display: inline-grid; place-items: center; width: 1.25rem; height: 1.25rem; border-radius: 0.25rem; color: white; font-size: 0.7rem; font-weight: 800; }
.form-result--V { background: var(--green); }
.form-result--U { background: #7A8794; }
.form-result--T { background: var(--red); }
.form-card { max-width: 38rem; }
.form-card h2 { margin-bottom: var(--space-3); }
.form-card input:not([type="hidden"]), .form-card select { width: 100%; }
.report-summary { border-left: 0.3rem solid var(--navy); }
.report-summary p:last-child, .report-card p:last-child { margin-bottom: 0; }
.status-badge { display: inline-flex; padding: 0.35rem 0.7rem; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-subtle); color: var(--navy); font-size: 0.95rem; }
.muted { color: var(--muted); }
.error { color: var(--red); font-weight: 800; }
[role="status"] { color: var(--green); font-weight: 700; }
.actions, .action-row { display: flex; flex-wrap: wrap; gap: 0.65rem; align-items: center; }
.action-row { margin: 1rem 0; }
button, .button { display: inline-flex; min-height: var(--height-control); align-items: center; justify-content: center; gap: 0.4rem; padding: 0.5rem 0.85rem; border: 1px solid var(--blue); border-radius: var(--radius-small); background: var(--blue); color: white; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
button[hidden], [hidden] { display: none !important; }
button:hover, .button:hover { background: #10568d; border-color: #10568d; color: white; }
button:focus-visible, a:focus-visible, summary:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid #1769AA; outline-offset: 3px; box-shadow: 0 0 0 3px white; }
.site-header :focus-visible { outline-color: var(--gold); box-shadow: none; }
.site-header .site-nav__panel :focus-visible { outline-color: var(--blue); box-shadow: 0 0 0 3px white; }
.button-secondary { border-color: #A9B9CA; background: white; color: var(--navy); }
.button-secondary:hover { border-color: var(--blue); background: #EAF3FB; color: var(--navy); }
.button-danger { border-color: var(--red); background: var(--red); }
.button-danger:hover { border-color: #8F1B13; background: #8F1B13; }
form { margin: 0; }
label { display: block; font-weight: 800; }
legend { display: block; margin: 0 0 0.5rem; padding: 0; font-weight: 800; }
/* Felles regel: hjelpetekst står 0,5rem under overskrift, legend eller etikett, og tett under feltet den forklarer. */
.field-help { margin: 0.5rem 0 var(--space-3); color: var(--text-secondary); font-size: 0.9rem; }
:is(input, select, textarea) + .field-help { margin-top: -0.4rem; }
input, select, textarea { display: block; width: min(100%, 32rem); min-height: var(--height-control); margin: 0.35rem 0 1rem; padding: 0.55rem 0.65rem; border: 1px solid #9AAABA; border-radius: var(--radius-small); background: white; color: var(--text); font: inherit; }
textarea { min-height: 7rem; resize: vertical; }
.player-order { margin: 0.35rem 0 1rem; padding: 0; border: 0; }
dl { display: grid; grid-template-columns: minmax(9rem, max-content) 1fr; gap: 0.35rem 1rem; }
dd { margin: 0; }
details { padding: 0.8rem 0 0; }
summary { min-height: var(--height-control); cursor: pointer; color: var(--blue); font-weight: 800; }
table { width: 100%; border-collapse: collapse; background: white; }
th, td { padding: 0.7rem; border-bottom: 1px solid var(--line); text-align: left; }
th { color: var(--muted); font-size: 0.87rem; text-transform: uppercase; letter-spacing: 0.04em; }
.risk-note { margin-top: 1rem; padding: 0.8rem 0.9rem; border-left: 0.3rem solid #90A4B8; border-radius: 0.35rem; background: #F3F6F8; color: #43576C; }
.archive-status { display: inline-flex; padding: 0.24rem 0.55rem; border-radius: 999px; background: #E5F4EB; color: #145D3A; font-size: 0.9rem; font-weight: 800; }
.stats-summary { border-left: 0.35rem solid var(--gold); }
.available-coupons { border-left: 0.35rem solid var(--gold); }
.available-coupons__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); padding: 0; list-style: none; }
.available-coupons__list li { display: grid; gap: 0.2rem; padding: 0.85rem 1rem; border: 1px solid var(--border); border-radius: var(--radius-small); background: var(--surface-subtle); }
.available-coupons__list span { color: var(--text-secondary); }
.t9r-hub { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: var(--space-3); align-items: start; }
.meeting-step { min-width: 0; margin: 0; }
.meeting-step--join { border-top: 0.25rem solid var(--navy); }
.meeting-step__heading { display: flex; align-items: center; gap: 0.75rem; margin-bottom: var(--space-2); }
.meeting-step__heading h2 { margin: 0; }
.meeting-step__number { display: grid; flex: 0 0 2.5rem; height: 2.5rem; place-items: center; border-radius: var(--radius-small); background: var(--surface-subtle); color: var(--navy); font-weight: 800; }
.meeting-step input:not([type="hidden"]), .meeting-step select, .meeting-step textarea { width: 100%; }
.meeting-step #meeting_code { font-size: 1.5rem; font-weight: 800; letter-spacing: 0.15em; font-variant-numeric: tabular-nums; }
.meeting-step__system { margin-bottom: var(--space-3); padding: var(--space-2); border: 1px solid var(--border); border-radius: var(--radius-small); background: var(--surface-subtle); }
.meeting-step__system select { font-size: 1.1rem; font-weight: 800; }
.meeting-step__system .field-help { margin-bottom: 0; }
.meeting-step__host { padding: 0.75rem 0; border-bottom: 1px solid var(--border); }
.meeting-code-card { margin-bottom: var(--space-3); padding: var(--space-3); border: 1px solid var(--border); border-radius: var(--radius-small); background: var(--surface-subtle); text-align: center; }
.meeting-code-card p { margin-bottom: 0.35rem; color: var(--text-secondary); }
.meeting-code-card strong { display: block; color: var(--navy); font-size: clamp(1.6rem, 6vw, 2.5rem); letter-spacing: 0.16em; font-variant-numeric: tabular-nums; }
.archive-list { display: grid; gap: var(--space-2); padding: 0; list-style: none; }
.archive-entry { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2); margin: 0; }
.archive-entry > div { min-width: 0; }
.archive-entry__link { display: inline-flex; align-items: center; min-height: var(--height-control); font-size: 1.1rem; font-weight: 800; }
.archive-entry p { margin-bottom: 0; }
.stats-summary { padding-left: var(--space-2); }
.stats-table-wrap { max-width: 100%; overflow-x: auto; margin-bottom: var(--space-3); }
.stats-table-wrap:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.stats-table-wrap table { min-width: 38rem; margin-bottom: 0; }
.stats-table-wrap th:not(:first-child), .stats-table-wrap td:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }
.site-footer { padding-bottom: 1.5rem; color: var(--muted); font-size: 0.9rem; }
.site-private { display: grid; min-height: 100vh; place-items: center; padding: 1rem; background: var(--page); }
.site-private__inner { width: min(100%, 31rem); }
.site-private__brand { justify-content: center; margin-bottom: 1.1rem; color: var(--navy); }
.site-private__brand:hover { color: var(--navy); }
.site-private__card { margin: 0; }
/* Active and archived coupons: selection states and markers shared by both views. */
.coupon-page { max-width: 52rem; margin-inline: auto; }
.coupon-page .page-intro { margin-bottom: var(--space-2); }
.coupon-page .page-intro p { margin-bottom: 0; }
.coupon-shell { overflow: hidden; padding: 0; border-color: #c7d2dc; background: #fff; }
.coupon-card { box-shadow: var(--shadow); }
.coupon-deadline { margin: 0; padding: .7rem 1rem; background: var(--gold); color: var(--navy); text-align: center; font-weight: 900; }
.coupon-grid { padding: .8rem 1rem 1rem; }
.coupon-head, .coupon-row { display: grid; grid-template-columns: minmax(0, 1fr) auto repeat(3, var(--height-control)); gap: .3rem; align-items: center; }
.coupon-head { padding: 0 .05rem .5rem; color: var(--navy); font-weight: 900; text-align: center; }
.coupon-head-label { text-align: left; }
.coupon-row { padding: .52rem 0; border-top: 1px solid var(--line); }
.coupon-row:nth-of-type(4n) { border-top-width: 2px; }
.coupon-fixture { min-width: 0; font-weight: 750; }
.coupon-kickoff { white-space: nowrap; font-size: .88rem; color: var(--muted); }
.coupon-choice { display: contents; }
.coupon-box { position: relative; display: grid; place-items: center; min-height: var(--height-control); padding: .2rem; border: 2px solid #556D84; border-radius: .45rem; background: #fff; color: var(--navy); font: inherit; font-weight: 900; }
.coupon-box:not(:disabled) { cursor: pointer; }
.coupon-box:not(:disabled):hover { border-color: var(--blue); background: #EAF3FB; }
.coupon-box:disabled { opacity: 1; color: #6A7A8B; border-color: #AAB7C3; background: #F4F7F9; cursor: default; }
.coupon-box.is-selected { border: 3px solid var(--navy); background: #CFE3F7; color: var(--navy); }
.coupon-box.is-full-cover { border-color: #0E6A46; background: #E6F5EC; }
.coupon-picker { color: var(--red); font-size: 1rem; line-height: 1; font-weight: 900; }
.coupon-picker--half { display: grid; place-items: center; width: 1.55rem; height: 1.55rem; border: 2px solid currentColor; border-radius: 50%; }
.coupon-picker--full { display: grid; place-items: center; width: 1.35rem; height: 1.35rem; border: 2px solid currentColor; border-radius: 50%; outline: 2px solid currentColor; outline-offset: 3px; }
.coupon-box.is-pending { border-color: var(--gold); background: #FFF8D8; box-shadow: 0 0 0 3px rgb(226 181 0 / 38%); }
.coupon-box.is-last-choice { border: 3px solid var(--gold); box-shadow: 0 0 0 2px var(--navy); }
.last-choice { margin: 0 0 .6rem; padding: .45rem .75rem; border-left: .35rem solid var(--gold); background: #FFFBE8; color: var(--navy); font-weight: 800; }
.turn-panel { margin-block: 1rem; font-size: 1.08rem; }
.turn-panel > strong { display: block; margin-bottom: 0.35rem; font-size: 1.2rem; }
.turn-panel--active { border: 3px solid var(--blue); background: #E5F1FC; color: var(--navy); box-shadow: 0 0.55rem 1.3rem rgb(23 105 170 / 16%); }
.turn-panel--half-cover { border-color: #B58900; background: #FFF5C5; }
.turn-panel--full-cover { border-color: var(--green); background: #E7F5EC; }
.turn-panel--waiting { border-color: #B9C5D0; background: #F4F7F9; color: #53687A; box-shadow: none; }
.turn-panel-label { display: inline-flex; margin: 0 0.45rem 0 0; padding: .18rem .45rem; border-radius: 999px; background: var(--gold); color: var(--navy); font-size: .8rem; font-weight: 900; vertical-align: middle; }
.your-turn-banner { position: sticky; z-index: 35; top: 0; margin: 0 0 1rem; padding: 1rem; border: 3px solid var(--navy); border-radius: var(--radius-small); background: var(--gold); color: var(--navy); box-shadow: 0 .5rem 1.25rem rgb(11 31 51 / 22%); font-size: clamp(2rem, 9vw, 3rem); font-weight: 900; line-height: 1.1; text-align: center; }
.round-finished-banner { margin: 0 0 1rem; padding: .8rem 1rem; border-radius: var(--radius-small); background: var(--navy); color: white; font-size: 1.25rem; font-weight: 900; text-align: center; }
.turn-screen-flash { position: fixed; z-index: 60; inset: 0; background: var(--gold); opacity: 0; pointer-events: none; animation-name: turn-screen-flash; animation-duration: .667s; animation-timing-function: ease-in-out; animation-iteration-count: 3; animation-fill-mode: both; }
@keyframes turn-screen-flash { 0%, 100% { opacity: 0; } 45%, 55% { opacity: .85; } }
@media (prefers-reduced-motion: reduce) { .turn-screen-flash { display: none; animation: none; } }
.humor-message { position: fixed; z-index: 70; top: 50%; left: 50%; width: min(90vw, 32rem); padding: 1.5rem 1.25rem; border: 4px solid var(--navy); border-radius: var(--radius-card); background: var(--gold); color: var(--navy); box-shadow: 0 1rem 2.5rem rgb(11 31 51 / 35%); font-size: clamp(2.25rem, 11vw, 4rem); font-weight: 900; line-height: 1.1; text-align: center; pointer-events: none; transform: translate(-50%, -50%); }
.round-cancelled { position: fixed; z-index: 80; inset: 0; display: grid; place-items: center; padding: 1rem; background: rgb(11 31 51 / 55%); }
.round-cancelled__box { width: min(100%, 28rem); padding: 1.5rem 1.25rem; border: 4px solid var(--navy); border-radius: var(--radius-card); background: var(--surface); color: var(--navy); box-shadow: 0 1rem 2.5rem rgb(11 31 51 / 35%); font-size: clamp(1.6rem, 7vw, 2.4rem); font-weight: 900; line-height: 1.15; text-align: center; }
.round-cancelled__box p { margin: 0 0 1.25rem; }
.round-cancelled__box .button { min-width: 8rem; font-size: 1.1rem; }
.turn-panel--full-cover .turn-panel-label { background: var(--green); color: white; }
.coupon-row--cover-choice { background: #FFFBE8; box-shadow: inset .35rem 0 var(--gold); }
dialog { max-width: min(28rem, calc(100vw - 2rem)); border: 1px solid var(--line); border-radius: .8rem; box-shadow: 0 .8rem 2.5rem rgb(11 31 51 / 35%); }
dialog::backdrop { background: rgb(11 31 51 / 58%); }
dialog[hidden] { display: none; }
/* Private account forms and administrator member cards use the app's local tokens. */
.private-page { padding: var(--space-3) var(--space-2) calc(var(--space-3) + env(safe-area-inset-bottom)); }
.private-card { border-top: 0.25rem solid var(--navy); }
.private-card__header { margin-bottom: var(--space-3); }
.private-card__header h1 { font-size: clamp(1.65rem, 5vw, 2.15rem); }
.private-card__header p, .private-card__help { color: var(--text-secondary); }
.private-card__help { margin: var(--space-3) 0 0; font-size: 0.95rem; }
.private-return-link { display: inline-flex; min-height: var(--height-control); min-width: var(--height-control); align-items: center; }
.private-card input:not([type="hidden"]) { width: 100%; }
.private-card .error { padding: var(--space-2); border: 1px solid var(--red); border-radius: var(--radius-small); background: #FFF1F0; }
.private-admin { width: min(100%, 56rem); }
.private-admin__toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2, 0.5rem); margin-bottom: var(--space-3); }
.private-admin__section { margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--border); }
.private-admin__notice { padding: var(--space-2); border: 1px solid var(--border); border-radius: var(--radius-small); background: var(--surface-subtle); }
.private-member-card { margin-block: var(--space-3); border: 2px solid #9AAABA; box-shadow: 0 2px 6px rgb(11 31 51 / 12%); }
.private-member-card__heading h3 { font-size: 1.3rem; }
.login-block { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) var(--space-2); margin-block: var(--space-2); }
.login-block__badge { display: inline-flex; padding: 0.35rem 0.7rem; border: 2px solid var(--red); border-radius: 999px; background: #FFF1F0; color: var(--red); font-weight: 800; }
.login-block-banner { margin: 0 0 var(--space-3); padding: var(--space-2); border: 2px solid var(--red); border-left-width: 0.4rem; border-radius: var(--radius-small); background: #FFF1F0; color: var(--text); }
.login-block-banner strong { color: var(--red); }
.login-block-banner ul { margin: 0.4rem 0 var(--space-2); padding-left: 1.2rem; }
.private-member-card__heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-1); margin-bottom: var(--space-1); }
.private-member-card__heading h3 { margin: 0; overflow-wrap: anywhere; }
.private-member-card > p { margin-bottom: var(--space-2); color: var(--text-secondary); }
.private-member-card .action-row { margin-bottom: 0; }
@media (max-width: 47rem) {
  .available-coupons__list { grid-template-columns: minmax(0, 1fr); }
  .t9r-hub { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
  .meeting-step button { width: 100%; }
  .candidate-card__overview { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
  .quick-actions { align-items: stretch; flex-direction: column; }
  .quick-actions form, .quick-actions .button, .quick-actions button { width: 100%; }
  .site-header__inner { min-height: 4.25rem; }
  .brand { min-width: 0; }
  .brand-logo { width: 3.5rem; height: 2.65rem; }
  .brand-name { font-size: 1rem; }
  .site-nav--desktop { display: none; }
  .site-nav--mobile { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); position: fixed; z-index: 40; inset: auto 0 0; min-height: var(--height-mobile-nav); margin: 0; padding: 0.35rem 0.5rem; padding-bottom: env(safe-area-inset-bottom); border-top: 1px solid var(--border); background: var(--surface); box-shadow: 0 -0.25rem 1.25rem rgb(11 31 51 / 8%); }
  .site-nav--mobile > a, .site-nav--mobile > details > summary { flex-direction: column; justify-content: center; gap: 0.25rem; min-height: 3.75rem; padding: 0.4rem 0.25rem; color: var(--text-secondary); font-size: 0.8rem; }
  .site-nav--mobile > .nav-link--active, .site-nav--mobile > details > .nav-link--active, .site-nav--mobile > details[open] > summary { color: var(--blue); background: #EAF3FB; }
  .site-nav--mobile .site-nav__panel { top: auto; bottom: calc(100% + 0.85rem); max-height: calc(100dvh - 7rem - env(safe-area-inset-bottom)); overflow-y: auto; }
  .site-main { padding-block: var(--space-2) calc(var(--height-mobile-nav) + var(--space-3) + env(safe-area-inset-bottom)); }
  .site-footer { padding-bottom: calc(var(--height-mobile-nav) + var(--space-3) + env(safe-area-inset-bottom)); }
  .site-shell--private .site-main, .site-shell--private .site-footer { padding-bottom: var(--space-3); }
}
@media (max-width: 32rem) {
  .coupon-grid { padding: .6rem .5rem .75rem; }
  .coupon-head, .coupon-row { grid-template-columns: minmax(0, 1fr) repeat(3, var(--height-control)); gap: .2rem; }
  .coupon-head-time, .coupon-kickoff { display: none; }
  .coupon-box { min-height: var(--height-control); }
  .private-card { padding: var(--space-2); }
  .private-card form > button, .private-member-card .action-row button { width: 100%; }
  .candidate-card__metrics { grid-template-columns: minmax(0, 1fr); }
  .site-header__inner, .page-shell, .site-main, .site-footer { width: min(100% - 1.25rem, var(--page-width)); }
  article, .card, .app-card { padding: var(--space-2); }
  .coupon-shell { padding: 0; }
  .coupon-odds-scroll { overflow-x: visible; }
  .team-form__name { flex-basis: 100%; }
  dl { grid-template-columns: 1fr; gap: 0.1rem; }
  dd { margin-bottom: 0.45rem; }
}

.odds-stale-note { padding: var(--space-2); border-left: 0.3rem solid var(--navy); background: var(--surface-subtle); border-radius: var(--radius-small); }

/* T9R-regnskap */
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.accounting-intro h1 { margin-bottom: 0.3rem; }
.accounting-upload { margin-block: var(--space-3) var(--space-2); padding-top: var(--space-2); border-top: 1px solid var(--line); }
.accounting-upload label { display: block; font-weight: 700; }
.accounting-upload input[type="file"] { display: block; max-width: 100%; margin-bottom: 0.75rem; }
.accounting-intro p { margin: 0; }
.accounting-years { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: var(--space-2) 0 0.5rem; }
.accounting-years__year { padding: 0.35rem 0.8rem; border-radius: 99px; border: 1px solid var(--line); background: var(--card); color: var(--navy); font-weight: 700; font-size: 0.9rem; white-space: nowrap; text-decoration: none; }
.accounting-years__year--active { background: var(--navy); border-color: var(--navy); color: white; }
.accounting-years__year--off { color: #9AA8B6; }
.accounting-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; margin-block: var(--space-2); }
.accounting-kpi { padding: var(--space-2); border: 1px solid var(--line); border-radius: var(--radius-card); background: var(--card); }
.accounting-kpi b { display: block; font-size: clamp(1.25rem, 5vw, 1.7rem); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.accounting-kpi span { font-size: 0.85rem; color: var(--muted); }
.accounting-kpi--main { background: var(--navy); border-color: var(--navy); color: white; }
.accounting-kpi--main span { color: #C9D6E3; }
.accounting-table-wrap { overflow-x: auto; }
.accounting-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.accounting-table th, .accounting-table td { padding: 0.55rem 0.4rem; border-bottom: 1px solid var(--line); text-align: right; }
.accounting-table th:first-child, .accounting-table td:first-child { text-align: left; }
.accounting-table td { white-space: nowrap; }
.accounting-table th { font-size: 0.8rem; color: var(--muted); font-weight: 700; }
.accounting-table--members th, .accounting-table--members td { padding-inline: 0.25rem; font-size: 0.88rem; }
.accounting-table--ranked th:first-child, .accounting-table--ranked td:first-child { width: 3.5rem; }
.accounting-table--ranked th:nth-child(2), .accounting-table--ranked td:nth-child(2) { text-align: left; }
.accounting-table tr.sum td { font-weight: 800; border-bottom: 0; border-top: 2px solid var(--navy); }
.accounting-explain { font-size: 0.85rem; color: var(--muted); margin: 0.6rem 0 0; }
.crown { color: var(--gold); }
.back-row { margin: 0 0 var(--space-2); }
.back-button { min-height: var(--height-control); padding-inline: 1rem; }
.t9r-quicklinks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.5rem; margin: 0 0 var(--space-3); }
.t9r-quicklinks .button { padding: 0.4rem 0.5rem; font-size: 0.9rem; line-height: 1.15; text-align: center; }
.accounting-kpi .pos, .accounting-table .pos, .tx .pos { color: var(--green); }
.accounting-kpi .neg, .accounting-table .neg, .tx .neg { color: var(--red); }
.accounting-kpi--main .pos, .accounting-kpi--main .neg { color: inherit; }
.accounting-filters { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; margin-bottom: 0.6rem; }
.accounting-filters[hidden] { display: none; }
.accounting-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.accounting-chip { min-height: 2.25rem; padding: 0.35rem 0.75rem; border-radius: 99px; border: 1px solid var(--line); background: var(--card); color: var(--text); font-size: 0.88rem; font-weight: 600; }
.accounting-chip--active { background: var(--blue); border-color: var(--blue); color: white; }
.accounting-filters select { width: auto; min-width: 11rem; }
.tx { list-style: none; margin: 0; padding: 0; }
.tx__item { display: grid; grid-template-columns: 4.2rem 1fr auto; gap: 0.2rem 0.7rem; padding: 0.65rem 0; border-bottom: 1px solid var(--line); }
.tx__item[hidden] { display: none; }
.tx__date { color: var(--muted); font-size: 0.85rem; padding-top: 0.1rem; }
.tx__text { font-weight: 700; }
.tx__who { font-size: 0.85rem; color: var(--muted); font-weight: 400; }
.tx__amount { font-weight: 800; text-align: right; font-variant-numeric: tabular-nums; }
.tx__balance { display: block; font-size: 0.75rem; color: var(--muted); font-weight: 400; }
.tx__note { grid-column: 2 / -1; font-size: 0.82rem; color: var(--muted); background: var(--surface-subtle); padding: 0.3rem 0.55rem; border-radius: 0.5rem; }
.accounting-more { display: block; width: 100%; margin-top: 0.7rem; }
.accounting-more[hidden] { display: none; }
@media (max-width: 34rem) {
  .accounting-kpis { grid-template-columns: 1fr 1fr; }
  .accounting-kpi--main { grid-column: 1 / -1; }
}