/* Scoretavle – tavlemaler. All størrelse i em: tavla er 160 × 90 em (16:9), skalert av tavle.js. */

.tavle-beholder {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
}

.tavle {
  position: relative;
  width: 160em;
  height: 90em;
  overflow: hidden;
  font-family: "Arial Black", "Helvetica Neue", Arial, "Samsung Sans", Roboto, sans-serif;
  font-weight: 900;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  font-variant-numeric: tabular-nums;
}
.t-flate { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.t-topp { position: absolute; top: 2.4em; left: 0; right: 0; text-align: center; }
.t-klubb { font-size: 3em; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; overflow: hidden; }

.t-hoved {
  position: absolute; left: 3em; right: 3em; top: 8em; bottom: 4em;
  display: -webkit-box; display: -webkit-flex; display: flex;
}
.med-sponsor .t-hoved { bottom: 13em; }
.t-lag {
  position: relative;
  -webkit-box-flex: 1; -webkit-flex: 1 1 0; flex: 1 1 0;
  min-width: 0;
  display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-orient: vertical; -webkit-flex-direction: column; flex-direction: column;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
}
.t-navn { width: 100%; height: 14em; line-height: 14em; text-align: center; white-space: nowrap; overflow: hidden; }
.t-navn-t { display: inline-block; white-space: nowrap; line-height: 1.1; vertical-align: middle; }
.t-mal { -webkit-box-flex: 1; -webkit-flex: 1 1 auto; flex: 1 1 auto; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; }
.t-midt {
  -webkit-box-flex: 0; -webkit-flex: 0 0 46em; flex: 0 0 46em;
  display: -webkit-box; display: -webkit-flex; display: flex;
  -webkit-box-orient: vertical; -webkit-flex-direction: column; flex-direction: column;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
  -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center;
}
.t-fase { font-size: 4.6em; letter-spacing: .1em; white-space: nowrap; }
.t-tillegg { font-size: 4.4em; height: 1.2em; margin-top: .3em; }
.t-farge { display: none; }

/* 7-segment */
.seg-rad { display: inline-block; white-space: nowrap; line-height: 1; }
.seg-rad svg { height: 1em; display: inline-block; vertical-align: top; overflow: visible; }
.seg-siffer { width: .71em; }
.seg-kolon { width: .26em; }
.seg-skjult { display: none !important; }
.seg-paa { fill: currentColor; }
.seg-av { fill: currentColor; opacity: .07; }

/* Sponsorstripe */
.t-sponsor {
  position: absolute; left: 0; right: 0; bottom: 0; height: 11em;
  display: none;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
  -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center;
}
.med-sponsor .t-sponsor { display: -webkit-box; display: -webkit-flex; display: flex; }
.t-sponsor-etikett { font-size: 2.4em; letter-spacing: .14em; text-transform: uppercase; margin-right: 1.6em; opacity: .7; }
.t-sponsor-innhold { height: 8em; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; }
.t-sponsor-innhold img { max-height: 8em; max-width: 60em; display: block; }
.t-sponsor-navn { font-size: 4.4em; white-space: nowrap; }

/* Målfeiring */
.t-blink {
  position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 5;
  display: none;
  -webkit-box-orient: vertical; -webkit-flex-direction: column; flex-direction: column;
  -webkit-box-align: center; -webkit-align-items: center; align-items: center;
  -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center;
  text-align: center;
}
.t-blink.vis { display: -webkit-box; display: -webkit-flex; display: flex; }
.t-blink-tekst { font-size: 34em; letter-spacing: -.02em; }
.t-blink-lag { font-size: 8em; margin-top: .4em; max-width: 18em; white-space: nowrap; overflow: hidden; }
@-webkit-keyframes t-blunk { 0%, 49% { opacity: 1; } 50%, 100% { opacity: .12; } }
@keyframes t-blunk { 0%, 49% { opacity: 1; } 50%, 100% { opacity: .12; } }
@-webkit-keyframes t-inn { from { -webkit-transform: scale(.6); opacity: 0; } to { -webkit-transform: scale(1); opacity: 1; } }
@keyframes t-inn { from { transform: scale(.6); opacity: 0; } to { transform: scale(1); opacity: 1; } }

/* ===================== LED: røde 7-segment-tall mot svart ===================== */
.mal-led { background: #000; color: #ff2a12; }
.mal-led .t-klubb { color: #ff2a12; opacity: .55; font-family: "Lucida Console", "Courier New", monospace; font-weight: bold; }
.mal-led .t-navn-t { font-family: "Lucida Console", "Courier New", monospace; font-weight: bold; letter-spacing: .04em; }
.mal-led .t-mal { padding: 2em 0 1em; }
.mal-led .t-mal .seg-rad { font-size: 38em; }
.mal-led .t-midt { -webkit-box-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; }
.mal-led .t-klokke { height: 14em; margin: 0; }
.mal-led .t-klokke .seg-rad { font-size: 14em; }
.mal-led .t-fase { -webkit-box-ordinal-group: 2; -webkit-order: 2; order: 2; margin-top: 7em; font-family: "Lucida Console", "Courier New", monospace; font-weight: bold; }
.mal-led .t-tillegg { -webkit-box-ordinal-group: 3; -webkit-order: 3; order: 3; font-family: "Lucida Console", "Courier New", monospace; }
.mal-led .seg-rad svg { -webkit-filter: drop-shadow(0 0 .03em rgba(255, 40, 10, .6)); filter: drop-shadow(0 0 .03em rgba(255, 40, 10, .6)); }
.mal-led .t-sponsor { border-top: .25em solid #2a0703; color: #ff2a12; }
.mal-led .t-sponsor-navn { font-family: "Lucida Console", "Courier New", monospace; font-weight: bold; }
.mal-led .t-blink { background: #000; color: #ff2a12; }
.mal-led .t-blink.vis .t-blink-tekst { -webkit-animation: t-blunk .5s infinite; animation: t-blunk .5s infinite; text-shadow: 0 0 .08em rgba(255, 40, 10, .7); }
.mal-led .t-blink-lag { font-family: "Lucida Console", "Courier New", monospace; font-weight: bold; }
.mal-led.fase-pause .t-klokke, .mal-led.fase-slutt .t-klokke { opacity: .55; }

/* ===================== TV: sendingsgrafikk, mørk ===================== */
.mal-tv { background: #0b0e14; background: -webkit-radial-gradient(50% 35%, ellipse, #1d2533 0%, #0b0e14 70%); background: radial-gradient(ellipse at 50% 35%, #1d2533 0%, #0b0e14 70%); color: #fff; }
.mal-tv .t-klubb { color: #8a97ab; font-weight: 700; font-family: "Helvetica Neue", Arial, sans-serif; }
.mal-tv .t-lag { background: #151b26; border-radius: 2.4em; margin: 0 1em; overflow: hidden; }
.mal-tv .t-farge, .mal-lys .t-farge { display: block; width: 100%; height: 3.2em; -webkit-box-flex: 0; -webkit-flex: 0 0 auto; flex: 0 0 auto; }
.mal-tv .t-navn, .mal-lys .t-navn { height: 13em; line-height: 13em; padding: 0 2em; box-sizing: border-box; }
.mal-tv .t-navn-t, .mal-lys .t-navn-t { font-family: "Helvetica Neue", Arial, sans-serif; font-weight: 800; }
.mal-tv .t-mal, .mal-lys .t-mal { font-size: 34em; letter-spacing: -.04em; padding-bottom: .08em; }
.mal-tv .t-midt, .mal-lys .t-midt { -webkit-flex-basis: 38em; flex-basis: 38em; }
.mal-tv .t-klokke { font-size: 8.4em; background: #fff; color: #0b0e14; border-radius: .2em; padding: .14em .3em; margin: .3em 0; }
.mal-tv .t-fase { color: #c4cedd; font-family: "Helvetica Neue", Arial, sans-serif; font-weight: 800; }
.mal-tv .t-tillegg { color: #ff5a4a; }
.mal-tv .t-sponsor { background: #fff; color: #0b0e14; }
.mal-tv .t-blink, .mal-lys .t-blink { background: #d7261e; background: var(--lagfarge, #d7261e); color: #fff; }
.mal-tv .t-blink.lys-farge, .mal-lys .t-blink.lys-farge { color: #0b0e14; }
.mal-tv .t-blink.vis .t-blink-tekst, .mal-lys .t-blink.vis .t-blink-tekst, .mal-stor .t-blink.vis .t-blink-tekst { -webkit-animation: t-inn .45s cubic-bezier(.2, 1.4, .4, 1) both; animation: t-inn .45s cubic-bezier(.2, 1.4, .4, 1) both; }
.mal-tv.fase-pause .t-klokke, .mal-tv.fase-slutt .t-klokke { background: #3a4456; color: #fff; }

/* ===================== LYS: høy kontrast for lyse rom ===================== */
.mal-lys { background: #f4f2ee; color: #111; }
.mal-lys .t-klubb { color: #555; font-weight: 700; font-family: "Helvetica Neue", Arial, sans-serif; }
.mal-lys .t-lag { background: #fff; border-radius: 2.4em; margin: 0 1em; overflow: hidden; border: .3em solid #111; }
.mal-lys .t-klokke { font-size: 8.4em; background: #111; color: #fff; border-radius: .2em; padding: .14em .3em; margin: .3em 0; }
.mal-lys .t-fase { color: #333; font-family: "Helvetica Neue", Arial, sans-serif; font-weight: 800; }
.mal-lys .t-tillegg { color: #c0150c; }
.mal-lys .t-sponsor { background: #111; color: #fff; }

/* ===================== STOR: bare stillingen, lesbar fra langt unna ===================== */
.mal-stor { background: #000; color: #fff; }
.mal-stor .t-topp { display: none; }
.mal-stor .t-hoved { top: 2em; bottom: 20em; -webkit-box-align: stretch; -webkit-align-items: stretch; align-items: stretch; }
.mal-stor.med-sponsor .t-hoved { bottom: 28em; }
.mal-stor .t-lag { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -webkit-flex-direction: column-reverse; flex-direction: column-reverse; }
.mal-stor .t-mal { font-size: 58em; letter-spacing: -.05em; }
.mal-stor .t-navn { height: 9em; line-height: 9em; }
.mal-stor .t-navn-t { font-family: "Helvetica Neue", Arial, sans-serif; font-weight: 800; color: #cfd6e0; }
.mal-stor .t-farge { display: block; position: absolute; bottom: 0; left: 18%; right: 18%; height: 1.4em; border-radius: .7em; }
.mal-stor .t-skille { font-size: 30em; -webkit-align-self: center; align-self: center; margin-top: -.6em; color: #666; }
.mal-stor .t-midt { position: absolute; left: 0; right: 0; bottom: 4em; height: 14em; -webkit-box-orient: horizontal; -webkit-flex-direction: row; flex-direction: row; }
.mal-stor.med-sponsor .t-midt { bottom: 13em; }
.mal-stor .t-klokke { font-size: 9em; margin: 0 .6em; }
.mal-stor .t-fase { color: #9aa4b3; font-family: "Helvetica Neue", Arial, sans-serif; font-weight: 800; }
.mal-stor .t-tillegg { margin: 0; color: #ff5a4a; }
.mal-stor .t-sponsor { border-top: .25em solid #222; }
.mal-stor .t-blink { background: #fff; background: var(--lagfarge, #fff); color: #000; }
.mal-stor .t-blink:not(.lys-farge) { color: #fff; }
