.twitch-status-belt{margin:10px 0 12px 0;border-radius:10px;padding:6px;border:1px solid rgba(39,39,42,0.6);overflow:hidden;display:flex;align-items:center;gap:10px}
.twitch-status-belt.online{background:linear-gradient(135deg,rgba(145,70,255,0.35),rgba(119,44,232,0.35));border-color:rgba(145,70,255,0.35)}
.twitch-status-belt.offline{background:rgba(31,41,55,0.45);border-color:rgba(31,41,55,0.5)}
*{box-sizing:border-box}
html,body{margin:0;padding:80px 0 60px 0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Helvetica,Arial,sans-serif;background:#0e1116;color:#e6eaf2}
a{color:inherit;text-decoration:none}

.container{max-width:1100px;margin:0 auto;padding:16px}

.site-header{position:fixed;top:0;left:0;right:0;background:#141925;border-bottom:1px solid #202633;z-index:200}
.nav{display:flex;align-items:center;justify-content:center;gap:48px}
.site-header nav a{margin-left:16px;opacity:.85}
.site-header nav a:hover{opacity:1}
.site-header nav{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none}
.site-header nav::-webkit-scrollbar{display:none}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin-top:16px}
.card{background:#141925;border:1px solid #202633;border-radius:10px;padding:16px;display:block;transition:.2s transform ease,.2s box-shadow ease}
.card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.35)}
.card-title{font-weight:600;margin-bottom:8px}
.card-body{opacity:.85}

/* Profil-Statistik-Layout analog Mockup */
.section-title{margin:8px 0 8px 0;color:#10b981}
.stat-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin:8px 0}
.stat-grid .card{background:linear-gradient(180deg,#0a0a0a,#111113);border:1px solid var(--border);border-radius:16px;padding:22px;text-align:center}
.stat-grid .value{font-size:64px;font-weight:800;line-height:1;margin-bottom:8px}
.stat-grid .label{opacity:.8;text-transform:uppercase;letter-spacing:.06em}
.stat-grid .sr-grade{font-size:14px;opacity:.85;margin-left:6px}
.stat-grid .hive-rank-name{font-size:14px;opacity:.85;margin-left:6px}
.hive-rank-name-small{font-size:11px;opacity:.8;margin-left:4px}
.stat-grid .bar{height:6px;background:#0d0f14;border:1px solid #252b38;border-radius:999px;overflow:hidden;margin-top:10px}
.stat-grid .bar > span{display:block;height:100%;background:linear-gradient(90deg,var(--accent-neo),#00c97a)}
.stat-grid .delta-display{margin-top:8px;margin-bottom:-4px}

@media (max-width: 1024px){.stat-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width: 640px){.stat-grid{grid-template-columns:repeat(2,1fr)}.stat-grid .value{font-size:48px}}

/* Bilder generell responsiv */
img{max-width:100%;height:auto}

.list{display:grid;gap:8px}
.list-item{border:1px solid #202633;background:#141925;border-radius:8px;padding:12px}
.muted{opacity:.7}
.tag{display:inline-block;background:#1e2533;border:1px solid #2a3345;color:#b0c4ff;padding:2px 8px;border-radius:999px;font-size:12px;margin-right:6px}

table{width:100%;border-collapse:collapse;margin-top:8px}
th,td{padding:8px;border-bottom:1px solid #202633;text-align:left}
th{background:#161b28}

.site-footer{position:fixed;bottom:0;left:0;right:0;border-top:1px solid rgba(5,238,136,0.12);background:linear-gradient(180deg,rgba(0,0,0,0.18),rgba(0,0,0,0.08));backdrop-filter:blur(6px);z-index:100;padding:8px 0}
.site-footer .container{display:flex;justify-content:center;align-items:center;gap:8px;text-align:center}

.pill{display:inline-block;padding:2px 8px;border-radius:999px;background:#232a3a;border:1px solid #2d3750;font-size:12px}

.page-title{display:flex;align-items:center;justify-content:space-between;gap:8px}
.search{background:#0e1116;border:1px solid #2a3345;border-radius:8px;padding:8px;color:#e6eaf2;width:100%}
.search-wrap{position:relative}
/* Session-Header: Such-Box über die Buttons einblenden und ganz nach oben legen */
.session-header .search-wrap{position:absolute; right:0; bottom:calc(100% + 12px);} /* Box erscheint oberhalb */
.session-header{position:relative}
.session-header .search-group{position:relative; display:inline-block}
.suggest{z-index: 500}
.suggest{position:absolute;z-index:20;top:100%;left:0;right:0;background:#0a0a0a;border:1px solid #2a3345;border-top:none;border-radius:0 0 8px 8px;max-height:240px;overflow:auto}
.suggest-item{padding:8px 12px;border-bottom:1px solid #202633;cursor:pointer}
.suggest-item:last-child{border-bottom:none}
.suggest-item:hover{background:#111113}

/* Alphabet-Bar und Directory */
.alpha-bar{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0}
.alpha-bar .alpha{padding:6px 10px;border:1px solid #2a3345;border-radius:999px;cursor:pointer;font-size:12px;color:#cbd5e1}
.alpha-bar .alpha:hover{background:#111113}
.dir-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:8px;margin:8px 0}
.dir-item{padding:8px 10px;border:1px solid #202633;border-radius:8px;background:#0f0f11;cursor:pointer}
.dir-item:hover{background:#141925}




/* --- RaceRoom Theme Overrides (am Ende eingefügt, um Vorrang sicherzustellen) --- */
:root{--bg:#000000;--panel:#0b0b0b;--text:#e5e7eb;--muted:#a1a1aa;--border:#27272a;--accent:#ef4444;--accent-2:#dc2626;--ring:rgba(239,68,68,0.55)}
html,body{background:var(--bg);color:var(--text)}
a{color:var(--text);text-decoration:none;background-image:linear-gradient(to right,var(--accent),var(--accent));background-size:0% 2px;background-position:0 100%;background-repeat:no-repeat;transition:color .18s ease,background-size .18s ease}
a:hover{color:#ffffff;background-size:100% 2px}
.site-header{position:fixed;top:0;left:0;right:0;background:linear-gradient(180deg,rgba(0,0,0,0.35),rgba(0,0,0,0.18));border-bottom:1px solid rgba(5,238,136,0.08);backdrop-filter:saturate(120%) blur(6px);overflow:visible;z-index:200}
.site-header::before{content:"";position:absolute;inset:-30% -20% auto -20%;height:140px;background:radial-gradient(65% 65% at 50% 0%,rgba(239,68,68,0.15),rgba(239,68,68,0) 60%);pointer-events:none}
.site-header::after{content:none}
.brand{display:inline-flex;align-items:center;gap:12px;color:#f1f5f9;text-decoration:none;font-weight:700;letter-spacing:0.5px}
.brand::before{content:"";display:inline-block;width:140px;height:40px;background-image:url('../image/logo.png?v=3');background-repeat:no-repeat;background-position:left center;background-size:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,.35))}
.brand:hover{color:#ffffff;background-size:0% 2px}
.site-header .nav{backdrop-filter:none;background:transparent;border-bottom:0}
.site-header nav a{color:#d4d4d8;opacity:1}
.site-header nav a:hover{color:#ffffff}
.site-header nav a.active{color:#ffffff}
.twitch-badge{display:none}
.twitch-badge .dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.twitch-badge .dot.offline{background:#ef4444}
.twitch-badge .dot.online{background:#05EE88;box-shadow:0 0 0 3px rgba(5,238,136,0.25)}
.twitch-badge.is-live{border-color:rgba(5,238,136,0.6);background:rgba(5,238,136,0.12)}
.site-header nav a.cta{padding:8px 14px;border-radius:14px;color:#fff;background:linear-gradient(135deg,#05EE88,#04D17A);box-shadow:0 0 0 rgba(5,238,136,0);transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
.site-header nav a.cta:hover{filter:brightness(1.07);transform:translateY(-2px);box-shadow:0 10px 32px rgba(5,238,136,0.4)}
.site-header nav a.cta:focus-visible{outline:2px solid transparent;box-shadow:0 0 0 3px var(--ring)}
button,.btn,.button{color:#fff;border-radius:14px;border:1px solid transparent;background:linear-gradient(135deg,#05EE88,#04D17A);transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
button:hover,.btn:hover,.button:hover{filter:brightness(1.07);transform:translateY(-2px);box-shadow:0 10px 30px rgba(5,238,136,0.4)}
button:focus-visible,.btn:focus-visible,.button:focus-visible{outline:2px solid transparent;box-shadow:0 0 0 3px var(--ring)}
.btn-ghost{background:transparent;border:1px solid var(--border);color:var(--text)}
.btn-ghost:hover{border-color:#05EE88;box-shadow:0 6px 24px rgba(5,238,136,0.3)}
.btn-ghost:focus-visible{outline:2px solid transparent;box-shadow:0 0 0 3px var(--ring)}
.card,.list-item{background:linear-gradient(180deg,rgba(10,10,10,0.05),rgba(17,17,19,0.08));border:1px solid rgba(5,238,136,0.15);border-radius:16px;backdrop-filter:blur(16px)}
.card{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.card:hover{transform:translateY(-2px);border-color:rgba(5,238,136,0.6);box-shadow:0 14px 32px rgba(5,238,136,0.3),0 10px 24px rgba(0,0,0,0.35)}
.list-item{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.list-item:hover{transform:translateY(-2px);border-color:rgba(5,238,136,0.6);box-shadow:0 10px 24px rgba(5,238,136,0.3)}
.muted{color:var(--muted)}
.tag,.pill{border:1px solid rgba(5,238,136,0.2);background:rgba(5,238,136,0.05);color:#10b981;backdrop-filter:blur(8px)}
table{background:rgba(10,10,10,0.05);backdrop-filter:blur(16px);border-radius:12px;border:1px solid rgba(5,238,136,0.15)}
th,td{border-bottom:1px solid rgba(5,238,136,0.1)}
th{background:rgba(5,238,136,0.05);color:#bbb;text-transform:uppercase;letter-spacing:.04em;font-size:.85rem}
tbody tr{transition:background-color .15s ease}
tbody tr:hover{background:rgba(5,238,136,0.05)}
.badge,.lap-badge{display:inline-block;padding:2px 8px;border-radius:999px;border:1px solid rgba(5,238,136,0.2);color:var(--muted);background:rgba(5,238,136,0.05);backdrop-filter:blur(8px);font-size:.75rem}
*{transition-timing-function:cubic-bezier(.2,.8,.2,1)}
.card,.list-item,a,button,.btn,.button,th,td{transition-duration:.18s}
:focus-visible{outline:2px solid transparent;box-shadow:0 0 0 3px var(--ring)}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{transition:none !important;animation:none !important}}
.card-title{color:#f3f4f6}
.card-body{color:var(--muted)}

/* Erweiterte Session-Results Styles */
.session-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding:20px;background:linear-gradient(180deg,rgba(10,10,10,0.05),rgba(17,17,19,0.08));border:1px solid rgba(5,238,136,0.15);border-radius:16px;backdrop-filter:blur(16px)}
.session-meta h2{margin:0;color:#f3f4f6}
.session-meta .meta-info{color:var(--muted);margin-top:4px}
.view-controls{display:flex;gap:8px}
.view-controls button{padding:8px 16px;font-size:14px}
.view-controls button.active{background:linear-gradient(135deg,#05EE88,#05EE88);color:#000}
.view-controls button{border:1px solid rgba(5,238,136,0.4);background:transparent;color:#e5e7eb}
.view-controls button:hover{border-color:#05EE88;box-shadow:0 6px 24px rgba(5,238,136,0.3);color:#c7ffe7}

.session-grid{display:grid;gap:20px}
.session-type{background:linear-gradient(180deg,rgba(10,10,10,0.05),rgba(17,17,19,0.08));border:1px solid rgba(5,238,136,0.15);border-radius:16px;padding:20px;backdrop-filter:blur(16px)}
.session-type h3{margin:0 0 16px 0;color:#f3f4f6;display:flex;align-items:center;gap:8px}
.session-type h3::before{content:"";width:4px;height:20px;background:var(--accent);border-radius:2px}

#drivers-table-wrap{background:linear-gradient(180deg,rgba(10,10,10,0.05),rgba(17,17,19,0.08));backdrop-filter:blur(12px);border-radius:12px;padding:20px;margin-top:20px;box-shadow:0 8px 32px rgba(0,0,0,0.2);border:1px solid rgba(5,238,136,0.15)}
.results-table{width:100%;border-collapse:collapse;margin-top:0;background:transparent;border-radius:0;overflow:visible;box-shadow:none}
.results-table th{background:rgba(15,15,17,0.7);color:#bbb;text-transform:uppercase;letter-spacing:.04em;font-size:.85rem;padding:12px 8px}
.results-table td{padding:12px 8px;border-bottom:1px solid rgba(32,38,51,0.4)}
.results-table tbody tr{transition:background-color .15s ease}
.results-table tbody tr:hover{background:rgba(15,15,18,0.5)}
/* Rennen-Spalte zentrieren */
.results-table td.races-cell{ text-align:center; font-weight:700 }
/* Fahrer-Liste: Rangspalte zentrieren und Delta anzeigen */
body[data-page="drivers"] #drivers-table th:nth-child(1){ width:110px; text-align:center; white-space:nowrap }
body[data-page="drivers"] #drivers-table td:nth-child(1){ text-align:center; white-space:nowrap }
.rank-cell{ display:flex; align-items:center; justify-content:center; gap:8px }
.rank-num{ font-weight:800; width:28px; height:28px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:#111113; border:1px solid var(--border) }
.rank-delta{ font-size:12px; font-weight:700; padding:2px 6px; border-radius:999px; border:1px solid rgba(255,255,255,0.08) }
.rank-up{ background:rgba(34,197,94,0.25); color:#fff; border-color:rgba(34,197,94,0.45) }
.rank-down{ background:rgba(239,68,68,0.25); color:#fff; border-color:rgba(239,68,68,0.45) }
.rank-neutral{ background:rgba(120,120,120,0.25); color:#e5e7eb; border-color:rgba(120,120,120,0.45) }
/* Zentrale Ausrichtung für HivePace/HiveScore in Fahrerübersicht */
body[data-page="drivers"] #drivers-table th:nth-child(3),
body[data-page="drivers"] #drivers-table th:nth-child(4){ text-align:center }
body[data-page="drivers"] #drivers-table td:nth-child(3),
body[data-page="drivers"] #drivers-table td:nth-child(4){ text-align:center }

/* Konsistenz-Zelle (Drivers-Liste) */
.results-table td .consistency-cell{font-weight:600}

/* Delta-Anzeigen für HivePace/HiveScore */
.rating-cell {
  display: flex;
  align-items: center;
  gap: 8px;
}

.rating-value {
  font-weight: 600;
}

.delta {
  font-size: 11px;
  font-weight: 600;
  padding: 2px 6px;
  border-radius: 4px;
  white-space: nowrap;
}

/* Kompakter, zweizeiliger Block für HivePace/HiveScore + Delta */
.rating-block{display:flex;flex-direction:column;gap:4px}
.rating-row{display:flex;align-items:center;gap:6px}
.rating-row .elo-mini{margin-right:6px}
.rating-row .sr-mini{margin-left:6px;margin-right:6px}
.delta-pill{font-size:11px;font-weight:700;padding:2px 6px;border-radius:999px;border:1px solid rgba(255,255,255,0.08)}
.delta-pill.delta-positive{background:rgba(34,197,94,0.3);color:#ffffff;border-color:rgba(34,197,94,0.5)}
.delta-pill.delta-negative{background:rgba(239,68,68,0.3);color:#ffffff;border-color:rgba(239,68,68,0.5)}
.delta-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;vertical-align:middle}
.delta-pill.delta-positive .delta-dot{background:#22c55e}
.delta-pill.delta-negative .delta-dot{background:#ef4444}

.delta-positive {
  background: rgba(34, 197, 94, 0.3);
  color: #ffffff;
  border: 1px solid rgba(34, 197, 94, 0.5);
}

.delta-negative {
  background: rgba(239, 68, 68, 0.3);
  color: #ffffff;
  border: 1px solid rgba(239, 68, 68, 0.5);
}

/* Delta Kreis-Icon */
.delta-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;vertical-align:middle}
.delta-positive .delta-dot{background:#22c55e}
.delta-negative .delta-dot{background:#ef4444}

/* Delta-Inline für Sessions */
.delta-inline {
  font-size: 11px;
  font-weight: 600;
  margin-left: 4px;
}
.delta-inline.delta-positive { color: #ffffff; }
.delta-inline.delta-negative { color: #ffffff; }

/* Kräftiges Weiß für Delta-Anzeige in Klammern */
.delta-white{color:#ffffff;font-weight:700;margin-left:6px}

/* DNF-Anzeigen */
.dnf-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.dnf-count {
  font-weight: 700;
  font-size: 16px;
  padding: 4px 8px;
  border-radius: 6px;
  min-width: 24px;
  text-align: center;
}

.dnf-rate {
  font-size: 10px;
  opacity: 0.8;
  font-weight: 500;
}

.dnf-good {
  background: rgba(34, 197, 94, 0.2);
  color: #22c55e;
  border: 1px solid rgba(34, 197, 94, 0.3);
}

.dnf-warning {
  background: rgba(251, 191, 36, 0.2);
  color: #f59e0b;
  border: 1px solid rgba(251, 191, 36, 0.3);
}

.dnf-bad {
  background: rgba(239, 68, 68, 0.2);
  color: #ef4444;
  border: 1px solid rgba(239, 68, 68, 0.3);
}

.position-badge{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;font-weight:600;font-size:14px}
.position-badge.p1{background:linear-gradient(135deg,#ffd700,#ffb347);color:#000}
.position-badge.p2{background:linear-gradient(135deg,#c0c0c0,#a8a8a8);color:#000}
.position-badge.p3{background:linear-gradient(135deg,#cd7f32,#b8860b);color:#fff}
.position-badge.other{background:var(--border);color:var(--text)}

.lap-time{font-family:Monaco,Consolas,'Courier New',monospace;font-size:14px}
.lap-time.fastest{color:#8b5cf6;font-weight:700} /* Purple for session-best */
.lap-time.personal-best{color:#10b981}

.status-badge{padding:4px 8px;border-radius:6px;font-size:12px;font-weight:500}
.status-badge{display:inline-flex;align-items:center;gap:6px}
.status-badge.finished{background:#065f46;color:#10b981}
.status-badge.dnf{background:#7f1d1d;color:#f87171}
.status-badge.dns{background:#374151;color:#9ca3af}
.status-ico{font-size:14px;line-height:1}

.analytics-grid{display:grid;grid-template-columns:2fr 1fr;gap:24px;margin-top:20px}
.chart-container,.stats-container{background:linear-gradient(180deg,#0a0a0a,#111113);border:1px solid var(--border);border-radius:16px;padding:20px}
.chart-container h3,.stats-container h3{margin:0 0 16px 0;color:#f3f4f6}
.stats-grid{display:grid;gap:12px}
.stat-item{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border)}
.stat-item:last-child{border-bottom:none}
.stat-value{font-weight:600;color:#f3f4f6}

.lapboard-container{margin-top:20px}
.lapboard-controls{display:flex;gap:12px;margin-bottom:16px;align-items:center}
.lapboard-controls select{background:#0a0a0a;border:1px solid var(--border);color:var(--text);padding:8px 12px;border-radius:8px}
.lapboard-grid{display:grid;gap:8px}
.lap-entry{display:grid;grid-template-columns:auto 1fr auto auto auto auto;gap:12px;align-items:center;padding:12px;background:linear-gradient(180deg,#0a0a0a,#111113);border:1px solid var(--border);border-radius:12px}
.lap-entry.invalid{opacity:0.6;border-color:#7f1d1d}
.lap-number{font-weight:600;color:var(--muted);min-width:40px}
.driver-name{font-weight:500}
.sector-time{font-family:Monaco,Consolas,'Courier New',monospace;font-size:13px;color:var(--muted);min-width:70px}
.sector-time.fastest-sector{color:var(--accent)}

/* Tracks Grid */
.track-card{display:grid;grid-template-columns:160px 1fr;gap:16px;align-items:center;padding:12px}
.track-thumb{width:100%;height:100px;object-fit:cover;border-radius:10px;border:1px solid var(--border);background:#0a0a0a;display:block}
.track-info{display:flex;justify-content:space-between;gap:8px;align-items:center}
.track-line{display:flex;gap:8px;align-items:baseline}
.track-meta{display:flex;gap:8px;align-items:center}
.track-store{background:#0f172a;color:#93c5fd;border-color:#1d4ed8}
.track-store:hover{filter:brightness(1.08)}

/* ELO/Safety Rating Badges */
.driver-card{padding:20px}
.driver-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}
.driver-info strong{font-size:16px;color:#f3f4f6}
.driver-badges{display:flex;gap:8px;flex-wrap:wrap}
.driver-stats{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

.elo-badge,.sr-badge{padding:4px 10px;border-radius:6px;font-size:12px;font-weight:600;border:1px solid transparent}
.elo-master{background:linear-gradient(135deg,#ffd700,#ffb347);color:#000;border-color:#ffd700}
.elo-expert{background:linear-gradient(135deg,#c0c0c0,#a8a8a8);color:#000;border-color:#c0c0c0}
.elo-advanced{background:linear-gradient(135deg,#cd7f32,#b8860b);color:#fff;border-color:#cd7f32}
.elo-intermediate{background:#065f46;color:#10b981;border-color:#10b981}
.elo-beginner{background:#374151;color:#9ca3af;border-color:#4b5563}

.sr-excellent{background:#065f46;color:#10b981;border-color:#10b981}
.sr-good{background:#1e40af;color:#60a5fa;border-color:#3b82f6}
.sr-average{background:#d97706;color:#fbbf24;border-color:#f59e0b}
.sr-poor{background:#dc2626;color:#fca5a5;border-color:#ef4444}
.sr-dangerous{background:#7f1d1d;color:#f87171;border-color:#dc2626}

.winrate-badge{background:#0f172a;color:#38bdf8;border:1px solid #0284c7;padding:4px 8px;border-radius:6px;font-size:12px}
.dnf-pill{background:#7f1d1d;color:#f87171;border-color:#dc2626}

/* Mini-Badges für Tabellen */
.rating-cell{display:flex;gap:4px;flex-wrap:wrap}
.elo-mini,.sr-mini{padding:2px 6px;border-radius:4px;font-size:10px;font-weight:600;border:1px solid transparent;white-space:nowrap}
.elo-mini.elo-master{background:#ffd700;color:#000;border-color:#ffb347}
.elo-mini.elo-expert{background:#c0c0c0;color:#000;border-color:#a8a8a8}
.elo-mini.elo-advanced{background:#cd7f32;color:#fff;border-color:#b8860b}
.elo-mini.elo-intermediate{background:#065f46;color:#10b981;border-color:#047857}
.elo-mini.elo-beginner{background:#374151;color:#9ca3af;border-color:#4b5563}
.sr-mini.sr-excellent{background:#065f46;color:#10b981;border-color:#047857}
.sr-mini.sr-good{background:#1e40af;color:#60a5fa;border-color:#2563eb}
.sr-mini.sr-average{background:#d97706;color:#fbbf24;border-color:#f59e0b}
.sr-mini.sr-poor{background:#dc2626;color:#fca5a5;border-color:#ef4444}
.sr-mini.sr-dangerous{background:#7f1d1d;color:#f87171;border-color:#dc2626}

/* Umlaute-Fix für bessere Darstellung */
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
body{font-feature-settings:"kern" 1,"liga" 1}

/* Neon-Hover-Akzente (#05EE88) */
:root{--accent-neo:#05EE88}
.site-header nav a{position:relative}
.site-header nav a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:linear-gradient(90deg,var(--accent-neo),#00c97a);transform:scaleX(0);transform-origin:left;border-radius:999px;transition:transform .18s ease,box-shadow .18s ease}
.site-header nav a:hover{color:var(--accent-neo);text-shadow:0 0 10px rgba(5,238,136,.55)}
.site-header nav a:hover::after{transform:scaleX(1);box-shadow:0 0 12px rgba(5,238,136,.6)}

.suggest{border-color:rgba(5,238,136,.25)}
.suggest-item:hover{background:rgba(5,238,136,.08);border-left:3px solid var(--accent-neo)}

.alpha-bar .alpha:hover{background:rgba(5,238,136,.08);color:var(--accent-neo);border-color:var(--accent-neo);box-shadow:0 0 0 2px rgba(5,238,136,.15)}
.dir-item:hover{border-color:var(--accent-neo);box-shadow:0 8px 22px rgba(5,238,136,.12)}

button:hover,.btn:hover,.button:hover{box-shadow:0 10px 30px rgba(239,68,68,0.25),0 0 0 3px rgba(5,238,136,.25)}
button:focus-visible,.btn:focus-visible,.button:focus-visible{box-shadow:0 0 0 3px rgba(5,238,136,.45)}

tbody tr:hover{box-shadow:inset 0 0 0 1px rgba(5,238,136,.25)}

/* Neon-Hover für Boxen/Karten (Letzte Session, Listen, Charts, Stats, Tracks/Cars) */
.card:hover,
.list-item:hover,
.session-type:hover,
.chart-container:hover,
.stats-container:hover,
.track-card:hover{
  border-color: var(--accent-neo) !important;
  box-shadow: 0 14px 32px rgba(5,238,136,.18), 0 10px 24px rgba(0,0,0,.35);
  transform: translateY(-2px);
}

.pill:hover{border-color:var(--accent-neo);color:#c7ffe7;box-shadow:0 0 0 2px rgba(5,238,136,.18)}

@media (max-width: 768px) {
  .session-header{flex-direction:column;gap:16px}
  .analytics-grid{grid-template-columns:1fr}
  .lap-entry{grid-template-columns:auto 1fr auto;gap:8px}
  .sector-time{display:none}
  .driver-header{flex-direction:column;gap:8px;align-items:flex-start}
  .driver-badges{order:2}
  /* Responsive Grids/Karten */
  .grid{grid-template-columns:1fr}
  .track-card{grid-template-columns:1fr}
  .track-thumb{height:180px}
  /* Tabellen mobil scrollbar */
  table{display:block;overflow-x:auto;white-space:nowrap}
  th,td{padding:10px}
  .site-header .nav{flex-wrap:nowrap}
}

/* Globales Hintergrundbild */
html,body{background-image:url('../image/hintergrund.png?v=2');background-size:cover;background-repeat:no-repeat;background-position:center center;background-attachment:fixed;background-color:#000}

/* Mini-Track-Karten für Fahrerprofil */
.mini-tracks{display:grid;grid-template-columns:repeat(5,minmax(200px,1fr));gap:12px}
.mini-tracks .mini{display:grid;grid-template-rows:110px auto;gap:8px;padding:10px;border:1px solid rgba(5,238,136,0.15);border-radius:12px;background:linear-gradient(180deg,rgba(10,10,10,0.05),rgba(17,17,19,0.08));backdrop-filter:blur(12px);transition:transform .18s ease,box-shadow .18s ease, opacity .18s ease}
.mini-tracks .mini:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(5,238,136,.16);border-color:#05EE88}
.mini-tracks .img{width:100%;aspect-ratio:16/9;height:auto;border-radius:8px;border:1px solid rgba(5,238,136,0.15);object-fit:cover;background:rgba(10,10,10,0.08)}
.mini-tracks .meta{display:flex;flex-direction:column}
.mini-tracks .name{font-weight:600;color:#f3f4f6}
.mini-tracks .sub{font-size:12px;color:var(--muted)}
.mini-tracks .mini.selected{border-color:#05EE88;box-shadow:0 0 0 2px rgba(5,238,136,.25)}
/* Dimme nicht ausgewählte, wenn eine ausgewählt ist */
.sessions-left .dim-others .mini{opacity:.6; background:linear-gradient(180deg,rgba(10,10,10,0.03),rgba(17,17,19,0.06)); border-color:rgba(5,238,136,0.10)}
.sessions-left .dim-others .mini.selected{opacity:1}

.pager{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.pager .page{padding:6px 10px;border:1px solid var(--border);border-radius:999px;background:#0f0f11;color:#cbd5e1;cursor:pointer}
.pager .page.active{border-color:#05EE88;color:#fff;box-shadow:0 0 0 2px rgba(5,238,136,.25)}
.pager .page:hover{border-color:#05EE88}

/* Footer-Update Button links unten */
.update-data-btn-fixed{position:fixed;left:12px;bottom:14px;z-index:110}

/* Split-Layout für Sessions */
.sessions-split{display:flex;gap:16px;align-items:flex-start}
.sessions-left{flex:0 0 480px}
.sessions-left .mini-tracks{grid-template-columns:repeat(3,minmax(240px,1fr))}
.sessions-left .mini-tracks .mini{grid-template-rows:160px auto}
.sessions-right{flex:1 1 auto;position:sticky;top:86px;margin-right:0;width:auto}
.sessions-right .mini-details table{table-layout:fixed}
/* Kopfzeile nicht umbrechen */
.sessions-right .mini-details th{white-space:nowrap}
/* Fahrzeug-Spalte nicht umbrechen */
.sessions-right .mini-details td:nth-child(11){white-space:nowrap}
/* Alle Zellen in der Sessions-Detailtabelle zentrieren */
.sessions-right .mini-details th,
.sessions-right .mini-details td{ text-align:center }
/* Spaltenbreiten für Sessions-Detailtabelle (Reihenfolge: Pos,Fahrer,Datum,Event,Startplatz,Ergebnis,Status,Beste Runde,Konsistenz,HivePace/HiveScore,Fahrzeug,Rennen) */
.sessions-right .mini-details th:nth-child(1){width:60px}
.sessions-right .mini-details th:nth-child(2){width:260px}
.sessions-right .mini-details th:nth-child(3){width:200px}
.sessions-right .mini-details th:nth-child(4){width:520px}
.sessions-right .mini-details th:nth-child(5){width:120px}
.sessions-right .mini-details th:nth-child(6){width:120px}
.sessions-right .mini-details th:nth-child(7){width:120px}
.sessions-right .mini-details th:nth-child(8){width:130px}
.sessions-right .mini-details th:nth-child(9){width:120px}
.sessions-right .mini-details th:nth-child(10){width:320px}
.sessions-right .mini-details th:nth-child(11){width:240px}
.sessions-right .mini-details th:nth-child(12){width:140px}
/* Zentrierung für numerische/kurze Spalten */
.sessions-right .mini-details td:nth-child(1),
.sessions-right .mini-details td:nth-child(3),
.sessions-right .mini-details td:nth-child(5),
.sessions-right .mini-details td:nth-child(6),
.sessions-right .mini-details td:nth-child(7),
.sessions-right .mini-details td:nth-child(8),
.sessions-right .mini-details td:nth-child(9),
.sessions-right .mini-details td:nth-child(10),
.sessions-right .mini-details td:nth-child(12){text-align:center}
/* Eventzelle (Spalte 4) Flex-Inhalt mittig ausrichten */
.sessions-right .mini-details td:nth-child(4) > div{ justify-content:center }
/* Rating-Zelle mittig ausrichten */
.sessions-right .mini-details td:nth-child(10) .rating-row{justify-content:center}
.sessions-right .mini-details{max-height:80vh;overflow:auto}
/* Container auf Sessions-Seite verbreitern */
body[data-page="sessions"] .container{max-width:3600px}
/* Container auf Session-Detail verbreitern */
body[data-page="session"] .container{max-width:3200px}
/* Container auf Fahrer-Profil verbreitern (für breites Klappmenü) */
body[data-page="driver"] .container{max-width:2000px}
/* Klappmenü auf Profil bis zum rechten Rand (mit kleinem Abstand) */
body[data-page="driver"] .race-details{margin-right:16px}
body[data-page="driver"] .race-details .mini-details{width:100%}
/* Admin Panel Styles */
.admin-login {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 60vh;
}

.login-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 32px;
  max-width: 400px;
  width: 100%;
  text-align: center;
}

.login-card h1 {
  margin: 0 0 8px 0;
  font-size: 28px;
}

.admin-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 32px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}

.admin-section {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 24px;
  margin-bottom: 24px;
}

.admin-section h2 {
  margin: 0 0 24px 0;
  color: var(--accent);
}

.admin-section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.admin-section-header h2 {
  margin: 0;
}

.form-group {
  margin-bottom: 16px;
}

.form-group label {
  display: block;
  margin-bottom: 4px;
  font-weight: 600;
  color: var(--text);
}

.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  padding: 8px 12px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--text);
  font-size: 14px;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(239,68,68,0.1);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}

.form-actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
}

.btn {
  padding: 8px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  font-size: 14px;
  cursor: pointer;
  transition: all 0.2s ease;
  text-decoration: none;
  display: inline-block;
}

.btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.btn-primary {
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  border-color: var(--accent);
  color: white;
}

.btn-primary:hover {
  background: linear-gradient(135deg, var(--accent-2), var(--accent));
  border-color: #05EE88;
  box-shadow: 0 4px 12px rgba(239,68,68,0.25);
}

.btn-ghost {
  background: transparent;
  border-color: var(--border);
}

.btn-ghost:hover {
  background: var(--panel);
  border-color: #05EE88;
  box-shadow: 0 0 12px rgba(5,238,136,0.3);
}

.btn-danger {
  background: #dc2626;
  border-color: #dc2626;
  color: white;
}

.btn-danger:hover {
  background: #b91c1c;
  border-color: #b91c1c;
}

.btn-sm {
  padding: 4px 8px;
  font-size: 12px;
}

.error-message {
  color: #dc2626;
  font-size: 14px;
  margin-top: 8px;
  padding: 8px;
  background: rgba(220, 38, 38, 0.1);
  border: 1px solid rgba(220, 38, 38, 0.2);
  border-radius: 6px;
}

.track-preview {
  margin-top: 12px;
}

.track-preview-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 8px;
}

.track-preview-image {
  width: 80px;
  height: 45px;
  object-fit: cover;
  border-radius: 4px;
}

.track-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.events-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.event-card {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 20px;
  transition: all 0.2s ease;
}

.event-card:hover {
  border-color: #05EE88;
  box-shadow: 0 4px 16px rgba(5,238,136,0.1);
}

.event-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.event-header h3 {
  margin: 0;
  color: var(--accent);
}

.event-status {
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
}

.event-status.upcoming {
  background: rgba(34, 197, 94, 0.1);
  color: #22c55e;
  border: 1px solid rgba(34, 197, 94, 0.2);
}

.event-track {
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}

.event-info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 8px;
  margin-bottom: 16px;
}

.event-info-grid > div {
  font-size: 14px;
}

.event-registrations {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
  padding: 12px;
  background: var(--panel);
  border-radius: 8px;
}

.register-btn {
  background: linear-gradient(135deg, #22c55e, #16a34a);
  border-color: #22c55e;
  color: white;
}

.register-btn:hover {
  background: linear-gradient(135deg, #16a34a, #15803d);
}

.event-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.no-events {
  text-align: center;
  padding: 40px;
  color: var(--muted);
  font-style: italic;
}

.notification {
  position: fixed;
  top: 100px;
  right: 20px;
  padding: 12px 16px;
  border-radius: 8px;
  color: white;
  font-weight: 600;
  z-index: 1000;
  animation: slideIn 0.3s ease;
}

.notification-success {
  background: #22c55e;
}

.notification-error {
  background: #dc2626;
}

.notification-warning {
  background: #f59e0b;
}

@keyframes slideIn {
  from { transform: translateX(100%); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}

/* Events Overview on Home Page */
.events-overview {
  margin: 32px 0;
  padding: 24px;
  background: linear-gradient(180deg, rgba(10,10,10,0.05), rgba(17,17,19,0.08));
  backdrop-filter: blur(16px);
  border: 1px solid rgba(5,238,136,0.15);
  border-radius: 16px;
}

.events-overview h2 {
  margin: 0 0 24px 0;
  color: #10b981;
}

.events-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

/* Admin Controls on Event Cards */
.event-overview-card.admin-mode {
  position: relative;
}

.event-admin-controls {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 10;
  display: flex;
  gap: 4px;
}

.btn-admin-edit,
.btn-admin-delete {
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s ease;
  backdrop-filter: blur(4px);
}

.btn-admin-edit {
  background: rgba(59, 130, 246, 0.8);
  color: white;
}

.btn-admin-edit:hover {
  background: rgba(59, 130, 246, 1);
  transform: scale(1.1);
}

.btn-admin-delete {
  background: rgba(239, 68, 68, 0.8);
  color: white;
}

.btn-admin-delete:hover {
  background: rgba(239, 68, 68, 1);
  transform: scale(1.1);
}

/* Twitch Integration in Event Cards */
.twitch-integration {
  margin: 16px 0;
  padding: 12px;
  border-radius: 8px;
  border: 1px solid rgba(39, 39, 42, 0.6);
  background: transparent;
}
.twitch-integration.online {
  background: transparent;
  border-color: rgba(39, 39, 42, 0.6);
}
.twitch-integration.offline {
  background: transparent;
  border-color: rgba(39, 39, 42, 0.6);
}

.twitch-status-bar{height:36px;border-radius:10px;margin:10px 0 10px 0;background:#3f3f46;border:1px solid rgba(0,0,0,0.25);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:14px;letter-spacing:.2px;box-shadow:0 4px 12px rgba(0,0,0,0.25)}
.twitch-status-bar.online{background:linear-gradient(90deg,rgba(145,70,255,0.35),rgba(119,44,232,0.35))}
.twitch-status-bar.offline{background:rgba(31,41,55,0.45)}

.twitch-content {
  display: flex;
  align-items: center;
  gap: 12px;
}
.twitch-badge-mini{font-size:11px;font-weight:700;letter-spacing:.2px;padding:2px 6px;border-radius:999px;border:1px solid rgba(145,70,255,0.45);background:rgba(145,70,255,0.15);color:#e9d5ff}
.status-dot{width:12px;height:12px;border-radius:50%;display:inline-block;flex:0 0 12px}
.twitch-integration.online .status-dot{background:#05EE88;box-shadow:0 0 0 3px rgba(5,238,136,0.25)}
.twitch-integration.offline .status-dot{background:#ef4444}

.twitch-logo {
  width: 40px;
  height: 40px;
  object-fit: contain;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.1);
  padding: 4px;
}

.twitch-link {
  flex: 1;
}

.twitch-link strong { color:#fff; font-size:13px; font-weight:700; letter-spacing:.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:inline-block; max-width:100% }

.twitch-offline-hint{display:none;margin-top:2px;color:#c084fc;opacity:.9}
.twitch-offline-hint svg{fill:#c084fc;display:block;width:20px;height:20px;filter:drop-shadow(0 0 6px rgba(192,132,252,0.3))}
.twitch-name{display:flex;flex-direction:column;align-items:center;justify-content:center}
.twitch-name .twitch-live-label{line-height:1}
.twitch-name .twitch-offline-hint{margin-top:4px}
.twitch-integration.offline .twitch-offline-hint{display:inline-block}

.twitch-url {
  color: #ffffff;
  text-decoration: none;
  font-weight: 600;
  font-size: 13px;
  display: inline-block;
  margin-top: 2px;
  transition: all 0.2s ease;
}

.twitch-url:hover {
  color: #b794ff;
  text-decoration: underline;
}

@media (max-width: 1200px) {
  .events-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .events-grid {
    grid-template-columns: 1fr;
  }
}

.event-overview-card {
  background: linear-gradient(180deg, rgba(10, 10, 10, 0.05), rgba(17, 17, 19, 0.08));
  border: 1px solid rgba(5, 238, 136, 0.15);
  border-radius: 16px;
  overflow: hidden;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
  backdrop-filter: blur(16px);
}

.event-overview-card:hover {
  border-color: rgba(5, 238, 136, 0.6);
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(5, 238, 136, 0.3), 0 10px 24px rgba(0, 0, 0, 0.35);
}

.event-image {
  position: relative;
  height: 200px;
  overflow: hidden;
}

.event-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.event-countdown {
  position: absolute;
  top: 12px;
  right: 12px;
  background: linear-gradient(135deg, rgba(0,0,0,0.8), rgba(0,0,0,0.6));
  backdrop-filter: blur(8px);
  border: 1px solid rgba(5,238,136,0.3);
  color: #05EE88;
  padding: 6px 12px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 14px;
}

.event-content {
  padding: 20px;
  background: linear-gradient(180deg, rgba(10,10,10,0.04), rgba(17,17,19,0.06));
  backdrop-filter: blur(12px);
}

.event-content h3 {
  margin: 0 0 12px 0;
  color: #10b981;
  font-size: 20px;
}

.event-track-info {
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(5,238,136,0.12);
}

.event-track-info strong {
  color: #10b981;
}

.event-meta {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-bottom: 16px;
  background: linear-gradient(180deg, rgba(12,12,14,0.55), rgba(12,12,14,0.35));
  border: 1px solid rgba(255,255,255,0.08);
  padding: 16px;
  border-radius: 12px;
  min-height: auto;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.03), 0 6px 22px rgba(0,0,0,0.25);
  backdrop-filter: blur(8px);
}
.meta-item{display:flex;align-items:center;gap:10px}
.mi-ico{font-size:17px;line-height:1}
.mi-text{display:flex;flex-direction:column;gap:2px}
.mi-label{font-size:11px;color:#cbd5e1;opacity:.9}
.mi-value{font-size:15px;color:#e5e7eb;font-weight:600;white-space:normal;overflow:visible;text-overflow:unset;word-wrap:break-word}
/* Einspaltig auf allen Größen für vollständige Zeilen */

.event-sessions {
  display: flex;
  gap: 8px;
  margin-bottom: 16px;
}

.session-badge {
  background: rgba(5,238,136,0.05);
  border: 1px solid rgba(5,238,136,0.15);
  padding: 4px 8px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
}

.event-register-btn {
  width: 100%;
  padding: 12px;
  background: linear-gradient(135deg, #22c55e, #16a34a);
  border: 1px solid #22c55e;
  border-radius: 8px;
  color: white;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
}

.event-register-btn:hover {
  background: linear-gradient(135deg, #16a34a, #15803d);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(34,197,94,0.25);
}

.event-registrations-list {
  margin-bottom: 16px;
  padding: 12px;
  background: rgba(5,238,136,0.05);
  border: 1px solid rgba(5,238,136,0.15);
  border-radius: 8px;
  backdrop-filter: blur(10px);
}

.registered-drivers {
  font-size: 14px;
  color: #22c55e;
  font-weight: 500;
}

.server-password {
  margin-bottom: 16px;
  padding: 12px;
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.15), rgba(34, 197, 94, 0.08));
  backdrop-filter: blur(10px);
  border: 1px solid rgba(34, 197, 94, 0.3);
  border-radius: 12px;
}

.server-password code {
  background: linear-gradient(135deg, rgba(0,0,0,0.4), rgba(0,0,0,0.2));
  backdrop-filter: blur(4px);
  padding: 4px 8px;
  border-radius: 6px;
  font-family: monospace;
  color: #22c55e;
  font-weight: 600;
  border: 1px solid rgba(255,255,255,0.1);
}

.password-pending {
  margin-bottom: 16px;
  padding: 12px;
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.15), rgba(245, 158, 11, 0.08));
  backdrop-filter: blur(10px);
  border: 1px solid rgba(245, 158, 11, 0.3);
  border-radius: 12px;
}

.password-pending .muted {
  color: #f59e0b;
  font-weight: 500;
}

@media (max-width: 1100px){
  .sessions-split{grid-template-columns:1fr}
  .sessions-right{position:static}
  .sessions-left .mini-tracks{grid-template-columns:repeat(3,minmax(160px,1fr))}
}
@media (max-width: 768px){
  .sessions-left .mini-tracks{grid-template-columns:repeat(2,minmax(160px,1fr))}
}

/* Inline-Details unter Karten */
.mini-tracks .mini-wrap{display:grid;gap:8px}
.mini-details{display:none;padding:12px;border:1px solid rgba(5,238,136,0.15);border-radius:12px;background:linear-gradient(180deg,rgba(10,10,10,0.05),rgba(17,17,19,0.08));backdrop-filter:blur(12px)}
.mini-wrap.expanded{grid-column:auto}
.mini-wrap.expanded .mini-details{display:none}
.race-details{min-height:120px}
.race-details .mini-details{display:block;padding:12px;border:1px solid rgba(5,238,136,0.15);border-radius:12px;background:linear-gradient(180deg,rgba(10,10,10,0.05),rgba(17,17,19,0.08));backdrop-filter:blur(12px)}
.race-details .mini-details table{table-layout:fixed}
.race-details .mini-details th{white-space:nowrap}
.race-details .mini-details th,
.race-details .mini-details td{ text-align:center }
.race-details .mini-details th:nth-child(1){width:60px}
.race-details .mini-details th:nth-child(2){width:260px}
.race-details .mini-details th:nth-child(3){width:200px}
.race-details .mini-details th:nth-child(4){width:520px}
.race-details .mini-details th:nth-child(5){width:120px}
.race-details .mini-details th:nth-child(6){width:120px}
.race-details .mini-details th:nth-child(7){width:120px}
.race-details .mini-details th:nth-child(8){width:130px}
.race-details .mini-details th:nth-child(9){width:120px}
.race-details .mini-details th:nth-child(10){width:320px}
.race-details .mini-details th:nth-child(11){width:240px}
.race-details .mini-details th:nth-child(12){width:140px}
.race-details .mini-details td:nth-child(11){white-space:nowrap}
.race-details .mini-details td:nth-child(10) .rating-row{justify-content:center}
.race-details .detail-banner{width:100%;height:160px;object-fit:cover;border-radius:10px;border:1px solid rgba(5,238,136,0.15);margin-bottom:10px;background:rgba(10,10,10,0.08)}
.mini-details table{width:100%;border-collapse:collapse}
.mini-details th,.mini-details td{padding:6px 8px;border-bottom:1px solid var(--border);text-align:left}
.mini-details th{color:#bbb;font-size:.8rem;text-transform:uppercase}

@media (max-width: 1200px){
  .mini-tracks{grid-template-columns:repeat(3,minmax(200px,1fr))}
}
@media (max-width: 768px){
  .mini-tracks{grid-template-columns:repeat(2,minmax(160px,1fr))}
}

/* Overlay Vorschau */
.preview-overlay{position:fixed;inset:0;z-index:50}
.preview-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(2px)}
.preview-modal{position:absolute;inset:auto 0 0 0;margin:auto;max-width:860px;background:linear-gradient(180deg,#0a0a0a,#111113);border:1px solid var(--border);border-radius:16px;padding:16px;transform:translateY(16px);box-shadow:0 20px 60px rgba(0,0,0,.5)}
.preview-close{position:absolute;top:8px;right:10px;background:transparent;border:1px solid var(--border);color:#e5e7eb;border-radius:999px;width:28px;height:28px;cursor:pointer}
.preview-close:hover{border-color:#05EE88;box-shadow:0 0 0 2px rgba(5,238,136,.25)}
.preview-content{display:grid;gap:8px}

/* Breitere Tabelle in der Übersicht-Ansicht auf Session-Seite */
body[data-page="session"] #view-overview .results-table{table-layout:fixed}
body[data-page="session"] #view-overview .results-table th{white-space:nowrap}
body[data-page="session"] #view-overview .results-table th,
body[data-page="session"] #view-overview .results-table td{ text-align:center }
body[data-page="session"] #view-overview .results-table th:nth-child(1){width:220px}
body[data-page="session"] #view-overview .results-table th:nth-child(2){width:260px}
body[data-page="session"] #view-overview .results-table th:nth-child(3){width:520px}
body[data-page="session"] #view-overview .results-table th:nth-child(4){width:140px}
body[data-page="session"] #view-overview .results-table th:nth-child(5){width:320px}
/* Eventzelle (Spalte 3) Flex-Inhalt mittig ausrichten */
body[data-page="session"] #view-overview .results-table td:nth-child(3) > div{ justify-content:center }

/* Detailliert-Ansicht Tabellen-Layout und Zentrierung */
body[data-page="session"] #view-detailed .detailed-results table{ table-layout:fixed }
body[data-page="session"] #view-detailed .detailed-results th{ white-space:nowrap }
body[data-page="session"] #view-detailed .detailed-results th,
body[data-page="session"] #view-detailed .detailed-results td{ text-align:center }
body[data-page="session"] #view-detailed .detailed-results th:nth-child(1){ width:70px }
body[data-page="session"] #view-detailed .detailed-results th:nth-child(2){ width:260px }
body[data-page="session"] #view-detailed .detailed-results th:nth-child(3){ width:140px }
body[data-page="session"] #view-detailed .detailed-results th:nth-child(4){ width:120px }
body[data-page="session"] #view-detailed .detailed-results th:nth-child(5){ width:120px }
body[data-page="session"] #view-detailed .detailed-results th:nth-child(6){ width:120px }
body[data-page="session"] #view-detailed .detailed-results th:nth-child(7){ width:120px }

/* HIVEPACE RÄNGE (ELO) – DE Bezeichnungen */
/* Zelle (1000-1399) */
.elo-zelle, .elo-mini.elo-zelle, .elo-badge.elo-zelle { background:#374151 !important; color:#9ca3af !important; border:1px solid #4b5563 !important }
/* Wabe (1400-1699) */
.elo-wabe, .elo-mini.elo-wabe, .elo-badge.elo-wabe { background:#065f46 !important; color:#10b981 !important; border:1px solid #047857 !important }
/* Sammler (1700-1999) */
.elo-sammler, .elo-mini.elo-sammler, .elo-badge.elo-sammler { background:linear-gradient(135deg,#cd7f32,#b8860b) !important; color:#fff !important; border:1px solid #b8860b !important }
/* Wächter (2000-2299) */
.elo-waechter, .elo-mini.elo-waechter, .elo-badge.elo-waechter { background:linear-gradient(135deg,#c0c0c0,#a8a8a8) !important; color:#000 !important; border:1px solid #a8a8a8 !important }
/* Krone (2300-2599) */
.elo-krone, .elo-mini.elo-krone, .elo-badge.elo-krone { background:linear-gradient(135deg,#ffd700,#ffb347) !important; color:#000 !important; border:1px solid #ffb347 !important }
/* Regent (2600-2999) */
.elo-regent, .elo-mini.elo-regent, .elo-badge.elo-regent { background:linear-gradient(135deg,#9333ea,#7c3aed) !important; color:#fff !important; border:1px solid #7c3aed !important }
/* Souverän (3000-3499) */
.elo-souveraen, .elo-mini.elo-souveraen, .elo-badge.elo-souveraen { background:linear-gradient(135deg,#dc2626,#b91c1c) !important; color:#fff !important; border:1px solid #b91c1c !important }
/* Mythos (3500+) */
.elo-mythos, .elo-mini.elo-mythos, .elo-badge.elo-mythos { background:linear-gradient(135deg,#0ea5e9,#0284c7) !important; color:#fff !important; border:1px solid #0284c7 !important }

/* BLACK HORNET RACING - SAFETY RATING "HIVE SYSTEM" */
/* Safety-Bereich: 0-100, Startwert: 85.00 */

/* Safety Queen (90-100) - Exzellent */
.sr-queen, .sr-mini.sr-queen, .sr-badge.sr-queen {
  background-color: #8B5CF6 !important;
  color: #FFFFFF !important;
  border: 2px solid #7C3AED !important;
}
.sr-queen:hover {
  background-color: #7C3AED !important;
}
.sr-queen:active {
  background-color: #6D28D9 !important;
}

/* Safety Hive (75-89.99) - Gut */
.sr-hive, .sr-mini.sr-hive, .sr-badge.sr-hive {
  background-color: #10B981 !important;
  color: #FFFFFF !important;
  border: 2px solid #059669 !important;
}
.sr-hive:hover {
  background-color: #059669 !important;
}
.sr-hive:active {
  background-color: #047857 !important;
}

/* Safety Swarm (60-74.99) - Durchschnittlich */
.sr-swarm, .sr-mini.sr-swarm, .sr-badge.sr-swarm {
  background-color: #F59E0B !important;
  color: #FFFFFF !important;
  border: 2px solid #D97706 !important;
}
.sr-swarm:hover {
  background-color: #D97706 !important;
}
.sr-swarm:active {
  background-color: #B45309 !important;
}

/* Safety Sting (<60) - Unsauber */
.sr-sting, .sr-mini.sr-sting, .sr-badge.sr-sting {
  background-color: #DC2626 !important;
  color: #FFFFFF !important;
  border: 2px solid #991B1B !important;
}
.sr-sting:hover {
  background-color: #B91C1C !important;
}
.sr-sting:active {
  background-color: #991B1B !important;
}

body[data-page="sessions"] .results-table{ table-layout:fixed }
body[data-page="sessions"] .results-table th,
body[data-page="sessions"] .results-table td{ text-align:center; vertical-align:middle }
body[data-page="sessions"] .results-table td.rating-cell{ display:flex; justify-content:center; align-items:center }
body[data-page="sessions"] .results-table td .consistency-cell{ display:inline-block; min-width:56px; text-align:center }
body[data-page="sessions"] .results-table td.event-cell .event-link{ display:flex; justify-content:center; align-items:center }
body[data-page="sessions"] .results-table td .lap-time{ text-align:center }
body[data-page="driver"] .stat-grid .card{ text-align:center }