:root{--bg:#0d1117;--panel:#151b23;--panel2:#1f2937;--text:#eef2ff;--muted:#9ca3af;--line:#303846;--brand:#56d364;--brand2:#2ea043;--danger:#ff7b72}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:linear-gradient(180deg,#0d1117,#111827);color:var(--text)}a{color:inherit}.topbar{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px clamp(16px,4vw,44px);background:rgba(13,17,23,.92);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}.brand{font-weight:900;text-decoration:none;font-size:2.25rem;color:var(--brand)}nav{display:flex;align-items:center;gap:12px;flex-wrap:wrap}nav a{text-decoration:none;color:var(--muted)}nav a:hover{color:var(--text)}.container{width:min(1120px,100%);margin:0 auto;padding:32px 16px 70px}.hero{display:grid;grid-template-columns:1fr;gap:24px;align-items:center;min-height:330px;padding:32px;border-radius:28px;background:radial-gradient(circle at 20% 20%,rgba(86,211,100,.22),transparent 35%),var(--panel);border:1px solid var(--line);box-shadow:0 20px 70px rgba(0,0,0,.25)}h1{font-size:clamp(2rem,6vw,4.8rem);line-height:1;margin:0 0 18px}h2,h3{margin-top:0}.eyebrow{color:var(--brand);font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:.8rem}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}.btn,button.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;padding:12px 18px;background:var(--brand);color:#06140a;font-weight:800;text-decoration:none;cursor:pointer}.btn:hover{background:#72e383}.btn.secondary{background:var(--panel2);color:var(--text);border:1px solid var(--line)}.btn.small{padding:7px 11px;font-size:.9rem}.grid{display:grid;gap:18px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.card,.mini-card{background:rgba(21,27,35,.95);border:1px solid var(--line);border-radius:22px;padding:22px;margin:18px 0}.mini-card{margin:0}.form{display:grid;gap:14px}.form label{display:grid;gap:7px;color:var(--muted);font-weight:700}.form input,.form select,.form textarea,.admin-row select{width:100%;border:1px solid var(--line);background:#0d1117;color:var(--text);border-radius:13px;padding:12px;font:inherit}.form .check{display:flex;grid-template-columns:auto 1fr;align-items:flex-start;gap:10px;color:var(--text);font-weight:600}.form .check input{width:auto;margin-top:4px}.row{display:grid;grid-template-columns:1.4fr .8fr .8fr .8fr auto;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}.row:first-child{border-top:0}.row small{display:block;color:var(--muted);font-weight:500;margin-top:3px}.admin-row{grid-template-columns:1.4fr 1fr .9fr .9fr .9fr .9fr auto}.muted{color:var(--muted)}.notice{background:rgba(86,211,100,.14);border:1px solid rgba(86,211,100,.35);padding:12px 14px;border-radius:14px}.stat strong{display:block;font-size:2.3rem;color:var(--brand)}#map-placeholder{min-height:230px;display:grid;place-items:center;border:1px dashed var(--line);border-radius:18px;color:var(--muted);background:#0d1117}@media(max-width:850px){.topbar{align-items:flex-start;flex-direction:column}.grid.two,.grid.three{grid-template-columns:1fr}.row,.admin-row{grid-template-columns:1fr}.container{padding-top:20px}h1{font-size:2.4rem}.hero{padding:22px}}
#game-map { width: 100%; min-height: 460px; border-radius: 18px; overflow: hidden; border: 1px solid #d8e0ea; background: #eef3f7; }
.map-actions { margin-top: 1rem; display: flex; gap: .75rem; flex-wrap: wrap; }
.card.highlight { border: 2px solid #111827; background: linear-gradient(180deg,#ffffff,#f3f7ff); }
.grid.four { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
@media (max-width: 900px) { .grid.four { grid-template-columns: repeat(2, minmax(0, 1fr)); } #game-map { min-height: 360px; } }
@media (max-width: 620px) { .grid.four { grid-template-columns: 1fr; } #game-map { min-height: 320px; } }


/* v5 command center */
.command-shell{background:linear-gradient(180deg,rgba(17,24,39,.96),rgba(8,13,22,.98));border:1px solid var(--line);border-radius:28px;padding:18px;margin:18px 0 24px;box-shadow:0 24px 90px rgba(0,0,0,.35)}
.command-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 6px 18px}.command-head h2{margin:0 0 6px;font-size:clamp(1.5rem,3vw,2.4rem)}
.role-badge{border-radius:999px;padding:10px 14px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;background:var(--panel2);border:1px solid var(--line)}.role-badge.catcher{background:rgba(255,123,114,.18);color:#ffb1ab}.role-badge.escapee{background:rgba(86,211,100,.16);color:#8ff09d}
.cockpit-grid{display:grid;grid-template-columns:330px 1fr;gap:18px;align-items:stretch}.cockpit-panel{display:flex;flex-direction:column;gap:14px}.metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.metric{background:#0d1117;border:1px solid var(--line);border-radius:18px;padding:14px}.metric span{display:block;color:var(--muted);font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.metric strong{display:block;margin-top:7px;color:var(--brand);font-size:1.45rem}.status-box{background:rgba(21,27,35,.9);border:1px solid var(--line);border-radius:18px;padding:16px}.status-box h3{margin-bottom:10px}.status-box p{margin:.45rem 0}.team-list{display:grid;gap:8px;max-height:260px;overflow:auto;padding-right:4px}.team-row{display:flex;justify-content:space-between;gap:10px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:10px;background:#0d1117}.team-row small{color:var(--muted)}.team-row.caught,.team-row.out_of_zone{opacity:.65}.team-row.catcher{border-left:4px solid #ff7b72}.team-row.escapee{border-left:4px solid #56d364}.map-wrap{position:relative;min-height:640px}.map-wrap #game-map{height:100%;min-height:640px;border-radius:22px;border:1px solid var(--line);background:#111827}.map-toolbar{position:absolute;left:14px;right:14px;bottom:14px;z-index:500;display:flex;gap:10px;flex-wrap:wrap;padding:10px;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(13,17,23,.78);backdrop-filter:blur(10px)}.leaflet-control-attribution{font-size:10px}.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:#0d1117;color:#eef2ff}.leaflet-container{font-family:inherit}.pulse-reveal{animation:pulseReveal 1s infinite}@keyframes pulseReveal{0%,100%{filter:drop-shadow(0 0 0 rgba(255,255,255,0))}50%{filter:drop-shadow(0 0 10px rgba(255,255,255,.9))}}
@media(max-width:1050px){.cockpit-grid{grid-template-columns:1fr}.map-wrap,.map-wrap #game-map{min-height:520px}}@media(max-width:620px){.command-head{flex-direction:column;align-items:flex-start}.metric-grid{grid-template-columns:1fr 1fr}.map-wrap,.map-wrap #game-map{min-height:420px}.map-toolbar{position:static;margin-top:10px}.map-toolbar .btn{flex:1 1 160px}}
.cx-marker{display:grid;place-items:center;border-radius:50%;width:30px;height:30px;font-weight:900;border:2px solid #fff;box-shadow:0 8px 20px rgba(0,0,0,.35);color:#08111f}.cx-marker.catcher-marker{background:#ff7b72}.cx-marker.escapee-marker{background:#56d364}.leaflet-interactive{outline:none}

/* v5.1 Leaflet-Unterordner-Fix: kritische Leaflet-CSS lokal, damit die Karte nicht in Kacheln zerfaellt, falls CDN-CSS blockiert wird. */
.leaflet-pane,.leaflet-tile,.leaflet-marker-icon,.leaflet-marker-shadow,.leaflet-tile-container,.leaflet-pane>svg,.leaflet-pane>canvas,.leaflet-zoom-box,.leaflet-image-layer,.leaflet-layer{position:absolute;left:0;top:0}.leaflet-container{overflow:hidden}.leaflet-tile,.leaflet-marker-icon,.leaflet-marker-shadow{user-select:none;-webkit-user-drag:none}.leaflet-tile{filter:inherit;visibility:hidden}.leaflet-tile-loaded{visibility:inherit}.leaflet-zoom-box{width:0;height:0;box-sizing:border-box;z-index:800}.leaflet-overlay-pane svg{user-select:none}.leaflet-pane{z-index:400}.leaflet-tile-pane{z-index:200}.leaflet-overlay-pane{z-index:400}.leaflet-shadow-pane{z-index:500}.leaflet-marker-pane{z-index:600}.leaflet-tooltip-pane{z-index:650}.leaflet-popup-pane{z-index:700}.leaflet-map-pane canvas{z-index:100}.leaflet-map-pane svg{z-index:200}.leaflet-control{position:relative;z-index:800;pointer-events:visiblePainted;pointer-events:auto}.leaflet-top,.leaflet-bottom{position:absolute;z-index:1000;pointer-events:none}.leaflet-top{top:0}.leaflet-right{right:0}.leaflet-bottom{bottom:0}.leaflet-left{left:0}.leaflet-control{float:left;clear:both}.leaflet-right .leaflet-control{float:right}.leaflet-top .leaflet-control{margin-top:10px}.leaflet-bottom .leaflet-control{margin-bottom:10px}.leaflet-left .leaflet-control{margin-left:10px}.leaflet-right .leaflet-control{margin-right:10px}.leaflet-control-zoom a{display:block;width:30px;height:30px;line-height:30px;text-align:center;text-decoration:none;background:#fff;color:#111;border-bottom:1px solid #ccc;font-weight:700}.leaflet-control-zoom{border:2px solid rgba(0,0,0,.2);border-radius:6px;overflow:hidden}.leaflet-control-attribution{background:rgba(255,255,255,.75);padding:0 5px;color:#333}.leaflet-control-attribution a{color:#0078a8}.leaflet-popup{position:absolute;text-align:center;margin-bottom:20px}.leaflet-popup-content-wrapper{padding:1px;text-align:left;border-radius:12px}.leaflet-popup-content{margin:13px 18px;line-height:1.4}.leaflet-popup-tip-container{width:40px;height:20px;position:absolute;left:50%;margin-left:-20px;overflow:hidden;pointer-events:none}.leaflet-popup-tip{width:17px;height:17px;padding:1px;margin:-10px auto 0;transform:rotate(45deg)}.leaflet-container a.leaflet-popup-close-button{position:absolute;top:0;right:0;border:0;text-align:center;width:24px;height:24px;font:16px/24px Tahoma,Verdana,sans-serif;color:#757575;text-decoration:none;background:transparent}.leaflet-grab{cursor:grab}.leaflet-dragging .leaflet-grab{cursor:move}.leaflet-touch .leaflet-control-zoom a{width:34px;height:34px;line-height:34px}

/* v5.1 Leitstand-Feinschliff */
.map-wrap{min-width:0}.map-wrap #game-map{display:block;width:100%;height:640px;min-height:640px}.cx-marker.zone-marker{background:#60a5fa;color:#07111f}.role-admin-form{display:grid;gap:10px}.role-edit-row{display:grid;grid-template-columns:1fr 110px 130px;gap:8px;align-items:center}.role-edit-row select{width:100%;border:1px solid var(--line);background:#0d1117;color:var(--text);border-radius:10px;padding:8px}.role-admin-box{border-color:rgba(96,165,250,.35)}
@media(max-width:1050px){.map-wrap #game-map{height:520px;min-height:520px}.cockpit-panel{order:2}.map-wrap{order:1}.cockpit-grid{display:flex;flex-direction:column}}
@media(max-width:620px){body{font-size:15px}.topbar nav{width:100%;justify-content:space-between}.container{padding-left:10px;padding-right:10px}.command-shell{padding:10px;border-radius:18px}.map-wrap #game-map{height:430px;min-height:430px;border-radius:16px}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.role-edit-row{grid-template-columns:1fr}.team-row{align-items:flex-start;flex-direction:column}.btn,button.btn{width:100%}.grid.two{grid-template-columns:1fr}}

/* v6 Erweiterungen */
.lead{font-size:1.15rem;line-height:1.6;color:#cbd5e1}.hero-xl{min-height:470px}.explain-grid .card{position:relative;overflow:hidden}.step{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--brand);color:#06140a;font-weight:900;margin-bottom:12px}.story-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.map-picker-wrap{background:#0d1117;border:1px solid var(--line);border-radius:20px;padding:16px}.map-picker-wrap #create-map{height:440px;min-height:440px;border-radius:16px;border:1px solid var(--line);background:#eef3f7}.coin-select-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.coin-option{display:grid!important;grid-template-columns:auto 1fr;gap:8px!important;align-items:center;background:#0d1117;border:1px solid var(--line);border-radius:14px;padding:12px;color:var(--text)!important}.coin-option input{width:auto!important}.coin-option small{grid-column:2;color:var(--muted)}.compass-card{position:absolute;right:18px;top:18px;z-index:550;background:rgba(13,17,23,.82);border:1px solid rgba(255,255,255,.15);border-radius:18px;padding:10px;text-align:center;backdrop-filter:blur(10px)}.compass-face{width:72px;height:72px;border-radius:50%;border:2px solid var(--line);display:grid;place-items:center;background:radial-gradient(circle,#172033,#0d1117)}.compass-needle{font-size:31px;color:var(--brand);transform-origin:center;transition:transform .18s ease}.team-edit-row{grid-template-columns:80px 1fr 1fr}.form small{font-weight:500}.topbar nav a.btn{color:#06140a}.topbar nav a.btn:hover{color:#06140a}.card.highlight{border-color:rgba(86,211,100,.4);background:linear-gradient(180deg,rgba(86,211,100,.12),rgba(21,27,35,.98));}
@media(max-width:850px){.story-cols{grid-template-columns:1fr}.coin-select-list{grid-template-columns:1fr}.map-picker-wrap #create-map{height:340px;min-height:340px}.compass-card{position:static;margin:10px 0;display:inline-block}.team-edit-row{grid-template-columns:1fr}}

/* v7 home, mobile, tables, location checks */
.hero-photo{display:grid;grid-template-columns:1.08fr .92fr;gap:2rem;align-items:center;padding:3rem 2rem;background:radial-gradient(circle at 15% 15%,rgba(68,255,136,.16),transparent 35%),linear-gradient(135deg,#111a33,#080d19);border-radius:28px;overflow:hidden}
.hero-copy h1{font-size:clamp(2.1rem,5vw,4.8rem);line-height:.95;margin:.2rem 0 1rem}.hero-image-card img{width:100%;display:block;border-radius:28px;box-shadow:0 30px 70px rgba(0,0,0,.35)}
.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:720px}.data-table th,.data-table td{padding:.85rem;border-bottom:1px solid rgba(255,255,255,.08);text-align:left}.data-table th{color:#9fb1d3;text-transform:uppercase;font-size:.75rem;letter-spacing:.08em}.pill{display:inline-flex;border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:.18rem .55rem;font-size:.78rem}.pill.paid{border-color:rgba(68,255,136,.5);color:#44ff88}.pill.warn{border-color:rgba(255,190,80,.6);color:#ffc45f}.small-text{font-size:.9rem}.location-checklist{display:grid;gap:.45rem;margin:.8rem 0}.geo-state{border-radius:12px;padding:.55rem .7rem;background:#0b1020;border:1px solid rgba(255,255,255,.12);font-weight:700}.geo-state.ok{color:#44ff88;border-color:rgba(68,255,136,.35)}.geo-state.warn{color:#ffc45f;border-color:rgba(255,196,95,.35)}.geo-state.bad{color:#ff6b7a;border-color:rgba(255,107,122,.35)}
@media(max-width:860px){.hero-photo{grid-template-columns:1fr;padding:1.25rem;border-radius:20px}.hero-image-card{order:-1}.hero-image-card img{border-radius:20px}.command-shell{margin-left:-.75rem;margin-right:-.75rem;border-radius:0}.cockpit-grid{grid-template-columns:1fr!important}.map-wrap{min-height:72vh;order:-1}.cockpit-panel{order:2}.map-toolbar{position:static;display:grid;grid-template-columns:1fr;gap:.5rem;margin-top:.5rem}.compass-card{top:12px;right:12px}.metric-grid{grid-template-columns:1fr 1fr}.nav{gap:.6rem;font-size:.9rem}.data-table{font-size:.9rem}}
/* v8 refinements */
.data-table .paid{background:rgba(68,255,136,.16);border-color:rgba(68,255,136,.35)}
.data-table .warn{background:rgba(255,200,70,.14);border-color:rgba(255,200,70,.35)}
.btn.danger{background:#ff5f6d;color:#fff}
.compact-form .form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.game-settings-card{margin-bottom:18px}.big-copy{font-size:1.15rem;line-height:1.7}.hero-strong .hero-copy h1{font-size:clamp(2.2rem,5vw,4.6rem);line-height:.95}.hero-image-card{position:relative;overflow:hidden}.hero-stamp{position:absolute;right:18px;bottom:18px;transform:rotate(-8deg);border:4px solid #ff4d6d;color:#fff;background:rgba(255,77,109,.88);font-weight:900;letter-spacing:.12em;border-radius:12px;padding:10px 14px;box-shadow:0 18px 40px rgba(0,0,0,.35)}.intro-card{border-color:rgba(68,255,136,.25)}.location-checklist span{display:inline-block;margin:0 8px 8px 0;padding:7px 10px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.04)}
@media (max-width: 820px){.compact-form .form-grid{grid-template-columns:1fr}.topbar{position:sticky;top:0;z-index:50}.topbar nav{gap:8px;overflow-x:auto;padding-bottom:4px}.topbar nav a{white-space:nowrap}.hero-photo{grid-template-columns:1fr}.cockpit-grid{display:flex;flex-direction:column}.map-wrap{order:-1;min-height:62vh}.map-wrap #game-map,.leaflet-container{min-height:58vh}.cockpit-panel{width:100%}.command-head{align-items:flex-start}.map-toolbar{position:static;display:flex;flex-wrap:wrap;margin-top:8px}.compass-card{right:12px;top:12px}.container{padding-left:12px;padding-right:12px}.data-table{font-size:.86rem}}
/* v9 Feinschliff */
.inline-form{display:inline-flex;gap:.35rem;align-items:center;margin:.15rem .2rem .15rem 0}.btn.tiny{font-size:.78rem;padding:.32rem .55rem;border-radius:10px}.btn.danger{background:#421b27;color:#ffb3c4;border:1px solid #9d3854}.actions-cell{white-space:nowrap}.pill.paid{background:rgba(68,255,136,.14);color:#44ff88;border-color:rgba(68,255,136,.35)}.pill.warn{background:rgba(255,204,77,.14);color:#ffd86b;border-color:rgba(255,204,77,.35)}.small-text{font-size:.9rem}.hero-claim{font-size:clamp(2.2rem,6vw,5.2rem);line-height:.95;letter-spacing:-.06em}.hero-subclaim{font-size:1.15rem;max-width:760px}.geo-state{display:inline-flex;padding:.45rem .7rem;border-radius:999px;border:1px solid var(--line);margin:.2rem .25rem .2rem 0}.geo-state.ok{border-color:rgba(68,255,136,.45);color:#44ff88}.geo-state.warn{border-color:rgba(255,210,80,.45);color:#ffd86b}.geo-state.bad{border-color:rgba(255,100,120,.55);color:#ff8fa3}
/* v10: freundlichere Hero-Optik, Anleitung, Foto-Catch */
.hero-strong{background:linear-gradient(135deg,rgba(255,255,255,.90),rgba(232,255,239,.88)),url('hero-map-blur.svg');background-size:cover;background-position:center;border:1px solid rgba(40,80,60,.14);color:#14251c}.hero-strong h1{color:#102016}.hero-strong .lead{color:#2b4536}.notice-card{border-left:5px solid #44cc77}.steps-list{font-size:1.05rem;line-height:1.75}.steps-list li{margin:.45rem 0}.catch-photo-card input[type=file]{padding:1rem;background:#f6fff8;border:1px dashed #44cc77;border-radius:14px}.catch-report span{display:block;margin:.35rem 0;color:#667}input[readonly]{background:#f1f5f2;color:#405049;border-color:#ccd8d0}.geo-state{display:inline-block;padding:.35rem .55rem;border-radius:999px;background:#eef;margin:.15rem;font-size:.9rem}.geo-state.ok{background:#d9ffe6;color:#0d6b2c}.geo-state.warn{background:#fff5cf;color:#725900}.geo-state.bad{background:#ffe0df;color:#8a1c16}.create-map{min-height:360px;border-radius:18px;overflow:hidden;border:1px solid #dbe6de}.role-edit-row small{display:block;color:#778;font-weight:400}.hero-photo:before{content:'';position:absolute;inset:0;pointer-events:none;backdrop-filter:blur(1px)}
@media(max-width:760px){.hero-strong{padding:1.2rem}.hero-image-card{min-height:220px}.create-map{min-height:300px}.location-checklist{display:flex;flex-wrap:wrap;gap:.25rem}.map-toolbar{display:grid;grid-template-columns:1fr;gap:.5rem}.catch-photo-card input,.catch-photo-card select{font-size:16px}}

/* v11 targeted polish */
.hero-strong{background:linear-gradient(90deg,rgba(255,255,255,.94),rgba(255,255,255,.82) 46%,rgba(255,255,255,.55)),url('hero-terrain-map.svg')!important;background-size:cover!important;background-position:center!important;color:#14251c!important;position:relative;}
.hero-photo:before{display:none!important;content:none!important;backdrop-filter:none!important;}
.hero-strong h1,.hero-strong .lead,.hero-strong p,.hero-strong h2{filter:none!important;text-shadow:none!important;}
.catch-fab{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:1200;background:#ff7b72;color:#1b0605;text-decoration:none;font-weight:900;border-radius:999px;padding:14px 22px;box-shadow:0 18px 45px rgba(0,0,0,.35);border:2px solid rgba(255,255,255,.85)}
.catch-fab:hover{background:#ff938d;color:#1b0605}.catch-photo-card{scroll-margin-top:90px}.btn.danger,.btn.tiny.danger{background:#ff7b72;color:#210606}.btn.tiny{padding:6px 9px;font-size:.8rem}.countdown-line{font-size:1.03rem;color:#cbd5e1}.countdown-line strong{color:#56d364}.cx-marker.caught-marker{background:#111827!important;color:#ff7b72!important;border-color:#ff7b72!important;font-size:24px;line-height:1}.cx-marker.escapee-marker:not(.caught-marker){background:#56d364}.cx-marker.catcher-marker:not(.caught-marker){background:#ff7b72}.game-time-warning{background:#fff4cc;color:#664d03;border:1px solid #ffe08a;border-radius:14px;padding:10px 12px}
@media(max-width:700px){.catch-fab{left:12px;right:12px;bottom:12px;transform:none;width:auto;text-align:center}.hero-strong{background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(255,255,255,.78)),url('hero-terrain-map.svg')!important;background-size:cover!important}.container{padding-bottom:95px}}
.process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:12px 0}.process-grid>div{background:rgba(255,255,255,.72);border:1px solid rgba(20,30,40,.12);border-radius:14px;padding:12px}.metric.warning strong{color:#b45309}.joker-feed{margin-top:10px;border-top:1px solid rgba(0,0,0,.08);padding-top:8px}.joker-feed p{margin:.25rem 0}@media(max-width:780px){.process-grid{grid-template-columns:1fr}.catch-fab{left:14px;right:14px;text-align:center}}
/* v14: Ingame-Meldungen und Spielende */
.ingame-toasts{position:fixed;top:82px;right:16px;z-index:1500;display:grid;gap:10px;max-width:min(380px,calc(100vw - 32px))}.ingame-toast{padding:12px 14px;border-radius:16px;background:#0d1117;color:#eef2ff;border:1px solid rgba(255,255,255,.18);box-shadow:0 18px 50px rgba(0,0,0,.35);font-weight:800}.ingame-toast.catch{border-color:#ff7b72;background:#2a1114}.ingame-toast.joker{border-color:#56d364;background:#0f2416}.ingame-toast.warn{border-color:#ffd166;background:#2c240e}.winner-card{border-color:rgba(86,211,100,.5);background:linear-gradient(135deg,rgba(86,211,100,.18),rgba(21,27,35,.97))}.winner-card h2{color:#8ff09d}
@media(max-width:700px){.ingame-toasts{top:auto;bottom:86px;left:12px;right:12px;max-width:none}.ingame-toast{font-size:.92rem}}

/* v15: Profilbilder, Join-/Invite-Flow, Mobile Offcanvas */
.nav-toggle{display:none;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:var(--text);border-radius:12px;padding:8px 12px;font-size:1.4rem;line-height:1;cursor:pointer}.profile-head{display:grid;grid-template-columns:110px 1fr;gap:18px;align-items:center;margin-bottom:18px}.profile-avatar{width:96px;height:96px;border-radius:50%;object-fit:cover;border:3px solid rgba(86,211,100,.5);background:#0d1117;display:grid;place-items:center;font-size:2rem;font-weight:900}.profile-avatar.placeholder{color:#56d364}.copy-text{width:100%;border-radius:16px;padding:14px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:inherit;font:inherit}.invite-check-list{display:grid;gap:8px;max-height:320px;overflow:auto;padding:8px;border:1px solid rgba(255,255,255,.1);border-radius:14px}.topbar{isolation:isolate}@media(max-width:820px){.nav-toggle{display:inline-flex;align-items:center;justify-content:center;z-index:80}.topbar nav#main-nav{position:fixed;top:0;right:0;bottom:0;width:min(86vw,340px);display:flex;flex-direction:column;align-items:stretch;gap:6px;padding:76px 18px 18px;background:rgba(13,17,23,.98);box-shadow:-20px 0 60px rgba(0,0,0,.38);transform:translateX(105%);transition:transform .22s ease;overflow:auto;z-index:70}.nav-open .topbar nav#main-nav{transform:translateX(0)}.topbar nav#main-nav a{padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.05);white-space:normal}.nav-open:before{content:'';position:fixed;inset:0;background:rgba(0,0,0,.48);z-index:60}.profile-head{grid-template-columns:1fr;text-align:left}.profile-avatar{width:84px;height:84px}}

/* v16 mobile navigation fix */
html, body { max-width:100%; overflow-x:hidden; }
.nav-toggle{display:none}
@media (max-width: 820px){
  .topbar{position:sticky;top:0;z-index:1000;display:flex;align-items:center;justify-content:space-between;gap:12px}
  .nav-toggle{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;border:1px solid rgba(0,0,0,.12);background:#fff;font-size:1.3rem;z-index:1102}
  #main-nav{position:fixed;top:0;right:0;bottom:0;width:min(82vw,340px);max-width:340px;display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:76px 18px 18px;background:#ffffff;box-shadow:-18px 0 40px rgba(0,0,0,.2);transform:translateX(105%);transition:transform .22s ease;z-index:1101;overflow-y:auto;visibility:hidden;}
  #main-nav a{display:block;width:100%;padding:12px 14px;border-radius:12px;background:#f5f7f8;color:#111;text-align:left}
  body.nav-open #main-nav{transform:translateX(0);visibility:visible;}
  body.nav-open:before{content:"";position:fixed;inset:0;background:rgba(20,30,35,.38);z-index:1100;}
  body.nav-open{overflow:hidden;}
}

/* v16 home variant 2 */
.hero-saas{position:relative;overflow:hidden;border-radius:30px;padding:clamp(28px,5vw,64px);display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:32px;background:linear-gradient(135deg,#f7fbff,#eef7ef);box-shadow:0 18px 50px rgba(31,58,65,.12);}
.hero-saas-bg{position:absolute;inset:0;background:radial-gradient(circle at 15% 20%,rgba(60,180,130,.18),transparent 28%),radial-gradient(circle at 84% 18%,rgba(70,130,220,.16),transparent 32%),linear-gradient(135deg,rgba(255,255,255,.7),rgba(255,255,255,.25));}
.hero-saas-bg:after{content:"";position:absolute;inset:-20px;background:url('hero-terrain-map.svg') center/cover no-repeat;opacity:.18;filter:saturate(.8);}
.hero-saas-copy,.hero-saas-panel{position:relative;z-index:1}.hero-saas h1{font-size:clamp(2.2rem,5vw,4.8rem);line-height:.98;margin:.2em 0;color:#17332b}.hero-saas .lead{color:#36514a;max-width:760px}.hero-saas-panel{align-self:center;background:rgba(255,255,255,.88);border:1px solid rgba(30,80,70,.12);border-radius:26px;padding:18px;box-shadow:0 20px 50px rgba(35,70,90,.14)}.dash-preview-map{height:230px;border-radius:22px;background:linear-gradient(135deg,#d6ecdc,#edf4f7);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:18px}.dash-preview-map:before{content:"";position:absolute;inset:0;background:url('hero-terrain-map.svg') center/cover no-repeat;opacity:.45}.dash-preview-map>*{position:relative}.dash-preview-map i{position:absolute;width:130px;height:130px;border:2px dashed #22a06b;border-radius:50%;left:50%;top:48%;transform:translate(-50%,-50%)}.dash-preview-row{display:grid;grid-template-columns:auto 1fr auto 1fr;gap:8px;margin-top:12px;align-items:center}.dash-preview-row b{font-size:1.35rem;color:#153d33}.light-cards .card{background:#fff}.saas-section{background:#fff}
@media (max-width:820px){.hero-saas{grid-template-columns:1fr;padding:26px;border-radius:22px}.hero-saas-panel{order:-1}.dash-preview-map{height:180px}}
.coin-summary .stat small{display:block;margin-top:6px;color:#667;font-size:.78rem;font-weight:400}.filter-bar{display:flex;gap:8px;flex-wrap:wrap}.pill.available{background:#e7fff0}.pill.reserved{background:#fff4d8}.pill.used{background:#e9e9ee}.pill.cancelled,.pill.refunded{background:#ffe1e1}

/* v17: sauberes mobiles Offcanvas und kompakter mobiler Leitstand */
.nav-backdrop{display:none}
.lang-switch{display:inline-flex;gap:4px;align-items:center;padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.06);font-size:.88rem}.lang-switch a{text-decoration:none;color:inherit;font-weight:800}
@media(max-width:820px){
  html,body{max-width:100%;overflow-x:hidden}.topbar{z-index:3000;position:sticky;top:0}.nav-toggle{display:inline-flex!important;align-items:center;justify-content:center;position:relative;z-index:3200;color:#102018!important;background:#fff!important}
  .topbar nav#main-nav{position:fixed!important;top:0!important;right:0!important;bottom:0!important;width:min(84vw,340px)!important;height:100dvh!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:8px!important;padding:82px 18px 22px!important;background:#101820!important;border-left:1px solid rgba(255,255,255,.12)!important;box-shadow:-20px 0 50px rgba(0,0,0,.34)!important;transform:translateX(105%)!important;visibility:hidden!important;pointer-events:none!important;transition:transform .22s ease,visibility .22s ease!important;z-index:3150!important;overflow-y:auto!important;overflow-x:hidden!important}
  body.nav-open .topbar nav#main-nav{transform:translateX(0)!important;visibility:visible!important;pointer-events:auto!important}
  .topbar nav#main-nav a,.topbar nav#main-nav .lang-switch{display:block;width:100%;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.07);color:#eef2ff!important;white-space:normal;text-decoration:none}.topbar nav#main-nav a.btn{color:#06140a!important}.topbar nav#main-nav .lang-switch{display:flex;justify-content:center;color:#eef2ff!important}
  .nav-backdrop{display:block;position:fixed;inset:0;background:rgba(0,0,0,.45);opacity:0;pointer-events:none;transition:opacity .22s ease;z-index:3100}body.nav-open .nav-backdrop{opacity:1;pointer-events:auto}body.nav-open{overflow:hidden!important;touch-action:none}body.nav-open:before{display:none!important;content:none!important}
  .command-shell{margin-left:-12px;margin-right:-12px;border-radius:0;padding:10px}.command-head{gap:8px}.command-head .muted{font-size:.86rem}.cockpit-grid{display:flex!important;flex-direction:column!important}.map-wrap{order:1;min-height:58vh!important}.map-wrap #game-map{min-height:58vh!important;border-radius:16px}.cockpit-panel{order:2}.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.metric{padding:10px;border-radius:14px}.metric strong{font-size:1.1rem}.metric span{font-size:.7rem}.map-toolbar{position:absolute!important;left:8px!important;right:auto!important;bottom:10px!important;display:flex!important;gap:6px!important;padding:6px!important;border-radius:999px;background:rgba(13,17,23,.78);backdrop-filter:none}.map-toolbar .btn{min-width:42px;flex:0 0 auto!important;padding:8px 10px;border-radius:999px;font-weight:900}.compass-card{position:absolute!important;right:10px!important;top:10px!important;margin:0!important;padding:7px;border-radius:14px}.compass-face{width:48px;height:48px}.compass-needle{font-size:24px}.status-box{padding:12px;border-radius:14px}.team-list{max-height:180px}
}

/* v17: echte helle SaaS-Startseitenvariante */
body.home-variant-saas_light{--bg:#f6faf8;--panel:#fff;--panel2:#eef6f2;--text:#14312a;--muted:#59706a;--line:rgba(30,80,70,.16);--brand:#1f9d68;--brand2:#157f54;background:radial-gradient(circle at 12% 10%,rgba(96,205,150,.25),transparent 26%),radial-gradient(circle at 90% 4%,rgba(80,150,220,.18),transparent 30%),linear-gradient(180deg,#f8fcfb,#eef7f2);color:var(--text)}
body.home-variant-saas_light .topbar{background:rgba(255,255,255,.92);border-bottom:1px solid rgba(30,80,70,.13);backdrop-filter:none}body.home-variant-saas_light .brand{color:#157f54}body.home-variant-saas_light .topbar nav a{color:#36514a}body.home-variant-saas_light .card,body.home-variant-saas_light .mini-card{background:#fff;color:#14312a;border-color:rgba(30,80,70,.14);box-shadow:0 14px 34px rgba(31,58,65,.08)}body.home-variant-saas_light .hero,body.home-variant-saas_light .hero-saas{background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(234,248,239,.94)),url('hero-terrain-map.svg') center/cover no-repeat;color:#14312a;border-color:rgba(30,80,70,.12)}body.home-variant-saas_light .lead,body.home-variant-saas_light .muted,body.home-variant-saas_light p{color:#45625b}body.home-variant-saas_light h1,body.home-variant-saas_light h2,body.home-variant-saas_light h3{color:#14312a}body.home-variant-saas_light input,body.home-variant-saas_light select,body.home-variant-saas_light textarea{background:#fff;color:#14312a;border-color:rgba(30,80,70,.2)}body.home-variant-saas_light .btn.secondary{background:#fff;color:#14312a;border:1px solid rgba(30,80,70,.18)}

/* v18: finale mobile Offcanvas-Navigation nach funktionierendem User-Fix */
html, body { max-width: 100%; overflow-x: hidden; }
.nav-toggle { display: none; }
@media (max-width: 820px) {
  .topbar { position: sticky; top: 0; z-index: 1000; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-direction: row; }
  .nav-toggle { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 12px; border: 1px solid rgba(0,0,0,.12); background: #fff; color:#111; font-size: 1.3rem; z-index: 1102; }
  #main-nav { position: fixed; top: 0; right: 0; bottom: 0; width: min(82vw, 340px); max-width: 340px; height: 100dvh; display: flex; flex-direction: column; align-items: stretch; gap: 8px; padding: 76px 18px 18px; background: #ffffff; box-shadow: -18px 0 40px rgba(0,0,0,.2); transform: translateX(105%); transition: transform .22s ease; z-index: 1101; overflow-y: auto; visibility: hidden; pointer-events:none; }
  #main-nav a, #main-nav .lang-switch { display: block; width: 100%; padding: 12px 14px; border-radius: 12px; background: #f5f7f8; color: #111; text-align: left; text-decoration:none; }
  #main-nav a.btn { color:#06140a; }
  body.nav-open #main-nav { transform: translateX(0); visibility: visible; pointer-events:auto; }
  body.nav-open:before { content:""; position: fixed; inset: 0; background: rgba(20,30,35,.38); z-index:1099; }
  body.nav-open { overflow: hidden; }
  .nav-backdrop { display:none!important; }
}
.notice.warn{background:#fff4cc;color:#cdb56f;border-color:#ffe08a}.notice.error{background:#ffe0df;color:#8a1c16;border-color:#ffb3ad}.notice.info{background:rgba(86,211,100,.14)}
.pwa-help{font-size:.92rem;line-height:1.55}.camera-hint{font-size:.9rem;color:var(--muted);margin-top:.35rem}


/* v19: Offcanvas ohne transform/visibility, damit mobile Browser nicht hängen bleiben */
@media (max-width: 820px) {
  .topbar { position: sticky; top: 0; z-index: 5000; display:flex; flex-direction:row!important; align-items:center!important; justify-content:space-between; }
  .nav-toggle { display:inline-flex!important; align-items:center; justify-content:center; width:44px; height:44px; border-radius:12px; border:1px solid rgba(0,0,0,.15); background:#fff; color:#111!important; font-size:1.45rem; position:relative; z-index:5010; }
  #main-nav { display:none!important; position:fixed!important; left:12px!important; right:12px!important; top:68px!important; bottom:auto!important; width:auto!important; max-width:none!important; height:auto!important; max-height:calc(100dvh - 88px); overflow:auto; flex-direction:column!important; align-items:stretch!important; gap:8px!important; padding:12px!important; border-radius:18px; background:#101820!important; border:1px solid rgba(255,255,255,.14); box-shadow:0 22px 55px rgba(0,0,0,.42); transform:none!important; visibility:visible!important; pointer-events:auto!important; z-index:5005!important; }
  body.nav-open #main-nav { display:flex!important; }
  #main-nav a, #main-nav .lang-switch { display:block!important; width:100%!important; padding:13px 14px!important; border-radius:14px!important; background:rgba(255,255,255,.08)!important; color:#eef2ff!important; text-decoration:none!important; text-align:left!important; }
  #main-nav a.btn { color:#06140a!important; background:var(--brand)!important; }
  .lang-switch { display:flex!important; justify-content:center!important; gap:10px!important; }
  .nav-backdrop { display:none!important; }
  body.nav-open:before { content:""; position:fixed; inset:0; background:rgba(0,0,0,.42); z-index:5001; }
  body.nav-open { overflow:hidden!important; }
}

/* v20 productive polish */
.site-footer{display:flex;justify-content:space-between;gap:16px;align-items:center;max-width:1120px;margin:20px auto 0;padding:24px 16px 34px;border-top:1px solid var(--line);color:var(--muted)}
.site-footer nav{display:flex;gap:12px;flex-wrap:wrap}.site-footer a{text-decoration:none;color:var(--muted)}.site-footer a:hover{color:var(--text)}
.notice.error{background:rgba(255,123,114,.16);border-color:rgba(255,123,114,.45)}.notice.warn{background:rgba(255,209,102,.16);border-color:rgba(255,209,102,.45)}
.legal{line-height:1.7}.legal a{color:var(--brand);font-weight:700}
.coin-compact-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:16px 0}.coin-compact-grid .mini-card{padding:14px;border-radius:16px}.coin-compact-grid .stat strong{font-size:1.7rem}.coin-compact-grid .stat span{display:block;color:var(--muted);font-size:.86rem}
.buy-card{border-color:rgba(86,211,100,.35)}.buy-form{grid-template-columns:1fr auto auto auto;align-items:end}.price-preview{min-width:130px;border:1px solid var(--line);border-radius:16px;padding:10px 12px;background:rgba(255,255,255,.05)}.price-preview span{display:block;color:var(--muted);font-size:.78rem;font-weight:800;text-transform:uppercase}.price-preview strong{font-size:1.35rem;color:var(--brand)}.price-preview.total{background:rgba(86,211,100,.12);border-color:rgba(86,211,100,.35)}
.pill.pending{background:#fff4d8;color:#725900}.pill.paid,.pill.available{background:#dcffe8;color:#0d6b2c}.pill.used{background:#e9e9ee;color:#444}.pill.reserved{background:#fff4d8;color:#725900}
body.home-variant-saas_light .site-footer{border-top-color:rgba(30,80,70,.16)}body.home-variant-saas_light .price-preview{background:#fff;color:#14312a}
@media(max-width:900px){.coin-compact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.buy-form{grid-template-columns:1fr}.site-footer{flex-direction:column;align-items:flex-start}.site-footer nav{flex-direction:column}}
@media(max-width:520px){.coin-compact-grid{grid-template-columns:1fr}}

/* v21 Bildmodal + Onboarding-Hinweise */
.cx-image-modal{position:fixed;inset:0;z-index:3000;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(0,0,0,.72)}
.cx-image-modal.open{display:flex}.cx-image-modal-inner{position:relative;max-width:min(980px,96vw);max-height:92vh;background:#0d1117;border:1px solid rgba(255,255,255,.18);border-radius:20px;padding:12px;box-shadow:0 28px 90px rgba(0,0,0,.45)}
.cx-image-modal img{display:block;max-width:100%;max-height:82vh;border-radius:14px}.cx-image-modal-close{position:absolute;top:-14px;right:-14px;width:38px;height:38px;border-radius:50%;border:0;background:#fff;color:#111;font-size:24px;font-weight:900;cursor:pointer}
.flow-recommendations{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0}.flow-recommendations .mini-card{margin:0}
@media(max-width:760px){.flow-recommendations{grid-template-columns:1fr}.cx-image-modal-inner{padding:8px}.cx-image-modal-close{right:4px;top:4px}}

/* v23: Blickrichtung statt unruhigem Kompass, Catch-Loeschung */
.heading-hint{position:absolute;right:12px;top:12px;z-index:550;max-width:220px;background:rgba(13,17,23,.82);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:8px 10px;color:#eef2ff;font-size:.82rem;font-weight:700;box-shadow:0 12px 32px rgba(0,0,0,.24)}
.catch-report .actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.catch-report form{margin:0}.btn.danger{background:#ff7b72;color:#210606}.btn.danger:hover{background:#ff938d}.leaflet-overlay-pane svg path[stroke="#ff263f"]{filter:drop-shadow(0 0 3px rgba(255,38,63,.7))}
@media(max-width:760px){.heading-hint{left:10px;right:10px;top:10px;max-width:none;text-align:center;font-size:.78rem}.catch-report .actions .btn{width:auto;flex:1 1 130px}}

/* v24 FIX: Nur das Hero-Video ist Fullscreen, restlicher Seiteninhalt bleibt normal zentriert */
body.home-variant-video_hero .topbar {
  background: rgba(10,15,20,.78);
}

/* Container nicht global auf 100% ziehen */
body.home-variant-video_hero .container {
  width: min(1120px, 100%);
  max-width: 1120px;
  margin: 0 auto;
  padding: 32px 16px 70px;
}

/* Nur der Video-Hero bricht aus dem Container aus */
.video-hero {
  position: relative;
  width: 100vw;
  min-height: calc(100vh - 70px);
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-top: -32px;
  margin-bottom: 48px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 0;
  color: #fff;
  background: #071019;
}

.video-hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(1.05);
  transform: scale(1.02);
}

/* Blur nur auf das Video, nicht auf Text oder Inhalte */
.video-hero-blur .video-hero-bg {
  filter: blur(7px) saturate(1.08);
  transform: scale(1.06);
}

.video-hero-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4,10,14,.78), rgba(4,10,14,.7) 48%, rgba(4,10,14,.7)),
    radial-gradient(circle at 18% 30%, rgba(86,211,100,.22), transparent 30%);
}

.video-hero-content {
  position: relative;
  z-index: 2;
  width: min(1120px, 100%);
  margin: 0 auto;
  padding: clamp(32px,8vw,96px) 18px;
  text-align: left;
}

.video-hero h1 {
  max-width: 940px;
  color: #fff;
  text-shadow: 0 18px 60px rgba(0,0,0,.55);
}

.video-hero .lead {
  max-width: 780px;
  color: #e5f5ef;
  text-shadow: 0 10px 35px rgba(0,0,0,.55);
}

/* Falls im Template video-after genutzt wird, ebenfalls normal zentrieren */
.video-after {
  width: min(1120px, 100%);
  margin: 0 auto;
  padding: 0 16px;
}

.video-after .card {
  margin: 18px 0;
}

/* Joker unverändert */
.joker-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.joker-card .btn {
  margin: .15rem 0;
}

.joker-feed p {
  border-left: 3px solid rgba(86,211,100,.45);
  padding-left: 8px;
}

@media(max-width:820px) {
  body.home-variant-video_hero .container {
    width: min(1120px, 100%);
    max-width: 1120px;
    padding: 20px 12px 95px;
  }

  .video-hero {
    min-height: 82vh;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-top: -20px;
    margin-bottom: 28px;
  }

  .video-hero-content {
    padding: 88px 18px 40px;
  }

  .video-hero .actions .btn {
    width: 100%;
  }

  .joker-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
}


/* v25: sichtbarer Einladungs-/Beitritts-Hinweis */
.join-reminder{display:flex;justify-content:space-between;gap:14px;align-items:center;margin:0 0 18px;padding:14px 16px;border-radius:18px;border:1px solid var(--line);box-shadow:0 14px 34px rgba(0,0,0,.18)}
.join-reminder.missing{background:rgba(255,123,114,.16);border-color:rgba(255,123,114,.45)}
.join-reminder.ready{background:rgba(86,211,100,.16);border-color:rgba(86,211,100,.45)}
.join-reminder strong{font-size:1.05rem}.join-reminder span{color:var(--muted)}.join-reminder-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:700px){.join-reminder{flex-direction:column;align-items:stretch}.join-reminder-actions{justify-content:stretch}.join-reminder-actions .btn{width:100%}}


.location-status-top {
  position: sticky;
  top: 72px;
  z-index: 900;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  margin: 0 0 14px;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 18px;
  background: rgba(13,17,23,.94);
  box-shadow: 0 14px 40px rgba(0,0,0,.25);
}

.location-status-top strong {
  display: block;
  color: var(--brand);
}

.location-status-top span {
  font-size: .9rem;
}

.location-status-items {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

.location-status-items span,
#geoMainStatus {
  display: inline-flex;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: var(--muted);
}

.location-status-items span.ok,
#geoMainStatus.ok {
  background: rgba(86,211,100,.16);
  color: #7cff91;
}

.location-status-items span.warn,
#geoMainStatus.warn {
  background: rgba(255,209,102,.18);
  color: #ffd166;
}

.location-status-items span.bad,
#geoMainStatus.bad {
  background: rgba(255,123,114,.18);
  color: #ff9b94;
}

@media(max-width: 760px) {
  .location-status-top {
    top: 62px;
    grid-template-columns: 1fr;
    border-radius: 0;
    margin-left: -12px;
    margin-right: -12px;
  }

  .location-status-top .btn {
    width: 100%;
  }
}

.join-alert {
  position: sticky;
  top: 72px;
  z-index: 850;
  padding: 13px 15px;
  border-radius: 16px;
  margin: 12px 0 18px;
  font-weight: 800;
  box-shadow: 0 14px 36px rgba(0,0,0,.18);
}

.join-alert.ok {
  background: #dcffe8;
  color: #0d6b2c;
  border: 1px solid #8df2aa;
}

.join-alert.warn {
  background: #fff4cc;
  color: #664d03;
  border: 1px solid #ffe08a;
}

.join-alert.error {
  background: #ffe0df;
  color: #8a1c16;
  border: 1px solid #ffb3ad;
}

@media(max-width: 760px) {
  .join-alert {
    top: 62px;
    border-radius: 0;
    margin-left: -12px;
    margin-right: -12px;
  }
}

.join-check-card,
.join-game-card {
  margin-bottom: 22px;
}

.join-alert {
  padding: 14px 16px;
  border-radius: 16px;
  margin: 14px 0;
  font-weight: 800;
}

.join-alert.ok {
  background: #dcffe8;
  color: #0d6b2c;
  border: 1px solid #8df2aa;
}

.join-alert.warn {
  background: #fff4cc;
  color: #664d03;
  border: 1px solid #ffe08a;
}

.join-alert.error {
  background: #ffe0df;
  color: #8a1c16;
  border: 1px solid #ffb3ad;
}

.location-status-top {
  position: sticky;
  top: 72px;
  z-index: 900;
  margin: 0 0 14px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 18px;
  background: rgba(13,17,23,.94);
  box-shadow: 0 14px 40px rgba(0,0,0,.25);
  overflow: hidden;
}

.location-status-top summary {
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
}

.location-status-top summary strong {
  color: var(--brand);
}

.location-status-body {
  padding: 0 14px 14px;
}

.location-status-items {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 10px;
}

.location-status-items span,
#geoMainStatus {
  display: inline-flex;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: var(--muted);
  font-size: .9rem;
}

.location-status-items span.ok,
#geoMainStatus.ok {
  background: rgba(86,211,100,.16);
  color: #7cff91;
}

.location-status-items span.warn,
#geoMainStatus.warn {
  background: rgba(255,209,102,.18);
  color: #ffd166;
}

.location-status-items span.bad,
#geoMainStatus.bad {
  background: rgba(255,123,114,.18);
  color: #ff9b94;
}

@media(max-width:760px) {
  .location-status-top {
    top: 62px;
    border-radius: 0;
    margin-left: -12px;
    margin-right: -12px;
  }

  .location-status-top summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .location-status-top .btn {
    width: 100%;
  }
}

.location-summary-main {
  display: grid;
  gap: 4px;
}

.location-toggle-icon {
  margin-left: auto;
  font-size: 1.4rem;
  line-height: 1;
  transition: transform .2s ease;
  color: var(--brand);
}

.location-status-top[open] .location-toggle-icon {
  transform: rotate(180deg);
}

.guide-subnav {
  position: sticky;
  top: 72px;
  z-index: 600;
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 10px;
  margin: 0 0 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(13,17,23,.94);
}

.guide-subnav a {
  flex: 0 0 auto;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: var(--text);
  text-decoration: none;
  font-weight: 800;
  font-size: .9rem;
}

.guide-subnav a:hover {
  background: var(--brand);
  color: #06140a;
}

@media(max-width:760px) {
  .guide-subnav {
    top: 62px;
    margin-left: -12px;
    margin-right: -12px;
    border-radius: 0;
  }
}


.cx-modal {
  position: fixed;
  inset: 0;
  z-index: 6000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 18px;
  background: rgba(0,0,0,.62);
}

.cx-modal.open {
  display: flex;
}

.cx-modal-box {
  width: min(760px, 100%);
  max-height: 90vh;
  overflow: auto;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 30px 90px rgba(0,0,0,.45);
  position: relative;
}

.cx-modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 0;
  background: #fff;
  color: #111;
  font-size: 24px;
  font-weight: 900;
  cursor: pointer;
}

.wizard-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
  margin-top: 18px;
}

.wizard-option {
  display: grid;
  gap: 6px;
  text-decoration: none;
  color: inherit;
}

.wizard-option strong {
  color: var(--brand);
  font-size: 1.05rem;
}

.wizard-option span {
  color: var(--muted);
}

@media(max-width:700px) {
  .cx-modal {
    align-items: flex-end;
    padding: 0;
  }

  .cx-modal-box {
    width: 100%;
    border-radius: 24px 24px 0 0;
    padding: 22px 16px;
  }

  .wizard-grid {
    grid-template-columns: 1fr;
  }
}

@media(max-width:760px){
  .command-head h2,
  .game-title,
  .command-shell h1 {
    font-size: clamp(2rem, 10vw, 2.7rem);
    line-height: 1.05;
    margin-bottom: 10px;
  }

  .location-status-top {
    margin-top: 8px;
  }

  .location-status-top summary {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
  }

  .location-summary-main {
    min-width: 0;
  }

  .location-toggle-icon {
    grid-column: 2;
    grid-row: 1;
    font-size: 1.1rem;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
  }

  #geoMainStatus {
    margin-top: 4px;
    font-size: .82rem;
  }
}

.ingame-feed-card {
  margin: 10px 0 14px;
}

.ingame-message-list {
  display: grid;
  gap: 8px;
  max-height: 180px;
  overflow: auto;
}

.ingame-message {
  padding: 9px 11px;
  border-radius: 12px;
  background: rgba(255,255,255,.07);
  border-left: 4px solid var(--brand);
  font-size: .92rem;
}

.ingame-message.catch {
  border-left-color: #ff7b72;
}

.ingame-message.joker {
  border-left-color: #ffd166;
}


.ingame-toast {
  position: fixed;
  left: 50%;
  top: 86px;
  transform: translateX(-50%);
  z-index: 7000;
  width: min(520px, calc(100vw - 24px));
  padding: 14px 16px;
  border-radius: 18px;
  background: #101820;
  color: #fff;
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 22px 70px rgba(0,0,0,.42);
  font-weight: 900;
  text-align: center;
}

.ingame-toast.joker {
  border-color: #ffd166;
}

.ingame-toast.catch {
  border-color: #ff7b72;
}

@media(max-width:760px){
  .ingame-toast {
    top: 76px;
  }
}


/* Cleaner mobile-first game cockpit */
.game-hero{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:14px}.game-hero h1{font-size:clamp(2rem,7vw,3.8rem);line-height:1.02;margin:.1em 0}.game-meta{max-width:980px}.game-live-shell{display:grid;gap:14px}.live-sticky-bar{position:sticky;top:72px;z-index:750;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:10px;border:1px solid var(--line);border-radius:18px;background:rgba(13,17,23,.94);box-shadow:0 16px 42px rgba(0,0,0,.22)}.live-chip{display:grid;gap:2px;padding:8px 10px;border-radius:14px;background:rgba(255,255,255,.06)}.live-chip span{font-size:.74rem;color:var(--muted);font-weight:800;text-transform:uppercase}.live-chip strong{font-size:1rem}.live-chip.warning strong{color:#ffd166}.game-map-stage{padding:14px}.game-map-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px}.game-map-head h2{margin:.1em 0}.live-map-wrap{margin:0}.quick-actions-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.action-card h2,.joker-card h2,.live-message-card h2{margin-top:0}.action-row{display:flex;flex-wrap:wrap;gap:8px}.location-checklist.compact{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.near-map{border-color:rgba(255,209,102,.35)}.message-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.ingame-message-list{display:grid;gap:8px;max-height:220px;overflow:auto}.admin-test-card summary,.game-detail-accordion details summary{cursor:pointer;padding:6px 0}.game-detail-accordion{display:grid;gap:12px}.detail-metrics{margin:10px 0 14px}.catch-photo-card{border-color:rgba(255,123,114,.4)}
@media(max-width:820px){.game-hero{display:grid;grid-template-columns:1fr auto;align-items:center}.game-hero h1{font-size:clamp(2rem,10vw,2.75rem)}.live-sticky-bar{top:62px;grid-template-columns:repeat(2,minmax(0,1fr));margin-left:-12px;margin-right:-12px;border-radius:0}.game-map-stage{margin-left:-12px;margin-right:-12px;border-radius:0;padding:10px}.game-map-head{display:grid}.quick-actions-grid{grid-template-columns:1fr}.message-head{display:grid}.action-row .btn,.joker-actions .btn{width:100%}.live-chip{padding:7px 9px}.location-status-top summary{grid-template-columns:1fr auto!important;flex-direction:row!important;align-items:center!important}.location-toggle-icon{width:28px;height:28px;display:grid;place-items:center;border-radius:999px;background:rgba(255,255,255,.08);font-size:1.05rem}.location-summary-main{display:grid;gap:3px}.location-summary-main strong{font-size:.95rem}#geoMainStatus{font-size:.8rem}.team-list{max-height:260px;overflow:auto}}

/* CatcherX Live-/Ingame-Patch: optional unten in public/assets/style.css ergänzen */
.game-page-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin:8px 0 14px}.game-title{font-size:clamp(2rem,6vw,3.2rem);line-height:1.05;margin:.1em 0}.map-column{min-width:0;display:grid;gap:12px}.joker-card.near-map,.ingame-feed-card.near-map{margin:0;border-color:rgba(255,209,102,.28)}.feed-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.ingame-message-list{display:grid;gap:8px;max-height:210px;overflow:auto}.ingame-message{padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.07);border-left:4px solid var(--brand);font-size:.92rem}.ingame-message.joker{border-left-color:#ffd166}.ingame-message.catch{border-left-color:#ff7b72}.ingame-message.release{border-left-color:#74c0fc}.ingame-message.warn{border-left-color:#ffb86b}.ingame-toast{font-weight:900}.ingame-toast.release{border-color:#74c0fc}.location-summary-main{display:grid;gap:4px}.location-toggle-icon{margin-left:auto;font-size:1.25rem;line-height:1;transition:transform .2s ease;color:var(--brand)}.location-status-top[open] .location-toggle-icon{transform:rotate(180deg)}
@media(max-width:760px){.game-page-head{display:block}.game-title{font-size:clamp(2rem,10vw,2.65rem)}.compact-head h2{font-size:1.35rem}.location-status-top summary{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px}.location-toggle-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:999px;background:rgba(255,255,255,.08)}.joker-actions{display:grid;grid-template-columns:1fr;gap:8px}.feed-head{align-items:flex-start}.feed-head .btn{white-space:nowrap}}
/* =========================================================
   CatcherX Live-Leitstand Cleanup
   - kompakter mobiler Kopf
   - Ping im Demo-Spiel ausgeblendet
   - Ingame-Nachrichten nur aktuelle Meldung als Overlay
   - Karte/Joker/Status für Outdoor-Nutzung priorisiert
   ========================================================= */

.game-hero-live {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: end;
  margin: 6px 0 14px;
  padding: clamp(14px, 3vw, 24px);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 24px;
  background: radial-gradient(circle at 8% 0%, rgba(86,211,100,.12), transparent 34%), rgba(13,17,23,.66);
}

.game-hero-live h1 {
  margin: 0 0 10px;
  font-size: clamp(2.1rem, 6vw, 4.2rem);
  line-height: .98;
  letter-spacing: -.055em;
}

.game-meta-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  color: var(--muted);
}

.game-meta-pills span {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  padding: 6px 10px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 999px;
  background: rgba(255,255,255,.045);
  font-size: .92rem;
}

.game-meta-pills strong { color: var(--text); }

.live-sticky-compact {
  position: sticky;
  top: 74px;
  z-index: 850;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 8px 0 12px;
  padding: 8px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 20px;
  background: rgba(13,17,23,.94);
  box-shadow: 0 14px 45px rgba(0,0,0,.24);
  backdrop-filter: blur(12px);
}

.live-chip {
  min-width: 0;
  padding: 9px 10px;
  border-radius: 15px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.08);
}

.live-chip span {
  display: block;
  color: var(--muted);
  font-size: .72rem;
  line-height: 1.1;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.live-chip strong {
  display: block;
  margin-top: 4px;
  color: var(--brand);
  font-size: clamp(1rem, 4vw, 1.35rem);
  line-height: 1.05;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.live-chip.warning strong { color: #ffd166; }

.location-status-top { margin: 10px 0 14px; }

.location-status-top summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px;
  gap: 10px;
  align-items: center;
  min-height: 58px;
}

.location-summary-main {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.location-toggle-icon {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: var(--brand);
  font-size: 1.05rem;
  line-height: 1;
  transition: transform .18s ease;
}

.location-status-top[open] .location-toggle-icon { transform: rotate(180deg); }
.location-status-top.ok { border-color: rgba(86,211,100,.45); }
.location-status-top.warn { border-color: rgba(255,209,102,.55); }
.location-status-top.bad { border-color: rgba(255,123,114,.7); }

.game-live-shell { display: grid; gap: 14px; }

.live-priority-card {
  padding: clamp(14px, 3vw, 22px);
  margin-top: 12px;
}

.game-map-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-end;
  margin-bottom: 12px;
}

.game-map-head h2 {
  margin-bottom: 0;
  font-size: clamp(1.7rem, 4vw, 2.8rem);
}

.live-map-wrap { min-height: min(68vh, 680px); }

.live-map-wrap #game-map {
  height: min(68vh, 680px);
  min-height: 520px;
}

.heading-hint {
  position: absolute;
  left: 16px;
  top: 16px;
  z-index: 500;
  max-width: min(440px, calc(100% - 32px));
  padding: 8px 11px;
  border-radius: 14px;
  background: rgba(13,17,23,.76);
  color: rgba(255,255,255,.88);
  font-size: .88rem;
  font-weight: 700;
  backdrop-filter: blur(10px);
}

.quick-actions-grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 14px;
  align-items: stretch;
}

.action-card,
.joker-card.near-map { margin: 0; }

.action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.joker-actions {
  display: grid;
  gap: 10px;
}

.live-message-card { margin-top: 0; }

.message-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
}

.ingame-message-list {
  display: grid;
  gap: 8px;
  max-height: 220px;
  overflow: auto;
  padding-right: 4px;
}

.ingame-message {
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.065);
  border-left: 4px solid var(--brand);
  font-size: .94rem;
}

.ingame-message.catch { border-left-color: #ff7b72; }
.ingame-message.joker,
.ingame-message.test { border-left-color: #ffd166; }
.ingame-message.warn { border-left-color: #ffb86b; }

.joker-feed {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,.08);
}

.admin-test-card summary,
.game-detail-accordion details summary { cursor: pointer; }

.game-detail-accordion {
  display: grid;
  gap: 10px;
}

.game-detail-accordion > details.card { margin: 0; }
.detail-metrics { margin: 12px 0; }

.ingame-toasts {
  position: fixed;
  top: 88px;
  left: 50%;
  right: auto;
  bottom: auto;
  transform: translateX(-50%);
  width: min(540px, calc(100vw - 24px));
  z-index: 7000;
  display: grid;
  gap: 8px;
  pointer-events: none;
}

.ingame-toast {
  width: 100%;
  padding: 13px 15px;
  border-radius: 18px;
  background: rgba(13,17,23,.96);
  color: var(--text);
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 22px 70px rgba(0,0,0,.42);
  font-weight: 900;
}

.ingame-toasts .ingame-toast:nth-child(n+2) { display: none; }

@media (max-width: 760px) {
  .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .game-hero-live {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 10px;
    padding: 16px 0 10px;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    background: transparent;
  }

  .game-hero-live .eyebrow { margin-bottom: 6px; }

  .game-hero-live h1 {
    font-size: clamp(2rem, 1rem, 3.15rem);
    line-height: 1;
    margin-bottom: 10px;
  }

  .game-meta-pills { gap: 6px; }

  .game-meta-pills span {
    font-size: .82rem;
    padding: 5px 8px;
  }

  .game-hero-live .role-badge {
    justify-self: start;
    padding: 8px 14px;
    font-size: .9rem;
  }

  .live-sticky-compact {
    top: 72px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    margin-left: -8px;
    margin-right: -8px;
    border-radius: 0;
    padding: 7px 8px;
  }

  .live-chip {
    padding: 8px 8px;
    border-radius: 13px;
  }

  .live-chip span { font-size: .66rem; }
  .live-chip strong { font-size: 1.05rem; }

  .location-status-top {
    margin-left: -12px;
    margin-right: -12px;
    border-radius: 0;
  }

  .location-status-top summary {
    min-height: 52px;
    padding: 10px 12px;
  }

  #geoMainStatus { font-size: .86rem; }

  .live-priority-card {
    padding: 12px;
    margin-left: -2px;
    margin-right: -2px;
    border-radius: 22px;
  }

  .game-map-head {
    align-items: flex-start;
    flex-direction: column;
    margin-bottom: 10px;
  }

  .game-map-head h2 { font-size: 1.75rem; }

  .live-map-wrap,
  .live-map-wrap #game-map {
    min-height: 62vh;
    height: 62vh;
    border-radius: 18px;
  }

  .heading-hint {
    left: 10px;
    right: 10px;
    top: 10px;
    max-width: none;
    font-size: .8rem;
    text-align: center;
  }

  .map-toolbar {
    position: static;
    margin-top: 8px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding: 8px;
  }

  .map-toolbar .btn {
    width: 100%;
    min-width: 0;
    padding-left: 8px;
    padding-right: 8px;
  }

  .quick-actions-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .action-row {
    display: grid;
    grid-template-columns: 1fr;
  }

  .message-head {
    align-items: stretch;
    flex-direction: column;
  }

  .message-head .btn { width: 100%; }

  .ingame-message-list { max-height: 180px; }

  .ingame-toasts {
    top: auto;
    bottom: 92px;
    left: 12px;
    right: 12px;
    transform: none;
    width: auto;
  }

  .ingame-toast { font-size: .92rem; }
}

/* v28: mobile polish, support modal, game create and games overview */
.topbar-brand-wrap{display:flex;align-items:center;gap:14px;min-width:0}.topbar-user{display:grid;gap:2px;text-decoration:none;color:var(--text);line-height:1.1;max-width:260px}.topbar-user strong{font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-user span{font-size:.76rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.location-action-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:10px 0}.location-action-row .btn{flex:0 1 auto}.location-result-top{margin:.4rem 0 .2rem}.location-status-items #geoAutoPing.ok{background:rgba(86,211,100,.16);color:#7cff91}.location-status-items #geoAutoPing.warn{background:rgba(255,209,102,.18);color:#ffd166}.location-status-items #geoAutoPing.bad{background:rgba(255,123,114,.18);color:#ff9b94}.coin-assignment-hint{border-color:rgba(255,209,102,.5);background:linear-gradient(135deg,rgba(255,209,102,.16),rgba(21,27,35,.95))}.create-game-form{gap:18px}.create-step-card{margin:0}.create-form-grid{display:grid;gap:12px}.create-form-grid.two-cols{grid-template-columns:repeat(2,minmax(0,1fr))}.create-form-grid.four-cols{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:12px}.create-game-form input,.create-game-form select,.create-game-form textarea{min-width:0}.create-submit-btn{width:min(360px,100%);justify-self:start}.mobile-person-list{display:grid;gap:10px}.person-row-card{display:grid;gap:3px;padding:12px;border:1px solid var(--line);border-radius:14px;background:#0d1117}.person-row-card span,.person-row-card small{color:var(--muted)}.games-card-list{display:grid;gap:14px}.game-list-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;margin:14px 0}.game-card-meta{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}.game-card-meta span{display:inline-flex;gap:4px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:6px 9px;background:rgba(255,255,255,.04);font-size:.9rem}.game-card-actions{display:flex;flex-direction:column;gap:8px;min-width:170px}.support-fab{position:fixed;right:18px;bottom:18px;z-index:1300;border:0;border-radius:999px;padding:12px 16px;background:var(--brand);color:#06140a;font-weight:900;box-shadow:0 16px 45px rgba(0,0,0,.35);cursor:pointer}.support-modal-box{width:min(560px,100%)}
@media(max-width:820px){.topbar-brand-wrap{display:grid;gap:2px}.topbar-user{max-width:calc(100vw - 90px)}.topbar-user strong{font-size:.82rem}.topbar-user span{font-size:.68rem}.location-action-row{display:grid;grid-template-columns:1fr;gap:8px}.location-action-row .btn{width:100%}.create-form-grid.two-cols,.create-form-grid.four-cols{grid-template-columns:1fr}.create-game-card{margin-left:-4px;margin-right:-4px;padding:14px}.map-picker-wrap{padding:10px}.map-picker-wrap #create-map{height:320px;min-height:320px}.coin-option{grid-template-columns:auto minmax(0,1fr)!important}.coin-option span,.coin-option small{min-width:0;overflow-wrap:anywhere}.games-top-actions{grid-template-columns:1fr!important}.games-filter-bar{position:sticky;top:68px;z-index:500;display:flex;overflow-x:auto;flex-wrap:nowrap;margin-left:-12px;margin-right:-12px;border-radius:0}.games-filter-bar .btn{width:auto;white-space:nowrap;flex:0 0 auto}.game-list-card{grid-template-columns:1fr;padding:16px}.game-card-actions{display:grid;grid-template-columns:1fr;min-width:0}.game-card-actions .btn{width:100%}.game-card-meta{display:grid;grid-template-columns:1fr 1fr}.support-fab{left:12px;right:12px;bottom:12px;width:auto}.cx-modal.open{padding:10px}.support-modal-box{max-height:88vh}}


.dashboard-games-scroll {
    display:flex;
    gap:12px;
    overflow-x:auto;
    padding-bottom:10px;
    scroll-snap-type:x mandatory;
}

.dashboard-games-scroll::after {
    content:"→ Wischen";
    flex:0 0 auto;
    align-self:center;
    opacity:.6;
    font-size:.85rem;
}

@media(max-width:768px){

.dashboard-games-scroll{
    display:grid;
    grid-template-columns:1fr;
}

}

.mobile-game-list{
    display:none;
}

@media(max-width:900px){

.desktop-only{
    display:none;
}

.mobile-game-list{
    display:grid;
    gap:12px;
}

.game-card-mobile{
    background:var(--card-bg);
    border:1px solid var(--border-color);
    border-radius:16px;
    padding:14px;
}

.game-card-mobile h3{
    margin:0 0 8px;
}

.game-meta{
    display:flex;
    justify-content:space-between;
    gap:8px;
    margin-bottom:8px;
    font-size:.9rem;
    opacity:.85;
}
}


/* v30 final polish: admin actions, floating coin/support, readiness, mobile participation */
.topbar nav a[href$="/games"]{font-weight:inherit!important}
.floating-help-stack{position:fixed;right:18px;bottom:18px;z-index:1300;display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.floating-help-stack .support-fab{position:static;right:auto;bottom:auto}.coin-fab{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:12px 14px;text-decoration:none;font-weight:900;box-shadow:0 16px 45px rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.18)}.coin-fab.ok{background:#dcffe8;color:#0d6b2c}.coin-fab.missing{background:#ffe0df;color:#8a1c16}.admin-game-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.game-readiness-card{border-width:2px}.game-readiness-card.ok{border-color:rgba(86,211,100,.55)}.game-readiness-card.warn{border-color:rgba(255,209,102,.75)}.game-readiness-card summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer}.readiness-summary{font-size:.9rem;color:var(--muted)}.readiness-list{display:grid;gap:8px;margin-top:12px}.readiness-row{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid var(--line)}.readiness-row.ok{border-color:rgba(86,211,100,.4)}.readiness-row.bad{border-color:rgba(255,123,114,.55)}.readiness-row.info{border-color:rgba(255,209,102,.35)}.participant-overview-card.warn{border-color:rgba(255,209,102,.65)}.participant-card-list{display:grid;gap:10px}.participant-card{display:grid;gap:10px}.participant-card.warn{border-color:rgba(255,209,102,.65)}.participant-card.ok{border-color:rgba(86,211,100,.35)}.participant-status-pills{display:flex;gap:6px;flex-wrap:wrap}.demo-catch-report{border-color:rgba(86,211,100,.4)}.demo-catch-image img{width:100%;max-height:220px;object-fit:contain;border-radius:14px;background:#fff;margin-top:10px}.coin-buy-legal-note{font-size:.95rem}.demo-quick-card{border-color:rgba(96,165,250,.45)}
@media(max-width:820px){.floating-help-stack{left:12px;right:12px;bottom:12px;display:grid;grid-template-columns:1fr 1fr}.floating-help-stack .support-fab,.floating-help-stack .coin-fab{width:100%;min-height:48px;padding:10px 8px;font-size:.9rem}.readiness-row{display:grid;grid-template-columns:1fr auto}.participant-card .actions .btn{width:100%}.admin-game-actions{display:grid;grid-template-columns:1fr}.admin-game-actions .btn{width:100%}}


/* v31 Final UX polish: readiness arrows, links, score, demo actions, dashboard spacing */
.game-readiness-card summary{display:flex;align-items:center;gap:10px;justify-content:space-between;cursor:pointer}.readiness-title-wrap{display:inline-flex;align-items:center;gap:8px}.details-arrow,.location-toggle-icon{transition:transform .18s ease;display:inline-grid;place-items:center}.game-readiness-card[open] .details-arrow{transform:rotate(180deg)}.readiness-score{display:inline-flex;align-items:center;justify-content:center;min-width:54px;padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.08);font-weight:900;color:var(--brand)}.game-readiness-card.warn .readiness-score{color:#ffd166}.game-readiness-card.bad .readiness-score{color:#ff9b94}.readiness-row{color:inherit;text-decoration:none;cursor:pointer}.readiness-row:hover{filter:brightness(1.08)}.game-readiness-card.bad{border-color:rgba(255,123,114,.7)}.game-readiness-card.warn{border-color:rgba(255,209,102,.65)}.game-readiness-card.ok{border-color:rgba(86,211,100,.55)}.dashboard-top-actions,.games-top-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.dash-game-card{padding:18px}.dashboard-game-cards{gap:16px}.dash-game-main h3{font-size:1.18rem;line-height:1.2}.dash-game-meta{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}.dash-game-side{gap:8px;align-items:flex-start}.demo-quick-card .section-head-action{align-items:center}@media(max-width:760px){.game-readiness-card summary{display:grid;grid-template-columns:1fr auto;align-items:start}.readiness-summary{grid-column:1/-1}.readiness-score{grid-column:2;grid-row:1}.dashboard-top-actions,.games-top-actions{width:100%;display:grid;grid-template-columns:1fr;}.dashboard-top-actions .btn,.games-top-actions .btn{width:100%}.dash-game-card{padding:16px;border-radius:18px}.dash-game-meta{grid-template-columns:1fr}.dash-game-side{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}.dash-game-side .btn{grid-column:1/-1;width:100%}.dashboard-game-cards{display:grid;grid-template-columns:1fr;gap:14px}}

/* v32 final live readiness: pending game-code joiners, invite UX, mobile register/footer fixes */
.register-form{max-width:100%;overflow:hidden}.register-form input,.register-form select,.register-form textarea{min-width:0}.register-form .grid{min-width:0}.register-form label{min-width:0}.register-form .check{overflow-wrap:anywhere;word-break:normal}.register-form .check a{overflow-wrap:anywhere}
.manage-mobile-list{display:none}.pending-joiners-card{border-color:rgba(255,209,102,.55)}.pending-joiners-card .participant-card form{margin-top:6px}.known-player-list{max-height:240px}.invite-mobile-cards{margin-top:12px}
.site-footer{margin-bottom:105px}.site-footer nav{display:flex!important;flex-direction:row!important;gap:10px 14px!important;flex-wrap:wrap!important}.site-footer nav a{display:inline-flex;align-items:center;white-space:nowrap}.floating-help-stack{max-width:calc(100vw - 24px)}
@media(max-width:820px){
  .register-form{margin-left:-4px;margin-right:-4px;padding:14px}.register-form .grid.two,.register-form .grid.three{grid-template-columns:1fr!important}.register-form input,.register-form select,.register-form textarea{font-size:16px;width:100%;max-width:100%}.register-form .check{display:grid!important;grid-template-columns:auto minmax(0,1fr);align-items:start}.register-form .check input{width:auto!important;margin-top:4px}
  .manage-mobile-list{display:grid;gap:10px}.game_manage .table-wrap{display:none}.invite-mobile-cards{display:grid}.pending-joiners-card .btn{width:100%}
  .site-footer{padding-bottom:118px;margin-bottom:0;align-items:flex-start}.site-footer nav{width:100%;display:flex!important;flex-direction:row!important;gap:8px!important}.site-footer nav a{padding:8px 10px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.04);font-size:.9rem}.floating-help-stack{bottom:12px}
}
@media(max-width:820px){
  .card form .table-wrap + .manage-mobile-list{display:grid}.card form .table-wrap:has(+ .manage-mobile-list){display:none}
}
@media(max-width:820px){.manage-table-wrap{display:none!important}}



/* FINAL FIX: Registrierung Checkboxen sauber darstellen */
.register-form .check,
.form .check {
  display: grid !important;
  grid-template-columns: 22px minmax(0, 1fr) !important;
  align-items: start !important;
  gap: 10px !important;
  width: 100%;
  color: var(--text);
  font-weight: 700;
  line-height: 1.45;
}

.register-form .check input,
.form .check input {
  width: 18px !important;
  min-width: 18px !important;
  height: 18px !important;
  margin: 3px 0 0 !important;
  padding: 0 !important;
}

.register-form .check span,
.form .check span {
  display: block;
  min-width: 0;
}

.register-form .check a,
.form .check a {
  color: var(--text);
  text-decoration: underline;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.register-form .legal-accept-text {
  display: inline;
}

@media(max-width: 820px) {
  .register-form .check,
  .form .check {
    grid-template-columns: 24px minmax(0, 1fr) !important;
    gap: 10px !important;
    font-size: .95rem;
  }
}

.legal-modal-link {
  display: inline;
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  color: var(--text);
  text-decoration: underline;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.legal-modal-link:hover {
  color: var(--brand);
}

.legal-inline-box {
  width: min(760px, 100%);
}

#legalInlineContent {
  line-height: 1.65;
}

#legalInlineContent h1 {
  font-size: clamp(1.8rem, 5vw, 3rem);
}

#legalInlineContent h2 {
  margin-top: 1.4rem;
}

#legalInlineContent .topbar,
#legalInlineContent .site-footer,
#legalInlineContent .support-fab,
#legalInlineContent .floating-help-stack {
  display: none !important;
}