/* =========================================================================
   v2.css — la versión nueva de Grado (20-10-2026). Todo bajo html.v2: sin la
   clase (gradoapp.cl hoy) no cambia nada. La enciende assets/v2.js.
   Medidas y colores sacados del prototipo aprobado (scratchpad/visual-1020).
   ========================================================================= */
html.v2,html.v2e{
  --v2-ini1:#151b3f;--v2-ini2:#1f2758;
  --v2-grano-luz:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --v2-grano-osc:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .035 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------------------------------------------------- fondo con textura */
/* solo las páginas de la app (su <header> va suelto en el body); la landing
   tiene su propio header dentro de #landing y queda tal cual */
html.v2 body:has(> header){background-image:var(--v2-grano-osc)}
html.v2 body > header{background:var(--v2-grano-luz),linear-gradient(180deg,var(--v2-ini1) 0%,var(--v2-ini2) 100%);padding-top:18px}
html.v2 body > header::before,html.v2 body > header::after{display:none}
html.v2 body > header .hbar{display:none}
html.v2 body > header .htitle{margin-top:4px}
html.v2 body > header nav{top:52px;background:rgba(21,27,63,.92)}
html.v2 .bqCaja,html.v2 #bqLupa{display:none!important}
html.v2 .rpAviso{display:none!important}

/* ------------------------------------------------------ barra de arriba */
html.v2 #v2nav{position:sticky;top:0;z-index:60;display:flex;align-items:center;gap:22px;padding:10px 24px;margin:0;width:100%;align-self:stretch;
  background:var(--v2-grano-luz),var(--v2-ini1);border:0;backdrop-filter:none;color:#fff;box-sizing:border-box}
html.v2 .v2marca{display:inline-flex;align-items:center;gap:9px;font-weight:800;font-size:1.06rem;letter-spacing:-.01em;color:#fff;text-decoration:none;white-space:nowrap}
html.v2 .v2marca img{width:30px;height:30px;border-radius:8px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.28);flex:none}
html.v2 .v2marca i{font-style:normal;color:#a78bfa}
html.v2 .v2links{display:flex;gap:18px;overflow-x:auto;scrollbar-width:none}
html.v2 .v2links a{color:#c9c5e8;font-weight:700;font-size:.9rem;white-space:nowrap;padding:4px 0;border-bottom:2px solid transparent;text-decoration:none}
html.v2 .v2links a:hover{color:#fff}
html.v2 .v2links a.on{color:#fff;border-bottom-color:#a78bfa}
html.v2 .v2links-m{display:none}
html.v2 .v2der{margin-left:auto;display:flex;align-items:center;gap:10px}
html.v2 .v2camp{position:relative;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:#ddd6fe;background:rgba(255,255,255,.08);border:0;cursor:pointer;padding:0}
html.v2 .v2camp svg{width:18px;height:18px}
html.v2 .v2camp:hover,html.v2 .v2camp.on{background:rgba(255,255,255,.16);color:#fff}
html.v2 .v2n{position:absolute;top:-4px;right:-4px;min-width:17px;height:17px;border-radius:9px;background:#f43f5e;color:#fff;font-size:.66rem;font-weight:800;display:grid;place-items:center;padding:0 4px;box-shadow:0 0 0 2px var(--v2-ini1)}
html.v2 .v2per{display:flex;align-items:center;gap:6px;border-radius:999px;padding:2px 8px 2px 2px;color:#ddd6fe;background:none;border:0;cursor:pointer;font:inherit}
html.v2 .v2per:hover,html.v2 .v2per.on{background:rgba(255,255,255,.1)}
html.v2 .v2per svg{width:14px;height:14px;transition:transform .2s}
html.v2 .v2per.on svg{transform:rotate(180deg)}
html.v2 .v2av{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:.78rem;background:linear-gradient(135deg,#8b5cf6,#6d3cf5);color:#fff;flex:none}
@media (max-width:720px){
  html.v2 #v2nav{padding:10px 14px;gap:12px}
  html.v2 #v2nav .v2links{display:none}
  html.v2 .v2links-m{display:flex;position:sticky;top:52px;z-index:59;gap:6px;overflow-x:auto;padding:8px 12px;background:var(--v2-grano-luz),var(--v2-ini1);width:100%;align-self:stretch;box-sizing:border-box}
  html.v2 .v2links-m a{border:0;padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.06);font-size:.84rem}
  html.v2 .v2links-m a.on{background:#fff;color:#141a3a}
  html.v2 body > header nav{top:96px}
  html.v2 .v2per svg{display:none}
  html.v2 .v2per{padding:2px}
}

/* ------------------------------------------------ perfil y campana */
html.v2 .v2menu{display:none}
html.v2 .v2menu.on{display:block;position:fixed;top:58px;right:16px;z-index:70;width:340px;max-height:calc(100vh - 76px);overflow-y:auto;background:#fff;color:#17213b;border:1px solid #e2e6ef;border-radius:18px;box-shadow:0 24px 60px rgba(10,10,40,.3);text-align:left}
html.v2 .v2menu.perfil{width:300px}
html.v2 .v2mh{padding:14px 16px 10px;border-bottom:1px solid #e2e6ef}
html.v2 .v2mh b{font-size:1.02rem}
html.v2 .v2nt{display:flex;align-items:flex-start;gap:12px;padding:12px 16px;color:#17213b;text-decoration:none;font-size:.88rem;line-height:1.45}
html.v2 .v2nt:hover{background:#fbfaff}
html.v2 .v2nti{width:34px;height:34px;border-radius:10px;flex:none;display:grid;place-items:center;background:#fde7ef;color:#c2366b}
html.v2 .v2nti svg{width:17px;height:17px}
html.v2 .v2mv{font-size:.86rem;color:#848ca0;padding:16px;margin:0;line-height:1.5}
html.v2 .v2yo{display:flex;align-items:center;gap:12px;padding:16px}
html.v2 .v2yo .v2av{width:42px;height:42px;font-size:.9rem}
html.v2 .v2yo div{min-width:0}
html.v2 .v2yo b{display:block;font-size:.98rem}
html.v2 .v2yo div span{display:block;font-size:.78rem;color:#848ca0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.v2 .v2pase{display:flex;align-items:center;gap:8px;margin:0 16px 8px;background:#e6f6ec;color:#1d5a3b;border-radius:12px;padding:8px 11px;font-size:.8rem;text-decoration:none}
html.v2 .v2pase.no{background:#f1edfd;color:#4a22c9}
html.v2 .v2pase svg{width:16px;height:16px;flex:none}
html.v2 .v2op{padding:4px 8px;border-top:1px solid #e2e6ef;margin-top:6px}
html.v2 .v2op a{display:flex;align-items:center;gap:12px;padding:10px 8px;border-radius:10px;font-size:.9rem;font-weight:600;color:#17213b;text-decoration:none}
html.v2 .v2op a:hover{background:#fbfaff}
html.v2 .v2op svg{width:18px;height:18px;color:#848ca0;flex:none}
html.v2 .v2salir{display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;border:0;border-top:1px solid #e2e6ef;background:none;text-align:left;font:inherit;font-size:.88rem;font-weight:700;color:#d64545;cursor:pointer;text-decoration:none}
html.v2 .v2salir.ent{color:#6d3cf5}
html.v2 .v2salir svg{width:18px;height:18px}
@media (max-width:720px){ html.v2 .v2menu.on,html.v2 .v2menu.perfil{left:8px;right:8px;width:auto;top:62px} }

/* --------------------------------------------- áreas: cambiar de área */
html.v2 .v2ar{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px}
html.v2 .v2ar a{color:#c9c5e8;font-weight:700;font-size:.82rem;padding:5px 12px;border-radius:999px;background:rgba(255,255,255,.07);text-decoration:none}
html.v2 .v2ar a:hover{color:#fff;background:rgba(255,255,255,.12)}
html.v2 .v2ar a.on{background:#fff;color:#141a3a}

/* ------------------------------------------------------------- Inicio */
html.v2:has(body.v2-ini){background:var(--v2-ini2)}
html.v2 body.v2-ini{background:var(--v2-grano-luz),linear-gradient(180deg,var(--v2-ini1) 0%,var(--v2-ini2) 100%);min-height:100vh;
  padding:0 0 40px;justify-content:flex-start}
html.v2 #hoyW .hw-ico svg{width:16px;height:16px}
html.v2 #hoyW .nop svg,html.v2 #hoyW a.cam svg{width:14px;height:14px;vertical-align:-2px;margin-right:5px}
html.v2 body.v2-ini::before,html.v2 body.v2-ini::after,html.v2 body.v2-ini .orb{display:none}
html.v2 body.v2-ini > .wrap{max-width:776px;width:100%;text-align:left;padding:0 18px;margin:0 auto;box-sizing:border-box}
html.v2 body.v2-ini > .wrap > .eyebrow,html.v2 body.v2-ini > .wrap > h1,html.v2 body.v2-ini .hello,html.v2 body.v2-ini .salir,
html.v2 body.v2-ini .disc,html.v2 body.v2-ini .foot{display:none}
html.v2 .v2hola{padding:34px 0 20px}
html.v2 .v2hola h1{margin:0;font-size:1.75rem;font-weight:800;line-height:1.2;letter-spacing:0;color:#fff}
html.v2 .v2hola p{margin:4px 0 0;color:#c9c5e8;font-size:.92rem}
html.v2 .v2sec{display:flex;justify-content:space-between;align-items:baseline;margin:26px 2px 10px}
html.v2 .v2sec b{color:#fff;font-size:1rem}
html.v2 .v2sec a{display:inline-flex;align-items:center;gap:2px;color:#c4b5fd;font-weight:700;font-size:.86rem;text-decoration:none}
html.v2 .v2sec a svg{width:14px;height:14px}
html.v2 body.v2-ini .cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0}
html.v2 body.v2-ini .cards .c{padding:12px;border-radius:16px;box-shadow:0 8px 24px rgba(0,0,0,.2);border:0;display:flex;flex-direction:column}
html.v2 body.v2-ini .cards .c:hover{transform:translateY(-2px)}
html.v2 body.v2-ini .cards .c .ic{width:34px;height:34px;border-radius:10px;margin:0 0 10px;font-size:1rem}
html.v2 body.v2-ini .cards .c .ic svg{width:18px;height:18px}
html.v2 body.v2-ini .cards .c.adm .ic{background:#fff1dc;color:#c26a12}
html.v2 body.v2-ini .cards .c.fin .ic{background:#e3f5ec;color:#1f8a5b}
html.v2 body.v2-ini .cards .c.mkt .ic{background:#fde7ef;color:#c2366b}
html.v2 body.v2-ini .cards .c.gdp .ic{background:#e3effb;color:#2b6cb0}
html.v2 body.v2-ini .cards .c h2{font-size:.92rem;font-weight:700;line-height:1.2;margin:0;color:#17213b}
html.v2 body.v2-ini .cards .c .go{display:none}
html.v2 .v2av2{display:block;margin-top:auto}
html.v2 .v2av2 small{display:block;font-size:.76rem;color:#5b6477;margin:2px 0 8px;min-height:1.2em}
html.v2 .v2bar{display:block;height:5px;border-radius:5px;background:#eeecf4;overflow:hidden}
html.v2 .v2bar i{display:block;height:100%;width:0;border-radius:5px;transition:width .4s}
html.v2 .c.adm .v2bar i{background:#c26a12}html.v2 .c.fin .v2bar i{background:#1f8a5b}
html.v2 .c.mkt .v2bar i{background:#c2366b}html.v2 .c.gdp .v2bar i{background:#2b6cb0}
html.v2 .c.v2fuera{opacity:.5}
html.v2 body.v2-ini a.plan.com{margin-top:12px;border-radius:16px;padding:12px 14px;gap:12px;
  background:var(--v2-grano-luz),linear-gradient(120deg,#7c4dff,#4a22c9);border:1px solid rgba(255,255,255,.14);box-shadow:0 10px 28px rgba(74,34,201,.35)}
html.v2 body.v2-ini a.plan.com:hover{transform:translateY(-2px)}
html.v2 body.v2-ini a.plan.com .ic{width:34px;height:34px;border-radius:10px;background:rgba(255,255,255,.12);color:#fff;font-size:1rem}
html.v2 body.v2-ini a.plan.com .ic svg{width:18px;height:18px}
html.v2 body.v2-ini a.plan.com h2{font-size:1rem;font-weight:700}
html.v2 body.v2-ini a.plan.com p{font-size:.8rem;color:#c9c5e8;opacity:1}
html.v2 body.v2-ini a.plan.com .go{margin-left:auto;display:grid;place-items:center}
html.v2 body.v2-ini a.plan.com .go svg{width:18px;height:18px}
html.v2 body.v2-ini .author{color:#a9a4cf;text-align:center;font-size:.8rem;margin:26px 0 0;font-weight:400;opacity:1}
html.v2 body.v2-ini .author b{color:#fff;border:0;padding:0}
@media (max-width:720px){
  html.v2 body.v2-ini .cards{grid-template-columns:repeat(2,1fr)}
  html.v2 .v2hola{padding:22px 0 16px}
  html.v2 .v2hola h1{font-size:1.45rem}
}

/* ---------------------------------- práctica: el caso completo a la derecha */
html.v2 .prg-lector{position:fixed;inset:0;z-index:80;display:none}
html.v2 .prg-lector.on{display:block}
html.v2 .prg-lector-f{position:absolute;inset:0;background:rgba(15,18,45,.38)}
html.v2 .prg-lector-p{position:absolute;top:0;right:0;bottom:0;width:min(620px,100%);background:#fff;display:flex;flex-direction:column;box-shadow:-18px 0 50px rgba(15,18,45,.25);animation:v2entra .22s ease}
@keyframes v2entra{from{transform:translateX(40px);opacity:.4}to{transform:none;opacity:1}}
html.v2 .prg-lector-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid #e2e6ef}
html.v2 .prg-lector-h span{display:block;font-size:.68rem;font-weight:800;letter-spacing:.1em;color:#848ca0}
html.v2 .prg-lector-h b{font-size:1.1rem;color:#17213b}
html.v2 .prg-lector-x{width:36px;height:36px;border-radius:10px;border:1px solid #e2e6ef;background:#fff;font-size:1.3rem;line-height:1;color:#5b6477;cursor:pointer}
html.v2 .prg-lector-i{display:flex;gap:6px;overflow-x:auto;padding:10px 20px;border-bottom:1px solid #e2e6ef;scrollbar-width:none}
html.v2 .prg-lector-i button{flex:none;border:1px solid #e2e6ef;background:#fbfaff;border-radius:999px;padding:4px 11px;font:inherit;font-size:.78rem;font-weight:700;color:#5b6477;cursor:pointer}
html.v2 .prg-lector-i button:hover{border-color:#6d3cf5;color:#6d3cf5}
html.v2 .prg-lector-b{flex:1;overflow-y:auto;padding:18px 22px 40px;font-size:.95rem;line-height:1.7;color:#17213b}
html.v2 .prg-lector-b .body{max-width:none;padding:0;margin:0;border:0;background:none;box-shadow:none}
html.v2 .prg-lector-b p.titular{font-weight:800;font-size:1.02rem;margin:22px 0 6px}
html.v2 .prg-lector-b table{font-size:.86rem}
@media (min-width:1100px){ html.v2 body.prg-lee .prg-lector-f{background:transparent;pointer-events:none} html.v2 body.prg-lee main{margin-right:min(640px,46vw);transition:margin .22s} }

/* sin la caja de referidos "Invita y gana apps gratis" (Fernando, 20-10) */
html.v2 #referidos-caja{display:none!important}

/* =========================================================================
   21-10: lo que faltaba del prototipo (lo arma assets/v2-piezas.js)
   ========================================================================= */

/* ------------------------------- una sola paleta morada en las 4 áreas */
html.v2.v2-area{--dark:#151b3f;--d2:#1f2758;--a:#6d3cf5;--a2:#4a22c9;--soft:#f1edfd;--line:#e2e6ef;--ink:#17213b;--muted:#5b6477;--bg:#efeef6;
  --grad-dark:linear-gradient(160deg,#151b3f,#1f2758);--grad-a:linear-gradient(135deg,#8b5cf6,#6d3cf5);--v2-area:#6d3cf5;--v2-area-s:#efe9ff}
html.v2 body.v2-a-adm{--v2-area:#c26a12;--v2-area-s:#fff1dc}
html.v2 body.v2-a-fin{--v2-area:#1f8a5b;--v2-area-s:#e3f5ec}
html.v2 body.v2-a-mkt{--v2-area:#c2366b;--v2-area-s:#fde7ef}
html.v2 body.v2-a-per{--v2-area:#2b6cb0;--v2-area-s:#e3effb}

/* --------------------------------------------- encabezado de un área */
html.v2 body.v2-area > header{padding-bottom:0}
html.v2 body.v2-area > header .htitle{max-width:1000px;margin:0 auto;padding:14px 18px 0;box-sizing:border-box}
html.v2 body.v2-area > header .htitle > h1,html.v2 body.v2-area > header .htitle > p{display:none}
html.v2 body.v2-area > header nav{display:none}
html.v2 .v2ah-t{display:flex;align-items:center;gap:12px;margin:4px 0 12px}
html.v2 .v2ah-t b{font-size:1.5rem;font-weight:800;color:#fff;line-height:1.2}
html.v2 .v2ah-i{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.1);color:#fff;flex:none}
html.v2 .v2ah-i svg{width:18px;height:18px}
html.v2 .v2ah-f{height:3px;border-radius:3px;background:var(--v2-area);margin-bottom:16px}
html.v2 .v2seg{display:inline-flex;gap:2px;padding:3px;border-radius:12px;background:rgba(255,255,255,.08);margin-bottom:18px;max-width:100%;overflow-x:auto;scrollbar-width:none}
html.v2 .v2seg button{border:0;background:none;color:#c9c5e8;font:inherit;font-weight:700;font-size:.88rem;padding:8px 20px;border-radius:9px;cursor:pointer;white-space:nowrap}
html.v2 .v2seg button:hover{color:#fff}
html.v2 .v2seg button.on{background:#fff;color:#141a3a}
/* 23-10, Fernando: la pestaña "muy angosta" a 776px; va al ancho de gradoapp.cl */
html.v2 body.v2-area main{max-width:1000px}
html.v2 body.v2-area section.tab > h2.sec{font-size:1.2rem;color:#17213b}
html.v2 body.v2-area[data-v2m="ficha"] section.tab > h2.sec,html.v2 body.v2-area[data-v2m="ficha"] section.tab > .tqbar h2.sec,html.v2 body.v2-area[data-v2m="temas"] #temario > h2{display:none}
html.v2 body.v2-area[data-v2m="ficha"] .pdfT-fila{display:none}
/* los colores de cada área que traen plegable.js y la calculadora, al morado */
html.v2 h3 .ckBox{border-color:#ddd3fb;background:#efe9ff;color:#6d3cf5}
html.v2 h3 .ckBox.on{background:#1f9a5c;border-color:#1f9a5c;color:#fff}
html.v2 h3.plH:hover{color:#6d3cf5}
html.v2 h3.plH .plCaret{order:9;margin-left:auto;color:#848ca0}
html.v2 .plTeaser{color:#5b6477}
html.v2 .plTeaser .plMas{color:#6d3cf5}
html.v2 .ckListo{background:#6d3cf5}
html.v2.v2-area .calc{background:#fbfaff;border:1px solid #e2e6ef;border-radius:16px}
html.v2.v2-area .calc h4{color:#17213b}
html.v2.v2-area .calc input,html.v2.v2-area .calc select{border-color:#e2e6ef}
html.v2.v2-area .calc .out{background:#151b3f;color:#fff}
html.v2 #ckAv,html.v2 .ckLinea{display:none!important}
@media (max-width:720px){
  html.v2 .v2seg{display:flex}
  html.v2 .v2seg button{flex:1;padding:8px 10px;font-size:.84rem}
  html.v2 .v2ah-t b{font-size:1.3rem}
}

/* ---------------------------------------------------- Temas por unidad */
html.v2 .v2sec2{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin:8px 2px 12px}
html.v2 .v2sec2 b{font-size:1rem;color:#17213b}
html.v2 .v2sec2 span{font-size:.8rem;color:#848ca0}
html.v2 .v2uni{margin-bottom:18px}
html.v2 .v2uni-h{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:4px 10px;margin:0 2px 10px}
html.v2 .v2uni-h b{font-size:.98rem;color:#17213b}
html.v2 .v2uni-h > span{font-size:.78rem;color:#848ca0;font-weight:600}
html.v2 .v2uq{border:0;background:none;padding:0;font:inherit;font-weight:700;color:#6d3cf5;cursor:pointer}
html.v2 .v2uni-h .v2uni-bar{grid-column:1/-1}
html.v2 .v2uni-bar{display:block;height:4px;border-radius:4px;background:#e7e4f3;overflow:hidden}
html.v2 .v2uni-bar i{display:block;height:100%;border-radius:4px;background:var(--v2-area);transition:width .4s}
html.v2 .v2lista{background:#fff;border-radius:16px;box-shadow:0 1px 2px rgba(23,33,59,.05),0 8px 24px rgba(23,33,59,.06);overflow:hidden}
html.v2 .v2fila{display:flex;align-items:center;gap:14px;width:100%;padding:14px 16px;border:0;border-top:1px solid #eeecf4;background:none;font:inherit;text-align:left;color:#17213b;cursor:pointer}
html.v2 .v2fila:first-child{border-top:0}
html.v2 .v2fila:hover{background:#fbfaff}
html.v2 .v2fila.v2fija{cursor:default}
html.v2 .v2fila > svg{width:18px;height:18px;color:#5b6477;flex:none}
html.v2 .v2cu{flex:1;min-width:0}
html.v2 .v2cu b{display:block;font-size:.95rem;font-weight:700}
html.v2 .v2cu small{display:block;font-size:.78rem;color:#848ca0;margin-top:2px}
html.v2 .v2cu .v2uni-bar{margin-top:7px;max-width:260px}
html.v2 .v2mk{width:22px;height:22px;border-radius:50%;border:2px solid #d9d6e8;flex:none;display:grid;place-items:center;color:#fff;box-sizing:border-box}
html.v2 .v2mk svg{width:13px;height:13px}
html.v2 .v2mk.ok{background:#1f9a5c;border-color:#1f9a5c}
html.v2 .v2mk.mid{border-color:#8b5cf6;background:conic-gradient(#8b5cf6 0 50%,transparent 50% 100%)}
html.v2 .v2mk.fx{border:0;background:#efe9ff;color:#6d3cf5;font-weight:800;font-size:.8rem;border-radius:7px}
html.v2 .v2tag{font-size:.72rem;font-weight:700;padding:3px 9px;border-radius:999px;background:#efe9ff;color:#6d3cf5;flex:none}
html.v2 .v2tag.ok{background:#e6f6ec;color:#1d7a4a}
html.v2 .v2extra{margin-bottom:18px}
html.v2 details.v2eval{background:#fff;border-radius:14px;box-shadow:0 1px 2px rgba(23,33,59,.05);margin-top:6px}
html.v2 details.v2eval > summary{display:flex;align-items:center;justify-content:space-between;list-style:none;cursor:pointer;padding:13px 16px;font-weight:700;font-size:.9rem;color:#17213b}
html.v2 details.v2eval > summary::-webkit-details-marker{display:none}
html.v2 details.v2eval > summary svg{width:16px;height:16px;color:#848ca0;transition:transform .2s}
html.v2 details.v2eval[open] > summary svg{transform:rotate(180deg)}
html.v2 details.v2eval[open]{padding:0 16px 10px}
html.v2 details.v2eval[open] > summary{margin:0 -16px}
html.v2 details.v2eval .card{box-shadow:none;border:1px solid #eeecf4}

/* --------------------------------------- la ficha: encabezado compacto */
html.v2 .v2fh{position:relative;display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:-26px -18px 18px;padding:10px 18px;
  background:rgba(255,255,255,.96);backdrop-filter:blur(6px);border-bottom:1px solid #e2e6ef}
html.v2 .v2lnk{display:inline-flex;align-items:center;gap:4px;border:0;background:none;padding:0;font:inherit;font-weight:700;font-size:.86rem;color:#6d3cf5;cursor:pointer;text-decoration:none}
html.v2 .v2lnk svg{width:15px;height:15px}
html.v2 .v2fh-u{font-size:.84rem;font-weight:600;color:#848ca0;padding-left:12px;border-left:1px solid #e2e6ef}
html.v2 .v2fh-t{font-size:1.06rem;font-weight:800;color:#17213b}
html.v2 .v2fh-p{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:.78rem;color:#5b6477;min-width:0}
html.v2 .v2fh-bar{width:140px;height:5px;border-radius:5px;background:#eeecf4;overflow:hidden}
html.v2 .v2fh-bar i{display:block;height:100%;background:#6d3cf5;border-radius:5px}
@media (max-width:720px){
  html.v2 .v2fh{margin:-20px -14px 14px;padding:8px 14px;gap:4px 10px}
  html.v2 .v2fh-u{display:none}
  html.v2 .v2fh-t{order:3;flex-basis:100%;font-size:1rem}
  html.v2 .v2fh-p{order:4;flex-basis:100%;margin:0}
  html.v2 .v2fh-bar{flex:1}
  html.v2 .v2fh-i{margin-left:auto}
  html.v2 .v2fh-i span{display:none}
}
/* los conceptos: tarjetas blancas como en el prototipo */
html.v2 body.v2-area .card{border:0;border-radius:18px;box-shadow:0 1px 2px rgba(23,33,59,.05),0 8px 24px rgba(23,33,59,.06)}
html.v2 body.v2-area .card > h3{color:#17213b}

/* ------------------------------------------------- cuál sigue en la unidad */
html.v2 .v2sig{display:none!important;background:#fff;border-radius:18px;box-shadow:0 1px 2px rgba(23,33,59,.05),0 8px 24px rgba(23,33,59,.06);padding:16px 18px;margin:22px 0 8px}
html.v2 .v2sig-k{font-size:.68rem;font-weight:800;letter-spacing:.1em;color:#848ca0;margin-bottom:10px}
html.v2 .v2sig-p{display:flex;flex-direction:column;gap:2px}
html.v2 .v2sig-p button{display:flex;align-items:center;gap:10px;border:0;background:none;padding:7px 6px;border-radius:10px;font:inherit;font-size:.9rem;color:#17213b;text-align:left;cursor:pointer}
html.v2 .v2sig-p button:hover:not([disabled]){background:#fbfaff}
html.v2 .v2sig-p button.on{background:#f1edfd;font-weight:700;cursor:default}
html.v2 .v2sig-p .d{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:.76rem;font-weight:700;background:#eeecf4;color:#5b6477;flex:none}
html.v2 .v2sig-p .on .d{background:#6d3cf5;color:#fff}
html.v2 .v2sig-p .ok .d{background:#1f9a5c;color:#fff}
html.v2 .v2sig-p .d svg{width:13px;height:13px}
html.v2 .v2sig-p em{margin-left:auto;font-style:normal;font-size:.74rem;color:#6d3cf5;font-weight:700}
html.v2 .v2sig-a{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:14px}
html.v2 .v2sig-fin{font-size:.86rem;color:#5b6477}
html.v2 .v2b1{display:inline-flex;align-items:center;gap:6px;border:0;background:linear-gradient(135deg,#8b5cf6,#6d3cf5);color:#fff;border-radius:11px;padding:10px 16px;font:inherit;font-weight:700;font-size:.88rem;cursor:pointer}
html.v2 .v2b2{display:inline-flex;align-items:center;gap:6px;background:#fff;color:#6d3cf5;border:1.5px solid #ddd3fb;border-radius:11px;padding:9px 13px;font:inherit;font-weight:700;font-size:.86rem;cursor:pointer}

/* --------------------------------------------------- quiz por unidad */
html.v2 #quiz.v2qu-on > :not(#v2qu){display:none!important}
html.v2 body.v2-area[data-v2m="quiz"] #quiz > h2.sec,html.v2 body.v2-area[data-v2m="quiz"] #quiz > .tqbar{display:none}
html.v2 .v2qu-intro{font-size:.86rem;color:#5b6477;margin:-4px 2px 12px}
html.v2 .v2qu-lista{display:flex;flex-direction:column;gap:10px}
html.v2 .v2qu-u{display:flex;align-items:center;gap:14px;background:#fff;border-radius:16px;box-shadow:0 1px 2px rgba(23,33,59,.05),0 8px 24px rgba(23,33,59,.06);padding:14px 16px}
html.v2 .v2qu-u .v2cu > span{display:block;font-size:.8rem;color:#5b6477;margin-top:1px}
html.v2 .v2qu-m{display:flex;align-items:center;gap:10px;margin-top:8px}
html.v2 .v2qu-m .v2uni-bar{flex:1;max-width:220px}
html.v2 .v2qu-m em,html.v2 .v2qu-nota{font-style:normal;font-size:.76rem;font-weight:700;color:#848ca0}
html.v2 .v2qu-nota{display:block;margin-top:6px}
html.v2 .v2qu-cab{display:flex;align-items:center;gap:12px;margin:0 2px 12px}
html.v2 .v2qu-cab b{font-size:1.05rem;color:#17213b}
html.v2 .v2progq{display:flex;gap:4px;margin:0 0 12px}
html.v2 .v2progq i{flex:1;height:5px;border-radius:5px;background:#e7e4f3}
html.v2 .v2progq i.on{background:#8b5cf6}
html.v2 .v2progq i.ok{background:#1f9a5c}
html.v2 .v2progq i.mal{background:#d64545}
html.v2 .v2qcard{background:#fff;border-radius:18px;box-shadow:0 1px 2px rgba(23,33,59,.05),0 8px 24px rgba(23,33,59,.06);padding:18px}
html.v2 .v2qcard > b{display:block;font-size:1.02rem;color:#17213b;margin-bottom:12px;line-height:1.45}
html.v2 .v2opc{display:block;width:100%;text-align:left;border:1.5px solid #e2e6ef;background:#fff;border-radius:12px;padding:11px 14px;margin-top:8px;font:inherit;font-size:.92rem;color:#17213b;cursor:pointer}
html.v2 .v2opc:hover:not([disabled]){border-color:#ddd3fb}
html.v2 .v2opc.ok{border-color:#1f9a5c;background:#e6f6ec}
html.v2 .v2opc.mal{border-color:#d64545;background:#fdeeee}
html.v2 .v2opc[disabled]{cursor:default}
html.v2 .v2qe{margin-top:12px;border-radius:12px;padding:11px 13px;background:rgba(214,69,69,.08);font-size:.88rem;line-height:1.5;color:#17213b}
html.v2 .v2qe.ok{background:#e6f6ec}
html.v2 .v2qe b{display:block;margin-bottom:2px}
html.v2 .v2btnF{display:block;width:100%;border:0;text-align:center;border-radius:12px;padding:12px;font:inherit;font-weight:700;color:#fff;background:linear-gradient(90deg,#8b5cf6,#6d3cf5);margin-top:14px;font-size:.95rem;cursor:pointer}
html.v2 .v2qu-res{display:flex;align-items:center;gap:16px;background:#fff;border-radius:18px;box-shadow:0 8px 24px rgba(23,33,59,.06);padding:16px 18px;margin:0 0 12px}
html.v2 .v2qu-res .n{font-size:2.4rem;font-weight:900;line-height:1;color:#6d3cf5}
html.v2 .v2qu-res .n small{font-size:1rem;font-weight:700;color:#848ca0}
html.v2 .v2qu-res b{display:block;font-size:1.05rem}
html.v2 .v2qu-res div span{font-size:.86rem;color:#5b6477}
html.v2 .v2qu-acc{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}

/* ------------------------------------------- el tutor: panel a la derecha */
:is(html.v2,html.v2e) #fab{background:#1b2150;color:#fff;border-radius:999px;height:48px;padding:0 18px 0 13px;font-weight:700;font-size:.95rem;box-shadow:0 8px 20px rgba(0,0,0,.3);display:inline-flex;align-items:center;gap:8px}
:is(html.v2,html.v2e) #fab .fab-ic{color:#a78bfa}
:is(html.v2,html.v2e) #chat header{background:var(--v2-grano-luz),linear-gradient(160deg,#151b3f,#1f2758);color:#fff;padding:12px 12px 12px 14px;border:0}
:is(html.v2,html.v2e) #chat header .sub{display:none}
:is(html.v2,html.v2e) #chat header .ct{display:flex;align-items:center;gap:2px}
:is(html.v2,html.v2e) #chat header .ct > b{order:0;display:flex;align-items:center;gap:10px;margin-right:auto;min-width:0;font-weight:700}
:is(html.v2,html.v2e) .v2tico{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.12);color:#c4b5fd;flex:none}
:is(html.v2,html.v2e) .v2tico svg{width:18px;height:18px}
:is(html.v2,html.v2e) .v2tt{display:flex;flex-direction:column;min-width:0;text-align:left}
:is(html.v2,html.v2e) #chat .v2tt > span{font-size:.96rem;line-height:1.25;opacity:1;cursor:default;align-self:flex-start;margin:0;padding:0;width:auto;height:auto;min-width:0;min-height:0;display:block;background:none}
:is(html.v2,html.v2e) #chat .ct .v2tico{font-size:1rem;opacity:1;cursor:default}
:is(html.v2,html.v2e) .v2tt small{font-size:.74rem;color:#c9c5e8;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:is(html.v2,html.v2e) #chat header .ct > :not(b){width:30px!important;height:30px!important;min-width:30px!important;margin:0!important;padding:0!important;border-radius:9px!important;display:inline-grid!important;place-items:center;color:#ddd6fe!important;opacity:1!important;background:none!important;font-size:0!important;border:0!important}
:is(html.v2,html.v2e) #chat header .ct > :not(b):hover{background:rgba(255,255,255,.1)!important}
:is(html.v2,html.v2e) #chat header .ct svg.v2i{width:16px;height:16px}
:is(html.v2,html.v2e) #chat #tmax{order:1!important}:is(html.v2,html.v2e) #chat #mcBtn{order:2!important}:is(html.v2,html.v2e) #chat .thNuevo{order:3!important}:is(html.v2,html.v2e) #chat .tvSalir{order:4!important}:is(html.v2,html.v2e) #chat #cx{order:5!important}
:is(html.v2,html.v2e) #chat #mcBtn.on,:is(html.v2,html.v2e) body.mc-on #chat #mcBtn{background:rgba(250,204,21,.18)!important;color:#fcd34d!important}
:is(html.v2,html.v2e) #msgs{background:#fff;padding:14px 12px}
:is(html.v2,html.v2e) #chat .m{border-radius:16px;font-size:.9rem}
:is(html.v2,html.v2e) #chat .m.u{background:linear-gradient(135deg,#8b5cf6,#6d3cf5);color:#fff;border:0;border-radius:16px 16px 4px 16px}
:is(html.v2,html.v2e) #chat .m.b{background:#f1edfd;border:0;color:#17213b;border-radius:16px 16px 16px 4px}
:is(html.v2,html.v2e) #chat .m.b b{color:inherit}
:is(html.v2,html.v2e) #cin{margin:0 10px 10px;padding:6px;gap:6px;border:1px solid #e2e6ef;border-radius:14px;background:#fff;align-items:center}
:is(html.v2,html.v2e) #cin textarea{border:0;padding:8px 6px;min-height:36px;font-size:.92rem;background:transparent;outline:none;box-shadow:none}
:is(html.v2,html.v2e) #cin > button{width:36px;height:36px;padding:0;border-radius:10px;display:grid;place-items:center;background:none;color:#5b6477;flex:none}
:is(html.v2,html.v2e) #cin > button:hover{background:#f3f1fa}
html.v2e #cin > button{border-color:#e2e6ef}
:is(html.v2,html.v2e) #cin > button svg{width:17px;height:17px}
:is(html.v2,html.v2e) #cin #csend{background:#6d3cf5;color:#fff}
:is(html.v2,html.v2e) #cin #csend:hover{background:#5a2fe0}
:is(html.v2,html.v2e) #cvoz button svg{width:16px;height:16px}
/* 26-10 (Fernando): el tutor del beta queda como ventana flotante, igual que en gradoapp.cl; ya no se acopla a la derecha */

/* --------------------------------------- los apuntes: panel a la izquierda */
:is(html.v2,html.v2e){--qn-a:#6d3cf5;--qn-a2:#4a22c9;--qn-soft:#f1edfd;--qn-line:#e2e6ef;--qn-dark:#151b3f;--qn-ink:#17213b;--qn-muted:#5b6477;--qn-bg:#fff;--qn-grad:linear-gradient(160deg,#151b3f,#1f2758)}
:is(html.v2,html.v2e) #qnEdge{background:var(--v2-grano-luz),#151b3f;font-size:.66rem;font-weight:700;letter-spacing:.08em;padding:12px 6px;border-radius:0 10px 10px 0;box-shadow:0 4px 12px rgba(0,0,0,.2);top:42vh}
:is(html.v2,html.v2e) #qnEdge:hover{padding-left:9px}
:is(html.v2,html.v2e) #qnPanel .qnHead{background:var(--v2-grano-luz),linear-gradient(160deg,#151b3f,#1f2758);padding:12px 14px;gap:6px}
:is(html.v2,html.v2e) #qnPanel .qnHead > b{display:flex;align-items:center;gap:8px;font-size:.96rem;margin-right:auto}
:is(html.v2,html.v2e) #qnPanel .qnHead > b svg{width:18px;height:18px;color:#a78bfa}
:is(html.v2,html.v2e) #qnPanel .qnHead button{width:28px;height:28px;border-radius:8px;background:rgba(255,255,255,.1);display:grid;place-items:center;color:#ddd6fe;padding:0}
:is(html.v2,html.v2e) #qnPanel .qnHead button svg{width:15px;height:15px}
:is(html.v2,html.v2e) #qnPanel .qnCtx{background:#fff;color:#5b6477;font-weight:600}
:is(html.v2,html.v2e) #qnPanel .qnCtx select{border:1.5px solid #e2e6ef;border-radius:9px;background:#fbfaff}
:is(html.v2,html.v2e) #qnPanel .qnTitle{color:#17213b}
/* 23-10 (Fernando: "son muy chicos"): 420px, y en gradoapp.cl también acoplados, sin fondo oscuro */
@media (min-width:1024px){
  :is(html.v2,html.v2e) body:not(.prg-on) #qnPanel{width:420px;box-shadow:none}
  :is(html.v2,html.v2e) #qnBack{display:none!important}
  html.v2 body:not(.v2-area).qn-open{padding-left:420px;box-sizing:border-box}
  html.v2 body.v2-area.qn-open.prg-on{padding-left:360px;box-sizing:border-box}
}
@media (min-width:1100px){
  :is(html.v2,html.v2e) body.qn-open:not(.prg-on) #qnMk,:is(html.v2,html.v2e) body.qn-open:not(.prg-on) #qiBar.abierto,:is(html.v2,html.v2e) body.qn-open:not(.prg-on) #qnMk.abierto ~ #qiBar{left:calc(432px + env(safe-area-inset-left))}
  :is(html.v2,html.v2e) body.qn-open:not(.prg-on) #qiBar{left:calc(487px + env(safe-area-inset-left))}
}

/* ---------------- tutor y apuntes abiertos: la ficha sigue al medio (23-10)
   Fernando: "que se mantenga en el medio, cosa de abrir el tutor y los apuntes
   con la ficha al medio al mismo tiempo". Cada panel reserva su lado (--v2pl,
   --v2pr) y main se centra en la pantalla con el ancho que deja libre el panel
   más grande a los dos lados. Si eso la deja bajo 720px, queda en 720 y se
   corre lo justo para no meterse bajo un panel; con los dos abiertos usa lo
   que queda entre ambos. En gradoapp.cl el tutor sigue siendo la ventana
   flotante (410px + 16 de borde), así que reserva 442px. Resolviendo
   ejercicios (prg-on) manda la regla de apuntes.js. */
@media (min-width:1024px){
  :is(html.v2,html.v2e) body.qn-open:not(.prg-on){--v2pl:420px}
  :is(html.v2,html.v2e) body.chat-open:not(.tutor-max){--v2pr:442px}
  html.v2 body.v2-area:is(.qn-open,.chat-open):not(.prg-on) > main,
  html.v2 body.v2-area:is(.qn-open,.chat-open):not(.prg-on) > header .htitle,
  html.v2e body:is(.qn-open,.chat-open):not(.prg-on) > main{
    --v2w:min(var(--v2max,1000px),calc(100% - var(--v2pl,0px) - var(--v2pr,0px) - 32px),max(720px,calc(100% - 2 * max(var(--v2pl,0px),var(--v2pr,0px)) - 32px)));
    box-sizing:border-box;width:var(--v2w);max-width:none;margin-right:0;
    margin-left:clamp(calc(var(--v2pl,0px) + 16px),calc((100% - var(--v2w)) / 2),calc(100% - var(--v2pr,0px) - 16px - var(--v2w)))}
  html.v2 body.v2-area:is(.qn-open,.chat-open) #v2nav{padding-left:calc(var(--v2pl,0px) + 24px);padding-right:calc(var(--v2pr,0px) + 24px)}
}
/* con los dos abiertos la barra de arriba no cabía: se cortaba "Comunidad" y
   el encabezado de la ficha se partía en dos líneas */
@media (min-width:1024px) and (max-width:1599px){
  html.v2 body.qn-open.chat-open #v2nav{gap:14px}
  html.v2 body.qn-open.chat-open .v2marca span{display:none}
  html.v2 body.qn-open.chat-open .v2links{gap:12px}
  html.v2 body:is(.qn-open,.chat-open) .v2fh-u{display:none}
  html.v2 body.qn-open.chat-open .v2fh-bar{width:80px}
}

/* ----------------------------- Plan y Simulacro: el mismo selector de las áreas */
html.v2 body:not(.v2-area):not(.v2-ini) > header .htitle{max-width:776px;margin:0 auto;padding:16px 18px 0;box-sizing:border-box}
html.v2 body:not(.v2-area):not(.v2-ini) > header .htitle h1{font-size:1.5rem;line-height:1.2}
html.v2 body:not(.v2-area):not(.v2-ini) > header .htitle p{display:none}
html.v2 body:not(.v2-area):not(.v2-ini) > header nav{position:static;background:none;border:0;backdrop-filter:none;margin:14px 0 0;padding:0 0 18px}
html.v2 body:not(.v2-area):not(.v2-ini) > header nav .tabs{display:flex;width:fit-content;max-width:calc(100% - 36px);margin:0 0 0 max(18px,calc((100% - 776px) / 2 + 18px));padding:3px;gap:2px;border-radius:12px;background:rgba(255,255,255,.08);box-sizing:border-box}
html.v2 body:not(.v2-area):not(.v2-ini) > header nav .tabs button,html.v2 body:not(.v2-area):not(.v2-ini) > header nav .tabs a{color:#c9c5e8;font-weight:700;font-size:.88rem;padding:8px 18px;border-radius:9px;min-height:0;box-shadow:none;background:none}
html.v2 body:not(.v2-area):not(.v2-ini) > header nav .tabs button.active{background:#fff;color:#141a3a;box-shadow:none}
html.v2 body:not(.v2-area):not(.v2-ini) > header nav .tabs button:hover:not(.active){color:#fff;background:none}
html.v2 body:not(.v2-area):not(.v2-ini) main{max-width:776px}
@media (max-width:720px){
  html.v2 body:not(.v2-area):not(.v2-ini) > header nav .tabs{max-width:calc(100% - 28px);margin-left:14px;overflow-x:auto}
  html.v2 body:not(.v2-area):not(.v2-ini) > header nav .tabs button{padding:8px 12px;font-size:.84rem}
}
/* Plan › Hoy: el bloque del Inicio y otras formas de practicar */
html.v2 body.v2-planhoy #hoy > h2.sec,html.v2 body.v2-planhoy #hoy > p.lead,html.v2 body.v2-planhoy #hoy > .linksSim,html.v2 body.v2-planhoy #hoy > .card:has(#bloquesHoy){display:none}
html.v2 body.v2-planhoy #hoyW{margin-top:4px}
html.v2 .v2otras{margin:22px 0 6px}
html.v2 .v2dos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
html.v2 .v2dos .v2fila{border-radius:16px;text-decoration:none;border:0}
html.v2 .v2ico{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#efe9ff;color:#6d3cf5;flex:none}
html.v2 .v2ico svg{width:17px;height:17px}
@media (max-width:720px){ html.v2 .v2dos{grid-template-columns:1fr} }

/* celular: los apuntes van en la barra de abajo, sin la lengüeta encima del texto */
@media (max-width:720px){ html.v2 #qnEdge{display:none!important} }
html.v2 .v2tt > span{line-height:1.25}
html.v2 .v2tt small{line-height:1.3}

/* ------------------------------------------- campana: filtros y leídas */
html.v2 .v2mh{display:flex;align-items:center;justify-content:space-between;gap:10px}
html.v2 .v2lk{border:0;background:none;padding:0;font:inherit;font-size:.78rem;font-weight:700;color:#6d3cf5;cursor:pointer}
html.v2 .v2mf{display:flex;gap:6px;padding:10px 16px;border-bottom:1px solid #e2e6ef}
html.v2 .v2mf button{border:1px solid #e2e6ef;background:#fff;border-radius:999px;padding:4px 12px;font:inherit;font-size:.78rem;font-weight:700;color:#5b6477;cursor:pointer}
html.v2 .v2mf button.on{background:#141a3a;border-color:#141a3a;color:#fff}
html.v2 .v2nt{position:relative}
html.v2 .v2nt.nueva{background:#fbf9ff}
html.v2 .v2ntc{flex:1;min-width:0}
html.v2 .v2ntc > span{display:block}
html.v2 .v2ntc small{display:block;font-size:.74rem;color:#848ca0;margin-top:3px}
html.v2 .v2pt{position:absolute;right:14px;top:16px;width:8px;height:8px;border-radius:50%;background:#6d3cf5}
html.v2 .v2nt.t-anuncio .v2nti{background:#efe9ff;color:#6d3cf5}
html.v2 .v2nt.t-plan .v2nti{background:#e3f5ec;color:#1f8a5b}
html.v2 .v2op button{display:flex;align-items:center;gap:12px;width:100%;padding:10px 8px;border:0;border-radius:10px;background:none;font:inherit;font-size:.9rem;font-weight:600;color:#17213b;cursor:pointer;text-align:left}
html.v2 .v2op button:hover{background:#fbfaff}
html.v2 .v2op button svg{width:18px;height:18px;color:#848ca0;flex:none}
html.v2 .v2sw{margin-left:auto;width:34px;height:20px;border-radius:999px;background:#e2e6ef;position:relative;flex:none;transition:background .2s}
html.v2 .v2sw i{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:left .2s}
html.v2 .v2sw.on{background:#6d3cf5}
html.v2 .v2sw.on i{left:16px}

/* =========================================================================
   Modo oscuro (html[data-theme=dark], desde el menú del perfil). Los mismos
   tonos del prototipo: fondo #13173a, tarjetas #1d2249, texto #eceaf7.
   ========================================================================= */
html.v2[data-theme="dark"]{color-scheme:dark;--bg:#13173a;--line:#2f3563;--ink:#eceaf7;--muted:#a7a4c0;--soft:#221f45;
  --qn-bg:#1d2249;--qn-ink:#eceaf7;--qn-muted:#a7a4c0;--qn-line:#2f3563;--qn-soft:#221f45}
html.v2[data-theme="dark"] body{background-color:#13173a;color:#eceaf7}
html.v2[data-theme="dark"] body:has(> header){background-image:var(--v2-grano-luz)}
html.v2[data-theme="dark"] main,html.v2[data-theme="dark"] main p,html.v2[data-theme="dark"] main li,html.v2[data-theme="dark"] main td{color:#d9d6ec}
html.v2[data-theme="dark"] main h2,html.v2[data-theme="dark"] main h3,html.v2[data-theme="dark"] main h4,html.v2[data-theme="dark"] main b,html.v2[data-theme="dark"] main strong{color:#eceaf7}
html.v2[data-theme="dark"] .card,html.v2[data-theme="dark"] .v2lista,html.v2[data-theme="dark"] .v2sig,html.v2[data-theme="dark"] .v2qu-u,html.v2[data-theme="dark"] .v2qcard,
html.v2[data-theme="dark"] .v2qu-res,html.v2[data-theme="dark"] details.v2eval,html.v2[data-theme="dark"] .v2menu.on{background:#1d2249;border-color:#2f3563;color:#eceaf7;box-shadow:0 8px 24px rgba(0,0,0,.25)}
html.v2[data-theme="dark"] .v2fila{color:#eceaf7;border-top-color:#2f3563}
html.v2[data-theme="dark"] .v2fila:hover,html.v2[data-theme="dark"] .v2sig-p button:hover:not([disabled]){background:#232953}
html.v2[data-theme="dark"] .v2cu b,html.v2[data-theme="dark"] .v2sec2 b,html.v2[data-theme="dark"] .v2uni-h b,html.v2[data-theme="dark"] .v2fh-t,html.v2[data-theme="dark"] .v2qu-cab b,
html.v2[data-theme="dark"] .v2qcard > b,html.v2[data-theme="dark"] details.v2eval > summary,html.v2[data-theme="dark"] .v2sig-p button{color:#eceaf7}
html.v2[data-theme="dark"] .v2cu small,html.v2[data-theme="dark"] .v2sec2 span,html.v2[data-theme="dark"] .v2uni-h > span,html.v2[data-theme="dark"] .v2qu-intro,html.v2[data-theme="dark"] .v2fh-p{color:#a7a4c0}
html.v2[data-theme="dark"] .v2uni-bar,html.v2[data-theme="dark"] .v2fh-bar,html.v2[data-theme="dark"] .v2progq i{background:#2f3563}
html.v2[data-theme="dark"] .v2tag,html.v2[data-theme="dark"] .v2mk.fx,html.v2[data-theme="dark"] .v2ico{background:#2a2350;color:#b39dff}
html.v2[data-theme="dark"] .v2tag.ok{background:rgba(31,154,92,.18);color:#6ee7a8}
html.v2[data-theme="dark"] .v2mk{border-color:#3d4378}
html.v2[data-theme="dark"] .v2fh{background:rgba(29,34,73,.96);border-bottom-color:#2f3563}
html.v2[data-theme="dark"] .v2lnk,html.v2[data-theme="dark"] .v2uq,html.v2[data-theme="dark"] .v2lk,html.v2[data-theme="dark"] .plTeaser .plMas{color:#b39dff}
html.v2[data-theme="dark"] .v2sig-p button.on{background:#2a2350}
html.v2[data-theme="dark"] .v2sig-p .d{background:#2f3563;color:#a7a4c0}
html.v2[data-theme="dark"] .v2b2{background:#1d2249;border-color:#3d3470;color:#b39dff}
html.v2[data-theme="dark"] .v2opc{background:#1d2249;border-color:#2f3563;color:#eceaf7}
html.v2[data-theme="dark"] .v2opc.ok{background:rgba(31,154,92,.18)}
html.v2[data-theme="dark"] .v2opc.mal{background:rgba(214,69,69,.18)}
html.v2[data-theme="dark"] .v2qe{color:#eceaf7}
html.v2[data-theme="dark"] h3 .ckBox{background:#2a2350;border-color:#3d3470;color:#b39dff}
html.v2[data-theme="dark"] .plTeaser{color:#a7a4c0}
html.v2[data-theme="dark"] .obj,html.v2[data-theme="dark"] .eli5,html.v2[data-theme="dark"] .ejx,html.v2[data-theme="dark"] .ojo,html.v2[data-theme="dark"] .fml,html.v2[data-theme="dark"] .flujo .fp{background:#232953!important;border-color:#3d3470!important;color:#e4e1f3!important}
html.v2[data-theme="dark"] .calc,html.v2[data-theme="dark"] .tabla,html.v2[data-theme="dark"] table{background:#1d2249;border-color:#2f3563;color:#e4e1f3}
html.v2[data-theme="dark"] th{background:#232953;color:#eceaf7}
html.v2[data-theme="dark"] td{border-color:#2f3563}
html.v2[data-theme="dark"] input,html.v2[data-theme="dark"] textarea,html.v2[data-theme="dark"] select{background:#232953;color:#eceaf7;border-color:#2f3563}
html.v2[data-theme="dark"] .katex{color:inherit}
/* menús de arriba */
html.v2[data-theme="dark"] .v2menu.on,html.v2[data-theme="dark"] .v2nt,html.v2[data-theme="dark"] .v2op a,html.v2[data-theme="dark"] .v2op button{color:#eceaf7}
html.v2[data-theme="dark"] .v2mh,html.v2[data-theme="dark"] .v2mf,html.v2[data-theme="dark"] .v2op,html.v2[data-theme="dark"] .v2salir{border-color:#2f3563}
html.v2[data-theme="dark"] .v2nt:hover,html.v2[data-theme="dark"] .v2op a:hover,html.v2[data-theme="dark"] .v2op button:hover,html.v2[data-theme="dark"] .v2nt.nueva{background:#232953}
html.v2[data-theme="dark"] .v2mf button{background:#1d2249;border-color:#2f3563;color:#a7a4c0}
html.v2[data-theme="dark"] .v2mf button.on{background:#eceaf7;color:#13173a}
html.v2[data-theme="dark"] .v2pase{background:rgba(31,154,92,.16);color:#8ee6b5}
html.v2[data-theme="dark"] .v2pase.no{background:#2a2350;color:#c4b5fd}
html.v2[data-theme="dark"] .v2sw{background:#3d4378}
/* Inicio y Plan: el bloque Hoy */
html.v2[data-theme="dark"] .hoyW{background:#1d2249!important;border-color:#2f3563!important;color:#eceaf7;box-shadow:0 10px 30px rgba(0,0,0,.3)!important}
html.v2[data-theme="dark"] .hoyW .hw-row{background:#1d2249;border-color:#2f3563}
html.v2[data-theme="dark"] .hoyW .hw-row.open{background:#232953;border-color:#3d3470}
html.v2[data-theme="dark"] .hoyW .hw-row.hecho{background:rgba(31,154,92,.12);border-color:rgba(31,154,92,.35)}
html.v2[data-theme="dark"] .hoyW .hw-tt,html.v2[data-theme="dark"] .hoyW .hw-teaser,html.v2[data-theme="dark"] .hoyW h2,html.v2[data-theme="dark"] .hoyW h3{color:#eceaf7}
html.v2[data-theme="dark"] .hoyW .hw-chk{background:#1d2249}
html.v2[data-theme="dark"] .hoyW .hw-min,html.v2[data-theme="dark"] .hoyW .hw-prep,html.v2[data-theme="dark"] .hoyW .hw-cuenta span{background:#2a2350;color:#c4b5fd}
html.v2[data-theme="dark"] body.v2-area .card > h3,html.v2[data-theme="dark"] body.v2-area .card h3,html.v2[data-theme="dark"].v2-area .calc h4{color:#eceaf7}
html.v2[data-theme="dark"] body.v2-ini .cards .c{background:#1d2249}
html.v2[data-theme="dark"] body.v2-ini .cards .c h2{color:#eceaf7}
html.v2[data-theme="dark"] .v2av2 small{color:#a7a4c0}
html.v2[data-theme="dark"] .v2bar{background:#2f3563}
/* tutor y apuntes */
html.v2[data-theme="dark"] #chat,html.v2[data-theme="dark"] #msgs,html.v2[data-theme="dark"] #cin,html.v2[data-theme="dark"] #mc{background:#1d2249;border-color:#2f3563}
html.v2[data-theme="dark"] #chat .m.b{background:#221f45;color:#eceaf7}
html.v2[data-theme="dark"] #chat .m.b b{color:inherit}
html.v2[data-theme="dark"] #cin textarea{color:#eceaf7}
html.v2[data-theme="dark"] #cin > button{color:#a7a4c0}
html.v2[data-theme="dark"] #cin > button:hover{background:#232953}
html.v2[data-theme="dark"] #qnPanel,html.v2[data-theme="dark"] #qnPanel .qnCtx,html.v2[data-theme="dark"] #qnPanel .qnTools{background:#1d2249;color:#eceaf7}
html.v2[data-theme="dark"] #qnPanel .qnTitle,html.v2[data-theme="dark"] #qnPanel .qnEd{color:#eceaf7}
html.v2[data-theme="dark"] #qnPanel .qnCtx select{background:#232953;color:#eceaf7;border-color:#2f3563}
html.v2[data-theme="dark"] .hoyW .hw-fecha b{color:#eceaf7}
html.v2[data-theme="dark"] .hoyW .hw-tiempo{background:#2a2350;border-color:#3d3470}
html.v2[data-theme="dark"] .hoyW .hw-tsum{color:#eceaf7}
html.v2[data-theme="dark"] .hoyW .hw-tsum em{background:#1d2249;border-color:#3d3470;color:#c4b5fd}
html.v2[data-theme="dark"] .hoyW .nop,html.v2[data-theme="dark"] .hoyW a.cam{background:#232953;border-color:#3d3470;color:#c4b5fd}
html.v2[data-theme="dark"] .hoyW .hw-ico{background:#2a2350!important;color:#c4b5fd}
html.v2[data-theme="dark"] .hoyW .hw-tsum b,html.v2[data-theme="dark"] .hoyW .hw-tsum strong{color:#eceaf7}
html.v2 #cin #cmic{background:none;color:#5b6477;border:0}
html.v2 #cin #cmic:hover{background:#f3f1fa}
html.v2[data-theme="dark"] #cin #cmic{color:#a7a4c0}
html.v2[data-theme="dark"] #cin #cmic:hover{background:#232953}

/* ------------------------------------------------ Exámenes por año y Avance */
html.v2 #ejercicios.v2exl-on > :not(#v2exl):not(h2){display:none!important}
html.v2 #ejercicios:not(.v2exl-on) > #v2exl{display:none}
html.v2 body.v2-area[data-v2m="examenes"] #ejercicios > h2.sec,html.v2 body.v2-area[data-v2m="examenes"] #ejercicios .exm-sel,html.v2 body.v2-area[data-v2m="examenes"] #ejercicios > p.lead{display:none}
html.v2 body.v2-area[data-v2m="avance"] #avance > h2.sec{display:none}
html.v2 .v2exv{margin:0 0 12px}
html.v2 .v2anio{font-size:.74rem;font-weight:800;letter-spacing:.1em;color:#848ca0;margin:18px 2px 8px}
html.v2 .v2anio:first-of-type{margin-top:4px}
html.v2 .v2tag.gris{background:#f0eff6;color:#5b6477}
html.v2 .v2nota{font-size:.84rem;color:#5b6477;margin:10px 2px}
html.v2 details.v2avm{margin-top:18px}
html.v2 details.v2avm .card{margin:0 0 6px}
html.v2[data-theme="dark"] .v2tag.gris{background:#232953;color:#a7a4c0}
html.v2[data-theme="dark"] .v2nota,html.v2[data-theme="dark"] .v2anio{color:#a7a4c0}
html.v2 body.v2-area[data-v2m="examenes"] .exm-meta{display:none}
html.v2 .v2exv b{margin-left:14px;padding-left:14px;border-left:1px solid #e2e6ef;color:#17213b;font-size:1.02rem;font-weight:800}
html.v2 .v2exv b:empty{display:none}
html.v2[data-theme="dark"] .v2exv b{color:#eceaf7;border-color:#2f3563}
/* Desarrollar y Corregir como en el prototipo */
html.v2 .corrDes{background:#fff!important;border:2px solid #8b5cf6!important;color:#6d3cf5!important}
html.v2 .corrDes[aria-expanded="true"]{background:#efe9ff!important}
html.v2 .corrGo{background:linear-gradient(135deg,#8b5cf6,#6d3cf5)!important;color:#fff!important;border:0!important;box-shadow:0 6px 16px rgba(109,60,245,.3)}
html.v2 .corrGo.vacio{opacity:.55;box-shadow:none}
html.v2 .corrDes > i svg,html.v2 .corrGo > i svg{width:16px;height:16px;vertical-align:-3px}
html.v2 .corrDes > i,html.v2 .corrGo > i{font-style:normal}
html.v2[data-theme="dark"] .corrDes{background:#1d2249!important;color:#c4b5fd!important}

/* ------------------------------------- prueba gratis: el estilo del prototipo
   (el orden de las preguntas y "Armar el plan recomendado" quedan como los
   decidió Fernando el 10 y el 13 de octubre) */
html.v2 .onbCh button.on{background:#efe9ff;color:#6d3cf5;border-color:#8b5cf6}
html.v2 .onbMeta button.on{border-color:#8b5cf6;background:#f1edfd}
html.v2 .pr-listo-cab .em{display:none}
html.v2 .pr-stats.v2 > div{background:#f6f3ff!important;border:1px solid #ece6ff;box-shadow:none!important;color:#17213b;text-align:left;padding:12px!important}
html.v2 .pr-stats.v2 > div::after{display:none}
html.v2 .pr-stats.v2 > div:hover{transform:none}
html.v2 .pr-stats.v2 .ic{display:none}
html.v2 .pr-stats.v2 b{color:#6d3cf5;font-size:1.5rem}
html.v2 .pr-stats.v2 small{color:#5b6477}
html.v2 .pr-uno{background:linear-gradient(160deg,#151b3f,#1f2758);color:#fff;border:0}
html.v2 .pr-uno .k{color:#c4b5fd}

/* ------------------------------------------------ pizarra: íconos y morado */
html.v2 #pzOv button[data-v2] svg{width:17px;height:17px;vertical-align:middle}
html.v2 #pzOv button[data-v2]{color:#5b6477}
html.v2 #pzOv button[data-v2].on{background:#6d3cf5!important;color:#fff!important}
html.v2 #pzOv .ic[data-v2]{color:#ddd6fe}

/* en la prueba gratis (modo foco) manda su propia barra: sin encabezado de ficha ni "cuál sigue" */
html.v2.pr-foco .v2fh,html.v2.pr-foco .v2sig{display:none!important}
/* simulacro: la opción elegida en el azul noche del prototipo */
html.v2 .pick button.on,html.v2 .fbq button.on,html.v2 .chipsT button.on{background:#151b3f;border-color:#151b3f;color:#fff}
html.v2[data-theme="dark"] .pick button.on,html.v2[data-theme="dark"] .fbq button.on,html.v2[data-theme="dark"] .chipsT button.on{background:#7c4dff;border-color:#7c4dff}

/* =========================================================================
   gradoapp.cl (la versión de siempre): solo la campana y Tu cuenta, al final
   de la franja de arriba (.hbar) o arriba a la derecha en el Inicio. Son las
   mismas reglas de arriba con html.v2e; v2.js pone top y right del menú.
   ========================================================================= */
html.v2e .v2der{margin-left:auto;display:flex;align-items:center;gap:10px}
html.v2e .v2camp{position:relative;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:#ddd6fe;background:rgba(255,255,255,.08);border:0;cursor:pointer;padding:0}
html.v2e .v2camp svg{width:18px;height:18px}
html.v2e .v2camp:hover,html.v2e .v2camp.on{background:rgba(255,255,255,.16);color:#fff}
html.v2e .v2n{position:absolute;top:-4px;right:-4px;min-width:17px;height:17px;border-radius:9px;background:#f43f5e;color:#fff;font-size:.66rem;font-weight:800;display:grid;place-items:center;padding:0 4px;box-shadow:0 0 0 2px #151b3f}
html.v2e .v2per{display:flex;align-items:center;gap:6px;border-radius:999px;padding:2px 8px 2px 2px;color:#ddd6fe;background:none;border:0;cursor:pointer;font:inherit}
html.v2e .v2per:hover,html.v2e .v2per.on{background:rgba(255,255,255,.1)}
html.v2e .v2per svg{width:14px;height:14px;transition:transform .2s}
html.v2e .v2per.on svg{transform:rotate(180deg)}
html.v2e .v2av{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:.78rem;background:linear-gradient(135deg,#8b5cf6,#6d3cf5);color:#fff;flex:none}
html.v2e .v2menu{display:none}
html.v2e .v2menu.on{display:block;position:absolute;z-index:70;width:340px;max-height:calc(100vh - 76px);overflow-y:auto;background:#fff;color:#17213b;border:1px solid #e2e6ef;border-radius:18px;box-shadow:0 24px 60px rgba(10,10,40,.3);text-align:left}
html.v2e .v2menu.perfil{width:300px}
html.v2e .v2mh{padding:14px 16px 10px;border-bottom:1px solid #e2e6ef}
html.v2e .v2mh b{font-size:1.02rem}
html.v2e .v2nt{display:flex;align-items:flex-start;gap:12px;padding:12px 16px;color:#17213b;text-decoration:none;font-size:.88rem;line-height:1.45}
html.v2e .v2nt:hover{background:#fbfaff}
html.v2e .v2nti{width:34px;height:34px;border-radius:10px;flex:none;display:grid;place-items:center;background:#fde7ef;color:#c2366b}
html.v2e .v2nti svg{width:17px;height:17px}
html.v2e .v2mv{font-size:.86rem;color:#848ca0;padding:16px;margin:0;line-height:1.5}
html.v2e .v2yo{display:flex;align-items:center;gap:12px;padding:16px}
html.v2e .v2yo .v2av{width:42px;height:42px;font-size:.9rem}
html.v2e .v2yo div{min-width:0}
html.v2e .v2yo b{display:block;font-size:.98rem}
html.v2e .v2yo div span{display:block;font-size:.78rem;color:#848ca0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.v2e .v2pase{display:flex;align-items:center;gap:8px;margin:0 16px 8px;background:#e6f6ec;color:#1d5a3b;border-radius:12px;padding:8px 11px;font-size:.8rem;text-decoration:none}
html.v2e .v2pase.no{background:#f1edfd;color:#4a22c9}
html.v2e .v2pase svg{width:16px;height:16px;flex:none}
html.v2e .v2op{padding:4px 8px;border-top:1px solid #e2e6ef;margin-top:6px}
html.v2e .v2op a{display:flex;align-items:center;gap:12px;padding:10px 8px;border-radius:10px;font-size:.9rem;font-weight:600;color:#17213b;text-decoration:none}
html.v2e .v2op a:hover{background:#fbfaff}
html.v2e .v2op svg{width:18px;height:18px;color:#848ca0;flex:none}
html.v2e .v2salir{display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;border:0;border-top:1px solid #e2e6ef;background:none;text-align:left;font:inherit;font-size:.88rem;font-weight:700;color:#d64545;cursor:pointer;text-decoration:none}
html.v2e .v2salir.ent{color:#6d3cf5}
html.v2e .v2salir svg{width:18px;height:18px}
html.v2e .v2mh{display:flex;align-items:center;justify-content:space-between;gap:10px}
html.v2e .v2lk{border:0;background:none;padding:0;font:inherit;font-size:.78rem;font-weight:700;color:#6d3cf5;cursor:pointer}
html.v2e .v2mf{display:flex;gap:6px;padding:10px 16px;border-bottom:1px solid #e2e6ef}
html.v2e .v2mf button{border:1px solid #e2e6ef;background:#fff;border-radius:999px;padding:4px 12px;font:inherit;font-size:.78rem;font-weight:700;color:#5b6477;cursor:pointer}
html.v2e .v2mf button.on{background:#141a3a;border-color:#141a3a;color:#fff}
html.v2e .v2nt{position:relative}
html.v2e .v2nt.nueva{background:#fbf9ff}
html.v2e .v2ntc{flex:1;min-width:0}
html.v2e .v2ntc > span{display:block}
html.v2e .v2ntc small{display:block;font-size:.74rem;color:#848ca0;margin-top:3px}
html.v2e .v2pt{position:absolute;right:14px;top:16px;width:8px;height:8px;border-radius:50%;background:#6d3cf5}
html.v2e .v2nt.t-anuncio .v2nti{background:#efe9ff;color:#6d3cf5}
html.v2e .v2nt.t-plan .v2nti{background:#e3f5ec;color:#1f8a5b}
html.v2e .v2op button{display:flex;align-items:center;gap:12px;width:100%;padding:10px 8px;border:0;border-radius:10px;background:none;font:inherit;font-size:.9rem;font-weight:600;color:#17213b;cursor:pointer;text-align:left}
html.v2e .v2op button:hover{background:#fbfaff}
html.v2e .v2op button svg{width:18px;height:18px;color:#848ca0;flex:none}
html.v2e .v2sw{margin-left:auto;width:34px;height:20px;border-radius:999px;background:#e2e6ef;position:relative;flex:none;transition:background .2s}
html.v2e .v2sw i{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:left .2s}
html.v2e .v2sw.on{background:#6d3cf5}
html.v2e .v2sw.on i{left:16px}
html.v2e .v2der{margin-left:0;flex:none}
html.v2e .hbar .ramo{flex:1;text-align:center}
html.v2e .v2der.v2e-ini{position:absolute;top:14px;right:18px;z-index:40}
html.v2e .v2menu.on{font-size:1rem;line-height:1.5}
@media (max-width:720px){
  html.v2e .v2menu.on,html.v2e .v2menu.perfil{left:8px!important;right:8px!important;width:auto}
  html.v2e .v2per svg{display:none}
  html.v2e .v2per{padding:2px}
}
@media (max-width:560px){
  html.v2e .hbar .ramo{display:none}
  html.v2e .hbar .back:first-child{margin-right:auto}
}