@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Source+Serif+4:wght@400;600;700&display=swap');
/* CX2B · hoja generada desde el panel de Look & Feel */
:root{
  --blue:#2e74b5; --blue-deep:#245e94; --deep:#245e94;
  --orange:#ed7d31; --green:#2f8f6b;
  --paper:#fafaf8; --card:#ffffff;
  --ink:#262626; --body:#404040; --muted:#6e6c64;
  --line:#e7e5e0; --line-soft:#f4f3f1;
  --ok:#2f6b4a; --ok-bg:#e6ede9;
  --bad:#b3261e; --bad-bg:#f6e5e4;
  --warn:#8a5a18; --warn-bg:#f3efe8;
  --blue-soft:#f2f7fb; --blue-line:#c9dbec;
  --sans:"Montserrat",system-ui,-apple-system,Segoe UI,sans-serif;
  --serif:"Source Serif 4",Georgia,serif;
  --radius:12px; --radius-sm:12px;
  .card > h3, .card > h4, .cx2b-titulo-tarjeta{font-size:.78rem !important;font-weight:700 !important;text-transform:uppercase !important;letter-spacing:.06em !important;color:var(--blue) !important;margin:0 0 10px}
  --maxw:1080px;
  --hdr-rule:2px solid #2e74b5;
  --foot-rule:1px solid #e7e5e0;
}

*{box-sizing:border-box}
html{font-size:16px}
body{margin:0;background:var(--paper);color:var(--body);font-family:var(--sans);
     font-size:0.9375rem;line-height:1.6;-webkit-text-size-adjust:100%}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--blue);outline-offset:2px;border-radius:4px}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important}
}
:where(.cx2b-ui) .wrap{max-width:var(--maxw);margin:0 auto;padding:24px 20px 64px}
:where(.cx2b-ui) .wrap-narrow{max-width:840px}
:where(.cx2b-ui) .eyebrow{font-size:.66rem;font-weight:600;letter-spacing:.12em;
         text-transform:uppercase;color:var(--muted)}
:where(.cx2b-ui) h1{font-family:var(--serif);font-size:1.5rem;color:var(--blue);margin:3px 0 0;font-weight:600}
:where(.cx2b-ui) h2{font-size:1rem;color:var(--blue);margin:26px 0 12px;font-weight:600;
   display:flex;align-items:center;gap:9px}
:where(.cx2b-ui) h2::after{content:"";flex:1;height:1px;background:var(--line)}
:where(.cx2b-ui) h3{font-size:.9rem;color:var(--blue-deep);margin:18px 0 8px;font-weight:600}
:where(.cx2b-ui) .nav{display:flex;gap:16px;margin:14px 0 22px;font-size:.85rem;flex-wrap:wrap}
:where(.cx2b-ui) .nav a{color:var(--blue)}
:where(.cx2b-ui) .nav a.on{font-weight:700;border-bottom:2px solid var(--blue)}
:where(.cx2b-ui) footer{margin-top:40px;padding-top:16px;border-top:var(--foot-rule);
       color:var(--muted);font-size:.72rem;text-align:center}
:where(.cx2b-ui) .card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
      padding:16px 18px;margin-bottom:12px;box-shadow:0 1px 2px rgba(16,24,40,.04)}
:where(.cx2b-ui) .aviso{padding:10px 14px;border-radius:var(--radius-sm);font-size:.85rem;margin-bottom:14px}
:where(.cx2b-ui) .aviso.ok{background:var(--ok-bg);color:var(--ok)}
:where(.cx2b-ui) .aviso.err{background:var(--bad-bg);color:var(--bad)}
:where(.cx2b-ui) .aviso.warn{background:var(--warn-bg);color:var(--warn)}
:where(.cx2b-ui) .info{border-left:3px solid var(--orange);background:var(--warn-bg);
      padding:9px 13px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;
      font-size:.79rem;margin:8px 0 12px;color:#6B5535}
:where(.cx2b-ui) .pill{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.7rem;font-weight:600}
:where(.cx2b-ui) .pill.on{background:var(--ok-bg);color:var(--ok)}
:where(.cx2b-ui) .pill.no{background:var(--bad-bg);color:var(--bad)}
:where(.cx2b-ui) .btn{background:var(--blue);color:#fff;border:0;border-radius:var(--radius-sm);
     padding:9px 16px;font-family:inherit;font-weight:600;font-size:.85rem;
     cursor:pointer;text-decoration:none;display:inline-block;line-height:1.3}
:where(.cx2b-ui) .btn:hover{background:var(--blue-deep);text-decoration:none}
:where(.cx2b-ui) .btn.sec{background:#fff;color:var(--blue);border:1px solid var(--blue)}
:where(.cx2b-ui) .btn.sec:hover{background:var(--blue-soft)}
:where(.cx2b-ui) .btn.go{background:var(--green)}
/* Modificadores que faltaban en la biblioteca: cada pantalla los venía
   declarando por su cuenta, y donde no lo hacía el botón salía azul.
   'warm' es el naranja de las acciones que consumen IA. */

/* Encabezado de sección: cada pantalla lo estilaba distinto (azul en una,
   serif negro en otra) siendo la misma sección. */
:where(.cx2b-ui) h2, :where(.cx2b-ui) .cx2b-seccion{font-family:var(--sans) !important;
   font-size:1rem !important;font-weight:600 !important;color:var(--blue) !important;
   margin:22px 0 12px !important;display:flex;align-items:center;gap:9px}
:where(.cx2b-ui) h2::after, :where(.cx2b-ui) .cx2b-seccion::after{content:"";flex:1;
   height:1px;background:var(--line)}
:where(.cx2b-ui) .btn.warm{background:var(--orange);color:#fff;border:0}
:where(.cx2b-ui) .btn.warm:hover{filter:brightness(.94)}
:where(.cx2b-ui) .btn.green{background:var(--ok);color:#fff;border:0}
:where(.cx2b-ui) .btn.gout{background:#fff;color:var(--ok);border:1px solid var(--ok)}
:where(.cx2b-ui) .btn.danger{background:var(--bad)}
:where(.cx2b-ui) .btn.sm{padding:5px 11px;font-size:.78rem}
:where(.cx2b-ui) .btn[disabled], :where(.cx2b-ui) .btn:disabled{opacity:.5;cursor:not-allowed}
:where(.cx2b-ui) .lnk{background:none;border:0;color:var(--blue);cursor:pointer;
     font-family:inherit;font-size:.8rem;padding:0 4px;text-decoration:none}
:where(.cx2b-ui) .lnk:hover{text-decoration:underline}
:where(.cx2b-ui) label.f, :where(.cx2b-ui) .f{display:block;font-size:.72rem;font-weight:600;color:var(--muted);margin-bottom:3px}
:where(.cx2b-ui) input[type=text], :where(.cx2b-ui) input[type=email], :where(.cx2b-ui) input[type=number], :where(.cx2b-ui) input[type=date], :where(.cx2b-ui) input[type=password], :where(.cx2b-ui) input[type=file], :where(.cx2b-ui) select, :where(.cx2b-ui) textarea{
  padding:8px 10px;border:1px solid var(--line);border-radius:7px;
  font-family:inherit;font-size:.85rem;background:#fff;color:var(--body)}
:where(.cx2b-ui) textarea{width:100%;resize:vertical;min-height:5.5em;line-height:1.5}
:where(.cx2b-ui) .chk{display:flex;align-items:center;gap:7px;font-size:.85rem}
:where(.cx2b-ui) .row{display:flex;gap:10px;flex-wrap:wrap;align-items:end}
:where(.cx2b-ui) table{width:100%;border-collapse:collapse;font-size:.85rem}
:where(.cx2b-ui) th{text-align:left;color:var(--blue);font-weight:600;font-size:.72rem;
   text-transform:uppercase;letter-spacing:.04em;padding:8px 10px;
   border-bottom:1px solid var(--line)}
:where(.cx2b-ui) td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
:where(.cx2b-ui) tr.off td{opacity:.5}
:where(.cx2b-ui) .muted{color:var(--muted)}
:where(.cx2b-ui) .mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em}
:where(.cx2b-ui) .center{text-align:center}
:where(.cx2b-ui) .right{text-align:right}
@media (max-width:640px){
  :where(.cx2b-ui) .wrap{padding:16px 14px 48px}
  :where(.cx2b-ui) h1{font-size:1.25rem}
  :where(.cx2b-ui) .row{gap:8px}
  :where(.cx2b-ui) table{font-size:.8rem}
  :where(.cx2b-ui) th, :where(.cx2b-ui) td{padding:6px 7px}
  :where(.cx2b-ui) .btn{padding:10px 16px}
}
@media print{
  body{background:#fff}
  :where(.cx2b-ui) .nav, :where(.cx2b-ui) .btn, :where(.cx2b-ui) .lnk{display:none !important}
  :where(.cx2b-ui) .card{border:1px solid #ccc;box-shadow:none}
}

/* Front del alumno: respira un poco más que el backend. */
body.app-front .wrap{padding:26px 20px 60px}
body.app-front h1{font-size:1.8rem;margin:4px 0 0}
body.app-front header{border-bottom:var(--hdr-rule);padding-bottom:14px;margin-bottom:26px}
body.app-front .eyebrow{font-size:.68rem}
body.app-front .card{border-radius:calc(var(--radius) + 2px);padding:24px}
body.app-front .btn{border-radius:9px;padding:12px 26px;font-size:.9rem}
body.app-front .btn.sm{padding:7px 14px;font-size:.8rem}
body.app-front label.f,body.app-front .f{font-size:.78rem;color:var(--ink);margin:14px 0 5px}
body.app-front input[type=text],body.app-front input[type=email],
body.app-front input[type=password],body.app-front input[type=file],
body.app-front select{width:100%;padding:10px 12px;border-radius:8px;
  font-size:.92rem;color:var(--ink)}
body.app-front .hint{font-size:.74rem;color:var(--muted);margin-top:4px}