:root{
  --teal:#00C3A0;--teal-2:#00D6BC;--navy:#14273c;--navy-2:#182c42;--navy-3:#0e1d2e;
  --gold:#FFD66B;--coral:#FF6B9D;--alert:#EF4444;--white:#fff;--soft:rgba(255,255,255,.72);
  --line:rgba(255,255,255,.12);--radius:26px;--shadow:0 20px 50px rgba(0,0,0,.35);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:'Inter',system-ui,sans-serif;color:var(--white);
  background:radial-gradient(120% 120% at 50% 0%,#1b3552 0%,var(--navy) 45%,var(--navy-3) 100%);
  min-height:100vh;overflow-x:hidden;position:relative}
h1,h2,h3{font-family:'Sora',sans-serif;letter-spacing:-.02em}

/* Estrellas ambiente (suaves) */
#stars{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;transition:opacity .6s}
body.serious #stars{opacity:0}
.star{position:absolute;top:-30px;color:var(--gold);opacity:0;will-change:transform,opacity;
  animation:fall linear infinite,twinkle ease-in-out infinite}
@keyframes fall{0%{transform:translateY(-30px) translateX(0);opacity:0}
  12%{opacity:.55}88%{opacity:.45}100%{transform:translateY(105vh) translateX(24px);opacity:0}}
@keyframes twinkle{0%,100%{filter:drop-shadow(0 0 2px var(--gold))}50%{filter:drop-shadow(0 0 7px var(--teal-2))}}

/* Estrellas fugaces */
#shooting{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.shoot{position:absolute;width:130px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,rgba(255,255,255,0),var(--teal-2),#fff);
  filter:drop-shadow(0 0 6px var(--teal-2));opacity:0;animation:shoot 1.2s ease-out forwards}
@keyframes shoot{0%{opacity:0;transform:translate(0,0) rotate(20deg) scaleX(.3)}
  9%{opacity:1}100%{opacity:0;transform:translate(72vw,26vh) rotate(20deg) scaleX(1)}}

.burst{position:fixed;z-index:60;pointer-events:none;font-size:20px;animation:burst .9s ease-out forwards}
@keyframes burst{0%{transform:translate(0,0) scale(.4);opacity:1}
  100%{transform:translate(var(--bx),var(--by)) scale(1.05) rotate(160deg);opacity:0}}

.wrap{position:relative;z-index:1;max-width:980px;margin:0 auto;padding:28px 20px 80px}
.topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}
.brand{display:flex;align-items:center;gap:12px;font-weight:700;font-size:15px}
.logo-pill{display:inline-flex}
.logo-pill svg path[fill="#334155"]{fill:#fff}
.brand .logo-pill svg{height:24px;width:auto;display:block}
.hero .logo-pill{margin-bottom:22px}
.hero .logo-pill svg{height:48px;width:auto;display:block}
.back{border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--white);
  padding:10px 16px;border-radius:999px;font:600 14px 'Inter';cursor:pointer;transition:.2s}
.back:hover{background:rgba(255,255,255,.12)}
.hidden{display:none!important}

.hero{text-align:center;margin:34px 0 40px}
.hero h1{font-size:clamp(40px,8vw,74px);font-weight:800;line-height:1.02}
.hero h1 .hl{background:linear-gradient(120deg,var(--teal-2),var(--gold));
  -webkit-background-clip:text;background-clip:text;color:transparent}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
.card{position:relative;border-radius:var(--radius);padding:26px 24px 24px;cursor:pointer;
  background:rgba(255,255,255,.045);border:1px solid var(--line);overflow:hidden;
  transition:transform .25s,box-shadow .25s,border-color .25s}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:rgba(0,214,188,.5)}
.card:focus-visible{outline:3px solid var(--teal-2);outline-offset:3px}
.card .glow{position:absolute;inset:-40% 40% auto -40%;height:180px;filter:blur(46px);opacity:.5;border-radius:50%}
.card .emoji{font-size:44px;margin-bottom:14px;display:block}
.card h3{font-size:23px;font-weight:700;margin-bottom:8px}
.card p{color:var(--soft);font-size:15px;line-height:1.5}
.card .go{margin-top:18px;display:inline-flex;gap:8px;font-weight:700;color:var(--teal-2)}
.card.c1 .glow{background:var(--teal)}.card.c2 .glow{background:var(--teal-2)}.card.c3 .glow{background:var(--gold)}
.tag{position:absolute;top:16px;right:16px;font-size:11px;font-weight:700;letter-spacing:.04em;
  padding:5px 10px;border-radius:999px;background:rgba(0,0,0,.25);color:var(--soft)}

.screen h2{font-size:clamp(26px,4vw,38px);font-weight:800;text-align:center}
.screen .sub{text-align:center;color:var(--soft);max-width:640px;margin:10px auto 6px;font-size:16px}
.how{max-width:640px;margin:4px auto 22px;text-align:center;color:var(--teal-2);font-weight:600;font-size:14px}
.stage{display:flex;flex-direction:column;align-items:center;gap:24px}

.spinner{position:relative;width:min(72vw,300px);aspect-ratio:1}
.spinner .ring{position:absolute;inset:0;border-radius:50%;
  background:conic-gradient(var(--teal),var(--teal-2),var(--gold),var(--teal-2),var(--teal));
  box-shadow:0 0 0 6px rgba(0,195,160,.3),var(--shadow)}
.spinner.spin .ring{animation:ringspin .5s linear infinite}
@keyframes ringspin{to{transform:rotate(360deg)}}
.spinner .inner{position:absolute;inset:10%;border-radius:50%;
  background:linear-gradient(160deg,var(--navy),var(--navy-2));display:grid;place-items:center;
  text-align:center;padding:18px;border:2px solid rgba(255,255,255,.06)}
.spinner .center{font-family:'Sora';font-weight:800;font-size:clamp(20px,4.6vw,30px);color:#fff;line-height:1.15}
.spinner .center.pop{animation:pop .5s ease}
@keyframes pop{0%{transform:scale(.55);opacity:.3}60%{transform:scale(1.14)}100%{transform:scale(1)}}

.spin-btn{border:0;cursor:pointer;font:800 20px 'Sora';color:var(--navy);padding:16px 42px;border-radius:999px;
  background:linear-gradient(135deg,var(--teal),var(--teal-2));box-shadow:0 12px 30px rgba(0,195,160,.5);
  transition:transform .15s,box-shadow .2s}
.spin-btn:hover{transform:translateY(-2px)}.spin-btn:active{transform:translateY(1px)}
.spin-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn-row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.btn-ghost{border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--white);
  padding:16px 28px;border-radius:999px;font:700 16px 'Inter';cursor:pointer;transition:.2s}
.btn-ghost:hover{background:rgba(255,255,255,.12)}.btn-ghost:disabled{opacity:.4;cursor:not-allowed}
.link-mini{background:none;border:0;color:var(--soft);font:600 13px 'Inter';cursor:pointer;text-decoration:underline;padding:6px}
.link-mini:hover{color:var(--white)}

.reveal{width:min(92vw,580px);border-radius:var(--radius);padding:28px 26px;text-align:center;
  background:linear-gradient(160deg,rgba(0,195,160,.16),rgba(255,255,255,.05));
  border:1px solid rgba(0,214,188,.4);box-shadow:var(--shadow);
  opacity:0;transform:translateY(14px) scale(.98);transition:.45s ease}
.reveal.show{opacity:1;transform:translateY(0) scale(1)}
.reveal .kicker{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.reveal .big{font-family:'Sora';font-weight:800;font-size:clamp(26px,5vw,40px);margin:8px 0}
.reveal .big.pop{animation:pop .45s ease}
.scoreboard{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:12px}
.scoreboard .chip{background:rgba(0,214,188,.14);border:1px solid rgba(0,214,188,.35);color:var(--teal-2);
  font:700 13px 'Inter';padding:6px 12px;border-radius:999px}
.btn-ghost.good{background:rgba(0,214,188,.18);border-color:rgba(0,214,188,.5);color:var(--teal-2)}
.reveal .board{margin-top:16px;text-align:left;max-width:320px;margin-left:auto;margin-right:auto}
.reveal .scorow{display:flex;justify-content:space-between;padding:6px 10px;border-bottom:1px solid var(--line)}
.reveal .scorow b{color:var(--teal-2)}
.reveal .role{display:inline-block;margin-top:4px;padding:7px 16px;border-radius:999px;
  background:rgba(255,255,255,.12);font-weight:600}
.reveal .team{display:block;margin-top:8px;color:var(--soft);font-size:14px;font-weight:600}
.reveal .q{font-family:'Sora';font-weight:700;font-size:clamp(20px,3.6vw,28px);line-height:1.3;margin:12px 0}
.reveal .author{color:var(--soft);font-size:14px;font-weight:600}
.answer{margin-top:16px;padding-top:16px;border-top:1px dashed var(--line);font-size:16px;line-height:1.55;text-align:left}
.answer .lab{font-weight:700;color:var(--teal-2);display:block;margin-bottom:6px}
.progress{color:var(--soft);font-size:14px;font-weight:600}
.demo-note{margin-top:6px;font-size:12px;color:var(--gold);opacity:.85;text-align:center;max-width:540px}
.footer-note{text-align:center;color:rgba(255,255,255,.4);font-size:12px;margin-top:40px}
/* Agenda */
.agenda-sub{text-align:center;color:var(--soft);margin:-20px 0 22px;font-size:13px}
.agenda{max-width:640px;margin:0 auto}
.ag-item{display:flex;gap:14px;align-items:stretch}
.ag-time{flex:0 0 66px;text-align:right;font:700 11px 'Sora';color:var(--teal-2);padding-top:13px;line-height:1.25}
.ag-line{position:relative;flex:0 0 16px;display:flex;justify-content:center}
.ag-line::before{content:"";position:absolute;top:0;bottom:0;width:2px;background:var(--line)}
.ag-item:first-child .ag-line::before{top:22px}
.ag-item:last-child .ag-line::before{bottom:auto;height:22px}
.ag-dot{width:13px;height:13px;border-radius:50%;background:var(--navy-2);border:2px solid var(--line);margin-top:13px;z-index:1}
.ag-item.act .ag-dot{background:var(--teal-2);border-color:var(--teal-2);box-shadow:0 0 0 4px rgba(0,214,188,.2)}
.ag-card{flex:1;border-radius:13px;padding:9px 13px;margin-bottom:8px;background:rgba(255,255,255,.04);
  border:1px solid var(--line);display:flex;align-items:center;gap:13px}
.ag-item.act .ag-card{cursor:pointer;border-color:rgba(0,214,188,.45);background:rgba(0,195,160,.09);
  transition:transform .2s,box-shadow .2s}
.ag-item.act .ag-card:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.ag-item.act .ag-card:focus-visible{outline:3px solid var(--teal-2);outline-offset:2px}
.ag-emoji{font-size:19px;flex:0 0 auto}
.ag-body{flex:1;min-width:0}
.ag-title{font:700 14px 'Sora'}
.ag-desc{color:var(--soft);font-size:11px;margin-top:1px}
.ag-btn{flex:0 0 auto;font:800 11px 'Sora';color:var(--navy);white-space:nowrap;
  background:linear-gradient(135deg,var(--teal),var(--teal-2));padding:7px 13px;border-radius:999px}
.ag-badge{flex:0 0 auto;font-size:10px;font-weight:700;color:var(--soft);
  background:rgba(255,255,255,.06);padding:6px 12px;border-radius:999px}
/* Video */
.video-wrap{position:relative;width:min(92vw,860px);margin:8px auto 0;aspect-ratio:16/9;
  border-radius:18px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);background:#000}
.video-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* Cultura / Lectura */
.culture{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:30px}
.culture .block h3{font-family:'Sora';font-size:20px;margin-bottom:14px;text-align:center}
.imgbox{border-radius:18px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);
  background:rgba(255,255,255,.04)}
.imgbox img{width:100%;display:block}
.placeholder{aspect-ratio:16/9;display:grid;place-items:center;color:var(--soft);font-size:14px;
  text-align:center;padding:24px;line-height:1.5}
.culture-pager{max-width:860px;margin:0 auto}
.cpage{animation:fadeIn .4s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.books{display:flex;flex-wrap:wrap;gap:18px;justify-content:center;margin-top:14px}
.book{width:min(30vw,150px);animation:floaty 3s ease-in-out infinite}
.book:nth-child(2){animation-delay:.35s}.book:nth-child(3){animation-delay:.7s}
.book:nth-child(4){animation-delay:1.05s}.book:nth-child(5){animation-delay:1.4s}
@keyframes floaty{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-14px) rotate(1.5deg)}}
.book .imgbox{border-radius:12px}
.book .imgbox .placeholder{aspect-ratio:2/3;font-size:13px}
.read-list{max-width:600px;margin:18px auto 0;list-style:none;display:flex;flex-direction:column;gap:12px;text-align:left}
.read-list li{background:rgba(255,255,255,.05);border:1px solid var(--line);border-left:3px solid var(--teal-2);
  border-radius:12px;padding:13px 16px;font-size:15px;line-height:1.45}
.anniv-title{text-align:center;padding:44px 20px}
.anniv-title .spark{font-size:58px;animation:pop .6s ease}
.anniv-title h1{font-size:clamp(34px,7vw,60px);font-weight:800;margin:10px 0;
  background:linear-gradient(120deg,var(--teal-2),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
.imgbox.photo{max-width:min(92vw,680px);margin:8px auto 0}
.imgbox.photo .placeholder{aspect-ratio:3/4}
@media (prefers-reduced-motion:reduce){.book{animation:none}}

/* Panel admin (demo) */
.admin{width:min(92vw,600px);margin-top:8px;border-radius:20px;padding:20px;
  background:rgba(0,0,0,.28);border:1px solid var(--line);text-align:left}
.admin h4{font-family:'Sora';font-size:16px;margin-bottom:4px}
.admin .muted{color:var(--soft);font-size:13px;margin-bottom:14px}
.admin .qitem{display:flex;gap:10px;align-items:flex-start;padding:10px 8px;border-bottom:1px solid var(--line)}
.admin .qitem:last-child{border-bottom:0}
.admin .qitem input{margin-top:3px;width:18px;height:18px;accent-color:var(--teal)}
.admin .qitem label{font-size:14px;line-height:1.4;cursor:pointer}
.admin .qitem .who{color:var(--soft);font-size:12px;display:block;margin-top:2px}
.admin .off label{opacity:.4;text-decoration:line-through}
.admin input{background:rgba(0,0,0,.3);border:1px solid var(--line);border-radius:12px;color:#fff;
  font:500 15px 'Inter';padding:11px 13px;flex:1;min-width:140px;outline:none}
.admin input:focus{border-color:var(--teal-2)}
.admin .lockrow{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}
.btn-mini2{border:0;cursor:pointer;font:800 14px 'Sora';color:var(--navy);padding:11px 18px;border-radius:999px;
  background:linear-gradient(135deg,var(--teal),var(--teal-2))}
.btn-mini2.ghost{background:rgba(255,255,255,.06);color:#fff;border:1px solid var(--line)}
.admin .acts{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;align-items:center}
.admin .badge{font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px}
.admin .badge.on{background:rgba(0,214,188,.18);color:var(--teal-2)}
.admin .badge.off{background:rgba(255,255,255,.08);color:var(--soft)}
.admin .tgt{display:inline-block;margin-top:4px;font-size:11px;font-weight:700;color:var(--gold);
  background:rgba(255,214,107,.12);padding:2px 8px;border-radius:999px}

/* Reloj countdown */
.timer{display:flex;flex-direction:column;align-items:center;gap:6px;margin:16px 0 4px}
.timer .ringwrap{position:relative;width:74px;height:74px}
.timer svg{transform:rotate(-90deg)}
.timer .tnum{position:absolute;inset:0;display:grid;place-items:center;
  font-family:'Sora';font-weight:800;font-size:26px;color:var(--white)}
.timer .tlab{font-size:12px;color:var(--soft);font-weight:600}
.timer.warn .tnum{color:var(--alert)}

@media (prefers-reduced-motion:reduce){
  .star,.burst,.shoot{animation:none!important;display:none}
  .spinner.spin .ring{animation:none}.reveal{transition:none}
}

/* ===== BAQ: agregados sobre el estilo original ===== */
/* Responsable en la agenda */
.ag-desc .who-lab{opacity:.7}
/* Pausas (desayuno / almuerzo): estado distinto, no clicables */
.ag-item.pause .ag-card{background:transparent;border-style:dashed;opacity:.72}
.ag-item.pause .ag-dot{background:transparent;border-style:dashed}
.ag-item.pause .ag-title{font-weight:600;color:var(--soft)}
.ag-badge.pause{background:rgba(255,214,107,.12);color:var(--gold)}
/* Juego por equipos */
.reveal .members{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:10px}
.reveal .members span{font-size:12px;font-weight:600;color:var(--soft);background:rgba(255,255,255,.06);
  border:1px solid var(--line);padding:4px 10px;border-radius:999px}
.scoreboard .chip.lead{background:rgba(255,214,107,.16);border-color:rgba(255,214,107,.45);color:var(--gold)}
.reveal .scorow.top b,.reveal .scorow.top span{color:var(--gold)}
/* Diapositivas genéricas (producto / cultura / AI) */
.cpage .imgs{display:flex;flex-direction:column;gap:18px;max-width:820px;margin:18px auto 0}
.cpage .imgs.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.cpage .text{max-width:640px;margin:16px auto 0;color:var(--soft);font-size:16px;line-height:1.6;text-align:center}
.pager-dots{display:flex;gap:7px;justify-content:center;margin-top:18px}
.pager-dots i{width:7px;height:7px;border-radius:50%;background:var(--line);transition:.25s}
.pager-dots i.on{background:var(--teal-2);width:20px;border-radius:999px}
.todo{display:inline-block;font:700 10px 'Inter';letter-spacing:.06em;color:var(--navy);background:var(--gold);
  padding:2px 7px;border-radius:999px;vertical-align:middle;margin-left:6px}
.load-err{max-width:560px;margin:40px auto;text-align:center;color:var(--soft);line-height:1.6}
.load-err code{color:var(--gold)}
.demo-note a{color:var(--gold)}
@media (max-width:480px){
  .ag-time{flex-basis:54px;font-size:10px}
  .ag-btn{padding:6px 10px;font-size:10px}
  .btn-ghost{padding:14px 20px;font-size:15px}
}
