/* Guion de grabación — Emerson Ecuavoley. Misma identidad que emersonecuavoley.com */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0e0e0e;--bg-card:#161616;--bg-soft:#1c1c1c;--border:rgba(255,255,255,.09);
  --accent:#f5c800;--accent-dim:rgba(245,200,0,.12);--accent-line:rgba(245,200,0,.35);
  --text:#f4f4f4;--text-2:#b4b9c2;--muted:#7b8190;
  --ok:#3ccf7a;--ok-dim:rgba(60,207,122,.12);--warn:#ff8a3d;--warn-dim:rgba(255,138,61,.12);
  --blue:#59a8ff;--blue-dim:rgba(89,168,255,.12);
  --radius:14px;--nav-h:54px;
  --font:'Inter','Segoe UI',system-ui,sans-serif;
}
:root[data-theme="light"]{
  --bg:#f6f5f0;--bg-card:#ffffff;--bg-soft:#f0eee6;--border:rgba(0,0,0,.1);
  --accent:#b58f00;--accent-dim:rgba(181,143,0,.1);--accent-line:rgba(181,143,0,.4);
  --text:#151515;--text-2:#3d4249;--muted:#6b7280;
  --ok:#14883f;--ok-dim:rgba(20,136,63,.1);--warn:#c25400;--warn-dim:rgba(194,84,0,.1);
  --blue:#1d64c4;--blue-dim:rgba(29,100,196,.1);
}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 12px);-webkit-text-size-adjust:100%}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.55;-webkit-font-smoothing:antialiased;font-size:16px}
a{color:var(--accent)}
img{max-width:100%;display:block}
.wrap{max-width:900px;margin:0 auto;padding:0 16px}

/* barra superior */
.nav{position:sticky;top:0;z-index:20;height:var(--nav-h);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.nav .wrap{display:flex;align-items:center;gap:10px;height:100%}
.brand{font-weight:800;letter-spacing:-.01em;white-space:nowrap;font-size:.95rem;color:var(--text);text-decoration:none}
.brand b{color:var(--accent)}
.prog{flex:1;min-width:60px;height:8px;background:var(--bg-soft);border-radius:99px;overflow:hidden;border:1px solid var(--border)}
.prog i{display:block;height:100%;width:0;background:var(--accent);transition:width .3s}
.prog-txt{font-size:.75rem;color:var(--text-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.icon-btn{background:var(--bg-soft);border:1px solid var(--border);color:var(--text);border-radius:10px;height:34px;min-width:34px;padding:0 9px;font:inherit;font-size:.8rem;cursor:pointer}

/* portada */
.hero{padding:28px 0 18px;display:grid;grid-template-columns:1fr;gap:18px}
.hero-top{display:flex;gap:16px;align-items:center}
.hero-top img{width:84px;height:84px;border-radius:50%;object-fit:cover;border:3px solid var(--accent);flex:none}
.kicker{font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
h1{font-size:clamp(1.6rem,6vw,2.4rem);font-weight:800;line-height:1.12;letter-spacing:-.02em}
h2{font-size:clamp(1.3rem,4.6vw,1.75rem);font-weight:800;line-height:1.2;letter-spacing:-.01em;margin-bottom:6px}
h3{font-size:1.06rem;font-weight:800;line-height:1.3}
.lead{color:var(--text-2);font-size:1.02rem}
.hero-banner{border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);aspect-ratio:16/8;object-fit:cover;width:100%}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media(min-width:640px){.stats{grid-template-columns:repeat(4,1fr)}}
.stat{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:12px}
.stat b{display:block;font-size:1.45rem;font-weight:800;color:var(--accent);line-height:1.1}
.stat span{font-size:.78rem;color:var(--text-2)}

/* filtros por rol */
.roles{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 2px}
.chip{border:1px solid var(--border);background:var(--bg-card);color:var(--text);border-radius:99px;padding:8px 13px;font:inherit;font-size:.85rem;font-weight:700;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--accent);color:#111;border-color:var(--accent)}

/* índice */
.toc{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;margin:14px 0}
.toc ol{list-style:none;columns:1;gap:24px}
@media(min-width:640px){.toc ol{columns:2}}
.toc li{break-inside:avoid;padding:4px 0}
.toc a{color:var(--text);text-decoration:none;font-size:.92rem;display:flex;gap:8px;align-items:baseline}
.toc a span{color:var(--accent);font-weight:800;font-size:.78rem;min-width:24px}
.toc a em{font-style:normal;color:var(--muted);font-size:.75rem;margin-left:auto}

/* secciones */
section.sec{padding:26px 0 8px;border-top:1px solid var(--border);margin-top:16px}
.sec-head{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
.sec-num{flex:none;background:var(--accent);color:#111;font-weight:800;border-radius:9px;min-width:34px;height:34px;display:grid;place-items:center;font-size:.9rem}
.sec-desc{color:var(--text-2);margin-bottom:10px}
.who{display:inline-flex;gap:6px;flex-wrap:wrap;margin:2px 0 8px}
.tag{font-size:.68rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;border-radius:99px;padding:3px 8px;border:1px solid var(--border);color:var(--text-2);background:var(--bg-soft)}
.tag.reel{color:var(--accent);border-color:var(--accent-line);background:var(--accent-dim)}
.tag.curso{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 40%,transparent);background:var(--ok-dim)}
.tag.yt{color:var(--warn);border-color:color-mix(in srgb,var(--warn) 40%,transparent);background:var(--warn-dim)}
.tag.venta{color:var(--blue);border-color:color-mix(in srgb,var(--blue) 40%,transparent);background:var(--blue-dim)}

/* tarjetas y bloques */
.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:16px;margin:12px 0}
.card.accent{border-color:var(--accent-line);background:linear-gradient(180deg,var(--accent-dim),transparent 70%),var(--bg-card)}
.card.warn{border-color:color-mix(in srgb,var(--warn) 45%,transparent)}
.card h3{margin-bottom:8px}
.card p+p{margin-top:8px}
.card ul,.card ol{padding-left:20px}
.card li{margin:5px 0}
.card li::marker{color:var(--accent)}
.small{font-size:.86rem;color:var(--text-2)}
.grid2{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:720px){.grid2{grid-template-columns:1fr 1fr}}
blockquote{border-left:3px solid var(--accent);padding:6px 12px;margin:10px 0;color:var(--text-2);background:var(--bg-soft);border-radius:0 10px 10px 0}

/* bloques de preguntas */
details.blk{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);margin:12px 0;overflow:hidden}
details.blk>summary{list-style:none;cursor:pointer;padding:14px 16px;display:flex;gap:10px;align-items:center}
details.blk>summary::-webkit-details-marker{display:none}
details.blk>summary .chev{margin-left:auto;transition:transform .2s;color:var(--muted)}
details.blk[open]>summary .chev{transform:rotate(90deg)}
.blk-id{flex:none;font-weight:800;color:#111;background:var(--accent);border-radius:7px;padding:2px 7px;font-size:.78rem}
.blk-t{font-weight:800;line-height:1.25}
.blk-meta{font-size:.76rem;color:var(--muted);display:block;font-weight:500;margin-top:2px}
.blk-count{font-size:.75rem;color:var(--text-2);white-space:nowrap;font-variant-numeric:tabular-nums}
.blk-body{padding:0 16px 14px;border-top:1px solid var(--border)}
.blk-intro{padding:12px 0 4px;color:var(--text-2);font-size:.92rem}
.blk-intro b{color:var(--text)}
ol.qs{list-style:none;counter-reset:q}
ol.qs>li{counter-increment:q;padding:12px 0;border-top:1px dashed var(--border);display:grid;grid-template-columns:30px 1fr;gap:6px 8px}
ol.qs>li:first-child{border-top:0}
.qchk{appearance:none;width:24px;height:24px;border:2px solid var(--muted);border-radius:7px;margin-top:1px;cursor:pointer;display:grid;place-items:center;background:var(--bg)}
.qchk:checked{background:var(--ok);border-color:var(--ok)}
.qchk:checked::after{content:"✓";color:#fff;font-weight:800;font-size:15px}
li.done .qtext{opacity:.5;text-decoration:line-through;text-decoration-color:var(--ok)}
.qtext{font-weight:700;font-size:1.02rem;line-height:1.4}
.qtext::before{content:counter(q) ". ";color:var(--accent)}
.qtext .star{color:var(--accent)}
.qx{grid-column:2;display:flex;flex-direction:column;gap:5px;font-size:.86rem;color:var(--text-2)}
.qx .row{display:flex;gap:6px;align-items:baseline}
.qx .lbl{flex:none;font-size:.66rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;border-radius:6px;padding:2px 6px;background:var(--bg-soft);color:var(--text-2);border:1px solid var(--border)}
.qx .lbl.rp{color:var(--accent);border-color:var(--accent-line)}
.qx .lbl.cam{color:var(--blue);border-color:color-mix(in srgb,var(--blue) 40%,transparent)}
.qx .lbl.ok{color:var(--ok);border-color:color-mix(in srgb,var(--ok) 40%,transparent)}

/* tablas */
.tbl-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:12px;margin:12px 0;background:var(--bg-card)}
table{border-collapse:collapse;width:100%;font-size:.88rem;min-width:560px}
th,td{text-align:left;padding:9px 11px;border-bottom:1px solid var(--border);vertical-align:top}
th{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);background:var(--bg-soft);position:sticky;top:0}
tr:last-child td{border-bottom:0}
td b{color:var(--text)}
.time{font-weight:800;color:var(--accent);white-space:nowrap;font-variant-numeric:tabular-nums}

/* tomas */
.shot{display:grid;grid-template-columns:30px 1fr;gap:4px 8px;padding:10px 0;border-top:1px dashed var(--border)}
.shot:first-child{border-top:0}
.shot .st{font-weight:700}
.shot .sd{grid-column:2;font-size:.86rem;color:var(--text-2)}
.shot.done .st{opacity:.5;text-decoration:line-through}

.foot{padding:30px 0 60px;color:var(--muted);font-size:.82rem;border-top:1px solid var(--border);margin-top:24px}
.hide{display:none!important}
.print-only{display:none}

@media print{
  :root{--bg:#fff;--bg-card:#fff;--bg-soft:#f3f3f3;--text:#000;--text-2:#222;--muted:#555;--border:#ccc;--accent:#8a6d00;--accent-dim:#fff8d6;--accent-line:#c9a400}
  .nav,.roles,.no-print,.hero-banner{display:none!important}
  details.blk>.blk-body{display:block!important}
  details.blk{break-inside:auto}
  ol.qs>li{break-inside:avoid}
  section.sec{break-before:auto}
  body{font-size:11.5pt}
  .print-only{display:block}
  a{color:#000;text-decoration:none}
}

/* plan del día: cabe en el celular sin deslizar */
table.plan{min-width:0}
table.plan td:last-child{white-space:nowrap;font-size:.8rem}
@media(max-width:520px){
  table.plan th,table.plan td{padding:8px 7px}
  table.plan td.time{font-size:.82rem}
  table.plan th:last-child,table.plan td:last-child{width:1%}
}