/* Revier – nur auf /revier und /revier/hochladen geladen. */

.revier-zahlen{margin-top:18px}

.revier-karte{margin:18px 0 14px}
.revier-holder{height:min(72vh,720px);min-height:380px;border:3px solid var(--hard);box-shadow:7px 7px 0 var(--hard)}
.revier-karte .karte-frage{padding:22px 18px;border:3px solid var(--hard);background:var(--paper)}

.revier-legende{background:rgba(255,255,255,.92);border:2px solid var(--hard);padding:6px 10px;
  font:600 12px/1.5 var(--sans);display:flex;flex-wrap:wrap;gap:4px 12px;max-width:min(80vw,420px)}
.revier-legende span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.revier-legende span.ich{text-decoration:underline}
.revier-legende i{display:inline-block;width:12px;height:12px;border:1px solid rgba(0,0,0,.3)}
.revier-legende i.alt{background:#8fd98a;border:1px dashed #1f8f3a}
.revier-tipp{background:var(--hard);color:#fff;padding:8px 12px;border:2px solid #fff;
  font:800 italic 14px/1.2 var(--display);text-transform:uppercase;letter-spacing:.03em;max-width:min(70vw,340px);
  box-shadow:4px 4px 0 var(--green)}

.revier-feld{margin:0 0 22px}
.revier-feld .card-head{margin-top:0}
.revier-strecken{list-style:none;margin:0;padding:0}
.revier-strecken li{display:grid;grid-template-columns:14px 1fr;gap:6px 12px;align-items:start;
  padding:12px 0;border-top:1px solid var(--line)}
.revier-strecken li:first-child{border-top:0;padding-top:0}
.revier-strecken strong{display:block;line-height:1.3}
.revier-strecken .small{display:block;margin-top:2px}
.revier-text{cursor:pointer}
.revier-strecken li.aktiv{background:var(--green-tint);box-shadow:0 0 0 6px var(--green-tint)}
.revier-dot{display:inline-block;width:14px;height:14px;margin-top:4px;border:1px solid rgba(0,0,0,.3)}
.revier-aktion{grid-column:2;display:flex;flex-wrap:wrap;gap:8px}
@media (min-width:640px){
  .revier-strecken li{grid-template-columns:14px 1fr auto}
  .revier-aktion{grid-column:auto}
}

.revier-tabelle{width:100%;border-collapse:collapse;font-size:15px}
.revier-tabelle th{text-align:left;font:700 11px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-soft);padding:6px 8px;border-bottom:2px solid var(--hard)}
.revier-tabelle td{padding:9px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
.revier-tabelle td:first-child{width:24px}
.revier-tabelle tr.ich td{background:var(--green-tint)}

.revier-liste{list-style:none;margin:0;padding:0}
.revier-liste li{display:flex;justify-content:space-between;gap:12px;align-items:center;
  padding:12px 0;border-top:1px solid var(--line)}
.revier-liste li:first-child{border-top:0}
.revier-liste strong{display:block}

/* ---------------------------------------------------------------- Sponsor & Prämien */
.revier-sponsor{display:flex;gap:16px;align-items:center;margin:16px 0 0;padding:14px 16px;
  border:3px solid var(--hard);background:#fff8e1;box-shadow:7px 7px 0 #f2c230}
.revier-sponsor img{flex:0 0 auto;max-width:110px;max-height:64px;object-fit:contain}
.revier-sponsor strong{display:block;font:800 italic 20px/1.15 var(--display);text-transform:uppercase}
.revier-sponsor span{display:block;margin-top:4px;font-size:14px;line-height:1.45}
.revier-sponsor .revier-sponsor-von{margin-top:6px;font:700 11px/1.4 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.revier-sponsor .revier-sponsor-von a{color:var(--hard)}
@media (max-width:520px){ .revier-sponsor{flex-direction:column;align-items:flex-start} }

.revier-sponsor .revier-ab{display:block;margin-top:6px;font:700 14px/1.4 var(--sans);text-transform:none}
.revier-regeln{margin:8px 0 12px;padding-left:20px;line-height:1.5}
.revier-regeln li{margin:4px 0}
.revier-banner{display:block;width:100%;height:auto;margin:16px 0 0;border:3px solid var(--ink,#14170f);box-shadow:8px 8px 0 #35bc35}
.revier-vorschau{margin:16px 0 0;padding:8px 12px;border:2px dashed #c99a00;background:#fff8e1;font:600 13px/1.4 var(--sans)}
.revier-geschenk{font-size:22px;line-height:26px;text-align:center;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))}
.revier-praemie-zeile{flex-wrap:wrap}
.revier-code{display:inline-block;padding:6px 10px;border:2px dashed var(--hard);background:#fff8e1;
  font:700 16px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.06em}

/* ---------------------------------------------------------------- Countdown */
.revier-countdown{margin:18px 0 0;padding:16px 18px;border:3px solid var(--hard);background:var(--hard);color:#fff;
  box-shadow:7px 7px 0 var(--green)}
.revier-countdown-lab{display:block;font:700 11px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;opacity:.8}
.revier-countdown strong{display:block;margin-top:4px;font:italic 800 clamp(28px,7vw,44px)/1.05 var(--display);color:var(--green);
  font-variant-numeric:tabular-nums}
.revier-countdown-sub{display:block;margin-top:6px;font-size:13px;line-height:1.45;opacity:.85}

/* ---------------------------------------------------------------- Siegerseite */
.revier-ueber{margin:0 0 6px;font:700 12px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--green-deep)}
.revier-podest{position:relative;overflow:hidden;margin:22px 0 10px;padding:34px 18px 28px;text-align:center;
  border:3px solid var(--hard);background:var(--hard);color:#fff;box-shadow:9px 9px 0 var(--green)}
.revier-trophy{position:relative;width:120px;height:140px;filter:drop-shadow(0 8px 0 rgba(0,0,0,.35))}
.revier-siegerlab{position:relative;margin:14px 0 0;font:700 12px/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;opacity:.8}
.revier-siegername{position:relative;margin:4px 0 0;font:italic 800 clamp(38px,10vw,76px)/1 var(--display);text-transform:uppercase;color:var(--green)}
.revier-siegerzahl{position:relative;margin:10px 0 18px;font-size:15px;opacity:.9}
.revier-siegerzahl strong{font:italic 800 26px/1 var(--display);color:#fff}
.revier-podest .btn{position:relative}

/* Feuerwerk: fünf Punkte, die als Funkenkränze aufgehen. Nur CSS, nur Deko. */
.fw{position:absolute;inset:0;pointer-events:none}
.fw i{position:absolute;width:5px;height:5px;border-radius:50%;background:#fff;opacity:0;
  animation:fw-burst 2.6s ease-out infinite}
.fw i:nth-child(1){left:14%;top:38%;animation-delay:0s;color:#3fbf3a}
.fw i:nth-child(2){left:78%;top:28%;animation-delay:.6s;color:#f2c230}
.fw i:nth-child(3){left:50%;top:14%;animation-delay:1.2s;color:#ff5c7a}
.fw i:nth-child(4){left:30%;top:18%;animation-delay:1.8s;color:#6fb4ff}
.fw i:nth-child(5){left:68%;top:62%;animation-delay:2.2s;color:#fff}
@keyframes fw-burst{
  0%{opacity:0;transform:scale(.2);box-shadow:0 0 0 0 currentColor}
  10%{opacity:1}
  60%{opacity:.9;transform:scale(1);
    box-shadow:0 -46px 0 -1px currentColor,33px -33px 0 -1px currentColor,46px 0 0 -1px currentColor,33px 33px 0 -1px currentColor,
      0 46px 0 -1px currentColor,-33px 33px 0 -1px currentColor,-46px 0 0 -1px currentColor,-33px -33px 0 -1px currentColor,
      0 -24px 0 -2px currentColor,17px -17px 0 -2px currentColor,24px 0 0 -2px currentColor,17px 17px 0 -2px currentColor,
      0 24px 0 -2px currentColor,-17px 17px 0 -2px currentColor,-24px 0 0 -2px currentColor,-17px -17px 0 -2px currentColor}
  100%{opacity:0;transform:scale(1.25);
    box-shadow:0 -62px 0 -3px currentColor,44px -44px 0 -3px currentColor,62px 0 0 -3px currentColor,44px 44px 0 -3px currentColor,
      0 62px 0 -3px currentColor,-44px 44px 0 -3px currentColor,-62px 0 0 -3px currentColor,-44px -44px 0 -3px currentColor,
      0 -34px 0 -3px currentColor,24px -24px 0 -3px currentColor,34px 0 0 -3px currentColor,24px 24px 0 -3px currentColor,
      0 34px 0 -3px currentColor,-24px 24px 0 -3px currentColor,-34px 0 0 -3px currentColor,-24px -24px 0 -3px currentColor}
}
@media (prefers-reduced-motion:reduce){ .fw i{animation:none;opacity:0} }

.revier-treppchen{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;align-items:end}
.revier-stufe{border:3px solid var(--hard);background:var(--paper);padding:14px 10px;text-align:center;box-shadow:5px 5px 0 var(--hard)}
.revier-stufe strong{display:block;margin-top:6px;font:italic 800 20px/1.1 var(--display);text-transform:uppercase}
.revier-stufe span{display:block;font-size:13px;color:var(--ink-soft)}
.revier-stufe .revier-platz{font:italic 800 30px/1 var(--display);color:var(--green-deep)}
.stufe-1{padding-top:34px;background:var(--green-tint)}
.stufe-2{padding-top:22px}
.stufe-3{padding-top:12px}

/* ---------------------------------------------------------------- Urkunde */
.urkunde{margin:14px 0 26px;background:#fffdf6;border:3px solid var(--hard);box-shadow:9px 9px 0 var(--hard)}
.urkunde-rand{margin:10px;padding:28px 22px 24px;border:2px solid var(--green);text-align:center}
.urkunde-kopf{display:flex;align-items:center;justify-content:center;gap:12px;text-align:left}
.urkunde-kopf strong{display:block;font:800 italic 18px/1.1 var(--display);text-transform:uppercase}
.urkunde-kopf span{display:block;font-size:12px;color:var(--ink-soft);letter-spacing:.08em;text-transform:uppercase}
.urkunde-wort{margin:26px 0 10px;font:italic 800 clamp(46px,12vw,84px)/1 var(--display);text-transform:uppercase;letter-spacing:.04em}
.urkunde-text{margin:6px 0;font-size:16px}
.urkunde-text.small{font-size:12px;color:var(--ink-soft);margin-top:14px}
.urkunde-name{margin:4px 0 12px;font:italic 800 clamp(34px,9vw,60px)/1.05 var(--display);text-transform:uppercase;color:var(--green-deep)}
.urkunde-zahlen{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:18px auto;max-width:520px}
@media (min-width:560px){ .urkunde-zahlen{grid-template-columns:repeat(4,1fr)} }
.urkunde-zahlen div{border:2px solid var(--hard);padding:10px 6px;background:#fff}
.urkunde-zahlen strong{display:block;font:italic 800 28px/1 var(--display)}
.urkunde-zahlen span{display:block;margin-top:3px;font:600 10px/1.2 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.urkunde-trophy{width:90px;height:105px;margin:6px auto 0}
.urkunde-fuss{display:flex;justify-content:space-between;gap:20px;margin-top:30px;font-size:13px}
.urkunde-fuss div{flex:1;text-align:center}
.urkunde-linie{display:block;height:1px;background:var(--hard);margin:0 10px 6px}

@media print{
  .top,.foot,.flash,.skip,.urkunde-aktionen,.teilen,.nav-toggle{display:none !important}
  body,.shell{background:#fff !important;box-shadow:none !important}
  .sec-inner{width:100%}
  .urkunde{margin:0;box-shadow:none;page-break-inside:avoid}
  @page{size:A4;margin:14mm}
}
