:root{--bg: #f4f5f7;--surface: #ffffff;--surface-2: #eef0f3;--border: #dde1e7;--border-soft: #e7eaef;--text: #171c24;--text-2: #5a6473;--text-3: #8b93a1;--green: #1e8f47;--yellow: #a87b0a;--red: #c43c3c;--accent: #1d8489;--accent-soft: rgba(29, 132, 137, .1)}[data-theme=dark]{--bg: #051020;--surface: #0b1a30;--surface-2: #122340;--border: #1d3253;--border-soft: #142743;--text: #eef3fa;--text-2: #a3b2ca;--text-3: #6d81a0;--green: #46b96c;--yellow: #d9a521;--red: #e05a5a;--accent: #6f92d8;--accent-soft: rgba(111, 146, 216, .14)}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg);color:var(--text);font-family:Segoe UI,-apple-system,Helvetica Neue,Arial,sans-serif;font-size:16px;-webkit-font-smoothing:antialiased}#root{min-height:100dvh;display:flex;flex-direction:column}.app-frame{width:100%;max-width:480px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;background:var(--bg)}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:14px 16px 12px;background:var(--bg);border-bottom:1px solid var(--border-soft)}.brand{font-weight:800;letter-spacing:.13em;font-size:17px}.brand small{display:block;font-weight:500;letter-spacing:.02em;font-size:10.5px;color:var(--text-3);margin-top:1px}.beta-chip{font-size:10px;font-weight:700;letter-spacing:.08em;color:var(--accent);background:var(--accent-soft);border:1px solid var(--accent);border-radius:999px;padding:3px 9px}.content{flex:1;padding:14px 16px 84px}.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:12px}.card-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-3);margin-bottom:10px}.card--accent{border-left:3px solid var(--accent)}.card--muted{border-left:3px solid var(--text-3)}h1.page-title{font-size:21px;font-weight:750;margin:6px 0 2px}.page-sub{font-size:13px;color:var(--text-2);margin-bottom:14px}p.body-text{font-size:13.5px;line-height:1.6;color:var(--text-2)}p.body-text+p.body-text{margin-top:8px}.text-strong{color:var(--text);font-weight:600}.badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.03em;border-radius:999px;padding:4px 10px;border:1px solid transparent}.badge .dot{width:7px;height:7px;border-radius:50%}.badge--hoch{color:var(--green);border-color:var(--green);background:transparent}.badge--mittel{color:var(--accent);background:var(--accent-soft)}.badge--niedrig{color:var(--yellow);background:color-mix(in srgb,var(--yellow) 10%,transparent)}.badge--beobachtung{color:var(--text-3);background:var(--surface-2)}.badge--keine{color:var(--text-3);border:1px dashed var(--border);background:transparent}.pill{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;background:var(--surface-2);border-radius:999px;padding:5px 11px;color:var(--text-2)}.pill .dot{width:8px;height:8px;border-radius:50%}.dot--green{background:var(--green)}.dot--yellow{background:var(--yellow)}.dot--red{background:var(--red)}.dot--neutral{background:var(--text-3)}.seg{display:flex;background:var(--surface-2);border-radius:12px;padding:3px;margin-bottom:12px}.seg button{flex:1;border:0;background:transparent;border-radius:10px;font:inherit;font-size:13px;font-weight:600;color:var(--text-2);padding:9px 0;cursor:pointer}.seg button.active{background:var(--surface);color:var(--text);box-shadow:0 1px 3px #00000014}.seg button .mini-tag{font-size:8.5px;font-weight:700;letter-spacing:.06em;color:var(--accent);margin-left:5px;vertical-align:2px}.matchday-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.matchday-nav .md-title{font-size:14px;font-weight:700}.matchday-nav .md-title small{display:block;font-weight:500;font-size:11.5px;color:var(--text-3)}.matchday-nav button{border:1px solid var(--border);background:var(--surface);color:var(--text-2);border-radius:10px;width:34px;height:34px;font-size:15px;cursor:pointer}.matchday-nav button:disabled{opacity:.35;cursor:default}.day-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-3);margin:16px 2px 8px}.match-card{display:block;width:100%;text-align:left;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:14px 16px;margin-bottom:10px;cursor:pointer;color:inherit;text-decoration:none;font:inherit}.match-card:active{background:var(--surface-2)}.mc-top{display:flex;justify-content:space-between;align-items:center;font-size:11.5px;color:var(--text-3);margin-bottom:8px}.mc-teams{font-size:15.5px;font-weight:700;line-height:1.35}.mc-result{font-variant-numeric:tabular-nums;font-weight:800}.mc-line{font-size:12.5px;line-height:1.5;color:var(--text-2);margin-top:6px}.mc-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:11px;color:var(--text-3)}.mc-cta{color:var(--accent);font-weight:700;font-size:12px}.kern{background:var(--accent-soft);border-left:3px solid var(--accent);border-radius:0 12px 12px 0;padding:12px 14px;font-size:14px;font-weight:600;line-height:1.55;margin-bottom:12px}.odds-row{display:flex;gap:8px;margin:10px 0 8px}.odds-cell{flex:1;text-align:center;background:var(--surface-2);border-radius:12px;padding:9px 0}.odds-cell .oc-label{font-size:10.5px;color:var(--text-3);font-weight:600}.odds-cell .oc-val{font-size:15px;font-weight:750;font-variant-numeric:tabular-nums;margin-top:2px}.odds-note{font-size:11px;color:var(--text-3)}.these-toggle{display:flex;width:100%;align-items:center;justify-content:space-between;background:transparent;border:0;font:inherit;cursor:pointer;color:var(--text);padding:0}.these-title{font-size:13.5px;font-weight:750}.these-badge{font-size:10px;font-weight:700;letter-spacing:.06em;border-radius:999px;padding:3px 8px}.these-badge--a{color:var(--accent);background:var(--accent-soft)}.these-badge--b{color:var(--text-2);background:var(--surface-2)}.these-body{margin-top:10px}.flip-hinweis{background:color-mix(in srgb,var(--yellow) 8%,transparent);border:1px solid color-mix(in srgb,var(--yellow) 35%,transparent);border-radius:12px;padding:10px 12px;font-size:12px;line-height:1.5;color:var(--text-2);margin-top:10px}.signal-grid{display:flex;gap:8px}.signal-cell{flex:1;background:var(--surface-2);border-radius:12px;padding:10px;text-align:center}.signal-cell .sc-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--text-3)}.signal-cell .sc-val{display:flex;align-items:center;justify-content:center;gap:6px;font-size:12px;font-weight:700;margin-top:5px}.tendenz-box{margin-top:12px;padding-top:12px;border-top:1px solid var(--border-soft);font-size:13px;line-height:1.6}.kv-row{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--border-soft);font-size:12.5px}.kv-row:last-child{border-bottom:0}.kv-row .k{color:var(--text-3)}.kv-row .v{font-weight:600;font-variant-numeric:tabular-nums;text-align:right}.check-chip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;border-radius:999px;padding:5px 11px;margin:0 6px 6px 0}.check-chip--ok{color:var(--green);background:color-mix(in srgb,var(--green) 9%,transparent)}.check-chip--warn{color:var(--yellow);background:color-mix(in srgb,var(--yellow) 10%,transparent)}.stand-note{font-size:11px;color:var(--text-3);margin-top:8px}.disclaimer{font-size:11px;line-height:1.55;color:var(--text-3);padding:12px 2px 0}.verdict-stamp{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:750;border-radius:999px;padding:5px 12px}.verdict-stamp--bestaetigt{color:var(--green);background:color-mix(in srgb,var(--green) 10%,transparent)}.verdict-stamp--teils{color:var(--yellow);background:color-mix(in srgb,var(--yellow) 11%,transparent)}.verdict-stamp--daneben{color:var(--red);background:color-mix(in srgb,var(--red) 9%,transparent)}.learning{background:var(--surface-2);border-radius:12px;padding:11px 13px;font-size:12.5px;line-height:1.55;color:var(--text-2);margin-top:10px}.learning strong{color:var(--text)}.match-hero{background:linear-gradient(160deg,var(--surface) 0%,var(--surface-2) 100%);border:1px solid var(--border);border-radius:18px;padding:18px 16px 14px;margin:10px 0 16px;text-align:center}.mh-meta{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}.mh-teams{font-size:20px;font-weight:800;line-height:1.3;margin:8px 0 2px}.mh-vs{color:var(--text-3);font-weight:500;font-size:13px}.mh-sub{font-size:12px;color:var(--text-2);margin-top:4px}.mh-badges{display:flex;justify-content:center;gap:8px;margin-top:12px;flex-wrap:wrap}.mh-result{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums;margin-top:6px}.these-seg{display:flex;background:var(--surface-2);border-radius:12px;padding:3px;margin-bottom:12px}.these-seg button{flex:1;border:0;background:transparent;border-radius:10px;font:inherit;font-size:12.5px;font-weight:700;color:var(--text-2);padding:9px 4px;cursor:pointer;transition:all .15s ease}.these-seg button.active-a{background:var(--accent);color:#fff}.these-seg button.active-b{background:var(--surface);color:var(--text);box-shadow:0 1px 3px #00000026}.these-panel{animation:fadeIn .18s ease}@keyframes fadeIn{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}.section-gap{height:6px}.bar-row{padding:8px 0 4px;border-bottom:1px solid var(--border-soft)}.bar-row:last-child{border-bottom:0}.bar-row .br-head{display:flex;justify-content:space-between;font-size:12px;margin-bottom:5px}.bar-row .br-label{color:var(--text-3);font-weight:600}.bar-row .br-vals{font-weight:700;font-variant-numeric:tabular-nums}.bar-pair{display:flex;gap:4px;align-items:center}.bar-track{flex:1;height:7px;border-radius:4px;background:var(--surface-2);position:relative;overflow:hidden}.bar-fill{position:absolute;top:0;bottom:0;border-radius:4px}.bar-track--home .bar-fill{right:0;background:var(--accent)}.bar-track--away .bar-fill{left:0;background:var(--text-3)}.einschaetzung{background:linear-gradient(135deg,var(--accent-soft),transparent 70%);border:1px solid var(--accent);border-radius:16px;padding:16px;margin-bottom:12px}.einschaetzung .es-line{font-size:13.5px;line-height:1.6}.ergebnisbild-chip{display:inline-block;margin-top:10px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:9px 14px;font-size:14px;font-weight:750}.stat-grid{display:flex;gap:8px;margin-top:10px}.stat-tile{flex:1;background:var(--surface-2);border-radius:12px;padding:10px 6px;text-align:center}.stat-tile .st-val{font-size:19px;font-weight:800;font-variant-numeric:tabular-nums}.stat-tile .st-label{font-size:9.5px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--text-3);margin-top:3px}.st-val--green{color:var(--green)}.st-val--yellow{color:var(--yellow)}.st-val--red{color:var(--red)}.review-card{border-left:3px solid var(--border)}.review-card--bestaetigt{border-left-color:var(--green)}.review-card--teils{border-left-color:var(--yellow)}.review-card--daneben{border-left-color:var(--red)}.result-box{min-width:52px;text-align:center;background:var(--surface-2);border-radius:12px;padding:8px 6px;flex-shrink:0}.result-box .rb-score{font-size:17px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.1}.result-box .rb-label{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-3);margin-top:2px}.login-wrap{flex:1;display:flex;flex-direction:column;justify-content:center;padding:24px 22px 40px;max-width:480px;margin:0 auto;width:100%}.login-logo{text-align:center;margin-bottom:26px}.field{margin-bottom:12px}.field label{display:block;font-size:12px;font-weight:600;color:var(--text-2);margin-bottom:5px}.field input{width:100%;font:inherit;font-size:15px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:12px;padding:12px 14px}.field input:focus{outline:2px solid var(--accent);border-color:transparent}.field textarea,.ed-select{width:100%;font:inherit;font-size:14px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:12px;padding:11px 13px;resize:vertical}.field textarea:focus,.ed-select:focus{outline:2px solid var(--accent);border-color:transparent}.btn-primary{width:100%;border:0;border-radius:12px;padding:14px;background:var(--accent);color:#fff;font:inherit;font-size:15px;font-weight:700;cursor:pointer;margin-top:6px}.btn-primary:disabled{opacity:.55}.btn-ghost{width:100%;background:transparent;border:0;color:var(--accent);font:inherit;font-size:13px;font-weight:600;padding:12px;cursor:pointer}.form-error{background:color-mix(in srgb,var(--red) 8%,transparent);border:1px solid color-mix(in srgb,var(--red) 30%,transparent);color:var(--red);border-radius:12px;padding:10px 13px;font-size:12.5px;margin-bottom:12px}.form-info{background:var(--accent-soft);color:var(--accent);border-radius:12px;padding:10px 13px;font-size:12.5px;margin-bottom:12px}.login-legal{text-align:center;font-size:11px;color:var(--text-3);margin-top:18px;line-height:1.5}.tabbar{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;z-index:30;display:flex;background:var(--surface);border-top:1px solid var(--border);padding-bottom:env(safe-area-inset-bottom)}.tabbar a{flex:1;text-align:center;padding:9px 0 7px;text-decoration:none;color:var(--text-3);font-size:10.5px;font-weight:600}.tabbar a .t-icon{display:block;font-size:19px;line-height:1.2}.tabbar a.active{color:var(--accent)}.skeleton{border-radius:16px;margin-bottom:10px;background:linear-gradient(90deg,var(--surface-2) 25%,var(--border-soft) 50%,var(--surface-2) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite}@keyframes shimmer{to{background-position:-200% 0}}.empty-state{text-align:center;padding:44px 24px;color:var(--text-2);font-size:13.5px;line-height:1.6}.empty-state .es-icon{font-size:30px;margin-bottom:10px}.offline-banner{background:color-mix(in srgb,var(--yellow) 12%,transparent);color:var(--yellow);font-size:12px;font-weight:600;text-align:center;padding:8px}.menu-item{display:flex;width:100%;justify-content:space-between;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:15px 16px;margin-bottom:9px;font:inherit;font-size:14px;font-weight:600;color:var(--text);cursor:pointer;text-decoration:none}.menu-item .chev{color:var(--text-3)}.version-note{text-align:center;font-size:11px;color:var(--text-3);margin-top:18px}
