*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f1117;--surface:#1a1d27;--surface2:#242736;--border:#2e3248;--accent:#6c63ff;--accent-hover:#8078ff;--danger:#e05260;--text:#e8eaf0;--muted:#7a7f99;--radius:10px;--font:"Segoe UI", system-ui, sans-serif}body{background:var(--bg);color:var(--text);font-family:var(--font);min-height:100vh;font-size:15px}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}.app{flex-direction:column;min-height:100vh;display:flex}.header{background:var(--surface);border-bottom:1px solid var(--border);z-index:10;flex-direction:column;gap:0;padding:10px 16px 0;display:flex;position:sticky;top:0}.header h1{letter-spacing:.5px;padding-bottom:8px;font-size:1.1rem;font-weight:700}.tabs{-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:0;display:flex;overflow-x:auto}.tabs::-webkit-scrollbar{display:none}@media (width<=599px){.tabs{display:none}}.tab{color:var(--muted);cursor:pointer;font-family:var(--font);white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;flex-shrink:0;padding:8px 14px;font-size:.85rem;font-weight:500;transition:all .15s}.tab:hover{color:var(--text)}.tab.active{color:var(--accent);border-bottom-color:var(--accent)}@media (width>=600px){.header{flex-direction:row;align-items:center;gap:24px;height:56px;padding:0 24px}.header h1{padding-bottom:0;font-size:1.2rem}.tab{border-bottom:none;border-radius:6px;padding:6px 16px;font-size:.9rem}.tab.active{background:var(--surface2);border-bottom:none}.tab:hover{background:var(--surface2)}}.bottom-nav{height:calc(60px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--surface);border-top:1px solid var(--border);z-index:10;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;position:fixed;bottom:0;left:0;right:0}.bottom-nav-item{color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:0;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:3px;padding:8px 4px;transition:color .15s;display:flex}.bottom-nav-item.active{color:var(--accent)}.bottom-nav-item.active .bottom-nav-icon{transform:scale(1.15)}.bottom-nav-icon{font-size:1.25rem;line-height:1;transition:transform .15s}.bottom-nav-label{font-size:.65rem;font-family:var(--font)}@media (width>=600px){.bottom-nav{display:none}}.main{width:100%;padding:20px 16px;padding-bottom:calc(80px + env(safe-area-inset-bottom))}@media (width>=600px){.main{padding:28px 24px}}@media (width>=1000px){.main{max-width:960px;margin:0 auto}}.page-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.page-header h2{font-size:1.25rem}@media (width>=600px){.page-header{margin-bottom:20px}.page-header h2{font-size:1.4rem}}.search-bar{gap:8px;margin-bottom:16px;display:flex}.search-bar input{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);outline:none;flex:1;padding:10px 14px;font-size:16px;transition:border-color .15s}.search-bar input:focus{border-color:var(--accent)}button{cursor:pointer;font-family:var(--font);-webkit-tap-highlight-color:transparent;border:none;border-radius:8px;font-size:.9rem;transition:all .15s}button:disabled{opacity:.55;cursor:not-allowed}.btn-primary{background:var(--accent);color:#fff;padding:10px 18px;font-weight:600}.btn-primary:hover:not(:disabled){background:var(--accent-hover)}.btn-secondary{background:var(--surface2);color:var(--text);border:1px solid var(--border);padding:10px 18px}.btn-secondary:hover:not(:disabled){border-color:var(--accent)}.btn-small{background:var(--surface2);color:var(--text);border:1px solid var(--border);border-radius:7px;padding:6px 12px;font-size:.8rem}.btn-small:hover:not(:disabled){border-color:var(--accent)}.btn-danger{color:var(--danger)!important;border-color:#0000!important}.btn-danger:hover:not(:disabled){background:#e0526026!important}.card-grid{grid-template-columns:1fr;gap:12px;display:grid}@media (width>=480px){.card-grid{grid-template-columns:repeat(2,1fr)}}@media (width>=768px){.card-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:5px;padding:14px;transition:border-color .15s;display:flex}.card:active{border-color:var(--accent)}@media (hover:hover){.card:hover{border-color:var(--accent)}}.card-title{font-size:1rem;font-weight:600}.card-sub{color:var(--muted);font-size:.82rem}.card-notas{font-style:italic}.card-actions{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.empty-state{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:48px 24px;display:flex}.empty-icon{font-size:3rem;line-height:1}.empty-title{font-size:1.05rem;font-weight:600}.empty-sub{color:var(--muted);max-width:280px;font-size:.88rem;line-height:1.5}.empty-state .btn-primary{margin-top:8px}.error{color:var(--danger);background:#e052601a;border:1px solid #e052604d;border-radius:8px;align-items:center;margin-bottom:12px;padding:10px 14px;font-size:.85rem;display:flex}.muted{color:var(--muted);font-size:.9rem}@keyframes shimmer{0%{background-position:-600px 0}to{background-position:600px 0}}.skel{background:linear-gradient(90deg, var(--surface2) 25%, var(--border) 50%, var(--surface2) 75%);background-size:1200px 100%;border-radius:6px;animation:1.5s linear infinite shimmer}.skel-title{width:60%;height:15px}.skel-sub{width:80%;height:12px}@keyframes toast-in{0%{opacity:0;transform:translateY(10px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.toast-container{bottom:calc(72px + env(safe-area-inset-bottom));z-index:300;pointer-events:none;flex-direction:column;gap:8px;width:max-content;max-width:calc(100vw - 32px);display:flex;position:fixed;left:50%;transform:translate(-50%)}.toast{white-space:nowrap;border-radius:24px;padding:10px 20px;font-size:.88rem;font-weight:500;animation:.2s toast-in;box-shadow:0 4px 20px #00000080}.toast-success{color:#4caf82;background:#1a2e20;border:1px solid #2d5a3d}.toast-error{color:var(--danger);background:#2e1a1e;border:1px solid #5a2d33}@media (width>=600px){.toast-container{bottom:28px;left:auto;right:28px;transform:none}}.modal-overlay{z-index:100;background:#000000a6;align-items:flex-end;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border:1px solid var(--border);padding:24px 16px calc(24px + env(safe-area-inset-bottom));border-radius:18px 18px 0 0;width:100%;max-height:92vh;overflow-y:auto}.modal:before{content:"";background:var(--border);border-radius:2px;width:40px;height:4px;margin:0 auto 20px;display:block}.modal h3{margin-bottom:16px;font-size:1.1rem}@media (width>=600px){.modal-overlay{justify-content:center;align-items:center;padding:20px}.modal{border-radius:14px;max-width:440px;max-height:90vh;padding:28px}.modal:before{display:none}.modal-wide{max-width:600px}}.form{flex-direction:column;gap:14px;display:flex}.form label{color:var(--muted);flex-direction:column;gap:6px;font-size:.85rem;display:flex}.form input,.form select,.form textarea{background:var(--surface2);border:1px solid var(--border);color:var(--text);font-size:16px;font-family:var(--font);border-radius:8px;outline:none;width:100%;padding:11px 12px;transition:border-color .15s}.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--accent)}.form select option{background:var(--surface2)}.form-actions{justify-content:stretch;gap:8px;margin-top:4px;display:flex}.form-actions button{flex:1}@media (width>=600px){.form-actions{justify-content:flex-end}.form-actions button{flex:none}.form input,.form select,.form textarea{padding:9px 12px;font-size:.9rem}.search-bar input{font-size:.9rem}}.jugadores-section{flex-direction:column;gap:10px;display:flex}.jugadores-header{justify-content:space-between;align-items:center;font-size:.85rem;display:flex}.player-picker{flex-wrap:wrap;gap:8px;display:flex}.player-chip{border:1.5px solid var(--border);background:var(--surface2);color:var(--muted);font-family:var(--font);cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:24px;align-items:center;gap:5px;padding:8px 14px;font-size:.88rem;font-weight:500;transition:all .15s;display:inline-flex}.player-chip:hover{border-color:var(--accent);color:var(--text)}.player-chip.selected{border-color:var(--accent);color:var(--text);background:#6c63ff26}.chip-check{color:var(--accent);font-size:.8rem}.chip-apodo{opacity:.65;font-size:.75rem}.score-cards{flex-direction:column;gap:8px;display:flex}.score-card{background:var(--surface2);border:1.5px solid var(--border);cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;border-radius:12px;justify-content:space-between;align-items:center;padding:14px 18px;transition:border-color .15s,background .15s;display:flex}.score-card:hover{border-color:var(--accent)}.score-card:active{border-color:var(--accent);background:#6c63ff14}.score-card-name{font-size:1rem;font-weight:600}.score-card-pts{color:var(--accent);text-align:right;min-width:48px;font-size:1.8rem;font-weight:700;line-height:1}.score-card-pts-empty{color:var(--border)}.numpad-overlay{z-index:200;background:#00000080;align-items:flex-end;display:flex;position:fixed;inset:0}.numpad{background:var(--surface);border-top:1px solid var(--border);width:100%;padding:20px 16px calc(24px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0}.numpad-display{text-align:center;margin-bottom:20px}.numpad-player{color:var(--muted);margin-bottom:6px;font-size:.85rem;font-weight:500}.numpad-value{color:var(--text);letter-spacing:-2px;font-size:3.5rem;font-weight:700;line-height:1}.numpad-value-empty{color:var(--border)}.numpad-grid{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.numpad-key{background:var(--surface2);border:1px solid var(--border);height:64px;color:var(--text);font-family:var(--font);cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:14px;font-size:1.5rem;font-weight:600;transition:background .1s,transform .1s}.numpad-key:active{background:var(--border);transform:scale(.93)}.numpad-confirm{background:var(--accent);border-color:var(--accent);color:#fff;font-size:1.6rem}.numpad-confirm:active{background:var(--accent-hover)}@media (width>=600px){.numpad-overlay{justify-content:center;align-items:center}.numpad{border:1px solid var(--border);border-radius:20px;max-width:320px;padding:24px 20px}.numpad-key{height:60px;font-size:1.3rem}}.ranking-preview{background:var(--surface2);border:1px solid var(--border);border-radius:10px;flex-direction:column;gap:6px;padding:12px 14px;display:flex}.ranking-preview-title{color:var(--muted);text-transform:uppercase;letter-spacing:.6px;margin-bottom:2px;font-size:.7rem}.ranking-item{align-items:center;gap:8px;font-size:.88rem;display:flex}.ranking-pos{text-align:center;flex-shrink:0;width:22px;font-size:1rem}.ranking-name{flex:1;font-weight:500}.ranking-pts-game{color:var(--muted);flex-shrink:0;font-size:.8rem}.ranking-pts-gen{text-align:right;flex-shrink:0;min-width:28px;font-size:.82rem;font-weight:700}.table-wrap{-webkit-overflow-scrolling:touch;margin-top:12px;overflow-x:auto}.table{border-collapse:collapse;white-space:nowrap;width:100%;font-size:.82rem}.table th,.table td{text-align:left;border-bottom:1px solid var(--border);padding:9px 10px}.table th{color:var(--muted);font-weight:500}.winner-row td{color:gold;font-weight:600}@media (width>=600px){.table{white-space:normal;font-size:.88rem}.table th,.table td{padding:9px 12px}}.stats-grid{grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:14px;display:grid}.stats-grid-6{grid-template-columns:repeat(3,1fr)}@media (width>=480px){.stats-grid{grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}.stats-grid-6{grid-template-columns:repeat(6,1fr)}}.stat{background:var(--surface2);text-align:center;color:var(--muted);border-radius:8px;padding:10px 8px;font-size:.72rem}.stat span{color:var(--text);margin-bottom:2px;font-size:1.2rem;font-weight:700;display:block}@media (width>=600px){.stat{padding:12px;font-size:.78rem}.stat span{font-size:1.3rem}}.stat-gold{border-top:2px solid gold}.stat-silver{border-top:2px solid silver}.stat-last{border-top:2px solid var(--danger)}.stat-pts span{color:var(--accent)}.pts-pos{color:#4caf82;font-weight:600}.pts-neg{font-weight:600;color:var(--danger)!important}.puntos-legend{flex-wrap:wrap;gap:8px;margin-bottom:16px;display:flex}.badge{border-radius:20px;padding:4px 10px;font-size:.75rem;font-weight:600}.badge-gold{color:gold;background:#ffd70026;border:1px solid #ffd7004d}.badge-silver{color:silver;background:#c0c0c026;border:1px solid #c0c0c04d}.badge-last{color:var(--danger);background:#e0526026;border:1px solid #e052604d}.tabla-general{flex-direction:column;gap:8px;display:flex}.tabla-row{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-wrap:wrap;align-items:center;gap:8px 10px;padding:12px 14px;transition:border-color .15s;display:flex}.tabla-row:active{border-color:var(--accent)}@media (hover:hover){.tabla-row:hover{border-color:var(--accent)}}.tabla-row-leader{background:#ffd7000a;border-color:#ffd70066}.tabla-rank{text-align:center;flex-shrink:0;width:36px;font-size:1.4rem;line-height:1}.tabla-info{flex-direction:column;flex:1;gap:5px;min-width:0;display:flex}.tabla-nombre{white-space:nowrap;text-overflow:ellipsis;font-size:.95rem;font-weight:600;overflow:hidden}.tabla-apodo{color:var(--muted);font-size:.85rem;font-weight:400}.tabla-bar-wrap{background:var(--surface2);border-radius:2px;height:4px;overflow:hidden}.tabla-bar{background:var(--accent);border-radius:2px;height:100%;transition:width .5s}.tabla-puntos-partida{color:var(--muted);flex-wrap:wrap;align-items:center;gap:4px;font-size:.72rem;display:flex}.tabla-sep{opacity:.4}.tabla-pts{color:#4caf82;white-space:nowrap;flex-shrink:0;font-size:1.25rem;font-weight:700}.tabla-pts.pts-neg{color:var(--danger)}.tabla-badges{flex-wrap:wrap;align-items:center;gap:6px;width:100%;display:flex}.tabla-pj{color:var(--muted);white-space:nowrap;margin-left:auto;font-size:.72rem}@media (width>=640px){.tabla-row{grid-template-columns:48px 1fr auto auto;align-items:center;gap:12px;padding:14px 16px;display:grid}.tabla-rank{width:auto;font-size:1.5rem}.tabla-badges{justify-content:flex-end;width:auto}.tabla-pj{margin-left:0}.tabla-pts{text-align:right;min-width:48px;font-size:1.3rem}}
