@font-face{font-family:'Archivo';font-style:normal;font-weight:400 800;font-display:swap;
  src:url(assets/archivo-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Archivo';font-style:normal;font-weight:400 800;font-display:swap;
  src:url(assets/archivo-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(assets/inter-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;
  src:url(assets/inter-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

:root{
  --page:#EDF1F6;
  --surface:#FFFFFF;
  --line:#DFE6EE;
  --line-2:#EDF1F6;
  --ink:#001E3A;
  --ink-2:#123A5E;
  --dim:#5F7488;
  --cobre:#B47E68;
  --cobre-deep:#95614A;
  --cobre-soft:#F8F0EB;
  --ok:#17835B;
  --plate:#001E3A;
  --r:16px;
  --sh:0 1px 2px rgba(0,30,58,.05), 0 8px 24px -12px rgba(0,30,58,.16);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--page); color:var(--ink);
  font-family:'Inter',system-ui,sans-serif; font-size:16px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
  padding-bottom:env(safe-area-inset-bottom);
}
h1,h2,h3,.num{font-family:'Archivo','Inter',sans-serif; letter-spacing:-.02em; margin:0}
button,input{font:inherit; color:inherit}
button{cursor:pointer}

/* ---------- topo ---------- */
.top{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:18px 20px; max-width:820px; margin:0 auto;
}
.top .marca{height:30px; width:auto; display:block}
.oculto{display:none !important}

main{max-width:820px; margin:0 auto; padding:0 20px 64px}

/* ---------- passos ---------- */
.paso{display:none; animation:sube .35s ease both}
.paso.activo{display:block}
@keyframes sube{from{opacity:0; transform:translateY(10px)} to{opacity:1; transform:none}}

.intro{padding:8px 0 34px}
.eyebrow{
  display:inline-block; font-size:.72rem; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--cobre-deep); margin-bottom:14px;
}
h1{font-size:clamp(2rem,7vw,3.1rem); font-weight:700; line-height:1.08}
h1 em{font-style:normal; color:var(--cobre-deep)}
.lede{color:var(--dim); font-size:1.05rem; max-width:44ch; margin:16px 0 0}

.pregunta{
  font-size:clamp(1.25rem,4.2vw,1.6rem); font-weight:700;
  display:flex; align-items:center; gap:12px; margin:0 0 6px;
}
.paso-num{
  flex:0 0 auto; width:30px; height:30px; border-radius:50%;
  background:var(--plate); color:#fff; font-size:.9rem; font-weight:700;
  display:grid; place-items:center; letter-spacing:0;
}
.ayuda{color:var(--dim); font-size:.95rem; margin:6px 0 0; padding-left:42px}

.volver{
  border:0; background:none; color:var(--dim); padding:6px 0; margin-bottom:14px;
  font-size:.9rem; font-weight:600;
}
.volver::before{content:'\2190\00a0'}
.volver:hover{color:var(--ink)}

/* ---------- cards de ruta ---------- */
.rutas{display:grid; gap:12px; margin-top:22px}
.ruta{
  display:block; width:100%; text-align:left; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r); padding:18px 20px;
  box-shadow:var(--sh); transition:border-color .18s, transform .18s, box-shadow .18s;
  position:relative; overflow:hidden;
}
.ruta::before{
  content:''; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:var(--cobre); opacity:0; transition:opacity .18s;
}
.ruta:hover{border-color:var(--cobre); transform:translateY(-2px);
  box-shadow:0 2px 4px rgba(0,30,58,.06), 0 16px 32px -16px rgba(0,30,58,.28)}
.ruta:hover::before{opacity:1}
.ruta .rt{display:block; font-family:'Archivo',sans-serif; font-size:1.12rem; font-weight:700; line-height:1.25}
.ruta .rp{display:block; color:var(--dim); font-size:.92rem; margin:7px 0 0}
.ruta .rm{
  display:flex; flex-wrap:wrap; gap:8px; margin-top:14px;
  font-size:.78rem; font-weight:600; color:var(--ink-2);
}
.ruta .rm span{background:var(--line-2); border-radius:999px; padding:4px 11px}
.ruta .rm span.h{background:var(--cobre-soft); color:var(--cobre-deep)}

/* ---------- opções (horas / início) ---------- */
.opciones{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-top:24px}
.opc{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  padding:20px 16px; text-align:center; box-shadow:var(--sh);
  transition:border-color .18s, transform .18s;
}
.opc:hover{border-color:var(--cobre); transform:translateY(-2px)}
.opc .num{display:block; font-size:1.9rem; font-weight:700; line-height:1}
.opc .lb{display:block; color:var(--dim); font-size:.86rem; margin-top:6px}
.opc.txt .num{font-size:1.15rem}

.fecha-libre{margin-top:26px}
.fecha-libre label{display:block; font-size:.85rem; font-weight:600; color:var(--dim); margin-bottom:8px}
input[type=date],input[type=text],input[type=email]{
  width:100%; background:var(--surface); border:1px solid var(--line);
  border-radius:12px; padding:13px 14px; font-size:1rem; color:var(--ink);
}
input:focus{outline:2px solid var(--cobre); outline-offset:1px; border-color:transparent}

/* ---------- resumo do plano ---------- */
.resumen{
  background:var(--plate); color:#fff; border-radius:20px; padding:28px 26px;
  margin:6px 0 22px; position:relative; overflow:hidden;
}
.resumen::after{
  content:''; position:absolute; right:-70px; top:-70px; width:220px; height:220px;
  border-radius:50%; background:radial-gradient(circle,rgba(180,126,104,.42),transparent 68%);
  pointer-events:none; z-index:0;
}
.resumen > *{position:relative; z-index:1}
.resumen .et{
  font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--cobre); margin-bottom:12px;
}
.resumen h2{font-size:clamp(1.5rem,5.5vw,2.1rem); font-weight:700; line-height:1.15}
.resumen .fin{
  margin-top:16px; display:flex; flex-wrap:wrap; gap:22px; position:relative;
}
.resumen .fin div{min-width:0}
.resumen .fin b{
  display:block; font-family:'Archivo',sans-serif; font-size:1.2rem;
  font-weight:700; letter-spacing:-.01em;
}
.resumen .fin span{display:block; font-size:.74rem; color:rgba(255,255,255,.6);
  text-transform:uppercase; letter-spacing:.1em; margin-top:2px}
.resumen .meta{
  position:relative; margin-top:22px; padding-top:20px;
  border-top:1px solid rgba(255,255,255,.16);
}
.resumen .meta span{
  display:block; font-size:.72rem; color:var(--cobre);
  text-transform:uppercase; letter-spacing:.14em; font-weight:700; margin-bottom:6px;
}
.resumen .meta b{
  display:block; font-family:'Archivo',sans-serif; font-weight:700;
  font-size:clamp(1.45rem,5.4vw,1.9rem); line-height:1.15; letter-spacing:-.02em;
}

/* ---------- barra ---------- */
.barra-wrap{margin-bottom:20px}
.barra{height:8px; background:var(--line); border-radius:999px; overflow:hidden}
.barra span{
  display:block; height:100%; width:0; border-radius:999px;
  background:linear-gradient(90deg,var(--cobre),var(--cobre-deep));
  transition:width .4s cubic-bezier(.4,0,.2,1);
}
.barra-txt{font-size:.85rem; color:var(--dim); margin-top:9px}
.barra-txt b{color:var(--ink)}

/* ---------- ações ---------- */
.acciones{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:30px}
.acciones .cta{grid-column:1 / -1; width:100%}
@media(min-width:640px){
  .acciones{display:flex; flex-wrap:wrap}
  .acciones .cta{width:auto}
}
.cta{
  background:var(--cobre); color:#fff; border:0; border-radius:12px;
  padding:14px 24px; font-weight:700; font-size:.98rem;
  box-shadow:0 8px 20px -10px rgba(149,97,74,.8); transition:background .18s, transform .18s;
}
.cta:hover{background:var(--cobre-deep); transform:translateY(-1px)}
.cta.chico{padding:13px 20px}
.ghost{
  background:var(--surface); color:var(--ink); border:1px solid var(--line);
  border-radius:12px; padding:14px 16px; font-weight:600; font-size:.88rem;
  transition:border-color .18s;
}
.ghost:hover{border-color:var(--ink)}
#btn-reiniciar{
  background:none; border:0; color:var(--dim); font-size:.84rem;
  font-weight:600; padding:6px 0; text-decoration:underline;
}
#btn-reiniciar:hover{color:var(--ink)}
.link{background:none; border:0; color:var(--cobre-deep); font-size:.88rem;
  font-weight:600; text-decoration:underline; padding:8px 0}

/* ---------- semanas ---------- */
.semanas{display:grid; gap:14px}
.sem{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  box-shadow:var(--sh); overflow:hidden;
}
.sem.ahora{border-color:var(--cobre); box-shadow:0 0 0 3px var(--cobre-soft), var(--sh)}
.sem.lista{opacity:.62}
.sem-h{display:flex; align-items:center; gap:14px; padding:16px 18px; background:var(--surface)}
.sem-n{
  flex:0 0 auto; width:38px; height:38px; border-radius:11px; background:var(--line-2);
  color:var(--ink); display:grid; place-items:center;
  font-family:'Archivo',sans-serif; font-weight:700; font-size:1rem;
}
.sem.ahora .sem-n{background:var(--cobre); color:#fff}
.sem.lista .sem-n{background:var(--ok); color:#fff}
.sem-t{flex:1; min-width:0}
.sem-t b{display:block; font-family:'Archivo',sans-serif; font-size:1rem; font-weight:700}
.sem-t span{display:block; font-size:.81rem; color:var(--dim); margin-top:2px}
.tag-ahora{
  display:inline-block; font-size:.64rem; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--cobre-deep); margin-bottom:3px;
}
.sem-b{border-top:1px solid var(--line-2); padding:6px 18px 14px}
.curso-lb{
  font-size:.7rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:var(--cobre-deep); margin:14px 0 4px;
}
.aula{display:flex; align-items:flex-start; gap:12px; padding:9px 0; cursor:pointer}
.aula input{
  appearance:none; -webkit-appearance:none; flex:0 0 auto; margin:1px 0 0;
  width:21px; height:21px; border:1.8px solid var(--line); border-radius:7px;
  background:var(--surface); transition:background .15s, border-color .15s; cursor:pointer;
}
.aula input:checked{background:var(--ok); border-color:var(--ok)}
.aula input:checked::after{
  content:''; display:block; width:5px; height:10px; margin:3px auto 0;
  border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg);
}
.aula .an{flex:1; min-width:0; font-size:.93rem; line-height:1.4}
.aula input:checked + .an{color:var(--dim); text-decoration:line-through}
.aula .ad{flex:0 0 auto; font-size:.8rem; color:var(--dim); font-variant-numeric:tabular-nums}

/* ---------- guardar ---------- */
.guardar{
  margin-top:34px; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r); padding:24px; box-shadow:var(--sh);
}
.guardar h3{font-size:1.1rem; font-weight:700}
.guardar p{color:var(--dim); font-size:.92rem; margin:8px 0 0}
.guardar-form{display:grid; gap:10px; margin-top:16px}
@media(min-width:640px){.guardar-form{grid-template-columns:1fr 1fr auto}}
.guardar-links{display:flex; flex-wrap:wrap; gap:18px; margin-top:4px}

/* ---------- paso 5 · correo ---------- */
.correo-caja{
  margin-top:22px; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r); padding:24px; box-shadow:var(--sh);
  display:grid; gap:12px;
}
.correo-caja .cta{width:100%}
.correo-caja .link{justify-self:center; margin-top:2px}

/* ---------- volver a un plan guardado (pantalla 1) ---------- */
.volver-caja{margin:18px 0 4px; text-align:center}
.volver-form{display:grid; gap:10px; margin-top:12px; text-align:left}
@media(min-width:520px){.volver-form{grid-template-columns:1fr auto}}
.volver-caja .estado{text-align:center}
.estado{font-size:.87rem; margin-top:12px !important; min-height:1.2em}
.estado.ok{color:var(--ok); font-weight:600}
.estado.err{color:#B3261E; font-weight:600}

/* ---------- pé ---------- */
.pie{
  border-top:1px solid var(--line); margin-top:20px; padding:26px 20px 40px;
  text-align:center; color:var(--dim); font-size:.82rem;
}
.pie img{height:24px; opacity:.5; margin-bottom:10px}
.pie p{margin:0}

/* ---------- impressão ---------- */
#impreso{display:none}
@media print{
  @page{margin:14mm 12mm}
  body{background:#fff; font-size:10.5pt}
  .top,.pie,main,.acciones{display:none !important}
  #impreso{display:block}
  .p-capa{text-align:center; padding:0 0 22mm; border-bottom:2px solid #001E3A; margin-bottom:10mm}
  .p-capa img{height:16mm; margin-bottom:8mm}
  .p-capa .pe{font-size:8pt; letter-spacing:.18em; text-transform:uppercase; color:#95614A; font-weight:700}
  .p-capa h1{font-size:22pt; margin:4mm 0 3mm; color:#001E3A}
  .p-capa .pn{font-size:12pt; color:#123A5E}
  .p-meta{display:flex; gap:10mm; justify-content:center; margin-top:7mm; font-size:9.5pt}
  .p-meta b{display:block; font-family:'Archivo',sans-serif; font-size:12pt}
  .p-meta span{color:#5F7488; font-size:8pt; text-transform:uppercase; letter-spacing:.08em}
  .p-sem{break-inside:avoid; page-break-inside:avoid; margin-bottom:6mm}
  .p-sem h3{font-size:11pt; color:#001E3A; border-bottom:1px solid #DFE6EE; padding-bottom:2mm; margin-bottom:2.5mm}
  .p-sem h3 small{float:right; font-weight:400; color:#5F7488; font-size:8.5pt}
  .p-cur{font-size:8pt; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#95614A; margin:3mm 0 1mm}
  .p-a{display:flex; gap:3mm; font-size:9.5pt; padding:1.1mm 0}
  .p-a i{flex:0 0 auto; width:3.5mm; height:3.5mm; border:.7pt solid #8FA3B5; border-radius:1mm; margin-top:1mm}
  .p-a u{flex:1; text-decoration:none}
  .p-a em{font-style:normal; color:#5F7488; font-size:8.5pt}
  .p-pie{margin-top:8mm; padding-top:4mm; border-top:1px solid #DFE6EE;
    text-align:center; font-size:8pt; color:#5F7488}
}

/* ==================== EVALUACIÓN ==================== */

/* --- tarjeta de entrada, al final del plan --- */
.eval-card{
  margin-top:34px; border-radius:20px; padding:26px 24px; position:relative; overflow:hidden;
  background:var(--plate); color:#fff;
}
.eval-card::after{
  content:''; position:absolute; left:-60px; bottom:-80px; width:220px; height:220px;
  border-radius:50%; background:radial-gradient(circle,rgba(180,126,104,.4),transparent 68%);
  pointer-events:none; z-index:0;
}
.eval-card > *{position:relative; z-index:1}
.eval-card .et{
  font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--cobre); margin-bottom:10px;
}
.eval-card h3{font-size:1.35rem; font-weight:700; line-height:1.2}
.eval-card p{color:rgba(255,255,255,.72); font-size:.93rem; margin:10px 0 0; max-width:46ch}
.eval-card .cta{margin-top:18px}
.eval-mejor{
  display:inline-flex; align-items:center; gap:9px; margin-top:16px;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16);
  border-radius:999px; padding:7px 15px; font-size:.85rem; font-weight:600;
}
.eval-mejor i{font-style:normal; font-size:1.1rem}

/* --- pantalla del quiz --- */
.paso.quiz{padding-top:6px}
.q-top{display:flex; align-items:center; justify-content:space-between; gap:16px}
.q-top .volver{margin-bottom:0}
.q-paso{font-size:.85rem; color:var(--dim); font-variant-numeric:tabular-nums}
.q-paso b{color:var(--ink); font-family:'Archivo',sans-serif; font-size:1rem}

.q-barra{height:5px; background:var(--line); border-radius:999px; overflow:hidden; margin:14px 0 22px}
.q-barra span{
  display:block; height:100%; width:0; border-radius:999px;
  background:linear-gradient(90deg,var(--cobre),var(--cobre-deep));
  transition:width .45s cubic-bezier(.4,0,.2,1);
}

.q-card{animation:sube .3s ease both}
.q-ruta{
  font-size:.7rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
  color:var(--cobre-deep); margin-bottom:12px;
}
.q-preg{
  font-size:clamp(1.2rem,4.6vw,1.6rem); font-weight:700; line-height:1.32;
  margin-bottom:24px;
}

.q-ops{display:grid; gap:11px}
.q-op{
  display:flex; align-items:flex-start; gap:14px; width:100%; text-align:left;
  background:var(--surface); border:1.5px solid var(--line); border-radius:15px;
  padding:16px 18px; font-size:.97rem; line-height:1.45; color:var(--ink);
  box-shadow:var(--sh); transition:border-color .16s, transform .16s, background .16s;
}
.q-op .letra{
  flex:0 0 auto; width:27px; height:27px; border-radius:9px; background:var(--line-2);
  color:var(--ink-2); font-family:'Archivo',sans-serif; font-weight:700; font-size:.85rem;
  display:grid; place-items:center; transition:background .16s, color .16s;
}
.q-op:not(:disabled):hover{border-color:var(--cobre); transform:translateY(-2px)}
.q-op:disabled{cursor:default}
.q-op.ok{border-color:var(--ok); background:#F0FAF5}
.q-op.ok .letra{background:var(--ok); color:#fff}
.q-op.mal{border-color:#C8443A; background:#FDF3F2}
.q-op.mal .letra{background:#C8443A; color:#fff}
.q-op.gris{opacity:.5}

.q-fb{
  display:none; margin-top:18px; border-radius:15px; padding:17px 19px;
  border-left:3px solid var(--cobre); background:var(--cobre-soft);
  animation:sube .28s ease both;
}
.q-fb.ver{display:block}
.q-fb b{display:block; font-family:'Archivo',sans-serif; font-size:.95rem; margin-bottom:7px}
.q-fb p{margin:0; font-size:.93rem; line-height:1.55; color:var(--ink-2)}
.q-fb .fuente{
  display:block; margin-top:11px; font-size:.78rem; font-weight:600;
  color:var(--cobre-deep); text-transform:uppercase; letter-spacing:.06em;
}
#q-sig{margin-top:20px; width:100%}
@media(min-width:640px){#q-sig{width:auto}}

/* --- resultado --- */
#quiz-resultado{text-align:center; padding-top:14px; animation:sube .4s ease both}
.r-medalla{font-size:3.4rem; line-height:1; margin-bottom:6px; animation:pop .55s cubic-bezier(.2,1.4,.4,1) both}
@keyframes pop{from{opacity:0; transform:scale(.3) rotate(-18deg)} to{opacity:1; transform:none}}

.r-anillo{position:relative; width:150px; height:150px; margin:6px auto 20px}
.r-anillo svg{width:100%; height:100%; transform:rotate(-90deg)}
.r-anillo circle{fill:none; stroke-width:9; stroke-linecap:round}
.r-bg{stroke:var(--line)}
.r-fg{stroke:var(--cobre); stroke-dasharray:327; stroke-dashoffset:327;
  transition:stroke-dashoffset 1.1s cubic-bezier(.3,0,.2,1)}
.r-anillo.alto .r-fg{stroke:var(--ok)}
.r-num{position:absolute; inset:0; display:grid; place-content:center; gap:0}
.r-num b{font-family:'Archivo',sans-serif; font-size:2.9rem; font-weight:700; line-height:1}
.r-num span{font-size:.78rem; color:var(--dim); text-transform:uppercase; letter-spacing:.1em}

.r-titulo{font-size:clamp(1.5rem,5.5vw,2rem); font-weight:700; line-height:1.18}
.r-sub{color:var(--dim); font-size:1rem; margin:12px auto 0; max-width:42ch}

.r-repaso{margin-top:34px; text-align:left}
.r-repaso h4{
  font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--cobre-deep); margin:0 0 14px;
}
.r-item{
  background:var(--surface); border:1px solid var(--line); border-radius:15px;
  padding:17px 19px; margin-bottom:11px; box-shadow:var(--sh);
}
.r-item .rp{font-weight:600; font-size:.95rem; line-height:1.45}
.r-item .rr{
  margin:10px 0 0; font-size:.9rem; color:var(--ink-2); line-height:1.5;
  padding-left:13px; border-left:2px solid var(--ok);
}
.r-item .rf{
  display:block; margin-top:11px; font-size:.77rem; font-weight:600;
  color:var(--dim); text-transform:uppercase; letter-spacing:.06em;
}
.r-acciones{margin-top:30px; justify-content:center}

/* --- confeti --- */
.confeti{position:fixed; inset:0; pointer-events:none; z-index:9999; overflow:hidden}
.confeti i{
  position:absolute; top:-14px; width:9px; height:14px; opacity:0;
  animation:caer linear forwards;
}
@keyframes caer{
  0%{opacity:1; transform:translateY(0) rotate(0)}
  100%{opacity:0; transform:translateY(105vh) rotate(760deg)}
}

@media (prefers-reduced-motion: reduce){
  .r-medalla,.q-card,.q-fb,#quiz-resultado,.paso{animation:none}
  .r-fg{transition:none}
  .confeti{display:none}
}

/* ==================== 2.0 ==================== */

/* --- días de estudio --- */
.dias{display:flex; gap:9px; margin-top:24px; flex-wrap:wrap}
.dia{
  flex:1 1 0; min-width:42px; aspect-ratio:1/1; max-width:70px;
  background:var(--surface); border:1.5px solid var(--line); border-radius:14px;
  font-family:'Archivo',sans-serif; font-weight:700; font-size:1.05rem; color:var(--ink);
  box-shadow:var(--sh); transition:all .16s;
}
.dia:hover{border-color:var(--cobre)}
.dia.on{background:var(--plate); border-color:var(--plate); color:#fff}
.dias-info{margin-top:22px}
.dias-res{
  display:flex; flex-wrap:wrap; gap:24px; background:var(--surface);
  border:1px solid var(--line); border-radius:var(--r); padding:18px 20px; box-shadow:var(--sh);
}
.dias-res b{display:block; font-family:'Archivo',sans-serif; font-size:1.3rem; font-weight:700}
.dias-res span{display:block; font-size:.76rem; color:var(--dim);
  text-transform:uppercase; letter-spacing:.09em; margin-top:2px}
.aviso-dias{color:var(--cobre-deep); font-size:.92rem; font-weight:600; margin:0}
#btn-dias{margin-top:22px; width:100%}
@media(min-width:640px){#btn-dias{width:auto}}

.dias-chip{
  position:relative; display:inline-block; margin-top:16px;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.16);
  border-radius:999px; padding:6px 14px; font-size:.83rem; font-weight:600;
}

/* --- tarjeta Hoy --- */
.hoy{
  background:var(--surface); border:1px solid var(--line); border-radius:20px;
  padding:24px; box-shadow:var(--sh); margin-bottom:22px;
}
.hoy.activa{border:1.5px solid var(--cobre); box-shadow:0 0 0 4px var(--cobre-soft), var(--sh)}
.hoy.atrasada{border-left:4px solid #C8443A}
.hoy.fin{background:var(--plate); color:#fff; border-color:var(--plate)}
.hoy .et{
  font-size:.7rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
  color:var(--cobre-deep); margin-bottom:9px;
}
.hoy.fin .et{color:var(--cobre)}
.hoy h3{font-size:1.2rem; font-weight:700; line-height:1.3}
.hoy p{color:var(--dim); font-size:.93rem; margin:9px 0 0}
.hoy.fin p{color:rgba(255,255,255,.72)}
.hoy-aulas{margin-top:16px; border-top:1px solid var(--line-2); padding-top:6px}
.racha{
  display:inline-block; margin-bottom:14px; background:#FFF4E6; border:1px solid #F2DCC0;
  color:#8A5A16; border-radius:999px; padding:6px 14px; font-size:.83rem; font-weight:700;
}

/* --- PDF destacado --- */
.cta.grande{width:100%; padding:17px 24px; font-size:1.02rem; margin-bottom:8px}
.pdf-tip{font-size:.82rem; color:var(--dim); margin:0 0 18px; text-align:center}
.pdf-tip:empty{margin-bottom:10px}

/* --- sesiones dentro de la semana --- */
.ses{border-top:1px solid var(--line-2); padding:14px 0 4px; position:relative}
.ses:first-child{border-top:0}
.ses.lista{opacity:.6}
.ses.foco{
  margin:10px -18px; padding:14px 18px 6px; border-top:0;
  background:var(--cobre-soft); border-radius:13px;
}
.ses-h{display:flex; align-items:center; gap:11px}
.ses-d{
  flex:0 0 auto; width:26px; height:26px; border-radius:8px; background:var(--line-2);
  color:var(--ink-2); font-family:'Archivo',sans-serif; font-weight:700; font-size:.78rem;
  display:grid; place-items:center;
}
.ses.foco .ses-d{background:var(--cobre); color:#fff}
.ses.lista .ses-d{background:var(--ok); color:#fff}
.ses-h b{flex:1; font-family:'Archivo',sans-serif; font-size:.93rem; font-weight:700; text-transform:capitalize}
.ses-m{font-size:.8rem; color:var(--dim); font-variant-numeric:tabular-nums}
.ses .tag-ahora{margin:7px 0 0 37px}
.ses-aulas{padding-left:37px}

/* --- tira de sesiones --- */
.tira{margin-bottom:26px}
.tira-top{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:12px}
.tira-top h4{
  font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--cobre-deep); margin:0;
}
.tira-top span{font-size:.8rem; color:var(--dim)}
.tira-scroll{
  display:flex; gap:9px; overflow-x:auto; padding:2px 20px 10px; margin:0 -20px;
  scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.tira-scroll::-webkit-scrollbar{display:none}
.dia-c{
  flex:0 0 auto; scroll-snap-align:center; width:62px; padding:11px 0 12px;
  background:var(--surface); border:1.5px solid var(--line); border-radius:15px;
  text-align:center; box-shadow:var(--sh); transition:border-color .16s, transform .16s;
}
.dia-c .dc-s{
  display:block; font-size:.66rem; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; color:var(--dim);
}
.dia-c .dc-n{
  display:block; font-family:'Archivo',sans-serif; font-size:1.45rem; font-weight:700;
  line-height:1.15; margin-top:2px;
}
.dia-c .dc-m{display:block; font-size:.64rem; color:var(--dim); text-transform:uppercase; letter-spacing:.07em}
.dia-c .dc-p{
  display:block; width:6px; height:6px; border-radius:50%; margin:7px auto 0;
  background:var(--cobre);
}
.dia-c.ok{border-color:transparent; background:#EAF6F0}
.dia-c.ok .dc-n{color:var(--ok)}
.dia-c.ok .dc-p{background:var(--ok)}
.dia-c.es-hoy{border-color:var(--ink); box-shadow:0 0 0 3px rgba(0,30,58,.08), var(--sh)}
.dia-c.es-hoy .dc-s{color:var(--ink)}
.dia-c.pasada:not(.ok){opacity:.5}
.dia-c.pasada:not(.ok) .dc-p{background:#C8443A}

/* --- evaluación por curso --- */
.ec-bloque{margin-top:22px}
.ec-bloque h4{
  font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:var(--cobre-deep); margin:0 0 6px;
}
.ec-ayuda{color:var(--dim); font-size:.88rem; margin:0 0 14px}
.ec-fila{
  display:flex; align-items:center; gap:13px; width:100%; text-align:left;
  background:var(--surface); border:1px solid var(--line); border-radius:13px;
  padding:14px 16px; margin-bottom:9px; box-shadow:var(--sh); transition:border-color .16s;
}
.ec-fila:hover{border-color:var(--cobre)}
.ec-ico{flex:0 0 auto; font-size:1.15rem; width:24px; text-align:center; color:var(--dim)}
.ec-t{flex:1; min-width:0; font-size:.93rem; font-weight:600; line-height:1.35}
.ec-n{flex:0 0 auto; font-size:.79rem; color:var(--dim); font-variant-numeric:tabular-nums}

/* --- toast --- */
.toast{
  position:fixed; left:50%; bottom:24px; transform:translate(-50%,140%);
  z-index:9998; max-width:min(440px,calc(100vw - 32px));
  display:flex; align-items:center; gap:11px;
  background:var(--plate); color:#fff; border-radius:14px; padding:14px 18px;
  box-shadow:0 12px 40px -12px rgba(0,30,58,.6); font-size:.92rem; line-height:1.4;
  transition:transform .38s cubic-bezier(.2,1.2,.4,1), opacity .3s; opacity:0;
}
.toast.ver{transform:translate(-50%,0); opacity:1}
.toast i{font-style:normal; font-size:1.25rem; flex:0 0 auto}

/* --- impresión: sesiones --- */
@media print{
  .p-dias{margin-top:5mm; font-size:9pt; color:#5F7488}
  .p-ses{break-inside:avoid; page-break-inside:avoid; margin:3mm 0 4mm; padding-left:3mm;
    border-left:1.5pt solid #B47E68}
  .p-ses h4{font-size:9.5pt; margin:0 0 1.5mm; color:#001E3A; text-transform:capitalize}
  .p-ses h4 small{float:right; font-weight:400; color:#5F7488; font-size:8.5pt}
  .toast,.cal,.hoy,#hoy{display:none !important}
}

/* botón dentro del aviso */
.toast .t-cta{
  flex:0 0 auto; background:var(--cobre); color:#fff; border:0; border-radius:9px;
  padding:8px 13px; font-size:.83rem; font-weight:700; white-space:nowrap;
}
.toast .t-cta:hover{background:var(--cobre-deep)}

/* ==================== color por ruta ==================== */
:root{--rc:#B47E68; --rd:#95614A; --rs:#F8F0EB}

.ruta::before{background:var(--rc)}
.ruta:hover{border-color:var(--rc)}
.ruta .rn{
  display:inline-block; font-size:.66rem; font-weight:700; letter-spacing:.13em;
  text-transform:uppercase; color:#fff; background:var(--rc);
  border-radius:999px; padding:3px 10px; margin-bottom:9px;
}
.ruta .rm span.h{background:var(--rs); color:var(--rd)}

.resumen .et,.resumen .meta span{color:var(--rc)}
.resumen::after{background:radial-gradient(circle,color-mix(in srgb,var(--rc) 45%,transparent),transparent 68%)}
.eval-card::after{background:radial-gradient(circle,color-mix(in srgb,var(--rc) 42%,transparent),transparent 68%)}
.eval-card .et{color:var(--rc)}
.hoy .et,.q-ruta,.tira-top h4,.r-repaso h4,.ec-bloque h4,.tro-top h4{color:var(--rd)}
.hoy.activa{border-color:var(--rc); box-shadow:0 0 0 4px var(--rs), var(--sh)}
.cta,.dia-c .dc-p{background:var(--rc)}
.cta:hover{background:var(--rd)}
.barra span,.q-barra span{background:linear-gradient(90deg,var(--rc),var(--rd))}
.ses.foco{background:var(--rs)}
.ses.foco .ses-d{background:var(--rc)}
.tag-ahora{color:var(--rd)}
.curso-lb{color:var(--rd)}
.q-fb{border-left-color:var(--rc); background:var(--rs)}
.q-fb .fuente{color:var(--rd)}
.q-op:not(:disabled):hover{border-color:var(--rc)}
.r-fg{stroke:var(--rc)}
.dia.on{background:var(--rc); border-color:var(--rc)}
.opc:hover,.ec-fila:hover,.dia:hover,.cal-nav:hover{border-color:var(--rc)}

/* ==================== trofeos ==================== */
.trofeos{
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  padding:18px 20px; box-shadow:var(--sh); margin-bottom:30px;
}
.tro-top{display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:14px}
.tro-top h4{font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; margin:0}
.tro-top span{font-size:.82rem; color:var(--dim); font-variant-numeric:tabular-nums}
.tro-fila{display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:7px}
.tro{
  min-width:0; aspect-ratio:1/1;
  display:grid; place-items:center; border-radius:13px; font-size:1.25rem;
  background:var(--line-2); border:1.5px solid transparent;
  filter:grayscale(1) opacity(.32);
}
.tro.ok{filter:none}
.tro-pie{margin:13px 0 0; font-size:.8rem; color:var(--dim)}

/* ==================== cuatro acciones en línea ==================== */
.acc-fila{display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:8px}
.acc{
  display:flex; flex-direction:column; align-items:center; gap:5px;
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  padding:13px 4px; box-shadow:var(--sh); transition:border-color .16s, transform .16s;
  min-width:0;
}
.acc i{font-style:normal; font-size:1.15rem; line-height:1}
.acc span{
  font-size:.7rem; font-weight:600; color:var(--ink); line-height:1.2;
  text-align:center; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%;
}
.acc:hover{border-color:var(--rc); transform:translateY(-2px)}
.acc.destaque{background:var(--rc); border-color:var(--rc)}
.acc.destaque span{color:#fff}
.acc.destaque:hover{background:var(--rd)}

/* ==================== evaluación en el sitio ==================== */
.ec-inline{
  display:flex; align-items:center; gap:12px; width:100%; text-align:left;
  margin:12px 0 4px; padding:13px 15px; border-radius:14px;
  background:var(--rs); border:1.5px solid var(--rc); color:var(--ink);
  transition:transform .16s; animation:sube .3s ease both;
}
.ec-inline:hover{transform:translateY(-2px)}
.ei-ico{flex:0 0 auto; font-size:1.35rem}
.ei-t{flex:1; min-width:0}
.ei-t b{display:block; font-size:.9rem; font-weight:700; line-height:1.3}
.ei-t span{display:block; font-size:.79rem; color:var(--dim); margin-top:2px}
.ei-fl{flex:0 0 auto; font-size:1.3rem; color:var(--rd); line-height:1}

/* ==================== ajustes 13/08 ==================== */

/* --- días con el nombre entero --- */
.dias{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:9px; margin-top:24px}
.dia{
  display:flex; align-items:center; gap:9px; width:auto; min-width:0;
  aspect-ratio:auto; max-width:none; padding:14px 15px;
  font-size:.95rem; font-weight:600; text-align:left; text-transform:capitalize;
  border-radius:13px;
}
.dia .dv{
  flex:0 0 auto; width:21px; height:21px; border-radius:7px; border:1.5px solid var(--line);
  background:var(--surface); color:transparent; font-size:.8rem; font-weight:700;
  display:grid; place-items:center; transition:background .15s, border-color .15s;
}
.dia.on .dv{background:#fff; border-color:#fff; color:var(--rc)}

/* --- semanas recogidas --- */
.sem-h{
  display:flex; align-items:center; gap:14px; width:100%; text-align:left;
  padding:16px 18px; background:var(--surface); border:0; border-radius:var(--r);
}
.sem-h:hover{background:var(--line-2)}
.sem-fl{
  flex:0 0 auto; font-size:1.35rem; color:var(--dim); line-height:1;
  transform:rotate(90deg); transition:transform .22s;
}
.sem.cerrada .sem-fl{transform:rotate(0deg)}
.sem.cerrada .sem-b{display:none}
.sem.cerrada .sem-h{border-radius:var(--r)}
.sem:not(.cerrada) .sem-h{border-radius:var(--r) var(--r) 0 0}

/* en la impresión todo abierto */
@media print{ .sem.cerrada .sem-b{display:block} .sem-fl{display:none} }

/* ==================== perfil de ritmo ==================== */
.perfiles{display:grid; gap:11px; margin-top:24px}
.perfil{
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:14px;
  width:100%; text-align:left; background:var(--surface);
  border:1.5px solid var(--line); border-radius:var(--r); padding:17px 18px;
  box-shadow:var(--sh); transition:border-color .16s, transform .16s;
}
.perfil:hover{border-color:var(--rc); transform:translateY(-2px)}
.perfil.on{border-color:var(--rc); background:var(--rs)}
.pf-ico{font-size:1.9rem; line-height:1}
.pf-t{min-width:0}
.pf-t b{display:block; font-family:'Archivo',sans-serif; font-size:1.08rem; font-weight:700; line-height:1.25}
.pf-t span{display:block; font-size:.85rem; color:var(--dim); margin-top:3px}
.pf-n{text-align:right}
.pf-n b{display:block; font-family:'Archivo',sans-serif; font-size:1.15rem; font-weight:700; line-height:1.1}
.pf-n span{display:block; font-size:.68rem; color:var(--dim); text-transform:uppercase; letter-spacing:.07em}
.pf-sem{
  grid-column:1 / -1; margin-top:4px; padding-top:12px;
  border-top:1px solid var(--line-2); font-size:.83rem; font-weight:600; color:var(--rd);
}

.propio{margin-top:20px}
.propio-caja{
  margin-top:12px; background:var(--surface); border:1px solid var(--line);
  border-radius:var(--r); padding:18px 20px; box-shadow:var(--sh);
}
.propio-caja label{display:block; font-size:.85rem; font-weight:600; color:var(--dim); margin-bottom:9px}
.propio-fila{display:flex; gap:10px}
.propio-fila input{flex:1; min-width:0}
.propio-fila .cta{flex:0 0 auto}
.propio-nota{margin:12px 0 0; font-size:.86rem; color:var(--rd); font-weight:600; min-height:1.2em}
