/*
 * Tournament System – Design-System v2
 *
 * Eine Gestaltungsgrundlage für beide Welten:
 *   - Frontend: Plugin-Ausgaben liegen in einem Element mit der Klasse .ts-ui
 *     (Turnierleitung, per Shortcode gerenderte Adminseiten, Frontend-Navigation).
 *   - Backend:  admin_body_class setzt .ts-ui auf <body>, sobald eine Plugin-Seite
 *     offen ist. Damit WordPress' eigene Oberfläche (Menü, Admin-Bar, Screen-Options)
 *     unberührt bleibt, greifen Regeln für nackte Elemente (h1, button, input, a, table)
 *     nur innerhalb von .wrap bzw. .ts-page. Klassenbasierte Regeln (.button, .notice,
 *     .wp-list-table, .ts-*) gelten überall unter .ts-ui.
 *
 * Aufbau:
 *   1. Tokens            5. Formulare           9. Hülle (Seitenkopf, Leiste, Krumen)
 *   2. Grundtypografie   6. Tabellen           10. Kacheln (Turnierleitung)
 *   3. Buttons           7. Hinweise           11. Hilfsklassen
 *   4. Karten/Marken     8. Leere Zustände     12. Responsiv / Druck
 *
 * Alle Klassen tragen das Präfix ts-. Bestehende Namen (ts-card, ts-badge, ts-chip,
 * ts-alert, ts-btn, ts-table) bleiben gültig.
 */

/* ======================================================================
 * 1. Tokens – auf :root, damit ts-Klassen auch außerhalb von .ts-ui funktionieren
 * ====================================================================== */
:root, .ts-ui {
    --ts-bg:          #f6f8fb;
    --ts-card:        #ffffff;
    --ts-border:      #e5e7eb;
    --ts-border-2:    #d1d5db;
    --ts-text:        #0f172a;
    --ts-text-2:      #334155;
    --ts-muted:       #64748b;
    --ts-muted-2:     #94a3b8;

    --ts-primary:     #2563eb;
    --ts-primary-d:   #1d4ed8;
    --ts-primary-bg:  #eff6ff;
    --ts-primary-bd:  #bfdbfe;

    --ts-success:     #15803d;
    --ts-success-bg:  #dcfce7;
    --ts-success-bd:  #86efac;
    --ts-danger:      #b91c1c;
    --ts-danger-bg:   #fee2e2;
    --ts-danger-bd:   #fca5a5;
    --ts-warn:        #b45309;
    --ts-warn-bg:     #fef3c7;
    --ts-warn-bd:     #fcd34d;
    --ts-info:        #0369a1;
    --ts-info-bg:     #e0f2fe;
    --ts-info-bd:     #7dd3fc;
    --ts-neutral-bg:  #f1f5f9;
    --ts-live:        #dc2626;

    --ts-radius:      12px;
    --ts-radius-sm:   8px;
    --ts-radius-xs:   6px;
    --ts-shadow:      0 1px 2px rgba(15, 23, 42, .04), 0 1px 3px rgba(15, 23, 42, .06);
    --ts-shadow-md:   0 4px 14px rgba(15, 23, 42, .08);
    --ts-focus:       0 0 0 3px rgba(37, 99, 235, .25);

    --ts-space-1: 4px;  --ts-space-2: 8px;  --ts-space-3: 12px;
    --ts-space-4: 16px; --ts-space-5: 20px; --ts-space-6: 24px; --ts-space-8: 32px;

    --ts-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --ts-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* ======================================================================
 * 2. Grundtypografie (nur innerhalb der Plugin-Inhalte)
 * ====================================================================== */
.ts-ui .wrap,
.ts-page {
    color: var(--ts-text);
    font-family: var(--ts-font);
    font-size: 14px;
    line-height: 1.55;
}
/* Frontend-Hülle: eigene Breite; im Backend behält .wrap die WordPress-Ränder */
.ts-admin-frontend-wrapper .wrap,
.ts-frontend-shell .wrap { margin: 0; max-width: none; }
body.ts-ui .wrap { max-width: 1320px; }

.ts-ui .wrap h1, .ts-page h1 { font-size: 1.65rem; font-weight: 800; letter-spacing: -.015em; margin: 0 0 .4rem; line-height: 1.2; color: var(--ts-text); }
.ts-ui .wrap h2, .ts-page h2 { font-size: 1.25rem; font-weight: 700; margin: 1.6rem 0 .7rem; letter-spacing: -.01em; color: var(--ts-text); }
.ts-ui .wrap h3, .ts-page h3 { font-size: 1.05rem; font-weight: 700; margin: 1.2rem 0 .5rem; color: var(--ts-text); }
.ts-ui .wrap h4, .ts-page h4 { font-size: .95rem; font-weight: 700; margin: 1rem 0 .4rem; color: var(--ts-text-2); }
.ts-ui .wrap hr,  .ts-page hr  { border: 0; border-top: 1px solid var(--ts-border); margin: 1.4rem 0; }
.ts-ui .wrap a:not(.button):not(.ts-btn):not(.ts-tile):not(.ts-pill),
.ts-page a:not(.button):not(.ts-btn):not(.ts-tile):not(.ts-pill) { color: var(--ts-primary); text-decoration: none; }
.ts-ui .wrap a:not(.button):not(.ts-btn):not(.ts-tile):not(.ts-pill):hover,
.ts-page a:not(.button):not(.ts-btn):not(.ts-tile):not(.ts-pill):hover { text-decoration: underline; }
.ts-ui .wrap code, .ts-page code { font-family: var(--ts-mono); font-size: .9em; background: var(--ts-neutral-bg); padding: 1px 5px; border-radius: 4px; }
.ts-ui .wrap p, .ts-page p { margin: 0 0 .8em; }

/* Sichtbarer Fokus für Tastatur- und Tablet-Bedienung */
.ts-ui :focus-visible { outline: none; box-shadow: var(--ts-focus); border-radius: var(--ts-radius-xs); }

/* ======================================================================
 * 3. Buttons
 * ====================================================================== */
.ts-ui .button,
.ts-btn,
.ts-ui input[type="submit"],
.ts-ui input[type="button"],
.ts-ui .wrap button:not(.ts-plain):not(.handlediv):not(.notice-dismiss),
.ts-page button:not(.ts-plain) {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    padding: 8px 16px; min-height: 38px; height: auto;
    border-radius: 999px; border: 1px solid var(--ts-border-2);
    background: #fff; color: var(--ts-text);
    font: inherit; font-size: 14px; font-weight: 600; line-height: 1.2;
    cursor: pointer; text-decoration: none; white-space: nowrap;
    box-shadow: none; transition: background .15s ease, border-color .15s ease, transform .05s ease;
}
.ts-ui .button:hover,
.ts-btn:hover,
.ts-ui input[type="submit"]:hover,
.ts-ui .wrap button:not(.ts-plain):hover,
.ts-page button:not(.ts-plain):hover { background: #f3f4f6; border-color: #cbd5e1; color: var(--ts-text); }
.ts-ui .button:active, .ts-btn:active { transform: translateY(1px); }

.ts-ui .button-primary,
.ts-ui input[type="submit"].button-primary,
.ts-btn-primary {
    background: var(--ts-primary); border-color: var(--ts-primary); color: #fff;
    text-shadow: none; box-shadow: none;
}
.ts-ui .button-primary:hover, .ts-btn-primary:hover { background: var(--ts-primary-d); border-color: var(--ts-primary-d); color: #fff; }
.ts-btn-success { background: var(--ts-success); border-color: var(--ts-success); color: #fff; }
.ts-btn-success:hover { background: #166534; border-color: #166534; color: #fff; }
.ts-ui .button-link-delete,
.ts-ui .button.delete,
.ts-btn-danger { background: var(--ts-danger); border-color: var(--ts-danger); color: #fff; }
.ts-ui .button-link-delete:hover, .ts-btn-danger:hover { background: #991b1b; border-color: #991b1b; color: #fff; }
.ts-btn-ghost { background: transparent; border-color: transparent; color: var(--ts-primary); }
.ts-btn-ghost:hover { background: var(--ts-primary-bg); border-color: transparent; color: var(--ts-primary-d); }
.ts-ui .button-small, .ts-btn-sm { padding: 5px 11px; min-height: 30px; font-size: 13px; }
.ts-ui .button-large, .ts-btn-lg { padding: 11px 22px; min-height: 46px; font-size: 15px; }
.ts-btn-block { width: 100%; }
.ts-ui .button:disabled, .ts-btn:disabled, .ts-ui .wrap button:disabled, .ts-ui .button.disabled { opacity: .5; cursor: not-allowed; transform: none; }
/* WordPress' Link-Buttons bleiben Links */
.ts-ui .button-link { border: 0; background: none; padding: 0; min-height: 0; border-radius: 0; color: var(--ts-primary); font-weight: 600; }

/* ======================================================================
 * 4. Karten, Marken, Chips, Kennzahlen
 * ====================================================================== */
.ts-card {
    background: var(--ts-card); border: 1px solid var(--ts-border);
    border-radius: var(--ts-radius); padding: var(--ts-space-5); box-shadow: var(--ts-shadow);
}
.ts-card + .ts-card { margin-top: var(--ts-space-4); }
.ts-card-head { display: flex; align-items: center; justify-content: space-between; gap: var(--ts-space-3); margin-bottom: var(--ts-space-3); }
.ts-card-head h2, .ts-card-head h3 { margin: 0; }
.ts-card-title { font-size: 1.05rem; font-weight: 700; margin: 0; }
.ts-card-sub { color: var(--ts-muted); font-size: 13px; margin: 2px 0 0; }
.ts-card-tight { padding: var(--ts-space-3) var(--ts-space-4); }
.ts-card-flat { box-shadow: none; }
.ts-card-accent { border-left: 4px solid var(--ts-primary); }
.ts-card-live { border-color: var(--ts-danger-bd); box-shadow: 0 0 0 1px var(--ts-danger-bd), var(--ts-shadow); }
.ts-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--ts-space-4); }
.ts-cards-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); }
.ts-cards-3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }

/* Legacy: weiße Kästen aus den Adminseiten (Postbox) */
.ts-ui .postbox, .ts-box {
    background: var(--ts-card); border: 1px solid var(--ts-border);
    border-radius: var(--ts-radius); box-shadow: var(--ts-shadow); min-width: 0;
}
.ts-ui .postbox .hndle, .ts-ui .postbox h2.hndle { border-bottom: 1px solid var(--ts-border); font-size: 15px; font-weight: 700; padding: 12px 16px; }
.ts-ui .postbox .inside { padding: 12px 16px 16px; margin: 0; }

.ts-chip {
    display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px;
    border-radius: 999px; background: var(--ts-neutral-bg); color: var(--ts-text-2); font-size: 13px; font-weight: 600; line-height: 1.3;
}
.ts-chip-primary { background: var(--ts-primary-bg); color: var(--ts-primary-d); }

.ts-badge, .ts-status {
    display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px;
    border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .02em; line-height: 1.6; white-space: nowrap;
    background: var(--ts-neutral-bg); color: var(--ts-text-2);
}
.ts-badge-live,    .ts-status-live      { background: var(--ts-danger-bg);  color: var(--ts-danger); }
.ts-badge-done,    .ts-status-completed,
.ts-status-approved, .ts-status-active  { background: var(--ts-success-bg); color: var(--ts-success); }
.ts-badge-planned, .ts-status-scheduled,
.ts-status-upcoming                            { background: var(--ts-info-bg);    color: var(--ts-info); }
.ts-badge-warn,    .ts-status-pending   { background: var(--ts-warn-bg);    color: var(--ts-warn); }
.ts-badge-danger,  .ts-status-cancelled,
.ts-status-rejected                            { background: var(--ts-danger-bg);  color: var(--ts-danger); }
.ts-badge-muted                                { background: var(--ts-neutral-bg); color: var(--ts-muted); }
/* Live-Punkt */
.ts-badge-live::before, .ts-status-live::before {
    content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ts-live);
    animation: ts-pulse 1.6s ease-in-out infinite;
}
@keyframes ts-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }

/* Kennzahlen */
.ts-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--ts-space-3); margin: 0 0 var(--ts-space-4); }
.ts-kpi {
    background: var(--ts-card); border: 1px solid var(--ts-border); border-radius: var(--ts-radius);
    padding: 14px 16px; box-shadow: var(--ts-shadow); min-width: 0;
}
.ts-kpi-value { font-size: 1.7rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.ts-kpi-label { color: var(--ts-muted); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; margin-top: 4px; }
.ts-kpi-hint { color: var(--ts-muted); font-size: 12px; margin-top: 6px; }
.ts-kpi-live .ts-kpi-value { color: var(--ts-live); }
.ts-kpi-ok .ts-kpi-value { color: var(--ts-success); }
.ts-kpi-warn .ts-kpi-value { color: var(--ts-warn); }

/* ======================================================================
 * 5. Formulare
 * ====================================================================== */
.ts-ui .wrap input[type="text"], .ts-page input[type="text"],
.ts-ui .wrap input[type="search"], .ts-page input[type="search"],
.ts-ui .wrap input[type="email"], .ts-page input[type="email"],
.ts-ui .wrap input[type="url"], .ts-page input[type="url"],
.ts-ui .wrap input[type="tel"], .ts-page input[type="tel"],
.ts-ui .wrap input[type="number"], .ts-page input[type="number"],
.ts-ui .wrap input[type="password"], .ts-page input[type="password"],
.ts-ui .wrap input[type="date"], .ts-page input[type="date"],
.ts-ui .wrap input[type="datetime-local"], .ts-page input[type="datetime-local"],
.ts-ui .wrap input[type="time"], .ts-page input[type="time"],
.ts-ui .wrap select, .ts-page select,
.ts-ui .wrap textarea, .ts-page textarea {
    border: 1px solid var(--ts-border-2); border-radius: var(--ts-radius-sm);
    padding: 8px 12px; min-height: 38px; font: inherit; font-size: 14px; color: var(--ts-text);
    background: #fff; box-shadow: none; max-width: 100%; line-height: 1.4;
}
.ts-ui .wrap select, .ts-page select { padding-right: 32px; }
.ts-ui .wrap textarea, .ts-page textarea { min-height: 90px; }
.ts-ui .wrap input:focus, .ts-page input:focus,
.ts-ui .wrap select:focus, .ts-page select:focus,
.ts-ui .wrap textarea:focus, .ts-page textarea:focus { border-color: var(--ts-primary); box-shadow: var(--ts-focus); outline: none; }
.ts-ui .wrap input[type="checkbox"], .ts-ui .wrap input[type="radio"],
.ts-page input[type="checkbox"], .ts-page input[type="radio"] { min-height: 0; width: 17px; height: 17px; accent-color: var(--ts-primary); }
.ts-ui .wrap label, .ts-page label { font-weight: 600; }
.ts-ui .description, .ts-help { color: var(--ts-muted); font-size: 13px; font-style: normal; }

/* WordPress form-table */
.ts-ui .form-table { border-collapse: collapse; width: 100%; }
.ts-ui .form-table th { width: 220px; text-align: left; vertical-align: top; padding: 14px 12px 14px 0; font-weight: 600; color: var(--ts-text); }
.ts-ui .form-table td { padding: 12px 0; }
.ts-ui .form-table tr + tr th, .ts-ui .form-table tr + tr td { border-top: 1px solid var(--ts-border); }

/* Eigene Formularzeilen: Beschriftung über dem Feld */
.ts-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ts-field > label { font-size: 13px; color: var(--ts-text-2); }
.ts-field input, .ts-field select, .ts-field textarea { width: 100%; }
.ts-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: var(--ts-space-3) var(--ts-space-4); }
.ts-form-actions { display: flex; flex-wrap: wrap; gap: var(--ts-space-2); align-items: center; margin-top: var(--ts-space-4); padding-top: var(--ts-space-4); border-top: 1px solid var(--ts-border); }

/* Filterleiste (GET-Formulare mit Auswahl + Suche) */
.ts-filterbar, .ts-ui .tablenav {
    display: flex; flex-wrap: wrap; align-items: center; gap: var(--ts-space-2) var(--ts-space-3);
    padding: 10px 12px; margin: 0 0 var(--ts-space-4);
    background: var(--ts-card); border: 1px solid var(--ts-border); border-radius: var(--ts-radius); height: auto;
}
.ts-ui .tablenav .actions { padding: 0; overflow: visible; }
.ts-ui .tablenav.bottom { margin: var(--ts-space-3) 0 0; }
.ts-filterbar label { font-size: 13px; color: var(--ts-muted); font-weight: 600; }
.ts-filterbar .ts-spacer { flex: 1; }

/* ======================================================================
 * 6. Tabellen
 * ====================================================================== */
.ts-table-wrap, .ts-table-scroll {
    width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
    background: var(--ts-card); border: 1px solid var(--ts-border); border-radius: var(--ts-radius); box-shadow: var(--ts-shadow);
}
.ts-table-wrap > table, .ts-table-scroll > table { border: 0; border-radius: 0; box-shadow: none; margin: 0; }

.ts-ui table.wp-list-table,
.ts-ui table.widefat,
.ts-ui table.ts-table {
    width: 100%; border-collapse: separate; border-spacing: 0;
    background: var(--ts-card); border: 1px solid var(--ts-border);
    border-radius: var(--ts-radius); overflow: hidden; box-shadow: var(--ts-shadow); font-size: 14px;
}
.ts-ui table.wp-list-table thead th, .ts-ui table.widefat thead th, .ts-ui table.ts-table thead th,
.ts-ui table.wp-list-table thead td, .ts-ui table.widefat thead td {
    background: #f8fafc; color: var(--ts-muted); font-size: 12px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .04em; padding: 11px 14px; border-bottom: 1px solid var(--ts-border); text-align: left;
}
.ts-ui table.wp-list-table tfoot th, .ts-ui table.widefat tfoot th { display: none; }
.ts-ui table.wp-list-table td, .ts-ui table.widefat td, .ts-ui table.ts-table td,
.ts-ui table.wp-list-table tbody th, .ts-ui table.widefat tbody th, .ts-ui table.ts-table tbody th {
    padding: 11px 14px; border-bottom: 1px solid var(--ts-border); vertical-align: middle; color: var(--ts-text);
}
.ts-ui table.striped > tbody > tr:nth-child(odd),
.ts-ui table.widefat.striped > tbody > tr:nth-child(odd) { background: #fcfdfe; }
.ts-ui table.wp-list-table tbody tr:hover, .ts-ui table.widefat tbody tr:hover, .ts-ui table.ts-table tbody tr:hover { background: #f8fafc; }
.ts-ui table tr:last-child td { border-bottom: 0; }
.ts-ui table .ts-num, .ts-ui table td.num { text-align: right; font-variant-numeric: tabular-nums; }
.ts-ui table .ts-actions { white-space: nowrap; text-align: right; }
.ts-ui table .ts-actions .button { margin-left: 4px; }
.ts-ui table.wp-list-table .row-actions { color: var(--ts-muted); }
.ts-ui table .ts-row-live { background: #fff7f7 !important; }
.ts-ui table .ts-row-muted td { color: var(--ts-muted); }
.ts-ui table .ts-team { font-weight: 600; }
.ts-ui table .ts-score { font-weight: 800; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ======================================================================
 * 7. Hinweise
 * ====================================================================== */
.ts-ui .notice, .ts-alert, .ts-notice {
    position: relative; display: block; margin: 0 0 var(--ts-space-4);
    padding: 12px 14px 12px 16px; border: 1px solid var(--ts-border); border-left-width: 4px;
    border-radius: var(--ts-radius-sm); background: #fff; box-shadow: none; font-size: 14px;
}
.ts-ui .notice.inline { margin: 0 0 var(--ts-space-3); }
.ts-ui .notice-success, .ts-alert-success, .ts-notice-success { border-left-color: var(--ts-success); background: var(--ts-success-bg); border-color: var(--ts-success-bd); border-left-color: var(--ts-success); }
.ts-ui .notice-error,   .ts-alert-error,   .ts-notice-error   { border-left-color: var(--ts-danger);  background: var(--ts-danger-bg);  border-color: var(--ts-danger-bd);  border-left-color: var(--ts-danger); }
.ts-ui .notice-warning, .ts-alert-warning, .ts-notice-warning { border-left-color: var(--ts-warn);    background: var(--ts-warn-bg);    border-color: var(--ts-warn-bd);    border-left-color: var(--ts-warn); }
.ts-ui .notice-info,    .ts-alert-info,    .ts-notice-info    { border-left-color: var(--ts-primary); background: var(--ts-info-bg);    border-color: var(--ts-info-bd);    border-left-color: var(--ts-primary); }
.ts-ui .notice p, .ts-notice p { margin: 0; }
.ts-ui .notice p + p, .ts-notice p + p { margin-top: 6px; }
.ts-ui .notice .notice-dismiss { top: 6px; right: 4px; }
.ts-notice-title { font-weight: 700; display: block; margin-bottom: 2px; }
/* WordPress schiebt Notices in .wrap hinter das h1 – im Plugin bleiben sie, wo sie stehen */
body.ts-ui .wrap > .notice:first-child { margin-top: 10px; }

/* ======================================================================
 * 8. Leere Zustände, Lade-Hinweise
 * ====================================================================== */
.ts-empty {
    text-align: center; padding: 40px 20px; color: var(--ts-muted);
    background: var(--ts-card); border: 1px dashed var(--ts-border-2); border-radius: var(--ts-radius);
}
.ts-empty-icon { font-size: 34px; line-height: 1; margin-bottom: 10px; }
.ts-empty-title { font-size: 1.05rem; font-weight: 700; color: var(--ts-text); margin: 0 0 4px; }
.ts-empty p { margin: 0 auto; max-width: 48ch; }
.ts-empty .button, .ts-empty .ts-btn { margin-top: 14px; }
.ts-skeleton { background: linear-gradient(90deg, #f1f5f9 25%, #e8edf3 50%, #f1f5f9 75%); background-size: 200% 100%; animation: ts-shimmer 1.4s infinite; border-radius: 6px; min-height: 14px; }
@keyframes ts-shimmer { to { background-position: -200% 0; } }

/* ======================================================================
 * 9. Hülle: Seitenkopf, Leiste, Brotkrumen, Schnellzugriffe, Tabs
 * ====================================================================== */
/* Leiste oben auf jeder Plugin-Seite (Frontend und Backend) */
.ts-shell {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px;
    padding: 10px 14px; margin: 0 0 var(--ts-space-4);
    background: var(--ts-card); border: 1px solid var(--ts-border); border-radius: var(--ts-radius); box-shadow: var(--ts-shadow);
    font-family: var(--ts-font); font-size: 14px; color: var(--ts-text);
}
body.ts-shell { margin: 12px 20px 0 2px; }
.ts-shell-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; font-weight: 600; }
.ts-shell-crumbs a { color: var(--ts-muted); text-decoration: none; }
.ts-shell-crumbs a:hover { color: var(--ts-primary); text-decoration: underline; }
.ts-shell-crumbs .ts-crumb-sep { color: var(--ts-muted-2); }
.ts-shell-crumbs .ts-crumb-current { color: var(--ts-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 42ch; }
.ts-shell-spacer { flex: 1 1 auto; }
.ts-shell-context { display: inline-flex; align-items: center; gap: 8px; }
.ts-shell-context form { display: inline-flex; align-items: center; gap: 6px; margin: 0; }
.ts-shell-context select { min-height: 34px; padding: 5px 30px 5px 10px; font-size: 13px; font-weight: 600; max-width: 260px; border-radius: 999px; }
.ts-shell-context .button { min-height: 34px; padding: 5px 12px; font-size: 13px; }
.ts-shell-links { display: flex; flex-wrap: wrap; gap: 6px; }
.ts-pill, .ts-frontend-nav a {
    display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; min-height: 32px;
    border-radius: 999px; border: 1px solid var(--ts-border); background: #fff; color: var(--ts-text-2);
    font-size: 13px; font-weight: 600; text-decoration: none; line-height: 1.2; white-space: nowrap;
    transition: background .15s, border-color .15s;
}
.ts-pill:hover, .ts-frontend-nav a:hover { background: var(--ts-neutral-bg); border-color: var(--ts-border-2); color: var(--ts-text); text-decoration: none; }
.ts-pill.is-active, .ts-pill[aria-current="page"], .ts-frontend-nav a[aria-current="page"] { background: var(--ts-primary); border-color: var(--ts-primary); color: #fff; }
.ts-pill-live { border-color: var(--ts-danger-bd); color: var(--ts-danger); }
.ts-pill .ts-count { background: var(--ts-danger); color: #fff; border-radius: 999px; min-width: 18px; height: 18px; padding: 0 5px; font-size: 11px; display: inline-flex; align-items: center; justify-content: center; }

/* Frontend-Navigation (ts_render_frontend_nav) */
.ts-frontend-nav {
    display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
    max-width: 1180px; margin: 0 auto 18px; padding: 10px 12px;
    background: var(--ts-card); border: 1px solid var(--ts-border); border-radius: var(--ts-radius); box-shadow: var(--ts-shadow);
}

/* Seitenkopf: Titel, Untertitel, Aktionen */
.ts-page-head {
    display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 20px;
    margin: 0 0 var(--ts-space-5); padding-bottom: var(--ts-space-4); border-bottom: 1px solid var(--ts-border);
}
.ts-page-head h1 { margin: 0; display: flex; align-items: center; gap: 10px; }
.ts-page-head .ts-page-icon { font-size: 1.4em; line-height: 1; }
.ts-page-sub { color: var(--ts-muted); font-size: 14px; margin: 4px 0 0; }
.ts-page-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ts-page-head .ts-badge { vertical-align: middle; }
/* WordPress-Titel neben dem Kopf verstecken, wenn eine Seite beides ausgibt */
.ts-page-head + h1, .ts-page-head + .wp-heading-inline { display: none; }
.ts-ui .wrap .page-title-action { vertical-align: middle; margin-left: 6px; }

/* Klebrige Aktionsleiste (z. B. Speichern unten) */
.ts-toolbar {
    position: sticky; bottom: 0; z-index: 5; display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
    padding: 10px 14px; margin-top: var(--ts-space-4);
    background: rgba(255, 255, 255, .92); backdrop-filter: blur(6px);
    border: 1px solid var(--ts-border); border-radius: var(--ts-radius); box-shadow: var(--ts-shadow-md);
}

/* Tabs (reine Links, kein JavaScript nötig) */
.ts-tabs, .ts-ui .nav-tab-wrapper {
    display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 var(--ts-space-4); padding: 4px;
    background: var(--ts-neutral-bg); border-radius: var(--ts-radius); border: 0;
}
.ts-tab, .ts-ui .nav-tab {
    display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; margin: 0;
    border: 0; border-radius: var(--ts-radius-sm); background: transparent; color: var(--ts-text-2);
    font-size: 14px; font-weight: 600; text-decoration: none; float: none;
}
.ts-tab:hover, .ts-ui .nav-tab:hover { background: rgba(255, 255, 255, .7); color: var(--ts-text); }
.ts-tab.is-active, .ts-ui .nav-tab-active, .ts-ui .nav-tab-active:hover { background: #fff; color: var(--ts-text); box-shadow: var(--ts-shadow); }

/* Abschnittsüberschrift mit Zähler/Aktion */
.ts-section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: var(--ts-space-6) 0 var(--ts-space-3); }
.ts-section-head h2, .ts-section-head h3 { margin: 0; }
.ts-section-head .ts-count-label { color: var(--ts-muted); font-weight: 600; font-size: 13px; }

/* Definitionsliste (Schlüssel/Wert) */
.ts-dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0; }
.ts-dl dt { color: var(--ts-muted); font-weight: 600; font-size: 13px; }
.ts-dl dd { margin: 0; }

/* Spiel-Zeile (Heim – Stand – Gast) */
.ts-match { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; padding: 10px 12px; border-radius: var(--ts-radius-sm); background: var(--ts-card); border: 1px solid var(--ts-border); }
.ts-match-home { text-align: right; font-weight: 600; }
.ts-match-away { text-align: left; font-weight: 600; }
.ts-match-score { font-weight: 800; font-size: 1.15rem; font-variant-numeric: tabular-nums; padding: 2px 10px; border-radius: 6px; background: var(--ts-neutral-bg); }
.ts-match.is-live { border-color: var(--ts-danger-bd); }
.ts-match.is-live .ts-match-score { background: var(--ts-danger-bg); color: var(--ts-danger); }
.ts-match-meta { grid-column: 1 / -1; color: var(--ts-muted); font-size: 12px; text-align: center; }

/* ======================================================================
 * 10. Kacheln (Turnierleitung und Dashboards)
 * ====================================================================== */
.ts-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.ts-tile {
    position: relative; display: block; padding: 14px 16px; min-height: 92px;
    background: var(--ts-card); border: 1px solid var(--ts-border); border-radius: var(--ts-radius);
    color: inherit; text-decoration: none; box-shadow: var(--ts-shadow);
    transition: border-color .15s, box-shadow .15s, transform .08s;
}
.ts-tile:hover { border-color: var(--ts-primary-bd); box-shadow: var(--ts-shadow-md); transform: translateY(-1px); text-decoration: none; color: inherit; }
.ts-tile:focus-visible { box-shadow: var(--ts-focus), var(--ts-shadow); }
.ts-tile-icon { font-size: 22px; line-height: 1; margin-bottom: 8px; }
.ts-tile-title { font-weight: 700; font-size: 15px; color: var(--ts-text); margin-bottom: 3px; }
.ts-tile-desc { font-size: 13px; color: var(--ts-muted); line-height: 1.35; }
.ts-tile-badge, .ts-tile-badge-text {
    position: absolute; top: 10px; right: 10px; padding: 1px 7px; border-radius: 999px;
    font-size: 11px; font-weight: 700; white-space: nowrap; line-height: 1.6;
}
.ts-tile-badge { background: var(--ts-danger); color: #fff; min-width: 20px; text-align: center; }
.ts-tile-badge-text { background: var(--ts-primary-bg); color: var(--ts-primary-d); }
.ts-tile-primary { background: linear-gradient(135deg, #eff6ff, #ffffff 60%); border-color: var(--ts-primary-bd); }
.ts-tile-live { border-color: var(--ts-danger-bd); }
.ts-tile-muted { opacity: .72; }
.ts-tile.is-hidden { display: none; }
/* Suchfeld über den Kacheln */
.ts-tile-search { display: flex; align-items: center; gap: 10px; margin: 0 0 var(--ts-space-4); }
.ts-tile-search input[type="search"] { flex: 1; min-height: 44px; font-size: 15px; border-radius: 999px; padding-left: 18px; }
.ts-tile-group { margin-bottom: var(--ts-space-6); }
.ts-tile-group.is-hidden { display: none; }
.ts-tile-group-head { display: flex; align-items: baseline; gap: 10px; margin: 0 0 10px; }
.ts-tile-group-head h2 { margin: 0; font-size: 1.05rem; }
.ts-tile-group-head .ts-count-label { color: var(--ts-muted); font-size: 13px; font-weight: 600; }
.ts-tile-anchors { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 var(--ts-space-4); }
.ts-tile-nores { display: none; }
.ts-tile-nores.is-visible { display: block; }

/* ======================================================================
 * 11. Hilfsklassen (bewusst klein gehalten)
 * ====================================================================== */
.ts-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ts-space-2) var(--ts-space-3); }
.ts-row-between { justify-content: space-between; }
.ts-stack { display: flex; flex-direction: column; gap: var(--ts-space-3); }
.ts-grid { display: grid; gap: var(--ts-space-4); }
.ts-grid-2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
.ts-grid-3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.ts-muted { color: var(--ts-muted); }
.ts-small { font-size: 12px; }
.ts-strong { font-weight: 700; }
.ts-center { text-align: center; }
.ts-right { text-align: right; }
.ts-nowrap { white-space: nowrap; }
.ts-mt-0 { margin-top: 0 !important; }
.ts-mt-2 { margin-top: var(--ts-space-2); }
.ts-mt-4 { margin-top: var(--ts-space-4); }
.ts-mb-0 { margin-bottom: 0 !important; }
.ts-mb-2 { margin-bottom: var(--ts-space-2); }
.ts-mb-4 { margin-bottom: var(--ts-space-4); }
.ts-hidden { display: none !important; }
.ts-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ts-tabular { font-variant-numeric: tabular-nums; }

/* ======================================================================
 * 12. Responsiv und Druck
 * ====================================================================== */
@media (max-width: 782px) {
    .ts-ui .form-table th { display: block; width: auto; padding: 10px 0 2px; }
    .ts-ui .form-table td { display: block; padding: 0 0 10px; }
    .ts-ui .form-table tr + tr th { border-top: 1px solid var(--ts-border); }
    .ts-ui .form-table tr + tr td { border-top: 0; }
    .ts-ui .wrap h1, .ts-page h1 { font-size: 1.4rem; }
    .ts-page-head { align-items: flex-start; flex-direction: column; }
    .ts-page-actions { width: 100%; }
    .ts-page-actions .button, .ts-page-actions .ts-btn { flex: 1 1 auto; }
    body.ts-shell { margin: 10px 10px 0 0; }
    .ts-shell-crumbs .ts-crumb-current { max-width: 100%; }
    .ts-shell-context select { max-width: 100%; }
    .ts-kpi-value { font-size: 1.4rem; }
    /* Tabellen am Spielfeld: Buttons groß genug für den Daumen */
    .ts-ui table .ts-actions .button { min-height: 40px; }
}
@media (max-width: 640px) {
    .ts-tiles { grid-template-columns: 1fr; }
    .ts-cards, .ts-cards-2, .ts-cards-3 { grid-template-columns: 1fr; }
    .ts-shell { padding: 8px 10px; }
    .ts-shell-links { width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 2px; }
    .ts-match { grid-template-columns: 1fr auto 1fr; font-size: 13px; }
}
@media print {
    .ts-shell, .ts-frontend-nav, .ts-page-actions, .ts-toolbar,
    .ts-filterbar, .ts-ui .tablenav, .ts-tile-search, .ts-tile-anchors { display: none !important; }
    .ts-card, .ts-ui table.ts-table, .ts-ui table.widefat, .ts-ui table.wp-list-table { box-shadow: none; border-color: #999; }
}
@media (prefers-reduced-motion: reduce) {
    .ts-ui * { animation: none !important; transition: none !important; }
}

/* ======================================================================
 * 13. Hilfsklassen für die Ablösung häufiger Inline-Styles
 * ====================================================================== */
.ts-m-0 { margin: 0 !important; }
.ts-mt-3 { margin-top: var(--ts-space-3); }
.ts-mb-3 { margin-bottom: var(--ts-space-3); }
.ts-mb-1 { margin-bottom: var(--ts-space-1); }
.ts-mb-2 { margin-bottom: var(--ts-space-2); }
.ts-ml-2 { margin-left: var(--ts-space-2); }
.ts-pad-3 { padding: var(--ts-space-3); }
.ts-muted-2 { color: var(--ts-muted-2); }
.ts-text-2 { color: var(--ts-text-2); }
.ts-flex-1 { flex: 1 1 0; min-width: 0; }
.ts-full { width: 100%; }
.ts-label-block { display: block; margin-bottom: 5px; font-weight: 600; }
/* Schlüssel/Wert-Zeile mit hellem Hintergrund */
.ts-kv-row { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 10px; background: #f8fafc; border-radius: var(--ts-radius-xs); }
.ts-kv-row + .ts-kv-row { margin-top: 6px; }
/* Hervorgehobene Tabellenzelle (zentriert, fett) */
.ts-cell-strong { text-align: center; font-weight: 600; }
/* Innenkasten (hell) */
.ts-inset { padding: 12px; background: #f8fafc; border-radius: var(--ts-radius-xs); }
.ts-inset-title { font-size: 11px; color: var(--ts-muted); margin-bottom: 4px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.ts-inset-value { font-size: 20px; font-weight: 700; color: var(--ts-text); }

/* ======================================================================
 * 14. Apps und Push-Mitteilungen
 * ====================================================================== */
.ts-push-card .ts-push-topics { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); }
.ts-push-topic { display: flex; align-items: center; gap: 8px; font-weight: 500; padding: 8px 10px; border: 1px solid var(--ts-border); border-radius: var(--ts-radius-sm); background: #fff; cursor: pointer; }
.ts-push-topic input { margin: 0; }
.ts-push-status:empty { display: none; }
.ts-audience-app > summary { list-style: none; cursor: pointer; display: inline-flex; }
.ts-audience-app > summary::-webkit-details-marker { display: none; }
.ts-audience-app[open] > summary { background: var(--ts-primary); border-color: var(--ts-primary); color: #fff; }
.rm-start .ts-match { font-size: 15px; padding: 12px 14px; }
.rm-start .ts-match-score { min-width: 64px; text-align: center; }
/* Im installierten Vollbild: etwas mehr Luft oben (Statusleiste) */
@media (display-mode: standalone) {
    .rm-start, .ts-audience-view { padding-top: env(safe-area-inset-top, 0); }
}

/* ======================================================================
 * 15. Regieplan der Moderation
 * ====================================================================== */
.ts-rundown .ts-rd-head { display: flex; flex-wrap: wrap; gap: 10px 24px; align-items: center; padding: 10px 14px; margin-bottom: 14px; background: var(--ts-neutral-bg); border-radius: var(--ts-radius-sm); }
.ts-rundown .ts-rd-now, .ts-rundown .ts-rd-progress { display: flex; flex-direction: column; line-height: 1.2; }
.ts-rundown .ts-rd-wall { font-size: 1.8rem; font-weight: 800; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.ts-rundown .ts-rd-progress b { font-size: 1.2rem; font-weight: 800; }
.ts-rundown .ts-rd-livecount { color: var(--ts-live); }
.ts-rundown .ts-rd-focus { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 14px; }
.ts-rundown .ts-rd-col h3 { margin: 0 0 8px; font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--ts-muted); }
.ts-rundown .ts-rd-card { display: grid; grid-template-columns: 58px 1fr auto; gap: 10px; align-items: start; padding: 10px 12px; margin-bottom: 8px; border: 1px solid var(--ts-border); border-radius: var(--ts-radius-sm); background: var(--ts-card); }
.ts-rundown .ts-rd-card.is-big { padding: 14px; border-width: 2px; border-color: var(--ts-primary-bd); background: linear-gradient(135deg, #eff6ff, #fff 60%); }
.ts-rundown .ts-rd-live { border-color: var(--ts-danger-bd) !important; }
.ts-rundown .ts-rd-live.is-big { background: linear-gradient(135deg, #fef2f2, #fff 60%); }
.ts-rundown .ts-rd-done, .ts-rundown .ts-rd-skipped { opacity: .6; }
.ts-rundown .ts-rd-card.is-overdue { border-color: var(--ts-warn-bd); background: var(--ts-warn-bg); }
.ts-rundown .ts-rd-card.is-soon { border-color: var(--ts-primary-bd); }
.ts-rundown .ts-rd-time { font-weight: 800; font-size: 15px; font-variant-numeric: tabular-nums; display: flex; flex-direction: column; }
.ts-rundown .ts-rd-time small { font-weight: 600; color: var(--ts-muted); font-size: 11px; }
.ts-rundown .ts-rd-title { font-weight: 700; }
.ts-rundown .is-big .ts-rd-title { font-size: 1.1rem; }
.ts-rundown .ts-rd-sub { color: var(--ts-muted); font-size: 12px; margin-top: 2px; }
.ts-rundown .ts-rd-clock { font-size: 12px; color: var(--ts-text-2); margin-top: 4px; }
.ts-rundown .ts-rd-clock b { font-variant-numeric: tabular-nums; }
.ts-rundown .ts-rd-late { color: var(--ts-danger); font-weight: 700; }
.ts-rundown .ts-rd-notes { margin-top: 8px; padding: 8px 10px; border-left: 3px solid var(--ts-primary); background: rgba(37, 99, 235, .06); border-radius: 4px; font-size: 13px; white-space: normal; }
.ts-rundown .ts-rd-actions { display: flex; flex-direction: column; gap: 4px; align-items: flex-end; }
.ts-rundown .ts-rd-actions form { margin: 0; }
.ts-rundown .ts-rd-hint { padding: 8px 10px; border-radius: 6px; background: var(--ts-info-bg); font-size: 13px; margin-bottom: 6px; }
.ts-rundown .ts-rd-timeline { margin-top: 14px; }
.ts-rundown .ts-rd-timeline > summary { cursor: pointer; font-weight: 700; color: var(--ts-text-2); padding: 6px 0; }
.ts-rundown .ts-rd-list { margin-top: 8px; }
.ts-rundown .ts-rd-editor > summary { list-style: none; cursor: pointer; display: inline-flex; }
.ts-rundown .ts-rd-editor > summary::-webkit-details-marker { display: none; }
@media (max-width: 900px) { .ts-rundown .ts-rd-focus { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .ts-rundown .ts-rd-card { grid-template-columns: 50px 1fr; } .ts-rundown .ts-rd-actions { grid-column: 1 / -1; flex-direction: row; justify-content: flex-end; } }

/* ======================================================================
 * 16. Live-Voting (Steuerfeld)
 * ====================================================================== */
.ts-lv-poll { border: 1px solid var(--ts-border); border-radius: var(--ts-radius); padding: 12px 14px; margin-bottom: 12px; }
.ts-lv-poll.ts-lv-open { border-color: var(--ts-danger-bd); box-shadow: 0 0 0 1px var(--ts-danger-bd); }
.ts-lv-q { font-size: 1.05rem; }
.ts-lv-bars { display: grid; gap: 8px; margin: 12px 0; }
.ts-lv-row { display: grid; grid-template-columns: minmax(140px, 28%) 1fr; gap: 10px; align-items: center; }
.ts-lv-label { font-weight: 700; overflow: hidden; text-overflow: ellipsis; }
.ts-lv-tracks { display: grid; gap: 3px; }
.ts-lv-track { position: relative; height: 20px; border-radius: 5px; background: var(--ts-neutral-bg); overflow: hidden; }
.ts-lv-track i { position: absolute; inset: 0 auto 0 0; border-radius: inherit; transition: width .6s; }
.ts-lv-track.is-hall i { background: #7dd3fc; }
.ts-lv-track.is-tv i { background: #f9a8d4; }
.ts-lv-track.is-all i { background: linear-gradient(90deg, var(--ts-primary), #a78bfa); }
.ts-lv-track span { position: relative; z-index: 1; font-size: 12px; font-weight: 700; padding: 0 6px; line-height: 20px; }
.ts-lv-track.is-all span { color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,.4); }
.ts-lv-links { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 8px; }
.ts-lv-link { display: flex; gap: 10px; align-items: center; padding: 8px 10px; border-radius: var(--ts-radius-sm); background: var(--ts-neutral-bg); }
.ts-lv-link img { background: #fff; border-radius: 6px; padding: 3px; }
.ts-lv-new > summary { list-style: none; cursor: pointer; display: inline-flex; }
.ts-lv-new > summary::-webkit-details-marker { display: none; }
@media (max-width: 640px) { .ts-lv-row { grid-template-columns: 1fr; } }

/* ======================================================================
 * 17. Eigene Anmeldung
 * ====================================================================== */
.ts-auth { display: flex; justify-content: center; padding: 6vh 16px; }
.ts-auth-card { width: 100%; max-width: 420px; background: var(--ts-card); border: 1px solid var(--ts-border); border-radius: 18px; padding: 28px 26px; box-shadow: 0 10px 40px rgba(15, 23, 42, .08); }
.ts-auth-brand { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--ts-primary); margin-bottom: 10px; }
.ts-auth-title { font-size: 1.6rem; font-weight: 800; margin: 0 0 4px; letter-spacing: -.01em; }
.ts-auth-sub { color: var(--ts-muted); margin: 0 0 18px; font-size: 14px; }
.ts-auth-form { display: flex; flex-direction: column; gap: 12px; margin: 0 0 6px; }
.ts-auth-form label { display: flex; flex-direction: column; gap: 5px; font-weight: 600; font-size: 13px; color: var(--ts-text-2); }
.ts-auth-form label small { font-weight: 500; color: var(--ts-muted); }
.ts-auth-form input[type="text"], .ts-auth-form input[type="email"], .ts-auth-form input[type="password"] { font: inherit; font-size: 16px; padding: 12px 14px; border: 1px solid var(--ts-border-2); border-radius: 10px; background: #fff; width: 100%; }
.ts-auth-form input:focus { outline: none; border-color: var(--ts-primary); box-shadow: var(--ts-focus); }
.ts-auth-form .ts-auth-check { flex-direction: row; align-items: center; gap: 8px; font-weight: 500; }
.ts-auth-code { font-size: 28px !important; letter-spacing: .5em; text-align: center; font-variant-numeric: tabular-nums; }
.ts-auth-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 12px 18px; min-height: 48px; border-radius: 12px; border: 1px solid var(--ts-border-2); background: #fff; color: var(--ts-text); font: inherit; font-weight: 700; cursor: pointer; text-decoration: none; }
.ts-auth-btn.is-primary { background: var(--ts-primary); border-color: var(--ts-primary); color: #fff; }
.ts-auth-btn.is-primary:hover { background: var(--ts-primary-d); }
.ts-auth-btn.is-ghost { background: transparent; border-color: transparent; color: var(--ts-muted); }
.ts-auth-actions { display: grid; gap: 8px; margin: 6px 0 14px; }
.ts-auth-or { display: flex; align-items: center; gap: 10px; color: var(--ts-muted); font-size: 12px; margin: 14px 0; }
.ts-auth-or::before, .ts-auth-or::after { content: ""; flex: 1; height: 1px; background: var(--ts-border); }
.ts-auth-links { text-align: center; font-size: 13px; margin: 14px 0 0; }
.ts-auth-links a { color: var(--ts-primary); text-decoration: none; }
.ts-auth-msg { padding: 10px 12px; border-radius: 10px; margin: 0 0 14px; font-size: 14px; font-weight: 600; }
.ts-auth-msg.is-success { background: var(--ts-success-bg); color: var(--ts-success); }
.ts-auth-msg.is-error { background: var(--ts-danger-bg); color: var(--ts-danger); }
.ts-auth-more { margin-top: 8px; border-top: 1px solid var(--ts-border); padding-top: 12px; }
.ts-auth-more > summary { cursor: pointer; font-weight: 700; color: var(--ts-text-2); margin-bottom: 10px; }

/* Eventmodus-Kennzeichen in der Leiste */
.ts-focus-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 6px 5px 11px; border-radius: 999px; background: #fef3c7; color: #92400e; font-size: 13px; font-weight: 700; border: 1px solid #fcd34d; white-space: nowrap; }
.ts-focus-chip a { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; background: rgba(146, 64, 14, .12); color: inherit; text-decoration: none; font-size: 11px; }
.ts-focus-chip a:hover { background: rgba(146, 64, 14, .25); }

/* ======================================================================
 * 18. Startklar
 * ====================================================================== */
.ts-inline-form { display: inline; }
.ts-launch-checks td { vertical-align: top; }
.ts-launch-checks tr.ts-launch-group th { background: var(--ts-neutral-bg); color: var(--ts-text-2); font-size: 12px; text-transform: uppercase; letter-spacing: .04em; text-align: left; }
.ts-launch-checks tr.is-fail td:first-child { box-shadow: inset 3px 0 0 var(--ts-danger); }
.ts-launch-checks tr.is-warn td:first-child { box-shadow: inset 3px 0 0 var(--ts-warn); }
.ts-launch-dns { margin: 6px 0 10px; padding: 0; list-style: none; }
.ts-launch-dns li { margin: 0 0 6px; }
.ts-launch-dns code { word-break: break-all; }

/* Zusatz Entscheidungsschießen (n.E. 4:3) */
.ts-shootout-label, .ts-game-shootout-modern { font-size: .8em; font-weight: 700; color: #6366f1; white-space: nowrap; }
.ts-game-shootout-modern { display: block; text-align: center; margin-top: 4px; }

/* Einzelspiel: „Spiel ansetzen“ (TS_Single_Game) */
.ts-sg-card h2 small { font-size: 13px; font-weight: 500; margin-left: 6px; }
.ts-sg-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 10px 0; }
.ts-sg-team { border: 1px solid #e5e7eb; border-radius: 8px; padding: 10px 12px; display: grid; gap: 8px; }
.ts-sg-team legend { font-weight: 700; padding: 0 4px; }
.ts-sg-team select, .ts-sg-team input, .ts-sg-field input { width: 100%; max-width: none; }
.ts-sg-field { display: grid; gap: 4px; font-weight: 600; }
@media (max-width: 700px) { .ts-sg-grid { grid-template-columns: 1fr; } }

/* Einrichtungs-Wegweiser „So geht's weiter“ (TS_Setup_Guide) */
.ts-sguide { border-left: 4px solid var(--ts-primary, #2271b1); }
.ts-sguide.is-complete { border-left-color: #16a34a; }
.ts-sguide-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ts-sguide-head h2 { margin: 0; }
.ts-sguide-count { font-weight: 600; color: #475569; }
.ts-sguide-bar { display: block; width: 100%; height: 6px; border: 0; border-radius: 3px; background: #e5e7eb; margin: 10px 0 12px; overflow: hidden; -webkit-appearance: none; appearance: none; }
.ts-sguide-bar::-webkit-progress-bar { background: #e5e7eb; }
.ts-sguide-bar::-webkit-progress-value { background: linear-gradient(90deg, #2271b1, #16a34a); }
.ts-sguide-bar::-moz-progress-bar { background: linear-gradient(90deg, #2271b1, #16a34a); }
.ts-sguide-now { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; border-radius: 8px; background: #eff6ff; margin: 0 0 12px; font-size: 15px; }
.ts-sguide-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.ts-sguide-steps li { display: flex; gap: 12px; align-items: flex-start; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 10px; }
.ts-sguide-steps li.is-now { border-color: #2271b1; background: #f8fbff; }
.ts-sguide-steps li.is-done { opacity: .75; }
.ts-sguide-steps li.is-optional .ts-sguide-ico { background: #f1f5f9; color: #64748b; }
.ts-sguide-ico { flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-weight: 800; background: #e2e8f0; color: #334155; }
.ts-sguide-steps li.is-done .ts-sguide-ico { background: #16a34a; color: #fff; }
.ts-sguide-steps li.is-now .ts-sguide-ico { background: #2271b1; color: #fff; }
.ts-sguide-steps li.is-final .ts-sguide-ico { background: #fef3c7; }
.ts-sguide-body { display: grid; gap: 4px; min-width: 0; }
.ts-sguide-detail { color: #475569; font-size: 13px; }
.ts-sguide-teams, .ts-sguide-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.ts-sguide-teams .ts-chip { text-decoration: none; }
.ts-sguide-mini { display: inline-block; margin-top: 4px; font-size: 11px; text-decoration: none; padding: 1px 7px; border-radius: 999px; background: #eff6ff; color: #1d4ed8; }

/* --- Schrittleiste der Einrichtung & Mannschaften-Seite (TS_Setup_Guide::stepper, TS_Team_Setup) --- */
.ts-sstep { margin: 12px 0 14px; overflow-x: auto; }
.ts-sstep ol { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; min-width: max-content; }
.ts-sstep li { display: flex; align-items: center; }
.ts-sstep li + li::before { content: ""; width: 18px; height: 2px; background: #cbd5e1; margin-right: 6px; }
.ts-sstep a, .ts-sstep li > span { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px 5px 6px; border-radius: 999px; border: 1px solid #e2e8f0; background: #fff; color: #334155; text-decoration: none; font-size: 13px; font-weight: 600; }
.ts-sstep a:hover { border-color: #2271b1; }
.ts-sstep-ico { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: #e2e8f0; font-size: 12px; font-weight: 800; }
.ts-sstep li.is-done .ts-sstep-ico { background: #16a34a; color: #fff; }
.ts-sstep li.is-current > span { background: #2271b1; border-color: #2271b1; color: #fff; }
.ts-sstep li.is-current .ts-sstep-ico { background: #fff; color: #2271b1; }
.ts-sstep li.is-optional a { color: #64748b; }
.ts-snext { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; padding: 14px 16px; margin-top: 14px; border-radius: 10px; border: 1px dashed #94a3b8; background: #f8fafc; }
.ts-snext.is-ready { border-style: solid; border-color: #16a34a; background: #f0fdf4; }
.ts-snext span { display: grid; gap: 2px; }
.ts-snext small { color: #475569; font-size: 12px; }
.ts-tsu-targets { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 12px; }
.ts-tsu-targets .ts-chip { text-decoration: none; }
.ts-tsu-targets .ts-chip.is-on { background: #2271b1; color: #fff; border-color: #2271b1; }
.ts-tsu-fill-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.ts-tsu-fill-head h2 { margin: 0; }
.ts-tsu-count { font-size: 15px; color: #334155; }
.ts-tsu-count b { font-size: 22px; }
.ts-tsu-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; margin-bottom: 14px; }
.ts-tsu-grid > .ts-card { margin: 0; }
.ts-tsu-add textarea { width: 100%; max-width: none; font-size: 15px; line-height: 1.5; }
.ts-tsu-label { display: grid; gap: 4px; font-weight: 600; margin: 6px 0; }
.ts-tsu-add select { max-width: none; width: 100%; }
.ts-tsu-filter { width: 100%; max-width: none; margin-bottom: 6px; }
.ts-tsu-prev { list-style: none; margin: 0 0 8px; padding: 0; max-height: 220px; overflow-y: auto; border: 1px solid #e5e7eb; border-radius: 8px; }
.ts-tsu-prev li { padding: 5px 8px; border-bottom: 1px solid #f1f5f9; }
.ts-tsu-prev li:last-child { border-bottom: 0; }
.ts-tsu-prev label { display: flex; align-items: baseline; gap: 6px; cursor: pointer; }
.ts-tsu-check { display: block; margin: 6px 0 10px; }
.ts-tsu-inline { display: inline-flex; gap: 4px; align-items: center; margin: 0; }
.ts-tsu-actions { white-space: nowrap; text-align: right; }
.ts-tsu-ok { color: #15803d; font-weight: 700; margin-right: 6px; }
.ts-tsu-todo { color: #b45309; font-weight: 600; margin-right: 6px; }
.ts-tsu-del { color: #b91c1c !important; }
@media (max-width: 782px) { .ts-tsu-grid { grid-template-columns: 1fr; } }

/* --- Online-Anmeldung in „Mannschaften eintragen“ (TS_Registration) --- */
.ts-reg-inbox { border-left: 4px solid #f59e0b; }
.ts-reg-inbox h2 { display: flex; align-items: center; gap: 8px; }
.ts-reg-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; margin: 10px 0; }
.ts-reg-card { border: 1px solid #e5e7eb; border-radius: 12px; padding: 12px 14px; display: grid; gap: 8px; background: #fffdf5; }
.ts-reg-card header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.ts-reg-card header b { font-size: 16px; }
.ts-reg-card header small { margin-left: auto; }
.ts-reg-card dl { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; margin: 0; font-size: 13px; }
.ts-reg-card dt { color: #64748b; }
.ts-reg-card dd { margin: 0; overflow-wrap: anywhere; }
.ts-reg-card footer { display: flex; flex-wrap: wrap; gap: 6px; }
.ts-reg-wait { margin: 8px 0; padding-left: 22px; }
.ts-reg-wait li { padding: 6px 0; border-bottom: 1px solid #f1f5f9; }
.ts-reg-wait li { display: list-item; }
.ts-reg-wait li > span:first-child { display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: baseline; }
.ts-reg-wait li > span:last-child { float: right; display: inline-flex; gap: 4px; }
.ts-reg-share h2 { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ts-reg-link { display: flex; gap: 14px; align-items: flex-start; }
.ts-reg-link img { border-radius: 8px; border: 1px solid #e5e7eb; background: #fff; display: block; }
.ts-reg-link > div { flex: 1; min-width: 0; }
.ts-reg-link input[type="text"] { width: 100%; max-width: none; font-family: ui-monospace, Menlo, monospace; font-size: 12px; }
.ts-reg-link p { margin: 8px 0 0; }
.ts-reg-settings { margin-top: 12px; border-top: 1px solid #e5e7eb; padding-top: 10px; }
.ts-reg-settings summary { cursor: pointer; font-weight: 700; }
.ts-reg-settings form { display: grid; gap: 8px; margin-top: 10px; }
.ts-reg-settings input[type="datetime-local"], .ts-reg-settings input[type="text"], .ts-reg-settings input[type="email"], .ts-reg-settings textarea { width: 100%; max-width: none; }
.ts-reg-switch { display: flex; gap: 8px; align-items: center; font-size: 15px; }
.ts-reg-mode { border: 1px solid #e5e7eb; border-radius: 8px; padding: 6px 10px 8px; display: grid; gap: 4px; }
.ts-reg-mode legend { font-weight: 600; padding: 0 4px; }
.ts-reg-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ts-reg-invite textarea { width: 100%; max-width: none; margin: 6px 0; }
@media (max-width: 600px) { .ts-reg-link { flex-direction: column; } .ts-reg-row { grid-template-columns: 1fr; } }
/* Nur auf Einladung: Stand je Gruppe */
.ts-inv { border-left: 4px solid #7c3aed; }
.ts-inv-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; }
.ts-inv-group h3 { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; margin: 0 0 4px; }
.ts-inv-count { font-size: 13px; font-weight: 500; color: #475569; }
.ts-inv-count b { font-size: 18px; color: #0f172a; }
.ts-inv-list { list-style: none; margin: 6px 0 0; padding: 0; }
.ts-inv-list li { display: flex; align-items: center; gap: 8px; padding: 7px 0; border-bottom: 1px solid #f1f5f9; }
.ts-inv-list li.is-no .ts-inv-name b { text-decoration: line-through; color: #94a3b8; }
.ts-inv-state { flex: none; width: 22px; text-align: center; }
.ts-inv-name { flex: 1; min-width: 0; display: grid; }
.ts-inv-name small { color: #64748b; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ts-inv-act { display: inline-flex; flex-wrap: wrap; gap: 3px; justify-content: flex-end; }
.ts-inv-add { margin-top: 12px; border-top: 1px solid #e5e7eb; padding-top: 10px; }
.ts-inv-add summary { cursor: pointer; font-weight: 700; }
.ts-inv-add form { display: grid; gap: 8px; margin-top: 10px; }
.ts-inv-add textarea { width: 100%; max-width: none; }
.ts-inv-steps { margin: 0; padding-left: 20px; display: grid; gap: 6px; }

/* E-Mail-Verwaltung: Gestaltung + Vorschau nebeneinander */
.ts-email-design-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 520px); gap: 24px; align-items: start; }
.ts-email-preview-frame { width: 100%; height: 640px; border: 1px solid #e2e8f0; border-radius: 10px; background: #f1f5f9; }
@media (max-width: 1100px) { .ts-email-design-grid { grid-template-columns: 1fr; } }

/* Wegweiser „Als Nächstes“ (TS_Guide) auf hellen Seiten, z. B. Team-Dashboard */
.ts-ui .ts-guide-banner, .ts-team-dashboard .ts-guide-banner { margin: 0 0 16px; border: 1px solid #e2e8f0; border-left: 4px solid #2563eb; border-radius: 12px; background: #fff; color: #0f172a; }
.ts-ui .ts-guide-banner.is-urgent, .ts-team-dashboard .ts-guide-banner.is-urgent { border-left-color: #f59e0b; background: #fffbeb; }
.ts-ui .ts-guide-banner summary, .ts-team-dashboard .ts-guide-banner summary { list-style: none; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 10px 14px; cursor: pointer; }
.ts-ui .ts-guide-banner summary::-webkit-details-marker, .ts-team-dashboard .ts-guide-banner summary::-webkit-details-marker { display: none; }
.ts-ui .ts-guide-ico, .ts-team-dashboard .ts-guide-ico { font-size: 22px; line-height: 1; text-align: center; }
.ts-ui .ts-guide-txt, .ts-team-dashboard .ts-guide-txt { min-width: 0; display: flex; flex-direction: column; }
.ts-ui .ts-guide-txt b, .ts-team-dashboard .ts-guide-txt b { font-size: 14px; }
.ts-ui .ts-guide-txt small, .ts-team-dashboard .ts-guide-txt small { font-size: 12px; color: #64748b; }
.ts-ui .ts-guide-go, .ts-team-dashboard .ts-guide-go { padding: 7px 12px; border-radius: 999px; background: #2563eb; color: #fff !important; font-weight: 800; font-size: 13px; text-decoration: none; white-space: nowrap; }
.ts-ui .ts-guide-more, .ts-team-dashboard .ts-guide-more { font-size: 12px; color: #64748b; font-weight: 700; }
.ts-ui .ts-guide-list, .ts-team-dashboard .ts-guide-list { list-style: none; margin: 0; padding: 0 14px 10px; display: grid; gap: 6px; }
.ts-ui .ts-guide-list li a, .ts-team-dashboard .ts-guide-list li a { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px 10px; border-radius: 10px; border: 1px solid #e2e8f0; background: #f8fafc; color: #0f172a; text-decoration: none; }
.ts-ui .ts-guide-lvl, .ts-team-dashboard .ts-guide-lvl { font-style: normal; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: #64748b; }

/* Reichweiten-Nachweis (TS_Reach) */
.ts-reach h2 small { font-size: 12px; font-weight: 500; color: #64748b; margin-left: 8px; }
.ts-reach-table td.r, .ts-reach-table th.r { text-align: right; }
.ts-reach-bars { display: inline-flex; align-items: flex-end; gap: 1px; height: 22px; width: 126px; vertical-align: middle; }
.ts-reach-bars i { display: block; flex: 1 1 0; min-height: 1px; background: #2563eb; border-radius: 1px 1px 0 0; opacity: .85; }

/* Veranstaltungen & Zugriff */
.ts-eh-focus { padding: 12px 16px; margin-bottom: 14px; border-left: 4px solid #2563eb; background: #eff6ff; }
.ts-eh-inline { display: inline-flex; gap: 6px; flex-wrap: wrap; margin: 6px 0 0; }
.ts-eh-table td.r, .ts-eh-table th.r { text-align: right; }
.ts-eh-table .ts-actions { white-space: nowrap; }
.ts-eh-table .ts-actions .button { margin: 2px 0; }
.ts-eh-arch td { opacity: .6; }
.ts-chip { display: inline-flex; align-items: center; gap: 4px; margin: 0 4px 4px 0; padding: 2px 8px; border-radius: 999px; background: #f1f5f9; border: 1px solid #e2e8f0; font-size: 12px; }
.ts-eh-x { display: inline; }
.ts-eh-xbtn { border: 0; background: none; color: #b91c1c; cursor: pointer; padding: 0 2px; font-size: 12px; }
.ts-eh-grant { display: flex; gap: 4px; align-items: center; margin-top: 4px; }
.ts-eh-grant select { max-width: 220px; font-size: 12px; }

/* Live-Probe (TS_Live_Sim) */
.ts-live-sim { margin-top: 8px; }
.ts-live-sim-bar { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.ts-live-sim-state { margin: 8px 0 4px; }
.ts-live-sim-on { color: #dc2626; }
.ts-live-sim-steps { columns: 2 260px; margin: 0; padding-left: 0; list-style: none; font-size: 12px; }
.ts-live-sim-steps li { padding: 2px 0; opacity: .6; }
.ts-live-sim-steps li span { display: inline-block; min-width: 38px; font-variant-numeric: tabular-nums; }
.ts-live-sim-steps li.is-ok { opacity: 1; }
.ts-live-sim-steps li.is-ok::before { content: '✓ '; color: #16a34a; }
.ts-live-sim-steps li.is-bad { opacity: 1; color: #dc2626; }
.ts-live-sim-steps li.is-bad::before { content: '✗ '; }

/* Verspätungs-Warnung (TS_Delay_Advisor) */
.ts-delay-issue { margin-top: 12px; padding: 10px 12px; border-left: 4px solid #dc2626; background: #fef2f2; border-radius: 6px; }
.ts-delay-issue p { margin: 0 0 6px; }
.ts-delay-actions form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 4px 0; }

/* Kader-Bestätigung – Übersicht der Turnierleitung */
.ts-sq-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.ts-sq-item { display: flex; flex-direction: column; padding: 8px 10px; border-radius: 8px; border-left: 4px solid #f59e0b; background: #fffbeb; }
.ts-sq-item.is-ok { border-left-color: #16a34a; background: #f0fdf4; }
.ts-sq-item.is-changed { border-left-color: #dc2626; background: #fef2f2; }
.ts-sq-item small { color: #6b7280; }

/* Team der Veranstaltung (TS_Event_Crew) */
.ts-crew-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.ts-crew-on { color: #16a34a; font-weight: 700; white-space: nowrap; }
.ts-crew-off { color: #6b7280; font-size: 12px; white-space: nowrap; }
.ts-crew-tag { font-size: 12px; }
.ts-crew-rm { margin: 0; }
.ts-crew-add { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 12px; }
.ts-crew-add small { flex-basis: 100%; }
@media print { .ts-crew-actions, .ts-crew-add, .ts-crew-rm, #adminmenumain, #wpadminbar { display: none !important; } }

/* Aktuelle Veranstaltung in der Kopfzeile (TS_Event_Context::banner) */
.ts-evbanner { display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; padding: 6px 14px; border-radius: 12px; background: #ecfdf5; border: 1px solid #a7f3d0; color: #064e3b; }
.ts-evbanner.is-empty { background: #fef2f2; border-color: #fecaca; color: #7f1d1d; }
.ts-evbanner-k { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; opacity: .75; }
.ts-evbanner-name { font-size: 15px; }
.ts-evbanner-group { padding: 1px 8px; border-radius: 999px; background: #d1fae5; font-size: 12px; font-weight: 700; }
.ts-evbanner-meta { font-size: 12px; opacity: .8; }
.ts-evbanner-lock { font-size: 12px; font-weight: 700; opacity: .85; }
.ts-shell-context { flex-wrap: wrap; }
@media (max-width: 782px) { .ts-evbanner { width: 100%; } }

/* Kopfzeile: Veranstaltung antippen → Auswahl (TS_Event_Context::banner/menu_html) */
.ts-evbanner-wrap { position: relative; display: inline-block; }
.ts-evbanner-wrap > summary { list-style: none; cursor: pointer; }
.ts-evbanner-wrap > summary::-webkit-details-marker { display: none; }
.ts-evbanner-caret { font-size: 12px; font-weight: 700; color: #047857; }
.ts-evbanner-wrap[open] > summary { box-shadow: 0 0 0 2px #34d399; }
.ts-evbanner-menu { position: absolute; z-index: 100050; top: calc(100% + 6px); left: 0; min-width: 340px; max-width: 460px; max-height: 70vh; overflow: auto; padding: 8px; border-radius: 12px; background: #fff; border: 1px solid #e5e7eb; box-shadow: 0 16px 40px rgba(15, 23, 42, .18); }
.ts-evbanner-menu .ts-evchip-h { margin: 4px 8px 6px; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: #6b7280; }
.ts-evbanner-menu .ts-evchip-h small { text-transform: none; letter-spacing: 0; font-weight: 400; }
.ts-evbanner-menu .ts-evchip-item { display: flex; flex-direction: column; gap: 3px; padding: 8px 10px; border-radius: 8px; color: #111827; text-decoration: none; }
.ts-evbanner-menu .ts-evchip-item:hover { background: #f3f4f6; }
.ts-evbanner-menu .ts-evchip-item.is-current { background: #ecfdf5; }
.ts-evbanner-menu .ts-evchip-name { font-weight: 700; font-size: 14px; }
.ts-evbanner-menu .ts-evchip-meta { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.ts-evbanner-menu .ts-evchip-date { color: #6b7280; font-size: 12px; }
.ts-evbanner-menu .ts-evtag { padding: 1px 7px; border-radius: 999px; font-size: 11px; font-weight: 700; background: #f1f5f9; color: #475569; }
.ts-evbanner-menu .ts-evtag.is-arch { background: #fef3c7; color: #92400e; }
.ts-evbanner-menu .ts-evtag.is-prac { background: #dbeafe; color: #1e40af; }
.ts-evbanner-menu .ts-evtag.is-st-active { background: #dcfce7; color: #166534; }
.ts-evbanner-menu .ts-evchip-all { margin-top: 4px; border-top: 1px solid #e5e7eb; border-radius: 0; color: #4b5563; font-size: 13px; }
@media (max-width: 782px) { .ts-evbanner-wrap { display: block; } .ts-evbanner-menu { left: 0; right: 0; min-width: 0; max-width: none; } }
.ts-launch-copy { width: 100%; max-width: 640px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; margin: 4px 0; }
.ts-launch-m365 { margin: 10px 0 16px; padding: 10px 14px; border: 1px solid var(--ts-border, #e5e7eb); border-radius: 10px; background: var(--ts-surface-2, #f8fafc); }
.ts-launch-m365 > summary { cursor: pointer; }
.ts-launch-m365 ol { margin: 8px 0 12px 18px; }
.ts-launch-m365 ol li { margin-bottom: 4px; }