:root {
  --bg:#1a1c1e; --panel:rgba(28,26,24,.9); --panel2:rgba(42,38,34,.95); --panel-solid:#28241f;
  --akz:#d9b26a; --akz-hell:#f2d79a; --akz2:#a8763a; --linie:rgba(230,205,150,.3);
  --text:#f3ede2; --text-2:#e2d8c6; --text-3:#c2b6a0; --dim:#c8bca6;
  --gold:#f2c861; --rot:#ff8a7a; --gruen:#a6dc8e; --blau:#9cc8f0; --dran:#8ad8c4;
  --ov-a:#34302a; --ov-b:#141210; --scrim:rgba(8,8,8,.7);
  --kn-a:#4a4238; --kn-b:#26211b;
  --holz:#6e4a2c; --holz-d:#3e2814; --holz-h:#9a6e44; --perg:#efe3c6; --perg-t:#2a2118;
  --kopf:'Georgia', 'Times New Roman', serif;
  --sans:'Segoe UI', system-ui, -apple-system, Roboto, Arial, sans-serif;
}
:root[data-theme="light"] {
  --bg:#e8e2d4; --panel:rgba(248,243,232,.93); --panel2:rgba(238,230,214,.97); --panel-solid:#f0e9da;
  --akz:#8a5414; --akz-hell:#74420a; --akz2:#b88a3a; --linie:rgba(90,60,30,.3);
  --text:#22190f; --text-2:#3c2e1e; --text-3:#584634; --dim:#584634;
  --gold:#835000; --rot:#b4232f; --gruen:#2a6e3a; --blau:#1a5fb4; --dran:#0f7a62;
  --ov-a:#f5efe2; --ov-b:#e2d6bf; --scrim:rgba(40,30,20,.42);
  --kn-a:#f5efe2; --kn-b:#ddcfb6;
  --holz:#a77c52; --holz-d:#6e4a2c; --holz-h:#cfa676; --perg:#f3ead6; --perg-t:#2a2118;
}
html[data-design="abend"]:not([data-theme="light"]) {
  --bg:#1e1614; --panel:rgba(34,24,20,.9); --panel2:rgba(48,34,28,.95); --panel-solid:#2c201a;
  --akz:#e8a05a; --akz-hell:#ffd08a; --linie:rgba(240,180,130,.3); --ov-a:#3a2a22; --ov-b:#160e0b; --kn-a:#4e3a2e; --kn-b:#2a1d16;
}
:where(html, html *) { scrollbar-width:thin; scrollbar-color:var(--akz, #d9b26a) var(--panel2, rgba(42,38,34,.95)); }
:where(html) ::-webkit-scrollbar { width:9px; height:9px; }
:where(html) ::-webkit-scrollbar-track { background:var(--panel2, rgba(42,38,34,.95)); border-radius:5px; }
:where(html) ::-webkit-scrollbar-thumb { background:var(--akz, #d9b26a); border-radius:5px; border:2px solid transparent; background-clip:padding-box; }
* { box-sizing:border-box; }
html, body { margin:0; height:100%; background:#0d0d0c; color:var(--text); font-family:var(--sans); overflow:hidden; user-select:none; -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
#wrap { position:fixed; inset:0; display:flex; align-items:center; justify-content:center; background:radial-gradient(ellipse at center, #34302a 0%, #0d0d0c 80%); }
:root[data-theme="light"] #wrap { background:radial-gradient(ellipse at center, #f2ecdf 0%, #c9bca2 85%); }
#stage { position:relative; width:1280px; height:800px; flex:none; transform-origin:center center; overflow:hidden; background:var(--bg); -webkit-touch-callout:none; }
#grund { position:absolute; inset:0; background:url(img/kulisse-nebel.webp?v=1) center 30% / cover no-repeat, linear-gradient(180deg, #8e9aa2, #4a5658); }
html[data-design="abend"]:not([data-theme="light"]) #grund { background:url(img/kulisse-abend.webp?v=1) center 30% / cover no-repeat, linear-gradient(180deg, #a85a3a, #3a2a24); }
:root[data-theme="light"] #grund { background:url(img/kulisse-mittag.webp?v=1) center 30% / cover no-repeat, linear-gradient(180deg, #a9cfe8, #d8c8a4); }
#stage.hoch #grund { background-image:url(img/kulisse-nebel-hoch.webp?v=1); background-position:center 20%; }
html[data-design="abend"]:not([data-theme="light"]) #stage.hoch #grund { background-image:url(img/kulisse-abend-hoch.webp?v=1); }
:root[data-theme="light"] #stage.hoch #grund { background-image:url(img/kulisse-mittag-hoch.webp?v=1); }
#grund::before { content:""; position:absolute; left:-30%; right:-30%; bottom:0; height:46%; pointer-events:none;
  background:radial-gradient(ellipse 40% 50% at 30% 60%, rgba(230,236,238,.16), transparent 70%), radial-gradient(ellipse 35% 40% at 75% 70%, rgba(230,236,238,.12), transparent 70%);
  animation:nebel 38s ease-in-out infinite alternate; }
html[data-design="abend"] #grund::before, :root[data-theme="light"] #grund::before { opacity:.4; }
@keyframes nebel { from { transform:translateX(-6%); } to { transform:translateX(6%); } }
#grund::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,10,10,.12), rgba(8,8,8,.32)); }
:root[data-theme="light"] #grund::after { background:linear-gradient(180deg, rgba(255,250,236,.05), rgba(240,232,214,.2)); }
#stage.lobbyhg #grund { filter:blur(3px) brightness(.72); }
:root[data-theme="light"] #stage.lobbyhg #grund { filter:blur(2px) brightness(1.04) saturate(.85); }
@media (prefers-reduced-motion: reduce) { #grund::before { animation:none; } }
[hidden] { display:none !important; }
button { font-family:var(--sans); cursor:pointer; }
input, select { font-family:var(--sans); font-size:16px; }

.kb { display:inline-flex; align-items:center; justify-content:center; gap:7px; background:linear-gradient(180deg, var(--kn-a), var(--kn-b)); color:var(--text); border:1px solid var(--linie); border-radius:9px; padding:9px 16px; font-size:16px; font-weight:700; box-shadow:inset 0 1px 0 rgba(255,236,200,.14), 0 2px 8px rgba(0,0,0,.4); }
:root[data-theme="light"] .kb { background:linear-gradient(180deg, var(--kn-a), var(--kn-b)); box-shadow:inset 0 1px 0 #fff8, 0 2px 6px rgba(60,40,20,.2); }
@media (hover: hover) { .kb:hover:not(:disabled) { border-color:var(--akz-hell); } }
.kb:disabled { opacity:.45; cursor:default; }
.kb-gold { background:linear-gradient(#ffe39a, #e0a52a) !important; color:#2b2405 !important; border-color:#fff3c8; box-shadow:0 2px 0 #6a4a06, inset 0 1px 0 #fff6; }
.kb-gruen { background:linear-gradient(#b3e08c, #5f9f3a) !important; border-color:#def3c8; color:#142408 !important; }
.kb.an { outline:2px solid var(--akz-hell); }
.kb-ic { width:38px; height:34px; display:inline-flex; align-items:center; justify-content:center; background:rgba(0,0,0,.28); color:var(--text); border:1px solid var(--linie); border-radius:8px; padding:0; }
:root[data-theme="light"] .kb-ic { background:rgba(255,250,236,.6); }
.kb-ic .sgzi { width:20px; height:20px; }
.kb-ic.an { background:rgba(255,207,106,.3); border-color:var(--akz-hell); }
@media (hover: hover) { .kb-ic:hover { border-color:var(--akz-hell); } }
.kb-klein { padding:5px 12px; font-size:14px; }
.kb-gross { width:100%; padding:11px 18px; font-size:18px; }

#lobby, #tisch { position:absolute; inset:0; z-index:3; display:flex; flex-direction:column; background:linear-gradient(180deg, rgba(8,14,10,.25), rgba(6,10,8,.55)); }
:root[data-theme="light"] #lobby, :root[data-theme="light"] #tisch { background:linear-gradient(180deg, rgba(250,250,236,.3), rgba(226,232,206,.5)); }
.lo-kopf { position:relative; display:flex; align-items:center; gap:18px; padding:12px 24px 10px; border-bottom:1px solid var(--linie); background:var(--panel); }
.lo-logo { font-family:var(--kopf); font-size:30px; font-weight:900; letter-spacing:5px; color:var(--akz-hell); text-shadow:0 2px 0 rgba(0,0,0,.6), 0 0 18px rgba(255,207,106,.22); }
:root[data-theme="light"] .lo-logo { text-shadow:none; }
.lo-raum { font-size:18px; color:var(--text-2); font-style:italic; }
.lo-ich { margin-left:auto; font-size:15px; color:var(--text-2); }
.lo-ich b { color:var(--akz-hell); }
.lo-kopf-r { display:flex; gap:8px; margin-left:14px; }
.lo-label { font-size:12.5px; letter-spacing:2.5px; text-transform:uppercase; color:var(--akz); margin-bottom:6px; font-weight:800; }
.lo-label small { text-transform:none; letter-spacing:0; color:var(--text-3); font-weight:500; font-size:12px; }
#chatwin, #tchatwin, #pchatwin { flex:1; overflow-y:auto; background:rgba(0,0,0,.25); border:1px solid rgba(255,207,106,.2); border-radius:8px; padding:9px 11px; font-size:15px; line-height:1.45; user-select:text; }
:root[data-theme="light"] #chatwin, :root[data-theme="light"] #tchatwin, :root[data-theme="light"] #pchatwin { background:rgba(255,250,236,.55); }
#chatin, #tchatin, #pchatin { margin-top:8px; padding:8px 12px; background:rgba(0,0,0,.3); color:var(--text); border:1px solid var(--linie); border-radius:8px; outline:none; font-size:16px; }
:root[data-theme="light"] #chatin, :root[data-theme="light"] #tchatin, :root[data-theme="light"] #pchatin { background:rgba(255,250,236,.75); }
#chatin:focus, #tchatin:focus, #pchatin:focus { border-color:var(--akz-hell); }
.nm { color:var(--akz-hell); font-weight:bold; }
.sys { color:var(--text-3); font-style:italic; }
.lo-chat { display:flex; flex-direction:column; min-height:0; }
.lo-spieler { display:flex; flex-direction:column; min-height:0; }
.lo-tabs { display:flex; gap:4px; margin-bottom:8px; }
.lo-tabs button { flex:1; background:rgba(0,0,0,.22); color:var(--text-2); border:1px solid var(--linie); border-radius:8px 8px 0 0; padding:8px; font-size:15px; font-weight:700; }
.lo-tabs button.an { background:rgba(255,207,106,.18); color:var(--akz-hell); border-color:var(--akz); }
.lo-tab { flex:1; display:flex; flex-direction:column; min-height:0; }
.lo-liste { flex:1; overflow-y:auto; display:flex; flex-direction:column; gap:6px; padding-right:4px; }
.lo-hinweis { color:var(--text-3); font-style:italic; font-size:14px; margin:8px 0; }
.it { display:flex; align-items:center; gap:8px; padding:6px 10px; background:rgba(0,0,0,.18); border-radius:6px; font-size:15px; }
.it .pk { width:9px; height:9px; border-radius:50%; background:var(--gruen); }
.it.spielt .pk { background:var(--gold); }
.it.me { color:var(--akz-hell); }
.tb { display:flex; align-items:center; gap:12px; padding:10px 12px; background:rgba(0,0,0,.18); border:1px solid var(--linie); border-radius:8px; cursor:pointer; }
@media (hover: hover) { .tb:hover { border-color:var(--akz-hell); background:rgba(255,207,106,.08); } }
.tb.voll { opacity:.55; cursor:default; }
.tb.laeuft { border-style:dashed; }
.tb-links { flex:1; min-width:0; }
.tb-kopf { display:flex; justify-content:space-between; font-weight:bold; font-size:16px; gap:8px; }
.tb-kopf .frei { color:var(--gruen); font-size:14px; white-space:nowrap; }
.tb-kopf .frei.aus { color:var(--text-3); }
.tb-sub { color:var(--text-2); font-size:13px; margin-top:3px; }
.tb-plaetze { display:flex; gap:2px; white-space:nowrap; }
.tb-plaetze .sgzi { width:16px; height:16px; }
.tb-plaetze .p-frei { opacity:.35; }
.tb-knopf { flex:none; padding:6px 14px; font-size:14px; }
.tb-route { display:inline-block; margin-left:6px; padding:0 7px; border-radius:7px; font-size:12px; font-weight:800; vertical-align:2px; color:var(--gold); background:rgba(255,216,107,.12); border:1px solid rgba(255,216,107,.6); }
:root[data-theme="light"] .tb-route { background:rgba(122,82,0,.08); border-color:rgba(122,82,0,.5); }
.lo-stat { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:8px; }
.st-k { flex:1 1 90px; background:rgba(0,0,0,.2); border:1px solid rgba(255,207,106,.22); border-radius:8px; padding:6px 8px; text-align:center; }
.st-k b { display:block; font-size:20px; color:var(--akz-hell); }
.st-k small { color:var(--text-3); font-size:12px; }
.ar { padding:8px 10px; background:rgba(0,0,0,.18); border-left:3px solid var(--text-3); border-radius:6px; font-size:14px; }
.ar.sieg { border-left-color:var(--gold); }
.ar.weg { border-left-color:var(--rot); opacity:.75; }
.ar-kopf { display:flex; justify-content:space-between; font-weight:bold; }
.ar-kopf .erg { color:var(--akz-hell); }
.ar-sub { color:var(--text-2); font-size:13px; margin-top:2px; }
.lo-fuss { display:flex; align-items:center; gap:10px; padding:12px 24px 16px; border-top:1px solid var(--linie); background:var(--panel); }
.lo-fuss-r { margin-left:auto; display:flex; gap:8px; }
.ti-mitte { flex:1; display:flex; gap:16px; padding:16px 24px; min-height:0; }
.ti-plaetze { flex:0 0 300px; display:flex; flex-direction:column; gap:7px; overflow:auto; }
.pl { display:flex; align-items:center; gap:10px; padding:8px 12px; background:var(--panel); border:1px solid var(--linie); border-radius:8px; }
.pl.me { border-color:var(--akz-hell); }
.pl.bereit { box-shadow:inset 3px 0 0 var(--gruen); }
.pl.leer { opacity:.75; }
.pl.ki { opacity:.85; border-style:dashed; }
.pl .nm2 { flex:1; display:flex; flex-direction:column; font-weight:bold; font-size:16px; }
.pl .nm2 small { font-weight:normal; color:var(--text-3); font-size:13px; }
.pl .st { font-size:13px; color:var(--text-2); }
.ti-opts { flex:1; display:flex; flex-direction:column; gap:8px; overflow:auto; padding:12px 16px; border-radius:12px; background:var(--panel); border:1px solid var(--linie); }
.ti-opt { display:flex; flex-direction:column; gap:4px; font-size:15px; }
.ti-opt small { color:var(--text-3); font-size:12px; margin-left:6px; }
.ti-wahl { display:flex; gap:6px; flex-wrap:wrap; }
.ti-wahl button { background:rgba(0,0,0,.22); color:var(--text); border:1px solid var(--linie); border-radius:6px; padding:5px 12px; font-size:15px; }
:root[data-theme="light"] .ti-wahl button, :root[data-theme="light"] .lw-wahl button { background:rgba(255,250,236,.65); }
.ti-wahl button.an { background:rgba(255,207,106,.22); border-color:var(--akz-hell); color:var(--akz-hell); font-weight:700; }
.ti-wahl.aus button { pointer-events:none; opacity:.7; }
.ti-info { color:var(--text-2); font-size:14px; margin:6px 0 0; }
.ti-chat { flex:0 0 280px; padding:10px 12px; border-radius:12px; background:var(--panel); border:1px solid var(--linie); }
.lo-streifen { display:flex; align-items:center; gap:14px; margin:10px 24px 0; padding:9px 16px; border-radius:12px; background:linear-gradient(90deg, rgba(154,214,111,.2), rgba(255,207,106,.1)); border:1px solid var(--gruen); }
.lo-streifen.warten { background:linear-gradient(90deg, rgba(255,207,106,.2), rgba(134,192,240,.12)); border-color:var(--akz-hell); }
.ls-ico .sgzi { width:24px; height:24px; }
.ls-text { display:flex; flex-direction:column; font-size:15px; } .ls-text small { color:var(--text-2); font-size:13px; }
#ls-knopf { margin-left:auto; }
.lo-haupt { position:relative; flex:1; display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:16px; padding:12px 24px 16px; min-height:0; }
.lo-start { display:flex; flex-direction:column; gap:8px; min-height:0; padding:12px 16px; border-radius:14px; border:2px solid var(--akz);
  background:linear-gradient(180deg, var(--panel2), var(--panel)); box-shadow:0 0 0 3px rgba(255,207,106,.1), 0 10px 30px rgba(0,0,0,.45); }
.lo-start .lo-label { margin:0; }
.lo-seg { display:flex; border:1px solid var(--akz); border-radius:10px; overflow:hidden; flex:none; }
.lo-seg button { flex:1; display:flex; align-items:center; justify-content:center; gap:8px; padding:10px 6px; font-size:15px; font-weight:800; color:var(--text-2); background:rgba(0,0,0,.18); border:0; }
.lo-seg button + button { border-left:1px solid var(--linie); }
.lo-seg button.an { color:#2b2405; background:linear-gradient(#ffe39a, #e0a52a); }
.seg-ic .sgzi { width:19px; height:19px; vertical-align:-4px; }
.lo-optionen { flex:1; min-height:0; overflow:auto; display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); grid-auto-flow:row dense; align-content:start; column-gap:14px; row-gap:7px; }
.lo-optionen > .lw-paar { display:contents; }
.lo-optionen > :not(.lw-zeile, .lw-paar), .lo-optionen > .lw-zeile:is(.lw-breit, :has(.lw-name, .lw-ausgabe, .lw-wahl > :nth-child(6))), .lo-optionen > .lw-paar > .lw-zeile:is(.lw-breit, :has(.lw-wahl > :nth-child(6))) { grid-column:1 / -1; }
.lw-zeile { display:flex; flex-direction:column; gap:4px; }
.lw-titel { font-size:13px; color:var(--text-2); } .lw-titel b { color:var(--text); font-size:14px; }
.lw-wahl { display:flex; gap:5px; flex-wrap:wrap; }
.lw-wahl button { padding:5px 9px; border-radius:7px; font-size:14px; color:var(--text); background:rgba(0,0,0,.22); border:1px solid var(--linie); }
@media (hover: hover) { .lw-wahl button:hover { border-color:var(--akz-hell); } }
.lw-wahl button.an { background:rgba(255,207,106,.24); border-color:var(--akz-hell); color:var(--akz-hell); font-weight:800; }
.lw-ausgabe { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.lw-ausgabe button { display:flex; flex-direction:column; align-items:flex-start; gap:2px; padding:7px 10px 8px; border-radius:9px; text-align:left; color:var(--text-2);
  background:linear-gradient(160deg, rgba(232,184,96,.28), rgba(16,8,24,.6)); border:1px solid var(--linie); font-size:12px; line-height:1.3; }
:root[data-theme="light"] .lw-ausgabe button { background:linear-gradient(160deg, rgba(232,184,96,.22), rgba(255,250,236,.6)); }
.lw-ausgabe button b { font-size:15px; color:var(--text); font-family:var(--kopf); }
.lw-ausgabe button.an { border-color:var(--akz-hell); box-shadow:0 0 0 2px rgba(255,207,106,.35); color:var(--text); }
.lw-name { display:flex; gap:6px; }
.lw-name input { flex:1; min-width:0; padding:6px 12px; background:rgba(0,0,0,.3); color:var(--text); border:1px solid var(--akz); border-radius:8px; outline:none; font-size:16px; }
:root[data-theme="light"] .lw-name input { background:rgba(255,250,236,.8); }
.lw-wuerfel { width:40px; flex:none; padding:0; }
.lw-info { display:inline-flex; width:18px; height:18px; margin-left:5px; border-radius:50%; align-items:center; justify-content:center; font:800 12px/1 var(--sans); color:#2b2405;
  background:var(--akz-hell); border:0; vertical-align:1px; cursor:pointer; padding:0; }
:root[data-theme="light"] .lw-info { color:#fff8e6; }
.lw-box { font-size:12.5px; color:var(--text-2); line-height:1.45; background:rgba(255,207,106,.08); border:1px solid rgba(255,207,106,.26); border-radius:8px; padding:7px 10px; }
.nw { white-space:nowrap; }
.lo-los { flex:none; display:flex; flex-direction:column; gap:5px; }
.lw-anleitung { padding:8px 10px; border-radius:10px; background:linear-gradient(180deg, rgba(232,184,96,.16), rgba(16,8,24,.3)); border:1px solid rgba(255,207,106,.25); }
:root[data-theme="light"] .lw-anleitung { background:rgba(232,184,96,.14); }
.lw-an-titel { font-size:12px; letter-spacing:2px; text-transform:uppercase; color:var(--akz-hell); margin-bottom:5px; font-weight:800; }
.lw-schritt { display:grid; grid-template-columns:20px minmax(0, 1fr); align-items:center; gap:8px; padding:3px 0; font-size:12.5px; line-height:1.35; color:var(--text-2); }
.lw-schritt > b { width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; color:#2b2405; background:var(--akz-hell); }
:root[data-theme="light"] .lw-schritt > b { color:#fff8e6; }
.lw-schritt span b { color:var(--text); }
.lo-los-hin { font-size:12.5px; color:var(--text-3); text-align:center; }
.lo-rechts { display:grid; grid-template-columns:minmax(0, 1fr); grid-template-rows:minmax(0, 1fr) 200px; gap:14px; min-height:0; }
.lo-rechts .lo-spieler, .lo-rechts .lo-chat { min-height:0; padding:10px 12px; border-radius:12px; border:1px solid var(--linie); background:linear-gradient(180deg, var(--panel2), var(--panel)); }


.banner { position:absolute; left:calc((100% - 404px) / 2); top:40%; z-index:75; min-width:420px; max-width:720px; padding:16px 34px 14px; text-align:center; border-radius:14px; pointer-events:none;
  transform:translate(-50%, -50%) scale(.6); opacity:0; transition:transform .4s cubic-bezier(.2, 1.4, .4, 1), opacity .35s;
  background:linear-gradient(180deg, var(--ov-a), var(--ov-b)); border:2px solid var(--akz); box-shadow:0 18px 50px rgba(0,0,0,.6); }
.banner.an { transform:translate(-50%, -50%) scale(1); opacity:1; }
.bn-titel { font-family:var(--kopf); font-weight:900; font-size:40px; letter-spacing:4px; color:var(--akz-hell); text-shadow:0 3px 0 rgba(0,0,0,.6); }
:root[data-theme="light"] .bn-titel { text-shadow:none; }
.bn-unter { margin-top:6px; font-size:15px; font-weight:800; letter-spacing:1.2px; color:var(--text); }
.banner.gold { background:linear-gradient(180deg, #fbe7a6, #c99a2e); border-color:#fff3cf; }
.banner.gold .bn-titel { color:#2a1d04; text-shadow:none; } .banner.gold .bn-unter { color:#3a2a08; }
.banner.klein { top:24%; min-width:0; padding:10px 24px 9px; }
.banner.klein .bn-titel { font-size:26px; letter-spacing:2px; }
.banner .bn-karte { display:flex; justify-content:center; margin-bottom:4px; }

.overlay { position:absolute; inset:0; background:var(--scrim); display:flex; align-items:center; justify-content:center; z-index:80; }
.ov-box { max-width:640px; max-height:92%; overflow:auto; background:linear-gradient(180deg, var(--ov-a), var(--ov-b)); border:2px solid var(--akz); border-radius:12px; padding:20px 26px; box-shadow:0 14px 40px rgba(0,0,0,.6); }
.ov-box.ov-breit { max-width:960px; width:92%; }
.ov-titel { font-family:var(--kopf); font-size:26px; font-weight:900; color:var(--akz-hell); text-align:center; margin-bottom:8px; letter-spacing:2px; }
.ov-knoepfe { display:flex; gap:10px; justify-content:center; margin-top:16px; flex-wrap:wrap; }
#pop-text { font-size:16px; line-height:1.5; color:var(--text); white-space:pre-line; }
.en-unter { text-align:center; color:var(--text-2); font-size:15px; margin-bottom:12px; }
.en-liste { display:flex; flex-direction:column; gap:7px; }
.en-platz { display:grid; grid-template-columns:48px 40px minmax(0, 1fr) 70px 100px; align-items:center; gap:10px; padding:7px 12px; border-radius:10px; background:rgba(0,0,0,.2); border:1px solid var(--linie); }
:root[data-theme="light"] .en-platz { background:rgba(255,250,236,.55); }
.en-platz.kopf { background:transparent; border-color:transparent; padding-top:0; padding-bottom:0; font-size:12px; letter-spacing:1px; text-transform:uppercase; color:var(--dim); font-weight:800; }
.en-platz.p1 { border-color:var(--gold); background:rgba(255,216,107,.12); }
.en-platz.ich { outline:1px solid var(--akz-hell); }
.en-platz .pz { font-family:var(--kopf); font-size:22px; font-weight:900; text-align:center; color:var(--text-2); }
.medaille { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; font:900 17px/1 var(--kopf); color:#2b2405;
  box-shadow:inset 0 2px 0 #fff8, inset 0 -3px 0 #0003, 0 2px 4px #0006; border:1px solid #0006; }
.medaille.m1 { background:radial-gradient(circle at 35% 30%, #fff3b0, #f2c531 55%, #9a7414); }
.medaille.m2 { background:radial-gradient(circle at 35% 30%, #ffffff, #c9d1d6 55%, #6f7c84); }
.medaille.m3 { background:radial-gradient(circle at 35% 30%, #ffd9b0, #d08a4a 55%, #7a4416); }
.en-platz .nmx { font-weight:bold; line-height:1.15; min-width:0; overflow-wrap:anywhere; } .en-platz .nmx small { display:block; font-weight:500; font-size:12.5px; color:var(--dim); }
.en-platz .w { text-align:right; font-variant-numeric:tabular-nums; }
.en-platz .w b { font-family:var(--kopf); font-size:18px; color:var(--text); }
.en-platz .pk b { color:var(--gold); }
.en-platz .w small { display:block; font-size:12px; color:var(--dim); }
.en-einladung { margin:10px 0 0; padding:8px 12px; border-radius:10px; text-align:center; font-size:15px; background:rgba(111,214,190,.14); border:1px solid var(--gruen); color:var(--text); }
.en-stat { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px 16px; margin-top:12px; font-size:15px; color:var(--text-2); }
.en-stat b { color:var(--gold); font-family:var(--kopf); }
.hilfe-text { font-size:15px; line-height:1.55; color:var(--text); max-height:600px; overflow:auto; user-select:text; }
.hilfe-text h1, .hilfe-text h2, .hilfe-text h3 { font-family:var(--kopf); color:var(--akz-hell); margin:14px 0 6px; }
.hilfe-text h1 { margin-top:0; }
.hilfe-text table { border-collapse:collapse; font-size:14px; } .hilfe-text td, .hilfe-text th { border-bottom:1px solid var(--linie); padding:3px 8px; text-align:left; }
#note { position:absolute; left:50%; top:10px; transform:translateX(-50%); background:rgba(150,40,20,.95); color:#fff; padding:8px 16px; border-radius:8px; z-index:99; }

#stage.hoch .lo-haupt { grid-template-columns:minmax(0, 1fr); grid-template-rows:auto minmax(0, 1fr); }
#stage.hoch .lo-rechts { grid-template-columns:minmax(0, 1fr); grid-template-rows:minmax(0, 1fr) 200px; }
#stage.hoch .lo-streifen { margin:10px 16px 0; }
#stage.hoch .lo-raum { display:none; }
#stage.hoch .ti-mitte { flex-wrap:wrap; }
#stage.hoch .ti-plaetze { flex:1 1 100%; max-height:300px; }
#stage.hoch .ti-chat { flex:1 1 100%; min-height:220px; }
@media (pointer: coarse) {
  .kb-ic { width:50px; height:44px; }
  .lw-wahl:not(.lw-ausgabe) button, .ti-wahl button { min-height:40px; min-width:40px; padding:8px 13px; font-size:15px; }
  .kb { min-height:42px; }
  .knopf { min-height:42px; }
  .pc-knoepfe button { min-height:40px; }
  button.lw-info { width:40px; height:36px; margin:-9px -11px -9px -6px; border-radius:18px; background:radial-gradient(circle at center, var(--akz-hell) 0 9px, transparent 9.5px); }
}


#partie { position:absolute; inset:0; z-index:2; }
.holz { background:repeating-linear-gradient(90deg, rgba(255,230,190,.05) 0 2px, transparent 2px 23px), repeating-linear-gradient(0deg, rgba(0,0,0,.08) 0 1px, transparent 1px 7px), linear-gradient(180deg, var(--holz-h), var(--holz) 40%, var(--holz-d)); }
.panel { position:absolute; border:1px solid rgba(40,24,10,.7); border-radius:10px; color:#f6ecd8;
  background:repeating-linear-gradient(90deg, rgba(255,230,190,.05) 0 2px, transparent 2px 23px), repeating-linear-gradient(0deg, rgba(0,0,0,.08) 0 1px, transparent 1px 7px), linear-gradient(180deg, var(--holz-h), var(--holz) 40%, var(--holz-d));
  box-shadow:inset 0 1px 0 rgba(255,230,190,.25), 0 8px 22px rgba(0,0,0,.45); }
#kopf { position:absolute; left:12px; right:12px; top:8px; height:44px; display:flex; align-items:center; gap:14px; padding:0 10px 0 128px; z-index:5; border-radius:10px;
  background:repeating-linear-gradient(90deg, rgba(255,230,190,.05) 0 2px, transparent 2px 23px), linear-gradient(180deg, rgba(110,74,44,.72), rgba(62,40,20,.72)); border:1px solid rgba(40,24,10,.6); color:#f6ecd8;
  box-shadow:0 6px 16px rgba(0,0,0,.35); }
#kopf .logo { font-family:var(--kopf); font-weight:900; font-size:20px; letter-spacing:3px; color:#f6dca0; line-height:1; text-shadow:0 2px 0 rgba(0,0,0,.5); }
#kopf .logo small { display:block; font-size:11.5px; letter-spacing:2.5px; color:#e8d6b0; margin-top:2px; }
#kopf .runde { font-size:12px; color:#e8d6b0; display:flex; flex-direction:column; align-items:center; line-height:1.1; text-transform:uppercase; letter-spacing:1px; }
#kopf .runde b { font-family:var(--kopf); font-size:17px; color:#fff3d6; text-transform:none; letter-spacing:0; }
.k-phase { flex:1; min-width:0; height:34px; display:flex; align-items:center; font-size:16px; color:#fff3d6; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.k-phase b { margin-right:5px; }
.uhr { padding:4px 10px; border-radius:8px; background:rgba(0,0,0,.35); font:800 15px/1 var(--sans); color:#fff3d6; font-variant-numeric:tabular-nums; }
.uhr.knapp { background:#a8302a; animation:puls 1s ease-in-out infinite; }
#kopf .rechts { display:flex; gap:6px; }
#kopf .kb-ic { color:#fff3d6; background:rgba(0,0,0,.25); border-color:rgba(255,230,190,.35); }
#k-verlauf { width:auto; padding:0 9px; gap:5px; font-size:13px; font-weight:700; }
#stage:not(.hoch) #k-verlauf { display:none; }

#gegner { position:absolute; left:16px; right:296px; top:58px; height:66px; display:flex; gap:10px; justify-content:center; z-index:3; }
#ich { position:absolute; left:16px; right:296px; bottom:8px; height:86px; display:flex; z-index:3; }
.platte { position:relative; flex:0 1 300px; min-width:0; display:grid; grid-template-columns:auto minmax(0, 1fr); grid-template-rows:auto auto auto; column-gap:8px; row-gap:2px; padding:5px 9px 5px 6px; border-radius:10px;
  color:#f6ecd8; border:1px solid rgba(40,24,10,.6); border-left:5px solid var(--sf);
  background:linear-gradient(180deg, rgba(120,82,50,.44), rgba(58,38,20,.44));
  box-shadow:inset 0 1px 0 rgba(255,230,190,.25), 0 5px 14px rgba(0,0,0,.35); transition:box-shadow .3s, transform .3s; }
.platte.dran { box-shadow:0 0 0 2px var(--akz-hell), 0 0 18px rgba(255,214,130,.55), 0 5px 14px rgba(0,0,0,.35); }
.platte.weg { opacity:.6; }
.platte .bildnis { grid-row:1 / 4; align-self:center; }
.platte.meine { flex:1 1 auto; grid-template-columns:auto auto minmax(0, 1fr); grid-template-rows:auto auto; column-gap:12px; padding:6px 12px 6px 8px; }
.platte.meine .bildnis { grid-row:1 / 3; }
.platte.meine .pl-karten { grid-column:3; grid-row:1 / 3; align-self:center; justify-content:flex-end; }
.pl-kopf { display:flex; align-items:baseline; justify-content:space-between; gap:8px; min-width:0; }
.pl-name { font-weight:800; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#fff3d6; }
.pl-name small { font-weight:500; font-size:11.5px; color:#e8d6b0; }
.pl-pkt { font-size:12.5px; color:#e8d6b0; white-space:nowrap; } .pl-pkt b { font-family:var(--kopf); font-size:18px; color:#fff3d6; }
.meine .pl-name { font-size:16px; } .meine .pl-pkt b { font-size:22px; }
.pl-zeile { display:flex; align-items:center; gap:8px; min-width:0; }
.pl-bruch, .pl-turm { display:inline-flex; align-items:center; gap:3px; font-size:13px; color:#fff3d6; white-space:nowrap; }
.pl-turm .sgzi { width:15px; height:15px; color:#e8d6b0; }
.pl-karren { display:inline-flex; gap:2px; padding:2px 3px; border-radius:5px; background:rgba(30,18,8,.45); box-shadow:inset 0 1px 3px rgba(0,0,0,.5); }
.kr-platz { display:inline-flex; align-items:center; justify-content:center; width:16px; height:14px; border-radius:2px; border:1px dashed rgba(255,230,190,.2); }
.meine .kr-platz { width:29px; height:24px; }
.kr-platz:has(.hstein) { border-color:transparent; }
.pl-karten { display:flex; gap:3px; flex-wrap:nowrap; overflow:hidden; min-height:0; }
.pl-leer { font-size:12px; color:#e8d6b0; font-style:italic; }
.pl-zu { margin:auto; color:var(--text-2); font-style:italic; }
.bildnis { flex:none; width:var(--bg); height:var(--bg); border-radius:50%; overflow:hidden; border:2px solid var(--bf); box-shadow:0 2px 6px rgba(0,0,0,.5); background:#3a2a1a; display:inline-block; }
.bildnis img { width:100%; height:100%; object-fit:cover; display:block; }
.hstein { display:inline-block; width:var(--g); height:calc(var(--g) * .82); border-radius:3px; flex:none;
  background:linear-gradient(160deg, var(--s2) 0 18%, var(--s0) 19% 72%, var(--s1) 73%); box-shadow:inset 0 0 0 1px rgba(0,0,0,.35), 1px 2px 3px rgba(0,0,0,.45); }
.karte { position:relative; display:inline-flex; flex-direction:column; width:var(--kw); height:calc(var(--kw) * 1.38); flex:none; border-radius:5px; overflow:hidden;
  background:var(--perg); border:2px solid var(--ka); box-shadow:0 2px 5px rgba(0,0,0,.45); color:var(--perg-t); }
.karte .kb-bild { flex:1; background:center / cover no-repeat; }
.karte .kb-art { position:absolute; left:0; top:0; padding:0 4px; font:800 calc(var(--kw) * .13)/1.3 var(--sans); color:#fff; background:var(--ka); border-bottom-right-radius:4px; }
.karte .kb-name { font:700 calc(var(--kw) * .155)/1.25 var(--sans); text-align:center; padding:1px 2px; background:var(--ka); color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pl-karten .karte[style*="--kw:26px"] .kb-art, .pl-karten .karte[style*="--kw:26px"] .kb-name { display:none; }
.karte[data-spielbar] { cursor:pointer; outline:2px solid var(--akz-hell); outline-offset:1px; animation:spielbar 1.6s ease-in-out infinite; }
@keyframes spielbar { 50% { outline-color:rgba(255,230,160,.25); } }

#feld { position:absolute; left:16px; right:296px; top:128px; bottom:100px; z-index:2; }
#buehne { position:absolute; left:50%; top:0; width:100%; height:100%; transform:translateX(-50%); border-radius:8px; overflow:hidden;
  box-shadow:0 0 0 3px rgba(60,40,20,.8), 0 0 0 5px rgba(200,170,120,.35), 0 18px 40px rgba(0,0,0,.6); touch-action:none; background:#4a4a40; }
#brett { position:absolute; inset:0; width:100%; height:100%; display:block; }
#brett text { pointer-events:none; }
.dm-z { font:800 12px var(--sans); fill:#3a2a16; opacity:.75; }
.dm-sch { font:800 13px var(--kopf); fill:#fff3d6; letter-spacing:.5px; }
.dm-kl { font:800 12px var(--sans); fill:#fff3d6; }
.dm-kn { font-family:var(--sans); font-weight:800; fill:#fff; }
#brett .kahn { cursor:pointer; }
#brett .kahn.tipp > path:nth-of-type(2) { stroke:#ffe08c; stroke-width:2.5; }
#brett .kahn.wahl > path:nth-of-type(2) { stroke:#fff3b0; stroke-width:4; filter:drop-shadow(0 0 6px rgba(255,224,140,.9)); }
#brett .platz.ziel rect { animation:zielpuls 1.2s ease-in-out infinite; cursor:pointer; }
@keyframes zielpuls { 50% { fill:rgba(255,224,140,.6); } }
#brett .dm-zielort { animation:zielort 1.4s linear infinite; cursor:pointer; }
@keyframes zielort { to { stroke-dashoffset:-32; } }
#brett .karte.ziel > rect:nth-of-type(2) { stroke:#ffe08c; stroke-width:3; }
#brett .dm-leucht { animation:zielpuls 0.8s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { #brett .platz.ziel rect, #brett .dm-zielort, .karte[data-spielbar], .uhr.knapp { animation:none; } }

#meldungen { position:absolute; left:50%; top:10px; width:min(620px, 80%); transform:translateX(-50%); display:flex; flex-direction:column; gap:6px; z-index:20; pointer-events:none; }
.meldung { padding:7px 14px; border-radius:9px; font-size:14.5px; line-height:1.35; color:var(--perg-t); text-align:center;
  background:var(--perg); border:1px solid rgba(80,50,20,.45); box-shadow:0 6px 16px rgba(0,0,0,.35); transition:opacity .5s, transform .5s; }
.meldung.dran { border:2px solid #b8862e; }
.meldung.schlecht { border:2px solid #a8302a; }
.meldung.weg { opacity:0; transform:translateY(-8px); }
.meldung b { color:#2a1a08; }

#marktwahl { left:50%; top:50%; transform:translate(-50%, -50%); width:min(720px, 94%); padding:14px 16px; z-index:30; text-align:center; }
.mw-titel { font-family:var(--kopf); font-size:20px; color:#fff3d6; margin-bottom:10px; }
.mw-karten { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.mw-k { display:flex; flex-direction:column; align-items:center; gap:6px; width:150px; padding:8px; border-radius:10px; background:rgba(0,0,0,.25); border:1px solid rgba(255,230,190,.35); color:#fff3d6; }
@media (hover: hover) { .mw-k:hover { border-color:#ffe08c; background:rgba(255,224,140,.12); } }
.mw-t { font-size:12.5px; line-height:1.3; color:#f0e2c6; }

#seite { position:absolute; right:12px; top:58px; bottom:8px; width:272px; display:flex; flex-direction:column; gap:8px; z-index:3; }
#lage { flex:none; height:112px; overflow:hidden; padding:9px 12px; border-radius:10px; font-size:14px; line-height:1.38; color:var(--perg-t);
  background:linear-gradient(180deg, rgba(243,234,214,.94), rgba(226,212,184,.94)); border:1px solid rgba(80,50,20,.45); box-shadow:0 6px 16px rgba(0,0,0,.35); }
#lage .lg-k { display:block; color:#5a4834; font-size:12.5px; margin-top:3px; }
.lg-rat { margin-top:5px; padding:4px 7px; border-radius:6px; background:rgba(200,160,74,.22); font-size:13px; line-height:1.3; }
.lg-rat .sgzi { width:15px; height:15px; vertical-align:-2px; }
#aktion { position:relative; flex:none; height:186px; overflow:hidden; display:flex; flex-direction:column; gap:7px; padding:10px 10px 58px; border-radius:10px;
  background:linear-gradient(180deg, rgba(120,82,50,.4), rgba(58,38,20,.4)); border:1px solid rgba(40,24,10,.6); box-shadow:inset 0 1px 0 rgba(255,230,190,.25), 0 6px 16px rgba(0,0,0,.35); }
#a-rat { position:absolute; left:10px; right:10px; bottom:10px; }
.knopf { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:38px; padding:7px 12px; border-radius:9px; font:800 15px var(--sans); color:#2a1d08;
  background:linear-gradient(#ffe39a, #d8a23a); border:1px solid #fff0c0; box-shadow:0 2px 0 #6a4a10, inset 0 1px 0 #fff6; }
.knopf:disabled { opacity:.45; cursor:default; }
.knopf.leise { background:linear-gradient(180deg, rgba(255,240,210,.18), rgba(0,0,0,.2)); color:#fff3d6; border-color:rgba(255,230,190,.4); box-shadow:none; }
.knopf.klein { min-height:34px; padding:5px 9px; font-size:13.5px; }
.knopf.an { outline:2px solid #fff3b0; }
.knopf .sgzi { width:17px; height:17px; }
.a-plaetze { display:flex; flex-wrap:wrap; gap:5px; align-items:center; font-size:13px; color:#fff3d6; }
.a-warte { color:#f0e2c6; font-style:italic; font-size:14px; padding:6px 2px; }
#pchat { flex:1; min-height:0; display:flex; flex-direction:column; padding:8px 10px; border-radius:10px; color:var(--perg-t);
  background:linear-gradient(180deg, rgba(243,234,214,.9), rgba(226,212,184,.9)); border:1px solid rgba(80,50,20,.45); box-shadow:0 6px 16px rgba(0,0,0,.35); }
.ch-tabs { display:flex; gap:4px; margin-bottom:6px; }
.ch-tabs button { flex:1; padding:5px; font-size:13px; font-weight:800; border-radius:7px; border:1px solid rgba(80,50,20,.4); background:rgba(255,255,255,.25); color:#3a2a16; }
.ch-tabs button.an { background:#7a5030; color:#fff3d6; }
.ch-liste { flex:1; min-height:0; overflow-y:auto; font-size:13px; line-height:1.38; }
.ch-z { padding:2px 0 2px 7px; border-left:3px solid var(--rf, transparent); margin-bottom:2px; }
.ch-z.leise { color:#5a4834; }
.ch-z.abschnitt { margin-top:6px; font-weight:800; color:#6a3a10; border-left-color:#b8862e; }
.ch-z.schlecht { color:#a8302a; }
.ch-chat { flex:1; min-height:0; display:flex; flex-direction:column; }
#pchatwin { background:rgba(255,255,255,.35); color:var(--perg-t); }
.pc-knoepfe { display:flex; gap:6px; margin-top:6px; } .pc-knoepfe button { flex:1; padding:5px; border-radius:7px; border:1px solid rgba(80,50,20,.4); background:rgba(255,255,255,.3); font-size:13px; color:#3a2a16; }
.pc-knoepfe .sgzi { width:15px; height:15px; vertical-align:-3px; }

#flug { position:absolute; inset:0; pointer-events:none; z-index:70; }
.flieg { position:absolute; left:0; top:0; transform:translate(-50%, -50%); filter:drop-shadow(2px 6px 4px rgba(0,0,0,.45)); }
.pkt { position:absolute; transform:translate(-50%, -50%); font:900 20px var(--kopf); color:#fff6d6; text-shadow:0 0 6px var(--pf, #b8862e), 0 2px 2px rgba(0,0,0,.7); animation:pkt 2.5s ease-out forwards; }
@keyframes pkt { 0% { opacity:0; transform:translate(-50%, -30%) scale(.6); } 15% { opacity:1; transform:translate(-50%, -60%) scale(1.15); } 80% { opacity:1; } 100% { opacity:0; transform:translate(-50%, -150%) scale(1); } }
#hinweis { position:absolute; left:50%; bottom:110px; transform:translateX(-50%); max-width:560px; padding:9px 18px; border-radius:10px; z-index:72; font-size:15px; color:#fff;
  background:rgba(150,40,20,.94); box-shadow:0 8px 20px rgba(0,0,0,.4); pointer-events:none; }
#hinweis.neutral { background:var(--perg); color:var(--perg-t); border:1px solid rgba(80,50,20,.45); }
#ansicht-menu { right:12px; top:56px; width:330px; padding:10px 14px; z-index:60; }
.am-t { font-size:12px; letter-spacing:2px; text-transform:uppercase; color:#f2d79a; margin:8px 0 4px; font-weight:800; }
#ansicht-menu label { display:flex; gap:8px; align-items:flex-start; padding:4px 0; font-size:14px; color:#fff3d6; } #ansicht-menu label small { display:block; color:#e8d6b0; font-size:12px; }
.am-reihe { display:flex; flex-wrap:wrap; gap:6px; }
#en-zurueck { position:absolute; left:50%; bottom:14px; transform:translateX(-50%); display:none; gap:10px; z-index:85; }
.konfetti { position:absolute; top:-30px; width:var(--gr); height:calc(var(--gr) * .7); background:var(--kf); border-radius:2px; z-index:90; animation:fall linear forwards; pointer-events:none; }
@keyframes fall { to { transform:translateY(900px) rotate(540deg); } }
@keyframes puls { 50% { opacity:.6; } }
.sz-karte .karte { --kw:54px; }
.zk-kahn .sgzi { width:34px; height:34px; color:#d9b26a; }

#stage.hoch #kopf { left:6px; right:6px; top:6px; height:64px; padding-left:96px; gap:6px; }
#stage.hoch .k-phase { display:none; }
#stage.hoch #kopf .rechts { margin-left:auto; gap:4px; }
#stage.hoch .nur-quer { display:none; }
#stage.hoch #kopf .logo { display:none; }
#stage.hoch #kopf .runde { font-size:14px; } #stage.hoch #kopf .runde b { font-size:20px; }
#stage.hoch .k-phase { font-size:15px; }
#stage.hoch #kopf .kb-ic { width:60px; height:58px; } #stage.hoch #kopf .kb-ic .sgzi { width:26px; height:26px; }
#stage.hoch #k-verlauf .lang { display:none; }
#stage.hoch .uhr { font-size:17px; }
#stage.hoch #gegner { left:6px; right:6px; top:74px; height:62px; gap:6px; }
#stage.hoch #gegner .platte { flex:1 1 0; padding:3px 5px 3px 3px; column-gap:5px; grid-template-rows:auto auto; }
#stage.hoch #gegner .platte .bildnis { grid-row:1 / 3; }
#stage.hoch #gegner .pl-name { font-size:15px; } #stage.hoch #gegner .pl-name small { display:none; }
#stage.hoch #gegner .pl-pkt { font-size:14px; } #stage.hoch #gegner .pl-pkt b { font-size:16px; }
#stage.hoch #gegner .pl-karten { display:none; }
#stage.hoch #gegner .pl-bruch { font-size:14px; }
#stage.hoch #gegner .kr-platz { width:11px; height:12px; }
#stage.hoch #gegner .pl-zeile { gap:4px; }
#stage.hoch #gegner .pl-turm { display:none; }
#stage.hoch #feld { left:6px; right:6px; top:142px; bottom:auto; height:var(--fh, 704px); }
#stage.hoch #ich { left:6px; right:6px; bottom:auto; top:calc(148px + var(--fh, 704px)); height:112px; }
#stage.hoch #ich .platte.meine { grid-template-columns:auto minmax(0, 1fr); grid-template-rows:auto auto auto; }
#stage.hoch #ich .platte.meine .pl-karten { grid-column:2; grid-row:3; justify-content:flex-start; }
#stage.hoch #seite { left:6px; right:6px; width:auto; top:calc(266px + var(--fh, 704px)); bottom:6px; flex-direction:row; gap:6px; }
#stage.hoch #lage { flex:1 1 50%; height:auto; font-size:15px; }
#stage.hoch #aktion { flex:1 1 50%; height:auto; }
#stage.hoch #pchat { display:none; }
#stage.hoch.verlauf #pchat { display:flex; position:absolute; left:0; right:0; bottom:calc(100% + var(--fh, 704px) * .1); height:calc(var(--fh, 704px) * .8); z-index:40; }
#stage.hoch #meldungen { width:92%; }
#stage.hoch .meldung { font-size:15px; }
#stage.hoch .knopf { min-height:60px; font-size:17px; }
#stage.hoch .knopf.klein { min-height:58px; font-size:16px; }
#stage.hoch #aktion { padding-bottom:76px; }
#stage.hoch .pl-name { font-size:16px; } #stage.hoch .pl-pkt { font-size:15px; } #stage.hoch .pl-name small, #stage.hoch .pl-leer { font-size:14px; } #stage.hoch .pl-bruch, #stage.hoch .pl-turm { font-size:15px; }
#stage.hoch #lage .lg-k { font-size:14px; } #stage.hoch .lg-rat { font-size:14px; } #stage.hoch .a-plaetze { font-size:15px; } #stage.hoch .a-warte { font-size:15px; }
#stage.hoch #hinweis { bottom:auto; top:calc(140px + var(--fh, 704px) * .5); font-size:16px; }
#stage.hoch .banner { left:50%; min-width:0; width:88%; }
@media (pointer: coarse) {
  .knopf { min-height:44px; }
  .ch-tabs button { min-height:40px; }
  .platte .karte { min-width:26px; }
}

.sn { color:var(--sn-d); }
.sn[data-f="0"] { --sn-d:#6a2116; --sn-h:#ffb8a4; } .sn[data-f="1"] { --sn-d:#1d3158; --sn-h:#b8d0ff; } .sn[data-f="2"] { --sn-d:#6a4610; --sn-h:#ffe08a; } .sn[data-f="3"] { --sn-d:#2d461b; --sn-h:#c8e8a8; }
#kopf .sn, .platte .sn, #aktion .sn, #marktwahl .sn, .sz-karte .sn, .banner .sn, #hinweis:not(.neutral) .sn, .ov-box .sn { color:var(--sn-h); }
#brett .dm-z { font-size:12.5px; }
#brett .mulde .dm-z { font-size:13px; }
#stage.hoch #brett .dm-sch { font-size:18px; }
#stage.hoch #brett .dm-z { font-size:16px; }
#stage.hoch #brett .mulde .dm-z { font-size:17px; }
#stage.hoch #brett .dm-kl { font-size:16px; }
#brett .dm-chip { font:800 13px var(--sans); fill:#fff; }
#stage.hoch #brett .dm-chip { font-size:17px; }
#brett .dm-tp { font:800 12.5px var(--sans); fill:#3a2a16; }
#stage.hoch #brett .dm-tp { font-size:16px; }
#brett .dm-zielort.rat { stroke:#9fe08e; stroke-width:4; }
#brett .dm-spur { animation:zielpuls 1.6s ease-in-out 3; }
.pl-prog { display:block; font-style:normal; font-size:11.5px; color:#e8d6b0; text-align:right; }
#stage.hoch .pl-prog { font-size:14px; }
#stage.hoch #gegner .pl-prog { display:none; }
.a-wasgeht { display:flex; flex-wrap:wrap; gap:2px 10px; font-size:13px; color:#fff3d6; line-height:1.3; }
.a-wasgeht b { color:#ffe9a8; }
#stage.hoch .a-wasgeht { font-size:15px; }
#stage.hoch #k-uhr { position:absolute; left:10px; top:148px; z-index:8; font-size:18px; padding:6px 12px; background:rgba(30,18,8,.82); border:1px solid rgba(255,230,190,.4); }
