/* Layout: scoreboard header → day tabs + Balance tab → featured "marcador" cards → pick boards → combinadas → trampas */
:root{
  --bg:#0F1517; --surface:#162024; --surface-2:#1C292E; --line:#2A3A40;
  --fg:#E7EEEA; --muted:#8EA19A; --accent:#F2B33D; --accent-ink:#1A1405;
  --good:#4FC38A; --warn:#E8735A; --value:#7FB8F0; --mid:#E9963A;
  --f-display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --f-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  color-scheme:dark;
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --bg:#F2F4F1; --surface:#FFFFFF; --surface-2:#E9EEEA; --line:#D3DCD7;
    --fg:#12201B; --muted:#56675F; --accent:#B87808; --accent-ink:#FFFFFF;
    --good:#1C8752; --warn:#BF4429; --value:#2F6FB0; --mid:#B9620F; color-scheme:light;
  }
}
:root[data-theme="light"]{
  --bg:#F2F4F1; --surface:#FFFFFF; --surface-2:#E9EEEA; --line:#D3DCD7;
  --fg:#12201B; --muted:#56675F; --accent:#B87808; --accent-ink:#FFFFFF;
  --good:#1C8752; --warn:#BF4429; --value:#2F6FB0; --mid:#B9620F; color-scheme:light;
}
*{box-sizing:border-box}
/* confidence meter */
.meter{--c:var(--muted);display:inline-flex;align-items:center;gap:7px;padding:3px 9px 3px 7px;border-radius:999px;border:1px solid color-mix(in srgb,var(--c) 45%,transparent);background:color-mix(in srgb,var(--c) 12%,transparent);white-space:nowrap}
.meter .bars{display:inline-flex;align-items:flex-end;gap:2px;height:13px}
.meter .bars i{width:4px;border-radius:1px;background:color-mix(in srgb,var(--c) 22%,transparent);display:block}
.meter .bars i:nth-child(1){height:5px}.meter .bars i:nth-child(2){height:7px}.meter .bars i:nth-child(3){height:9px}.meter .bars i:nth-child(4){height:11px}.meter .bars i:nth-child(5){height:13px}
.meter .bars i.on{background:var(--c)}
.meter b{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--c)}
.meter.c5,.meter.c4{--c:var(--good)} .meter.c3{--c:var(--accent)} .meter.c2{--c:var(--mid)} .meter.c1{--c:var(--warn)}
.meter.lg{padding:5px 12px 5px 9px}.meter.lg .bars{height:16px}.meter.lg .bars i{width:5px}
.meter.lg .bars i:nth-child(1){height:6px}.meter.lg .bars i:nth-child(2){height:9px}.meter.lg .bars i:nth-child(3){height:11px}.meter.lg .bars i:nth-child(4){height:14px}.meter.lg .bars i:nth-child(5){height:16px}
.meter.lg b{font-size:11px}
.scale{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
/* toolbar + top picks */
.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.toolbar span{font-size:12px;color:var(--muted);margin-right:4px}
.fbtn{all:unset;cursor:pointer;font-size:13px;font-weight:600;padding:6px 12px;border-radius:999px;border:1px solid var(--line);background:var(--surface)}
.fbtn[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.fbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.day.f-high [data-conf="0"],.day.f-high [data-conf="1"],.day.f-high [data-conf="2"],.day.f-high [data-conf="3"]{display:none}
.day.f-value .pick:not([data-value]),.day.f-value .row:not([data-value]){display:none}
.day.f-high .row.cont .time,.day.f-high .row.cont .match,.day.f-value .row.cont .time,.day.f-value .row.cont .match{visibility:visible;display:block}
.day.f-high .combos-sec,.day.f-value .combos-sec,.day.f-high .traps-sec,.day.f-value .traps-sec{display:none}
.top-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:10px}
.top-card{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:14px;display:flex;flex-direction:column;gap:8px;min-width:0}
.top-card .rank{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.top-card .tm{font-size:12px;color:var(--muted)}
.top-card .mk{font-family:var(--f-display);font-size:20px;font-weight:700;text-transform:uppercase;line-height:1.05}
.top-card .bt{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:auto}
.top-card .odds{font-size:20px;color:var(--accent)}
body{background:var(--bg);color:var(--fg);font-family:var(--f-body);font-size:15px;line-height:1.5;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:0 48px}
.wrap{max-width:1080px;margin:0 auto;display:flex;flex-direction:column;gap:28px}
h1,h2,h3{font-family:var(--f-display);text-wrap:balance;margin:0;letter-spacing:.01em}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);font-weight:600}

.top{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;padding-top:28px;border-bottom:1px solid var(--line);padding-bottom:20px}
.brand{display:flex;flex-direction:column;gap:4px}
.brand h1{font-size:clamp(38px,7vw,60px);font-weight:800;line-height:.9;text-transform:uppercase}
.brand h1 span{color:var(--accent)}
.brand p{margin:0;color:var(--muted);font-size:14px}
.legend{display:flex;flex-wrap:wrap;gap:14px;font-size:12px;color:var(--muted);align-items:center}
.legend > div{display:flex;align-items:center;gap:6px}

.days{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:10px}
.day-btn{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:2px;padding:14px 16px;border:1px solid var(--line);background:var(--surface);border-radius:6px}
.day-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.day-btn .d{font-family:var(--f-display);font-size:24px;font-weight:700;text-transform:uppercase;line-height:1}
.day-btn .s{font-size:12px;color:var(--muted)}
.day-btn[aria-selected="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.day-btn[aria-selected="true"] .s{color:var(--accent-ink);opacity:.85}

.day{display:flex;flex-direction:column;gap:32px}
.slate{display:flex;flex-wrap:wrap;gap:8px}
.slate a{font-size:13px;color:var(--fg);text-decoration:none;padding:5px 10px;border:1px solid var(--line);border-radius:999px}
.slate a:hover{border-color:var(--accent);color:var(--accent)}
section > header{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
section > header h2{font-size:28px;text-transform:uppercase;font-weight:700}
section > header p{margin:0;color:var(--muted);font-size:13px;max-width:70ch}

.feat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,480px),1fr));gap:16px}
.board{background:var(--surface);border:1px solid var(--line);border-radius:8px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.board-head{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:18px 18px 14px;background:var(--surface-2);border-bottom:1px solid var(--line)}
.board-head .team{font-family:var(--f-display);font-size:clamp(22px,4vw,30px);font-weight:700;text-transform:uppercase;line-height:1;min-width:0;overflow-wrap:anywhere}
.board-head .team.away{text-align:right}
.kick{display:flex;flex-direction:column;align-items:center;gap:3px}
.kick .t{font-family:var(--f-mono);font-size:22px;font-weight:700;color:var(--accent)}
.kick .c{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);text-align:center;max-width:16ch}
.board-body{padding:16px 18px 18px;display:flex;flex-direction:column;gap:14px}
.keys{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:14px;max-width:68ch}
.keys li::marker{color:var(--accent)}
.read{margin:0;font-size:14px;color:var(--muted);border-left:2px solid var(--line);padding-left:10px}

.picks{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.pick{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.pick .m{min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-weight:500}
.odds{font-family:var(--f-mono);font-weight:700;font-size:16px;font-variant-numeric:tabular-nums;min-width:5.2ch;text-align:right}
.pips{display:inline-flex;gap:3px}
.pips i{width:7px;height:14px;border-radius:2px;background:var(--line);display:block}
.pips i.on{background:var(--good)}
.tag{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:2px 6px;border-radius:3px;border:1px solid currentColor;white-space:nowrap}
.tag.value{color:var(--value)}
.tag.avoid{color:var(--warn)}
.tag.est{color:var(--muted);border-style:dashed}
.tag.pass{color:var(--muted)}
.tag.stk{color:var(--fg);border-color:var(--line);background:var(--surface-2)}
.res{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:2px 6px;border-radius:3px;white-space:nowrap}
.res.W{background:var(--good);color:var(--bg)}
.res.L{background:var(--warn);color:var(--bg)}
.res.P,.res.V{background:var(--line);color:var(--fg)}
.res.Q{background:transparent;color:var(--accent);border:1px solid var(--accent)}
/* live / final score chips */
.sc{display:inline-flex;align-items:center;gap:5px;font-family:var(--f-mono);font-size:11px;font-weight:700;padding:1px 7px;border-radius:999px;white-space:nowrap;vertical-align:middle}
.sc.fin{background:var(--surface-2);border:1px solid var(--line);color:var(--fg)}
.sc.live{background:color-mix(in srgb,var(--warn) 14%,transparent);border:1px solid color-mix(in srgb,var(--warn) 50%,transparent);color:var(--warn)}
.sc.live::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
@media (prefers-reduced-motion:no-preference){.sc.live::before{animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{50%{opacity:.25}}}
.row .match .sc{margin-top:3px}
.sc{white-space:normal;max-width:100%}
.why{flex-basis:100%;display:block;font-size:12px;font-weight:400;line-height:1.4;color:var(--muted);border-left:2px solid var(--warn);padding-left:8px;margin-top:2px}
.why.pend{border-left-color:var(--accent)}
table.hist td small.why{display:block;color:var(--muted)}
/* historial */
.hfilters{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.hcount{font-size:13px;color:var(--muted)}
table.hist td.mk{min-width:180px}
table.hist td small{display:block;color:var(--muted);font-size:12px}
table.hist .hm{display:none}
@media (max-width:640px){.hist-wrap table.hist{min-width:0}.hist-wrap table.hist td{overflow-wrap:anywhere}.hist-wrap table.hist th:nth-child(n+3):not(:nth-child(3)),.hist-wrap table.hist td:nth-child(n+4),.hist-wrap table.hist th:first-child,.hist-wrap table.hist td:first-child{display:none}table.hist td.mk{min-width:0}table.hist th,table.hist td{padding:10px 12px}.hist-wrap table.hist .hm{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin-top:6px;font-family:var(--f-mono);font-size:12px}table.hist small.hm{display:block;font-family:inherit;margin-top:0}}
.hist-wrap.f-W tr[data-res]:not([data-res="W"]),.hist-wrap.f-L tr[data-res]:not([data-res="L"]){display:none}
.sport{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);border:1px solid var(--accent);border-radius:3px;padding:1px 6px}
.pick.avoid .odds{color:var(--warn);text-decoration:line-through}

.comp{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:6px 18px 4px}
.row{display:grid;grid-template-columns:64px minmax(0,1.1fr) minmax(0,1.3fr) auto auto;gap:14px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line)}
.row:last-child{border-bottom:0}
.row .time{font-family:var(--f-mono);color:var(--accent);font-weight:700}
.row .match{font-weight:600;min-width:0}
.row .match small{display:block;font-weight:400;color:var(--muted);font-size:12px}
.row .mk{min-width:0;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.row .end{display:flex;gap:6px;align-items:center;justify-content:flex-end}
.row.cont .time,.row.cont .match{visibility:hidden}
.row.cont{padding-top:0}
@media (max-width:720px){
  .row{grid-template-columns:52px minmax(0,1fr) auto;grid-template-areas:"t m o" "t k p";row-gap:4px}
  .row .time{grid-area:t;align-self:start}
  .row .match{grid-area:m}
  .row .mk{grid-area:k;color:var(--muted);font-size:14px}
  .row .odds{grid-area:o}
  .row .end{grid-area:p}
  .row.cont .match{display:none}
  .row.cont{grid-template-areas:"t k o" "t k p"}
}

.combo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:14px}
.combo{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:12px;min-width:0}
.combo .h{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.combo h3{font-size:22px;text-transform:uppercase;font-weight:700}
.combo .risk{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);text-align:right;display:flex;flex-direction:column;gap:4px;align-items:flex-end}
.legs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.legs li{display:grid;grid-template-columns:1fr auto;gap:10px;font-size:14px;align-items:baseline}
.legs li small{display:block;color:var(--muted);font-size:12px}
.legs .odds{font-size:14px}
.total{display:flex;justify-content:space-between;align-items:flex-end;gap:10px;border-top:1px dashed var(--line);padding-top:12px;margin-top:auto}
.total .big{font-family:var(--f-mono);font-size:34px;font-weight:700;color:var(--accent);line-height:1}
.total .stake{font-size:12px;color:var(--muted);text-align:right}
.copy{all:unset;cursor:pointer;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;padding:8px 12px;border:1px solid var(--line);border-radius:4px;text-align:center}
.copy:hover{border-color:var(--accent);color:var(--accent)}
.copy:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.trixie{width:100%;border-collapse:collapse;font-size:13px}
.trixie td{padding:4px 0;border-bottom:1px solid var(--line)}
.trixie td:last-child{text-align:right;font-family:var(--f-mono)}

.traps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:10px}
.trap{border:1px solid var(--line);border-left:3px solid var(--warn);border-radius:6px;padding:12px 14px;background:var(--surface);display:flex;flex-direction:column;gap:4px}
.trap b{font-family:var(--f-display);font-size:19px;text-transform:uppercase;font-weight:700}
.trap span{font-size:13px;color:var(--muted)}

.callout{border:1px solid var(--line);border-radius:6px;padding:12px 14px;font-size:13px;color:var(--muted);background:var(--surface-2);max-width:80ch}

/* balance */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:10px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:14px 16px;display:flex;flex-direction:column;gap:4px}
.kpi b{font-family:var(--f-mono);font-size:28px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums}
.kpi b.pos{color:var(--good)} .kpi b.neg{color:var(--warn)}
.tbl-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:8px}
table.hist{width:100%;border-collapse:collapse;font-size:14px;min-width:560px}
table.hist th,table.hist td{padding:10px 14px;text-align:left;border-bottom:1px solid var(--line)}
table.hist th{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);font-weight:600}
table.hist td.n{font-family:var(--f-mono);text-align:right;font-variant-numeric:tabular-nums}
table.hist tr:last-child td{border-bottom:0}
.empty{background:var(--surface);border:1px dashed var(--line);border-radius:8px;padding:28px 20px;display:flex;flex-direction:column;gap:6px}
.empty b{font-family:var(--f-display);font-size:22px;text-transform:uppercase}
.empty span{color:var(--muted);font-size:14px;max-width:70ch}

footer{border-top:1px solid var(--line);padding-top:16px;color:var(--muted);font-size:12px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(20px + env(safe-area-inset-bottom,0px));background:var(--fg);color:var(--bg);padding:10px 16px;border-radius:6px;font-size:13px;font-weight:600}
@media (prefers-reduced-motion:no-preference){.day{animation:in .25s ease-out}@keyframes in{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}}

/* Tío Astro */
.astro{border:1px solid color-mix(in srgb,var(--accent) 55%,var(--line));border-radius:10px;padding:18px;background:color-mix(in srgb,var(--accent) 8%,var(--surface));display:flex;flex-direction:column;gap:14px}
.astro > header{margin-bottom:0}
.astro > header > div{display:flex;flex-direction:column;gap:2px}
.astro > header .eyebrow{color:var(--accent)}
.astro-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:10px}
.astro-card{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:14px;display:flex;flex-direction:column;gap:8px;min-width:0}
.astro-card .ah{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--muted)}
.astro-card .ah .mono{color:var(--accent);font-weight:700}
.astro-card .am{font-size:13px;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.astro-card .ak{font-family:var(--f-display);font-size:22px;font-weight:700;text-transform:uppercase;line-height:1.05}
.astro-card .ab{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:auto}
.astro-card .ab .odds{font-size:22px;color:var(--accent);min-width:0;text-align:left}
.astk{font-family:var(--f-mono);font-size:12px;font-weight:700;padding:3px 8px;border-radius:4px;background:var(--accent);color:var(--accent-ink)}
.astro-card .aw{margin:0;font-size:13px;color:var(--muted)}
.astro .copy{align-self:flex-start}
/* estadísticas */
.kpi .kname{font-size:14px;font-weight:600}
table.stats td:first-child{font-weight:600}
.bar{position:relative;height:18px;min-width:110px;border-radius:3px;background:var(--surface-2);overflow:hidden}
.bar i{position:absolute;inset:0 auto 0 0;background:color-mix(in srgb,var(--accent) 55%,transparent);display:block}
.bar i.hi{background:color-mix(in srgb,var(--good) 60%,transparent)}
.bar i.lo{background:color-mix(in srgb,var(--warn) 55%,transparent)}
.bar span{position:relative;font-family:var(--f-mono);font-size:12px;font-weight:700;padding-left:6px;line-height:18px}
/* calculadora */
.calc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px}
.calc-card{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:16px;display:flex;flex-direction:column;gap:6px;min-width:0}
.calc-card h3{font-size:20px;text-transform:uppercase;font-weight:700;margin-bottom:4px}
.calc-card label{font-size:12px;color:var(--muted);margin-top:6px}
.calc-card input{font:inherit;font-family:var(--f-mono);font-size:16px;padding:8px 10px;border-radius:6px;border:1px solid var(--line);background:var(--surface-2);color:var(--fg);width:100%}
.calc-card input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.calc-out{margin:10px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.calc-out div{background:var(--surface-2);border-radius:6px;padding:8px 10px}
.calc-out dt{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.calc-out dd{margin:2px 0 0;font-family:var(--f-mono);font-size:18px;font-weight:700;font-variant-numeric:tabular-nums}
.calc-out dd.pos{color:var(--good)} .calc-out dd.neg{color:var(--warn)}
@media (max-width:640px){table.stats{min-width:0}table.stats th:nth-child(2),table.stats td:nth-child(2),table.stats th:nth-child(6),table.stats td:nth-child(6){display:none}.bar{min-width:70px}}