/* ═══════════════════════════════════════════════════════════════════════════
   TVE App – Stylesheet

   Zusammengeführt aus dem Bestand:
     assets/tve-suite.css              → Design-Token, Basis
     modules/navigation/assets/nav.css → Navigation (ohne Mannschafts-Switcher)
     modules/login/class-login.php     → Hintergrund, Vignette, Auth-Karte

   Neu in dieser Datei: das Grundlayout der Seite. Im Altsystem kam es vom
   WordPress-Theme (Blocksy) – die Standalone-App bringt es selbst mit.

   Reihenfolge:
     1  Design-Token
     2  Reset und Grundlayout
     3  Hintergrund-Ebenen
     4  Seitenrahmen (main, footer, flash)
     5  Bausteine (Karten, Buttons, Felder, Badges)
     6  Navigation
     7  Anmeldeseite
     8  Druck
     9  Formulare, Profil und Auth-Ergänzungen
    10  Admin-Center
    11  Tagesansicht
    12  Dashboard und Meine Einsätze
    13  Spieltagkalender und Einsatzreport
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1  Design-Token ─────────────────────────────────────────────────────── */
:root {
    --tve-primary:      #8b0000;   /* wird vom Layout aus den Einstellungen überschrieben */
    --tve-primary-dark: #5c0000;
    --tve-accent:       #7dffb3;
    --tve-error:        #ff9a9a;

    --tve-text:         #ffffff;
    --tve-text-muted:   #ffffff;
    --tve-text-faint:   #ffffff;

    --tve-surface:      rgba(0, 0, 0, 0.32);
    --tve-surface-soft: rgba(255, 255, 255, 0.06);
    --tve-border:       rgba(255, 255, 255, 0.12);
    --tve-border-strong:rgba(255, 255, 255, 0.22);

    --tve-radius:       18px;
    --tve-radius-sm:    12px;
    --tve-radius-xs:    9px;
    --tve-shadow:       0 8px 32px rgba(0, 0, 0, 0.35);

    --tve-font:         'Barlow Semi Condensed', system-ui, -apple-system, sans-serif;
    --tve-max:          1290px;
    --tve-nav-height:   68px;
}

/* ── 2  Reset und Grundlayout ────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; }

body.tve-body {
    min-height: 100dvh;
    font-family: var(--tve-font);
    font-size: 1.02rem;
    line-height: 1.55;
    color: var(--tve-text);
    background: #14100f;
    -webkit-font-smoothing: antialiased;
    display: flex;
    flex-direction: column;
}

body.tve-body--auth {
    justify-content: center;
    align-items: center;
    padding: env(safe-area-inset-top, 1.5rem) 1.25rem env(safe-area-inset-bottom, 1.5rem);
}

a { color: inherit; text-decoration: none; }
a:hover { color: #fff; }

img { max-width: 100%; height: auto; }

button, input, select, textarea { font: inherit; color: inherit; }

code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: .88em;
    background: rgba(0, 0, 0, 0.35);
    padding: .1rem .35rem;
    border-radius: 5px;
}

/* ── 3  Hintergrund-Ebenen ───────────────────────────────────────────────── */
/* Das Bild kommt aus assets/img/ oder aus der Einstellung login_bg.          */

.tve-bg {
    position: fixed; inset: 0; z-index: 0;
    background-color: var(--tve-primary);
    background-size: cover;
    background-position: center top;
    filter: brightness(0.92);
}

.tve-vignette {
    position: fixed; inset: 0; z-index: 1;
    background: radial-gradient(ellipse 65% 65% at 50% 46%,
        rgba(20, 0, 0, 0.00)  0%,
        rgba(20, 0, 0, 0.35) 40%,
        rgba(12, 0, 0, 0.72) 70%,
        rgba(6,  0, 0, 0.92) 100%);
}

.tve-corners {
    position: fixed; inset: 0; z-index: 2;
    background:
        radial-gradient(ellipse 50% 50% at 0%   0%,   rgba(0, 0, 0, 0.55) 0%, transparent 60%),
        radial-gradient(ellipse 50% 50% at 100% 0%,   rgba(0, 0, 0, 0.55) 0%, transparent 60%),
        radial-gradient(ellipse 50% 50% at 0%   100%, rgba(0, 0, 0, 0.55) 0%, transparent 60%),
        radial-gradient(ellipse 50% 50% at 100% 100%, rgba(0, 0, 0, 0.55) 0%, transparent 60%);
}

/* Auf den Inhaltsseiten tritt der Hintergrund zurück – dort zählt die
   Lesbarkeit der Karten. Auf der Anmeldeseite darf das Bild wirken. */
.tve-body:not(.tve-body--auth) .tve-bg {
    filter: brightness(0.38) saturate(0.85);
}
.tve-body:not(.tve-body--auth) .tve-vignette {
    background: radial-gradient(ellipse 70% 70% at 50% 30%,
        rgba(10, 0, 0, 0.35)  0%,
        rgba(8,  0, 0, 0.65) 45%,
        rgba(5,  0, 0, 0.88) 75%,
        rgba(2,  0, 0, 0.96) 100%);
}

/* ── 4  Seitenrahmen ─────────────────────────────────────────────────────── */

.tve-main {
    position: relative;
    z-index: 10;
    flex: 1;
    width: 100%;
    max-width: var(--tve-max);
    margin: 0 auto;
    padding: 2rem 1.5rem 3rem;
}

.tve-footer {
    position: relative;
    z-index: 10;
    padding: 1.5rem;
    text-align: center;
    font-size: .82rem;
    color: var(--tve-text-faint);
}
.tve-footer a:hover { color: var(--tve-text-muted); }
.tve-footer__sep { margin: 0 .5rem; opacity: .5; }

/* Flash-Meldungen */
.tve-flash-wrap { display: flex; flex-direction: column; gap: .6rem; margin-bottom: 1.5rem; }

.tve-flash {
    padding: .8rem 1.1rem;
    border-radius: var(--tve-radius-sm);
    border: 1.5px solid var(--tve-border);
    background: rgba(0, 0, 0, 0.38);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    font-size: .92rem;
}
.tve-flash--success { border-color: rgba(125, 255, 179, 0.45); }
.tve-flash--error   { border-color: rgba(255, 154, 154, 0.45); color: #ffd9d9; }
.tve-flash--info    { border-color: var(--tve-border-strong); }

/* Seitenkopf */
.tve-page__head {
    display: flex;
    align-items: center;
    gap: .9rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}

.tve-page__title {
    font-size: 1.9rem;
    font-weight: 900;
    letter-spacing: .01em;
    line-height: 1.15;
}

.tve-page--narrow { max-width: 520px; margin: 3rem auto; }

/* ── 5  Bausteine ────────────────────────────────────────────────────────── */

.tve-card {
    background: var(--tve-surface);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1.5px solid var(--tve-border);
    border-radius: var(--tve-radius);
    padding: 1.4rem 1.5rem;
    margin-bottom: 1.25rem;
}

.tve-card--sm { padding: 1.1rem 1.25rem; margin-bottom: 0; }

.tve-card--center { text-align: center; padding: 2.5rem 1.75rem; }

.tve-card__icon {
    width: 52px; height: 52px;
    margin: 0 auto 1.1rem;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--tve-surface-soft);
    border: 1.5px solid var(--tve-border);
    color: var(--tve-text-muted);
}
.tve-card__icon svg { width: 24px; height: 24px; }

.tve-card__title { font-size: 1.35rem; font-weight: 800; margin-bottom: .5rem; }
.tve-card__text  { color: #fff; }
.tve-card__note  { margin-top: .9rem; font-size: .85rem; color: var(--tve-text-faint); }

.tve-card__label {
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--tve-text-faint);
    margin-bottom: .3rem;
}
.tve-card__value { font-size: 1.15rem; font-weight: 700; }
.tve-card__sub   { font-size: .82rem; color: var(--tve-text-muted); margin-top: .15rem; }

.tve-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 1rem;
}

.tve-badge {
    display: inline-block;
    padding: .22rem .7rem;
    border-radius: 20px;
    background: rgba(125, 255, 179, 0.16);
    color: var(--tve-accent);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.tve-btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-top: 1.5rem;
    padding: .65rem 1.25rem;
    border: 1.5px solid var(--tve-border-strong);
    border-radius: 999px;
    background: var(--tve-surface-soft);
    font-size: .88rem;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s, border-color .15s;
}
.tve-btn:hover { background: rgba(255, 255, 255, 0.14); border-color: rgba(255, 255, 255, 0.4); }

.tve-btn--primary {
    background: var(--tve-accent);
    border-color: var(--tve-accent);
    color: #0a1f12;
}
.tve-btn--primary:hover { background: #a0ffc8; color: #0a1f12; }

/* Formularfelder */
.tve-field { display: block; margin-bottom: 1rem; }

.tve-field__label {
    display: block;
    margin-bottom: .35rem;
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--tve-text-muted);
}

.tve-field__input {
    width: 100%;
    padding: .7rem .9rem;
    background: rgba(0, 0, 0, 0.55);
    border: 1.5px solid var(--tve-border-strong);
    border-radius: var(--tve-radius-xs);
    color: #fff;
    transition: border-color .2s, background .2s;
}
.tve-field__input:focus {
    outline: none;
    border-color: rgba(125, 255, 179, 0.55);
    background: rgba(0, 0, 0, 0.68);
}

/* ── 6  Navigation ───────────────────────────────────────────────────────── */

.tve-nav-header {
    position: sticky;
    top: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.38);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 1.5px solid var(--tve-border);
}

.tve-nav-inner {
    max-width: var(--tve-max);
    margin: 0 auto;
    padding: 0 1.5rem;
    display: flex;
    align-items: stretch;
    height: var(--tve-nav-height);
    position: relative;
}

/* Logo */
.tve-nav-logo {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding-right: 2rem;
    flex-shrink: 0;
}
.tve-nav-logo__img { height: 42px; width: auto; border-radius: 8px; object-fit: contain; }
.tve-nav-logo__fallback {
    width: 38px; height: 38px;
    background: rgba(255, 255, 255, 0.15);
    border: 1.5px solid rgba(255, 255, 255, 0.25);
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
}
.tve-nav-logo__fallback svg { width: 22px; height: 22px; }
.tve-nav-logo__text {
    font-size: 1.05rem;
    font-weight: 800;
    color: #fff;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.4);
    letter-spacing: .04em;
    line-height: 1.15;
}
.tve-nav-logo__sub {
    display: block;
    font-size: .65rem;
    font-weight: 500;
    color: #fff;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-shadow: none;
}

/* Menü */
.tve-nav-menu {
    display: flex;
    align-items: stretch;
    list-style: none;
    flex: 1;
}
.tve-nav-item { position: static; }

.tve-nav-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 0 1.1rem;
    height: 100%;
    color: #fff;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .07em;
    text-transform: uppercase;
    transition: color .15s, background .15s;
    cursor: pointer;
    border: none;
    border-bottom: 2.5px solid transparent;
    background: transparent;
    white-space: nowrap;
}
.tve-nav-link svg { width: 22px; height: 22px; flex-shrink: 0; transition: transform .15s; }

.tve-nav-link:hover,
.tve-nav-item.is-active > .tve-nav-link,
.tve-nav-item.is-current > .tve-nav-link {
    color: #fff;
    background: rgba(255, 255, 255, 0.07);
    border-bottom-color: rgba(255, 255, 255, 0.6);
}
.tve-nav-item.is-current > .tve-nav-link { border-bottom-color: var(--tve-accent); }
.tve-nav-item.is-active  > .tve-nav-link svg { transform: translateY(-1px); }

/* Avatar */
.tve-nav-user { display: flex; align-items: center; margin-left: auto; padding-left: 1rem; position: relative; }

.tve-nav-avatar {
    width: 36px; height: 36px;
    background: rgba(255, 255, 255, 0.15);
    border: 1.5px solid rgba(255, 255, 255, 0.28);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: .8rem; font-weight: 700; color: #fff;
    cursor: pointer; flex-shrink: 0;
    letter-spacing: .05em;
    transition: background .15s, border-color .15s;
}
.tve-nav-avatar:hover { background: rgba(255, 255, 255, 0.25); border-color: rgba(255, 255, 255, 0.45); }

/* Dropdown */
.tve-nav-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 230px;
    background: rgba(12, 2, 2, 0.95);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1.5px solid var(--tve-border);
    border-radius: 14px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-6px);
    transition: opacity .18s, transform .18s;
    z-index: 200;
}
.tve-nav-dropdown.is-open { opacity: 1; pointer-events: auto; transform: translateY(0); }

.tve-nav-dropdown__info  { padding: .9rem 1rem; }
.tve-nav-dropdown__name  { font-size: .92rem; font-weight: 700; color: #fff; }
.tve-nav-dropdown__email { font-size: .78rem; color: #fff; margin-top: 2px; word-break: break-all; }
.tve-nav-dropdown__role  {
    display: inline-block;
    margin-top: .45rem;
    padding: .1rem .5rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.1);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fff;
}
.tve-nav-dropdown__divider { height: 1px; background: rgba(255, 255, 255, 0.08); }

.tve-nav-dropdown__item {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .75rem 1rem;
    color: #fff;
    font-size: .9rem;
    font-weight: 600;
    transition: background .15s;
    cursor: pointer;
}
.tve-nav-dropdown__item svg { width: 17px; height: 17px; flex-shrink: 0; color: #fff; }
.tve-nav-dropdown__item:hover { background: rgba(255, 255, 255, 0.07); color: #fff; }

.tve-nav-dropdown__item--logout       { color: rgba(255, 154, 154, 0.85); }
.tve-nav-dropdown__item--logout svg   { color: rgba(255, 154, 154, 0.6); }
.tve-nav-dropdown__item--logout:hover { background: rgba(255, 154, 154, 0.1); color: var(--tve-error); }

/* Hamburger */
.tve-nav-hamburger {
    display: none;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    padding: .5rem;
    margin-left: 1rem;
    align-self: center;
    background: transparent;
    border: none;
}
.tve-nav-hamburger span {
    display: block; width: 22px; height: 2px;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 2px;
    transition: transform .2s, opacity .2s;
}

/* Mega-Menü */
.tve-nav-mega {
    background: rgba(30, 5, 5, 0.97);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border-bottom: 1.5px solid rgba(255, 255, 255, 0.13);
    position: fixed;
    top: var(--tve-nav-height);
    left: 0; right: 0;
    z-index: 9998;
    height: 0;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
}
.tve-nav-mega.is-open { height: auto; overflow: visible; opacity: 1; pointer-events: auto; }

.tve-nav-mega__inner {
    max-width: var(--tve-max);
    margin: 0 auto;
    padding: 1.75rem 1.5rem;
    display: grid;
    grid-template-columns: 210px 1fr 280px;
    gap: 2.5rem;
}

.tve-nav-mega__label {
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: .75rem;
    padding-bottom: .5rem;
    border-bottom: 1px solid var(--tve-border);
}

.tve-nav-mega-link {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .7rem .85rem;
    border-radius: 12px;
    margin-bottom: .25rem;
    transition: background .15s;
}
.tve-nav-mega-link:hover { background: rgba(255, 255, 255, 0.08); }

.tve-nav-mega-link__icon {
    width: 36px; height: 36px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 9px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.tve-nav-mega-link__icon svg { width: 17px; height: 17px; }
.tve-nav-mega-link__title { font-size: .92rem; font-weight: 700; color: #fff; line-height: 1.2; }
.tve-nav-mega-link__desc  { font-size: .74rem; color: #fff; margin-top: 2px; }

/* Spieltag-Kacheln */
.tve-nav-spieltag-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: .5rem;
    margin-top: .75rem;
}

.tve-nav-tile {
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 10px;
    padding: .6rem .4rem;
    text-align: center;
    transition: background .15s, border-color .15s;
    display: block;
}
.tve-nav-tile:hover  { background: rgba(255, 255, 255, 0.14); border-color: rgba(255, 255, 255, 0.28); }
.tve-nav-tile.is-next { background: rgba(125, 255, 179, 0.12); border-color: rgba(125, 255, 179, 0.35); }
.tve-nav-tile.is-past { opacity: .42; }

.tve-nav-tile__num  { font-size: .68rem; font-weight: 700; color: #fff; letter-spacing: .05em; text-transform: uppercase; }
.tve-nav-tile.is-next .tve-nav-tile__num { color: var(--tve-accent); }
.tve-nav-tile__date { font-size: .82rem; font-weight: 700; color: #fff; margin-top: 2px; line-height: 1.2; }
.tve-nav-tile__day  { font-size: .67rem; color: #fff; margin-top: 1px; }
.tve-nav-tile__time { font-size: .67rem; font-weight: 700; color: #fff; margin-top: 2px; }
.tve-nav-tile__time.is-open { font-weight: 400; font-style: italic; color: #fff; }
.tve-nav-tile.is-next .tve-nav-tile__time { color: var(--tve-accent); }

.tve-nav-no-data { font-size: .85rem; color: #fff; }

/* Highlight-Kachel */
.tve-nav-highlight {
    background: var(--tve-surface-soft);
    border: 1.5px solid rgba(255, 255, 255, 0.11);
    border-radius: 16px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: .65rem;
}
.tve-nav-highlight__badge {
    display: inline-block;
    background: rgba(125, 255, 179, 0.18);
    color: var(--tve-accent);
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: .2rem .65rem;
    border-radius: 20px;
    width: fit-content;
}
.tve-nav-highlight__title   { font-size: 1.1rem; font-weight: 900; color: #fff; line-height: 1.2; }
.tve-nav-highlight__date    { font-size: .82rem; color: #fff; }

/* Anwurf und Halle in der Highlight-Kachel (Version 1.3). */
.tve-nav-highlight__meta {
    display: flex;
    flex-direction: column;
    gap: .1rem;
    margin-top: .3rem;
    font-size: .78rem;
    color: #fff;
}
.tve-nav-highlight__meta-item { line-height: 1.35; }
.tve-nav-highlight__divider { border: none; border-top: 1px solid rgba(255, 255, 255, 0.08); }
.tve-nav-highlight__cta     { font-size: .85rem; font-weight: 700; color: #fff; transition: color .15s; }
.tve-nav-highlight__cta:hover { color: #fff; }

/* Countdown */
.tve-nav-countdown { display: flex; gap: .5rem; }
.tve-nav-cd-block  { flex: 1; background: rgba(0, 0, 0, 0.3); border-radius: 10px; padding: .5rem .25rem; text-align: center; }
.tve-nav-cd-num    { font-size: 1.35rem; font-weight: 900; color: #fff; line-height: 1; }
.tve-nav-cd-label  { font-size: .6rem; font-weight: 600; color: var(--tve-text-faint); text-transform: uppercase; letter-spacing: .08em; margin-top: 3px; }

/* Mobile-Menü */
.tve-nav-mobile {
    display: none;
    background: rgba(10, 1, 1, 0.97);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.tve-nav-mobile.is-open { display: block; }

.tve-nav-mobile__item {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    color: #fff;
    font-size: .95rem;
    font-weight: 600;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    transition: background .15s;
}
.tve-nav-mobile__item:hover { background: rgba(255, 255, 255, 0.06); color: #fff; }
.tve-nav-mobile__item svg   { width: 20px; height: 20px; flex-shrink: 0; }
.tve-nav-mobile__item--logout { color: rgba(255, 154, 154, 0.85); }

/* ── 7  Anmeldeseite ─────────────────────────────────────────────────────── */

.tve-auth {
    position: relative;
    z-index: 10;
    width: 100%;
    max-width: 400px;
    display: flex;
    flex-direction: column;
    align-items: center;
    animation: tve-in .7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes tve-in {
    from { opacity: 0; transform: translateY(28px); }
    to   { opacity: 1; transform: translateY(0); }
}

.tve-auth__hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .4rem;
    margin-bottom: 1.75rem;
    text-align: center;
}
.tve-auth__logo  { max-height: 84px; width: auto; margin-bottom: .5rem; }
.tve-auth__title { font-size: 1.75rem; font-weight: 900; letter-spacing: .03em; text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5); }
.tve-auth__sub   { font-size: .78rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: #fff; }

.tve-auth__card {
    width: 100%;
    background: rgba(0, 0, 0, 0.62);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    border: 1.5px solid var(--tve-border);
    border-radius: var(--tve-radius);
    padding: 1.75rem 1.5rem 1.5rem;
    box-shadow: var(--tve-shadow);
}

.tve-auth__error {
    background: rgba(255, 100, 100, 0.12);
    border: 1px solid rgba(255, 154, 154, 0.4);
    border-radius: var(--tve-radius-xs);
    padding: .7rem .9rem;
    margin-bottom: 1.1rem;
    font-size: .88rem;
    color: #ffd9d9;
}

.tve-auth__submit {
    width: 100%;
    margin-top: .5rem;
    padding: .8rem 1rem;
    font-weight: 700;
    letter-spacing: .04em;
    background: var(--tve-accent);
    color: #0a1f12;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    transition: background .15s, transform .15s;
}
.tve-auth__submit:hover  { background: #a0ffc8; }
.tve-auth__submit:active { transform: translateY(1px); }

.tve-auth__hint {
    margin-top: 1.1rem;
    font-size: .8rem;
    line-height: 1.45;
    text-align: center;
    color: var(--tve-text-faint);
}

/* ── Responsive ──────────────────────────────────────────────────────────── */
@media (max-width: 900px) {
    .tve-nav-mega__inner { grid-template-columns: 1fr; gap: 1.5rem; }
}

@media (max-width: 768px) {
    .tve-nav-menu      { display: none; }
    .tve-nav-hamburger { display: flex; }
    .tve-nav-spieltag-grid { grid-template-columns: repeat(4, 1fr); }
    .tve-main          { padding: 1.5rem 1rem 2.5rem; }
    .tve-page__title   { font-size: 1.5rem; }
}

@media (max-width: 500px) {
    .tve-nav-spieltag-grid { grid-template-columns: repeat(3, 1fr); }
    .tve-nav-inner { padding: 0 1rem; }

    /* Vereinsnamen dürfen lang sein – die Kopfzeile darf deshalb nicht
       breiter werden als der Bildschirm. Das Logo schrumpft mit und der
       Name endet notfalls mit drei Punkten, statt die Seite waagerecht
       scrollbar zu machen. */
    .tve-nav-logo      { flex-shrink: 1; min-width: 0; padding-right: .75rem; }
    .tve-nav-logo__text {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .tve-nav-logo__sub { overflow: hidden; text-overflow: ellipsis; }
    .tve-nav-user      { padding-left: .5rem; }
    .tve-nav-hamburger { margin-left: .35rem; }
}

/* ── 8  Druck ────────────────────────────────────────────────────────────── */
@media print {
    .tve-bg, .tve-vignette, .tve-corners,
    .tve-nav-header, .tve-footer, .tve-flash-wrap { display: none !important; }

    body.tve-body { background: #fff; color: #000; display: block; }
    .tve-main { max-width: none; padding: 0; }
    .tve-card {
        background: #fff;
        border: 1px solid #ccc;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        break-inside: avoid;
    }
}

/* ── 9  Formulare, Profil und Auth-Ergänzungen (Batch 1) ─────────────────── */

/* Hinweisbox in der Auth-Karte (Startpasswort, Abmeldung, Kontolöschung) */
.tve-auth__notice {
    background: rgba(125, 255, 179, 0.10);
    border: 1px solid rgba(125, 255, 179, 0.35);
    border-radius: var(--tve-radius-xs);
    padding: .7rem .9rem;
    margin-bottom: 1.1rem;
    font-size: .88rem;
    line-height: 1.45;
    color: #fff;
}

.tve-auth__hint a { color: var(--tve-accent); text-decoration: none; }
.tve-auth__hint a:hover { text-decoration: underline; }

/* Checkbox-Zeile („Angemeldet bleiben", Löschbestätigung) */
.tve-check {
    display: flex;
    align-items: center;
    gap: .55rem;
    margin: .2rem 0 1rem;
    font-size: .9rem;
    color: #fff;
    cursor: pointer;
}
.tve-check input[type="checkbox"] {
    width: 17px;
    height: 17px;
    flex-shrink: 0;
    accent-color: var(--tve-accent);
    cursor: pointer;
}

/* Formulare in Karten */
.tve-form { margin-top: 1.2rem; }

.tve-form__row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 1rem;
}

.tve-form__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .9rem;
}
.tve-form__actions .tve-btn { margin-top: .4rem; }

.tve-form__hint {
    font-size: .82rem;
    color: var(--tve-text-faint);
}

/* Gefahrenzone: Konto löschen */
.tve-card--danger { border-color: rgba(255, 154, 154, 0.32); }
.tve-card--danger .tve-card__title { color: #ffd9d9; }

.tve-btn--danger {
    background: rgba(255, 100, 100, 0.14);
    border-color: rgba(255, 154, 154, 0.45);
    color: #ffd9d9;
}
.tve-btn--danger:hover {
    background: rgba(255, 100, 100, 0.24);
    border-color: rgba(255, 154, 154, 0.7);
}

@media (max-width: 640px) {
    .tve-form__row { grid-template-columns: 1fr; }
}

/* ── 10  Admin-Center ────────────────────────────────────────────────────── */
/* Zwei Spalten: links die Liste, rechts der Editor. Unter 1000px wandert
   der Editor unter die Liste. Alle Bausteine hier greifen auf dieselben
   Token zu wie der Rest der App – das Glassmorphism bleibt durchgehend. */

/* Buttons und Karten setzen display selbst – ohne !important würde das
   hidden-Attribut von ihnen überstimmt und „versteckte" Schaltflächen
   blieben sichtbar. */
[hidden] { display: none !important; }

.tve-page--wide { max-width: var(--tve-max); }

/* Tab-Leiste */
.tve-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-bottom: 1.25rem;
    padding-bottom: .1rem;
    border-bottom: 1.5px solid var(--tve-border);
}

.tve-tabs__item {
    padding: .6rem 1.1rem;
    border: 1.5px solid transparent;
    border-bottom: none;
    border-radius: var(--tve-radius-sm) var(--tve-radius-sm) 0 0;
    font-size: .92rem;
    font-weight: 600;
    color: var(--tve-text-muted);
    transition: background .15s, color .15s;
}
.tve-tabs__item:hover { background: var(--tve-surface-soft); color: #fff; }
.tve-tabs__item.is-active {
    background: var(--tve-surface);
    border-color: var(--tve-border);
    color: #fff;
}

/* Zweispaltiges Grundgerüst */
.tve-admin-split {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
    gap: 1.25rem;
    align-items: start;
}

.tve-admin-list,
.tve-admin-editor {
    background: var(--tve-surface);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1.5px solid var(--tve-border);
    border-radius: var(--tve-radius);
    padding: 1.25rem 1.35rem;
}

.tve-admin-editor { position: sticky; top: calc(var(--tve-nav-height) + 1rem); }

.tve-admin-single { max-width: 780px; }

.tve-admin-list__head,
.tve-admin-editor__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.tve-admin-list__title,
.tve-admin-editor__title {
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: .01em;
}

.tve-admin-editor__foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
    margin-top: 1.25rem;
    padding-top: 1.1rem;
    border-top: 1.5px solid var(--tve-border);
}
.tve-admin-editor__foot .tve-btn { margin-top: 0; }

/* Buttons und Zusätze */
.tve-btn--sm { margin-top: 0; padding: .42rem .9rem; font-size: .8rem; }
.tve-btn--ghost { background: transparent; }
.tve-btn[disabled] { opacity: .45; cursor: not-allowed; }

.tve-icon-btn {
    width: 30px; height: 30px;
    display: inline-flex; align-items: center; justify-content: center;
    border: 1.5px solid var(--tve-border);
    border-radius: 8px;
    background: var(--tve-surface-soft);
    color: var(--tve-text-muted);
    font-size: .85rem;
    line-height: 1;
    cursor: pointer;
    transition: background .15s, color .15s;
}
.tve-icon-btn:hover:not([disabled]) { background: rgba(255, 255, 255, 0.14); color: #fff; }
.tve-icon-btn[disabled] { opacity: .3; cursor: not-allowed; }
.tve-icon-btn--danger:hover { background: rgba(255, 90, 90, 0.2); color: #ffb4b4; }

/* Chips, Hinweise, Punkte */
.tve-chip {
    display: inline-block;
    padding: .1rem .55rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.1);
    color: var(--tve-text-muted);
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .04em;
    white-space: nowrap;
}
.tve-chip--ok   { background: rgba(125, 255, 179, 0.16); color: var(--tve-accent); }
.tve-chip--open { background: rgba(255, 190, 90, 0.18);  color: #ffd79a; }

.tve-dot {
    display: inline-block;
    width: 9px; height: 9px;
    border-radius: 50%;
    margin-right: .3rem;
    vertical-align: baseline;
}

.tve-hint {
    margin: .6rem 0;
    font-size: .86rem;
    color: var(--tve-text-muted);
}
.tve-hint--small { font-size: .78rem; }
.tve-hint--warn {
    padding: .7rem .9rem;
    border-radius: var(--tve-radius-xs);
    background: rgba(255, 190, 90, 0.12);
    border: 1.5px solid rgba(255, 190, 90, 0.3);
    color: #ffd79a;
}
.tve-hint a { text-decoration: underline; }

.tve-stats { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .9rem; }

/* Filterzeile im Nutzer-Tab */
.tve-filter {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: 1rem;
}
.tve-filter__search { flex: 1 1 100%; }
.tve-filter__select { flex: 1 1 130px; width: auto; min-width: 0; }
.tve-filter .tve-btn { margin-top: 0; flex: 0 0 auto; }

/* ── Listen ──────────────────────────────────────────────────────────────── */

.tve-md-list, .tve-cal-list, .tve-user-list { list-style: none; }

.tve-md-item,
.tve-cal-item__body,
.tve-user-item__body {
    width: 100%;
    display: flex;
    align-items: center;
    gap: .85rem;
    padding: .7rem .8rem;
    border: 1.5px solid transparent;
    border-radius: var(--tve-radius-sm);
    background: transparent;
    text-align: left;
    cursor: pointer;
    transition: background .15s, border-color .15s;
}
.tve-md-item:hover,
.tve-cal-item__body:hover,
.tve-user-item__body:hover {
    background: var(--tve-surface-soft);
    border-color: var(--tve-border);
}
.tve-md-item.is-past { opacity: .55; }

.tve-md-item__date {
    flex-shrink: 0;
    width: 46px;
    text-align: center;
    line-height: 1.1;
}
.tve-md-item__day   { display: block; font-size: 1.3rem; font-weight: 900; }
.tve-md-item__month { display: block; font-size: .7rem; color: var(--tve-text-muted); text-transform: uppercase; }

.tve-md-item__body  { flex: 1; min-width: 0; }
.tve-md-item__title { display: block; font-weight: 700; }
.tve-md-item__meta,
.tve-cal-item__meta,
.tve-user-item__meta {
    display: block;
    font-size: .78rem;
    color: var(--tve-text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
}

.tve-cal-item {
    display: flex;
    align-items: center;
    gap: .5rem;
}
.tve-cal-item.is-archived { opacity: .55; }
.tve-cal-item__dot { flex-shrink: 0; width: 12px; height: 12px; border-radius: 50%; }
.tve-cal-item__body { flex: 1; min-width: 0; flex-direction: column; align-items: flex-start; gap: .1rem; }
.tve-cal-item__name { font-weight: 700; display: flex; align-items: center; gap: .45rem; }
.tve-cal-item__sort { display: flex; flex-direction: column; gap: .15rem; }
.tve-cal-item__sort .tve-icon-btn { width: 26px; height: 20px; font-size: .6rem; }

.tve-user-item { display: flex; align-items: center; gap: .6rem; }
.tve-user-item.is-inactive, .tve-user-item.is-deleted { opacity: .55; }
.tve-user-item__avatar {
    flex-shrink: 0;
    width: 34px; height: 34px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--tve-primary);
    font-size: .72rem;
    font-weight: 700;
}
.tve-user-item__body { flex: 1; min-width: 0; flex-direction: column; align-items: flex-start; gap: .1rem; }
.tve-user-item__body[disabled] { cursor: default; }
.tve-user-item__name { font-weight: 700; display: flex; align-items: center; gap: .45rem; }

/* ── Slot-Editor ─────────────────────────────────────────────────────────── */

.tve-slots { margin-top: 1.25rem; }

.tve-slots__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .6rem;
}
.tve-slots__title { font-size: 1rem; font-weight: 700; }

.tve-slot-row {
    padding: .85rem .9rem;
    margin-bottom: .7rem;
    border: 1.5px solid var(--tve-border);
    border-radius: var(--tve-radius-sm);
    background: rgba(0, 0, 0, 0.22);
}

/* Feste Spalten statt Umbruch: der Kalender wächst, Zeit und Plätze bleiben
   schmal, das Entfernen-Kreuz sitzt immer am rechten Rand der ersten Zeile. */
.tve-slot-row__main {
    display: grid;
    /* Die Zeitfelder brauchen Luft: Browser mit englischer Oberfläche
       hängen an die Uhrzeit noch AM/PM an. */
    grid-template-columns: minmax(0, 1fr) 146px 146px 84px 30px;
    align-items: end;
    gap: .5rem;
}
.tve-slot-row__main > * { min-width: 0; }

/* Die Felder bringen 1rem Abstand nach unten mit – im Slot-Raster erledigt
   das der gap, sonst säße das Entfernen-Kreuz eine Zeilenhöhe zu tief. */
.tve-slot-row .tve-field { margin-bottom: 0; }
.tve-slot-row__main .tve-icon-btn { margin-bottom: .3rem; }

.tve-slot-row__opts {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: .6rem;
    margin-top: .5rem;
}
.tve-slot-row__opts .tve-check { margin: 0 0 .6rem; }

.tve-slot-row__seats {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
    gap: .45rem;
    margin-top: .7rem;
    padding-top: .7rem;
    border-top: 1px solid var(--tve-border);
}

.tve-seat {
    display: flex;
    align-items: center;
    gap: .4rem;
    min-width: 0;
}
.tve-seat__select { min-width: 0; }
.tve-seat__num {
    flex-shrink: 0;
    width: 22px; height: 22px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: var(--tve-surface-soft);
    font-size: .7rem;
    font-weight: 700;
    color: var(--tve-text-muted);
}
.tve-seat__select { padding: .45rem .6rem; font-size: .86rem; }
.tve-seat__name { font-size: .86rem; color: var(--tve-text-muted); }

/* ── Formular-Ergänzungen ────────────────────────────────────────────────── */

.tve-field__input[disabled] { opacity: .45; cursor: not-allowed; }

.tve-field--grow   { flex: 1 1 160px; }
.tve-field--time   { flex: 0 0 118px; }
.tve-field--narrow { flex: 0 0 100px; }

.tve-field__input--area  { resize: vertical; min-height: 4.5rem; font-family: inherit; }
.tve-field__input--color { padding: .25rem; height: 42px; max-width: 120px; cursor: pointer; }

.tve-fieldset {
    margin: 1rem 0;
    padding: .9rem 1rem;
    border: 1.5px solid var(--tve-border);
    border-radius: var(--tve-radius-sm);
}
.tve-fieldset__legend {
    padding: 0 .4rem;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--tve-text-muted);
}
.tve-fieldset__hint {
    display: block;
    margin-top: .2rem;
    font-size: .74rem;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
    color: var(--tve-text-faint);
}

.tve-check--inline { margin: 0; }

.tve-check-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 0 .8rem;
    max-height: 260px;
    overflow-y: auto;
}
.tve-check-grid .tve-check { margin: .1rem 0 .5rem; }

.tve-form__actions--tight { margin-top: .5rem; }

.tve-details {
    margin: .4rem 0 1rem;
    padding: .2rem 0;
    border-top: 1px solid var(--tve-border);
    border-bottom: 1px solid var(--tve-border);
}
.tve-details > summary {
    padding: .6rem 0;
    font-size: .86rem;
    font-weight: 600;
    color: var(--tve-text-muted);
    cursor: pointer;
}
.tve-details[open] > summary { color: #fff; }

.tve-deflist {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: .35rem 1rem;
    font-size: .88rem;
}
.tve-deflist dt { color: var(--tve-text-muted); }
.tve-deflist__warn { color: #ffd79a; }

/* Startpasswort – wird genau einmal angezeigt */
.tve-password-box {
    margin-top: 1rem;
    padding: .9rem 1rem;
    border: 1.5px solid rgba(125, 255, 179, 0.4);
    border-radius: var(--tve-radius-sm);
    background: rgba(125, 255, 179, 0.1);
}
.tve-password-box__label { font-size: .8rem; color: var(--tve-text-muted); }
.tve-password-box__value {
    margin: .3rem 0;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: .06em;
    color: var(--tve-accent);
    user-select: all;
}
.tve-password-box__note { font-size: .76rem; color: var(--tve-text-faint); }

/* ── Toasts ──────────────────────────────────────────────────────────────── */

.tve-toasts {
    position: fixed;
    z-index: 200;
    top: calc(var(--tve-nav-height) + .75rem);
    right: 1rem;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    max-width: min(420px, calc(100vw - 2rem));
}

.tve-toast {
    padding: .7rem 1rem;
    border: 1.5px solid var(--tve-border-strong);
    border-radius: var(--tve-radius-sm);
    background: rgba(20, 16, 15, 0.94);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: var(--tve-shadow);
    font-size: .88rem;
    animation: tve-toast-in .2s ease-out;
}
.tve-toast--success { border-color: rgba(125, 255, 179, 0.45); color: var(--tve-accent); }
.tve-toast--error   { border-color: rgba(255, 154, 154, 0.5); color: var(--tve-error); }
.tve-toast--warn    { border-color: rgba(255, 190, 90, 0.5);  color: #ffd79a; }
.tve-toast.is-leaving { opacity: 0; transition: opacity .5s; }

@keyframes tve-toast-in {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: none; }
}

/* ── Spielplan-Abgleich (Tab Spieltage) ──────────────────────────────────── */

.tve-sync { margin-bottom: 1.25rem; }
/* Rasterspalten dürfen schmaler werden als ihr Inhalt – sonst schiebt die Spieltagliste
   die Seite am Handy über den Rand (war schon vor dem Abgleich so). */
.tve-admin-split > * { min-width: 0; }
.tve-sync.is-busy { cursor: progress; }
.tve-sync__head { margin-bottom: .8rem; }
.tve-sync__sub { margin-top: .3rem; font-size: .9rem; max-width: 70ch; }

.tve-sync__form { display: flex; align-items: flex-end; gap: .6rem; flex-wrap: wrap; }
.tve-sync__form .tve-btn { margin-top: 0; min-height: 44px; }
.tve-sync__url { flex: 1 1 320px; min-width: 0; margin-bottom: 0; }
.tve-sync__url .tve-field__input, .tve-sync__upload-row .tve-field__input { min-width: 0; max-width: 100%; }

.tve-sync__upload { margin-top: .9rem; }
.tve-sync__upload-row { display: flex; gap: .6rem; flex-wrap: wrap; align-items: center; margin-top: .5rem; }
.tve-sync__upload-row .tve-field__input { flex: 1 1 240px; width: auto; }
.tve-sync__upload-row .tve-btn { margin-top: 0; }

.tve-sync__result:empty { display: none; }
.tve-sync__result { margin-top: 1.1rem; padding-top: 1.1rem; border-top: 1.5px solid var(--tve-border); scroll-margin-top: calc(var(--tve-nav-height) + 1rem); }

.tve-sync-summary { font-size: .92rem; }
.tve-sync-error {
    margin-top: .8rem; padding: .8rem 1rem;
    border: 1.5px solid rgba(255, 138, 128, 0.55);
    border-radius: var(--tve-radius-sm);
    background: rgba(255, 138, 128, 0.12);
    color: #fff; font-size: .92rem;
}
.tve-sync-error p + p { margin-top: .4rem; }
.tve-sync-error a { color: #fff; text-decoration: underline; }
.tve-sync-error__title { font-weight: 700; }
.tve-sync-error__detail { margin-top: .6rem; }
.tve-sync-error__detail summary { cursor: pointer; font-weight: 600; }
.tve-sync-error__detail dl { display: grid; grid-template-columns: max-content 1fr; gap: .2rem .8rem; margin: .5rem 0 0; font-size: .85rem; }
.tve-sync-error__detail dt { font-weight: 700; }
.tve-sync-error__detail dd { margin: 0; overflow-wrap: anywhere; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.tve-sync-ok {
    display: flex; align-items: center; gap: .5rem;
    margin-top: .8rem; padding: .8rem 1rem;
    border: 1.5px solid rgba(125, 255, 179, 0.45);
    border-radius: var(--tve-radius-sm);
    background: rgba(125, 255, 179, 0.09);
    color: var(--tve-accent); font-weight: 700;
}
.tve-sync-ok svg { width: 18px; height: 18px; flex-shrink: 0; }

.tve-sync-venues {
    margin-top: 1rem; padding: .9rem 1rem;
    border: 1.5px dashed var(--tve-border-strong);
    border-radius: var(--tve-radius-sm);
}
.tve-sync-venues__title { font-size: .95rem; font-weight: 800; }
.tve-sync-venue { margin: .6rem 0 0; }

.tve-sync-list { list-style: none; display: flex; flex-direction: column; gap: .6rem; margin-top: 1rem; }

.tve-sync-item {
    padding: .8rem .95rem;
    border: 1.5px solid var(--tve-border);
    border-radius: var(--tve-radius-sm);
    background: var(--tve-surface-soft);
}
.tve-sync-item--new     { border-color: rgba(125, 255, 179, 0.45); }
.tve-sync-item--update  { border-color: rgba(255, 190, 90, 0.45); }
.tve-sync-item--missing { border-style: dashed; border-color: rgba(255, 190, 90, 0.55); }
.tve-sync-item--locked  { border-style: dashed; }
.tve-sync-item.is-blocked { border-color: rgba(255, 154, 154, 0.5); }

.tve-sync-item__head { display: flex; align-items: flex-start; gap: .6rem; }
.tve-sync-item__check { width: 20px; height: 20px; margin-top: .15rem; flex-shrink: 0; accent-color: var(--tve-accent); cursor: pointer; }
.tve-sync-item__title { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .5rem; font-size: .98rem; cursor: pointer; }
.tve-sync-item__title .tve-chip { color: #fff; }
.tve-sync-item__title .tve-chip--ok { color: var(--tve-accent); }
.tve-sync-item__title .tve-chip--open,
.tve-sync-item__title .tve-chip--warn { color: #ffd79a; }

.tve-sync-item__body { margin: .45rem 0 0 1.85rem; font-size: .9rem; }
.tve-sync-item--missing .tve-sync-item__body,
.tve-sync-item--locked .tve-sync-item__body,
.tve-sync-item.is-blocked .tve-sync-item__body { margin-left: 0; }
.tve-sync-item__field { margin: .2rem 0 .5rem; max-width: 460px; }
.tve-sync-item__copy { margin: .5rem 0 0; font-size: .88rem; align-items: flex-start; }
.tve-sync-item__tools { display: flex; gap: .4rem; flex-wrap: wrap; margin-top: .6rem; }
.tve-sync-item__tools .tve-btn { margin-top: 0; }

.tve-sync-facts { list-style: none; display: flex; flex-wrap: wrap; gap: .2rem 1rem; }
.tve-sync-changes { list-style: none; display: flex; flex-direction: column; gap: .3rem; }
.tve-sync-changes li { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .45rem; }
.tve-sync-changes__label { font-weight: 700; min-width: 4.5rem; }
.tve-sync-changes__from { text-decoration: line-through; text-decoration-color: rgba(255, 154, 154, 0.8); }
.tve-sync-changes__to { color: var(--tve-accent); }
.tve-sync-origin { font-size: .74rem; font-weight: 700; padding: .05rem .5rem; border-radius: 99px; background: rgba(255, 255, 255, 0.1); }
.tve-sync-origin--manual { background: rgba(255, 190, 90, 0.18); color: #ffd79a; }
.tve-sync-note { margin-top: .4rem; }

.tve-sync-foot { display: flex; gap: .6rem; flex-wrap: wrap; margin-top: 1rem; }
.tve-sync-foot .tve-btn { margin-top: 0; }

@media (max-width: 560px) {
    .tve-sync-item__body { margin-left: 0; }
    .tve-sync__form .tve-btn, .tve-sync-foot .tve-btn { flex: 1 1 100%; justify-content: center; }
}

/* ── Bestätigungsdialog ──────────────────────────────────────────────────── */
/* Vor dem Übernehmen und Abgeben (tveUi.dialog / tveUi.confirmSeat in app.js).
   Desktop: mittig. Handy: Blatt von unten, Knöpfe in Daumenhöhe. */

html.has-dialog { overflow: hidden; }

.tve-dialog {
    width: min(520px, calc(100vw - 2rem));
    max-height: calc(100dvh - 2rem);
    margin: auto;
    padding: 0;
    border: 1.5px solid var(--tve-border-strong);
    border-radius: var(--tve-radius);
    background: rgba(22, 17, 16, 0.98);
    color: #fff;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.6);
    font-family: var(--tve-font);
    overflow: auto;
    overscroll-behavior: contain;
}
.tve-dialog[open] { animation: tve-dialog-in .18s ease-out; }
.tve-dialog::backdrop {
    background: rgba(0, 0, 0, 0.62);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

@keyframes tve-dialog-in {
    from { opacity: 0; transform: translateY(12px) scale(.98); }
    to   { opacity: 1; transform: none; }
}

.tve-dialog__panel { padding: 1.35rem 1.4rem 1.2rem; }

.tve-dialog__title { font-size: 1.3rem; font-weight: 900; line-height: 1.2; margin-bottom: 1rem; }

.tve-dialog__day {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .85rem;
    align-items: start;
}
.tve-dialog__day .tve-dash-md__kicker { margin-bottom: .25rem; }
.tve-dialog__day-title { font-size: 1.08rem; font-weight: 800; line-height: 1.25; }
.tve-dialog__meta { font-size: .88rem; margin-top: .15rem; }

.tve-dialog__shift {
    margin-top: 1rem;
    padding: .8rem .9rem;
    border: 1.5px solid var(--tve-border-strong);
    border-radius: var(--tve-radius-sm);
    background: var(--tve-surface-soft);
}
.tve-dialog__cal { display: flex; align-items: baseline; flex-wrap: wrap; gap: .15rem .55rem; font-size: 1.05rem; }
.tve-dialog__cal .tve-dot { margin-right: 0; align-self: center; }
.tve-dialog__time { font-size: .92rem; }
.tve-dialog__label { margin-top: .2rem; font-size: .9rem; font-style: italic; }
.tve-dialog__desc { margin-top: .45rem; font-size: .9rem; line-height: 1.45; }

.tve-dialog__facts {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .4rem;
    margin-top: 1rem;
    font-size: .92rem;
    line-height: 1.4;
}
.tve-dialog__facts li { position: relative; padding-left: 1.1rem; }
.tve-dialog__facts li::before {
    content: '';
    position: absolute;
    left: .1rem; top: .55em;
    width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--tve-accent);
}

.tve-dialog__actions {
    display: flex;
    justify-content: flex-end;
    gap: .6rem;
    margin-top: 1.3rem;
    padding-top: 1rem;
    border-top: 1.5px solid var(--tve-border);
}
.tve-dialog__actions .tve-btn { margin-top: 0; min-height: 44px; justify-content: center; }
.tve-dialog__actions .tve-btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

@media (max-width: 600px) {
    .tve-dialog {
        width: 100%;
        max-width: 100%;
        max-height: 88dvh;
        margin: auto 0 0;
        border-radius: var(--tve-radius) var(--tve-radius) 0 0;
        border-bottom: 0;
    }
    .tve-dialog[open] { animation: tve-sheet-in .22s ease-out; }
    .tve-dialog__panel { padding: 1.15rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px)); }
    .tve-dialog__title { font-size: 1.2rem; }
    .tve-dialog__actions { display: grid; grid-template-columns: 1fr 1.6fr; }
    .tve-dialog__actions .tve-btn { padding-left: .8rem; padding-right: .8rem; }
}

@keyframes tve-sheet-in {
    from { transform: translateY(100%); }
    to   { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    .tve-dialog[open] { animation: none; }
}

/* ── 11  Tagesansicht (Batch 3) ──────────────────────────────────────────── */
/* Eine Spalte je Kalender. „half" belegt eine Rasterspalte, „full" beide –
   das ersetzt die Layout-Tabelle tve_suite_calendar_layouts des Altsystems. */

.tve-day__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}

.tve-day__kicker {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    margin-bottom: .45rem;
}

.tve-day__sub {
    margin-top: .3rem;
    color: #fff;
}
.tve-day__sub-sep { opacity: .45; margin: 0 .15rem; }

/* Metazeile unter der Überschrift: Datum, Anwurf, Halle (Version 1.3).
   Umbricht auf schmalen Geräten zu einer Angabe je Zeile. */
.tve-day__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .35rem 1.1rem;
    margin-top: .55rem;
    font-size: .9rem;
    color: #fff;
}

.tve-day__meta-item {
    display: inline-flex;
    align-items: center;
    gap: .38rem;
}
.tve-day__meta-item.is-open { color: var(--tve-text-muted); font-style: italic; }

.tve-day__meta-icon {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
    opacity: .65;
}

/* Kurzbeschreibung – die Liga-Zeile, nicht der Zusatztext. */
.tve-day__lead {
    margin-top: .5rem;
    max-width: 62ch;
    color: #fff;
    font-size: .92rem;
    line-height: 1.5;
}

.tve-day__actions {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}
.tve-day__actions .tve-btn { margin-top: 0; }

.tve-day__stats {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    margin-bottom: 1rem;
}

.tve-day__info { padding: 1.1rem 1.25rem; }
.tve-day__rte  { color: #fff; }
.tve-day__rte > * + * { margin-top: .6rem; }
.tve-day__rte ul, .tve-day__rte ol { padding-left: 1.2rem; }
.tve-day__rte a { text-decoration: underline; }
.tve-day__info .tve-btn { margin-top: 1rem; }

/* ── Kalenderspalten ─────────────────────────────────────────────────────── */

.tve-day-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.1rem;
    align-items: start;
}

.tve-day-col {
    background: var(--tve-surface);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1.5px solid var(--tve-border);
    border-radius: var(--tve-radius);
    padding: 1.15rem 1.25rem 1.25rem;
}
.tve-day-col--full { grid-column: 1 / -1; }

.tve-day-col__head {
    display: flex;
    align-items: center;
    gap: .55rem;
    padding-bottom: .6rem;
    border-bottom: 1.5px solid var(--tve-border);
}

.tve-day-col__title {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex: 1;
    min-width: 0;
    font-size: 1.12rem;
    font-weight: 800;
    letter-spacing: .01em;
}

.tve-day-col__count {
    font-size: .82rem;
    font-weight: 700;
    color: var(--tve-text-muted);
    white-space: nowrap;
}

.tve-day-col__desc {
    margin-top: .6rem;
    font-size: .86rem;
    color: var(--tve-text-muted);
}

/* ── Slot ────────────────────────────────────────────────────────────────── */

.tve-day-slot { margin-top: 1rem; }

.tve-day-slot__head {
    display: flex;
    align-items: baseline;
    gap: .5rem;
    flex-wrap: wrap;
    margin-bottom: .4rem;
}

.tve-day-slot__time {
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--tve-text-faint);
}

.tve-day-slot__label {
    font-size: .86rem;
    color: var(--tve-text-muted);
}

/* ── Platz ───────────────────────────────────────────────────────────────── */

.tve-seats { list-style: none; display: flex; flex-direction: column; gap: .4rem; }

.tve-seat {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .65rem;
    padding: .55rem .7rem;
    border: 1.5px solid var(--tve-border);
    border-radius: var(--tve-radius-sm);
    background: rgba(0, 0, 0, 0.25);
}
.tve-seat.is-open { border-style: dashed; background: rgba(0, 0, 0, 0.12); }
.tve-seat.is-mine { border-color: rgba(125, 255, 179, 0.45); background: rgba(125, 255, 179, 0.08); }

.tve-seat__pos {
    flex: 0 0 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--tve-surface-soft);
    font-size: .7rem;
    font-weight: 700;
    color: var(--tve-text-muted);
}

.tve-seat__body { flex: 1; min-width: 0; }

.tve-seat__name {
    display: block;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.tve-seat__free {
    font-weight: 400;
    color: var(--tve-text-faint);
    letter-spacing: .06em;
}

.tve-seat__you {
    margin-left: .4rem;
    padding: .05rem .45rem;
    border-radius: 20px;
    background: rgba(125, 255, 179, 0.16);
    color: var(--tve-accent);
    font-size: .66rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    vertical-align: middle;
}

.tve-seat__note {
    display: block;
    margin-top: .15rem;
    font-size: .84rem;
    font-style: italic;
    color: var(--tve-text-muted);
    overflow-wrap: anywhere;
}

.tve-seat__actions {
    display: flex;
    align-items: center;
    gap: .35rem;
    flex-shrink: 0;
}
.tve-seat__actions .tve-btn { margin-top: 0; }

.tve-seat__hint {
    font-size: .76rem;
    color: var(--tve-text-faint);
    white-space: nowrap;
}

/* Notizfeld und Personenauswahl baut app.js bei Bedarf ein. */

.tve-seat__editor {
    display: flex;
    flex: 1 1 100%;
    gap: .4rem;
    align-items: flex-start;
    margin-top: .1rem;
}

.tve-seat__editor textarea {
    flex: 1;
    min-height: 62px;
    resize: vertical;
    padding: .5rem .7rem;
    background: rgba(0, 0, 0, 0.55);
    border: 1.5px solid var(--tve-border-strong);
    border-radius: var(--tve-radius-xs);
    color: #fff;
    font: inherit;
    font-size: .9rem;
}
.tve-seat__editor textarea:focus {
    outline: none;
    border-color: rgba(125, 255, 179, 0.55);
}

.tve-seat__editor-buttons { display: flex; flex-direction: column; gap: .35rem; }
.tve-seat__editor-buttons .tve-btn { margin-top: 0; }

.tve-seat__assign {
    max-width: 220px;
    padding: .4rem .6rem;
    background: rgba(0, 0, 0, 0.6);
    border: 1.5px solid var(--tve-border-strong);
    border-radius: var(--tve-radius-xs);
    color: #fff;
    font: inherit;
    font-size: .85rem;
}

.tve-seat.is-busy { opacity: .55; pointer-events: none; }

/* ── Schmale Bildschirme ─────────────────────────────────────────────────── */

@media (max-width: 1000px) {
    .tve-admin-split { grid-template-columns: 1fr; }
    .tve-admin-editor { position: static; }

    /* Zwei Kalenderspalten nebeneinander werden hier zu schmal. */
    .tve-day-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 600px) {
    .tve-admin-list, .tve-admin-editor { padding: 1rem .9rem; }
    /* Kalender oben mit dem Entfernen-Kreuz, darunter von/bis, dann Plätze */
    .tve-slot-row__main {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 30px;
    }
    .tve-slot-row__main > :nth-child(1) { grid-area: 1 / 1 / 2 / 3; }
    .tve-slot-row__main > :nth-child(5) { grid-area: 1 / 3 / 2 / 4; }
    .tve-slot-row__main > :nth-child(2) { grid-area: 2 / 1 / 3 / 2; }
    .tve-slot-row__main > :nth-child(3) { grid-area: 2 / 2 / 3 / 3; }
    .tve-slot-row__main > :nth-child(4) { grid-area: 3 / 1 / 4 / 2; }

    .tve-slot-row__opts { flex-direction: column; align-items: stretch; }
    .tve-slot-row__opts .tve-check { margin: 0 0 .4rem; }

    .tve-slot-row__seats { grid-template-columns: 1fr; }
    .tve-toasts { top: auto; bottom: 1rem; left: 1rem; right: 1rem; max-width: none; }

    /* Tagesansicht: Aktionen unter den Namen statt daneben */
    .tve-day-col { padding: 1rem .9rem; }
    .tve-seat { flex-wrap: wrap; }
    .tve-seat__body { flex: 1 1 60%; }
    .tve-seat__actions { flex: 1 1 100%; justify-content: flex-end; }
    .tve-seat__editor { flex-direction: column; }
    .tve-seat__editor-buttons { flex-direction: row; align-self: flex-end; }
    .tve-seat__assign { max-width: none; width: 100%; }
}

/* ── 12  Dashboard und Meine Einsätze ────────────────────────────────────── */
/* Dashboard (seit 10.09.2026): Kopf, drei Kennzahlen als Links, darunter eine
   Zeitleiste der nächsten Spieltage. Jede Spieltagkarte trägt ihre Zeilen
   selbst – meine Aufgaben, was ich übernehmen kann, was sonst noch fehlt.
   Grundsatz wie in der ganzen App: Text ist weiß. Zustände zeigen Rahmen,
   Flächen, Symbole und die Signalfarben Grün und Gelb – nie ein Grauton. */

.tve-dash__head,
.tve-mp__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}
.tve-dash__head { display: block; margin-bottom: 1.1rem; }

.tve-dash__kicker {
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: .35rem;
}

.tve-dash__sub,
.tve-mp__sub {
    margin-top: .35rem;
    color: #fff;
}
.tve-dash__sub { font-size: 1.05rem; }
.tve-dash__sub a {
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(125, 255, 179, 0.6);
}
.tve-dash__sub a:hover { color: var(--tve-accent); }

.tve-mp__stats {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.tve-card__value--ok { color: var(--tve-accent); }

.tve-nowrap { white-space: nowrap; }
.tve-sr {
    position: absolute;
    width: 1px; height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.tve-arrow { width: 14px; height: 14px; flex-shrink: 0; transition: transform .15s; }

/* ── Hinweis für Systemadmins: wartende Konten ───────────────────────────── */

.tve-dash-notice {
    display: flex;
    align-items: center;
    gap: .75rem;
    flex-wrap: wrap;
    padding: .7rem 1rem;
    margin-bottom: 1.1rem;
    border: 1.5px solid rgba(255, 190, 90, 0.45);
    border-radius: var(--tve-radius-sm);
    background: rgba(255, 190, 90, 0.12);
    font-size: .92rem;
}
.tve-dash-notice svg { width: 18px; height: 18px; flex-shrink: 0; color: #ffd79a; }
.tve-dash-notice a { margin-left: auto; font-weight: 700; color: #ffd79a; white-space: nowrap; }
.tve-dash-notice a:hover { text-decoration: underline; }

/* ── Kennzahlen: eine Leiste, jede Zahl ist ein Link ─────────────────────── */

.tve-dash-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 1.25rem;
    padding: 0;
    overflow: hidden;
}

.tve-dash-stat {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: .1rem;
    padding: 1rem 2.6rem 1.05rem 1.25rem;
    transition: background .15s;
}
.tve-dash-stat + .tve-dash-stat { border-left: 1.5px solid var(--tve-border); }
.tve-dash-stat:hover { background: rgba(255, 255, 255, 0.06); }
.tve-dash-stat:focus-visible { outline: 2px solid var(--tve-accent); outline-offset: -2px; }

.tve-dash-stat__label {
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.tve-dash-stat__value { font-size: 1.7rem; font-weight: 900; line-height: 1.1; }
.tve-dash-stat__value small { font-size: .95rem; font-weight: 700; margin-left: .2rem; }
.tve-dash-stat__value.is-ok   { color: var(--tve-accent); }
.tve-dash-stat__value.is-open { color: #ffd79a; }
.tve-dash-stat__sub { font-size: .85rem; }

.tve-dash-stat > .tve-arrow { position: absolute; top: 1rem; right: 1.1rem; width: 16px; height: 16px; }
.tve-dash-stat:hover > .tve-arrow { transform: translateX(3px); }

/* Füllbalken – in der Leiste und an jedem Spieltag */
.tve-fill { display: flex; align-items: center; gap: .6rem; }
.tve-fill__bar {
    flex: 1;
    min-width: 60px;
    height: 7px;
    border-radius: 99px;
    background: rgba(255, 255, 255, 0.14);
    overflow: hidden;
}
.tve-fill__bar > span {
    display: block;
    height: 100%;
    border-radius: 99px;
    background: var(--tve-accent);
}
.tve-fill__text { font-size: .82rem; font-weight: 600; white-space: nowrap; }
.tve-fill:not(.is-open) .tve-fill__text { color: var(--tve-accent); font-weight: 700; }
.tve-dash-stat .tve-fill { margin: .45rem 0 .15rem; }

/* ── Abschnittskopf „Danach" und Links ───────────────────────────────────── */

.tve-dash-section {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: .5rem 1rem;
    flex-wrap: wrap;
    margin: 1.75rem 0 .8rem;
}
.tve-dash-section__title { font-size: 1.15rem; font-weight: 800; }
.tve-dash-section__links { display: flex; gap: .4rem 1.1rem; flex-wrap: wrap; }

.tve-dash-link {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    font-size: .88rem;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(255, 255, 255, 0.35);
}
.tve-dash-link:hover { color: var(--tve-accent); text-decoration-color: currentColor; }
.tve-dash-link:hover .tve-arrow { transform: translateX(3px); }

/* ── Spieltagkarte ───────────────────────────────────────────────────────── */

.tve-dash-md {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .9rem 1rem;
    margin-bottom: 0;
    padding: 1.15rem 1.2rem;
    scroll-margin-top: calc(var(--tve-nav-height) + 1rem);
}
.tve-dash-md__rows { grid-column: 1 / -1; }

/* Der nächste Spieltag: Kopf links, Zeilen rechts */
.tve-dash-md.is-hero {
    grid-template-columns: auto minmax(0, 1fr) minmax(0, 1.05fr);
    gap: 1rem 1.4rem;
    margin-bottom: 0;
    padding: 1.5rem;
    border-color: rgba(125, 255, 179, 0.35);
    background: linear-gradient(135deg, rgba(125, 255, 179, 0.07), rgba(0, 0, 0, 0.32) 55%);
}
.tve-dash-md.is-hero .tve-dash-md__rows { grid-column: auto; align-self: center; }
.tve-dash-md.is-hero.is-done { grid-template-columns: auto minmax(0, 1fr); }
.tve-dash-md.is-today {
    border-color: var(--tve-accent);
    box-shadow: 0 0 0 1px rgba(125, 255, 179, 0.25), var(--tve-shadow);
}
.tve-dash-md:target { animation: tve-dash-flash 1.6s ease-out; }

/* Datumsblock */
.tve-dash-date {
    width: 58px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-self: start;
    padding: .45rem 0 .5rem;
    border: 1.5px solid var(--tve-border-strong);
    border-radius: var(--tve-radius-sm);
    background: rgba(255, 255, 255, 0.06);
    line-height: 1;
}
.tve-dash-date__wd,
.tve-dash-date__mon { font-size: .66rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.tve-dash-date__day { font-size: 1.55rem; font-weight: 900; margin: .18rem 0; }
.is-hero .tve-dash-date { width: 74px; padding: .6rem 0 .65rem; }
.is-hero .tve-dash-date__day { font-size: 2.1rem; }
.is-today .tve-dash-date { background: var(--tve-accent); border-color: var(--tve-accent); color: #0a1f12; }

.tve-dash-md__kicker { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; margin-bottom: .35rem; }
.tve-dash-md__kicker .tve-chip { color: #fff; }
.tve-dash-md__kicker .tve-type--heim { color: var(--tve-accent); }
.tve-dash-md__kicker .tve-type--auswaerts { color: #d6e7ff; }
.tve-dash-md__kicker .tve-type--turnier { color: #ffd79a; }
.tve-dash-rel { font-size: .8rem; font-weight: 700; }
.tve-dash-rel.is-soon { color: #ffd79a; }
.is-today .tve-dash-rel { color: var(--tve-accent); }

.tve-dash-md__title { font-size: 1.12rem; font-weight: 800; line-height: 1.2; }
.is-hero .tve-dash-md__title { font-size: 1.55rem; }
.tve-dash-md__title a:hover { color: var(--tve-accent); }
.tve-dash-md__title .tve-arrow { width: .8em; height: .8em; margin-left: .2rem; vertical-align: -.05em; }
.tve-dash-md__title a:hover .tve-arrow { transform: translateX(3px); }

.tve-dash-md .tve-day__meta { margin-top: .4rem; font-size: .88rem; gap: .25rem .9rem; }
.tve-dash-md .tve-day__meta-icon { opacity: 1; }
.tve-dash-md .tve-day__meta-item.is-open { color: #ffd79a; }

.tve-dash-route {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    margin-left: .2rem;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(255, 255, 255, 0.35);
}
.tve-dash-route:hover { color: var(--tve-accent); text-decoration-color: currentColor; }
.tve-dash-route svg { width: 12px; height: 12px; }

.tve-dash-md .tve-fill { margin-top: .75rem; max-width: 360px; }

.tve-dash-md__tools { display: flex; gap: .45rem; flex-wrap: wrap; margin-top: .9rem; }
.tve-dash-md__tools .tve-btn { margin-top: 0; }
.tve-dash-md__tools svg { width: 14px; height: 14px; }

/* ── Zeilen einer Spieltagkarte ──────────────────────────────────────────── */

.tve-dash-rows { list-style: none; display: flex; flex-direction: column; gap: .45rem; }

.tve-dash-row {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-height: 46px;
    padding: .55rem .6rem .55rem .75rem;
    border: 1.5px solid var(--tve-border);
    border-radius: var(--tve-radius-sm);
    background: var(--tve-surface-soft);
    scroll-margin-top: calc(var(--tve-nav-height) + 6rem);
}
.tve-dash-row.is-busy { opacity: .5; pointer-events: none; }
.tve-dash-row .tve-dot { margin-right: 0; flex-shrink: 0; align-self: center; }
.tve-dash-row .tve-btn { margin-top: 0; flex-shrink: 0; }

.tve-dash-row__body {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: .1rem .5rem;
}
.tve-dash-row__cal   { font-weight: 700; white-space: nowrap; }
.tve-dash-row__time  { font-size: .86rem; white-space: nowrap; }
.tve-dash-row__label { font-size: .86rem; font-style: italic; }
.tve-dash-row__free  { font-size: .78rem; font-weight: 800; color: #ffd79a; white-space: nowrap; }

.tve-dash-row--mine {
    border-color: rgba(125, 255, 179, 0.45);
    background: rgba(125, 255, 179, 0.09);
}
.tve-dash-row__me {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .2rem .6rem;
    border-radius: 99px;
    background: rgba(125, 255, 179, 0.18);
    color: var(--tve-accent);
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .03em;
    white-space: nowrap;
}
.tve-dash-row__me svg { width: 13px; height: 13px; }

/* Eigener Einsatz: die ganze Zeile öffnet die Angaben mit „Schicht abgeben". */
.tve-dash-row--mine { position: relative; cursor: pointer; transition: background .15s, border-color .15s; }
.tve-dash-row--mine:hover { background: rgba(125, 255, 179, 0.15); border-color: rgba(125, 255, 179, 0.65); }
.tve-dash-row__hit {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    border: 0;
    border-radius: inherit;
    background: transparent;
    cursor: pointer;
}
.tve-dash-row__hit:focus-visible { outline: 2px solid var(--tve-accent); outline-offset: 2px; }
.tve-dash-row__chevron { width: 16px; height: 16px; flex-shrink: 0; color: var(--tve-accent); transition: transform .15s; }
.tve-dash-row--mine:hover .tve-dash-row__chevron { transform: translateX(2px); }

.tve-dash-row--open { border-color: rgba(255, 190, 90, 0.4); }
.tve-dash-row:target { animation: tve-dash-flash 1.6s ease-out; }

@keyframes tve-dash-flash {
    0%, 35% { box-shadow: 0 0 0 3px rgba(255, 215, 154, 0.75); }
    100%    { box-shadow: 0 0 0 0 rgba(255, 215, 154, 0); }
}

/* Offen, aber nicht für mich – eine Zeile, gestrichelt statt grau */
.tve-dash-rest {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: .15rem .5rem;
    margin-top: .45rem;
    padding: .5rem .75rem;
    border: 1.5px dashed var(--tve-border-strong);
    border-radius: var(--tve-radius-sm);
    font-size: .85rem;
}
.tve-dash-rows + .tve-dash-rest { margin-top: .45rem; }
.tve-dash-md__rows > .tve-dash-rest:first-child { margin-top: 0; }
.tve-dash-rest a { margin-left: auto; font-weight: 700; color: #ffd79a; white-space: nowrap; }
.tve-dash-rest a:hover { text-decoration: underline; }

/* Die folgenden Spieltage nebeneinander */
.tve-dash-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    align-items: start;
}

/* ── Zeilen von „Meine Einsätze" ─────────────────────────────────────────── */

.tve-mine { display: flex; flex-direction: column; gap: .45rem; }

.tve-mine__row {
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .6rem .75rem;
    border: 1.5px solid var(--tve-border);
    border-radius: var(--tve-radius-sm);
    background: var(--tve-surface-soft);
}
.tve-mine__row.is-busy { opacity: .5; pointer-events: none; }

.tve-mine__body {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: .5rem;
    flex-wrap: wrap;
}

.tve-mine__day { font-weight: 700; white-space: nowrap; }
.tve-mine__day:hover { color: var(--tve-accent); }
.tve-mine__cal { font-weight: 600; }
.tve-mine__time { color: #fff; font-size: .88rem; white-space: nowrap; }
.tve-mine__label { color: #fff; font-size: .85rem; }

.tve-mine__note {
    flex: 1 1 100%;
    color: #fff;
    font-size: .85rem;
    font-style: italic;
}

.tve-mine__row .tve-btn { margin-top: 0; flex-shrink: 0; }

/* ── Meine Einsätze ──────────────────────────────────────────────────────── */

.tve-mp__day-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .8rem;
}

.tve-mp__day-title { font-size: 1.2rem; font-weight: 800; line-height: 1.2; }
.tve-mp__day-title a:hover { color: var(--tve-accent); }
.tve-mp__day-sub { margin-top: .2rem; color: #fff; font-size: .9rem; }

.tve-mp__day-count {
    font-size: .82rem;
    font-weight: 700;
    color: var(--tve-text-muted);
    white-space: nowrap;
}

.tve-mp__day--past { opacity: .75; }

.tve-mp__past-wrap { margin-top: 1.75rem; }

.tve-mp__past-toggle {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem .95rem;
    border: 1.5px solid var(--tve-border-strong);
    border-radius: 999px;
    background: var(--tve-surface-soft);
    font-size: .85rem;
    font-weight: 700;
    list-style: none;
    margin-bottom: 1rem;
}
.tve-mp__past-toggle::-webkit-details-marker { display: none; }
.tve-mp__past-toggle::before { content: '▸'; }
.tve-mp__past-wrap[open] .tve-mp__past-toggle::before { content: '▾'; }
.tve-mp__past-toggle:hover { background: rgba(255, 255, 255, 0.14); }

/* ── Schmale Bildschirme ─────────────────────────────────────────────────── */

@media (max-width: 1100px) {
    .tve-dash-md.is-hero { grid-template-columns: auto minmax(0, 1fr); }
    .tve-dash-md.is-hero .tve-dash-md__rows { grid-column: 1 / -1; }
    .tve-dash-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
    .tve-dash-list { grid-template-columns: minmax(0, 1fr); }

    /* Kennzahlen untereinander, Zahl rechts – so bleibt die Leiste kurz */
    .tve-dash-stats { grid-template-columns: minmax(0, 1fr); }
    .tve-dash-stat {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        column-gap: 1rem;
        padding: .8rem 2.6rem .8rem 1rem;
    }
    .tve-dash-stat + .tve-dash-stat { border-left: 0; border-top: 1.5px solid var(--tve-border); }
    .tve-dash-stat__label { grid-column: 1; grid-row: 1; }
    .tve-dash-stat__sub   { grid-column: 1; grid-row: 2; }
    .tve-dash-stat__value { grid-column: 2; grid-row: 1 / span 2; font-size: 1.45rem; text-align: right; }
    .tve-dash-stat .tve-fill { grid-column: 1 / -1; grid-row: 3; }
    .tve-dash-stat > .tve-arrow { top: 50%; right: .9rem; margin-top: -8px; }
}

@media (max-width: 640px) {
    .tve-mp__head { flex-direction: column; align-items: stretch; }

    .tve-mine__row { flex-wrap: wrap; }
    .tve-mine__body { flex: 1 1 70%; }
    .tve-mine__row .tve-btn { margin-left: auto; }
}

@media (max-width: 480px) {
    .tve-dash-md,
    .tve-dash-md.is-hero { padding: 1rem; gap: .8rem .85rem; }
    .is-hero .tve-dash-date { width: 60px; }
    .is-hero .tve-dash-date__day { font-size: 1.65rem; }
    .is-hero .tve-dash-md__title { font-size: 1.28rem; }
    .tve-dash-md .tve-fill { max-width: none; }

    .tve-dash-row { flex-wrap: wrap; }
    .tve-dash-row__body { flex: 1 1 8.5rem; }
    .tve-dash-row--open .tve-btn { margin-left: auto; }
    .tve-dash-rest a { margin-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .tve-dash-md:target,
    .tve-dash-row:target { animation: none; outline: 3px solid #ffd79a; }
    .tve-arrow { transition: none; }
}

/* ── 13  Spieltagkalender und Einsatzreport (Batch 5) ────────────────────── */

/* Umschalter Liste / Monat – zwei Links, die wie ein Segment-Control aussehen */
.tve-switch {
    display: inline-flex;
    padding: 3px;
    border: 1.5px solid var(--tve-border);
    border-radius: 999px;
    background: var(--tve-surface);
}
.tve-switch__item {
    padding: .35rem .95rem;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 700;
    color: var(--tve-text-muted);
    transition: background .15s, color .15s;
}
.tve-switch__item:hover { color: #fff; }
.tve-switch__item.is-active {
    background: var(--tve-surface-soft);
    border: 1px solid var(--tve-border-strong);
    color: #fff;
}

/* Spieltyp-Badge – dieselbe Form wie tve-chip, aber je Typ eingefärbt */
.tve-type {
    display: inline-block;
    padding: .1rem .55rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.1);
    color: var(--tve-text-muted);
    font-size: .7rem;
    font-weight: 700;
    letter-spacing: .04em;
    white-space: nowrap;
}
.tve-type--heim      { background: rgba(125, 255, 179, 0.16); color: var(--tve-accent); }
.tve-type--auswaerts { background: rgba(120, 180, 255, 0.18); color: #b9d7ff; }
.tve-type--turnier   { background: rgba(255, 190, 90, 0.18);  color: #ffd79a; }

/* ── Spieltagkalender: Kopf und Liste ────────────────────────────────────── */

.tve-sp__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}
.tve-sp__sub { margin-top: .3rem; color: var(--tve-text-muted); }

.tve-sp__filter { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.tve-sp__filter .tve-chip { padding: .3rem .8rem; font-size: .78rem; }
.tve-sp__filter a.tve-chip:hover { background: rgba(255, 255, 255, 0.18); color: #fff; }

.tve-sp__month {
    margin: 1.5rem 0 .6rem;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--tve-text-faint);
}
.tve-sp__month:first-of-type { margin-top: 0; }

.tve-sp-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: .6rem;
    transition: background .15s, border-color .15s;
}
.tve-sp-item:hover { background: rgba(255, 255, 255, 0.09); border-color: var(--tve-border-strong); }
.tve-sp-item.is-past { opacity: .55; }

.tve-sp-item__date {
    flex-shrink: 0;
    width: 54px;
    text-align: center;
    line-height: 1.1;
}
.tve-sp-item__wd    { display: block; font-size: .68rem; color: var(--tve-text-faint); text-transform: uppercase; }
.tve-sp-item__day   { display: block; font-size: 1.55rem; font-weight: 900; }
.tve-sp-item__month { display: block; font-size: .68rem; color: var(--tve-text-muted); text-transform: uppercase; }

.tve-sp-item__body { flex: 1; min-width: 0; }
.tve-sp-tags { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .25rem; }
.tve-sp-item__title { display: block; font-weight: 700; }

/* Anwurf und Halle unter dem Titel (Version 1.3). */
.tve-sp-item__meta {
    display: flex;
    flex-wrap: wrap;
    gap: .1rem .8rem;
    margin-top: .12rem;
    font-size: .8rem;
    color: #fff;
}
.tve-sp-item__meta-item { display: inline-block; }
.tve-sp-item__meta-item.is-open { color: var(--tve-text-faint); font-style: italic; }

.tve-sp-item__desc {
    display: block;
    font-size: .82rem;
    color: var(--tve-text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tve-sp-item__stats { flex-shrink: 0; text-align: right; }
.tve-sp-item__fill       { display: block; font-size: 1.05rem; font-weight: 800; }
.tve-sp-item__fill-label { display: block; font-size: .68rem; color: var(--tve-text-faint); }
.tve-sp-item__chips      { display: flex; flex-wrap: wrap; gap: .3rem; justify-content: flex-end; margin-top: .3rem; }

/* ── Spieltagkalender: Monatsraster ──────────────────────────────────────── */

.tve-mon__head {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-bottom: .9rem;
}
.tve-mon__title { font-size: 1.2rem; font-weight: 800; min-width: 11rem; text-align: center; }

.tve-mon__jump { display: flex; flex-wrap: wrap; gap: .3rem; justify-content: center; margin-bottom: 1rem; }
.tve-mon__jump a.tve-chip:hover { background: rgba(255, 255, 255, 0.18); color: #fff; }

.tve-mon__grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
}

.tve-mon__wd {
    padding: .3rem 0;
    text-align: center;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--tve-text-faint);
}

.tve-mon__day {
    display: flex;
    flex-direction: column;
    gap: .15rem;
    min-height: 74px;
    padding: .35rem .4rem;
    border: 1.5px solid transparent;
    border-radius: var(--tve-radius-xs);
    background: rgba(255, 255, 255, 0.04);
    color: inherit;
}
.tve-mon__day.is-out { opacity: .3; }
.tve-mon__day.is-today { border-color: var(--tve-border-strong); }
.tve-mon__day.has-md {
    background: rgba(125, 255, 179, 0.1);
    border-color: rgba(125, 255, 179, 0.3);
}
.tve-mon__day.has-md:hover { background: rgba(125, 255, 179, 0.2); }
.tve-mon__day.has-md.is-past { background: rgba(255, 255, 255, 0.06); border-color: var(--tve-border); opacity: .6; }

.tve-mon__num { font-size: .82rem; font-weight: 700; }
.tve-mon__label {
    font-size: .7rem;
    line-height: 1.2;
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tve-mon__time { font-size: .64rem; color: #fff; }
.tve-mon__bar { margin-top: auto; font-size: .64rem; font-weight: 700; }
.tve-mon__mine { color: var(--tve-accent); }
.tve-mon__open { color: #ffd79a; }
.tve-mon__full { color: var(--tve-text-faint); }

/* ── Einsatzreport: Kopf und Filter ──────────────────────────────────────── */

.tve-rep__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}
.tve-rep__sub { margin-top: .3rem; color: var(--tve-text-muted); }
.tve-rep__export { display: flex; flex-wrap: wrap; gap: .5rem; }
.tve-rep__export .tve-btn { margin-top: 0; }

.tve-rep__filter { align-items: flex-end; }
.tve-rep__filter-field { flex: 0 1 150px; }
.tve-rep__filter-field--grow { flex: 1 1 180px; }
.tve-rep__filter-field .tve-field__label { margin-bottom: .25rem; }
.tve-rep__filter-actions { display: flex; gap: .4rem; align-items: flex-end; }
.tve-rep__filter-actions .tve-btn { margin-top: 0; }

.tve-rep__block { margin-bottom: 1.25rem; }
.tve-rep__block-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: .9rem;
}
.tve-rep__block-title { font-size: 1.1rem; font-weight: 800; }
.tve-rep__block-head .tve-hint { margin: 0; }

.tve-rep__legend { display: flex; align-items: center; gap: .35rem; font-size: .74rem; color: var(--tve-text-faint); }
.tve-rep__key { display: inline-block; width: 12px; height: 8px; border-radius: 3px; margin-left: .5rem; }
.tve-rep__key--past   { background: var(--tve-accent); }
.tve-rep__key--future { background: rgba(255, 190, 90, 0.75); }

/* ── Einsatzreport: Ranking ──────────────────────────────────────────────── */

.tve-rank { list-style: none; display: flex; flex-direction: column; gap: .3rem; }

.tve-rank__row {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: .55rem .6rem;
    border: 1.5px solid transparent;
    border-radius: var(--tve-radius-sm);
}
.tve-rank__row:hover { background: var(--tve-surface-soft); }
.tve-rank__row.is-me { border-color: rgba(125, 255, 179, 0.4); background: rgba(125, 255, 179, 0.07); }
.tve-rank__row.is-gone { opacity: .6; }

.tve-rank__pos {
    flex-shrink: 0;
    width: 26px;
    text-align: right;
    font-size: .9rem;
    font-weight: 800;
    color: var(--tve-text-faint);
}

.tve-rank__body { flex: 1; min-width: 0; }
.tve-rank__name { display: flex; align-items: center; gap: .45rem; font-weight: 700; }

.tve-rank__bar {
    display: flex;
    height: 8px;
    margin-top: .35rem;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.08);
    overflow: hidden;
}
.tve-rank__seg { display: block; height: 100%; }
.tve-rank__seg--past   { background: var(--tve-accent); }
.tve-rank__seg--future { background: rgba(255, 190, 90, 0.75); }

.tve-rank__meta { display: block; margin-top: .25rem; font-size: .74rem; color: var(--tve-text-faint); }

.tve-rank__nums { flex-shrink: 0; display: flex; align-items: baseline; gap: .5rem; }
.tve-rank__num   { font-size: .95rem; font-weight: 700; color: var(--tve-accent); }
.tve-rank__num--future { color: #ffd79a; }
.tve-rank__total {
    min-width: 2.2rem;
    text-align: right;
    font-size: 1.15rem;
    font-weight: 900;
}

/* ── Einsatzreport: Matrix ───────────────────────────────────────────────── */

.tve-matrix__scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.tve-matrix {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    font-size: .82rem;
}

.tve-matrix th,
.tve-matrix td {
    padding: .4rem .5rem;
    border-bottom: 1px solid var(--tve-border);
    text-align: center;
    white-space: nowrap;
}

.tve-matrix__corner,
.tve-matrix__person {
    position: sticky;
    left: 0;
    z-index: 2;
    min-width: 9.5rem;
    max-width: 13rem;
    text-align: left;
    font-weight: 700;
    /* Deckend genug, damit die Zahlen darunter durchscrollen, ohne dass die
       Glasoptik der Karte verloren geht. */
    background: rgba(14, 9, 11, 0.92);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    overflow: hidden;
    text-overflow: ellipsis;
}
.tve-matrix__corner { z-index: 3; }

.tve-matrix__day {
    min-width: 3.6rem;
    font-weight: 700;
    color: var(--tve-text-muted);
    line-height: 1.15;
}
.tve-matrix__day.is-past { color: var(--tve-text-faint); }
.tve-matrix__num  { display: block; font-size: .7rem; }
.tve-matrix__date { display: block; font-size: .66rem; font-weight: 600; color: var(--tve-text-faint); }

/* Dieselben zwei Farben wie im Ranking: Grün ist geleistet, Bernstein
   geplant. Wer die Legende oben gelesen hat, muss sie hier nicht neu lernen. */
.tve-matrix__cell { color: var(--tve-text-faint); }
.tve-matrix__cell.is-on { color: #ffd79a; font-weight: 800; background: rgba(255, 190, 90, 0.1); }
.tve-matrix__cell.is-on.is-past { color: var(--tve-accent); background: rgba(125, 255, 179, 0.1); }

.tve-matrix__sum { font-weight: 800; color: #fff; }
.tve-matrix tbody tr:hover td { background: rgba(255, 255, 255, 0.05); }
.tve-matrix tbody tr.is-me td { background: rgba(125, 255, 179, 0.08); }
.tve-matrix tbody tr.is-me th { background: rgba(26, 40, 32, 0.94); color: var(--tve-accent); }
.tve-matrix tfoot th,
.tve-matrix tfoot td { border-bottom: none; border-top: 1.5px solid var(--tve-border-strong); color: var(--tve-text-muted); }

.tve-rep__idle-list { display: flex; flex-wrap: wrap; gap: .3rem; padding-bottom: .8rem; }

/* ── Schmale Bildschirme ─────────────────────────────────────────────────── */

@media (max-width: 640px) {
    .tve-sp__head,
    .tve-rep__head { flex-direction: column; align-items: stretch; }

    .tve-sp-item { gap: .7rem; padding: .9rem 1rem; }
    .tve-sp-item__date { width: 42px; }
    .tve-sp-item__day  { font-size: 1.3rem; }
    .tve-sp-item__fill-label { display: none; }

    .tve-mon__day { min-height: 58px; padding: .25rem .3rem; }
    .tve-mon__label { display: none; }
    .tve-mon__title { min-width: 0; font-size: 1.05rem; }

    /* Datumsfelder bringen eine breite Mindestgröße mit – ohne min-width: 0
       sprengen zwei nebeneinander die Zeile und „von" bliebe allein stehen. */
    .tve-rep__filter-field { flex: 1 1 calc(50% - .25rem); min-width: 0; }
    .tve-rep__filter-field--grow,
    .tve-rep__filter-actions { flex: 1 1 100%; }

    .tve-rank__meta { display: none; }
    .tve-rank__nums { flex-direction: column; align-items: flex-end; gap: 0; }

    .tve-matrix__corner,
    .tve-matrix__person { min-width: 7rem; max-width: 8rem; }
}

/* ── 14  Batch 6: Wartung, System-Tab, Protokoll, Installationshinweis ───── */

/* Hinweisbalken für Systemadmins, solange der Wartungsmodus läuft.
   Bewusst auffällig: wer ihn übersieht, wundert sich abends, warum sich
   niemand für den Spieltag eingetragen hat. */
.tve-maint-bar {
    margin-bottom: 1.5rem;
    padding: .8rem 1.1rem;
    border-radius: var(--tve-radius-sm);
    border: 1.5px solid rgba(255, 205, 120, 0.5);
    background: rgba(120, 70, 0, 0.32);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    font-size: .92rem;
    color: #ffe6bd;
}
.tve-maint-bar a { text-decoration: underline; }

/* ── System-Tab ──────────────────────────────────────────────────────────── */

.tve-sys__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .8rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
}
.tve-sys__head .tve-card__title { margin-bottom: 0; }

.tve-sys__chip--ok    { border-color: rgba(125, 255, 179, 0.45); color: #cdffe4; }
.tve-sys__chip--warn  { border-color: rgba(255, 205, 120, 0.5);  color: #ffe6bd; }
.tve-sys__chip--error { border-color: rgba(255, 154, 154, 0.5);  color: #ffd9d9; }

.tve-sys__group { margin-top: 1.2rem; }
.tve-sys__group:first-of-type { margin-top: 0; }

.tve-sys__group-title {
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--tve-text-faint);
    margin-bottom: .45rem;
}

.tve-sys__list { list-style: none; }

.tve-sys__row {
    display: grid;
    grid-template-columns: 10px 12rem 1fr;
    align-items: baseline;
    gap: .7rem;
    padding: .45rem 0;
    border-top: 1px solid var(--tve-border);
    font-size: .92rem;
}
.tve-sys__row:first-child { border-top: 0; }

/* Bei mehrzeiligen Werten (sql_mode!) soll der Punkt oben an der ersten
   Zeile stehen, nicht in der Mitte des Absatzes schweben. */
.tve-sys__dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    align-self: start;
    margin-top: .45rem;
    background: var(--tve-text-faint);
}
.tve-sys__dot--ok    { background: var(--tve-accent); }
.tve-sys__dot--warn  { background: #ffc46b; }
.tve-sys__dot--error { background: var(--tve-error); }

.tve-sys__label { color: var(--tve-text-muted); }
.tve-sys__value { word-break: break-word; }

.tve-sys__hint {
    display: block;
    margin-top: .15rem;
    font-size: .82rem;
    color: #ffd79a;
}

/* ── Fehlerprotokoll ─────────────────────────────────────────────────────── */

.tve-log {
    list-style: none;
    margin-top: .9rem;
    max-height: 26rem;
    overflow-y: auto;
    border: 1px solid var(--tve-border);
    border-radius: var(--tve-radius-sm);
}

.tve-log__row {
    padding: .6rem .85rem;
    border-top: 1px solid var(--tve-border);
}
.tve-log__row:first-child { border-top: 0; }

.tve-log__meta {
    display: flex;
    align-items: center;
    gap: .6rem;
    flex-wrap: wrap;
    font-size: .76rem;
    color: var(--tve-text-faint);
}

.tve-log__level {
    font-weight: 700;
    letter-spacing: .06em;
}
.tve-log__row--fehler  .tve-log__level { color: var(--tve-error); }
.tve-log__row--warnung .tve-log__level { color: #ffc46b; }
.tve-log__row--info    .tve-log__level { color: var(--tve-text-muted); }

.tve-log__id { font-size: .72rem; }

/* Die Meldung darf lang sein – umbrechen statt die Karte sprengen. */
.tve-log__msg {
    margin-top: .2rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: .78rem;
    line-height: 1.45;
    color: #fff;
    word-break: break-word;
}

/* ── Installationshinweis (PWA) ──────────────────────────────────────────── */

.tve-install {
    position: fixed;
    left: 50%;
    bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
    transform: translateX(-50%);
    z-index: 3000;
    width: calc(100% - 2rem);
    max-width: 34rem;
    display: flex;
    align-items: center;
    gap: .9rem;
    padding: .85rem 1rem;
    border-radius: var(--tve-radius-sm);
    border: 1.5px solid var(--tve-border-strong);
    background: rgba(20, 16, 15, 0.92);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: var(--tve-shadow);
    animation: tve-install-in .25s ease-out;
}

@keyframes tve-install-in {
    from { opacity: 0; transform: translate(-50%, 12px); }
    to   { opacity: 1; transform: translate(-50%, 0); }
}

.tve-install__text { flex: 1; font-size: .88rem; line-height: 1.4; }

.tve-install__actions { display: flex; align-items: center; gap: .5rem; }

.tve-install__close {
    width: 30px; height: 30px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--tve-text-muted);
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
}
.tve-install__close:hover { background: var(--tve-surface-soft); color: #fff; }

@media (max-width: 640px) {
    .tve-sys__row { grid-template-columns: 10px 1fr; }
    .tve-sys__label { grid-column: 2; font-size: .78rem; }
    .tve-sys__value { grid-column: 2; }

    .tve-install { flex-direction: column; align-items: stretch; gap: .6rem; }
    .tve-install__actions { justify-content: flex-end; }
}

/* ── 14  Batch 7: Hilfe, Auth-Ergänzungen, Mail-Tab ──────────────────────────
 *
 * Bewusst wenig Neues: die Seiten aus Batch 7 benutzen die vorhandenen
 * Bausteine (Karte, Feld, Chip, Details). Hier steht nur, was es davor
 * wirklich noch nicht gab.
 */

/* Aufzählungen auf der Hilfe-Seite. Der Bestand hatte nur Listen ohne
   Punkte – hier wird tatsächlich aufgezählt. */
.tve-list {
    margin: .8rem 0 0;
    padding-left: 1.15rem;
    color: #fff;
    font-size: .92rem;
    line-height: 1.6;
}
.tve-list li { margin-bottom: .5rem; }
.tve-list li:last-child { margin-bottom: 0; }
.tve-list a { color: var(--tve-accent); text-decoration: none; }
.tve-list a:hover { text-decoration: underline; }
.tve-list code,
.tve-card__text code {
    padding: .05rem .3rem;
    border-radius: 5px;
    background: var(--tve-surface-soft);
    font-size: .85em;
}

/* Erklärtext in den Auth-Karten (Reset, Registrierung). */
.tve-auth__text {
    margin: 0 0 1rem;
    font-size: .88rem;
    line-height: 1.55;
    color: #fff;
}

/* Nebenwege unter der Schaltfläche: „Passwort vergessen", „zurück". */
.tve-auth__links {
    margin-top: .9rem;
    text-align: center;
    font-size: .85rem;
}
.tve-auth__links a { color: var(--tve-accent); text-decoration: none; }
.tve-auth__links a:hover { text-decoration: underline; }

/* Vor- und Nachname nebeneinander, auf dem Handy untereinander. */
.tve-auth__row { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }

@media (max-width: 480px) {
    .tve-auth__row { grid-template-columns: 1fr; gap: 0; }
}

/* Manche Weiter-Schaltflächen sind Links (kein Formular dahinter) und
   müssen trotzdem wie eine Schaltfläche aussehen. */
a.tve-auth__submit {
    display: block;
    text-align: center;
    text-decoration: none;
    box-sizing: border-box;
}

/* Wartende Registrierungen im Nutzer-Tab. */
.tve-chip--warn { background: rgba(255, 190, 90, 0.18); color: #ffd79a; }
a.tve-chip--warn { text-decoration: none; }
a.tve-chip--warn:hover { background: rgba(255, 190, 90, 0.3); }

/* Die Vorlagen im Mail-Tab sind aufklappbar; ihre Überschrift trägt
   gelegentlich noch einen Chip. */
.tve-details > summary .tve-chip { margin-left: .5rem; vertical-align: middle; }

/* Im Mail-Tab stehen Schalter mitten zwischen Feldern; ohne etwas Luft
   kleben sie am nächsten Feldnamen. In den Einstellungen steht der
   Wartungsschalter für sich allein – dort passt margin:0 weiter. */
#tveMail .tve-check--inline { margin: .3rem 0 1.1rem; }


/* ── Einladungscodes (Admin-Tab „Einladungen") ─────────────────────────────
   Eine Liste, die vorgelesen und abgetippt wird: der Code steht deshalb in
   einer Festbreitenschrift und deutlich größer als der Rest der Zeile. */

/* Notiz breit, die kleinen Felder schmal – der Standard-Zweispalter
   würde das dritte Feld in eine eigene Zeile schieben. */
.tve-form__row--invite { grid-template-columns: 1fr 200px 130px; }

@media (max-width: 620px) {
    .tve-form__row--invite { grid-template-columns: 1fr; }
}

.tve-invite-list {
    list-style: none;
    margin: 1rem 0 0;
    padding: 0;
}

.tve-invite {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
    padding: .75rem .9rem;
    margin-bottom: .5rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.04);
}

.tve-invite.is-done { opacity: .62; }

.tve-invite__main { min-width: 0; }

.tve-invite__code {
    display: block;
    font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: .06em;
}

.tve-invite.is-open .tve-invite__code { color: var(--tve-accent); }

.tve-invite__note {
    display: block;
    font-size: .9rem;
    margin-top: .1rem;
}

.tve-invite__meta {
    display: block;
    font-size: .78rem;
    color: var(--tve-text-muted);
    margin-top: .15rem;
}

/* Wer den Code eingelöst hat – bei einem Sammelcode sind das mehrere. */
.tve-invite__people {
    display: block;
    font-size: .78rem;
    color: #fff;
    margin-top: .2rem;
}

.tve-invite__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .4rem;
}

.tve-invite__actions .tve-btn { margin-top: 0; }

/* Der Zugangscode auf der Registrierungsseite: gleiche Schrift wie in der
   Liste, damit „Null oder O?" gar nicht erst aufkommt. */
.tve-field__input--code {
    font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
    font-size: 1.1rem;
    letter-spacing: .12em;
    text-transform: uppercase;
}

@media (max-width: 560px) {
    .tve-invite { flex-direction: column; align-items: stretch; }
    .tve-invite__actions { justify-content: flex-start; }
}