/* =====================================================================
   Design-Politur v2 - wird NACH app.css geladen und ergaenzt/verfeinert nur.
   Inhalt: Design-Tokens, Karten, Interaktionen, Kennzahlen, Tabellen.
   ===================================================================== */

/* ---------- 1. Design-Tokens ---------- */
:root{
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px; --space-6:32px;
  --fs-xs:12px; --fs-sm:13px; --fs-md:14.5px; --fs-lg:18px; --fs-xl:clamp(22px,3.2vw,30px);
  --radius-sm:8px; --radius-lg:18px;
  --ease:cubic-bezier(.2,.7,.2,1); --dur:.16s;
  --shadow-sm:0 2px 8px rgba(0,0,0,.28);
  --shadow-md:0 10px 28px rgba(0,0,0,.38);
  --ring:0 0 0 3px rgba(255,210,63,.26);
  --surface-hi:rgba(255,255,255,.035);
  --line-soft:rgba(255,255,255,.06);
}

/* ---------- 2. Karten ---------- */
.card{
  background:linear-gradient(180deg,var(--surface-hi),transparent 55%),var(--panel);
  box-shadow:var(--shadow-md),inset 0 1px 0 var(--line-soft);
  transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease);
}
a.card,.card.is-link{color:inherit;text-decoration:none;display:block}
a.card:hover,.card.is-link:hover{transform:translateY(-2px);border-color:rgba(255,210,63,.4);text-decoration:none}

/* Spielkarten: Statusleiste links, Anheben beim Darueberfahren */
.game-card{position:relative}
.game-card::before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:3px;border-radius:0 3px 3px 0;background:var(--line);transition:background var(--dur)}
/* Kein transform auf der Karte: sonst wird das fest positionierte ⋯-Menue relativ zur Karte verschoben. */
.game-card:hover{border-color:rgba(255,210,63,.4);box-shadow:var(--shadow-md),0 6px 18px rgba(0,0,0,.18)}
.game-card:has(details.more[open]){z-index:5}
.game-card.is-live::before{background:var(--ok);box-shadow:0 0 12px var(--ok)}
.game-card.is-live{border-color:rgba(52,196,122,.4)}
.game-card:has(.pill.club)::before{background:var(--info)}

/* ---------- 3. Interaktionen ---------- */
.btn{transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease),transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-sm)}
.btn:active{transform:translateY(0);box-shadow:none}
.btn.primary{background:linear-gradient(180deg,#ff8f33,var(--accent));box-shadow:0 4px 14px rgba(255,122,24,.28)}
.btn.primary:hover{background:linear-gradient(180deg,#ffe277,var(--accent-2));box-shadow:0 6px 18px rgba(255,210,63,.3)}
.btn:disabled,.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}

/* sichtbarer Fokus fuer Tastatur und Screenreader-Nutzung */
:where(a,button,summary,[tabindex]):focus-visible{outline:2px solid var(--accent-2);outline-offset:2px;border-radius:6px}
input:focus,select:focus,textarea:focus{box-shadow:var(--ring)}
input,select,textarea{transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}

.tab-btn,.chip,.pill,.tk-pill{transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease)}
.tab-btn:hover{color:var(--ink);border-color:var(--accent)}
.more-menu{animation:pop .14s var(--ease) both;transform-origin:top right}
header.nav nav details.nav-group[open]>.nav-group-menu{animation:pop .14s var(--ease) both;transform-origin:top left}

@keyframes pop{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.45}}
@media (prefers-reduced-motion:no-preference){
  /* nur "backwards": nach dem Einblenden greifen die normalen Hover-Transformationen wieder */
  main>.card,main .game-card,main .gcol>.card,main .gl-team,main .page-head{animation:rise .34s var(--ease) backwards}
  .game-card.is-live::before{animation:pulse-dot 1.8s ease-in-out infinite}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ---------- 4. Kennzahlen ---------- */
.num-xl{font-family:'Oswald',sans-serif;font-size:clamp(34px,5vw,48px);font-weight:700;line-height:1;letter-spacing:.01em}
.num-lg{font-family:'Oswald',sans-serif;font-size:28px;font-weight:600;line-height:1.05}
.num-md{font-family:'Oswald',sans-serif;font-size:20px;font-weight:600;line-height:1.1}
.kpi-lbl{display:block;font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.07em;color:var(--ink-dim);font-weight:600}
.kpi-sub{display:block;font-size:var(--fs-xs);color:var(--ink-dim)}
.kpi{padding:var(--space-3) var(--space-4);border:1px solid var(--line);border-radius:var(--radius);background:var(--panel-2)}
.kpi .num-lg,.kpi .num-xl{color:var(--accent-2);margin:2px 0}
.kpi.good .num-lg,.kpi.good .num-xl{color:var(--ok)}
.kpi.bad .num-lg,.kpi.bad .num-xl{color:#ff8a98}

/* ---------- 5. Tabellen ---------- */
table tbody tr{transition:background var(--dur)}
table tbody tr:hover td{background:rgba(255,255,255,.028)}
.stat-table tbody tr:nth-child(even) td,.pl-table tbody tr:nth-child(even) td{background:rgba(255,255,255,.014)}
.stat-table tbody tr:hover td,.pl-table tbody tr:hover td{background:rgba(255,210,63,.06)}
th{border-bottom-width:2px}

/* erste (Namens-)Spalte bleibt beim seitlichen Scrollen stehen */
.stat-table th:first-child,.stat-table td:first-child{position:sticky;left:0;z-index:2;background:var(--panel);box-shadow:1px 0 0 var(--line)}
.stat-table thead th:first-child{z-index:3}
.pl-table th:nth-child(2),.pl-table td:nth-child(2){position:sticky;left:0;z-index:2;background:var(--panel);box-shadow:1px 0 0 var(--line)}
.pl-table thead th:nth-child(2){z-index:4}
.pl-table tr:hover td:nth-child(2),.stat-table tr:hover td:first-child{background:#222d37}

/* Werte-Faerbung nach Hoehe: <td class="heat" style="--v:.0-1"> (gut) bzw. class="heat bad" */
.heat{--v:0;background:color-mix(in srgb,var(--heat,var(--ok)) calc(var(--v) * 42%),transparent)!important;border-radius:6px}
.heat.bad{--heat:var(--err)}

/* ---------- 6. Hilfsklassen (ersetzen haeufige style-Attribute in den Templates) ---------- */
.mt-14{margin-top:14px}
.card-h{margin:0 0 4px;font-size:14px}
.card-sub{margin:0 0 10px;font-size:12px}
.card-sub-lg{margin:0 0 10px;font-size:12.5px}
.ta-l{text-align:left}
.m-b4{margin:0 0 4px}
.m-0{margin:0}
.fs-13{font-size:13px}
.fs-14{font-size:14px}
.fs-125{font-size:12.5px}
.note{margin:8px 0 0;font-size:13.5px}
.flex-wrap-8{display:flex;flex-wrap:wrap;gap:8px}
.scroll-x{overflow-x:auto}
.fw-700{font-weight:700}

/* Mobile Bottom-Navigation */
.bottom-nav{display:none}
@media(max-width:860px){
  .bottom-nav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;
    background:color-mix(in srgb,var(--panel) 92%,transparent);backdrop-filter:blur(10px);
    border-top:1px solid var(--line);padding:4px 4px calc(4px + env(safe-area-inset-bottom))}
  .bottom-nav a,.bottom-nav button{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;
    padding:6px 2px;border:0;background:none;color:var(--ink-dim);font:inherit;font-size:11px;
    border-radius:10px;text-decoration:none;cursor:pointer}
  .bottom-nav .bn-i{font-size:19px;line-height:1}
  .bottom-nav a.active{color:var(--accent-2);background:var(--panel-2)}
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .cookie-banner{bottom:calc(72px + env(safe-area-inset-bottom))}
  /* Oberer Header entfaellt mobil komplett - Navigation nur unten ("Mehr" = Menue-Sheet) */
  header.nav{display:none}
  main{padding-top:calc(14px + env(safe-area-inset-top))}
  body.more-open{overflow:hidden}
  .more-sheet{position:fixed;inset:0;z-index:60}
  .more-sheet[hidden]{display:none}
  .more-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);animation:fadein .15s ease both}
  .more-panel{position:absolute;left:0;right:0;bottom:0;max-height:78vh;overflow-y:auto;
    background:var(--panel);border-top:1px solid var(--line);border-radius:18px 18px 0 0;
    padding:8px 14px calc(76px + env(safe-area-inset-bottom));box-shadow:0 -12px 34px rgba(0,0,0,.35);
    animation:sheetup .2s cubic-bezier(.2,.8,.2,1) both}
  .more-grip{width:42px;height:4px;border-radius:4px;background:var(--line);margin:4px auto 10px}
  .more-h{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-dim);margin:14px 4px 4px}
  .more-link{display:block;padding:12px;border-radius:10px;color:var(--ink);text-decoration:none;font-size:15px}
  .more-link.active{color:var(--accent-2);background:var(--panel-2)}
  .more-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:16px;padding-top:12px;border-top:1px solid var(--line)}
  .more-foot .user{flex:1;color:var(--ink-dim);font-size:13px}
  @keyframes sheetup{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
  @keyframes fadein{from{opacity:0}to{opacity:1}}
}

.pl-chart{margin:0 0 12px;color:var(--ink-dim)}
.pl-chart svg{display:block}
.pl-chart-l{display:flex;justify-content:space-between;font-size:11px;color:var(--ink-dim)}

/* Hell-Modus */
:root[data-theme="light"]{
  --bg:#f3f6f9; --panel:#ffffff; --panel-2:#eaf0f5; --line:#d3dde5;
  --ink:#16222b; --ink-dim:#5b707e; --accent:#e8650a; --accent-2:#b85400;
  --shadow:0 10px 28px rgba(20,40,60,.12); color-scheme:light;
}
:root[data-theme="light"] body{
  background:radial-gradient(1100px 600px at 85% -10%,rgba(255,122,24,.07),transparent 60%),
             radial-gradient(900px 500px at -10% 110%,rgba(46,155,214,.07),transparent 55%),var(--bg)}
.theme-toggle{font-size:15px;padding:4px 10px}
/* Balkendiagramm */
.hbars{display:grid;gap:6px}
.hbar{display:grid;grid-template-columns:minmax(90px,200px) 1fr 80px;gap:10px;align-items:center;font-size:13px}
.hb-n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hb-t{background:var(--panel-2);border-radius:6px;height:14px;overflow:hidden}
.hb-t i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));border-radius:6px}
.hb-v{text-align:right;color:var(--ink-dim);font-variant-numeric:tabular-nums}
@media(max-width:560px){.hbar{grid-template-columns:90px 1fr 64px;gap:6px;font-size:12px}}

/* Hell-Modus: Pastell-Textfarben abdunkeln */
:root[data-theme="light"]{--c-ok:#17794a;--c-err:#b3263a;--c-warn:#9a5a00;--c-info:#1d6f9e;--c-guest:#6a3fa8}
:root[data-theme="light"] .btn.danger,
:root[data-theme="light"] .flash.error,
:root[data-theme="light"] .tk-pill.loss,
:root[data-theme="light"] .more-menu .danger-item{color:var(--c-err)}
:root[data-theme="light"] .flash.success,
:root[data-theme="light"] .pill.pub,
:root[data-theme="light"] .pill.public,
:root[data-theme="light"] .tk-pill.win,
:root[data-theme="light"] .steps li.done,
:root[data-theme="light"] .steps li.done::before{color:var(--c-ok)}
:root[data-theme="light"] .pill.members,
:root[data-theme="light"] .pill.club{color:var(--c-info)}
:root[data-theme="light"] .pill.private{color:var(--c-warn)}
:root[data-theme="light"] [style*="#ff9aa6"],:root[data-theme="light"] [style*="#ff5b6e"],:root[data-theme="light"] [style*="#e0626f"]{color:var(--c-err)!important}
:root[data-theme="light"] [style*="#7be0a4"]{color:var(--c-ok)!important}
:root[data-theme="light"] [style*="#ffd27a"],:root[data-theme="light"] [style*="#ffb454"]{color:var(--c-warn)!important}
:root[data-theme="light"] [style*="#b394e0"]{color:var(--c-guest)!important}
:root[data-theme="light"] [style*="rgba(255,255,255,.03)"]{background:rgba(0,0,0,.03)!important}

/* Detail-Dialog: Netz nicht ueberlagern lassen */
.net-v{flex:0 0 28px;position:relative;z-index:1}
.court2 .zone{min-width:0;overflow:hidden;overflow-wrap:anywhere;word-break:break-word;line-height:1.25}
.court2 .zone .nm{max-width:100%;padding:0 6px;text-align:center;white-space:normal;overflow-wrap:anywhere}

/* Einklappbare Karten */
.att-sum{display:flex;justify-content:space-between;align-items:center;gap:10px;cursor:pointer;list-style:none}
.att-sum::-webkit-details-marker{display:none}
.att-sum h2::before{content:"\25B8";display:inline-block;margin-right:8px;transition:transform .15s var(--ease,ease)}
.att-details[open]>.att-sum h2::before{transform:rotate(90deg)}

/* Anwesenheits-Statistik */
.att-kpis{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.att-kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.att-kpi strong{font-size:28px;font-family:'Oswald',sans-serif;line-height:1.1}
.att-kpi-h{font-size:13px;font-weight:600}
.att-table th,.att-table td{text-align:center;padding:8px 10px;white-space:nowrap}
.att-table .l{text-align:left}
.att-table .att-g-t{background:color-mix(in srgb,var(--info) 8%,transparent)}
.att-table .att-g-g{background:color-mix(in srgb,var(--accent) 8%,transparent)}
.att-table tr.att-grp th{border-bottom:1px solid var(--line)}
.att-table td.att-g-t:nth-child(2),.att-table th.att-g-g:first-child,.att-table td.att-g-g:nth-child(4){border-left:1px solid var(--line)}
.att-q{display:inline-block;min-width:46px;padding:1px 8px;border-radius:999px;font-weight:600;font-size:12.5px}
.att-q.ok{background:color-mix(in srgb,var(--ok) 20%,transparent);color:var(--c-ok,#7be0a4)}
.att-q.mid{background:color-mix(in srgb,var(--accent-2) 20%,transparent);color:var(--c-warn,#ffd27a)}
.att-q.bad{background:color-mix(in srgb,var(--err) 20%,transparent);color:var(--c-err,#ff9aa6)}
@media(max-width:560px){.att-kpis{grid-template-columns:1fr}}
.att-details>.card-sub-lg:first-of-type{margin-top:10px}

/* Hell-Modus: Kopfleiste folgt den Farb-Variablen */
:root[data-theme="light"] header.nav{background:rgba(255,255,255,.88)}
:root[data-theme="light"] header.nav .brand{color:var(--ink)}
:root[data-theme="light"] header.nav .user{color:var(--ink-dim)}
:root[data-theme="light"] header.nav nav a.active,
:root[data-theme="light"] header.nav nav details.nav-group.is-active>summary{color:var(--accent-2)}
:root[data-theme="light"] header.nav nav .nav-group-menu{box-shadow:0 14px 34px rgba(20,40,60,.16)}

/* Android-App (User-Agent VBTrainerApp): Navigation, Anmeldung und Systemleisten liegen in der App */
html.in-app header.nav,
html.in-app .bottom-nav,
html.in-app .more-sheet,
html.in-app .cookie-banner,
html.in-app .app-foot{display:none!important}
html.in-app body{padding-bottom:0!important}
html.in-app main{padding-top:14px}
html.in-app{-webkit-tap-highlight-color:transparent}
html.in-app body{overscroll-behavior-y:contain}

/* Startaufstellungen je Satz (Spiel-Auswertung) */
.lu-switch{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.lu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px;margin-top:10px}
.lu-set{border:1px solid var(--border,#d8dde6);border-radius:12px;padding:10px;background:var(--surface,transparent)}
.lu-head{font-weight:700;font-size:14px;margin-bottom:6px}
.lu-team{font-size:12px;color:var(--muted,#6b7280);text-align:center;margin:2px 0}
.lu-court{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.lu-net{height:3px;background:currentColor;opacity:.45;border-radius:2px;margin:5px 0}
.lu-cell{position:relative;min-height:62px;border:1px solid var(--border,#d8dde6);border-radius:8px;padding:14px 4px 4px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.2;overflow:hidden}
.lu-cell.empty{opacity:.45}
.lu-cell.setter{border-color:#e08a00;box-shadow:inset 0 0 0 1px #e08a00}
.lu-z{position:absolute;top:2px;left:5px;font-size:10px;color:var(--muted,#6b7280)}
.lu-n{font-size:14px}
.lu-name{font-size:11px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lu-pos{font-size:10px;color:var(--muted,#6b7280)}

/* Tabelle auf der Gegner-Uebersicht */
.lg-table td,.lg-table th{padding:5px 6px;font-size:13px;text-align:center}
.lg-table td.ta-l,.lg-table th.ta-l{text-align:left}
.lg-table tr.lg-own td{background:rgba(224,138,0,.14);font-weight:600}

/* Live-Ticker-Stand in den Spiel-Kacheln */
.tk-card{margin-top:10px;padding:7px 10px;border:1px solid var(--line,#2a3445);border-radius:10px;background:var(--panel-2,rgba(255,255,255,.04));font-size:13.5px;line-height:1.4}
.tk-card[hidden]{display:none}
.tk-card-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#e5484d;margin-right:6px;animation:tkpulse 1.4s infinite}
.tk-card-pts{font-family:Oswald,sans-serif;font-size:16px;padding:0 4px}
@keyframes tkpulse{50%{opacity:.35}}

/* Sponsoren-Logos: transparent, wie hochgeladen */
.sp-logo{display:inline-flex;align-items:center;justify-content:center;min-width:70px;max-width:110px;padding:6px 8px;border-radius:8px;font-size:11px;color:var(--ink-dim,#8a94a6);text-align:center}
.sp-logo img{display:block;max-width:90px;max-height:60px;object-fit:contain}

/* Teilen / QR-Code fuer Link-Felder */
.share-bar{display:inline-flex;gap:6px;flex-wrap:wrap;margin:6px 0 0 0;vertical-align:middle}
.share-bar .btn{white-space:nowrap}
.share-modal{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.65);display:flex;align-items:center;justify-content:center;padding:16px}
.share-box{background:var(--panel,#1c2733);color:var(--ink,#e8edf3);border:1px solid var(--line,#2a3445);border-radius:16px;padding:18px;max-width:380px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.share-box h3{margin:0 0 12px;font-size:15px;text-align:center}
.share-qr{width:min(300px,100%);margin:0 auto}
.share-url{margin:12px 0 0;font-size:11.5px;word-break:break-all;text-align:center;opacity:.75}
.share-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:14px}
.share-toast{position:fixed;left:50%;bottom:84px;transform:translateX(-50%);z-index:1100;background:#111;color:#fff;padding:8px 14px;border-radius:999px;font-size:13px;transition:opacity .4s}
.share-toast.out{opacity:0}

/* Auswahl-Badges (statt Checkboxen): <label class="rchip"><input type="checkbox"><span>Text</span></label> */
.rchip{position:relative;display:inline-block;margin:0 6px 6px 0;cursor:pointer;font-weight:400;flex-direction:row}
.rchip input{position:absolute;opacity:0;pointer-events:none;width:auto}
.rchip span{display:inline-block;padding:6px 13px;border:1px solid var(--line);border-radius:999px;font-size:13.5px;color:var(--ink-dim);background:var(--panel-2);transition:.12s;line-height:1.3}
.rchip input:checked+span{background:rgba(255,184,0,.16);border-color:var(--accent-2);color:var(--accent-2);font-weight:600}
.rchip input:checked+span::before{content:'✓ '}
.rchip input:focus-visible+span{outline:2px solid var(--accent-2)}
.rchip input:disabled+span{opacity:.6;cursor:default}

/* Glöckchen */
.bell-btn{position:relative}
.bell-badge{position:absolute;top:-6px;right:-6px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#ff5d73;color:#fff;font-size:11px;line-height:17px;text-align:center;font-weight:700}
.bell-fab{display:none}
html.in-app .bell-fab{display:flex;position:fixed;top:calc(env(safe-area-inset-top,0px) + 8px);right:10px;z-index:60;width:38px;height:38px;border-radius:50%;align-items:center;justify-content:center;background:var(--panel-2,#1b2636);border:1px solid var(--line,#2a3a52);text-decoration:none;font-size:18px}

/* ---- Termin-Formulare: Zeitwahl, Erinnerung, Serie ---- */
.tf .tf-row{display:flex;align-items:center;gap:6px}
.tf .tf-row b{color:var(--ink-dim);font-size:18px}
.tf select{flex:1;min-width:0;height:46px;font-size:17px;font-family:Oswald,system-ui,sans-serif;text-align:center;text-align-last:center;padding:0 6px;border-radius:10px}
.tf .tf-unit{font-size:12.5px;color:var(--ink-dim);white-space:nowrap}
.tf.tf-empty .tf-m{opacity:.4}
.rem-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:10px}
.rem .rem-in{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.rem .rem-in input{width:64px;height:42px;text-align:center;font-size:16px}
.rem .rem-in small{font-size:12px;color:var(--ink-dim)}
.rem-presets{display:flex;gap:5px;flex-wrap:wrap;margin-top:6px}
.rem-presets button{padding:5px 10px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:var(--ink);font-size:12.5px;cursor:pointer}
.rem-calc{margin-top:6px;font-size:13px;color:var(--accent-2);font-weight:600;min-height:18px}
fieldset.rec{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:6px 0 12px}
fieldset.rec legend{font-size:12.5px;padding:0 6px}
fieldset.rec select{width:100%;height:44px;font-size:16px}
.rec-preview{margin-top:8px;font-size:13px;color:var(--accent-2)}
.rchip.rchip-lock{opacity:.7}
@media(max-width:700px){.rem-grid{grid-template-columns:1fr}}

/* Termin-Notizen & Karten-Links */
.date-note{margin:10px 0;padding:10px 12px;border-radius:10px;background:var(--surface-2,rgba(127,127,127,.1));font-size:14px;line-height:1.45}
.maps-link{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* Zusatzmodule aus: Bedienelemente ausblenden (serverseitig zusaetzlich gesperrt) */
.no-team-module .team-mod, .no-team-module .att-form, .no-team-module .ec-note { display: none !important; }
.no-sams-module .sams-mod { display: none !important; }
.no-sheet-module .sheet-mod { display: none !important; }

/* Kasse & Strafen: grosse, augenfreundliche Darstellung auf Handys */
@media (max-width: 760px) {
  .r-app_my_cash, .r-app_my_fines, .r-app_my_cash_home, .r-app_team_cash { font-size: 17px; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .page-head h1 { font-size: 26px; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .page-head { flex-direction: column; align-items: stretch; gap: 10px; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .page-head .btn { width: 100%; justify-content: center; text-align: center; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .card { padding: 16px; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .card h2 { font-size: 19px !important; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .muted { font-size: 15px !important; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .grid.cols-2 { grid-template-columns: 1fr !important; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .kpi { font-size: 40px !important; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .field > span { font-size: 15px; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) input:not([type=checkbox]):not([type=radio]),
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) select,
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) textarea { min-height: 50px; font-size: 17px; max-width: none !important; width: 100%; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .btn { min-height: 50px; font-size: 17px; padding: 10px 18px; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .btn.sm { min-height: 46px; font-size: 16px; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) form .btn[type=submit] { width: 100%; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) .rchip { font-size: 16px; padding: 12px 14px; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) ul li { font-size: 16px !important; padding: 10px 0 !important; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) table { display: block; overflow-x: auto; font-size: 15px; }
  :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) td, :is(.r-app_my_cash, .r-app_my_fines, .r-app_team_cash) th { padding: 10px 8px; }
  .r-app_my_fines .card > div > div[style*="border-radius:10px"] { padding: 14px !important; font-size: 16px; gap: 12px !important; }
  .r-app_my_fines .card > div > div[style*="border-radius:10px"] form { flex: 1 1 45%; }
  .r-app_my_fines .card > div > div[style*="border-radius:10px"] form .btn { width: 100%; }
}

/* Admin: mobil nutzbar */
@media (max-width:820px){
  .r-app_admin .page-head{flex-direction:column;align-items:stretch;gap:10px}
  .r-app_admin .card{padding:14px;overflow:visible}
  .r-app_admin .adm-grid,.r-app_admin .grid{grid-template-columns:1fr !important}
  .r-app_admin table.adm{display:block;width:100%}
  .r-app_admin table.adm thead{display:none}
  .r-app_admin table.adm tbody{display:block}
  .r-app_admin table.adm tr{display:block;border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:12px;background:var(--panel-2,rgba(127,127,127,.06))}
  .r-app_admin table.adm td{display:block;padding:4px 0 !important;border:0 !important;text-align:left !important;word-break:break-word}
  .r-app_admin table.adm td:first-child{font-size:17px}
  .r-app_admin .lic-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
  .r-app_admin .lic-form > span{flex:1 1 100%;white-space:normal !important;font-size:14px !important}
  .r-app_admin .lic-form select,.r-app_admin .lic-form input[type=date],.r-app_admin .lic-form input[type=text]{flex:1 1 150px;min-height:46px;font-size:16px}
  .r-app_admin .btn{min-height:46px;font-size:16px}
  .r-app_admin .btn.sm{min-height:44px}
  .r-app_admin .req{flex-direction:column;align-items:stretch}
  .r-app_admin .del-club form{min-width:0;width:100%}
}

/* Aufstellung: Feld wie in der Spielauswertung (römische Position, #Nummer, Name) */
.lx-court{border:1px solid var(--line);border-radius:18px;padding:12px;background:var(--panel-2,rgba(127,127,127,.1))}
.lx-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:10px}
.lx-row:last-child{margin-bottom:0}
.lx-pos{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:96px;padding:22px 6px 8px;border:2px solid var(--line);border-radius:14px;text-align:center;overflow:hidden;background:rgba(255,255,255,.02)}
.lx-pos.on{border-color:rgba(230,237,247,.85)}
.lx-pos i{position:absolute;top:6px;left:9px;font-style:normal;font-size:13px;color:var(--muted,#8a98ad);opacity:.75}
.lx-pos b{font-family:Oswald,sans-serif;font-size:24px;line-height:1.05}
.lx-pos span{font-size:15px;line-height:1.15;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lx-pos.over{outline:3px solid var(--accent);outline-offset:-3px;background:rgba(255,122,24,.12)}
.lx-fill{width:100%;display:flex;justify-content:center}
.lx-h{margin:14px 0 8px;font-size:16px}
.lx-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.lx-tab{min-height:44px;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:transparent;color:inherit;font-size:16px;cursor:pointer}
.lx-tab.on{background:var(--accent);color:#181206;border-color:var(--accent);font-weight:700}
.lx-label{margin:14px 0 6px;font-weight:700;font-size:14px}
.lx-pool{display:flex;flex-wrap:wrap;gap:8px;min-height:56px;padding:8px;border:2px dashed var(--line);border-radius:12px}
.lx-drag{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--panel,#1c2733);cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none;font-size:16px;max-width:100%}
.lx-drag b{font-family:Oswald,sans-serif;font-size:18px}
.lx-drag span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lx-drag.sel{outline:3px solid var(--accent)}
.lx-drag.placed{flex-direction:column;gap:0;border:0;background:transparent;padding:0;width:100%;align-items:center}
.lx-drag.placed b{font-size:24px}
.lx-drag.lx-dragging{opacity:.35}
.lx-ghost{position:fixed;z-index:9999;pointer-events:none;transform:translate(-50%,-60%);box-shadow:0 8px 24px rgba(0,0,0,.5);background:var(--panel,#1c2733);width:auto}
.lx-empty{font-size:14px;align-self:center}
.lx-pos .lx-empty{font-size:14px}
.lx-bench{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:10px 0}
.lx-chip{display:inline-block;padding:6px 12px;border-radius:999px;border:1px solid var(--line);font-size:15px}
@media (max-width:560px){.lx-pos{min-height:88px}.lx-pos b{font-size:22px}.lx-row{gap:8px}}

/* Filter-Chips (Termine) */
.tv-teams{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:12px;scrollbar-width:none}
.tv-teams::-webkit-scrollbar{display:none}
button.tv-chip{font:inherit;cursor:pointer;min-height:44px;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font-size:15px;white-space:nowrap;flex:0 0 auto}
button.tv-chip.on{background:var(--accent);border-color:var(--accent);color:#0b1220;font-weight:700}
.lx-pos-tag{font-size:11px;font-weight:700;letter-spacing:.03em;padding:1px 7px;border-radius:999px;border:1px solid var(--line);color:var(--muted,#8a98ad);white-space:nowrap}
#luCopy[hidden]{display:none !important}

.lx-send{display:flex;flex-direction:column;gap:8px;margin:14px 0 10px}
.lx-send .rchip{font-size:16px;padding:12px 14px}

/* Strafe/Betrag: Art und Betrag untereinander, volle Breite */
.kind-amt{display:flex;flex-direction:column;gap:8px}
.kind-amt select,.kind-amt input{width:100%;max-width:none !important;min-height:46px}

/* Strafenkatalog */
.fc-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--panel-2)}
.fc-main{flex:1 1 180px;font-size:16px}
.fc-edit summary{list-style:none;cursor:pointer;display:inline-block}
.fc-edit summary::-webkit-details-marker{display:none}
.fc-edit[open]{flex:1 1 100%}
.fc-edit form{margin-top:10px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
@media (max-width:760px){.fc-row .btn,.fc-row form{flex:1 1 100%;width:100%}.fc-row form .btn{width:100%}}

.lx-rot{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.lx-rot .btn{flex:1 1 180px;min-height:46px;font-size:16px}

/* Profilbilder: klein und dezent */
.avatar{display:inline-block;border-radius:50%;object-fit:cover;vertical-align:middle;border:1px solid var(--line);flex:none}
.avatar.ini{display:inline-flex;align-items:center;justify-content:center;background:var(--panel-2);color:var(--ink-dim,#8a98ad);font-weight:600;font-family:Oswald,sans-serif;letter-spacing:.02em}
.user-link{display:inline-flex;align-items:center;gap:8px;color:inherit;text-decoration:none}
.user-link:hover span{text-decoration:underline}
.wk-av .avatar{width:100%;height:100%;border:0}
@media (max-width:640px){.user-link > span{display:none}}

/* Aufstellung eingeklappt + Taktikboard-Link */
.lx-fold>summary{display:flex;justify-content:space-between;align-items:center;gap:10px;cursor:pointer;list-style:none;font-family:Oswald,sans-serif;font-size:18px;min-height:44px}
.lx-fold>summary::-webkit-details-marker{display:none}
.lx-fold>summary i{font-style:normal;transition:transform .15s;color:var(--ink-dim)}
.lx-fold[open]>summary i{transform:rotate(180deg)}
.lx-pub{font-family:inherit;font-size:12px;font-style:normal;padding:2px 9px;border:1px solid var(--ok);border-radius:999px;color:var(--ok);vertical-align:middle}
.lx-tactic{margin:8px 0 10px}
.lx-tactic .btn{width:100%;justify-content:center;padding:13px;font-size:16px}
@media (min-width:700px){.lx-tactic .btn{width:auto}}

/* ===== Moderner Look: Tabs, weichere Karten, klarere Interaktion ===== */
.vt-bar{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:16px 0 4px;padding:5px;background:var(--panel);border:1px solid var(--line);border-radius:16px;position:sticky;top:6px;z-index:20;backdrop-filter:blur(8px)}
.vt-bar::-webkit-scrollbar{display:none}
.vt-tab{flex:1 0 auto;min-height:44px;padding:8px 16px;border:0;border-radius:12px;background:transparent;color:var(--ink-dim);font:inherit;font-size:15px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s,box-shadow .15s}
.vt-tab:hover{color:inherit}
.vt-tab.on{background:var(--panel-2);color:inherit;box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 2px 8px rgba(0,0,0,.25)}
:root[data-theme="light"] .vt-tab.on{box-shadow:0 1px 4px rgba(20,40,60,.15)}
[data-vt][hidden]{display:none!important}
@media (min-width:900px){.vt-tab{flex:0 0 auto;padding:8px 22px}}
.card{border-radius:18px;box-shadow:0 1px 2px rgba(0,0,0,.18),0 8px 24px -12px rgba(0,0,0,.35);transition:box-shadow .2s,border-color .2s}
:root[data-theme="light"] .card{box-shadow:0 1px 2px rgba(20,40,60,.06),0 8px 24px -14px rgba(20,40,60,.18)}
.btn{border-radius:12px;transition:transform .08s,background .15s,border-color .15s,box-shadow .15s}
.btn:active{transform:scale(.97)}
.btn.primary{box-shadow:0 4px 14px -6px var(--accent,#ffb800)}
input[type=text],input[type=number],input[type=date],input[type=time],input[type=email],input[type=password],select,textarea{border-radius:12px;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--accent-2);box-shadow:0 0 0 3px rgba(255,184,0,.18)}
.page-head h1{letter-spacing:.2px}
@media (max-width:700px){.vt-bar{margin:12px -4px 2px;border-radius:14px}.card{border-radius:16px}}
.hm-open{margin:0 0 12px;padding:11px 14px;border:1px solid var(--accent-2);border-radius:14px;background:rgba(255,184,0,.1);font-size:14.5px;font-weight:600}
.vt-tab.vt-end{order:99;flex:0 0 auto;margin-left:auto;min-width:44px;padding:8px 14px;font-size:18px;line-height:1}
.bday{margin:8px 0 0;padding:8px 12px;border-radius:12px;border:1px solid var(--accent-2);background:rgba(255,184,0,.1);font-size:14.5px;font-weight:600}

/* ===== Anwesenheitsliste im Stil von Sport-Apps: Abschnitte, Avatar, runde Antwort-Buttons ===== */
.sp-list{display:flex;flex-direction:column;gap:6px}
.sp-sec[data-n="0"]{display:none}
.sp-sec>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:14px 2px 6px;border-bottom:2px solid var(--line);font-family:Oswald,sans-serif;font-size:19px}
.sp-sec>summary::-webkit-details-marker{display:none}
.sp-c{display:flex;align-items:center;gap:10px}.sp-c i{font-style:normal;transition:transform .15s;color:var(--ink-dim)}
.sp-sec:not([open])>summary .sp-c i{transform:rotate(-90deg)}
.sp-sec.ok>summary{border-color:var(--ok)}.sp-sec.no>summary{border-color:var(--err)}.sp-sec.un>summary{border-color:var(--accent-2)}
.sp-sub{padding:6px 2px 0;font-size:13px;color:var(--ink-dim)}
.sp-row{padding:10px 0;border-bottom:1px solid var(--line)}
.sp-row.busy{opacity:.55;pointer-events:none}
.sp-main{display:flex;align-items:center;gap:12px}
.sp-av{flex:0 0 44px;height:44px;border-radius:50%;background:var(--panel-2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:Oswald,sans-serif;font-size:17px;color:var(--ink-dim);overflow:hidden}
.sp-av .avatar{width:100%;height:100%;border:0}
.sp-name{flex:1;min-width:0;font-size:16px;line-height:1.25;overflow-wrap:anywhere}
.sp-name small{display:block;font-size:13px;color:var(--ink-dim)}
.sp-name .sp-badge{display:inline-block;margin:2px 4px 0 0;padding:0 8px;border:1px solid var(--accent-2);border-radius:999px;font-size:11px;color:var(--accent-2)}
.sp-name .sp-badge.bad{border-color:#ff9aa6;color:#ff9aa6}
.sp-more-link{color:var(--accent-2);font-weight:600}
.sp-btns{display:flex;gap:6px;flex:none}
.sp-b{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--panel);color:inherit;font:inherit;font-size:19px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s,transform .08s}
.sp-b:active{transform:scale(.92)}
.sp-b.ok.sel{background:rgba(52,196,122,.28);border-color:var(--ok);color:#7be0a4}
.sp-b.un.sel{background:rgba(255,184,0,.2);border-color:var(--accent-2);color:var(--accent-2)}
.sp-b.no.sel{background:rgba(230,57,80,.22);border-color:var(--err);color:#ff9aa6}
.sp-b.more{color:var(--ink-dim)}
.sp-note{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.sp-note input{flex:1 1 200px;min-width:0;padding:11px 12px;font-size:16px;border-radius:12px;border:1px solid var(--line);background:var(--panel);color:inherit}
.sp-extra{margin-top:10px}.sp-extra-btns{display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:520px){.sp-main{flex-wrap:wrap}.sp-name{flex:1 1 calc(100% - 60px)}.sp-btns{width:100%;justify-content:space-between;padding-left:56px}.sp-b{width:46px;height:46px}}

.sp-reason{display:none;margin:4px 0 0 56px}
.sp-sec[data-sec="unsure"] .sp-reason,.sp-sec[data-sec="absent"] .sp-reason{display:block}
.sp-rline{font-size:13px;color:var(--ink-dim);cursor:text;min-height:20px;overflow-wrap:anywhere}
.sp-rline.empty{opacity:.6}
.sp-rinput{width:100%;padding:9px 12px;font-size:16px;border-radius:12px;border:1px solid var(--accent-2);background:var(--panel);color:inherit}
@media(max-width:520px){.sp-reason{margin-left:56px}}
/* Kompakt: Buttons klein rechts auf Hoehe des Namens, Grund direkt unter dem Namen */
.sp-main{flex-wrap:nowrap !important;gap:10px}
.sp-av{flex:0 0 40px;height:40px}
.sp-name{flex:1 1 auto !important;min-width:0;font-size:15.5px}
.sp-btns{width:auto !important;padding-left:0 !important;flex:none;gap:5px;justify-content:flex-end}
.sp-b{width:36px !important;height:36px !important;font-size:16px}
.sp-reason{margin-left:50px !important}
.sp-row{padding:8px 0}
@media(max-width:380px){.sp-b{width:33px !important;height:33px !important}.sp-btns{gap:4px}}

/* Anmerkung/Grund auch bei Zusage: Zeile nur wenn vorhanden, Eintippen per Klick auf den Namen */
.sp-sec[data-sec="present"] .sp-reason{display:block}
.sp-sec[data-sec="present"] .sp-rline.empty{display:none}
.sp-reason.editing{display:block !important}
.sp-name{cursor:pointer}

/* Eigene Antwort in der Termin-Kachel klar hervorheben */
.ec-act .sel{box-shadow:inset 0 0 0 2px currentColor}
.ec-act .ok.sel{background:rgba(52,196,122,.5);color:#7be0a4}.ec-act .no.sel{background:rgba(230,57,80,.45);color:#ff9aa6}.ec-act .un.sel{background:rgba(255,184,0,.45);color:var(--accent-2)}
.ec-act .sel b,.ec-act .sel i{color:inherit}
.ec-me{padding:6px 14px 0;font-size:13.5px;color:var(--ink-dim)}.ec-me b{color:var(--ink)}
.ec-me-present b{color:#7be0a4}.ec-me-absent b{color:#ff9aa6}.ec-me-unsure b{color:var(--accent-2)}
.lx-unsure{font-style:normal;flex:none;width:18px;height:18px;border-radius:50%;background:rgba(255,184,0,.25);border:1px solid var(--accent-2);color:var(--accent-2);font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.lx-q{color:var(--accent-2)}
.bday-list{list-style:none;margin:0;padding:0}
.bday-list li{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:15px}
.bday-list li:last-child{border-bottom:0}
.bday-d{flex:0 0 56px;font-family:Oswald,sans-serif;color:var(--accent-2)}.bday-n{flex:1;min-width:0}.bday-a{color:var(--ink-dim);font-size:13.5px}

/* Gegner: Badge-Filter */
.opp-chips .tv-chip{display:inline-flex;align-items:center;min-height:38px;padding:6px 14px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:inherit;font:inherit;font-size:14px}
.opp-chips .tv-chip.on{background:var(--accent);border-color:var(--accent);color:#0b1220;font-weight:700}

/* App: Seitentitel steckt schon in der nativen Toolbar */
html.in-app .page-head > h1{display:none}
html.in-app .page-head{justify-content:flex-start}

/* Kacheln: leichter Schatten (dunkel: heller Schimmer, hell: dunkler Schatten) */
:root{--tile-shadow:0 0 0 1px rgba(255,255,255,.04),0 6px 22px rgba(255,255,255,.07)}
:root[data-theme="light"]{--tile-shadow:0 1px 2px rgba(15,23,42,.08),0 8px 24px rgba(15,23,42,.14)}
.card,.ec,.kpi-t,.opp-tile,.hero{box-shadow:var(--tile-shadow)}

/* Zu-/Unsicher-/Absage-Zaehler: ueberlappende Badges */
.ec .ec-act{justify-content:center;align-items:center;padding:10px 8px;position:relative}
.ec .ec-act button,.ec .ec-act .cnt{flex:0 0 auto;min-width:96px;min-height:48px;padding:6px 18px;border-radius:999px;border:3px solid var(--panel-2);position:relative;box-sizing:border-box;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.ec .ec-act .ok{background:color-mix(in srgb,#34c47a 28%,var(--panel-2));z-index:3}
.ec .ec-act .un{background:color-mix(in srgb,#ffb800 26%,var(--panel-2));z-index:2;margin-left:-16px}
.ec .ec-act .no{background:color-mix(in srgb,#e63950 26%,var(--panel-2));z-index:1;margin-left:-16px}
.ec .ec-act button.sel{z-index:5;transform:scale(1.06);box-shadow:inset 0 0 0 2px currentColor,0 4px 12px rgba(0,0,0,.35)}
.ec .ec-act .ok.sel{background:color-mix(in srgb,#34c47a 60%,var(--panel-2))}
.ec .ec-act .un.sel{background:color-mix(in srgb,#ffb800 55%,var(--panel-2))}
.ec .ec-act .no.sel{background:color-mix(in srgb,#e63950 55%,var(--panel-2))}
.ec .ec-act .manage.edit{flex:0 0 auto;margin-left:auto;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;border-radius:50%;border:1px solid var(--line);background:var(--panel);font-size:20px;display:flex;align-items:center;justify-content:center;text-decoration:none;color:inherit;box-shadow:none;z-index:6}

/* Trainer-Antworten im Termin */
.tr-row{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center;padding:8px 0;border-top:1px solid var(--line)}
.tr-row:first-of-type{border-top:0}
.tr-name{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis}
.tr-btns{display:flex}
.tr-b{width:42px;height:34px;border-radius:999px;border:2px solid var(--panel);font:inherit;font-size:18px;font-weight:700;cursor:pointer;color:inherit;margin-left:-8px;position:relative;background:var(--panel-2)}
.tr-b:first-child{margin-left:0}
.tr-b.ok{color:#7be0a4}.tr-b.un{color:var(--accent-2)}.tr-b.no{color:#ff9aa6}
.tr-b.ok.sel{background:rgba(52,196,122,.5);z-index:3}.tr-b.un.sel{background:rgba(255,184,0,.45);z-index:3}.tr-b.no.sel{background:rgba(230,57,80,.45);z-index:3}
.tr-note{grid-column:1/-1;width:100%;font-size:13px;padding:6px 10px;border-radius:8px;border:1px solid var(--line);background:var(--panel-2);color:inherit}
#coachList .sp-row[data-st="open"] .sp-rline{display:none}
#coachList .sp-row:last-child{border-bottom:0}