/* ==========================================================================
   swisscannTrust — components.css (Phase 1: Gerüst, Navigation, Kopf, Buttons,
   Felder, Marken, Panels, Untertitel). Klassennamen wie in der Referenz preview.html.
   ========================================================================== */

/* Marke ------------------------------------------------------------------ */
.marke{display:flex;align-items:center;gap:10px;font-weight:600;font-size:1.05rem;letter-spacing:.01em;color:var(--c-projektor)}
.marke__zeichen{width:26px;height:26px;border-radius:5px;background:var(--c-vorhang);box-shadow:var(--glow-vorhang);display:grid;place-items:center;flex:none;overflow:hidden}
.marke__zeichen b{color:#fff;font-size:12px;font-weight:700;font-stretch:88%;letter-spacing:-.02em;line-height:1}
.marke__zeichen img{width:100%;height:100%;object-fit:contain}
.marke--gross .marke__zeichen{width:34px;height:34px}
.marke--gross .marke__zeichen b{font-size:14px}

/* Buttons (STYLEGUIDE 8.1) ------------------------------------------------ */
.btn{display:inline-flex;align-items:center;gap:8px;height:var(--control-h);padding:0 20px;border-radius:var(--r-control);border:0;cursor:pointer;
  font-weight:550;font-stretch:100%;white-space:nowrap;text-decoration:none;color:var(--c-projektor);background:transparent;
  transition:box-shadow var(--d-schnitt),background var(--d-schnitt),transform var(--d-schnitt)}
.btn:hover{text-decoration:none}
.btn:active{transform:scale(.98)}
.btn--primaer{background:var(--c-vorhang);color:#fff;box-shadow:var(--glow-vorhang)}
.btn--primaer:hover{box-shadow:var(--glow-vorhang-hover)}
.btn--sekundaer{box-shadow:inset 0 0 0 1px var(--line)}
.btn--sekundaer:hover{background:var(--c-rang)}
.btn--ruhig{height:auto;padding:0;color:var(--c-glut);font-weight:500}
.btn--ruhig:hover{text-decoration:underline;text-underline-offset:3px}
.btn--gefahr{box-shadow:inset 0 0 0 1px var(--c-glut);color:var(--c-glut)}
.btn--klein{height:34px;padding:0 12px;font-size:var(--t-small)}
.btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
.btn[aria-pressed="true"]{background:var(--c-rang)}

/* Eingabefelder (STYLEGUIDE 8.2) ----------------------------------------- */
.feld{display:grid;gap:6px}
.feld label{font-size:var(--t-small);color:var(--c-nitrat);font-stretch:88%}
.feld input,.feld select,.feld textarea{height:var(--control-h);padding:0 12px;background:var(--c-loge);border:0;border-bottom:1px solid var(--c-nitrat);
  border-radius:var(--r-control) var(--r-control) 0 0;transition:border-color var(--d-schnitt);width:100%}
.feld textarea{height:auto;padding:10px 12px}
.feld input:focus,.feld select:focus,.feld textarea:focus{outline:none;border-bottom-color:var(--c-glut)}
.feld__fehler{font-size:var(--t-small);color:var(--c-glut);display:flex;gap:6px;align-items:center}
.feld input[type=checkbox]{width:18px;height:18px;padding:0;background:none;border:0;accent-color:var(--c-glut);margin:0}
.feld--wahl label{display:flex;gap:10px;align-items:center;font-size:var(--t-body);color:inherit;font-stretch:100%}

/* Status-Marke (STYLEGUIDE 8.4) ------------------------------------------ */
.marke-status{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:var(--r-pill);font-size:var(--t-small);font-weight:500;white-space:nowrap}
.marke-status svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8}
.marke-status--frei{background:color-mix(in srgb,var(--c-status-frei) 14%,transparent);color:var(--c-status-frei)}
.marke-status--quarantaene{background:color-mix(in srgb,var(--c-status-quarantaene) 14%,transparent);color:var(--c-status-quarantaene)}
.marke-status--gesperrt{background:color-mix(in srgb,var(--c-status-gesperrt) 16%,transparent);color:var(--c-status-gesperrt)}
.marke-status--info{background:color-mix(in srgb,var(--c-status-info) 14%,transparent);color:var(--c-status-info)}
.marke-status--neutral{background:color-mix(in srgb,var(--c-nitrat) 14%,transparent);color:var(--c-nitrat)}
.chip{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:var(--r-pill);font-size:var(--t-small);background:var(--c-rang);color:var(--c-projektor)}
.chip--aktiv{box-shadow:inset 0 0 0 1px var(--c-glut)}

/* App-Rahmen + Navigation (STYLEGUIDE 4.1, 8.6) -------------------------- */
.app{display:grid;grid-template-columns:var(--nav-w) minmax(0,1fr);min-height:100svh}
.nav{position:sticky;top:0;height:100svh;background:var(--c-loge);box-shadow:var(--edge-1);display:flex;flex-direction:column;align-items:center;gap:6px;padding:18px 0;z-index:var(--z-nav);view-transition-name:nav}
.nav .marke__zeichen{margin-bottom:18px}
.nav a{position:relative;width:48px;height:48px;display:grid;place-items:center;border-radius:var(--r-control);color:var(--c-nitrat);text-decoration:none;transition:color var(--d-schnitt),background var(--d-schnitt)}
.nav a:hover{color:var(--c-projektor);background:var(--c-rang)}
.nav a[aria-current="page"]{color:var(--c-glut)}
.nav a[aria-current="page"]::before{content:"";position:absolute;left:-12px;top:12px;bottom:12px;width:2px;background:var(--c-glut);box-shadow:0 0 12px 1px rgba(242,104,94,.7)}
.nav a[aria-disabled="true"]{opacity:.38;cursor:default}
.nav svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6}
.nav__tip{position:absolute;left:58px;background:var(--c-rang);padding:4px 10px;border-radius:var(--r-panel);font-size:var(--t-small);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--d-blende);color:var(--c-projektor)}
.nav a:hover .nav__tip,.nav a:focus-visible .nav__tip{opacity:1}
.nav__ende{margin-top:auto}
main{padding:28px var(--page-pad) 96px;max-width:var(--page-max);width:100%;min-width:0;position:relative;overflow-x:clip}
main>*{position:relative;z-index:1}

/* Unter 1024 px: untere Leiste mit fünf Einträgen (STYLEGUIDE 4.1) */
@media (max-width:1024px){
  .app{grid-template-columns:1fr}
  .nav{position:fixed;top:auto;bottom:0;left:0;right:0;height:64px;flex-direction:row;justify-content:space-around;padding:0 8px;box-shadow:0 -1px 0 rgba(239,231,225,.06)}
  .nav .marke__zeichen,.nav a:nth-child(n+7),.nav__tip{display:none}
  .nav a[aria-current="page"]::before{left:12px;right:12px;top:auto;bottom:0;width:auto;height:2px}
  main{padding-bottom:110px}
}

/* Kopfzeile / Regie (STYLEGUIDE 9.2) ------------------------------------- */
.kopf{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 32px;margin-bottom:28px}
.kopf h1{margin:0 0 8px}
.kopf p{margin:0;font-size:var(--t-lead);line-height:var(--lh-lead);color:var(--c-nitrat);font-weight:350;max-width:60ch}
.regie{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.timecode{font-variant-numeric:tabular-nums;font-stretch:88%;font-weight:500;font-size:1.05rem;letter-spacing:.02em}
.live{display:inline-flex;align-items:center;gap:6px;font-size:var(--t-small);color:var(--c-nitrat)}
.live i{width:8px;height:8px;border-radius:50%;background:var(--c-glut);box-shadow:0 0 10px var(--c-glut);transition:transform 160ms,opacity 160ms}
.live i.schlag{transform:scale(1.5)}
.segment{display:inline-flex;background:var(--c-loge);border-radius:var(--r-pill);padding:3px;box-shadow:var(--edge-1)}
.segment button{border:0;background:none;height:32px;padding:0 14px;border-radius:var(--r-pill);cursor:pointer;font-size:var(--t-small);color:var(--c-nitrat)}
.segment button[aria-pressed="true"]{background:var(--c-rang);color:var(--c-projektor);box-shadow:inset 0 0 0 1px rgba(242,104,94,.4)}

/* Abschnitte, Panels, Bühnen (STYLEGUIDE 8.5) ---------------------------- */
.abschnitt__kopf{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 24px;margin:48px 0 16px}
.abschnitt__kopf p{margin:6px 0 0;color:var(--c-nitrat);max-width:60ch}
.panel{background:var(--c-loge);box-shadow:var(--edge-1);border-radius:var(--r-panel);padding:24px}
.panel h3,.panel__titel{margin:0 0 12px;font-size:var(--t-h3);font-weight:500;line-height:1.2}
.buehne{position:relative;background:var(--c-loge);border-radius:var(--r-leinwand);overflow:hidden;box-shadow:var(--edge-1)}
.buehne--scope{aspect-ratio:2.39}
.buehne__platzhalter{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:var(--c-nitrat);padding:var(--s-6)}
.buehne__platzhalter b{display:block;color:var(--c-projektor);font-weight:500;font-size:var(--t-h3);margin-bottom:6px}
.raster-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--grid-gap)}

/* Tabellen-Grundregeln (STYLEGUIDE 8.3) ---------------------------------- */
.tabelle{width:100%;border-collapse:collapse}
.tabelle th{position:sticky;top:0;background:var(--c-rang);text-align:left;font-size:var(--t-small);font-stretch:88%;font-weight:550;padding:0 12px;height:44px;color:var(--c-nitrat)}
.tabelle td{height:var(--row-h);padding:0 12px;border-bottom:1px solid var(--line-soft)}
.tabelle tr:hover td{background:var(--c-rang);box-shadow:inset 2px 0 0 var(--c-glut)}
.tabelle .zahl{text-align:right;font-variant-numeric:tabular-nums}

/* Untertitel-Meldungen (STYLEGUIDE 7.11) -------------------------------- */
.untertitel{position:fixed;left:50%;bottom:calc(var(--letterbox-h) + 24px);transform:translateX(-50%);z-index:var(--z-toast);
  background:rgba(0,0,0,.72);color:var(--c-projektor);padding:10px 16px 10px 14px;border-radius:var(--r-panel);border-left:3px solid var(--c-status-info);
  max-width:56ch;font-size:var(--t-small);display:flex;gap:10px;align-items:center;opacity:0;pointer-events:none;transition:opacity 160ms}
.untertitel.sichtbar{opacity:1;pointer-events:auto}
.untertitel--fehler{border-left-color:var(--c-status-gesperrt)}
.untertitel--frei{border-left-color:var(--c-status-frei)}

/* Login / Vorspann (STYLEGUIDE 7.1, 9.1) --------------------------------- */
.vorspann{position:fixed;inset:0;z-index:var(--z-dialog);display:grid;align-items:end;background:#000;overflow:hidden}
.vorspann__bild{position:absolute;inset:-8%;background:
  radial-gradient(ellipse 40% 30% at 30% 40%,rgba(210,160,120,.35),transparent 70%),
  radial-gradient(ellipse 50% 40% at 70% 60%,rgba(90,110,80,.35),transparent 70%),
  radial-gradient(ellipse 80% 60% at 50% 100%,rgba(40,50,40,.8),transparent 70%),
  linear-gradient(180deg,#2a2a30,#141414);
  filter:saturate(.7) contrast(1.1) brightness(.6);animation:kenburns 30s var(--e-kamera) infinite alternate}
.vorspann__video{position:absolute;inset:-8%;width:116%;height:116%;object-fit:cover;filter:saturate(.7) contrast(1.1) brightness(.55)}
@keyframes kenburns{from{transform:scale(1) translate(0,0)}to{transform:scale(1.08) translate(-2%,-1%)}}
.vorspann__rot{position:absolute;inset:0;background:var(--c-vorhang);mix-blend-mode:multiply;opacity:.35}
.vorspann__vignette{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 35%,rgba(0,0,0,.7) 100%)}
.vorspann__routen{position:absolute;inset:0;width:100%;height:100%;opacity:.18}
.vorspann__inhalt{position:relative;padding:0 var(--page-pad) calc(var(--letterbox-h) + clamp(32px,8vh,96px));max-width:720px}
.vorspann__hinweis{position:fixed;margin:0;left:var(--page-pad);bottom:calc(var(--letterbox-h) / 2 - 8px);z-index:801;font-size:var(--t-micro);color:var(--c-nitrat);font-stretch:88%}
.vorspann h1{font-size:var(--t-display);line-height:1;font-weight:300;font-stretch:125%;letter-spacing:.01em;margin:.35em 0 .15em}
.vorspann__slogan{font-family:var(--f-credit);font-style:italic;color:var(--c-glut);font-size:var(--t-lead);margin:0 0 1.4em}
.login{display:grid;gap:16px;max-width:420px}
.login__aktionen{display:flex;align-items:center;gap:20px;margin-top:8px}
.login.zittern{animation:zittern 300ms ease-in-out}
@keyframes zittern{0%,100%{transform:translateX(0)}17%{transform:translateX(-6px)}50%{transform:translateX(6px)}83%{transform:translateX(-6px)}}

/* Phase 2: Fortschrittsleiste, Stationenleiste, leerer Zustand, Dialog (Rack Focus) ---- */
.fortschritt{display:inline-flex;gap:3px;vertical-align:middle}
.fortschritt i{width:14px;height:4px;border-radius:2px;background:rgba(239,231,225,.12)}
.fortschritt i.ist{background:rgba(242,104,94,.45)}
.fortschritt i.jetzt{background:var(--c-glut);box-shadow:0 0 8px var(--c-glut)}
.stationen{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(10,1fr);gap:2px;background:var(--c-loge);border-radius:var(--r-panel);overflow:hidden;box-shadow:var(--edge-1)}
.stationen__st{position:relative;padding:14px 12px 12px;min-height:100px;display:flex;flex-direction:column;gap:4px;background:var(--c-loge)}
.stationen__nr{font-size:var(--t-micro);color:var(--c-nitrat)}
.stationen__name{font-size:var(--t-small);line-height:1.25}
.stationen__zahl{margin-top:auto;font-size:var(--t-h3);font-weight:400}
.stationen__st--leer .stationen__zahl{color:var(--c-nitrat)}
.stationen__st--aktiv{background:var(--c-rang)}
.stationen__st--aktiv::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--c-glut);box-shadow:0 0 10px var(--c-glut)}
@media (max-width:1024px){.stationen{grid-template-columns:repeat(5,1fr)}}
@media (max-width:640px){.stationen{grid-template-columns:repeat(2,1fr)}}
.leer{display:grid;justify-items:center;text-align:center;gap:12px;padding:var(--s-7) var(--s-5);color:var(--c-nitrat)}
.leer__leinwand{width:120px}
.dialog{background:var(--c-rang);color:var(--c-projektor);border:0;border-radius:var(--r-panel);box-shadow:var(--edge-2);padding:0;width:min(640px,92vw);max-height:85vh}
.dialog::backdrop{backdrop-filter:blur(6px) brightness(.55);background:rgba(0,0,0,.2)}
.dialog[open]{animation:rack-in var(--d-blende) var(--e-fokus) both}
@keyframes rack-in{from{opacity:0;filter:blur(8px);transform:scale(.98)}to{opacity:1;filter:none;transform:none}}
.dialog__kopf{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 24px;border-bottom:1px solid var(--line-soft)}
.dialog__kopf h3{margin:0}
.dialog__inhalt{padding:24px;overflow:auto}
.tabelle tr[data-href]{cursor:pointer}
.tabelle .fortschritt{display:inline-flex}
.zeile-kopf{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:12px}

/* ===== Weltbühne + Vollbild-Vorspann (Referenz preview.html, Zeilen 120–147 und 328–371) ===== */
.buehne{position:relative;background:var(--c-loge);border-radius:var(--r-leinwand);overflow:hidden;box-shadow:var(--edge-1)}
.weltbuehne{aspect-ratio:2.39;transition:filter 120ms}
.weltbuehne.blitz{filter:brightness(1.12)}
.weltbuehne>svg,.weltbuehne>canvas{position:absolute;inset:0;width:100%;height:100%}
.weltbuehne .land{fill:none;stroke:var(--c-land);stroke-linecap:round}
.weltbuehne .route{fill:none;stroke:var(--c-route);stroke-width:1;vector-effect:non-scaling-stroke;transition:stroke 240ms}
.weltbuehne .route.an{stroke:rgba(242,104,94,.7)}
.weltbuehne::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.45) 100%);pointer-events:none}
.orte{position:absolute;inset:0;pointer-events:none}
.ort{position:absolute;transform:translate(8px,-50%);font-size:var(--t-micro);font-stretch:88%;color:var(--c-nitrat);white-space:nowrap;transition:opacity 300ms;text-shadow:0 1px 6px #000}
.ort--hub{color:var(--c-projektor);font-weight:600;transform:translate(12px,-120%)}
.weltbuehne .route--luft{stroke-dasharray:3 4}
.weltbuehne .route--semi{stroke:rgba(242,104,94,.45);stroke-width:1.6}
.weltbuehne .route--semi.an{stroke:rgba(242,104,94,.85)}
.weltbuehne .route--verteilung{stroke:rgba(242,104,94,.2)}
.buehne__rechts{display:flex;align-items:center;gap:20px}
.legende{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 14px;font-size:var(--t-micro);font-stretch:88%;color:var(--c-nitrat);pointer-events:none}
.legende li{display:flex;align-items:center;gap:8px}
.legende svg{width:16px;height:16px;fill:none;stroke:var(--c-projektor);stroke-width:1.6}
.legende svg.pin{stroke:var(--c-glut);fill:rgba(255,210,200,.25)}
.legende svg.klein{width:11px;height:11px;margin:0 2px 0 3px;stroke:var(--c-glut)}
.ort button{pointer-events:auto;background:none;border:0;padding:2px 0;color:inherit;cursor:pointer;font-size:inherit}
.ort button:hover{color:var(--c-projektor)}
.buehne__zeile{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding:16px 20px;z-index:2;pointer-events:none;background:linear-gradient(transparent,rgba(0,0,0,.55))}
.akt{display:flex;align-items:baseline;gap:12px;min-height:1.6em}
.akt b{font-family:var(--f-credit);font-style:italic;font-weight:400;font-size:1.4rem;color:var(--c-glut);min-width:1.6em}
.akt span{font-size:var(--t-lead);font-weight:350;transition:opacity 200ms}
.welt-platz{position:relative;aspect-ratio:2.39}
.welt-platz>.weltbuehne{position:absolute;inset:0;aspect-ratio:auto}
.weltbuehne.vollbild{position:fixed;inset:auto;z-index:460;border-radius:0;box-shadow:none}
.weltbuehne.vollbild .akt span{font-size:clamp(1.1rem,2vw,1.6rem)}
.weltbuehne.vollbild .buehne__zeile{padding:20px clamp(16px,3vw,40px)}
.intro{position:fixed;inset:0;z-index:450;background:#000}
.intro[hidden]{display:none}
.intro__kopf{position:absolute;left:0;right:0;top:0;height:var(--oben,120px);display:flex;flex-direction:column;justify-content:flex-end;padding:0 clamp(20px,4vw,64px) 18px;z-index:470}
.intro__vor{margin:0;font-family:var(--f-credit);font-style:italic;font-size:1.15rem;color:var(--c-glut)}
.intro__kopf h1{margin:0;font-size:clamp(1.8rem,4.2vw,3.4rem);line-height:1.05;font-weight:300;font-stretch:125%;letter-spacing:.01em}
.intro__fuss{position:absolute;left:0;right:0;bottom:0;height:var(--unten,120px);display:flex;align-items:flex-start;gap:16px 24px;flex-wrap:wrap;justify-content:space-between;padding:18px clamp(20px,4vw,64px) 0;z-index:470}
.intro__zeitleiste{flex:1 1 240px;display:flex;gap:3px;align-self:center}
.intro__zeitleiste span{display:block;height:3px;background:rgba(239,231,225,.14);position:relative;overflow:hidden;border-radius:2px}
.intro__zeitleiste span i{position:absolute;inset:0;background:var(--c-glut);transform-origin:left;transform:scaleX(0)}
.intro__zeitleiste small{display:block;margin-top:8px;font-size:var(--t-micro);color:var(--c-nitrat);font-stretch:88%;white-space:nowrap}
.intro__zeitleiste div{flex:var(--d) 1 0;min-width:0}
.pin-label{position:absolute;transform:translate(14px,-50%);z-index:2;pointer-events:none;white-space:nowrap;font-size:var(--t-micro);font-stretch:88%;font-weight:600;color:var(--c-projektor);text-shadow:0 1px 6px #000;transition:opacity 300ms}
.pin-label em{font-style:normal;font-weight:400;color:var(--c-glut)}
.adresskarte{position:absolute;z-index:3;pointer-events:none;background:rgba(18,12,12,.86);box-shadow:inset 0 0 0 1px rgba(242,104,94,.45),0 0 40px -10px rgba(158,5,4,.9);border-radius:var(--r-panel);padding:12px 16px 14px;min-width:200px;max-width:280px;opacity:0;transition:opacity 400ms var(--e-kamera),transform 400ms var(--e-kamera);transform:translateY(8px)}
.adresskarte.an{opacity:1;transform:none}
.adresskarte small{display:block;font-family:var(--f-credit);font-style:italic;color:var(--c-glut);font-size:.95rem}
.adresskarte strong{display:block;font-weight:600;font-size:1.05rem;line-height:1.25;margin:2px 0 4px}
.adresskarte p{margin:0;font-size:var(--t-small);line-height:1.4;color:var(--c-projektor)}
.adresskarte p+p{margin-top:6px}
.adresskarte span{color:var(--c-nitrat)}
.demo{display:flex;align-items:center;gap:8px;font-size:var(--t-small);color:var(--c-nitrat)}
.demo select{height:34px;background:var(--c-loge);color:var(--c-projektor);border:0;box-shadow:inset 0 0 0 1px var(--line);border-radius:var(--r-control);padding:0 10px;font:inherit}
.login .demo{margin-top:4px}
@media (max-width:760px){
  .welt-platz{aspect-ratio:1.25}
  .intro__kopf h1{font-size:1.9rem}
  .adresskarte{min-width:0;max-width:210px;padding:10px 12px}
  .intro__zeitleiste small{display:none}
}
.iso-buehne canvas{position:absolute;inset:0;width:100%;height:100%;cursor:grab;touch-action:none}
.iso-buehne canvas.zeigt{cursor:pointer}
.iso-buehne canvas.zieht{cursor:grabbing}
.iso-buehne::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 55%,rgba(0,0,0,.5) 100%)}
.iso-tabs{position:absolute;top:14px;left:14px;z-index:3}
.iso-steuer{position:absolute;left:14px;bottom:14px;z-index:3;display:flex;gap:6px}
/* Untertitel-Container der Referenz (Vorspann-Seite) */
#untertitel{position:fixed;left:50%;bottom:calc(var(--unten,120px) + 16px);transform:translateX(-50%);z-index:900;display:grid;gap:6px;pointer-events:none}
#untertitel .untertitel{position:static;transform:none;opacity:1;pointer-events:auto;background:rgba(0,0,0,.72);border-left:3px solid var(--s,var(--c-status-info));padding:10px 14px;border-radius:var(--r-panel);font-size:var(--t-small);max-width:56ch;margin:0}

/* ===== Lieferwelt (Referenz preview.html 416–484), Status-Marken der Referenz (244–249), Tooltip (377–379) ===== */
/* ---------- v5: Lieferwelt ---------- */
.lw{margin:0 0 8px}
.lw-rahmen{--lw-h:clamp(520px,calc((100vw - 72px - 2 * var(--page-pad) - 322px) * .56),780px);display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:2px}
.lw-buehne{position:relative;background:#100a0b;border-radius:var(--r-leinwand) 0 0 var(--r-leinwand);overflow:hidden;height:var(--lw-h);box-shadow:var(--edge-1)}
.lw-buehne canvas{position:absolute;inset:0;width:100%;height:100%;cursor:grab;touch-action:none}
.lw-buehne canvas.zeigt{cursor:pointer}
.lw-buehne canvas.zieht{cursor:grabbing}
.lw-buehne::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 60% 45%,transparent 50%,rgba(0,0,0,.55) 100%)}
.lw-karte{position:absolute;z-index:3;left:20px;top:20px;width:min(340px,42%);background:rgba(18,12,12,.84);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:var(--r-panel);box-shadow:inset 0 0 0 1px rgba(239,231,225,.08),0 20px 50px -20px #000;padding:18px 20px 16px}
.lw-karte__nr{display:block;font-size:2.6rem;line-height:1;font-weight:250;font-stretch:125%;color:var(--c-glut);font-variant-numeric:tabular-nums}
.lw-karte h3,.lw-karte__titel{margin:6px 0 6px;font-size:1.35rem;line-height:1.2;font-weight:450;font-stretch:108%}
.lw-karte>p{margin:0 0 12px;font-size:var(--t-small);color:var(--c-nitrat);line-height:1.45}
.lw-karte h4,.lw-karte__unter{margin:0 0 6px;font-family:var(--f-credit);font-style:italic;font-weight:400;font-size:1rem;color:var(--c-glut)}
.lw-werte{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:0}
.lw-werte div{border-top:1px solid var(--line-soft);padding-top:6px;min-width:0}
.lw-werte dt{font-size:var(--t-micro);color:var(--c-nitrat);font-stretch:88%}
.lw-werte dd{margin:0;font-size:.95rem;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.lw-karte__hier{margin:12px 0 0!important;color:var(--c-projektor)!important}
.lw-karte__hier button{border:0;cursor:pointer;background:var(--c-vorhang);color:#fff;border-radius:var(--r-pill);padding:3px 10px;margin:4px 4px 0 0;font-size:var(--t-micro);font-weight:600;box-shadow:var(--glow-vorhang)}
.lw-karte.unten{top:64px;left:auto;right:16px;width:min(300px,36%)}
.lw-karte.unten>p{display:none}
.lw-steuer{position:absolute;z-index:3;right:16px;top:16px;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.lw-steuer button{height:36px;min-width:36px;padding:0 12px;border-radius:var(--r-control);border:0;background:rgba(28,20,21,.85);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;font-size:var(--t-small)}
.lw-steuer button:hover{background:var(--c-rang)}
.lw-steuer button[aria-pressed="true"]{box-shadow:inset 0 0 0 1px rgba(242,104,94,.6)}
.lw-kapitelleiste{position:absolute;z-index:3;left:0;right:0;bottom:0;display:flex;background:linear-gradient(transparent,rgba(0,0,0,.75) 40%);padding:28px 12px 12px;gap:4px}
.lw-kap{flex:1 1 0;min-width:0;position:relative;text-align:left;border:0;background:transparent;cursor:pointer;padding:8px 10px 12px;border-radius:var(--r-control);color:var(--c-nitrat);transition:background var(--d-schnitt),color var(--d-schnitt)}
.lw-kap:hover{background:rgba(39,28,29,.7);color:var(--c-projektor)}
.lw-kap[aria-current="step"]{color:var(--c-projektor);background:rgba(39,28,29,.85)}
.lw-kap__nr{display:block;font-size:1.3rem;font-weight:250;font-stretch:125%;line-height:1;font-variant-numeric:tabular-nums}
.lw-kap[aria-current="step"] .lw-kap__nr{color:var(--c-glut)}
.lw-kap__name{display:block;font-size:var(--t-small);font-weight:500;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lw-kap__balken{position:absolute;left:10px;right:10px;bottom:6px;height:2px;background:rgba(239,231,225,.1);border-radius:2px;overflow:hidden}
.lw-kap__balken i{position:absolute;inset:0;background:var(--c-glut);transform-origin:left;transform:scaleX(0)}
.lw-kap[data-n]:not([data-n=""])::after{content:attr(data-n);position:absolute;top:6px;right:8px;min-width:18px;height:18px;border-radius:9px;background:var(--c-vorhang);color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;box-shadow:var(--glow-vorhang)}
.lw-seite{background:var(--c-loge);border-radius:0 var(--r-panel) var(--r-panel) 0;box-shadow:var(--edge-1);padding:18px 16px;display:flex;flex-direction:column;gap:12px;min-width:0;height:var(--lw-h);overflow:auto}
.lw-seite__kopf{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:0 4px}
.lw-seite__kopf h3{margin:0;font-size:var(--t-h3);font-weight:500}
.lw-seite__kopf small{color:var(--c-nitrat);font-size:var(--t-micro)}
.lw-seite>p{margin:0 4px;color:var(--c-nitrat);font-size:var(--t-small)}
.lw-auftraege{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.lw-auftraege button{width:100%;text-align:left;border:0;cursor:pointer;background:var(--c-saal);border-radius:var(--r-panel);padding:10px 12px;display:grid;gap:5px;box-shadow:inset 0 0 0 1px var(--line-soft);transition:box-shadow var(--d-schnitt)}
.lw-auftraege button:hover{box-shadow:inset 0 0 0 1px rgba(242,104,94,.45)}
.lw-auftraege button[aria-pressed="true"]{box-shadow:inset 0 0 0 1px rgba(242,104,94,.9),inset 3px 0 0 var(--c-glut)}
.lw-auftraege .zeile{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 8px;align-items:center}
.lw-auftraege strong{white-space:nowrap;font-weight:600;font-size:var(--t-small);font-variant-numeric:tabular-nums}
.lw-auftraege small{color:var(--c-nitrat);font-size:var(--t-micro);line-height:1.4}
.lw-auftraege small.lw-ort{color:var(--c-projektor)}
.lw-schritte{display:flex;gap:2px}
.lw-schritte i{flex:1;height:3px;border-radius:2px;background:rgba(239,231,225,.1)}
.lw-schritte i.ok{background:rgba(242,104,94,.45)}
.lw-schritte i.jetzt{background:var(--c-glut);box-shadow:0 0 6px var(--c-glut)}
.lw-hinweis{margin:12px 0 0;color:var(--c-nitrat);font-size:var(--t-small)}
@media (max-width:1180px){
  .lw-rahmen{grid-template-columns:1fr;--lw-h:clamp(480px,56vw,720px)}
  .lw-buehne{border-radius:var(--r-leinwand) var(--r-leinwand) 0 0}
  .lw-seite{border-radius:0 0 var(--r-panel) var(--r-panel);height:auto}
}
@media (max-width:760px){
  .lw-rahmen{--lw-h:max(520px,78vh)}
  .regie .btn--klein{flex:0 1 auto}
  .lw-karte,.lw-karte.unten{left:10px;right:10px;top:auto;bottom:86px;width:auto;padding:12px 14px;max-height:42%;overflow:auto}
  .lw-karte__nr{font-size:1.8rem}
  .lw-karte h3,.lw-karte__titel{font-size:1.1rem}
  .lw-karte>p{display:none}
  .lw-steuer{top:10px;right:10px}
  .lw-kapitelleiste{overflow-x:auto;padding:20px 6px 8px;scrollbar-width:none}
  .lw-kap{flex:0 0 96px}
}
.status{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px 0 8px;border-radius:var(--r-pill);font-size:var(--t-micro);font-weight:550;font-stretch:88%;white-space:nowrap;color:var(--s);background:color-mix(in srgb,var(--s) 14%,transparent)}
.status svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2}
.status--frei{--s:var(--c-status-frei)}
.status--pruefung{--s:var(--c-status-quarantaene)}
.status--info{--s:var(--c-status-info)}
.status--geplant{--s:var(--c-nitrat)}
.iso-tip{position:absolute;z-index:4;pointer-events:none;background:rgba(18,12,12,.92);box-shadow:inset 0 0 0 1px rgba(242,104,94,.4);border-radius:var(--r-panel);padding:6px 10px;font-size:var(--t-small);white-space:nowrap;opacity:0;transition:opacity 120ms;transform:translate(14px,14px)}
.iso-tip.an{opacity:1}
.iso-tip small{display:block;color:var(--c-nitrat);font-size:var(--t-micro)}

/* ===== Phase 5: Schnittplatz, Synchronklappen, Filmstreifen, Parallelmontage (Referenz preview.html 169–241, 264–266) ===== */
/* Parallelmontage --------------------------------------------------- */
.montage{display:grid;grid-template-columns:var(--m1,1fr) var(--m2,1fr) var(--m3,1fr);gap:2px;transition:grid-template-columns 1.2s var(--e-vorhang)}
.kamera{background:var(--c-loge);padding:18px 20px 20px;box-shadow:var(--edge-1);position:relative;opacity:.55;transition:opacity var(--d-szene),background var(--d-szene);min-width:0}
.kamera:first-child{border-radius:var(--r-panel) 0 0 var(--r-panel)}
.kamera:last-child{border-radius:0 var(--r-panel) var(--r-panel) 0}
.kamera.auf-sendung{opacity:1;background:var(--c-rang)}
.kamera.auf-sendung::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--c-glut);box-shadow:0 0 14px rgba(242,104,94,.8)}
.kamera__kopf{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.kamera__ort{display:flex;align-items:center;gap:8px;font-weight:500}
.kamera__ort i{width:7px;height:7px;border-radius:50%;background:var(--c-nitrat)}
.kamera.auf-sendung .kamera__ort i{background:var(--c-glut);box-shadow:0 0 8px var(--c-glut)}
.kamera__zeit{font-variant-numeric:tabular-nums;font-stretch:88%;color:var(--c-nitrat);font-size:var(--t-small)}
.kamera__zeit s{text-decoration:none;display:inline-block;transition:opacity 120ms}
.kamera__zeit s.tick{opacity:.35}
.kamera__rolle{font-size:var(--t-micro);color:var(--c-nitrat);font-stretch:88%;margin:2px 0 14px}
.kamera__taetigkeit{font-size:var(--t-lead);font-weight:350;line-height:1.3;min-height:2.6em;margin:0 0 14px}
.balken{height:3px;background:var(--line-soft);border-radius:2px;overflow:hidden}
.balken i{display:block;height:100%;background:var(--c-projektor);transform-origin:left;transform:scaleX(0)}

/* Schnittplatz ------------------------------------------------------ */
.schnitt{padding:0 0 12px}
.schnitt__scroll{overflow-x:auto}
.schnitt__innen{min-width:760px;position:relative}
.schnitt__zeile{display:grid;grid-template-columns:132px 1fr;align-items:center}
.schnitt__label{padding:0 16px;font-size:var(--t-small);font-stretch:88%;color:var(--c-nitrat);display:flex;align-items:center;gap:8px;position:sticky;left:0;background:var(--c-loge);z-index:3;height:100%}
.schnitt__label i{width:8px;height:8px;border-radius:2px;background:var(--spur)}
.spur{position:relative;height:38px;border-top:1px solid var(--line-soft)}
.skala{height:44px;position:relative;cursor:pointer;border-top:0}
.skala:focus-visible{outline:none;box-shadow:inset 0 0 0 1px var(--c-glut)}
.skala span{position:absolute;bottom:8px;transform:translateX(-50%);font-size:var(--t-micro);font-variant-numeric:tabular-nums;color:var(--c-nitrat)}
.skala span::after{content:"";position:absolute;left:50%;top:18px;width:1px;height:6px;background:var(--line)}
.clip{position:absolute;top:8px;bottom:8px;border-radius:5px;padding:0 8px;font-size:var(--t-micro);font-stretch:88%;line-height:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--c-saal);font-weight:550;background:var(--spur);transition:opacity var(--d-blende),background var(--d-blende),color var(--d-blende),box-shadow var(--d-blende)}
.clip.geplant{background:transparent;color:var(--c-nitrat);box-shadow:inset 0 0 0 1px var(--line);font-weight:450}
.clip.laeuft{background:linear-gradient(90deg,color-mix(in srgb,var(--spur) 40%,transparent) var(--f,50%),transparent var(--f,50%));color:var(--c-projektor);box-shadow:inset 0 0 0 1px var(--spur),0 0 18px -6px var(--spur);text-shadow:0 1px 4px #000}
.klima{position:absolute;inset:4px 0;width:100%;height:30px;overflow:visible}
.klima .band{fill:rgba(217,164,65,.08)}
.klima .kurve{fill:none;stroke:var(--c-spur-klima);stroke-width:1.5;vector-effect:non-scaling-stroke}
.klima .rest{fill:none;stroke:var(--line);stroke-width:1;stroke-dasharray:3 3;vector-effect:non-scaling-stroke}
.kopf-linie{position:absolute;top:0;bottom:0;width:0;z-index:4;pointer-events:none}
.kopf-linie::before{content:"";position:absolute;top:30px;bottom:0;left:0;width:1px;background:var(--c-glut);box-shadow:0 0 10px var(--c-glut)}
.kopf-linie b{position:absolute;top:4px;left:0;transform:translateX(-50%);background:var(--c-glut);color:#1a0404;font-size:var(--t-micro);font-weight:650;font-variant-numeric:tabular-nums;padding:2px 6px;border-radius:4px;white-space:nowrap}
.klappe{position:absolute;top:0;bottom:0;width:0;z-index:3;pointer-events:none}
.klappe::before{content:"";position:absolute;top:44px;bottom:0;left:0;border-left:1px dashed rgba(217,164,65,.5);transition:border-color 200ms}
.klappe svg{position:absolute;top:10px;left:-11px;width:22px;height:20px;overflow:visible}
.klappe .arm{transform-origin:2px 7px;transform:rotate(-24deg);transition:transform var(--d-klappe) var(--e-klappe)}
.klappe.zu .arm{transform:rotate(0)}
.klappe.zu::before{border-left:1px solid rgba(239,231,225,.35)}
.klappe.schlag::after{content:"";position:absolute;top:44px;bottom:0;left:-2px;width:5px;background:var(--c-projektor);filter:blur(3px);animation:klappenblitz 600ms var(--e-schnitt) forwards}
@keyframes klappenblitz{from{opacity:.9}to{opacity:0}}
.bereit{position:absolute;width:10px;height:10px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--spur);transform:translate(-50%,-50%);top:50%;z-index:3;background:var(--c-loge);transition:background var(--d-blende)}
.bereit.ja{background:var(--spur)}
.schnitt__fuss{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:12px 16px 0;border-top:1px solid var(--line-soft);font-size:var(--t-small);color:var(--c-nitrat)}
.schnitt__meldung{color:var(--c-projektor);min-height:1.5em;transition:opacity 200ms}

/* Filmstreifen ------------------------------------------------------ */
.filmstreifen{background:#0a0606;border-radius:var(--r-leinwand);padding:26px 0;position:relative}
.filmstreifen::before,.filmstreifen::after{content:"";position:absolute;left:0;right:0;height:10px;
  background-image:radial-gradient(ellipse 5px 4px at center,var(--c-saal) 99%,transparent 100%);background-size:22px 10px;background-repeat:repeat-x;opacity:.9}
.filmstreifen::before{top:8px}.filmstreifen::after{bottom:8px}
.spur-film{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:10px calc(50% - 115px);scrollbar-width:none;cursor:grab}
.spur-film::-webkit-scrollbar{display:none}
.spur-film:focus-visible{outline:1px solid var(--c-glut);outline-offset:4px}
.bild{flex:0 0 230px;scroll-snap-align:center;background:var(--c-loge);border-radius:3px;overflow:hidden;opacity:.4;filter:blur(.6px) brightness(.7);transition:opacity var(--d-szene),filter var(--d-szene) var(--e-fokus);list-style:none}
.bild.erledigt{opacity:.75;filter:none}
.bild.jetzt{opacity:1;filter:none;box-shadow:0 0 0 1px rgba(242,104,94,.55),0 0 30px -8px rgba(158,5,4,.9)}
.bild__licht{height:112px;position:relative;display:grid;place-items:center;background:radial-gradient(ellipse 70% 80% at 50% 30%,var(--ton,rgba(158,5,4,.35)),transparent 75%),#160e0e}
.bild__licht svg{width:44px;height:44px;stroke:var(--c-projektor);stroke-width:1.2;fill:none;opacity:.85}
.bild__nr{position:absolute;left:10px;top:6px;font-size:2rem;font-weight:200;font-stretch:125%;color:rgba(239,231,225,.5);font-variant-numeric:tabular-nums}
.bild__text{padding:12px 14px 14px}
.bild__text h3{margin:0;font-size:1rem;font-weight:550;line-height:1.25}
.bild__text p{margin:2px 0 10px;font-size:var(--t-micro);color:var(--c-nitrat);font-stretch:88%}
.film-fortschritt{height:2px;background:var(--line-soft);margin:14px 20px 0}
.film-fortschritt i{display:block;height:100%;background:var(--c-glut);transform-origin:left;transform:scaleX(0)}
.zertifikate{list-style:none;margin:0;padding:0}
.zertifikate li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line-soft)}
.zertifikate small{display:block;color:var(--c-nitrat);font-size:var(--t-micro)}
/* Portal-Ergaenzungen Phase 5: offene Punkte laut Odoo, Kopfzeile, Fakten */
.clip.offen{background:transparent;color:var(--c-glut);box-shadow:inset 0 0 0 1px var(--c-glut);font-weight:500}
.bereit.fehlt{box-shadow:inset 0 0 0 1.5px var(--c-glut)}
.klappe.offen-fehlt::before{border-left:1px dashed var(--c-glut)}
.klima .band{fill:rgba(217,164,65,.05)}
.spur[data-spur="klima"] .clip{background:transparent;color:var(--c-nitrat);box-shadow:inset 0 0 0 1px var(--line);font-weight:450}
.sendung-kopf{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;margin:-8px 0 8px}
.regie__gruppe{display:inline-flex;gap:4px}
.fakten{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px 18px;margin:0}
.fakten div{border-top:1px solid var(--line-soft);padding-top:6px;min-width:0}
.fakten dt{font-size:var(--t-micro);color:var(--c-nitrat);font-stretch:88%}
.fakten dd{margin:2px 0 0;font-size:.95rem;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.lw-auftraege li{position:relative}.lw-auftraege button{padding-bottom:30px}.lw-auftrag__link{position:absolute;right:12px;bottom:10px;font-size:var(--t-micro);color:var(--c-nitrat);text-decoration:none;padding:2px 8px;border-radius:var(--r-pill);box-shadow:inset 0 0 0 1px var(--line)}.lw-auftrag__link:hover{color:var(--c-projektor);box-shadow:inset 0 0 0 1px var(--c-glut)}
@media (max-width:720px){.montage{grid-template-columns:1fr}.kamera:first-child,.kamera:last-child{border-radius:var(--r-panel)}}

/* ===== Phase 6: Letterbox-Formulare, Arbeitsansichten (Sortiment, Chargen, Dokumente, Konto, Lieferplan) ===== */
.vorspann__portal{margin:18px 0 4px;font-size:var(--t-small);letter-spacing:.08em;text-transform:uppercase;color:var(--c-nitrat);font-stretch:88%}
.vorspann h1.vorspann__h1--klein{font-size:clamp(1.8rem,4vw,2.8rem);margin:0 0 6px}
.login--breit{max-width:520px}
.login .code{font-size:1.4rem;letter-spacing:.35em;font-variant-numeric:tabular-nums;text-align:center;height:52px}
.qr-zeile{display:flex;flex-wrap:wrap;gap:20px;align-items:center}
.qr{border-radius:6px;background:#fff;padding:6px;width:168px;height:168px}
.schluessel{display:inline-block;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9rem;letter-spacing:.12em;padding:6px 10px;background:var(--c-loge);border-radius:4px;color:var(--c-projektor);overflow-wrap:anywhere}
.hinweis-ok{margin:0;font-size:var(--t-small);color:var(--c-status-frei);display:flex;gap:6px;align-items:center}
.sortiment{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--grid-gap)}
.produkt{display:flex;flex-direction:column;gap:6px}
.produkt__bild{height:96px;border-radius:var(--r-leinwand);display:grid;place-items:center;background:radial-gradient(ellipse 70% 80% at 50% 30%,rgba(127,176,138,.28),transparent 75%),#160e0e;margin:-4px 0 8px}
.produkt__bild svg{width:40px;height:40px;stroke:var(--c-projektor);stroke-width:1.2;fill:none;opacity:.85}
.produkt h3{margin:0;font-size:var(--t-h3);font-weight:500;line-height:1.2}
.produkt__marke{margin:0 0 8px;color:var(--c-nitrat);font-size:var(--t-small)}
.produkt__chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;min-height:24px}
.fakten--eng{grid-template-columns:repeat(3,1fr);gap:8px 12px}
.lieferplan{display:grid;gap:var(--grid-gap)}
.lieferplan__balken{display:flex;height:6px;gap:2px;border-radius:3px;overflow:hidden;background:var(--line-soft)}
.lieferplan__balken i{display:block;height:100%}
.lieferplan__balken .s1{background:var(--c-spur-dokumente)}.lieferplan__balken .s2{background:var(--c-glut)}.lieferplan__balken .s3{background:var(--c-spur-qualitaet)}
.tabelle input[type=checkbox]{width:16px;height:16px;accent-color:var(--c-vorhang)}
@media (max-width:720px){.fakten--eng{grid-template-columns:1fr 1fr}}
.vorspann--seite{align-items:center;overflow-y:auto}
.vorspann--seite .vorspann__inhalt{padding-top:calc(var(--letterbox-h) + 24px)}
.sprachen{margin-left:14px}.sprachen a{color:var(--c-nitrat);text-decoration:none;margin-right:8px;font-size:var(--t-micro);letter-spacing:.08em}.sprachen a[aria-current]{color:var(--c-glut)}

/* ===== Leitstand: Schauplätze (Schweiz | Deutschland), 3D-Szene mit echten Modellen ===== */
.schauplaetze{display:flex;gap:2px;margin:0 0 10px;border-radius:999px;background:var(--c-loge);padding:3px;width:max-content;max-width:100%}
.schauplaetze button{font:inherit;font-size:.9rem;font-weight:500;padding:9px 18px;border-radius:999px;border:0;background:transparent;color:var(--c-nitrat);cursor:pointer;display:flex;gap:10px;align-items:center}
.schauplaetze button b{font-weight:600}
.schauplaetze button small{font-weight:400;font-size:.78rem;opacity:.8}
.schauplaetze button[aria-pressed="true"]{background:var(--c-projektor);color:var(--c-saal)}
.sp-buehne{position:relative;border-radius:14px;overflow:hidden;background:#E8E3DB;aspect-ratio:16/8;min-height:420px;box-shadow:0 30px 80px -40px rgba(0,0,0,.8),inset 0 0 0 1px rgba(0,0,0,.08)}
.sp-buehne canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block}
.sp-hotspots{position:absolute;inset:0;pointer-events:none}
.sp-hotspot{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;display:flex;align-items:center;gap:8px;background:#fff;color:#1a1414;border:0;border-radius:999px;padding:0;height:34px;box-shadow:0 8px 22px -8px rgba(0,0,0,.45);cursor:pointer;font:inherit;transition:transform .2s,opacity .25s}
.sp-hotspot:hover{transform:translate(-50%,-50%) scale(1.05)}
.sp-hotspot i{width:34px;height:34px;border-radius:50%;background:var(--c-vorhang);color:#fff;display:grid;place-items:center;font-weight:600;font-size:18px;line-height:1;font-style:normal}
.sp-hotspot em{font-style:normal;color:var(--c-vorhang);font-weight:600;padding:0 12px 0 4px;font-variant-numeric:tabular-nums}
.sp-hotspot span{display:none;padding:0 14px 0 0;margin-left:-8px;font-size:.84rem;font-weight:500;white-space:nowrap}
.sp-hotspot.aktiv span,.sp-hotspot:hover span,.sp-hotspot:focus-visible span{display:inline}
.sp-hotspot.aktiv i{background:#1a1414}
.sp-hotspot.leer{opacity:.75}.sp-hotspot.leer em{color:#8a8580}
.sp-steuer{position:absolute;right:14px;top:14px;display:flex;gap:6px;z-index:5}
.sp-steuer button{font:inherit;font-size:.8rem;padding:6px 12px;border-radius:999px;border:0;background:rgba(255,255,255,.85);color:#1a1414;cursor:pointer;backdrop-filter:blur(8px)}
.sp-steuer button[aria-pressed="true"]{background:#1a1414;color:#fff}
.sp-tafel{position:absolute;left:14px;top:14px;background:rgba(255,255,255,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:12px;padding:14px 16px 12px;color:#1a1414;font-size:.8rem;box-shadow:0 20px 50px -30px rgba(0,0,0,.6);z-index:4;max-width:280px}
.sp-tafel b{display:block;font-size:.92rem;font-weight:600}.sp-tafel span{color:#5f5a56}
.sp-karte{position:absolute;left:14px;bottom:14px;width:min(440px,calc(100% - 28px));background:rgba(255,255,255,.84);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#1a1414;border-radius:14px;padding:18px 20px 16px;box-shadow:0 30px 60px -30px rgba(0,0,0,.7);z-index:4;transition:transform .35s var(--e-fokus),opacity .35s}
.sp-karte.wechsel{transform:translateY(8px);opacity:0}
.sp-karte__nr{font-size:2rem;font-weight:200;font-stretch:125%;color:var(--c-vorhang);line-height:1;margin-bottom:2px}
.sp-karte h2{margin:0;font-size:1.25rem;font-weight:550;line-height:1.15;color:#1a1414}
.sp-karte p{margin:6px 0 0;color:#4d4845;font-size:.86rem;max-width:48ch}
.sp-karte h3{margin:14px 0 6px;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:#7a7470;font-weight:600}
.sp-werte{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;margin:0}
.sp-werte div{border-top:1px solid rgba(0,0,0,.08);padding-top:5px;min-width:0}
.sp-werte dt{font-size:.7rem;color:#7a7470}.sp-werte dd{margin:0;font-size:.95rem;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.sp-hier{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.sp-hier a{font-size:.76rem;font-variant-numeric:tabular-nums;padding:4px 9px;border-radius:999px;border:1px solid rgba(0,0,0,.12);background:#fff;color:#1a1414;text-decoration:none}
.sp-hier a:hover{border-color:var(--c-vorhang);color:var(--c-vorhang)}
.sp-hier a.mehr{border-style:dashed;color:#7a7470}
.sp-stationen{display:flex;gap:8px;overflow-x:auto;padding:14px 2px 6px;scrollbar-width:none;align-items:stretch}
.sp-stationen::-webkit-scrollbar{display:none}
.sp-st{flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 10px;border-radius:10px;background:var(--c-loge);border:1px solid transparent;color:var(--c-projektor);cursor:pointer;font:inherit;text-align:left;transition:border-color .2s,background .2s;min-height:52px}
.sp-st small{font-size:.72rem;color:var(--c-nitrat);font-variant-numeric:tabular-nums;font-stretch:88%}
.sp-st strong{display:block;font-weight:500;font-size:.86rem;white-space:nowrap}
.sp-st em{font-style:normal;font-size:.72rem;color:var(--c-nitrat)}
.sp-st .n{margin-left:6px;min-width:26px;height:26px;border-radius:999px;display:grid;place-items:center;font-size:.78rem;font-weight:600;background:var(--c-rang);color:var(--c-nitrat);padding:0 8px}
.sp-st .n.hat{background:var(--c-vorhang);color:#fff;box-shadow:0 0 14px rgba(158,5,4,.5)}
.sp-st[aria-current="step"]{border-color:var(--c-glut);background:var(--c-rang)}
.sp-st svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.5;flex:0 0 auto;opacity:.9}
.sp-trenner{flex:0 0 auto;align-self:center;width:1px;height:36px;background:var(--line);margin:0 6px}
.sp-gruppe{flex:0 0 auto;align-self:center;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--c-nitrat);writing-mode:vertical-rl;transform:rotate(180deg);margin:0 2px}
@media (max-width:760px){.sp-buehne{aspect-ratio:auto;height:72vh}.sp-tafel{display:none}}

/* Lieferwelt: Licht nach Serverzeit — Rahmen und Vignette folgen der Palette (kein Schwarz um die Welt) */
.lw-buehne[data-licht="tag"]{background:#DCD6CC}
.lw-buehne[data-licht="tag"]::after{background:radial-gradient(ellipse at 60% 45%,transparent 55%,rgba(60,45,40,.22) 100%)}
.lw-buehne[data-licht="abend"]{background:#B39A86}
.lw-buehne[data-licht="abend"]::after{background:radial-gradient(ellipse at 60% 45%,transparent 50%,rgba(40,20,15,.4) 100%)}

/* Lieferwelt: Länderumschalter und Ländergruppen in der Kapitelleiste (Punkt 3) */
.lw-land{position:absolute;z-index:4;left:16px;top:16px;display:flex;gap:2px;padding:3px;border-radius:999px;background:rgba(28,20,21,.85);box-shadow:inset 0 0 0 1px var(--line)}
.lw-land button{height:30px;padding:0 14px;border:0;border-radius:999px;background:transparent;color:var(--c-nitrat);font:inherit;font-size:var(--t-small);font-weight:500;cursor:pointer;white-space:nowrap}
.lw-land button:hover{color:var(--c-projektor)}
.lw-land button[aria-pressed="true"]{background:var(--c-projektor);color:var(--c-saal)}
.lw-kap__land{align-self:flex-end;padding:0 6px 14px 0;font-size:var(--t-micro);letter-spacing:.08em;text-transform:uppercase;color:var(--c-nitrat);writing-mode:vertical-rl;transform:rotate(180deg);white-space:nowrap}
.lw-kap--aus{opacity:.38}
.lw-kap--aus:hover{opacity:.8}
.lw-buehne .lw-karte{top:64px}
@media (max-width:760px){.lw-land{top:auto;bottom:104px}.lw-kap__land{display:none}}

/* ===== Phase 7: Szenenwechsel, Irisblende, Abspann, Startband, Reduced Motion ===== */
.nav{view-transition-name:nav}
@media (prefers-reduced-motion:reduce){.vorspann__bild{animation:none}::view-transition-old(root),::view-transition-new(root){animation:none}.live i{transition:none}}
:root[data-motion="reduced"] .vorspann__bild{animation:none}
:root[data-motion="reduced"] .dialog[open]{animation:none}
.startband{position:fixed;inset:0;z-index:650;display:grid;place-items:center;background:rgba(10,6,6,.6);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.startband svg{width:120px;height:120px;overflow:visible}
.startband circle{fill:none;stroke:var(--line);stroke-width:1.5}
.startband line{stroke:var(--c-glut);stroke-width:2;transform-origin:50px 50px;animation:zeiger 1s linear infinite}
@keyframes zeiger{to{transform:rotate(360deg)}}
.startband__ziffer{position:absolute;font-size:3rem;font-weight:200;font-stretch:125%;font-variant-numeric:tabular-nums}
:root[data-motion="reduced"] .startband line{animation:none}
.abspann{height:min(520px,64vh);overflow:hidden;position:relative;mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent);-webkit-mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent);background:var(--c-loge);border-radius:var(--r-leinwand);box-shadow:var(--edge-1)}
.abspann__rolle{text-align:center;padding:48px 24px 72px}
.abspann__rolle h4{font-size:var(--t-micro);color:var(--c-nitrat);font-weight:500;font-stretch:88%;letter-spacing:.08em;text-transform:uppercase;margin:28px 0 4px}
.abspann__rolle p{margin:0;font-family:var(--f-credit);font-style:italic;font-size:1.25rem;font-weight:350;line-height:1.4}
.abspann__rolle .titel{font-family:var(--f-sans);font-style:normal;font-size:var(--t-h2);font-weight:300;font-stretch:125%}
.abspann__werte{display:grid;grid-template-columns:1fr auto;gap:6px 24px;max-width:380px;margin:8px auto 0;text-align:left;font-size:var(--t-small)}
.abspann__werte dt{color:var(--c-nitrat)}.abspann__werte dd{margin:0;text-align:right;font-variant-numeric:tabular-nums}
.abspann__fuss{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:28px}
.abspann-statisch{height:auto;overflow:visible;mask-image:none;-webkit-mask-image:none}
@media (prefers-reduced-motion:reduce){.abspann{height:auto;overflow:visible;mask-image:none;-webkit-mask-image:none}}
:root[data-motion="reduced"] .abspann{height:auto;overflow:visible;mask-image:none;-webkit-mask-image:none}
.schnitt-liste{padding:12px 16px 4px;display:grid;gap:10px}
.schnitt-liste h4{margin:0;font-size:var(--t-small);font-weight:600;display:flex;align-items:center;gap:8px}
.schnitt-liste h4 i{width:8px;height:8px;border-radius:2px;background:var(--spur)}
.schnitt-liste ol{margin:0 0 6px;padding:0 0 0 18px;font-size:var(--t-small);color:var(--c-nitrat)}
.schnitt-liste li b{font-weight:500;color:var(--c-projektor)}
.schnitt-liste li.offen b{color:var(--c-glut)}

/* ===== Mobil-Durchgang 390 px (STYLEGUIDE Abnahme: Navigation unten, Tabellen gestapelt, Filmstreifen vertikal, Schnittplatz scrollt im Modul) ===== */
@media (max-width:760px){
  :root{--letterbox-h:22px}                                   /* Hochformat: schmale Balken statt Kinoformat */
  .vorspann{align-items:center}
  .vorspann__inhalt{padding-top:calc(var(--letterbox-h) + 24px)}
  .vorspann h1{font-size:clamp(2rem,11vw,3rem)}
  .login{max-width:none}
  .login__aktionen{flex-wrap:wrap;gap:10px 16px}
  .vorspann__hinweis{position:static;margin:14px 0 0;padding:0 var(--page-pad) 8px}
  .sprachen{display:block;margin:6px 0 0}
  .kopf{gap:12px 16px;margin-bottom:18px}
  .kopf h1{font-size:clamp(1.7rem,8vw,2.25rem)}
}
@media (max-width:1024px){
  /* Untere Navigation: Leitstand, Sendungen, Chargen, Dokumente, Konto */
  .nav a:nth-child(n+7){display:flex}
  .nav a[href$="bestellungen"],.nav a[href$="produkte"],.nav a[href$="sortiment"],.nav a[href$="rechnungen"],.nav .nav__ende{display:none}
}
@media (max-width:640px){
  .tabelle thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tabelle,.tabelle tbody{display:block}
  .tabelle tr{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;padding:14px 14px 12px;border-bottom:1px solid var(--line-soft)}
  .tabelle td{display:block;height:auto;min-height:0;padding:0;border:0;text-align:left}
  .tabelle td[data-label]:not([data-label=""])::before{content:attr(data-label);display:block;font-size:var(--t-micro);color:var(--c-nitrat);font-stretch:88%;margin-bottom:2px}
  .tabelle td:first-child{grid-column:1/-1}
  .tabelle td:first-child::before{display:none}
  .tabelle td.zahl{text-align:left}
  .tabelle td:has(> .btn:only-child),.tabelle td:has(> a.btn){grid-column:1/-1}
  .tabelle tr:hover td{background:transparent;box-shadow:none}
  .tabelle tr[colspan],.tabelle td[colspan]{grid-column:1/-1}
  .tabelle td[colspan]::before{display:none}
  .panel:has(> .tabelle){overflow:visible}
  .sp-stationen{padding-bottom:12px}
  /* Filmstreifen vertikal, scrollt im Modul */
  .filmstreifen{padding:18px 0}
  .filmstreifen::before,.filmstreifen::after{display:none}
  .spur-film{flex-direction:column;gap:10px;padding:6px 14px;scroll-snap-type:y proximity;max-height:64vh;overflow-y:auto;overflow-x:hidden}
  .bild{flex:0 0 auto;width:100%;scroll-snap-align:start;display:grid;grid-template-columns:96px 1fr}
  .bild__licht{height:100%;min-height:96px}
  .bild__text{padding:10px 12px}
  .bild__nr{font-size:1.5rem}
  .film-fortschritt{margin:12px 14px 0}
  /* Sendungsdetail-Kopf, Montage und Kennzahlen */
  .regie{gap:8px}
  .sendung-kopf{margin-top:0}
  .sp-hotspot span{display:none!important}
  .lw-karte,.lw-karte.unten{max-height:38%}
  .lw-werte{grid-template-columns:1fr 1fr;gap:4px 10px}
  .lw-land{bottom:100px}
  .lw-land button{padding:0 10px;font-size:var(--t-micro)}
  .schnitt__fuss{flex-direction:column;gap:6px}
  .fakten{grid-template-columns:1fr 1fr}
  .schauplaetze button small{display:none}
}

/* Vorspann-Film im Hochformat: Legende und Timecode weichen, Ortsmarken kleiner und ohne Adresskarte-Überlappung */
@media (max-width:760px){
  .weltbuehne .legende,.weltbuehne .buehne__rechts .timecode{display:none}
  .ort{font-size:.6rem;transform:translate(6px,-50%)}
  .buehne__zeile{padding:10px 12px}
  .adresskarte{max-width:170px;font-size:.7rem}
}

/* Abnahme: Kontrast der Ortszeiten, Linkunterstreichung im Fliesstext, Trefferflaeche der Listenlinks */
.kamera{opacity:.72}
.kamera__zeit{color:var(--c-projektor);opacity:.85}
.panel p a.sucher,.sp-karte p a{text-decoration:underline;text-underline-offset:3px}
.lw-auftrag__link{padding:6px 10px;min-height:28px;display:inline-flex;align-items:center}
.kamera__rolle{color:var(--c-projektor);opacity:.8}

/* Bestellungen (Phase B): Formular mit Positionen, Detail mit Mini-Filmstreifen */
.bestellform{display:grid;gap:var(--grid-gap)}
.positionen{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:pos}
.position{display:grid;grid-template-columns:minmax(0,2fr) 130px minmax(0,1.6fr) auto;gap:12px;align-items:end;padding:14px 0 12px;border-top:1px solid var(--line-soft);counter-increment:pos}
.position__frei{grid-column:1/-1}
.position__produkt::before{content:counter(pos,decimal-leading-zero);position:absolute;font-size:var(--t-micro);color:var(--c-nitrat);font-variant-numeric:tabular-nums;transform:translateY(-16px)}
.position .feld{position:relative;min-width:0}
.position .feld select{max-width:100%;text-overflow:ellipsis}
.position__frei[hidden]{display:none}
.position__weg{height:var(--control-h);color:var(--c-nitrat)}
.position__weg:hover{color:var(--c-glut)}
.bestellform__fuss{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;padding-top:8px}
.bestellung{display:grid;grid-template-columns:260px minmax(0,1fr);gap:var(--grid-gap);align-items:start}
.bestellung__daten{display:grid;gap:var(--grid-gap)}
.mini-film{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.mini-film__bild{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:center;padding:10px 12px;border-radius:3px;background:var(--c-rang);opacity:.45;filter:brightness(.8);transition:opacity var(--d-szene),filter var(--d-szene)}
.mini-film__bild--ist{opacity:.8;filter:none}
.mini-film__bild--jetzt{opacity:1;filter:none;box-shadow:0 0 0 1px rgba(242,104,94,.55),0 0 26px -8px rgba(158,5,4,.9)}
.mini-film__nr{font-size:1.4rem;font-weight:200;font-stretch:125%;color:rgba(239,231,225,.55);font-variant-numeric:tabular-nums}
.mini-film__bild--jetzt .mini-film__nr{color:var(--c-glut)}
.mini-film__text{display:grid;line-height:1.25}
.mini-film__text b{font-weight:550;font-size:.95rem}
.mini-film__text small{font-size:var(--t-micro);color:var(--c-nitrat);font-stretch:88%}
.mini-film--storno .mini-film__bild{opacity:.35;filter:grayscale(1) brightness(.7)}
@media (max-width:900px){.position{grid-template-columns:1fr 1fr}.position__produkt,.position__bem{grid-column:1/-1}.position__weg{justify-self:end}}
@media (max-width:760px){
  .bestellung{grid-template-columns:1fr}
  .position{grid-template-columns:1fr}.position__weg{justify-self:start}
  .bestellform__fuss .regie{width:100%}.bestellform__fuss .btn{flex:1 1 auto;justify-content:center}
}
@media (max-width:1024px){.nav a[href$="bestellungen"]{display:flex}}   /* Bestellungen auch in der unteren Navigation */

/* Produktanlage (Phase B): reservierte Artikelnummer */
.nummer{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px}
.nummer__code{font-size:2rem;font-weight:200;font-stretch:125%;letter-spacing:.02em;color:var(--c-glut);text-shadow:0 0 18px rgba(242,104,94,.35)}
.nummer b{font-weight:550}

/* Anlieferung melden (Phase B): Auswahl, Dateizeilen */
.wahl{display:flex;flex-wrap:wrap;gap:8px 18px}
.wahl__option{display:inline-flex;align-items:center;gap:8px;min-height:var(--control-h);cursor:pointer}
.wahl__option input{accent-color:var(--c-glut);width:16px;height:16px;margin:0}
.dateien{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.datei{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) auto;gap:12px;align-items:end;padding:12px 0;border-top:1px solid var(--line-soft)}
.datei .feld{min-width:0}
.feld input[type=file]{padding:0;height:auto;min-height:var(--control-h);line-height:1.2;color:var(--c-nitrat);font-size:var(--t-small)}
.feld input[type=file]::file-selector-button{height:var(--control-h);margin:0 12px 0 0;padding:0 14px;border:0;border-radius:var(--r-control);background:var(--c-rang);color:var(--c-projektor);cursor:pointer;font:inherit;font-size:var(--t-small)}
.datei__weg{height:var(--control-h);color:var(--c-nitrat)}
.datei__weg:hover{color:var(--c-glut)}
@media (max-width:760px){.datei{grid-template-columns:1fr}.datei__weg{justify-self:start}}

/* Label einreichen (Phase B): THC-Wahl als Chips, Regelkasten */
.thc-wahl{display:flex;flex-wrap:wrap;gap:8px}
.thc-wahl label{position:relative;cursor:pointer}
.thc-wahl input{position:absolute;opacity:0;width:0;height:0}
.thc-wahl span{display:inline-flex;align-items:center;height:36px;padding:0 16px;border-radius:var(--r-pill);background:var(--c-rang);color:var(--c-projektor);font-variant-numeric:tabular-nums;box-shadow:inset 0 0 0 1px transparent;transition:box-shadow var(--d-schnitt),background var(--d-schnitt)}
.thc-wahl input:checked+span{background:color-mix(in srgb,var(--c-glut) 18%,var(--c-rang));box-shadow:inset 0 0 0 1px var(--c-glut)}
.thc-wahl input:focus-visible+span{outline:2px solid var(--c-glut);outline-offset:2px}
.regel{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0;font-size:var(--t-small)}
.regel dt{color:var(--c-nitrat)}.regel dd{margin:0;font-variant-numeric:tabular-nums}

/* Auftragsliste im Leitstand: Produkt + THC vorne, Auftragsnummer klein */
.lw-auftraege strong.lw-produkt{white-space:normal;font-size:.95rem;font-weight:600;line-height:1.25;font-variant-numeric:normal}
.lw-auftraege .lw-thc{font-style:normal;font-weight:500;font-size:var(--t-small);color:var(--c-glut);white-space:nowrap;font-variant-numeric:tabular-nums}
.lw-auftraege small.lw-nr{font-variant-numeric:tabular-nums;letter-spacing:.01em}
.lw-auftraege .lw-thc--offen,.lw-thc--offen{color:var(--c-nitrat);font-weight:400}
.lw-thc--final,.lw-auftraege .lw-thc--final{color:var(--c-status-frei)}     /* Final-CoA = gruen, Starting-CoA = rot (Nutzer 21.10.2026; vorher umgekehrt) */
.lw-thc--eingang,.lw-auftraege .lw-thc--eingang{color:var(--c-glut)}        /* Liste: gleiche Spezifitaet wie .lw-auftraege .lw-thc (Fehler bis 01.10.2026) */
.lw-legende{margin:-6px 0 10px;font-size:var(--t-micro);color:var(--c-nitrat)}
.lw-legende .lw-thc{font-style:normal;font-weight:600;font-size:var(--t-micro)}
/* Gesperrt: rotes Achtung-Blinken (Status-Chip in Leitstand + Sendungsdetail, Statusmarke in Tabellen) */
@keyframes achtung{0%,100%{box-shadow:0 0 0 0 rgba(242,104,94,0);background:color-mix(in srgb,var(--c-status-gesperrt) 16%,transparent)}50%{box-shadow:0 0 0 4px rgba(242,104,94,.28),0 0 14px rgba(242,104,94,.6);background:color-mix(in srgb,var(--c-status-gesperrt) 42%,transparent)}}
.status--gesperrt{--s:var(--c-status-gesperrt);animation:achtung 1.2s ease-in-out infinite}
.marke-status--gesperrt{animation:achtung 1.2s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.status--gesperrt,.marke-status--gesperrt{animation:none;box-shadow:0 0 0 1px var(--c-status-gesperrt)}}
:root[data-motion="reduced"] .status--gesperrt,:root[data-motion="reduced"] .marke-status--gesperrt{animation:none;box-shadow:0 0 0 1px var(--c-status-gesperrt)}
.lw-auftraege small.lw-ort:empty{display:none}

/* Rechnungen: Kennzahlen-Leiste */
.kennzahlen{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:0 0 18px}
.kz{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border:1px solid var(--line-soft);border-radius:var(--r-panel);background:var(--c-rang)}
.kz__wert{font-size:var(--t-lead);font-weight:550;font-variant-numeric:tabular-nums;color:var(--c-projektor)}
.kz__label{font-size:var(--t-small);color:var(--c-nitrat)}
/* zwei Aussteller (swisscann tec AG / YouCann GmbH): je eine breite Kachel mit Absender-Zeile, Zahlen darunter */
.kennzahlen--quellen{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.kz__quelle{font-size:var(--t-small);font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--c-projektor);margin-bottom:4px}
.kz--quelle{border-left:3px solid var(--c-glut)}
.kz--quelle.kz--achtung{box-shadow:none;border-left-color:var(--c-status-quarantaene)}
.kz--achtung{box-shadow:inset 3px 0 0 var(--c-status-quarantaene)}
.kz--achtung .kz__wert{color:var(--c-status-quarantaene)}

/* Leitstand: Zugestellt Archiv */
.lw-archiv-zeile{display:flex;align-items:center;gap:10px;margin:-4px 4px 10px;font-size:var(--t-micro)}
.lw-archiv-zeile .btn[aria-pressed="true"]{box-shadow:inset 0 0 0 1px var(--c-glut)}
.lw-archiv-link{color:var(--c-nitrat)}

/* Admin-Kundenansicht Rechnungen + Zahlungsbedingungen */
.admin-band{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0 0 18px;padding:10px 14px;border-radius:var(--r-panel);background:color-mix(in srgb,var(--c-glut) 14%,transparent);border:1px solid color-mix(in srgb,var(--c-glut) 45%,transparent);font-size:var(--t-small)}
.admin-band a{color:var(--c-glut)}
.admin-band__ok{color:var(--c-status-frei)}
.teil{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:var(--t-small);line-height:1.5}
.teil--faellig{color:var(--c-status-quarantaene)}
.teil__ok{color:var(--c-status-frei)}
.admin-zb{margin-top:22px}
.admin-zb h3{font-size:var(--t-body);margin:0 0 10px;font-weight:500}
.admin-zb__aktuell{color:var(--c-glut);font-weight:400}
.zb-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px 16px;align-items:end;padding:12px 0}
.zb-form__aktion{display:flex;gap:8px;flex-wrap:wrap}

/* Sendung: naechster Schritt + Labor-/Freigabekette */
.naechster{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;border-left:3px solid var(--c-glut)}
.naechster__label{font-size:var(--t-micro);letter-spacing:.04em;text-transform:uppercase;color:var(--c-nitrat)}
.naechster__text{font-size:var(--t-lead);font-weight:500}
.naechster__datum{color:var(--c-glut);font-variant-numeric:tabular-nums}
.kette{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.kette__schritt{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;padding:6px 0 6px 18px;position:relative;border-bottom:1px solid var(--line-soft)}
.kette__schritt::before{content:"";position:absolute;left:0;top:13px;width:9px;height:9px;border-radius:50%;background:var(--c-nitrat)}
.kette__schritt--da::before{background:var(--c-status-frei)}
.kette__schritt--erwartet::before{background:var(--c-glut)}
.kette__schritt--ueberfaellig::before{background:var(--c-status-quarantaene)}
.kette__txt{color:var(--c-nitrat);font-variant-numeric:tabular-nums}
.kette__schritt--da .kette__txt{color:var(--c-status-frei)}

/* Hinweisfenster Labor-CoA */
.coa-dialog{border:0;border-radius:var(--r-panel);background:var(--c-loge);color:var(--c-projektor);padding:0;max-width:min(560px,calc(100vw - 32px))}
.coa-dialog::backdrop{background:rgba(0,0,0,.72)}
.coa-dialog__innen{padding:22px 24px}
.coa-dialog h2{margin:0 0 12px;font-size:var(--t-h3)}
.coa-dialog p{margin:0 0 10px;font-size:var(--t-small);line-height:1.55}
.coa-dialog__aktion{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:16px}

/* Chargen-Tabelle: Charge/Produkt breit, CoA-/Freigabe-Spalten schmal und einzeilig */
.tabelle--chargen th:nth-child(1),.tabelle--chargen td:nth-child(1){min-width:200px}
.tabelle--chargen th:nth-child(2),.tabelle--chargen td:nth-child(2){min-width:220px}
.tabelle--chargen td:nth-child(4),.tabelle--chargen td:nth-child(5),.tabelle--chargen td:nth-child(6),.tabelle--chargen td:nth-child(7){white-space:nowrap;width:1%}
.tabelle--chargen td:nth-child(4) .t-small,.tabelle--chargen td:nth-child(5) .t-small,.tabelle--chargen td:nth-child(6) .t-small,.tabelle--chargen td:nth-child(7) .t-small{white-space:nowrap}
.zelle--achtung{color:var(--c-status-quarantaene)}
.tabelle--chargen td:nth-child(8){min-width:170px}
/* Gedrucktes Kundenlabel */
.label-druck{display:grid;gap:14px;margin:0 0 14px}
.label-druck__bild{margin:0}
.label-druck__bild img{display:block;max-width:100%;height:auto;border-radius:4px;background:#fff;border:1px solid var(--line-soft)}
.label-druck__bild figcaption{margin-top:6px;color:var(--c-nitrat)}

/* ===== Mobile-Pruefung 07.10.2026 (iPhone/Android/iPad): Befunde aus Screenshots ===== */
/* Kartenmodus der Tabellen: lange Texte, Statusmarken und Beleg-Knoepfe duerfen umbrechen statt abgeschnitten zu werden */
@media (max-width:640px){
  .tabelle td{white-space:normal;overflow-wrap:anywhere;min-width:0}
  .tabelle td .marke-status{white-space:normal;overflow-wrap:normal;word-break:normal;height:auto;min-height:24px;padding-top:3px;padding-bottom:3px;line-height:1.25}
  .tabelle--chargen td:nth-child(n){width:auto;min-width:0;white-space:normal}
  .tabelle td:has(> .btn + .btn){grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px}
  .tabelle td:has(> .btn + .btn)::before{width:100%}
  .tabelle td.zahl .lw-thc{white-space:nowrap}
}
/* Chargen-Tabelle hat neun Spalten: ab Tablet-Hochformat ebenfalls als Karten (vorher seitlich abgeschnitten) */
@media (min-width:641px) and (max-width:1024px){
  .tabelle--chargen thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tabelle--chargen,.tabelle--chargen tbody{display:block}
  .tabelle--chargen tr{display:grid;grid-template-columns:repeat(3,1fr);gap:8px 18px;padding:16px 16px 14px;border-bottom:1px solid var(--line-soft)}
  .tabelle--chargen td{display:block;height:auto;min-height:0;padding:0;border:0;text-align:left;white-space:normal;overflow-wrap:anywhere;min-width:0}
  .tabelle--chargen td[data-label]:not([data-label=""])::before{content:attr(data-label);display:block;font-size:var(--t-micro);color:var(--c-nitrat);font-stretch:88%;margin-bottom:2px}
  .tabelle--chargen td:first-child{grid-column:1/-1}
  .tabelle--chargen td:first-child::before{display:none}
  .tabelle--chargen td.zahl{text-align:left}
  .tabelle--chargen td:has(> .btn + .btn){grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px}
  .tabelle--chargen td:has(> .btn + .btn)::before{width:100%}
  .tabelle--chargen tr:hover td{background:transparent;box-shadow:none}
  .tabelle--chargen td .marke-status{white-space:normal;overflow-wrap:normal;word-break:normal;height:auto;min-height:24px;padding-top:3px;padding-bottom:3px;line-height:1.25}
  .tabelle--chargen td:nth-child(n){width:auto;min-width:0;white-space:normal}
  .panel:has(> .tabelle--chargen){overflow:visible}
}
/* Tabellen im Vollmodus: Zahlen nicht umbrechen (Tablet: „22.4 %“ brach um) */
.tabelle td.zahl{white-space:nowrap}
/* Leitstand auf dem Handy: die Infokarte deckte die Welt fast komplett ab -> als flache Karte unten, Welt bleibt sichtbar */
@media (max-width:760px){
  .lw-buehne .lw-karte,.lw-karte,.lw-karte.unten{top:auto;bottom:14px;left:14px;right:14px;width:auto;max-height:42%;overflow:auto;padding:12px 14px 12px}
  .lw-karte h3,.lw-karte__titel{font-size:1.05rem;margin:2px 0 4px}
  .lw-karte>p{display:none}
  .lw-karte h4,.lw-karte__unter{font-size:.9rem;margin:0 0 4px}
  .lw-werte{gap:4px 12px}
  .lw-werte dd{font-size:.9rem}
  .lw-land{top:14px;bottom:auto;left:14px}
  .lw-steuer{top:14px;right:14px}
}
/* Handy: Landwahl und Steuerknoepfe ueberdeckten sich oben -> Knoepfe als Spalte rechts, Landwahl links mit Umbruch */
@media (max-width:760px){
  .lw-steuer{flex-direction:column;align-items:flex-end;gap:6px}
  .lw-land{max-width:calc(100% - 190px);flex-wrap:wrap;row-gap:4px}
}
/* Infokarte darf nie hoeher als die Buehne werden (Kapitel 06 hatte fuenf Kennzahlen + Hinweis und ragte hinter die Kapitelleiste) */
@media (min-width:761px){
  .lw-buehne .lw-karte,.lw-karte{max-height:calc(100% - 64px - 124px);overflow:auto;scrollbar-width:thin}
}