
:root{
  --brand:#173b75;--brand2:#45b6f3;--brand-ink:#ffffff;--accent:#173b75;
  --bg:#f4f7fb;--card:#ffffff;--ink:#142033;--muted:#65748a;--line:#e2e8f0;
  --ok:#166534;--ok-bg:#ecfdf3;--warn:#8a5b00;--warn-bg:#fff7df;
  --danger:#a1271d;--danger-bg:#fff0ef;--blue-bg:#eef5ff
}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink)}
button,input{font:inherit}.hidden{display:none!important}.app{min-height:100vh;padding-bottom:88px}
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:linear-gradient(160deg,#0b1f3a,#071323 72%)}
.login-card{width:min(440px,100%);background:#fff;border-radius:28px;padding:28px;box-shadow:0 28px 90px rgba(0,0,0,.24)}
.brand{display:flex;align-items:center;gap:12px}.brand-logo{width:54px;height:54px;border-radius:16px;background:#edf3fb;display:grid;place-items:center;overflow:hidden;font-weight:900;color:#173b75}.brand-logo img{width:100%;height:100%;object-fit:contain}
.login h1{margin:20px 0 6px}.login p{color:var(--muted);margin:0 0 20px}.field{margin:14px 0}.field label{display:block;font-size:12px;font-weight:800;margin-bottom:7px}.field input{width:100%;border:1px solid #cfd8e6;border-radius:13px;padding:13px 14px;outline:none}.field input:focus{border-color:#4d7bd9;box-shadow:0 0 0 3px rgba(77,123,217,.12)}
.btn{border:0;border-radius:13px;padding:13px 16px;font-weight:850;cursor:pointer}.btn-primary{width:100%;background:#173b75;color:#fff}.login-note{font-size:12px;color:var(--muted);margin-top:14px}
.topbar{position:sticky;top:0;z-index:20;background:linear-gradient(135deg,var(--brand),var(--brand2));color:var(--brand-ink);padding:calc(14px + env(safe-area-inset-top)) 18px 16px;box-shadow:0 8px 24px rgba(9,34,74,.14)}
.toprow{max-width:760px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}.topclub{display:flex;align-items:center;gap:11px}.mini-logo{width:42px;height:42px;border-radius:13px;background:rgba(255,255,255,.16);display:grid;place-items:center;overflow:hidden;font-weight:900}.mini-logo img{width:100%;height:100%;object-fit:contain}.topclub small{display:block;opacity:.78;font-size:11px}.topclub strong{display:block;font-size:16px}.avatar{width:40px;height:40px;border-radius:50%;border:2px solid currentColor;background:rgba(255,255,255,.12);color:inherit;font-weight:900}
.main{max-width:760px;margin:auto;padding:18px}.hello{margin-bottom:16px}.hello h2{font-size:26px;margin:0 0 3px}.hello p{margin:0;color:var(--muted)}
.player-switch{display:flex;gap:9px;overflow:auto;padding:2px 1px 10px;scrollbar-width:none}.player-switch::-webkit-scrollbar{display:none}.player-pill{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:16px;padding:9px 11px;display:flex;align-items:center;gap:9px;min-width:max-content;font-weight:800}.player-pill.active{border-color:var(--accent);box-shadow:0 0 0 2px rgba(23,59,117,.08)}.pill-photo{width:32px;height:32px;border-radius:10px;background:#eef4ff;color:#173b75;display:grid;place-items:center;overflow:hidden;font-size:11px;font-weight:900}.pill-photo img{width:100%;height:100%;object-fit:cover}
.hero-player{background:#fff;border:1px solid var(--line);border-radius:24px;padding:20px;box-shadow:0 16px 38px rgba(23,59,117,.08);position:relative;overflow:hidden}.hero-player:before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--accent)}
.player-head{display:flex;align-items:center;gap:14px}.player-photo{width:68px;height:68px;border-radius:20px;background:#eef4ff;color:#173b75;display:grid;place-items:center;overflow:hidden;font-size:22px;font-weight:900;flex:none}.player-photo img{width:100%;height:100%;object-fit:cover}.player-head h3{margin:0 0 3px;font-size:21px}.player-head p{margin:0;color:var(--muted)}.status-chip{margin-left:auto;border-radius:999px;background:var(--ok-bg);color:var(--ok);padding:7px 10px;font-size:11px;font-weight:900}
.hero-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:16px}.hero-stat{background:#f8fafc;border:1px solid #eef2f7;border-radius:14px;padding:11px}.hero-stat small{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;font-weight:800}.hero-stat strong{display:block;margin-top:4px;color:var(--ink)}
.section{margin-top:22px}.section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.section-head h3{margin:0;font-size:18px}.linkbtn{border:0;background:none;color:var(--accent);font-weight:800}.cards{display:grid;gap:11px}.card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px;box-shadow:0 5px 18px rgba(15,31,55,.045)}.card-row{display:flex;gap:13px;align-items:flex-start}.ico{width:42px;height:42px;border-radius:13px;background:var(--blue-bg);display:grid;place-items:center;font-size:20px;flex:none}.card h4{margin:0 0 4px}.card p{margin:0;color:var(--muted);font-size:13px;line-height:1.45}.meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.tag{font-size:11px;font-weight:800;padding:6px 8px;border-radius:999px;background:#f0f4f8;color:#536174}.tag.ok{background:var(--ok-bg);color:var(--ok)}.tag.warn{background:var(--warn-bg);color:var(--warn)}.tag.danger{background:var(--danger-bg);color:var(--danger)}
.action-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.action-row .btn{padding:9px 11px;font-size:12px}.btn-yes{background:var(--ok-bg);color:var(--ok)}.btn-no{background:var(--danger-bg);color:var(--danger)}.btn-map{background:var(--blue-bg);color:#1556a6}
.money{font-variant-numeric:tabular-nums}.money.pending{color:#b45309}.money.ok{color:#15803d}.money.credit{color:#155e75}
.list-player{display:flex;align-items:center;gap:12px}.list-player .player-photo{width:50px;height:50px;border-radius:15px;font-size:16px}.grow{flex:1}.right{text-align:right}.muted{color:var(--muted);font-size:12px}.empty{padding:24px;text-align:center;color:var(--muted);background:#fff;border:1px dashed #cad5e4;border-radius:18px}
.page-title{margin:2px 0 16px;font-size:25px}.subtle{color:var(--muted);margin-top:-8px;margin-bottom:16px}
.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.detail-box{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px}.detail-box small{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;font-weight:800}.detail-box strong{display:block;margin-top:4px}
.pay-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:16px}.pay-box{background:#fff;border-radius:16px;padding:13px;border:1px solid var(--line)}.pay-box small{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;font-weight:800}.pay-box strong{display:block;margin-top:5px;font-size:17px}
.timeline{position:relative;padding-left:18px}.timeline:before{content:"";position:absolute;left:5px;top:7px;bottom:7px;width:2px;background:#dce5f1}.event{position:relative;padding:0 0 16px 14px}.event:before{content:"";position:absolute;left:-17px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--accent);border:2px solid #fff;box-shadow:0 0 0 2px #dce5f1}.event strong{display:block}.event small{color:var(--muted)}
.news-card{display:grid;grid-template-columns:96px 1fr;gap:12px}.news-img{width:96px;height:78px;border-radius:13px;background:#eef4ff;object-fit:cover}.more-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.more-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px}.more-card span{font-size:25px}.more-card strong{display:block;margin-top:9px}.more-card small{color:var(--muted)}
.nav{position:fixed;left:0;right:0;bottom:0;z-index:30;background:rgba(255,255,255,.97);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:7px max(8px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));display:grid;grid-template-columns:repeat(6,1fr)}
.nav button{border:0;background:none;color:#738198;padding:5px 2px;font-size:10px;font-weight:800}.nav .nicon{display:block;font-size:20px;line-height:1.1;margin-bottom:3px}.nav button.active{color:var(--accent)}
.toast{position:fixed;top:90px;left:50%;transform:translateX(-50%);z-index:100;background:#102e5d;color:#fff;border-radius:12px;padding:11px 14px;font-size:12px;font-weight:800;box-shadow:0 10px 30px rgba(0,0,0,.2)}
@media(min-width:720px){.hero-grid{grid-template-columns:repeat(4,1fr)}.cards.two{grid-template-columns:1fr 1fr}.detail-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:520px){.main{padding:14px}.hero-grid{grid-template-columns:repeat(2,1fr)}.pay-summary{grid-template-columns:1fr}.nav button{font-size:9px}.more-grid{grid-template-columns:1fr 1fr}}


/* ClubGest Familias 0.3 */
.notify-btn{position:relative;width:40px;height:40px;border-radius:50%;border:1px solid currentColor;background:rgba(255,255,255,.12);color:inherit;margin-left:auto;margin-right:8px}.notify-btn b{position:absolute;right:-4px;top:-5px;background:#b42318;color:#fff;border-radius:999px;min-width:18px;height:18px;padding:0 5px;display:grid;place-items:center;font-size:10px}
.callup-urgent{border-color:#f5c15c;box-shadow:0 10px 26px rgba(180,83,9,.10)}.ico.urgent{background:#fff7df;color:#8a5b00;font-weight:950}
.nav{box-shadow:0 -10px 28px rgba(15,31,55,.06)}.nav button.active .nicon{transform:translateY(-1px)}.nav .nicon{transition:.18s}
.live-hero{background:linear-gradient(135deg,#071b37,var(--accent));color:#fff;border-radius:24px;padding:22px;box-shadow:0 16px 38px rgba(8,31,65,.22)}.live-hero h1{margin:10px 0 6px;font-size:24px}.live-hero h1 b{font-size:30px;margin:0 6px}.live-hero p{margin:0;opacity:.8}.live-pill{display:inline-flex;border-radius:999px;background:#ef4444;color:#fff;padding:6px 9px;font-size:10px;font-weight:900;letter-spacing:.08em}
.thread-card{width:100%;text-align:left;cursor:pointer}.unread-dot{width:10px;height:10px;border-radius:50%;background:#2454e6;margin-top:5px}.chat{display:flex;flex-direction:column;gap:10px}.bubble{max-width:86%;border-radius:16px;padding:12px 14px}.bubble.mine{align-self:flex-end;background:#eaf2ff}.bubble.theirs{align-self:flex-start;background:#fff;border:1px solid var(--line)}.bubble p{margin:5px 0}.bubble small,.bubble time{font-size:10px;color:var(--muted)}.reply-box,.form-card{margin-top:16px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px}.reply-box textarea,.form-card input,.form-card textarea,.form-card select{width:100%;border:1px solid #cfd8e6;border-radius:11px;padding:11px;margin:6px 0 12px}.form-card label{display:block;font-weight:800;font-size:12px}.back-btn{border:0;background:none;color:var(--accent);font-weight:850;padding:0;margin:0 0 10px;cursor:pointer}
@media(max-width:520px){.topclub strong{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.live-hero h1{font-size:20px}.live-hero h1 b{font-size:26px}.nav{grid-template-columns:repeat(6,1fr)}}

.app-build{text-align:center;color:var(--muted);font-size:11px;font-weight:800;margin-top:18px;letter-spacing:.04em}
