/* ============================================================
   Registrierungstool — Lasergame Schweiz brand styles.
   Laser-arena UI. (loads after lg-tokens.css)
   ============================================================ */

h1,h2,h3{ font-family:var(--f-head); font-weight:600; margin:0; letter-spacing:.2px; }

/* ── Topbar ─────────────────────────────────────────────── */
.topbar{
  position:sticky; top:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  height:64px; padding:0 24px;
  background:linear-gradient(rgba(8,12,20,.92), rgba(8,12,20,.72));
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--10);
  box-shadow:0 1px 0 rgba(226,35,28,.12);
}
.tb-brand{ display:flex; align-items:center; gap:12px; }
.tb-brand .glyph{
  width:38px; height:38px; flex:0 0 auto; color:var(--cyan);
  border:1.5px solid rgba(226,35,28,.5); border-radius:9px;
  display:grid; place-items:center; background:rgba(226,35,28,.07);
  box-shadow:0 0 14px rgba(226,35,28,.25), inset 0 0 12px rgba(226,35,28,.1);
}
.tb-brand .glyph .lgi{ width:22px; height:22px; }
.tb-brand b{ font-family:var(--f-head); font-weight:700; font-size:18px; letter-spacing:1.5px; text-transform:uppercase; line-height:1; display:block; }
.tb-brand .host{ font-family:var(--f-mono); font-size:10.5px; color:var(--40); letter-spacing:.2px; }
.tb-mid{ display:flex; align-items:center; }
.tb-right{ display:flex; align-items:center; gap:14px; }
.clock{ font-family:var(--f-mono); font-size:13px; color:var(--cyan-bright); letter-spacing:1px; text-shadow:0 0 10px rgba(226,35,28,.4); }
.envchip{ display:inline-flex; align-items:center; gap:7px; padding:6px 12px; border-radius:var(--r-cap); background:rgba(92,224,106,.1); border:1px solid rgba(92,224,106,.25); font-size:11.5px; color:var(--lime); font-weight:500; letter-spacing:.3px; }
.envchip .d{ width:7px; height:7px; border-radius:50%; background:var(--lime); box-shadow:0 0 9px var(--lime); animation:beat 1.8s infinite; }
@keyframes beat{ 0%,100%{opacity:1} 50%{opacity:.4} }

/* segmented toggle */
.seg{ display:inline-flex; background:var(--surf); border:1px solid var(--10); border-radius:var(--r-cap); padding:4px; gap:3px; }
.seg button{ border:none; background:transparent; color:var(--60); font-family:var(--f-head); font-weight:600; font-size:13.5px; letter-spacing:.5px; text-transform:uppercase; padding:8px 15px; border-radius:var(--r-cap); cursor:pointer; transition:all var(--dur-base) var(--ease-out); display:inline-flex; align-items:center; gap:7px; white-space:nowrap; }
.seg button .lgi{ width:16px; height:16px; }
.seg button.on{ background:linear-gradient(135deg, var(--cyan), #a3120f); color:#ffffff; box-shadow:0 0 16px rgba(226,35,28,.45); }
.seg button:hover:not(.on){ color:var(--100); }

/* ── Staff layout ───────────────────────────────────────── */
.staff{ max-width:1340px; margin:0 auto; padding:28px 24px 90px; }
.staff-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:24px; flex-wrap:wrap; }
.staff-head h1{ font-size:30px; font-weight:700; letter-spacing:.6px; text-transform:uppercase; line-height:1.05; white-space:nowrap; }
.staff-head .sub{ color:var(--40); font-size:13.5px; margin-top:7px; font-family:var(--f-sans); }
.subtabs{ display:flex; gap:4px; background:var(--surf); border:1px solid var(--10); border-radius:var(--r-md); padding:5px; flex:0 0 auto; }
.subtab{ border:none; background:transparent; color:var(--60); font-family:var(--f-head); font-weight:600; font-size:13.5px; letter-spacing:.4px; text-transform:uppercase; padding:8px 14px; border-radius:7px; cursor:pointer; display:inline-flex; align-items:center; gap:7px; transition:all var(--dur-base); white-space:nowrap; }
.subtab .lgi{ width:16px; height:16px; }
.subtab.on{ background:rgba(226,35,28,.12); color:var(--cyan-bright); box-shadow:inset 0 0 0 1px rgba(226,35,28,.3); }
.subtab:hover:not(.on){ color:var(--100); }
.subtab .badge{ font-family:var(--f-mono); font-size:10px; background:var(--cyan); color:#ffffff; border-radius:var(--r-cap); padding:2px 7px; font-weight:600; }

/* metrics */
.metrics{ display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:28px; }
.metric{ position:relative; border:1px solid var(--10); background:linear-gradient(var(--surf-2), var(--surf)); border-radius:var(--r-md); padding:18px 20px; overflow:hidden; }
.metric::before{ content:""; position:absolute; top:0; left:0; right:0; height:2px; background:linear-gradient(90deg, var(--cyan), transparent 70%); opacity:.7; }
.metric .k{ font-size:11px; letter-spacing:.8px; text-transform:uppercase; color:var(--40); font-weight:600; }
.metric .v{ font-family:var(--f-head); font-size:38px; font-weight:700; line-height:1; margin-top:8px; letter-spacing:.5px; }
.metric .v em{ font-style:normal; color:var(--cyan-bright); text-shadow:0 0 16px rgba(226,35,28,.45); }
.metric .v small{ font-size:15px; color:var(--40); font-family:var(--f-sans); font-weight:500; }

/* lanes */
.lanes{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; align-items:start; }
.lane{ border:1px solid var(--10); background:linear-gradient(var(--surf), rgba(8,12,20,.6)); border-radius:var(--r-lg); padding:16px; }
.lane[data-mode]{ }
.lane-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; padding:2px 2px 14px; border-bottom:1px solid var(--5); }
.lane-head .ttl{ display:flex; align-items:center; gap:12px; }
.lane-head .ttl .ic{ width:40px; height:40px; border-radius:10px; display:grid; place-items:center; }
.lane-head .ttl .ic .lgi{ width:20px; height:20px; }
.lane-head .ttl b{ font-family:var(--f-head); font-size:17px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; }
.lane-head .ttl small{ display:block; font-size:11.5px; color:var(--40); letter-spacing:.2px; }
/* team-color the lanes */
.lane.buchung .lane-head .ttl .ic{ color:var(--cyan); background:rgba(226,35,28,.1); box-shadow:inset 0 0 0 1px rgba(226,35,28,.3), 0 0 14px rgba(226,35,28,.2); }
.lane.arrow .lane-head .ttl .ic{ color:var(--amber); background:rgba(255,177,61,.1); box-shadow:inset 0 0 0 1px rgba(255,177,61,.3), 0 0 14px rgba(255,177,61,.2); }
.lane.open  .lane-head .ttl .ic{ color:var(--magenta); background:rgba(150,158,170,.1); box-shadow:inset 0 0 0 1px rgba(150,158,170,.3), 0 0 14px rgba(150,158,170,.2); }
.lane.buchung{ box-shadow:inset 0 2px 0 -1px rgba(226,35,28,.35); }
.lane.arrow{ box-shadow:inset 0 2px 0 -1px rgba(255,177,61,.35); }
.lane.open{ box-shadow:inset 0 2px 0 -1px rgba(150,158,170,.35); }
.lane-body{ display:flex; flex-direction:column; gap:14px; min-height:90px; }
.lane-empty{ text-align:center; color:var(--40); font-size:13px; padding:38px 12px; border:1px dashed var(--10); border-radius:var(--r-md); }

/* group card */
.gcard{ position:relative; border:1px solid var(--10); background:linear-gradient(135deg, var(--surf-2), var(--surf)); border-radius:var(--r-md); padding:16px 17px; transition:border-color var(--dur-base), transform var(--dur-base), box-shadow var(--dur-base); }
.gcard::before{ content:""; position:absolute; left:0; top:14px; bottom:14px; width:3px; border-radius:3px; background:var(--cyan); box-shadow:0 0 12px rgba(226,35,28,.5); opacity:.85; }
.lane.arrow .gcard::before{ background:var(--amber); box-shadow:0 0 12px rgba(255,177,61,.5); }
.lane.open .gcard::before{ background:var(--magenta); box-shadow:0 0 12px rgba(150,158,170,.5); }
.gcard:hover{ border-color:var(--20); transform:translateY(-1px); }
.gcard.closed{ opacity:.5; }
.gcard.closed::before{ background:var(--40); box-shadow:none; }
.gcard .top{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.gcard .who b{ font-family:var(--f-head); font-size:20px; font-weight:700; letter-spacing:.4px; display:flex; align-items:center; gap:9px; }
.gcard .who .time{ font-family:var(--f-mono); font-size:12.5px; color:var(--60); margin-top:5px; display:flex; align-items:center; gap:7px; }
.gcard .who .time .lgi{ width:14px; height:14px; color:var(--40); }
.gcard .rounds{ display:flex; align-items:center; border:1px solid var(--10); border-radius:10px; overflow:hidden; flex:0 0 auto; background:var(--bg); }
.gcard .rounds button{ width:36px; height:38px; border:none; background:transparent; color:var(--80); font-family:var(--f-head); font-size:22px; font-weight:600; cursor:pointer; display:grid; place-items:center; transition:all var(--dur-base); }
.gcard .rounds button:hover{ background:rgba(226,35,28,.14); color:var(--cyan-bright); }
.gcard .rounds button:disabled{ opacity:.25; cursor:not-allowed; background:transparent; color:var(--80); }
.gcard .rounds .n{ min-width:52px; text-align:center; font-family:var(--f-head); font-weight:700; font-size:19px; color:var(--cyan-bright); border-inline:1px solid var(--10); padding:2px 0; }
.gcard .rounds .n small{ display:block; font-size:8px; letter-spacing:1.5px; color:var(--40); text-transform:uppercase; font-family:var(--f-sans); font-weight:600; margin-top:-2px; }
.gcard .meta{ display:flex; align-items:center; gap:14px; margin:15px 0 14px; flex-wrap:wrap; }
.gcard .players-row{ display:flex; align-items:center; gap:10px; }
.gcard .stack{ display:inline-flex; }
.gcard .stack .av{ width:30px; height:30px; border-radius:50%; background:var(--surf-2); border:1.5px solid var(--surf); display:grid; place-items:center; font-family:var(--f-head); font-size:12px; font-weight:600; color:var(--cyan-bright); margin-left:-9px; }
.gcard .stack .av:first-child{ margin-left:0; }
.gcard .stack .av.more{ background:rgba(226,35,28,.14); color:var(--cyan); font-family:var(--f-mono); font-size:10px; }
.gcard .pcount{ font-size:12.5px; color:var(--60); font-weight:500; }
.gcard .actions{ display:flex; gap:8px; flex-wrap:wrap; }

.abtn{ display:inline-flex; align-items:center; gap:7px; border:1px solid var(--10); background:var(--surf); color:var(--80); font-family:var(--f-sans); font-weight:600; font-size:12.5px; padding:9px 14px; border-radius:var(--r-pill); cursor:pointer; transition:all var(--dur-base); letter-spacing:.2px; white-space:nowrap; }
.abtn .lgi{ width:15px; height:15px; }
.abtn:hover{ background:var(--surf-2); border-color:var(--20); color:var(--100); }
.abtn.primary{ background:linear-gradient(135deg, var(--cyan), #a3120f); color:#ffffff; border-color:transparent; box-shadow:0 0 14px rgba(226,35,28,.35); }
.abtn.primary:hover{ box-shadow:0 0 20px rgba(226,35,28,.55); color:#ffffff; }
.abtn.warn:hover{ border-color:var(--red); color:var(--red); background:rgba(255,59,81,.08); }
.abtn.go:hover{ border-color:var(--cyan); color:var(--cyan-bright); background:rgba(226,35,28,.08); }

.statuschip{ display:inline-flex; align-items:center; gap:6px; font-family:var(--f-sans); font-size:10.5px; font-weight:600; letter-spacing:.4px; text-transform:uppercase; padding:3px 10px; border-radius:var(--r-cap); }
.statuschip.active{ background:rgba(92,224,106,.12); color:var(--lime); }
.statuschip.closed{ background:var(--5); color:var(--40); }
.statuschip .d{ width:6px; height:6px; border-radius:50%; background:currentColor; box-shadow:0 0 7px currentColor; }

/* ── History table ──────────────────────────────────────── */
.histbar{ display:flex; align-items:center; gap:12px; margin-bottom:18px; flex-wrap:wrap; }
.histbar > span:first-child{ width:16px; height:16px; color:var(--40); }
.histbar input[type=date]{ background:var(--surf); border:1px solid var(--10); color:var(--100); font-family:var(--f-mono); font-size:13px; padding:10px 12px; border-radius:var(--r-md); color-scheme:dark; }
.histbar .spacer{ flex:1; }
.table{ border:1px solid var(--10); border-radius:var(--r-md); overflow:hidden; background:var(--surf); }
.thead,.trow{ display:grid; grid-template-columns:108px 92px 1.3fr 130px 70px 70px 150px; gap:10px; align-items:center; padding:14px 18px; }
.thead{ background:var(--surf-2); font-family:var(--f-head); font-size:12px; letter-spacing:.6px; text-transform:uppercase; color:var(--60); font-weight:600; }
.trow{ border-top:1px solid var(--5); font-size:13.5px; transition:background var(--dur-base); }
.trow:hover{ background:rgba(226,35,28,.04); }
.trow b{ font-family:var(--f-head); font-weight:600; font-size:15px; letter-spacing:.3px; }
.trow .mode-tag{ font-family:var(--f-sans); font-size:10.5px; font-weight:600; letter-spacing:.4px; text-transform:uppercase; padding:3px 10px; border-radius:var(--r-cap); width:fit-content; }
.trow .mode-tag.buchung{ background:rgba(226,35,28,.13); color:var(--cyan-bright); }
.trow .mode-tag.arrow{ background:rgba(255,177,61,.14); color:var(--amber); }
.trow .mode-tag.open{ background:rgba(150,158,170,.14); color:var(--magenta-br); }
.trow .lk{ color:var(--60); cursor:pointer; display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:600; }
.trow .lk:hover{ color:var(--cyan-bright); }
.trow .lk .lgi{ width:14px; height:14px; }
.hist-empty{ padding:44px; text-align:center; color:var(--40); }

/* ── Modal / drawer ─────────────────────────────────────── */
.backdrop{ position:fixed; inset:0; z-index:500; background:rgba(3,5,9,.7); backdrop-filter:blur(5px); display:flex; align-items:center; justify-content:center; padding:24px; animation:fade .2s var(--ease-out); }
.backdrop.right{ justify-content:flex-end; padding:0; }
@keyframes fade{ from{opacity:0} to{opacity:1} }
.modal{ width:min(520px,94vw); background:linear-gradient(var(--surf-2), var(--surf)); border:1px solid var(--20); border-radius:var(--r-lg); padding:28px; animation:pop .26s var(--ease-out); max-height:92vh; overflow:auto; box-shadow:0 24px 70px rgba(0,0,0,.6), 0 0 0 1px rgba(226,35,28,.12); }
@keyframes pop{ from{opacity:0; transform:translateY(14px) scale(.98)} to{opacity:1; transform:none} }
.drawer{ width:min(580px,100vw); height:100vh; background:linear-gradient(var(--surf), var(--bg-2)); border-left:1px solid var(--20); padding:26px; overflow:auto; animation:slide .3s var(--ease-out); box-shadow:-20px 0 60px rgba(0,0,0,.5); }
@keyframes slide{ from{transform:translateX(40px); opacity:.6} to{transform:none; opacity:1} }
.modal-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:22px; }
.modal-head h2{ font-family:var(--f-head); font-size:23px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; }
.modal-head p{ margin:5px 0 0; color:var(--40); font-size:13px; font-family:var(--f-sans); }
.xbtn{ width:36px; height:36px; border-radius:9px; border:1px solid var(--10); background:var(--surf); color:var(--60); display:grid; place-items:center; cursor:pointer; flex:0 0 auto; transition:all var(--dur-base); }
.xbtn:hover{ color:var(--100); background:var(--surf-2); border-color:var(--20); }
.xbtn .lgi{ width:17px; height:17px; }

/* form bits */
.flabel{ font-family:var(--f-head); font-size:12px; letter-spacing:.6px; text-transform:uppercase; color:var(--60); margin-bottom:8px; display:block; font-weight:600; }
.finput{ width:100%; background:var(--bg); border:1px solid var(--10); border-radius:var(--r-md); color:var(--100); font-family:var(--f-sans); font-weight:500; font-size:15px; padding:13px 15px; transition:border-color var(--dur-base), box-shadow var(--dur-base); }
.finput::placeholder{ color:var(--40); font-weight:400; }
.finput:focus{ outline:none; border-color:var(--cyan); box-shadow:0 0 0 1px var(--cyan), 0 0 16px rgba(226,35,28,.25); }
.finput.bad{ border-color:var(--red); box-shadow:0 0 0 1px var(--red); }
.finput::-webkit-calendar-picker-indicator{ filter:invert(1); opacity:.6; cursor:pointer; }
select.finput{ color-scheme:dark; cursor:pointer; }
.frow{ margin-bottom:18px; }
.fgrid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.ferr{ color:var(--red); font-size:11.5px; margin-top:6px; font-weight:500; }
.hint{ font-size:11.5px; color:var(--40); margin-top:6px; }

.timesel{ display:flex; align-items:center; gap:10px; }
.timesel select{ flex:1; }

/* big primary action — laser CTA */
.cs{ position:relative; display:inline-flex; align-items:center; justify-content:center; gap:11px; width:100%;
  padding:15px 28px; border-radius:var(--r-md); border:none; cursor:pointer;
  background:linear-gradient(135deg, var(--cyan), #a3120f); color:#ffffff;
  font-family:var(--f-head); font-weight:700; font-size:16px; letter-spacing:.8px; text-transform:uppercase;
  box-shadow:0 0 18px rgba(226,35,28,.4); transition:all var(--dur-base) var(--ease-out); }
.cs:hover{ box-shadow:0 0 28px rgba(226,35,28,.6); transform:translateY(-1px); }
.cs:disabled{ background:var(--surf-2); color:var(--40); cursor:not-allowed; box-shadow:none; }
.cs .lgi{ width:18px; height:18px; }
.cs.ghost{ background:transparent; border:1px solid var(--20); color:var(--80); box-shadow:none; }
.cs.ghost:hover{ background:var(--surf); color:var(--100); box-shadow:none; transform:none; }

/* ── group detail / player list ─────────────────────────── */
.gd-summary{ display:grid; grid-template-columns:1fr 1fr; gap:11px; margin-bottom:24px; }
.gd-summary .b{ border:1px solid var(--10); background:var(--surf); border-radius:var(--r-md); padding:13px 15px; }
.gd-summary .b small{ font-family:var(--f-head); font-size:11px; text-transform:uppercase; letter-spacing:.5px; color:var(--40); display:block; font-weight:600; }
.gd-summary .b b{ font-family:var(--f-head); font-size:18px; font-weight:700; letter-spacing:.3px; }
.plist{ display:flex; flex-direction:column; gap:10px; }
.pitem{ display:flex; align-items:center; gap:14px; border:1px solid var(--10); background:var(--surf); border-radius:var(--r-md); padding:12px 15px; }
.pitem .pav{ width:42px; height:42px; border-radius:10px; background:rgba(226,35,28,.1); border:1px solid rgba(226,35,28,.25); display:grid; place-items:center; font-family:var(--f-head); font-weight:700; font-size:16px; color:var(--cyan-bright); flex:0 0 auto; }
.pitem .pinfo{ flex:1; min-width:0; }
.pitem .pinfo b{ font-size:15px; font-weight:600; display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.pitem .pinfo .alias{ font-family:var(--f-mono); font-size:12px; color:var(--cyan-bright); }
.pitem .pinfo small{ display:block; color:var(--40); font-size:12px; margin-top:3px; }
.pitem .agbok{ color:var(--lime); font-size:11px; font-weight:600; display:inline-flex; align-items:center; gap:5px; margin-top:4px; }
.pitem .agbok .lgi{ width:13px; height:13px; }
.pitem .sigthumb{ width:84px; height:42px; border:1px solid var(--10); border-radius:var(--r-sm); background:#fff; flex:0 0 auto; object-fit:contain; }
.plist-empty{ text-align:center; color:var(--40); font-size:13px; padding:32px; border:1px dashed var(--10); border-radius:var(--r-md); }

/* QR modal */
.qrwrap{ text-align:center; }
.qrbox{ width:230px; height:230px; margin:0 auto 18px; background:#fff; border-radius:var(--r-md); padding:14px; box-shadow:0 0 24px rgba(226,35,28,.25); }
.qrbox svg{ width:100%; height:100%; display:block; }
.qrwrap .qcap{ font-family:var(--f-mono); font-size:12px; color:var(--cyan-bright); word-break:break-all; }

/* ── Customer / QR surface ──────────────────────────────── */
.cust-stage{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:34px 16px; }
.phone{ width:min(450px,100%); }
.phone-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; padding:0 4px; }
.phone-top .brand{ display:flex; align-items:center; gap:11px; }
.phone-top .brand .glyph{ width:32px; height:32px; color:var(--cyan); border:1.5px solid rgba(226,35,28,.5); border-radius:8px; display:grid; place-items:center; background:rgba(226,35,28,.08); box-shadow:0 0 12px rgba(226,35,28,.25); }
.phone-top .brand .glyph .lgi{ width:19px; height:19px; }
.phone-top .brand b{ font-family:var(--f-head); font-size:15px; font-weight:700; letter-spacing:1px; text-transform:uppercase; }
.phone-top .brand small{ display:block; font-family:var(--f-mono); font-size:10px; color:var(--40); }
.cust-card{ border:1px solid var(--20); background:linear-gradient(var(--surf-2), var(--surf)); border-radius:var(--r-lg); overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,.5), 0 0 0 1px rgba(226,35,28,.08); }
.cust-hero{ position:relative; padding:24px 24px 22px; border-bottom:1px solid var(--10); background:linear-gradient(135deg, rgba(226,35,28,.12), transparent 60%); overflow:hidden; }
.cust-hero::after{ content:""; position:absolute; right:-30px; top:-30px; width:140px; height:140px; background:radial-gradient(closest-side, rgba(226,35,28,.25), transparent); }
.cust-hero .eyebrow{ font-family:var(--f-head); font-size:11.5px; letter-spacing:.7px; text-transform:uppercase; color:var(--cyan-bright); font-weight:600; position:relative; }
.cust-hero h2{ font-family:var(--f-head); font-size:30px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; margin:9px 0 2px; position:relative; }
.cust-hero .gtime{ font-family:var(--f-mono); font-size:13px; color:var(--80); display:flex; align-items:center; gap:8px; margin-top:9px; position:relative; }
.cust-hero .gtime .lgi{ width:15px; height:15px; color:var(--cyan); }
.cust-body{ padding:24px; }
.cust-body h3{ font-family:var(--f-head); font-size:17px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; margin:0 0 5px; display:flex; align-items:center; gap:9px; }
.cust-body h3 .lgi{ width:18px; height:18px; }
.cust-body .lead{ color:var(--40); font-size:12.5px; margin:0 0 22px; }

/* signature pad */
.sigpad-wrap{ position:relative; }
.sigpad{ width:100%; aspect-ratio:5/2; background:var(--bg); border:1px solid var(--10); border-radius:var(--r-md); touch-action:none; display:block; }
.sigpad.bad{ border-color:var(--red); }
.sigpad-hint{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:9px; color:var(--40); font-size:13px; pointer-events:none; }
.sigpad-hint .lgi{ width:18px; height:18px; }
.sigpad-clear{ position:absolute; right:9px; bottom:9px; width:33px; height:33px; border-radius:8px; background:var(--surf-2); border:1px solid var(--10); color:var(--60); display:grid; place-items:center; cursor:pointer; }
.sigpad-clear:hover{ color:var(--100); background:var(--surf); }
.sigpad-clear .lgi{ width:15px; height:15px; }

/* agb */
.agbrow{ display:flex; gap:12px; align-items:flex-start; border:1px solid var(--10); background:var(--surf); border-radius:var(--r-md); padding:14px; cursor:pointer; transition:border-color var(--dur-base); }
.agbrow:hover{ border-color:var(--20); }
.agbrow.bad{ border-color:var(--red); }
.agbrow .box{ width:24px; height:24px; flex:0 0 auto; border:1.5px solid var(--40); border-radius:6px; display:grid; place-items:center; transition:all var(--dur-base); }
.agbrow.on .box{ background:var(--cyan); border-color:var(--cyan); color:#ffffff; box-shadow:0 0 12px rgba(226,35,28,.5); }
.agbrow .box .lgi{ width:15px; height:15px; opacity:0; }
.agbrow.on .box span{ opacity:1; }
.agbrow .txt{ font-size:12.5px; color:var(--80); line-height:1.6; }
.agbrow .txt a{ color:var(--cyan-bright); text-decoration:underline; }
.agbrow .txt small{ color:var(--40); }

/* success */
.cust-success{ text-align:center; padding:40px 24px 32px; }
.cust-success .big{ width:78px; height:78px; border-radius:50%; background:rgba(92,224,106,.12); color:var(--lime); display:grid; place-items:center; margin:0 auto 20px; box-shadow:0 0 30px rgba(92,224,106,.3); }
.cust-success .big .lgi{ width:36px; height:36px; }
.cust-success h2{ font-family:var(--f-head); font-size:28px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; margin:0 0 8px; }
.cust-success .alias{ font-family:var(--f-mono); color:var(--cyan-bright); font-size:16px; }
.cust-success p{ color:var(--40); font-size:13px; margin:16px 0 26px; }

/* alias copy */
.alias-field{ position:relative; }
.copybtn{ position:absolute; right:8px; top:50%; transform:translateY(-50%); background:var(--surf-2); border:1px solid var(--10); color:var(--60); font-size:11px; font-weight:600; padding:7px 11px; border-radius:var(--r-pill); cursor:pointer; display:inline-flex; gap:6px; align-items:center; }
.copybtn:hover{ color:var(--cyan-bright); border-color:var(--20); }
.copybtn .lgi{ width:12px; height:12px; }

/* toast */
.toasts{ position:fixed; bottom:24px; left:50%; transform:translateX(-50%); z-index:900; display:flex; flex-direction:column; gap:10px; align-items:center; }
.toast{ display:flex; align-items:center; gap:11px; background:linear-gradient(var(--surf-2), var(--surf)); border:1px solid var(--20); border-radius:var(--r-pill); padding:12px 20px; font-size:13px; font-weight:500; box-shadow:0 10px 34px rgba(0,0,0,.55); animation:toastin .3s var(--ease-out); }
.toast span:first-child{ width:17px; height:17px; }
.toast.ok span:first-child{ color:var(--lime); }
.toast.info span:first-child{ color:var(--cyan-bright); }
.toast .undo{ color:var(--cyan-bright); cursor:pointer; text-decoration:underline; margin-left:4px; font-weight:600; }
@keyframes toastin{ from{opacity:0; transform:translateY(12px)} to{opacity:1; transform:none} }

/* ── print (PDF) ────────────────────────────────────────── */
@media print{
  body * { visibility:hidden !important; }
  .printdoc, .printdoc *{ visibility:visible !important; }
  .printdoc{ position:absolute; inset:0; margin:0; padding:0; }
  .pdbar{ display:none !important; }
}
.printdoc-modal .modal{ width:min(720px,96vw); padding:0; background:#fff; }
.pdbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 20px; background:linear-gradient(135deg, #161618, #060a12); border-bottom:1px solid var(--20); border-radius:var(--r-lg) var(--r-lg) 0 0; }
.pdbar b{ color:var(--100); font-family:var(--f-head); font-weight:700; letter-spacing:.4px; text-transform:uppercase; }
.pdpage{ padding:42px 46px; color:#111; background:#fff; }
.pdpage h1{ font-family:var(--f-head); font-size:26px; font-weight:700; margin:0; color:#0a1018; letter-spacing:.5px; text-transform:uppercase; }
.pdpage .pdmeta{ display:flex; flex-wrap:wrap; gap:8px 28px; margin:8px 0 24px; color:#566; font-size:13px; }
.pdpage .pdmeta b{ color:#111; }
.pdhr{ height:3px; background:linear-gradient(90deg,#e2231c,#c2ccd6); margin:0 0 20px; border-radius:2px; }
.pdplayer{ border:1px solid #dde3ea; border-radius:10px; padding:16px 18px; margin-bottom:14px; page-break-inside:avoid; }
.pdplayer .pdh{ display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.pdplayer .pdh b{ font-family:var(--f-head); font-size:17px; font-weight:700; }
.pdplayer .pdh .alias{ font-family:var(--f-mono); color:#b3161c; font-size:13px; }
.pdgrid{ display:grid; grid-template-columns:1fr 1fr; gap:6px 24px; font-size:13px; color:#333; }
.pdgrid .k{ color:#889; }
.pdsig{ margin-top:14px; display:flex; align-items:flex-end; gap:14px; }
.pdsig img{ width:170px; height:62px; object-fit:contain; border-bottom:1.5px solid #111; }
.pdsig small{ color:#889; font-size:11px; }
.pdfoot{ margin-top:26px; font-size:11px; color:#99a; border-top:1px solid #e3e8ee; padding-top:12px; }

/* ── layout hardening + real logo ─────────────────────────── */
.cust-body h3,.cust-hero h2,.cust-hero .eyebrow,.cust-hero .gtime,.cust-success h2{ white-space:nowrap; }
.tb-logo{ height:42px; width:auto; display:block; mix-blend-mode:lighten; }
.pt-logo{ height:40px; width:auto; display:block; mix-blend-mode:lighten; }
.login-logo{ width:300px; max-width:84%; height:auto; mix-blend-mode:lighten; }
.tb-brand{ display:flex; align-items:center; gap:14px; }
.tb-brand .host{ font-family:var(--f-mono); font-size:10.5px; color:var(--40); }
.phone-top{ align-items:center; }

/* confirm modal */
.confirm-ic{ width:62px; height:62px; border-radius:50%; background:rgba(226,35,28,.12); color:var(--red); display:grid; place-items:center; margin:4px auto 18px; }
.confirm-ic .lgi{ width:30px; height:30px; }
.cs.danger{ background:linear-gradient(135deg, var(--red), #9a1118); color:#fff; box-shadow:0 0 18px rgba(226,35,28,.4); }
.cs.danger:hover{ box-shadow:0 0 28px rgba(226,35,28,.6); }

/* ── Admin panels (Übersicht / Orbit) ─────────────────────── */
.panel-head{ display:flex; align-items:baseline; gap:14px; margin-bottom:20px; flex-wrap:wrap; }
.panel-head h2{ font-family:var(--f-head); font-size:26px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; }
.panel-sub{ color:var(--40); font-size:13px; }
.ov-grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:18px; align-items:start; margin-top:18px; }
.card-block{ border:1px solid var(--10); background:linear-gradient(var(--surf-2), var(--surf)); border-radius:var(--r-lg); padding:20px; }
.cb-head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.cb-head b{ font-family:var(--f-head); font-size:16px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; }
.cb-head span{ font-size:13px; color:var(--60); }
.barlist{ display:flex; align-items:flex-end; gap:12px; height:170px; }
.bar{ flex:1; display:flex; flex-direction:column; align-items:center; gap:8px; height:100%; }
.bar-track{ flex:1; width:100%; display:flex; align-items:flex-end; background:var(--bg); border-radius:6px 6px 0 0; overflow:hidden; }
.bar-fill{ width:100%; background:linear-gradient(var(--red), #7e0f14); border-radius:6px 6px 0 0; transition:height .4s var(--ease-out); }
.bar-fill.on{ background:linear-gradient(var(--cyan-bright), var(--red)); box-shadow:0 0 14px rgba(226,35,28,.5); }
.bar small{ font-size:11px; color:var(--40); font-family:var(--f-head); font-weight:600; }
.split{ display:flex; flex-direction:column; gap:12px; }
.split-row{ display:flex; align-items:center; gap:12px; }
.sl{ width:54px; font-family:var(--f-head); font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:.4px; }
.sl.quest{ color:var(--red); } .sl.open{ color:var(--80); }
.sbar{ flex:1; height:10px; background:var(--bg); border-radius:6px; overflow:hidden; }
.sbar div{ height:100%; border-radius:6px; transition:width .4s var(--ease-out); }
.split-row b{ width:30px; text-align:right; font-family:var(--f-head); font-weight:700; }
.mini-rows{ display:flex; flex-direction:column; gap:8px; }
.mini-row{ display:flex; align-items:center; gap:11px; padding:8px 10px; border:1px solid var(--5); border-radius:var(--r-md); background:var(--surf); }
.mr-av{ width:32px; height:32px; border-radius:50%; background:rgba(226,35,28,.13); color:var(--red); display:grid; place-items:center; font-family:var(--f-head); font-weight:700; font-size:12px; }
.mr-info{ flex:1; } .mr-info b{ font-size:13.5px; font-weight:600; display:block; } .mr-info small{ font-size:11px; color:var(--40); }
.mr-tag{ font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.4px; color:var(--60); padding:3px 9px; border-radius:var(--r-cap); background:var(--5); }
.orbit-banner{ display:flex; align-items:center; gap:14px; border:1px solid var(--20); background:linear-gradient(135deg, rgba(226,35,28,.1), transparent 60%); border-radius:var(--r-lg); padding:16px 20px; margin-bottom:20px; }
.ob-glyph{ width:42px; height:42px; color:var(--red); border:1px solid rgba(226,35,28,.4); border-radius:10px; display:grid; place-items:center; background:rgba(226,35,28,.08); }
.ob-glyph .lgi{ width:24px; height:24px; }
.orbit-banner b{ font-family:var(--f-head); font-size:18px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; display:block; }
.orbit-banner small{ color:var(--40); font-size:12px; }
.ob-tag{ margin-left:auto; font-family:var(--f-mono); font-size:11px; color:var(--red); border:1px solid rgba(226,35,28,.4); border-radius:var(--r-cap); padding:4px 11px; }
.loc-status{ font-family:var(--f-head); font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.4px; padding:3px 10px; border-radius:var(--r-cap); }
.loc-status.live{ background:rgba(92,224,106,.12); color:var(--lime); }
.loc-status.onboarding{ background:rgba(255,177,61,.14); color:var(--amber); }
.loc-status.operational{ background:rgba(92,224,106,.12); color:var(--lime); }
.loc-real{ font-family:var(--f-mono); font-size:10px; color:var(--red); margin-left:8px; border:1px solid rgba(226,35,28,.3); border-radius:var(--r-cap); padding:1px 7px; }
.health{ display:flex; flex-direction:column; gap:2px; }
.hrow{ display:flex; align-items:center; justify-content:space-between; padding:11px 2px; border-top:1px solid var(--5); font-size:13.5px; color:var(--80); }
.hrow:first-child{ border-top:none; }
.hrow b.ok{ color:var(--lime); font-weight:500; font-size:13px; }
.evlog{ display:flex; flex-direction:column; gap:4px; }
.evrow{ display:flex; gap:11px; padding:9px 2px; align-items:flex-start; }
.evdot{ width:8px; height:8px; border-radius:50%; margin-top:5px; flex:0 0 auto; }
.evdot.ok{ background:var(--lime); box-shadow:0 0 7px var(--lime); }
.evdot.warn{ background:var(--amber); box-shadow:0 0 7px var(--amber); }
.evrow b{ font-size:13px; font-weight:500; display:block; } .evrow small{ font-size:11px; color:var(--40); }

/* ── Kiosk ────────────────────────────────────────────────── */
.kiosk{ max-width:1340px; margin:0 auto; padding:24px 24px 50px; }
.kiosk-head{ display:flex; align-items:center; gap:22px; padding-bottom:20px; border-bottom:1px solid var(--10); margin-bottom:22px; }
.kiosk-logo{ height:54px; width:auto; mix-blend-mode:lighten; }
.kiosk-title{ flex:1; } .kiosk-title b{ font-family:var(--f-head); font-size:28px; font-weight:700; letter-spacing:1px; text-transform:uppercase; display:block; line-height:1; }
.kiosk-title small{ color:var(--40); font-size:13px; }
.kiosk-clock{ font-family:var(--f-head); font-size:52px; font-weight:700; letter-spacing:1px; color:var(--100); text-shadow:0 0 20px rgba(226,35,28,.3); line-height:1; }
.kiosk-clock span{ font-size:26px; color:var(--40); }
.kiosk-stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:22px; }
.kiosk-stats .ks{ border:1px solid var(--10); background:var(--surf); border-radius:var(--r-md); padding:16px 20px; }
.kiosk-stats .ks b{ font-family:var(--f-head); font-size:40px; font-weight:700; color:var(--red); line-height:1; display:block; text-shadow:0 0 18px rgba(226,35,28,.4); }
.kiosk-stats .ks small{ font-size:12px; color:var(--60); text-transform:uppercase; letter-spacing:.4px; font-weight:600; }
.kiosk-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:16px; }
.kgcard{ position:relative; border:1px solid var(--10); background:linear-gradient(150deg, var(--surf-2), var(--surf)); border-radius:var(--r-lg); padding:20px 22px; overflow:hidden; }
.kgcard::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:5px; background:var(--red); box-shadow:0 0 16px rgba(226,35,28,.5); }
.kgcard.arrow::before{ background:var(--amber); box-shadow:0 0 16px rgba(255,177,61,.5); }
.kgcard.open::before{ background:var(--80); box-shadow:none; }
.kg-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.kg-mode{ font-family:var(--f-head); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.6px; padding:4px 11px; border-radius:var(--r-cap); }
.kg-mode.quest{ background:rgba(226,35,28,.14); color:var(--cyan-bright); }
.kg-mode.arrow{ background:rgba(255,177,61,.16); color:var(--amber); }
.kg-mode.open{ background:var(--10); color:var(--100); }
.kg-phase{ display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:600; }
.kg-phase .dot{ width:8px; height:8px; border-radius:50%; background:currentColor; }
.kg-phase.live{ color:var(--lime); } .kg-phase.live .dot{ box-shadow:0 0 8px var(--lime); animation:beat 1.6s infinite; }
.kg-phase.wait{ color:var(--amber); } .kg-phase.over{ color:var(--red); }
.kg-name{ font-family:var(--f-head); font-size:30px; font-weight:700; letter-spacing:.5px; line-height:1; }
.kg-time{ font-family:var(--f-mono); font-size:15px; color:var(--80); margin-top:8px; }
.kg-foot{ display:flex; align-items:flex-end; justify-content:space-between; margin-top:18px; padding-top:16px; border-top:1px solid var(--10); }
.kg-players{ display:flex; flex-direction:column; gap:8px; font-size:12.5px; color:var(--60); }
.kg-stack{ display:inline-flex; }
.kg-av{ width:30px; height:30px; border-radius:50%; background:var(--surf-2); border:1.5px solid var(--surf); display:grid; place-items:center; font-family:var(--f-head); font-weight:700; font-size:12px; color:var(--cyan-bright); margin-left:-8px; }
.kg-av:first-child{ margin-left:0; } .kg-av.more{ background:rgba(226,35,28,.16); color:var(--red); font-family:var(--f-mono); font-size:10px; }
.kg-rounds{ text-align:right; } .kg-rounds b{ font-family:var(--f-head); font-size:34px; font-weight:700; color:var(--red); line-height:1; display:block; }
.kg-rounds small{ font-size:10px; text-transform:uppercase; letter-spacing:.5px; color:var(--40); font-weight:600; }
.kiosk-empty{ text-align:center; padding:80px 20px; color:var(--40); display:flex; flex-direction:column; align-items:center; gap:12px; }
.kiosk-empty .lgi{ width:60px; height:60px; color:var(--red); opacity:.6; }
.kiosk-empty b{ font-family:var(--f-head); font-size:26px; font-weight:700; text-transform:uppercase; color:var(--80); }
.kiosk-ticker{ margin-top:24px; border-top:1px solid var(--10); padding-top:16px; overflow:hidden; white-space:nowrap; }
.kiosk-ticker span{ display:inline-block; font-family:var(--f-head); font-size:14px; letter-spacing:1px; text-transform:uppercase; color:var(--40); animation:tick 24s linear infinite; }
@keyframes tick{ from{transform:translateX(40%)} to{transform:translateX(-100%)} }

@media (max-width:880px){ .ov-grid{ grid-template-columns:1fr; } .kiosk-stats{ grid-template-columns:1fr; } .kiosk-clock{ font-size:38px; } }

/* prevent flex items from shrinking AND from being clamped below their
   content width (which made labels bleed past the button edge) */
.tb-brand,.tb-mid,.tb-right,.seg,.subtabs{ flex:0 0 auto; }
.seg button,.subtab,.abtn,.demo-chip,.gcard .rounds button,.xbtn,.cs,.copybtn,.lk{ flex-shrink:0; }
.abtn,.seg button,.subtab,.demo-chip,.trow .lk{ min-width:max-content; }
.staff-head{ row-gap:14px; }

/* ── Login ──────────────────────────────────────────────── */
.login-stage{ min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:32px 18px; gap:20px; }
.login-card{ width:min(440px,100%); background:linear-gradient(var(--surf-2), var(--surf)); border:1px solid var(--20); border-radius:var(--r-lg); padding:36px 34px 30px; box-shadow:0 30px 80px rgba(0,0,0,.6), 0 0 0 1px rgba(226,35,28,.1); }
.login-logo{ display:block; width:280px; max-width:84%; height:auto; margin:0 auto 14px; }
.login-sub{ text-align:center; font-family:var(--f-mono); font-size:11px; color:var(--40); letter-spacing:.3px; margin-bottom:28px; }
.login-form{ margin-bottom:6px; }
.login-demo{ margin-top:22px; padding-top:20px; border-top:1px solid var(--10); }
.login-demo-lbl{ display:block; text-align:center; font-family:var(--f-head); font-size:11px; letter-spacing:.8px; text-transform:uppercase; color:var(--40); margin-bottom:12px; font-weight:600; }
.login-demo-row{ display:flex; gap:8px; }
.demo-chip{ flex:1; display:inline-flex; align-items:center; justify-content:center; gap:7px; border:1px solid var(--10); background:var(--surf); color:var(--80); font-family:var(--f-head); font-weight:600; font-size:13px; letter-spacing:.3px; text-transform:uppercase; padding:11px 8px; border-radius:var(--r-md); cursor:pointer; transition:all var(--dur-base); }
.demo-chip .lgi{ width:15px; height:15px; }
.demo-chip:hover{ border-color:var(--red); color:#fff; background:rgba(226,35,28,.08); }
.demo-chip.orbit:hover{ border-color:var(--40); color:#fff; background:var(--surf-2); }
.login-foot{ font-family:var(--f-mono); font-size:11px; color:var(--40); }

/* topbar user chip + logout */
.userchip{ display:inline-flex; align-items:center; gap:10px; padding:5px 6px 5px 12px; border-radius:var(--r-cap); background:var(--surf); border:1px solid var(--10); }
.userchip .uinfo{ text-align:right; line-height:1.1; }
.userchip .uinfo b{ font-family:var(--f-head); font-size:13px; font-weight:700; letter-spacing:.3px; display:block; }
.userchip .uinfo small{ font-size:10px; color:var(--40); }
.userchip .uav{ width:30px; height:30px; border-radius:50%; background:rgba(226,35,28,.14); border:1px solid rgba(226,35,28,.3); color:var(--red); display:grid; place-items:center; font-family:var(--f-head); font-weight:700; font-size:13px; }
.userchip.super .uav{ background:rgba(240,240,242,.1); border-color:var(--20); color:var(--100); }
.logoutbtn{ width:34px; height:34px; border-radius:9px; border:1px solid var(--10); background:var(--surf); color:var(--60); display:grid; place-items:center; cursor:pointer; transition:all var(--dur-base); }
.logoutbtn:hover{ color:var(--red); border-color:var(--red); }
.logoutbtn .lgi{ width:16px; height:16px; }
.tb-logo{ height:30px; width:auto; display:block; }

/* ── Kiosk · Playboard (isolated public display) ──────────── */
.kioskv{ min-height:100vh; display:flex; flex-direction:column; padding:0; }
.kiosk-bar{ display:flex; align-items:center; gap:20px; padding:18px 30px; border-bottom:1px solid var(--10); background:linear-gradient(rgba(10,10,11,.9), transparent); }
.kiosk-bar .kiosk-logo{ height:46px; width:auto; mix-blend-mode:lighten; }
.kiosk-badge{ font-family:var(--f-head); font-size:15px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--red); border:1px solid rgba(226,35,28,.4); border-radius:var(--r-cap); padding:6px 16px; }
.kiosk-bar-right{ margin-left:auto; display:flex; align-items:center; gap:16px; }
.kclock{ font-family:var(--f-head); font-size:34px; font-weight:700; letter-spacing:1px; line-height:1; text-shadow:0 0 18px rgba(226,35,28,.3); }
.kclock i{ font-style:normal; font-size:18px; color:var(--40); }
.kiosk-exit{ display:inline-flex; align-items:center; gap:8px; min-width:max-content; border:1px solid var(--10); background:var(--surf); color:var(--80); font-family:var(--f-head); font-weight:600; font-size:14px; letter-spacing:.4px; text-transform:uppercase; padding:9px 16px; border-radius:var(--r-md); cursor:pointer; transition:all var(--dur-base); }
.kiosk-exit:hover{ color:#fff; border-color:var(--red); background:rgba(226,35,28,.08); }
.kiosk-exit .lgi{ width:16px; height:16px; }

.pb-grid{ flex:1; display:flex; flex-wrap:wrap; justify-content:center; align-content:center; align-items:stretch; gap:20px; padding:28px 30px; }
.pb-card{ position:relative; flex:0 1 380px; max-width:440px; border:1px solid var(--10); background:linear-gradient(155deg, var(--surf-2), var(--surf)); border-radius:var(--r-lg); padding:22px 24px; overflow:hidden; }
.pb-card::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:6px; background:var(--red); box-shadow:0 0 20px rgba(226,35,28,.6); }
.pb-card.arrow::before{ background:var(--amber); box-shadow:0 0 20px rgba(255,177,61,.6); }
.pb-card.open::before{ background:var(--60); box-shadow:none; }
.pb-head{ display:flex; align-items:center; justify-content:space-between; }
.pb-meta{ display:flex; align-items:center; gap:12px; }
.pb-mode{ font-family:var(--f-head); font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.6px; padding:4px 12px; border-radius:var(--r-cap); }
.pb-mode.buchung{ background:rgba(226,35,28,.16); color:var(--cyan-bright); }
.pb-mode.arrow{ background:rgba(255,177,61,.16); color:var(--amber); }
.pb-mode.open{ background:var(--10); color:var(--100); }
.pb-time{ font-family:var(--f-mono); font-size:14px; color:var(--60); }
.pb-phase{ display:inline-flex; align-items:center; gap:8px; font-family:var(--f-head); font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; }
.pb-phase .dot{ width:9px; height:9px; border-radius:50%; background:currentColor; }
.pb-phase.live{ color:var(--lime); } .pb-phase.live .dot{ box-shadow:0 0 9px var(--lime); animation:beat 1.5s infinite; }
.pb-phase.wait{ color:var(--amber); } .pb-phase.over{ color:var(--red); }
.pb-name{ font-family:var(--f-head); font-size:38px; font-weight:700; letter-spacing:.5px; line-height:1; margin:14px 0 18px; }
.pb-tags-lbl{ font-family:var(--f-head); font-size:11px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; color:var(--40); margin-bottom:10px; }
.pb-tags{ display:flex; flex-wrap:wrap; gap:9px; min-height:42px; }
.gtag{ font-family:var(--f-mono); font-size:17px; font-weight:500; color:var(--100); background:var(--bg); border:1px solid rgba(226,35,28,.35); border-left:3px solid var(--red); border-radius:6px; padding:8px 14px; box-shadow:0 0 14px rgba(226,35,28,.08); }
.pb-card.open .gtag{ border-color:var(--20); border-left-color:var(--60); box-shadow:none; }
.pb-card.arrow .gtag{ border-color:rgba(255,177,61,.35); border-left-color:var(--amber); box-shadow:none; }
.pb-noplayers{ color:var(--40); font-size:14px; font-style:italic; padding:9px 0; }
.pb-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:20px; padding-top:16px; border-top:1px solid var(--10); font-size:14px; color:var(--60); }
.pb-rounds b{ font-family:var(--f-head); font-size:22px; font-weight:700; color:var(--red); }
.kioskv .kiosk-empty{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; color:var(--40); }
.kioskv .kiosk-empty .big{ width:70px; height:70px; color:var(--red); opacity:.6; }
.kioskv .kiosk-empty b{ font-family:var(--f-head); font-size:30px; font-weight:700; text-transform:uppercase; color:var(--80); }
.kioskv .kiosk-ticker{ margin:0; border-top:1px solid var(--10); padding:14px 30px; overflow:hidden; white-space:nowrap; }

/* ── Self-Check-in kiosk + self-register picker ───────────── */
.checkin{ min-height:100vh; display:flex; flex-direction:column; }
.checkin-body{ flex:1; display:flex; align-items:center; justify-content:center; padding:30px 18px; }
.checkin-card{ width:min(460px,100%); text-align:center; border:1px solid var(--10); background:linear-gradient(var(--surf-2), var(--surf)); border-radius:var(--r-lg); padding:34px 32px; box-shadow:0 24px 70px rgba(0,0,0,.5); }
.checkin-card h1{ font-family:var(--f-head); font-size:34px; font-weight:700; letter-spacing:.5px; text-transform:uppercase; margin:10px 0 8px; }
.checkin-card p{ color:var(--60); font-size:14px; line-height:1.6; margin:0 0 22px; }
.checkin-qr{ width:280px; height:280px; margin:0 auto 16px; background:#fff; border-radius:var(--r-md); padding:15px; box-shadow:0 0 30px rgba(226,35,28,.25); }
.checkin-qr svg{ width:100%; height:100%; display:block; }
.checkin-url{ font-family:var(--f-mono); font-size:13px; color:var(--red); margin-bottom:22px; }
.checkin-hint{ font-size:11.5px !important; color:var(--40) !important; margin:14px 0 0 !important; }

.sr-list{ display:flex; flex-direction:column; gap:10px; }
.sr-item{ display:flex; align-items:center; justify-content:space-between; gap:12px; text-align:left; width:100%; border:1px solid var(--10); background:var(--surf); border-radius:var(--r-md); padding:15px 16px; cursor:pointer; transition:all var(--dur-base); }
.sr-item:hover{ border-color:var(--red); background:rgba(226,35,28,.06); }
.sr-info b{ font-family:var(--f-head); font-size:18px; font-weight:700; letter-spacing:.3px; display:block; }
.sr-info small{ font-size:12.5px; color:var(--40); font-family:var(--f-mono); }
.sr-go{ width:38px; height:38px; flex:0 0 auto; border-radius:50%; background:rgba(226,35,28,.13); color:var(--red); display:grid; place-items:center; }
.sr-go .lgi{ width:18px; height:18px; }
.sr-empty{ text-align:center; padding:34px 16px; color:var(--40); display:flex; flex-direction:column; align-items:center; gap:10px; }
.sr-empty .lgi{ width:40px; height:40px; color:var(--red); opacity:.5; }
.sr-empty b{ font-family:var(--f-head); font-size:20px; font-weight:700; text-transform:uppercase; color:var(--80); }
.sr-empty span{ font-size:13px; }

/* ── today's closed groups — immediate recovery in Heute ──── */
.closed-today{ margin-top:18px; border:1px solid var(--5); border-radius:var(--r-lg); background:linear-gradient(var(--surf), rgba(8,12,20,.4)); padding:15px 17px; }
.ct-head{ display:flex; align-items:center; gap:9px; font-family:var(--f-head); font-size:14px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:var(--60); margin-bottom:12px; }
.ct-head .lgi{ width:16px; height:16px; color:var(--red); }
.ct-head em{ font-style:normal; font-family:var(--f-sans); font-weight:500; font-size:11.5px; text-transform:none; letter-spacing:0; color:var(--40); margin-left:2px; }
.ct-list{ display:flex; flex-direction:column; gap:8px; }
.ct-item{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 14px; border:1px solid var(--5); border-radius:var(--r-md); background:var(--surf); }
.ct-info{ display:flex; align-items:center; gap:12px; }
.ct-dot{ width:8px; height:8px; border-radius:50%; flex:0 0 auto; }
.ct-dot.buchung{ background:var(--red); box-shadow:0 0 8px rgba(226,35,28,.5); } .ct-dot.arrow{ background:var(--amber); box-shadow:0 0 8px rgba(255,177,61,.5); } .ct-dot.open{ background:var(--60); }
.ct-info b{ font-family:var(--f-head); font-size:16px; font-weight:700; letter-spacing:.3px; display:block; }
.ct-info small{ font-size:12px; color:var(--40); font-family:var(--f-mono); }

/* ── responsive ─────────────────────────────────────────── */
@media (max-width:880px){
  .lanes{ grid-template-columns:1fr; }
  .metrics{ grid-template-columns:1fr 1fr; }
  .thead{ display:none; }
  .trow{ grid-template-columns:1fr 1fr; gap:6px 10px; }
  .tb-brand .host{ display:none; }
}
@media (max-width:560px){
  .topbar{ padding:0 14px; height:auto; flex-wrap:wrap; gap:8px; padding-block:9px; }
  .clock{ display:none; }
  .fgrid{ grid-template-columns:1fr; }
  .staff{ padding:18px 14px 80px; }
  .seg button{ padding:8px 13px; }
}

/* icon class (replaces fragile bare-span targeting) */
.lgi{ display:inline-flex; align-items:center; justify-content:center; width:1em; height:1em; flex:0 0 auto; }
.lgi svg{ width:100%; height:100%; display:block; }

/* PDF — always a full page, never cropped to content */
.printdoc{ background:#fff; }
.printdoc .pdpage{ min-height:1010px; box-sizing:border-box; display:flex; flex-direction:column; }
.printdoc .pd-body{ flex:1; }
@media print{
  @page{ size:A4; margin:0; }
  .printdoc .pdpage{ min-height:297mm; padding:20mm 18mm; }
}