/* Neue Grafiken (Corel) – geglättet statt Pixel */
.pix, img, .mknopf, #navi .nbild, .mgr, .zeitleiste, .tafel, .stadion, .baelle button, .schwerp { image-rendering: auto !important; }

.neubild{display:block;width:100%;aspect-ratio:16/9;max-height:210px;object-fit:cover;object-position:center 45%;border-bottom:2px solid var(--teal-hell);image-rendering:auto!important}
#navi .nbild{image-rendering:auto!important;width:40px!important;height:32px!important;border:0!important;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))}
#navi button[data-seite="buero"] .nbild{background:url(bilder/ic_buero.png) center/contain no-repeat!important}
#navi button[data-seite="kader"] .nbild{background:url(bilder/ic_kader.png) center/contain no-repeat!important}
#navi button[data-seite="training"] .nbild{background:url(bilder/ic_training.png) center/contain no-repeat!important}
#navi button[data-seite="transfer"] .nbild{background:url(bilder/ic_transfer.png) center/contain no-repeat!important}
#navi button[data-seite="finanzen"] .nbild{background:url(bilder/ic_finanzen.png) center/contain no-repeat!important}
#navi button[data-seite="liga"] .nbild{background:url(bilder/ic_liga.png) center/contain no-repeat!important}
#navi button[data-seite="karriere"] .nbild{background:url(bilder/ic_bewerbung.png) center/contain no-repeat!important}
.mkneu{aspect-ratio:1!important;background:linear-gradient(#2f7fc4,#14508a)!important;border:2px solid #000!important;border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:4px 2px!important;image-rendering:auto!important;color:#fff}
.mkneu img{width:62%;height:auto;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))}
.mkneu span{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:11px;letter-spacing:.3px;text-transform:uppercase;text-shadow:1px 1px 0 #000;line-height:1.05;text-align:center}
body{background:var(--teal-dunkel) url(bilder/bg.jpg) repeat!important;background-size:256px 256px!important}
.persbild{object-fit:cover;object-position:center top;width:48px!important;height:48px!important;border-radius:4px}
.st-geld img{width:auto!important;height:44px}
.st-pc img{height:50px}
.balkenicon{height:26px;width:26px;vertical-align:middle;margin:-4px 6px -4px 0}
.neulogo{display:flex;align-items:center;gap:6px;min-width:0;flex:1 1 auto}
.neulogo img{height:34px;width:34px;flex:none}
.neulogo b{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:17px;line-height:.9;letter-spacing:1px;color:#fff;text-shadow:2px 2px 0 #000;white-space:nowrap}
.neulogo b i{font-style:normal;color:var(--gelb,#f0c800)}
.mgr,.tafel,.schwerp,.baelle button{image-rendering:auto!important}
.wicon{height:1.25em;width:1.25em;vertical-align:-.25em;margin-right:2px}.wicon.tr{height:1.6em;width:1.6em}
.gesicht{display:inline-block;width:44px;height:44px;vertical-align:middle;margin-right:8px;border:2px solid var(--teal-hell);border-radius:4px;background:url(bilder/gesichter.png) 0 0/600% 500% no-repeat}
.neubank{width:100%!important;height:auto!important;max-height:170px;object-fit:cover;border:0!important;border-radius:4px}
.hauptmenue{grid-template-columns:repeat(4,minmax(0,1fr))!important}
@media (min-width:560px){.hauptmenue{grid-template-columns:repeat(6,minmax(0,1fr))!important}}
.mkneu{min-width:0}.mkneu span{hyphens:auto;-webkit-hyphens:auto;letter-spacing:0;font-size:10.5px;max-width:100%}
/* Live-Spiel im neuen Stil */
.stadion{background:#0b2f4a url(bilder/neu_live.jpg) center top/cover no-repeat!important;aspect-ratio:1312/816!important;border-bottom:2px solid var(--teal-hell)}
.anzeige{left:50%!important;top:14%!important;transform:translateX(-50%);width:auto!important;min-width:62%;max-width:92%;height:auto!important;padding:6px 14px 8px;gap:2px;
  background:linear-gradient(#0d2a40f2,#06182af2);border:3px solid #0a1622;outline:2px solid var(--teal-hell);border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.55)}
.anzeige .stand{font-size:clamp(34px,11vw,54px);color:#f0c800;text-shadow:0 0 10px rgba(240,200,0,.45)}
.anzeige .stand img,.anzeige .stand .wappen{background:#fff;border-radius:6px;padding:2px}
.anzeige .min{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:19px;color:#2bd3bf}
.anzeige .namen{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:16px;letter-spacing:.02em;text-align:center}
.anzeige .namen.klein{font-weight:500;font-size:12.5px;color:#bfe3e6;line-height:1.2}
.zeitleiste{background:url(bilder/zeitleiste_neu.svg) center/100% 100% no-repeat!important;height:38px!important;margin:4px 6px 6px}
.zeitleiste #zlBall{background:#f0c800;border-radius:2px;box-shadow:0 0 6px #f0c800,0 0 0 1px #0a1622}
.radio{font-family:'Barlow Condensed',sans-serif!important;font-weight:600;font-size:16px!important;letter-spacing:.02em;line-height:1.25;color:#fff!important;
  background:linear-gradient(#123a52,#0b2a3e)!important;border:2px solid #0a1622!important;outline:1px solid var(--teal-hell);border-radius:8px!important;padding:8px 12px!important}
.radio #radioText{color:#f0e27a}

/* ================= Oberfläche im Stil der neuen Bilder =================
   flach, dicke dunkle Kontur, Teal/Blau mit Gelb als Akzent */
:root{--n-kontur:#0a1622;--n-flaeche:#12384a;--n-flaeche2:#0e2e3e;--n-blau:#1f5a92;--n-blau-hell:#2f7cc0;--n-teal:#2a9d8f;--n-teal-hell:#5fd1c0;--n-gelb:#f2c230;--n-rot:#d64545;--n-gruen:#3cae5c;--n-text-leise:#a9cfd6}
#kopf{background:var(--n-flaeche2)!important;border-bottom:3px solid var(--n-kontur)!important}
.panel{background:var(--n-flaeche)!important;border:3px solid var(--n-kontur)!important;border-radius:12px;overflow:hidden;box-shadow:0 3px 0 rgba(0,0,0,.35)}
.balken{background:var(--n-blau)!important;color:#fff!important;border:0!important;border-bottom:3px solid var(--n-kontur)!important;font-size:14px!important;letter-spacing:.06em!important;padding:6px 12px!important}
.balken small{color:#bfe3ff}
.neubild{border-bottom:3px solid var(--n-kontur)!important}
.knopf{background:var(--n-teal)!important;color:#fff!important;border:3px solid var(--n-kontur)!important;border-radius:9px;box-shadow:0 3px 0 var(--n-kontur);text-shadow:none;transition:transform .05s}
.knopf:active{transform:translateY(2px);box-shadow:0 1px 0 var(--n-kontur)}
.knopf.rot{background:var(--n-rot)!important}
.knopf.gruen{background:var(--n-gruen)!important}
.knopf:disabled{box-shadow:none}
.tabs{gap:4px!important}
.tabs button{background:var(--n-flaeche2)!important;border:2px solid var(--n-kontur)!important;border-radius:9px;color:var(--n-text-leise)!important;font-weight:700!important}
.tabs button.aktiv{background:var(--n-gelb)!important;color:var(--n-kontur)!important}
.feld input,.feld select,select.eingabe,input.eingabe{background:#0a2433!important;border:2px solid var(--n-kontur)!important;border-radius:8px;color:#fff}
.feld input:focus,.feld select:focus,select.eingabe:focus,input.eingabe:focus{outline:2px solid var(--n-teal-hell);outline-offset:0}
.liste th{color:var(--n-text-leise)!important}
#navi{background:var(--n-flaeche2)!important;border-top:3px solid var(--n-kontur)!important;box-shadow:none!important;gap:4px!important}
#navi button{background:var(--n-blau)!important;border:2px solid var(--n-kontur)!important;border-radius:9px!important;box-shadow:0 2px 0 var(--n-kontur)!important}
#navi button span{text-shadow:none!important;letter-spacing:.02em!important}
#navi button.aktiv{background:var(--n-gelb)!important}
#navi button.aktiv span{color:var(--n-kontur)!important}
.hauptmenue{background:transparent!important;gap:6px!important;padding:8px!important}
.mkneu{background:var(--n-blau)!important;border:3px solid var(--n-kontur)!important;border-radius:11px!important;box-shadow:0 3px 0 var(--n-kontur)!important}
.mkneu span{text-shadow:none!important}
.mkneu:active{transform:translateY(2px);box-shadow:0 1px 0 var(--n-kontur)!important}
.modalBox{background:var(--n-flaeche)!important;border:3px solid var(--n-kontur)!important;border-radius:14px 14px 0 0}
#toast{background:var(--n-flaeche2)!important;border:3px solid var(--n-kontur)!important;border-radius:10px;box-shadow:0 4px 0 rgba(0,0,0,.4)}
#toast.fehler{background:#4a1820!important}
.derbyband{background:var(--n-rot)!important;border:3px solid var(--n-kontur)!important;border-radius:10px}
.persbild{border:2px solid var(--n-kontur)!important;border-radius:8px!important;image-rendering:auto!important}
.panel.livebuehne{margin:0 0 12px!important;width:100%}
.neulogo img{height:40px!important;width:40px!important}
/* Stadion-Blöcke A–H im neuen Stil */
.stadionoben{margin:10px!important}
.stadionoben img{image-rendering:auto!important;filter:drop-shadow(0 3px 0 rgba(0,0,0,.35))}
.sblock{background:var(--n-blau)!important;border-width:3px!important;border-radius:10px!important;box-shadow:0 0 0 2px var(--n-kontur),0 3px 0 2px var(--n-kontur);min-width:46px!important;padding:3px 6px!important;line-height:1.05}
.sblock b{font-size:18px!important}
.sblock small{font-size:11px!important;color:#cfe8ff}
.sblock.zu{background:#4b5560!important}
.sblock:active{transform:translate(-50%,-48%)}
/* Konferenz-Tabelle im neuen Stil */
.konferenz tr td{background:var(--n-flaeche)!important;color:#fff;border-bottom:2px solid var(--n-kontur)!important}
.konferenz tr td.bc{background:var(--n-kontur)!important;color:var(--n-gelb)!important;font-family:'Barlow Condensed',sans-serif!important;font-weight:700;letter-spacing:.06em!important;font-size:18px!important}
.konferenz tr.ich td{background:var(--n-blau)!important}
.konferenz tr.ich td.bc{background:#06101a!important}
.figur img{height:42px!important;filter:drop-shadow(0 2px 0 rgba(0,0,0,.45))!important}
.figur span{background:var(--n-kontur)!important;border-radius:4px;color:#fff}
/* Torszene: eingeblendetes Bild mit Zoom */
.szene{border:3px solid var(--n-kontur)!important;box-shadow:0 4px 0 rgba(0,0,0,.4)!important;border-radius:12px;overflow:hidden;background:var(--n-kontur)}
.szenebild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:60% 45%}
.szene.an .szenebild{animation:szeneZoom 3.6s ease-out forwards}
@keyframes szeneZoom{from{transform:scale(var(--z0,1.18))}to{transform:scale(var(--z1,1))}}
.szene::after{content:'';position:absolute;inset:0;background:linear-gradient(rgba(6,16,26,.7),transparent 42%);pointer-events:none}
.szenetext{z-index:2;top:5%!important;bottom:auto;font-size:30px!important;color:#fff!important;-webkit-text-stroke:1.5px var(--n-kontur);paint-order:stroke fill;text-shadow:0 3px 0 var(--n-kontur)!important;letter-spacing:.04em}
.szenetext.tor{color:var(--n-gelb)!important;font-size:46px!important}
.szenetext small{display:inline-flex;align-items:center;gap:5px;margin-top:2px;font-size:15px!important;color:#fff!important;-webkit-text-stroke:0;text-shadow:none!important;background:var(--n-kontur);padding:2px 10px;border-radius:8px;letter-spacing:.02em}
@media (prefers-reduced-motion: reduce){.szene.an .szenebild{animation:none}}
/* Taktiktafel: Positions-Kästchen unter dem Namen */
.figur .slot,.figur .srolle ~ .slot{position:static!important;transform:none!important;display:inline-block;margin-top:2px;font-size:11px!important;font-weight:700;padding:1px 5px!important;border:2px solid var(--n-kontur)!important;border-radius:5px!important}
/* Kabine, Ansprache, Statistik */
.rang{display:inline-block;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:12.5px;padding:1px 7px;border-radius:7px;border:2px solid var(--n-kontur);background:var(--n-flaeche2);color:#fff;white-space:nowrap}
.rang.kapitaen{background:var(--n-gelb);color:var(--n-kontur)}
.rang.leitwolf{background:var(--n-blau)}
.rang.unruhe{background:var(--n-rot)}
.rang.neu{background:var(--n-teal)}
.ansprache .balken{background:#7a3fa0!important}
.anspracheknoepfe{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.anspracheknoepfe .knopf{display:flex;flex-direction:column;align-items:flex-start;text-align:left;text-transform:none;letter-spacing:0;padding:8px 10px;gap:2px}
.anspracheknoepfe .knopf b{font-size:17px;text-transform:uppercase;letter-spacing:.04em}
.anspracheknoepfe .knopf small{font-family:'Barlow',sans-serif;font-weight:400;font-size:12.5px;line-height:1.25;opacity:.92}
.anspracheknoepfe .knopf[data-ansprache="stauchen"]{background:var(--n-rot)!important}
.anspracheknoepfe .knopf[data-ansprache="loben"]{background:var(--n-gruen)!important}
.anspracheknoepfe .knopf[data-ansprache="ruhig"]{background:var(--n-blau)!important}
.detzeile{font-family:'Barlow Condensed',sans-serif;font-size:12.5px;color:var(--n-text-leise);line-height:1.15}
.notenkurve{width:100%;height:90px;display:block;background:var(--n-flaeche2);border:2px solid var(--n-kontur);border-radius:8px}
/* DFB-Pokal: Auslosung als Show */
.losbanner .balken{background:#b0882a!important}
.losbanner.neu{animation:losPuls 1.6s ease-in-out infinite}
@keyframes losPuls{50%{box-shadow:0 0 0 3px var(--n-gelb),0 3px 0 rgba(0,0,0,.35)}}
.losshow h3{font-family:'Barlow Condensed',sans-serif;font-size:22px}
.losbuehne{position:relative;height:210px;border-radius:12px;border:3px solid var(--n-kontur);overflow:hidden;
  background:radial-gradient(circle at 50% 35%,#24607e,#0e2e3e 70%)}
.lostopf{position:absolute;left:50%;top:14px;transform:translateX(-50%);width:150px}
.lostopf .glas{position:relative;height:130px;border:4px solid var(--n-kontur);border-radius:50% 50% 46% 46%;background:rgba(190,235,245,.18);box-shadow:inset 8px -6px 0 rgba(255,255,255,.12);overflow:hidden}
.lostopf .glas i{position:absolute;left:var(--x);top:var(--y);width:24px;height:24px;border-radius:50%;border:2px solid var(--n-kontur);
  background:radial-gradient(circle at 35% 30%,#fff,#dfe8ee 45%,#9fb4c0);animation:losWirbel .9s ease-in-out infinite alternate;animation-delay:var(--d)}
@keyframes losWirbel{from{transform:translate(0,0) rotate(0)}to{transform:translate(9px,-14px) rotate(160deg)}}
.lostopf .fuss{width:70px;height:14px;margin:-2px auto 0;background:var(--n-blau);border:3px solid var(--n-kontur);border-radius:0 0 8px 8px}
.lostopf.dreht .glas{animation:losTopf var(--dauer,.9s) ease-in-out}
@keyframes losTopf{20%{transform:rotate(-7deg)}45%{transform:rotate(6deg)}70%{transform:rotate(-3deg)}100%{transform:none}}
.lostopf.dreht .glas i{animation-duration:.25s}
/* Kugel: steigt aus dem Topf, fliegt nach vorn, springt auf */
.loskugel{position:absolute;left:50%;top:70px;width:40px;height:40px;margin-left:-20px;opacity:0;z-index:3}
.loskugel .halb{position:absolute;left:0;width:100%;height:50%;border:3px solid var(--n-kontur);transition:transform .45s cubic-bezier(.2,.9,.3,1.2),opacity .45s}
.loskugel .halb.oben{top:0;border-radius:40px 40px 0 0;border-bottom-width:1.5px;background:linear-gradient(#fff,#dfe8ee)}
.loskugel .halb.unten{bottom:0;border-radius:0 0 40px 40px;border-top-width:1.5px;background:var(--n-gelb)}
.loskugel.zieht{animation:losZiehen var(--dauer,.9s) cubic-bezier(.35,0,.25,1) forwards}
@keyframes losZiehen{0%{opacity:0;transform:translate(0,10px) scale(.6)}15%{opacity:1}45%{transform:translate(-18px,-78px) scale(.9) rotate(-120deg)}100%{opacity:1;transform:translate(0,48px) scale(1.7) rotate(-360deg)}}
.loskugel.auf .halb.oben{transform:translate(-46px,-40px) rotate(-55deg);opacity:0}
.loskugel.auf .halb.unten{transform:translate(46px,40px) rotate(40deg);opacity:0}
.loskarte{position:absolute;left:50%;top:50%;z-index:4;display:flex;flex-direction:column;align-items:center;gap:3px;width:250px;padding:10px 10px 8px;text-align:center;
  background:var(--n-flaeche);border:3px solid var(--n-kontur);border-radius:14px;box-shadow:0 5px 0 rgba(0,0,0,.4);opacity:0;transform:translate(-50%,-30%) scale(.3);pointer-events:none}
.loskarte.da{animation:losKarte .55s cubic-bezier(.2,1.5,.4,1) forwards}
@keyframes losKarte{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.loskarte b{font-family:'Barlow Condensed',sans-serif;font-size:23px;color:#fff;line-height:1.05}
.loskarte b.mensch{color:var(--n-gelb)}
.loskarte small{font-size:12px;background:var(--n-kontur);color:#fff;padding:0 8px;border-radius:6px}
.loskarte .wap{background:#fff;border-radius:8px;padding:3px;border:2px solid var(--n-kontur)}
.loskarte.meins{border-color:var(--n-gelb);box-shadow:0 0 0 3px var(--n-gelb),0 0 26px rgba(242,194,48,.7)}
.loskarte.meins.da{animation:losKarte .55s cubic-bezier(.2,1.5,.4,1) forwards,losMeins .5s ease-in-out .6s 3}
@keyframes losMeins{50%{transform:translate(-50%,-50%) scale(1.1)}}
.losinfo{margin-top:10px;text-align:center;font-family:'Barlow Condensed',sans-serif;font-size:18px;min-height:24px}
.losliste{display:flex;flex-direction:column;gap:5px;max-height:38vh;overflow-y:auto}
.loszeile{display:grid;grid-template-columns:22px 1fr auto 1fr 22px;align-items:center;gap:7px;padding:5px 8px;background:var(--n-flaeche2);border:2px solid var(--n-kontur);border-radius:9px;font-size:14.5px}
.loszeile span:nth-of-type(2){text-align:right}
.loszeile b{color:var(--n-text-leise)}
.loszeile.meins{background:#5a4512;border-color:var(--n-gelb)}
.loszeile.neu{animation:losNeu .5s ease-out}
@keyframes losNeu{from{opacity:0;transform:translateY(-8px)}}
@media (prefers-reduced-motion: reduce){.lostopf .glas i,.losbanner.neu{animation:none}}
/* Spezialfähigkeiten */
.spezicons{margin-left:4px;white-space:nowrap}
.spezicons i{font-style:normal;font-size:13px;margin-right:1px;filter:drop-shadow(0 1px 0 rgba(0,0,0,.5))}
.spezicons i.schlecht{opacity:.85}
.spezmarke{display:inline-block;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:12.5px;background:var(--n-gelb);color:var(--n-kontur);border:2px solid var(--n-kontur);border-radius:7px;padding:0 6px;margin-left:4px;white-space:nowrap}
.spezliste{display:flex;flex-direction:column;gap:8px}
.spezliste>div{display:flex;gap:10px;align-items:center;background:var(--n-flaeche2);border:2px solid var(--n-kontur);border-radius:10px;padding:7px 10px}
.spezliste>div.schlecht{border-color:#7a2a2a;background:#3a1a22}
.spezliste .spezicon{font-size:26px;line-height:1}
.spezliste b{display:block;font-family:'Barlow Condensed',sans-serif;font-size:17px}
/* Leih-Angebote: immer gleich angeordnet */
.leihangebot{display:grid;grid-template-columns:auto 1fr;gap:6px 10px;align-items:center;padding:10px;margin:8px 0;background:var(--n-flaeche2);border:2px solid var(--n-kontur);border-radius:10px}
.leihangebot .lt{display:flex;flex-direction:column;min-width:0}
.leihangebot .lt b{font-size:16px}
.leihangebot .lk{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.leihangebot .lk .knopf{width:100%}
.szenetext.gegentor{color:#ff6b6b!important;font-size:40px!important}
.szenetext{animation:szeneText 3.2s .25s forwards!important}
.wap.neuw img{object-fit:contain}
.knopf.spielstand{display:flex;flex-direction:column;align-items:flex-start;text-transform:none;letter-spacing:0;text-align:left}
.knopf.spielstand b{font-size:18px;text-transform:uppercase;letter-spacing:.04em}
.knopf.spielstand small{font-family:Barlow,sans-serif;font-weight:400;font-size:13px}
/* Halbzeitansprache als Einblendung im Stadion */
.ansprbox{position:absolute;inset:6px;z-index:9;display:none;align-items:center;justify-content:center}
.ansprbox.an{display:flex;animation:szeneEin .25s}
.ansprkarte{width:100%;max-height:100%;overflow:hidden;background:rgba(10,22,34,.93);border:3px solid var(--n-kontur);outline:2px solid #7a3fa0;border-radius:12px;padding:8px;box-shadow:0 5px 0 rgba(0,0,0,.4)}
.ansprkarte .ansprtitel{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:17px;color:#fff;margin-bottom:6px;display:flex;justify-content:space-between;gap:8px}
.ansprkarte .ansprtitel span{color:var(--n-gelb);font-weight:600}
.ansprkarte .anspracheknoepfe{gap:6px}
.ansprkarte .anspracheknoepfe .knopf{padding:5px 8px}
.ansprkarte .anspracheknoepfe .knopf b{font-size:15px}
.ansprkarte .anspracheknoepfe .knopf small{font-size:11px;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ansprkarte.reaktion{text-align:center;padding:14px}
.ansprkarte.reaktion p{margin:4px 0;font-size:16px}
.ansprkarte.reaktion small{color:var(--n-text-leise)}
.ansprzeit{position:relative;height:16px;margin-top:7px;background:#0b2f4a;border:2px solid var(--n-kontur);border-radius:8px;overflow:hidden}
.ansprzeit i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(#2bd3bf,#1d9a8a);transition:width .2s linear}
.ansprzeit.knapp i{background:linear-gradient(#ff7a7a,#d64545)}
.ansprzeit span{position:absolute;inset:0;text-align:center;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:12px;line-height:12px;color:#fff;text-shadow:0 1px 0 #000}
@media (max-width:380px){.ansprkarte .anspracheknoepfe .knopf small{display:none}}
.liste tr.aufgestellt.gewaehlt td,.liste tr.gewaehlt td{background:rgba(242,194,48,.28)!important}
.liste tr.gewaehlt td:first-child{box-shadow:inset 4px 0 0 var(--n-gelb)}
.liste tr.abschnitt.ziel td{background:rgba(242,194,48,.22)!important;cursor:pointer;outline:2px dashed var(--n-gelb);outline-offset:-3px}
.zielhinweis{color:var(--n-gelb);font-weight:700}
/* Taktiktafel: Einzelanweisungen sichtbar */
.figur .anwmarke{position:absolute;top:-8px;left:50%;margin-left:-37px;font-style:normal;z-index:3}
.tafellegende .anw-l{background:#5fd1c0;color:#0a1622;padding:0 3px;border-radius:3px;font-family:'Barlow Condensed',sans-serif}
.figur .srolle{background:none!important;padding:0!important;border:0!important;top:-8px!important;margin-left:12px!important;z-index:3}
.tafellegende .srolle-l{background:var(--gelb);color:#000;padding:0 3px;border-radius:3px}
.liste tr[data-p]{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}

/* Eigene Symbole: Sonderrolle gelb, Anweisung türkis */
.sym{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;border:2px solid var(--n-kontur);box-sizing:border-box;vertical-align:middle;flex:none;box-shadow:0 1px 0 rgba(0,0,0,.4)}
.sym svg{width:78%;height:78%;display:block}
.sym.rolle{background:var(--n-gelb)}
.sym.anw{background:#5fd1c0}
.tafellegende{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center}
.tafellegende span{display:inline-flex;align-items:center;gap:4px}
.auswahl .knopf b .sym{margin-right:4px;vertical-align:-5px}
.figur span.sym{display:inline-flex!important;padding:0!important;overflow:visible!important;border-radius:50%!important;border:2px solid var(--n-kontur)!important}
.figur span.sym.rolle{background:var(--n-gelb)!important}
.figur span.sym.anw{background:#5fd1c0!important}
.figur .srolle,.figur .anwmarke{line-height:0}

/* Spielfreie Runden: Schnellwahl */
.pausewahl { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 10px 0; }
.pausewahl .knopf { margin: 0; padding: 10px 6px; font-size: 14px; }

/* Tabelle: Vorjahres-Markierung */
.vjtag { display: inline-block; font-size: 10.5px; line-height: 1.5; padding: 0 5px; border-radius: 6px; margin-left: 2px; vertical-align: 1px; white-space: nowrap; font-weight: 600; }
.vj_meister { background: rgba(240, 192, 64, .22); color: #f3cf62; }
.vj_pokal { background: rgba(200, 210, 225, .18); color: #dfe6ef; }
.vj_auf { background: rgba(70, 190, 110, .2); color: #6fdc8f; }
.vj_ab { background: rgba(230, 80, 70, .2); color: #ff8a7f; }

/* Umfeld ohne eigenes Bild */
.umfemoji { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; font-size: 28px; border-radius: 10px; background: rgba(255,255,255,.06); }
.bau .umfemoji.umfbild { width: 56px; height: 56px; font-size: 32px; flex: none; margin-right: 10px; }

/* Saisonbesprechung */
.wahlkarte { display: flex; gap: 10px; align-items: flex-start; padding: 9px 10px; margin: 6px 0; border-radius: 10px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); cursor: pointer; }
.wahlkarte input { margin-top: 3px; accent-color: #f0c040; flex: none; }
.wahlkarte span.leise { display: block; margin-top: 2px; }
.wahlkarte:has(input:checked) { border-color: rgba(240,192,64,.7); background: rgba(240,192,64,.08); }
.besprechung { border: 1px solid rgba(240,192,64,.5); }

/* Kein Markieren/Kopieren-Menü beim langen Drücken (Handy). Eingabefelder bleiben normal. */
html, body { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; }
input, textarea, select, [contenteditable="true"] { -webkit-user-select: text; user-select: text; -webkit-touch-callout: default; }
img { -webkit-user-drag: none; }

/* Stadion vermieten: Vorschaubild je Veranstaltung */
.bau .eventbild { width: 60px; height: 60px; object-fit: cover; border-radius: 8px; flex: none; margin-right: 10px; border: 1px solid rgba(255,255,255,.12); }
.bau:has(.eventbild) { grid-template-columns: 64px 1fr auto; }
.bau .eventbild { margin-right: 0; }

/* ================= Tablet und PC ================= */
/* Ab Tablet-Breite: breitere App, Kästen in Spalten nebeneinander. Live-Spiel und Anmeldung bleiben einspaltig. */
@media (min-width: 760px) {
  #app { max-width: 1240px; }
  #navi { max-width: 1240px; }
  .modalBox { max-width: 720px; }
  body:not([data-ansicht="live"]):not([data-ansicht="login"]) #inhalt { columns: 370px 3; column-gap: 14px; }
  #inhalt > * { break-inside: avoid; }
  /* Wenige Kästen: nicht künstlich auf Spalten verteilen */
  body:not([data-ansicht="live"]):not([data-ansicht="login"]) #inhalt:not(:has(> .panel:nth-child(3 of .panel))) { columns: 2; }
  body:not([data-ansicht="live"]):not([data-ansicht="login"]) #inhalt:not(:has(> .panel:nth-child(2 of .panel))) { columns: 1; max-width: 900px; margin: 0 auto; width: 100%; box-sizing: border-box; }
  #inhalt > .tabs:nth-child(-n+2), #inhalt > .reihe:first-child, #inhalt > .titelbild, #inhalt > .vollbreit { column-span: all; }
  body[data-ansicht="live"] #inhalt { max-width: 900px; margin: 0 auto; width: 100%; box-sizing: border-box; }
  body[data-ansicht="login"] #inhalt { max-width: 600px; margin: 0 auto; width: 100%; box-sizing: border-box; }
}
/* PC und Tablet quer: Navigation als Leiste links */
@media (min-width: 1180px) {
  #app { max-width: 1500px; padding-left: 104px; box-sizing: border-box; }
  #navi { left: max(0px, calc(50% - 750px)); transform: none; top: 0; bottom: 0; width: 96px; max-width: none;
    grid-template-columns: 1fr; grid-auto-rows: 78px; align-content: start; padding: 84px 8px 0; border-top: 0 !important; border-right: 3px solid var(--n-kontur); gap: 8px !important; }
  #navi button { padding: 10px 0; }
  #inhalt { padding-bottom: 24px; }
  #toast { bottom: 24px; }
}

/* Tabelle: Siege / Unentschieden / Niederlagen */
.liste .sun { color: var(--text-leise, #9fc); font-size: 13px; padding-left: 4px; padding-right: 4px; }

/* Saisonabschluss-Gala */
.galabanner { border: 1px solid rgba(240,192,64,.6); background: linear-gradient(135deg, rgba(240,192,64,.12), transparent); }
.gala { text-align: center; }
.galabuehne { position: relative; height: 190px; border-radius: 14px; margin-bottom: 12px; overflow: hidden;
  background: radial-gradient(ellipse at 50% 0, rgba(255,230,150,.35), transparent 60%), radial-gradient(ellipse at 20% 0, rgba(120,200,255,.18), transparent 50%), #071d29; }
.galakarte { position: absolute; left: 50%; top: 50%; width: 82%; transform: translate(-50%, -50%) rotateY(90deg); opacity: 0; padding: 14px 10px; border-radius: 12px;
  background: #0e2e3e; border: 2px solid #f0c040; box-shadow: 0 10px 30px rgba(0,0,0,.5); }
.galakarte.auf { animation: galaAuf .7s ease-out forwards; }
.galakarte.mein { border-color: #6fdc8f; box-shadow: 0 0 30px rgba(111,220,143,.5); }
.galaicon { font-size: 40px; line-height: 1.1; }
.galawer { font-family: 'Barlow Condensed', sans-serif; font-size: 24px; font-weight: 700; color: #f3cf62; margin-top: 4px; }
.galaliste { text-align: left; font-size: 14px; margin-bottom: 12px; display: grid; gap: 4px; }
@keyframes galaAuf { 0% { transform: translate(-50%, -50%) rotateY(90deg) scale(.8); opacity: 0; } 60% { transform: translate(-50%, -50%) rotateY(-8deg) scale(1.04); opacity: 1; } 100% { transform: translate(-50%, -50%) rotateY(0) scale(1); opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .galakarte.auf { animation: none; transform: translate(-50%, -50%); opacity: 1; } }

/* Taktiktafel: Figuren in Vereinsfarben */
.figur svg.figsvg { height: 42px; width: auto; display: block; margin: 0 auto; filter: drop-shadow(0 2px 0 rgba(0,0,0,.45)); pointer-events: none; }
.figur.leer svg.figsvg { opacity: .3; }
/* Hauptmenü bearbeiten */
.menuebtn { float: right; margin: -3px -4px -3px 8px; padding: 2px 8px !important; font-size: 12px !important; }
.menuehilfe { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding-bottom: 0; }
.hauptmenue.bearbeiten .mknopf { touch-action: none; cursor: grab; animation: wackeln .35s ease-in-out infinite alternate; outline: 2px dashed rgba(240,192,64,.6); outline-offset: 1px; }
.hauptmenue.bearbeiten .mknopf:nth-child(2n) { animation-delay: -.17s; }
.hauptmenue.bearbeiten .mknopf.zieht { animation: none; transform: scale(1.12); z-index: 3; position: relative; outline-color: #f0c040; box-shadow: 0 6px 16px rgba(0,0,0,.5); }
@keyframes wackeln { from { transform: rotate(-1.6deg); } to { transform: rotate(1.6deg); } }
@media (prefers-reduced-motion: reduce) { .hauptmenue.bearbeiten .mknopf { animation: none; } }

/* Kabine: Einzelgespräche */
.kgwahl { display: grid; gap: 8px; }
.kgwahl .knopf { display: flex; flex-direction: column; align-items: flex-start; text-align: left; padding: 10px 12px; text-transform: none; }
.kgwahl .knopf b { font-size: 15px; }
.kgwahl .knopf span { font-family: inherit; font-weight: 400; opacity: .85; letter-spacing: 0; }

/* Jugend: hoch zu den Profis oder in die U23 */
.hochwahl { display: flex; flex-direction: column; gap: 4px; align-items: stretch; }
.hochwahl .knopf { margin: 0; padding: 4px 8px; }
.vj_abzug{background:#c0392b;color:#fff}
label.schalter > span:first-child{flex:1;min-width:0;margin-right:10px}

.lbtab td,.lbtab th{padding-left:4px;padding-right:4px}.lbtab th{font-size:11px}

.verhandlung.wunsch{box-shadow:inset 3px 0 #f2c230}

.wap{position:relative}.wap .u23mark{position:absolute;right:-3px;bottom:-3px;font:700 9px/1 Arial;background:#0b1c2c;color:#f2c230;border-radius:3px;padding:1px 2px}

/* 7 Knöpfe unten (Handy/Tablet) */
@media (max-width: 1179px) {
  #navi { grid-template-columns: repeat(7, 1fr) !important; }
  #navi .nbild { width: 34px !important; height: 28px !important; }
  #navi { gap: 2px !important; padding-left: 2px !important; padding-right: 2px !important; }
  #navi button span { font-size: 9.5px !important; letter-spacing: 0 !important; max-width: 100%; overflow: hidden; }
}

/* ===== Aus dem Original (02.11.2026) ===== */
.scrollx{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tabsteuer{display:grid;gap:6px;padding-bottom:4px}
.tabsteuer .reihe{gap:5px}
.eingabe.klein{padding:4px 6px;font-size:13px}
.formkette{display:inline-flex;gap:2px}
.formkette i,.kchips i{font-style:normal;font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:11px;line-height:16px;min-width:16px;text-align:center;border-radius:3px;color:#fff;padding:0 2px}
.fs{background:var(--n-gruen)}.fu{background:#8a8f96}.fn{background:var(--n-rot)}
.liste.tabplus td,.liste.tabplus th{padding:5px 3px}
@media (max-width:460px){.liste.tabplus .formsp{display:none}}
.werte5{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:11.5px}
.liste.paarungen td{vertical-align:top}
.liste.staerken td,.liste.staerken th{padding:5px 4px;white-space:nowrap}
.liste.staerken th[data-stsort]{cursor:pointer}
.minutengitter{border-collapse:separate;border-spacing:2px;font-size:12px;font-variant-numeric:tabular-nums;margin:6px}
.minutengitter th{font-family:'Barlow Condensed',sans-serif;color:var(--n-text-leise);font-weight:600;padding:2px}
.minutengitter td{background:#3a4650;min-width:26px;text-align:center;padding:4px 2px;border-radius:3px;font-weight:700}
.minutengitter td.mg{background:var(--n-gruen)}.minutengitter td.mr{background:var(--n-rot)}
.erfolgsgrafik{display:grid;gap:6px}
.eg-reihe{display:grid;grid-template-columns:1fr;gap:2px;border-bottom:2px solid #e6f4f4;padding-bottom:2px}
.eg-saeulen{display:flex;gap:4px;height:54px;align-items:flex-end}
.eg-s{flex:1;height:100%;display:flex;align-items:flex-end;justify-content:center}
.eg-s i{display:block;width:60%;max-width:16px;min-height:2px;border-radius:2px 2px 0 0}
.eg-name{font-family:'Barlow Condensed',sans-serif;font-weight:700;color:var(--n-text-leise);text-align:center;font-size:14px}
.eg-jahre{display:flex;gap:4px;font-size:11px;color:var(--n-text-leise)}.eg-jahre span{flex:1;text-align:center}
.infotafel{display:grid;grid-auto-flow:dense;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:6px;padding:8px}
.kasten{background:var(--n-flaeche2);border:2px solid var(--n-kontur);border-radius:9px;padding:6px;min-height:84px;display:flex;flex-direction:column;gap:3px;overflow:hidden}
.kasten.breit{grid-column:span 2}
.kasten.klickbar{cursor:pointer}.kasten.klickbar:active{transform:translateY(1px)}
.ktitel{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:12px;color:var(--n-gelb);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kinhalt{flex:1;display:flex;flex-direction:column;justify-content:center;gap:3px}
.kgross{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:28px;line-height:1}
.kq{font-family:'Barlow Condensed',sans-serif;font-weight:800;font-size:24px;line-height:1}
.kmini{display:grid;gap:2px}.kmini span{display:grid;grid-template-columns:10px 1fr;align-items:center;gap:4px;font-size:10px;color:var(--n-text-leise)}
.kmini i{display:block;height:5px;background:var(--n-teal-hell);border-radius:2px}
.kpaar{display:flex;align-items:center;gap:8px}
.kkal{display:flex;flex-direction:column;align-items:center;background:#f4efe2;color:#222;border-radius:6px;padding:2px 10px;align-self:center}
.kkal b{font-family:'Barlow Condensed',sans-serif;font-size:26px;line-height:1}.kkal small{font-size:10px;font-weight:700}
.kchips{display:flex;flex-wrap:wrap;gap:3px}.kchips i{font-size:12px;line-height:20px;padding:0 4px}
.knews{margin:0;padding-left:16px;font-size:12px}.knews li{margin-bottom:2px}
.kwappen{display:flex;justify-content:center}
.klampen{display:flex;flex-wrap:wrap;gap:3px}.klampen .lampe{padding:2px}
.tafelliste li{display:flex;align-items:center;gap:4px}
.totoschein td{padding:4px 3px}
.tototipp{white-space:nowrap}.tototipp button{width:30px;height:28px;margin-left:2px;border:2px solid var(--n-kontur);border-radius:6px;background:#f4efe2;color:#222;font-weight:800}
.tototipp button.an{background:var(--n-rot);color:#fff}
.mtliste td{padding:5px 4px}
.spzziel{min-width:30px;padding:2px 6px!important}
.lagerkarte{position:relative;max-width:420px;margin:0 auto;border:3px solid var(--n-kontur);border-radius:10px;overflow:hidden}
.lagerkarte img{display:block;width:100%}
.lagerflagge{position:absolute;width:30px;height:34px;transform:translate(-30%,-30%);border:0;background:transparent;cursor:pointer}
.lagerflagge::before{content:'';position:absolute;left:4px;top:2px;width:22px;height:22px;border-radius:50%;border:3px solid transparent}
.lagerflagge.an::before{border-color:var(--n-gelb);box-shadow:0 0 0 3px rgba(0,0,0,.5),0 0 12px var(--n-gelb);animation:blinken 1.2s infinite}
.lagerinfo{margin-top:6px}.lagerinfo .sterne{color:var(--n-gelb);letter-spacing:2px}
.lagerregler{display:grid;gap:6px;margin-top:8px}
.lagerregler label{display:grid;grid-template-columns:80px 1fr 44px;align-items:center;gap:8px;font-size:14px}
.lagerregler input{width:100%}
.siegerbild{position:fixed;inset:0;z-index:999;background:#000;display:flex;align-items:center;justify-content:center;cursor:pointer;animation:szeneEin .4s}
.siegerbild img{width:100%;height:100%;object-fit:cover;opacity:.92}
.siegertext{position:absolute;left:0;right:0;bottom:6%;text-align:center;display:flex;flex-direction:column;gap:4px;text-shadow:0 2px 6px #000,0 0 18px #000}
.siegertext b{font-family:'Barlow Condensed',sans-serif;font-size:clamp(28px,7vw,54px);color:var(--n-gelb);letter-spacing:.04em;text-transform:uppercase}
.siegertext span{font-family:'Barlow Condensed',sans-serif;font-size:clamp(20px,5vw,34px);font-weight:700;color:#fff}
.siegertext small{color:#ddd;font-size:12px}
.konfetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.konfetti i{position:absolute;top:-20px;width:8px;height:14px;border-radius:2px;animation:konfetti 3.2s linear infinite}
@keyframes konfetti{0%{transform:translateY(0) rotate(0)}100%{transform:translateY(110vh) rotate(720deg)}}
@media (prefers-reduced-motion: reduce){.konfetti{display:none}.lagerflagge.an::before{animation:none}}
.nw{white-space:nowrap}
.taboptionen summary{cursor:pointer;color:var(--n-text-leise);padding:2px 0}
.taboptionen[open] summary{margin-bottom:5px}
.taboptionen .reihe{margin-bottom:5px}
