/* Pupitre — Modo ICFES (views/icfes.js y piezas ICFES de perfil, preicfes y examenes). Prefijo ik-; colores sólo con tokens de app.css. */


/* ---------- bienvenida ---------- */
.pf-ic-form{display:flex;flex-direction:column;gap:18px;max-width:560px}
.pf-ic-form small{display:block;margin-top:6px;line-height:1.45}

/* ---------- inicio ---------- */
.ik-hero{padding:24px;gap:18px}
.ik-hero .deco{color:var(--flame)}
.ik-hero-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:22px;align-items:center;position:relative}
.ik-cuenta{display:flex;flex-direction:column;gap:6px;min-width:0}
.ik-cuenta .big{color:var(--ink)}
.ik-cuenta p{margin:0;font-size:14px;line-height:1.45}
.ik-cuenta-t{font-size:22px;line-height:1.15}
.ik-cuenta .link{align-self:flex-start}
.ik-hero-cta{display:flex;flex-direction:column;gap:14px;min-width:0}
.ik-hero-lead{margin:0;font-size:15.5px;line-height:1.5;color:var(--ink-2);max-width:56ch}
.ik-racha{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;border-top:1px solid var(--line);padding-top:14px;position:relative}
.ik-racha-f,.ik-racha-xp{display:inline-flex;align-items:center;gap:6px;font-size:14px}
.ik-racha-f{color:var(--flame)}
.ik-racha-f[data-cero="true"]{color:var(--muted)}
.ik-racha-xp{color:var(--gold)}
.ik-racha-f b,.ik-racha-xp b{font-family:var(--f-head);font-size:18px;color:var(--ink)}
.ik-racha small{color:var(--muted);font-size:13px}
.ik-dias{display:inline-flex;gap:5px;margin-left:auto}
.ik-dias i{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:700;background:var(--soft);color:var(--muted);border:1px solid var(--line)}
.ik-dias i[data-on="true"]{background:var(--flame-soft);color:var(--flame);border-color:transparent}
.ik-dias i[data-hoy="true"]{outline:2px solid var(--flame);outline-offset:1px}

.ik-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:14px;align-items:start}
.ik-col{display:flex;flex-direction:column;gap:14px;min-width:0}
.ik-res{display:flex;flex-direction:column;gap:14px;min-width:0}
.ik-res-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ik-res-g{font-size:40px;font-weight:700;line-height:1;letter-spacing:-.03em;margin:6px 0 4px}
.ik-res-g small{font-size:15px;color:var(--muted);font-weight:600;margin-left:4px;letter-spacing:0}
.ik-res-t{display:block;font-size:20px;margin-top:4px}
.ik-res-vacio p{margin:0;font-size:14px;line-height:1.5}
.ik-res-ph{display:flex;flex-wrap:wrap;gap:8px}
.ik-res-ph span{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.ik-res-ph i,.ik-ley i,.ik-evo-pr i{width:10px;height:10px;border-radius:3px;background:var(--tint,var(--accent));display:inline-block}
.ik-pruebas{display:flex;flex-direction:column;gap:8px}
.ik-pr{display:grid;grid-template-columns:92px minmax(0,1fr) 30px auto;align-items:center;gap:10px;font-size:13.5px}
.ik-pr-n{font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ik-pr-bar{height:8px;border-radius:999px;background:var(--soft);overflow:hidden;border:1px solid var(--line)}
.ik-pr-bar i{display:block;height:100%;background:var(--tint,var(--accent));border-radius:999px}
.ik-pr b{text-align:right}
.ik-pr .tag{justify-self:end}
/* Tarjeta "Tu progreso" del inicio: nivel por prueba y cuánto falta para el siguiente */
.ik-prg-d{font-size:13.5px;color:var(--muted);line-height:1.4}
.ik-prg-d b{font-family:var(--f-head);font-size:15px;color:var(--ink)}
.ik-prg-d[data-d="up"] b{color:var(--pos)}
.ik-prg-d[data-d="down"] b{color:var(--neg)}
.ik-prg-sub{display:block;font-size:12.5px;margin-top:2px}
.ik-prg-l{display:flex;flex-direction:column;gap:4px}
.ik-prg-l>.eyebrow{margin-bottom:4px}
.ik-prg-r{display:flex;flex-direction:column;gap:3px;padding:7px 10px;margin:0 -10px;border-radius:var(--r)}
.ik-prg-r[data-cerca="true"]{background:var(--tint-soft);box-shadow:inset 3px 0 0 var(--tint)}
.ik-prg-f{font-size:12.5px;color:var(--muted);line-height:1.4}
.ik-prg-f .tag{margin-left:4px;vertical-align:1px}
.ik-prg-foco[data-area] .mt-paso-ic{background:var(--tint-soft);color:var(--tint)}
.ik-prg-tope{display:flex;align-items:center;gap:6px;margin:0;font-size:13.5px}
.ik-evo-k [data-k="mejor"] small::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--gold);margin-right:6px;vertical-align:1px}

.ik-paso{display:flex;flex-direction:column;gap:10px;min-width:0}
.ik-paso-in{display:flex;gap:14px;align-items:flex-start;min-width:0}
.ik-paso-tx{display:flex;flex-direction:column;gap:6px;min-width:0}
.ik-paso-tx .h{font-size:18px;line-height:1.25}
.ik-paso-tx p{margin:0;font-size:14px;line-height:1.5}
.ik-paso-tx .row{margin-top:6px}
.ik-paso-tx .btn{white-space:normal;text-align:left}
.ik-cards{grid-template-columns:repeat(2,minmax(0,1fr));margin:0}

/* ---------- guía, lecturas y examen (preicfes.js en modo ICFES) ---------- */
.pi-mas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:12px}
.pi-mas-b{display:flex;align-items:center;gap:14px;padding:14px 16px;text-align:left;color:var(--ink);cursor:pointer;min-width:0}
.pi-mas-b:hover{background:var(--soft)}
.pi-mas-b .tx{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.pi-mas-b small{color:var(--muted);font-size:13px;line-height:1.35}
.pi-lect-prog{display:flex;flex-direction:column;gap:8px}
.pi-minis{display:inline-flex;align-items:flex-end;gap:3px;height:26px;margin-right:6px}
.pi-mini{width:7px;height:26px;border-radius:3px;background:var(--soft);display:flex;align-items:flex-end;overflow:hidden}
.pi-mini i{display:block;width:100%;background:var(--tint,var(--accent))}

/* ---------- resultado: comparación con el mejor intento ---------- */
.ex-dx-best{margin:0;display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:var(--r);background:var(--gold-soft);color:var(--ink);font-size:14px;line-height:1.45}
.ex-dx-best svg{flex:none;color:var(--gold);margin-top:1px}
/* las celdas de comparación no caben de a dos a 390 px: una por fila en celular y el nombre se recorta en vez de montarse */
.ex-dx-cmp{grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}
.ex-dx-ci > span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ex-dx-ci > span{flex:none}

/* ---------- mi progreso ---------- */
.ik-evo{display:flex;flex-direction:column;gap:12px}
.ik-evo .sec-h{margin-bottom:0}
.ik-evo-k{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.ik-evo-k>div{background:var(--soft);border-radius:var(--r);padding:10px 12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.ik-evo-k small{font-size:12px;color:var(--muted)}
.ik-evo-k b{font-size:22px;line-height:1.1}
.ik-evo-k b span{font-size:.55em;color:var(--muted);font-weight:600;margin-left:2px}
.ik-evo-k b[data-d="up"],.ik-evo-pr em[data-d="up"]{color:var(--pos)}
.ik-evo-k b[data-d="down"],.ik-evo-pr em[data-d="down"]{color:var(--neg)}
.ik-evo-seg{align-self:flex-start}
.ik-graf{position:relative;width:100%;min-height:200px}
.ik-graf svg{display:block;max-width:100%}
.ik-g-grid{stroke:var(--line);stroke-width:1}
.ik-g-t{fill:var(--muted);font-size:11px;font-family:var(--f-body)}
.ik-g-v{fill:var(--ink);font-size:13px;font-weight:700;font-family:var(--f-head)}
.ik-g-best{fill:var(--gold-soft);stroke:var(--gold);stroke-width:2}
.ik-g-bt{fill:var(--gold);font-size:11.5px;font-weight:700;font-family:var(--f-body)}
.ik-g-s{--c:var(--accent)}
.ik-g-s[data-area]{--c:var(--tint)}
.ik-g-line{fill:none;stroke:var(--c);stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.ik-g-area{fill:var(--c);fill-opacity:.08;stroke:none}
.ik-g-pt{fill:var(--card);stroke:var(--c);stroke-width:2}
.ik-ley,.ik-evo-pr{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:12.5px;color:var(--muted)}
.ik-ley span,.ik-evo-pr span{display:inline-flex;align-items:center;gap:6px}
.ik-evo-pr b{color:var(--ink);font-weight:600}
.ik-evo-pr em{font-style:normal;font-weight:700}
.ik-evo-nota{margin:0;font-size:12.5px}
.ik-evo-vacio{display:flex;flex-direction:column;align-items:center;gap:6px}
.ik-const{display:flex;flex-direction:column;gap:12px;min-width:0}
.ik-const-k{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.ik-const-k>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.ik-const-k b{font-size:24px;line-height:1.1}
.ik-const-k small{font-size:12px;color:var(--muted)}
.ik-const-ic{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--soft);color:var(--accent);margin-bottom:4px}
.ik-const-ic[data-k="flame"]{background:var(--flame-soft);color:var(--flame)}
.ik-const-ic[data-k="gold"]{background:var(--gold-soft);color:var(--gold)}
.ik-hist .li .end{display:flex;align-items:center;gap:4px}
.ik-hist .li .ic[data-area]{background:var(--tint-soft);color:var(--tint)}

@media (max-width:900px){
  .ik-hero-g,.ik-grid,.ik-cards{grid-template-columns:minmax(0,1fr)}
  .ik-hero{padding:18px}
  .ik-dias{margin-left:0}
  .ik-evo-k{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){
  .ik-pr{grid-template-columns:78px minmax(0,1fr) 26px auto;gap:8px;font-size:13px}
  .ik-hero-cta .row .btn{flex:1 1 100%}
  .ik-dias i{width:24px;height:24px}
}
/* Dieta de texto: en Mi progreso (ICFES) cada logro muestra sólo su nombre; la descripción queda para lectores de pantalla y en el botón «i» */
.ik-logros .pf-lg-tx>small{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ik-logros .pf-logro{position:relative}