:root{--primary:#1d9053;--primary-dark:#0d6b3a;--primary-darker:#064d28;--primary-light:#2db86e;--primary-bg:#e8f5ed;--primary-bg-subtle:#f2faf5;--surface:#fff;--bg:#f0f4f1;--text:#1a2b23;--text-secondary:#5a6b63;--text-muted:#8a9b93;--border:#d0ddd6;--border-light:#e5ede9;--gold:#d4a843;--gold-bg:#fff8e7;--silver:#7b8ec8;--silver-bg:#eef1fa;--bronze:#cd7f32;--bronze-bg:#fdf3e7;--danger:#dc3545;--danger-bg:#fde8ea;--joker:#e8a020;--joker-bg:#fff4db;--radius:12px;--radius-sm:8px;--radius-xs:6px;--shadow:0 1px 3px #00000014, 0 1px 2px #0000000f;--shadow-md:0 4px 6px #00000012, 0 2px 4px #0000000f;--shadow-lg:0 10px 25px #00000014, 0 4px 10px #0000000d;color:var(--text);background:var(--bg);font-family:Inter,system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;min-height:100dvh}#root{flex-direction:column;min-height:100dvh;display:flex}.header{color:#fff;justify-content:center;align-items:flex-end;min-height:340px;padding:3rem 1rem 2rem;display:flex;position:relative;overflow:hidden}.header-bg{object-fit:cover;object-position:center 20%;width:100%;height:100%;position:absolute;inset:0}.header-overlay{background:linear-gradient(#064d2833 0%,#064d28a6 100%);position:absolute;inset:0}.header-content{z-index:1;flex-direction:column;align-items:center;gap:.5rem;max-width:960px;margin:0 auto;display:flex;position:relative}.header h1{letter-spacing:-.5px;text-transform:uppercase;font-size:1.75rem;font-weight:800}.header-subtitle{opacity:.85;font-size:.9rem;font-weight:500}.header-matchday{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff26;border-radius:100px;align-items:center;gap:.5rem;margin-top:.25rem;padding:.35rem 1rem;font-size:.8rem;font-weight:600;display:inline-flex}.user-bar{background:var(--surface);border-bottom:1px solid var(--border-light);z-index:100;box-shadow:var(--shadow);padding:.75rem 1rem;position:sticky;top:0}.user-bar-inner{flex-wrap:wrap;align-items:center;gap:.5rem;max-width:960px;margin:0 auto;display:flex}.user-bar select{border:2px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);min-width:120px;color:var(--text);cursor:pointer;flex:1;padding:.5rem .75rem;font-family:inherit;font-size:.9rem;font-weight:600;transition:border-color .2s}.user-bar select:focus{border-color:var(--primary);outline:none}.user-bar-actions{align-items:center;gap:.5rem;display:flex}.btn{border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;border:none;justify-content:center;align-items:center;gap:.4rem;padding:.5rem 1rem;font-family:inherit;font-size:.85rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark)}.btn-secondary{background:var(--primary-bg);color:var(--primary-dark)}.btn-secondary:hover{background:var(--primary);color:#fff}.btn-danger{background:var(--danger-bg);color:var(--danger)}.btn-danger:hover{background:var(--danger);color:#fff}.btn-sm{padding:.35rem .65rem;font-size:.8rem}.btn-icon{border-radius:var(--radius-xs);width:36px;height:36px;padding:0}.btn-publish{background:var(--gold-bg);color:var(--gold);border:2px solid var(--gold)}.btn-publish:hover{background:var(--gold);color:#fff}.btn-publish.published{background:var(--primary);color:#fff;border-color:var(--primary);cursor:default}.tabs{width:100%;max-width:960px;margin:0 auto;padding:1rem 1rem 0}.tab-list{background:var(--border-light);border-radius:var(--radius-sm);gap:.25rem;padding:3px;display:flex}.tab-btn{border-radius:var(--radius-xs);cursor:pointer;color:var(--text-secondary);background:0 0;border:none;flex:1;padding:.5rem .75rem;font-family:inherit;font-size:.85rem;font-weight:600;transition:all .2s}.tab-btn.active{background:var(--surface);color:var(--primary-dark);box-shadow:var(--shadow)}.main{flex:1;width:100%;max-width:960px;margin:0 auto;padding:1rem}.legend{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:1rem;padding:1rem}.legend-title{color:var(--text);align-items:center;gap:.5rem;margin-bottom:.75rem;font-size:.85rem;font-weight:700;display:flex}.legend-items{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.5rem;display:grid}.legend-item{border-radius:var(--radius-xs);align-items:center;gap:.5rem;padding:.5rem .6rem;font-size:.8rem;display:flex}.legend-item.exact{background:var(--gold-bg)}.legend-item.diff{background:var(--silver-bg)}.legend-item.tendency{background:var(--bronze-bg)}.legend-item.wrong{background:var(--bg)}.legend-item.joker{background:var(--joker-bg)}.legend-badge{border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;min-width:28px;height:28px;font-size:.85rem;font-weight:800;display:inline-flex}.legend-badge.exact{background:var(--gold);color:#fff}.legend-badge.diff{background:var(--silver);color:#fff}.legend-badge.tendency{background:var(--bronze);color:#fff}.legend-badge.wrong{background:var(--text-muted);color:#fff}.legend-badge.joker{background:var(--joker);color:#fff}.legend-item.anti-werder{background:var(--danger-bg)}.legend-badge.anti-werder{background:var(--danger);color:#fff}.match-card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:.5rem;padding:1rem;transition:box-shadow .2s;position:relative}.match-card:hover{box-shadow:var(--shadow-md)}.match-card.has-result{border-left:4px solid var(--primary)}.match-card.is-joker{border:2px solid var(--joker);background:var(--joker-bg)}.match-card.locked{opacity:.85}.match-card.anti-werder{border:2px solid var(--danger);background:var(--danger-bg)}.match-time{color:var(--text-muted);align-items:center;gap:.5rem;margin-bottom:.5rem;font-size:.75rem;font-weight:600;display:flex}.match-row{align-items:center;gap:.5rem;display:flex}.match-team{flex:1;align-items:center;gap:.5rem;min-width:0;display:flex}.match-team.away{text-align:right;flex-direction:row-reverse}.team-logo{object-fit:contain;background:var(--bg);border-radius:50%;flex-shrink:0;width:36px;height:36px;padding:2px}.team-logo-fallback{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:.7rem;font-weight:800;display:flex}.team-name{white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;font-weight:600;overflow:hidden}.joker-btn{background:var(--bg);cursor:pointer;width:28px;height:28px;color:var(--text-muted);border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:1rem;transition:all .2s;display:flex}.joker-btn:hover{background:var(--joker-bg);color:var(--joker);transform:scale(1.15)}.joker-btn.active{background:var(--joker);color:#fff;transform:scale(1.1)}.joker-btn:disabled{cursor:default;opacity:.5;transform:none}.joker-label{color:var(--joker);text-transform:uppercase;letter-spacing:.5px;font-size:.65rem;font-weight:700}.score-input-group{flex-shrink:0;align-items:center;gap:.25rem;display:flex}.score-input{text-align:center;border:2px solid var(--border);border-radius:var(--radius-xs);width:40px;height:40px;color:var(--text);background:var(--surface);-moz-appearance:textfield;font-family:inherit;font-size:1.1rem;font-weight:700;transition:border-color .2s}.score-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.score-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.score-input:focus{border-color:var(--primary);background:var(--primary-bg-subtle);outline:none}.score-input.locked{background:var(--bg);color:var(--text-secondary);cursor:default}.score-separator{color:var(--text-muted);padding:0 .15rem;font-size:1rem;font-weight:800}.result-row{border-top:1px solid var(--border-light);justify-content:center;align-items:center;gap:.5rem;margin-top:.5rem;padding-top:.5rem;font-size:.8rem;display:flex}.result-score{color:var(--primary-dark);font-size:.9rem;font-weight:800}.points-badge{border-radius:100px;align-items:center;gap:.25rem;padding:.2rem .5rem;font-size:.75rem;font-weight:700;display:inline-flex}.points-badge.exact{background:var(--gold-bg);color:var(--gold)}.points-badge.diff{background:var(--silver-bg);color:var(--silver)}.points-badge.tendency{background:var(--bronze-bg);color:var(--bronze)}.points-badge.wrong{background:var(--bg);color:var(--text-muted)}.live-dot{background:var(--danger);border-radius:50%;width:8px;height:8px;animation:1.5s ease-in-out infinite pulse;display:inline-block}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.live-label{color:var(--danger);text-transform:uppercase;letter-spacing:.5px;font-size:.7rem;font-weight:700}.dash-leaderboard{margin-bottom:1.25rem}.dash-match{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:.75rem;overflow:hidden}.dash-match-header{background:var(--primary-bg-subtle);border-bottom:1px solid var(--border-light);align-items:center;gap:.5rem;padding:.75rem 1rem;display:flex}.dash-match-teams{flex:1;font-size:.85rem;font-weight:700}.dash-match-score{color:var(--primary-dark);background:var(--surface);border-radius:var(--radius-xs);padding:.2rem .6rem;font-size:1.1rem;font-weight:800}.dash-match-time{color:var(--text-muted);font-size:.75rem;font-weight:600}.dash-user-row{border-bottom:1px solid var(--border-light);align-items:center;padding:.5rem 1rem;font-size:.85rem;display:flex}.dash-user-row:last-child{border-bottom:none}.dash-user-name{flex:1;align-items:center;gap:.35rem;font-weight:600;display:flex}.dash-user-tip{text-align:center;min-width:50px;color:var(--text-secondary);font-weight:700}.dash-user-points{text-align:right;min-width:60px}.dash-hidden{color:var(--text-muted);font-style:italic}.leaderboard{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.leaderboard-header{background:linear-gradient(135deg, var(--primary-darker), var(--primary));color:#fff;align-items:center;gap:.5rem;padding:1rem;font-size:1rem;font-weight:700;display:flex}.leaderboard-empty{text-align:center;color:var(--text-muted);padding:2rem;font-size:.9rem}.lb-row{border-bottom:1px solid var(--border-light);align-items:center;padding:.75rem 1rem;transition:background .15s;display:flex}.lb-row:last-child{border-bottom:none}.lb-row:hover{background:var(--primary-bg-subtle)}.lb-row.first{background:var(--gold-bg)}.lb-rank{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;margin-right:.75rem;font-size:.85rem;font-weight:800;display:flex}.lb-rank.gold{background:var(--gold);color:#fff}.lb-rank.silver{background:var(--silver);color:#fff}.lb-rank.bronze{background:var(--bronze);color:#fff}.lb-rank.default{background:var(--bg);color:var(--text-secondary)}.lb-name{flex:1;font-size:.9rem;font-weight:600}.lb-joker{color:var(--text-muted);font-size:.7rem}.lb-points{color:var(--primary-dark);text-align:right;min-width:36px;font-size:1.1rem;font-weight:800}.save-section{margin-top:1rem;margin-bottom:1rem}.btn-save{background:var(--primary);color:#fff;border-radius:var(--radius);cursor:pointer;width:100%;box-shadow:var(--shadow-md);border:none;padding:.85rem 1rem;font-size:1rem;font-weight:700;transition:all .2s}.btn-save:hover{background:var(--primary-dark)}.btn-save.saved{background:var(--primary-light);pointer-events:none}.joker-reminder{background:var(--joker-bg);border:2px solid var(--joker);border-radius:var(--radius);color:var(--joker);align-items:center;gap:.5rem;margin-bottom:.75rem;padding:.75rem 1rem;font-size:.85rem;font-weight:600;animation:2s ease-in-out infinite joker-pulse;display:flex}.joker-reminder-icon{font-size:1.2rem}@keyframes joker-pulse{0%,to{opacity:1}50%{opacity:.7}}.admin-section{margin-top:1.5rem;padding-top:1rem}.admin-toggle{color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.5rem;padding:.5rem 0;font-size:.8rem;display:flex}.admin-toggle input[type=checkbox]{accent-color:var(--primary)}.admin-match{background:var(--primary-bg-subtle);border-radius:var(--radius-xs);align-items:center;gap:.5rem;margin-bottom:.35rem;padding:.5rem .75rem;font-size:.85rem;display:flex}.admin-match .team-short{min-width:30px;font-weight:600}.admin-match .team-short.home{text-align:right}.admin-match .score-input{border-color:var(--primary);background:#fff;width:36px;height:32px;font-size:.9rem}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border-radius:var(--radius);width:100%;max-width:360px;box-shadow:var(--shadow-lg);padding:1.5rem}.modal h3{margin-bottom:1rem;font-size:1.1rem;font-weight:700}.modal input[type=text]{border:2px solid var(--border);border-radius:var(--radius-sm);width:100%;margin-bottom:1rem;padding:.6rem .75rem;font-family:inherit;font-size:1rem;transition:border-color .2s}.modal input[type=text]:focus{border-color:var(--primary);outline:none}.modal-actions{justify-content:flex-end;gap:.5rem;display:flex}.pin-input-group{justify-content:center;gap:.5rem;margin:.75rem 0;display:flex}.pin-digit{text-align:center;border:2px solid var(--border);border-radius:var(--radius-sm);width:48px;height:56px;color:var(--text);background:var(--surface);-moz-appearance:textfield;font-family:inherit;font-size:1.5rem;font-weight:800;transition:border-color .2s}.pin-digit::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.pin-digit::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.pin-digit:focus{border-color:var(--primary);background:var(--primary-bg-subtle);outline:none}.pin-modal,.pin-modal h3{text-align:center}.pin-lock-icon{margin-bottom:.25rem;font-size:2rem}.pin-subtitle{color:var(--text-secondary);margin-bottom:.25rem;font-size:.9rem;font-weight:600}.pin-error{color:var(--danger);margin-top:.25rem;font-size:.85rem;font-weight:600;animation:.3s ease-in-out shake}.pin-label{color:var(--text-secondary);text-align:left;margin-bottom:.25rem;font-size:.85rem;font-weight:600;display:block}.pin-modal .modal-actions{justify-content:center;margin-top:1rem}.pin-locked-banner{background:var(--primary-bg);border:2px solid var(--primary);border-radius:var(--radius);color:var(--primary-dark);cursor:pointer;align-items:center;gap:.5rem;margin-bottom:1rem;padding:.75rem 1rem;font-size:.85rem;font-weight:600;transition:all .2s;display:flex}.pin-locked-banner:hover{background:var(--primary);color:#fff}.pin-locked-icon{font-size:1.1rem}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-6px)}50%{transform:translate(6px)}75%{transform:translate(-4px)}}.footer{text-align:center;color:var(--text-muted);padding:1.5rem 1rem;font-size:.75rem}.footer-diamond{color:var(--primary)}.status-bar{width:100%;max-width:960px;margin:.75rem auto 0;padding:0 1rem}.status-pill{border-radius:100px;align-items:center;gap:.4rem;padding:.3rem .75rem;font-size:.75rem;font-weight:600;display:inline-flex}.status-pill.locked{background:var(--danger-bg);color:var(--danger)}.status-pill.open{background:var(--primary-bg);color:var(--primary-dark)}@media (width<=500px){.header h1{font-size:1.35rem}.header{padding:1.5rem 1rem 1rem}.team-name{font-size:.75rem}.team-logo,.team-logo-fallback{width:28px;height:28px;font-size:.6rem}.score-input{width:36px;height:36px;font-size:1rem}.legend-items{grid-template-columns:1fr 1fr}.user-bar-inner{gap:.35rem}.joker-btn{width:24px;height:24px;font-size:.85rem}}