:root { color-scheme: light; --ink:#202736; --muted:#687282; --line:#e3e7ee; --accent:#344157; }
* { box-sizing:border-box; }
body { margin:0; font-family:'Segoe UI',Arial,sans-serif; background:#f5f6f8; color:var(--ink); -webkit-font-smoothing:antialiased; }
button,input { font:inherit; }
.nav { position:fixed; inset:0 0 auto; height:76px; padding:0 max(24px,calc((100vw - 1120px)/2)); display:flex; align-items:center; justify-content:space-between; background:rgba(255,255,255,.96); border-bottom:1px solid var(--line); z-index:1000; transition:height .25s,box-shadow .25s; backdrop-filter:blur(12px); }
.nav.scrolled { height:62px; box-shadow:0 4px 20px #2027360a; }
.nav img { width:auto; height:48px; object-fit:contain; transition:height .25s; }
.nav.scrolled img { height:40px; }
.nav-label { display:flex; align-items:center; gap:9px; font-size:12px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color:#667080; }
.pokeball { width:18px; height:18px; border:2px solid currentColor; border-radius:50%; position:relative; background:linear-gradient(transparent 43%,currentColor 43%,currentColor 57%,transparent 57%); }
.pokeball:after { content:''; position:absolute; width:6px; height:6px; border:2px solid currentColor; border-radius:50%; background:white; top:4px; left:4px; }
.headerpokemon { max-width:1120px; min-height:290px; margin:104px auto 0; border-radius:24px; overflow:hidden; display:flex; align-items:center; position:relative; padding:40px; background:#252630 url('../img/banner.jpg') center/cover no-repeat; }
.headerpokemon:before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(15,20,32,.9),rgba(15,20,32,.47) 48%,rgba(15,20,32,.03)); }
.hero-copy { position:relative; max-width:490px; color:white; }
.eyebrow { display:inline-block; margin-bottom:14px; font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; }
.hero-copy .eyebrow { border:1px solid #ffffff60; padding:7px 11px; border-radius:6px; }
h1 { margin:0; font-size:clamp(32px,4vw,48px); line-height:1.08; letter-spacing:-1.8px; }
.hero-copy p { font-size:15px; line-height:1.65; margin:16px 0 0; max-width:310px; color:#f0f2f6; }
.today-section { max-width:1120px; margin:22px auto 0; padding:26px 28px; background:white; border:1px solid var(--line); border-radius:18px; box-shadow:0 4px 16px #20273608; }
.today-heading { display:flex; align-items:center; justify-content:space-between; gap:22px; margin-bottom:20px; }
.today-kicker { display:inline-block; margin-bottom:7px; color:#687282; font-size:10px; font-weight:800; letter-spacing:1.7px; text-transform:uppercase; }
.today-heading h2 { margin:0 0 7px; font-size:25px; text-transform:capitalize; }
.today-summary { margin:0; color:var(--muted); font-size:13px; line-height:1.5; }
.today-date-badge { width:64px; height:64px; flex:0 0 64px; display:flex; flex-direction:column; align-items:center; justify-content:center; background:#202736; color:white; border-radius:14px; line-height:1; }
.today-date-badge span { font-size:24px; font-weight:800; letter-spacing:-1px; }
.today-date-badge small { margin-top:5px; font-size:9px; font-weight:800; letter-spacing:1.3px; text-transform:uppercase; opacity:.72; }
.today-activities { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.today-item { min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:14px; padding:15px 16px; border:1px solid #e8ebf0; border-left:3px solid var(--accent); border-radius:12px; background:#fafbfc; }
.today-item-time { min-width:76px; font-size:12px; font-weight:800; color:#3e4a5d; }
.today-item-main { min-width:0; }
.today-item-title { margin:0 0 4px; font-size:14px; font-weight:750; line-height:1.35; color:var(--ink); }
.today-item-meta { margin:0; color:var(--muted); font-size:11px; line-height:1.4; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.today-item-link { min-height:36px; display:inline-flex; align-items:center; justify-content:center; padding:8px 11px; border-radius:8px; background:var(--accent); color:white; text-decoration:none; font-size:11px; font-weight:800; white-space:nowrap; }
.today-item-link[aria-disabled='true'] { background:#c2c8d0; pointer-events:none; }
.today-empty,.today-loading { grid-column:1/-1; padding:18px; border:1px dashed #d8dde5; border-radius:12px; color:var(--muted); text-align:center; font-size:13px; background:#fafbfc; }
.container { max-width:1120px; margin:38px auto 60px; }
.events-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:22px; }
h2 { font-size:25px; letter-spacing:-.7px; margin:0 0 7px; }
.section-description { font-size:14px; color:var(--muted); margin:0; }
.calendar-box { display:flex; align-items:center; gap:12px; }
.calendar-box label { font-size:12px; font-weight:600; color:var(--muted); }
#filtroFecha { min-height:44px; border:1px solid #d9dfe8; border-radius:10px; padding:9px 12px; background:white; color:var(--ink); font-size:13px; }
.tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:26px; }
.tab { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 14px; border:1px solid var(--line); border-radius:10px; background:white; color:#4e5868; font-size:13px; font-weight:600; cursor:pointer; transition:background .2s,color .2s,transform .2s,border-color .2s,box-shadow .2s; }
[data-tab='tcg'] { --accent:#365cb2; }
[data-tab='vgc'] { --accent:#b63d45; }
[data-tab='go'] { --accent:#207852; }
[data-tab='magic'] { --accent:#b14f30; }
[data-tab='otras'] { --accent:#98611e; }
.tab:not([data-tab='all']):before { content:''; width:8px; height:8px; border-radius:50%; background:var(--accent); flex-shrink:0; }
.tab.active { background:var(--accent); color:white; border-color:var(--accent); box-shadow:0 3px 8px #20273612; }
.tab.active:before { background:white; }
.tab:active,.btn:active { transform:scale(.97); }
:focus-visible { outline:3px solid #2486dc; outline-offset:4px; }
.grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; align-items:stretch; }
.card { position:relative; min-width:0; padding:24px; padding-bottom:88px; background:white; border:1px solid var(--line); border-top:3px solid var(--accent); border-radius:16px; box-shadow:0 3px 9px #20273604; transition:transform .24s,box-shadow .24s; animation:cardIn .48s both; overflow-wrap:anywhere; }
.card:nth-child(6n+2) { animation-delay:60ms; }
.card:nth-child(6n+3) { animation-delay:120ms; }
.card:nth-child(6n+4) { animation-delay:180ms; }
.card:nth-child(6n+5) { animation-delay:240ms; }
.card:nth-child(6n+6) { animation-delay:300ms; }
@keyframes cardIn { from { opacity:0; translate:0 14px; } to { opacity:1; translate:0 0; } }
.card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:18px; margin-bottom:18px; border-bottom:1px solid #edf0f4; }
.fecha { font-size:15px; font-weight:700; color:var(--ink); margin-bottom:8px; }
.hora { font-size:12px; color:var(--muted); margin-bottom:10px; }
.costo { display:inline-block; font-size:12px; font-weight:600; background:#f1f4f7; padding:5px 8px; border-radius:6px; color:#445163; }
.categoria { width:72px; height:72px; flex:0 0 72px; background:#f7f8fa; border:1px solid #edf0f4; border-radius:14px; display:flex; align-items:center; justify-content:center; padding:8px; }
.categoria img { width:100%; max-height:56px; object-fit:contain; }
.ciudad { font-size:12px; color:var(--muted); margin-bottom:8px; }
.flag { width:16px; vertical-align:middle; margin-right:5px; border-radius:2px; }
.direccion { display:block; font-size:13px; line-height:1.5; color:#506580; text-decoration:none; }
.direccion:hover { text-decoration:underline; }
.titulo { font-size:22px; font-weight:700; letter-spacing:-.5px; line-height:1.3; margin:16px 0 0; }
.event-category-label {
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-top:15px;
  padding:6px 10px;
  border:1px solid var(--accent);
  border-radius:999px;
  color:var(--accent);
  background:#fff;
  font-size:10px;
  font-weight:800;
  letter-spacing:.8px;
  text-transform:uppercase;
}
.event-category-label + .titulo { margin-top:10px; }
.event-category-label:before {
  content:'';
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--accent);
  flex:0 0 7px;
}

.btn { position:absolute; left:24px; right:24px; bottom:24px; display:block; min-height:44px; padding:12px 14px; text-align:center; border-radius:9px; font-size:13px; font-weight:700; color:white; text-decoration:none; transition:filter .2s,transform .2s; }
.btn:not([style*='pointer-events:none']) { background:var(--accent)!important; }
.btn:after { content:' ↗'; margin-left:5px; }
.btn[style*='pointer-events:none']:after { content:''; }
.footer { max-width:1120px; margin:0 auto; padding:22px 0 28px; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:16px; color:var(--muted); font-size:12px; }
@media(hover:hover) { .card:hover { transform:translateY(-5px); box-shadow:0 14px 28px #20273612; } .tab:hover { border-color:var(--accent); transform:translateY(-2px); } .btn:hover { filter:brightness(1.12); } }
@media(max-width:1180px) { .headerpokemon,.today-section,.container,.footer { margin-left:24px; margin-right:24px; } }
@media(max-width:900px) { .today-activities { grid-template-columns:minmax(0,1fr); } .grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .events-heading { align-items:flex-start; } .calendar-box { flex-direction:column; align-items:flex-start; gap:7px; } }
@media(max-width:600px) { .nav { height:66px; padding:0 18px; } .nav img { height:42px; } .nav-label { font-size:10px; letter-spacing:1px; } .headerpokemon { margin:84px 16px 0; min-height:250px; padding:28px 24px; border-radius:18px; background-position:58% center; } .headerpokemon:before { background:linear-gradient(90deg,#101828df,#10182855); } .hero-copy p { font-size:13px; max-width:250px; } .today-section { margin:16px 16px 0; padding:20px; border-radius:15px; } .today-heading { align-items:flex-start; gap:14px; margin-bottom:16px; } .today-heading h2 { font-size:21px; } .today-date-badge { width:56px; height:56px; flex-basis:56px; } .today-date-badge span { font-size:21px; } .today-item { grid-template-columns:1fr auto; gap:10px 12px; } .today-item-time { grid-column:1/-1; min-width:0; } .today-item-link { grid-column:2; grid-row:2; } .today-item-main { grid-column:1; grid-row:2; } .container { margin:28px 16px 40px; } .events-heading { flex-direction:column; gap:18px; margin-bottom:18px; } h2 { font-size:23px; } .calendar-box { flex-direction:row; align-items:center; justify-content:space-between; width:100%; } .tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:20px; } .tab { padding:10px 8px; font-size:12px; } .grid { grid-template-columns:minmax(0,1fr); gap:16px; } .card { padding:22px; padding-bottom:84px; } .btn { left:22px; right:22px; bottom:22px; } .footer { margin:0 16px; flex-direction:column; gap:6px; } }
@media(prefers-reduced-motion:reduce) { *,*:before,*:after { animation:none!important; transition:none!important; } }

/* Agenda de hoy - versión destacada */
.today-section { position:relative; overflow:hidden; padding:30px 32px 28px; border-color:#e3e7ed; box-shadow:0 12px 34px rgba(32,39,54,.07); }
.today-accent { position:absolute; inset:0 0 auto 0; height:5px; background:linear-gradient(90deg,#b63d45 0 20%,#365cb2 20% 40%,#207852 40% 60%,#b14f30 60% 80%,#98611e 80% 100%); }
.today-copy { min-width:0; }
.today-kicker { display:inline-flex; align-items:center; gap:8px; color:#536174; }
.live-dot { width:8px; height:8px; border-radius:50%; background:#2eaa69; box-shadow:0 0 0 5px rgba(46,170,105,.10); }
.today-heading h2 { font-size:clamp(27px,3vw,35px); letter-spacing:-1.2px; }
.today-date-badge { width:78px; height:78px; flex-basis:78px; border-radius:20px; background:linear-gradient(145deg,#202736,#343e50); box-shadow:0 10px 24px rgba(32,39,54,.16); }
.today-date-badge span { font-size:30px; }
.today-date-badge small { font-size:10px; letter-spacing:1.8px; }
.today-activities { gap:14px; }
.today-item { position:relative; padding:18px 18px 18px 20px; border:1px solid #e7ebf1; border-left:0; border-radius:14px; background:linear-gradient(180deg,#fff,#fafbfd); box-shadow:0 4px 14px rgba(32,39,54,.04); overflow:hidden; }
.today-item:before { content:''; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--accent); }
.today-item-time { min-width:84px; display:inline-flex; align-items:center; gap:6px; font-size:13px; }
.today-item-title { font-size:15px; }
.today-item-meta { margin-top:4px; }
.today-item-badges { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.today-pill { display:inline-flex; align-items:center; min-height:24px; padding:4px 8px; border-radius:999px; background:#f1f4f7; color:#566273; font-size:10px; font-weight:700; }
.today-item-link { min-height:38px; padding:9px 12px; border-radius:9px; }
.today-empty,.today-loading { padding:24px; border-radius:14px; background:linear-gradient(180deg,#fafbfd,#f6f8fb); }


/* Mini juego dinosaurio - detalle discreto solo escritorio */
.dino-strip { max-width:1120px; margin:-22px auto 34px; padding:12px 16px 10px; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:0 4px 14px rgba(32,39,54,.035); overflow:hidden; }
.dino-strip-top { min-height:24px; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0 2px 6px; color:#788293; }
.dino-label { font-size:9px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; }
.dino-score { font-size:9px; font-weight:700; letter-spacing:1px; white-space:nowrap; }
.dino-score strong { margin-left:5px; color:#303a4b; font-variant-numeric:tabular-nums; }
#dinoCanvas { display:block; width:100%; height:108px; border-radius:9px; background:linear-gradient(180deg,#fbfcfd 0%,#fbfcfd 72%,#f4f6f8 72%,#f4f6f8 100%); cursor:pointer; touch-action:manipulation; }
@media(max-width:1180px) { .dino-strip { margin-left:24px; margin-right:24px; } }
@media(max-width:700px) { .dino-strip { display:none!important; } }