:root{
  /* Herramienta de trabajo: tinta azul pizarra, acento verde petróleo */
  --bg:#f3f4f1; --panel:#ffffff; --ink:#1c2430; --muted:#5d6876; --line:#d9ddd6; --soft:#eceee9;
  --accent:#0d5c63; --accent-ink:#ffffff; --accent-soft:#dcecec;
  --ok:#1e7a46; --ok-soft:#dff1e6; --warn:#a15c00; --warn-soft:#fbefd9; --bad:#b42318; --bad-soft:#fde4e1;
  --font-d:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif; --font-b:"Public Sans","Segoe UI",system-ui,sans-serif; --r:8px;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#12171d; --panel:#1a2129; --ink:#e7ebef; --muted:#9aa6b2; --line:#2c3640; --soft:#222a33;
  --accent:#4fb3b8; --accent-ink:#0b1a1c; --accent-soft:#1d3436;
  --ok:#5cc98a; --ok-soft:#173326; --warn:#f0b257; --warn-soft:#3a2a12; --bad:#ff8a7a; --bad-soft:#3d1b17; color-scheme:dark; } }
:root[data-theme="dark"]{
  --bg:#12171d; --panel:#1a2129; --ink:#e7ebef; --muted:#9aa6b2; --line:#2c3640; --soft:#222a33;
  --accent:#4fb3b8; --accent-ink:#0b1a1c; --accent-soft:#1d3436;
  --ok:#5cc98a; --ok-soft:#173326; --warn:#f0b257; --warn-soft:#3a2a12; --bad:#ff8a7a; --bad-soft:#3d1b17; color-scheme:dark; }
*{box-sizing:border-box} html,body{margin:0;min-height:100%}
body{background:var(--bg);color:var(--ink);font:14px/1.45 var(--font-b);display:flex;flex-direction:column;min-height:100vh}
h1,h2,h3{font-family:var(--font-d);text-wrap:balance;margin:0} h1{font-size:22px} h2{font-size:20px} h3{font-size:15px}
a{color:var(--accent)} button,input,select,textarea{font:inherit;color:inherit} button{cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Barra superior */
.barra{display:flex;align-items:center;gap:18px;padding:10px 20px;background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap}
.marca{font:700 17px var(--font-d);color:var(--ink);text-decoration:none}
.menu{display:flex;gap:2px;flex-wrap:wrap}
.menu a{padding:7px 11px;border-radius:6px;text-decoration:none;color:var(--muted);font-weight:600}
.menu a.on,.menu a:hover{background:var(--accent-soft);color:var(--ink)}
.quien{margin-left:auto;display:flex;align-items:center;gap:10px}
.quien span{display:flex;flex-direction:column;text-align:right;font-weight:600;font-size:13px} .quien small{color:var(--muted);font-weight:400}
.quien form{margin:0}
.franja{padding:8px 20px;font-size:13px} .franja.warn{background:var(--warn-soft);color:var(--warn)}
.contenido{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:22px 20px 50px}
.contenido.ancho{max-width:none}
.pie-app{padding:14px 20px;text-align:center;color:var(--muted);font-size:12px}
/* Componentes */
.btn{border:1px solid var(--line);background:var(--panel);padding:7px 12px;border-radius:var(--r);font-weight:600;display:inline-flex;gap:6px;align-items:center;text-decoration:none;color:var(--ink);white-space:nowrap}
.btn:hover{border-color:var(--accent)} .btn.pri{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.btn.peq{padding:4px 9px;font-size:12px} .btn.peligro{color:var(--bad)} .btn[disabled]{opacity:.5;cursor:not-allowed}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.cab{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.cab p{margin:4px 0 0;color:var(--muted);max-width:72ch} .cab .acciones{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
label.f{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted);font-weight:600}
label.f input,label.f select,label.f textarea{font-size:14px;color:var(--ink);font-weight:400}
input[type=text],input[type=number],input[type=time],input[type=password],input[type=email],input[type=date],input[type=search],select,textarea{border:1px solid var(--line);background:var(--panel);border-radius:6px;padding:7px 9px}
input:disabled,select:disabled,textarea:disabled{opacity:.7}
.filas{display:flex;flex-direction:column;gap:12px} .fila{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.tabla-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}
table.t{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
table.t th{background:var(--soft);text-align:left;font-size:12px;color:var(--muted);font-weight:700;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
table.t td{padding:7px 10px;border-bottom:1px solid var(--line);vertical-align:middle} table.t tr:last-child td{border-bottom:0}
table.t td input,table.t td select{width:100%;min-width:60px}
.chip{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:600;white-space:nowrap}
.chip.ok{background:var(--ok-soft);color:var(--ok)} .chip.warn{background:var(--warn-soft);color:var(--warn)} .chip.bad{background:var(--bad-soft);color:var(--bad)} .chip.neu{background:var(--soft);color:var(--muted)}
.alerta{padding:10px 14px;border-radius:var(--r);margin-bottom:14px;border-left:4px solid;font-weight:500}
.alerta.ok{background:var(--ok-soft);border-color:var(--ok)} .alerta.error{background:var(--bad-soft);border-color:var(--bad)} .alerta.aviso{background:var(--warn-soft);border-color:var(--warn)}
.lista-msg{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.lista-msg li{padding:8px 10px;border-radius:6px;border-left:4px solid;font-size:13px}
.lista-msg li.e{background:var(--bad-soft);border-color:var(--bad)} .lista-msg li.a{background:var(--warn-soft);border-color:var(--warn)} .lista-msg li.o{background:var(--ok-soft);border-color:var(--ok)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:16px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.kpi b{display:block;font:700 24px/1.1 var(--font-d);font-variant-numeric:tabular-nums} .kpi span{font-size:12px;color:var(--muted)}
.kpi.ok b{color:var(--ok)} .kpi.bad b{color:var(--bad)} .kpi.warn b{color:var(--warn)}
.muted{color:var(--muted)} .pie{font-size:12px;color:var(--muted)}
.paginas{display:flex;gap:4px;margin-top:12px} .paginas a{padding:4px 10px;border:1px solid var(--line);border-radius:6px;text-decoration:none;color:var(--ink)} .paginas a.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}
.vacio{text-align:center;padding:40px 16px;color:var(--muted)}
.inline{display:inline} .acc{display:flex;gap:6px;flex-wrap:wrap}
details summary{cursor:pointer}
/* Acceso */
.acceso{min-height:100vh;display:grid;place-items:center;padding:20px}
.acceso .caja{width:100%;max-width:400px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:28px;display:flex;flex-direction:column;gap:14px}
.acceso .caja h1{font-size:24px} .acceso .caja p{margin:0;color:var(--muted)}
.acceso .caja .btn{justify-content:center}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* Modal y avisos */
.modal-fondo{position:fixed;inset:0;background:rgba(10,15,20,.45);display:grid;place-items:center;z-index:50;padding:16px}
.modal{background:var(--panel);border-radius:12px;padding:20px;max-width:760px;width:100%;max-height:90vh;overflow:auto;display:flex;flex-direction:column;gap:14px}
.toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:8px;font-weight:600;z-index:60;max-width:90vw}
textarea{width:100%;min-height:120px}
@media (max-width:760px){ .quien span{display:none} .contenido{padding:16px 12px 40px} }
@media (prefers-reduced-motion: reduce){ *{transition:none!important} }

/* ===== Versión 1.2: más color y vida ===== */
:root{ --deep:#0b3b40; --deep-2:#0f4c52; --sun:#f2a33a; --sun-soft:#fdf0dc; --sky:#3b82c4; --rose:#d94f70; }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ --deep:#0a2a2e; --deep-2:#103a3f; --sun:#f6b860; --sun-soft:#3a2c14; } }
:root[data-theme="dark"]{ --deep:#0a2a2e; --deep-2:#103a3f; --sun:#f6b860; --sun-soft:#3a2c14; }
body{background:var(--bg) radial-gradient(circle at 1px 1px, color-mix(in srgb,var(--accent) 9%,transparent) 1px, transparent 0) 0 0/22px 22px}
.barra{background:linear-gradient(100deg,var(--deep),var(--deep-2));border-bottom:3px solid var(--sun);color:#fff}
.barra .marca{color:#fff;display:flex;align-items:center;gap:8px}
.barra .marca::before{content:"";width:22px;height:22px;border-radius:6px;background:conic-gradient(var(--sun) 0 25%, #4fb3b8 0 50%, #e76f51 0 75%, #8ecae6 0);box-shadow:0 0 0 2px rgba(255,255,255,.25)}
.barra .menu a{color:rgba(255,255,255,.78)} .barra .menu a.on,.barra .menu a:hover{background:rgba(255,255,255,.14);color:#fff}
.barra .menu a.on{box-shadow:inset 0 -3px 0 var(--sun)}
.barra .quien span{color:#fff} .barra .quien small{color:rgba(255,255,255,.7)}
.barra .btn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.25);color:#fff}
.btn.pri{background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 88%,#fff),var(--accent));box-shadow:0 2px 6px color-mix(in srgb,var(--accent) 35%,transparent)}
.btn.pri:hover{filter:brightness(1.07)}
.btn.sol{background:var(--sun);border-color:var(--sun);color:#3a2300}
.card{box-shadow:0 1px 2px rgba(15,40,45,.05),0 4px 14px rgba(15,40,45,.04)}
h1{color:var(--deep)} :root[data-theme="dark"] h1{color:var(--ink)}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) h1{color:var(--ink)} }
.kpi{position:relative;overflow:hidden;border-top:4px solid var(--accent)}
.kpi:nth-child(2){border-top-color:var(--sky)} .kpi:nth-child(3){border-top-color:var(--sun)} .kpi:nth-child(4){border-top-color:var(--rose)}
.kpi.ok{border-top-color:var(--ok)} .kpi.bad{border-top-color:var(--bad)} .kpi.warn{border-top-color:var(--warn)}
.kpi::after{content:"";position:absolute;right:-18px;bottom:-18px;width:70px;height:70px;border-radius:50%;background:currentColor;opacity:.04}
table.t th{background:color-mix(in srgb,var(--accent) 9%,var(--panel));color:var(--deep)}
table.t tbody tr:hover td{background:color-mix(in srgb,var(--accent) 4%,transparent)}
.alerta{box-shadow:0 2px 8px rgba(0,0,0,.04)}
.acceso{background:linear-gradient(135deg,color-mix(in srgb,var(--deep) 92%,#000),var(--deep-2) 55%,color-mix(in srgb,var(--accent) 70%,var(--deep)))}
.acceso .caja{border:0;box-shadow:0 20px 50px rgba(0,0,0,.25);border-top:5px solid var(--sun)}
.acceso .caja h1{color:var(--deep)}

/* ===== Menú Mi perfil ===== */
.perfil{margin-left:auto;position:relative}
.perfil summary{list-style:none;display:flex;align-items:center;gap:10px;cursor:pointer;padding:4px 8px 4px 4px;border-radius:999px;color:#fff;transition:background .15s}
.perfil summary::-webkit-details-marker{display:none}
.perfil summary:hover,.perfil[open] summary{background:rgba(255,255,255,.14)}
.perfil .avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font:700 13px var(--font-d);background:var(--sun);color:#3a2300;box-shadow:0 0 0 2px rgba(255,255,255,.35)}
.perfil .quien-txt{display:flex;flex-direction:column;font-weight:600;font-size:13px;line-height:1.2;text-align:left}
.perfil .quien-txt small{color:rgba(255,255,255,.72);font-weight:400}
.perfil .flecha{font-size:11px;opacity:.8}
.perfil-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:240px;background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 36px rgba(10,30,35,.22);padding:6px;z-index:40;display:flex;flex-direction:column}
.perfil-cab{padding:10px 12px 8px;border-bottom:1px solid var(--line);margin-bottom:4px;display:flex;flex-direction:column}
.perfil-cab small{color:var(--muted)}
.perfil-menu a{padding:9px 12px;border-radius:8px;text-decoration:none;color:var(--ink);font-weight:500}
.perfil-menu a:hover,.perfil-menu a.on{background:var(--accent-soft)}
.perfil-menu form{margin:4px 0 0;border-top:1px solid var(--line);padding-top:4px}
.perfil-menu .salir{width:100%;text-align:left;padding:9px 12px;border:0;background:none;border-radius:8px;color:var(--bad);font-weight:600}
.perfil-menu .salir:hover{background:var(--bad-soft)}
@media (max-width:760px){ .perfil .quien-txt{display:none} }

/* ===== Menú con íconos (v1.3) ===== */
.barra .menu{gap:4px}
.barra .menu a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 12px 5px;border-radius:10px;font-size:12px;min-width:72px}
.barra .menu a .ico{width:22px;height:22px;transition:transform .15s}
.barra .menu a:hover .ico{transform:translateY(-1px) scale(1.06)}
.barra .menu a.on{background:rgba(255,255,255,.16);box-shadow:inset 0 -3px 0 var(--sun)}
.barra .menu a.on .ico{color:var(--sun)}
.ico{flex:none;vertical-align:middle}
.btn .ico{width:17px;height:17px}
@media (max-width:760px){ .barra .menu a{min-width:56px;padding:6px 6px} .barra .menu a span{font-size:10.5px} }

/* ===== Mi IE ===== */
.cab-ie{align-items:center}
.insignia-grande{width:72px;height:72px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-soft),var(--sun-soft));color:var(--deep);box-shadow:0 4px 14px rgba(15,40,45,.1);overflow:hidden;flex:none}
.insignia-grande img{max-width:100%;max-height:100%;object-fit:contain}
.insignia-marco{height:150px;border:2px dashed var(--line);border-radius:12px;display:grid;place-items:center;background:var(--soft)}
.insignia-marco img{max-height:130px;max-width:90%;object-fit:contain}
.tit-ico{display:flex;align-items:center;gap:8px;color:var(--deep)} .tit-ico .ico{color:var(--accent)}
.chip-check{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:var(--panel);font-weight:600;cursor:pointer}
.chip-check:has(input:checked){background:var(--accent-soft);border-color:var(--accent)}
.grados{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.grado{border:1px solid var(--line);border-radius:12px;padding:10px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 5%,var(--panel)),var(--panel));display:flex;flex-direction:column;gap:6px}
.grado-cab{display:flex;align-items:center;gap:6px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.grado-cab b{font:700 24px var(--font-d);color:var(--deep)} .grado-cab .cant{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end}
.grado-cab .cant input{width:64px}
.sec-fila{display:flex;align-items:center;gap:6px}
.sec-fila select{flex:1;min-width:0} .sec-fila input{width:58px}
.sec-letra{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;font-weight:700;background:var(--accent);color:var(--accent-ink);flex:none}

/* ===== Personal ===== */
.grupo-tit{margin:20px 0 10px;display:flex;align-items:center;gap:8px;color:var(--deep)}
.personal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.persona{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:8px;box-shadow:0 1px 2px rgba(15,40,45,.05);transition:box-shadow .15s, transform .15s}
.persona:hover{box-shadow:0 6px 18px rgba(15,40,45,.09);transform:translateY(-1px)}
.persona-cab{display:flex;gap:10px;align-items:center}
.persona-cab b{display:block;font-size:14px} .persona-cab small{color:var(--muted)}
.avatar-p{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font:700 14px var(--font-d);color:#fff;background:var(--accent);flex:none}
.avatar-p.t-director{background:linear-gradient(135deg,#c2410c,var(--sun))} .avatar-p.t-subdirector{background:linear-gradient(135deg,#7c3aed,#c084fc)}
.avatar-p.t-jerarquico{background:linear-gradient(135deg,#2563eb,#60a5fa)} .avatar-p.t-auxiliar{background:linear-gradient(135deg,#64748b,#94a3b8)}
.avatar-p.t-docente{background:linear-gradient(135deg,var(--accent),#4fb3b8)}
.persona-areas{display:flex;flex-wrap:wrap;gap:4px}
.persona-areas span{font-size:11px;font-weight:700;padding:2px 7px;border-radius:6px;background:var(--accent-soft);color:var(--deep)}
.persona-areas small{font-weight:400;color:var(--muted)}
.vacio-grande{text-align:center;padding:40px 20px;display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--muted)}
.vacio-grande .ico{color:var(--accent)} .vacio-grande h2{color:var(--deep)} .vacio-grande p{max-width:60ch}
.tit-ico{display:flex;align-items:center;gap:8px;color:var(--deep)}
.origen-ie{background:var(--accent-soft);border-radius:8px;padding:8px}
.chips-ie{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:4px}

/* ===== Reportes ===== */
.rep-elige{align-items:flex-end;margin-bottom:12px}
.rep-tipos{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin:12px 0}
.rep-tipo{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);cursor:pointer;font:inherit;color:inherit;transition:all .15s}
.rep-tipo .ico{color:var(--accent);margin-bottom:4px} .rep-tipo small{color:var(--muted);font-size:12px}
.rep-tipo:hover{border-color:var(--accent);transform:translateY(-1px)}
.rep-tipo.on{border-color:var(--accent);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--accent)}
.rep-barra{display:flex;align-items:flex-end;gap:8px;flex-wrap:wrap;margin-bottom:12px;position:sticky;top:0;z-index:3}
.rep-barra .esp{flex:1}
#rep .pag{background:#fff;color:#1b2a2e;border:1px solid var(--line);border-radius:12px;padding:18px;margin-bottom:16px;overflow:auto}
.pag .enc{display:flex;gap:14px;align-items:center;margin-bottom:10px} .pag .enc img{max-height:58px;max-width:70px;object-fit:contain}
.pag .ie{font-weight:700;font-size:15px} .pag h2{font-size:18px;margin:2px 0;color:var(--deep)} .pag .sub{font-size:12px;color:#55666a}
.pag .sub-t{font-size:14px;margin:14px 0 6px}
.ph{width:100%;border-collapse:collapse;font-size:12px}
.ph th,.ph td{border:1px solid #cfd8da;padding:4px;text-align:center;vertical-align:middle}
.ph thead th{background:#eef4f4;font-weight:700} .ph th small,.ph td small{display:block;font-size:10px;font-weight:400;color:#5b6b6f}
.ph .hcol{width:72px;background:#f6f9f9;white-space:nowrap}
.ph td.cl{background:color-mix(in srgb,var(--a) 15%,#fff);border-left:3px solid var(--a)} .ph td.cl b{font-size:12px}
.ph td.vac{background:#fafafa} .ph td.r{background:#f2f2f2;font-size:10px;color:#666;padding:2px}
.ph.sabana{font-size:10.5px} .ph.sabana td{min-width:62px} .ph .dia{writing-mode:vertical-rl;transform:rotate(180deg);background:#e6eff0;width:24px}
.ph tr.ini-dia>*{border-top:2px solid #6b8a8f}
.ph .izq{text-align:left} .ph tr.tot>*{background:#eef4f4;font-weight:700}
.tabla-datos td{height:auto}
.m-ok{background:#e8f6ee} .m-alto{background:#fff4dc} .m-bajo{background:#fde8e8}
.hueco{color:#b45309!important}
.dos{display:flex;gap:16px;flex-wrap:wrap;margin-top:10px;align-items:flex-start}
.nl{border-collapse:collapse;font-size:11.5px} .nl th,.nl td{border:1px solid #cfd8da;padding:3px 8px;text-align:left} .nl th{background:#eef4f4} .nl tr.tot td{font-weight:700;background:#f6f9f9}
.pt{display:inline-block;width:9px;height:9px;border-radius:3px;background:var(--a);margin-right:6px;vertical-align:middle}
.ley{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:11px;margin-top:8px}
.pag .firma{margin-top:34px;display:flex;justify-content:flex-end;font-size:11px} .pag .firma div{border-top:1px solid #333;padding-top:4px;min-width:220px;text-align:center}
@media print{
  body{background:#fff} .barra,.cab,.rep-elige,.rep-tipos,.rep-barra,#rep-aviso,.pie-app,.toast,.paginas{display:none!important}
  .contenido{padding:0!important;max-width:none!important}
  #rep .pag{border:0;border-radius:0;padding:0;margin:0;page-break-after:always;overflow:visible}
  #rep .pag:last-child{page-break-after:auto}
  .ph,.nl{font-size:9.5px} .ph.sabana{font-size:8px} .ph.sabana td{min-width:0}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  @page{size:A4 landscape;margin:8mm}
}

/* ===== Dashboard inteligente ===== */
.dash-hero{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px;border-radius:16px;margin-bottom:14px;color:#fff;background:linear-gradient(120deg,var(--deep),var(--accent) 70%,#4fb3b8)}
.dash-hero-ie{display:flex;gap:16px;align-items:center} .dash-hero h1{color:#fff;margin:2px 0;font-size:24px} .dash-hero p,.dash-hero small{color:rgba(255,255,255,.85);margin:0}
.dash-logo{width:72px;height:72px;border-radius:16px;background:#fff;object-fit:contain;padding:6px;flex:none}
.vacio-logo{display:grid;place-items:center;color:var(--accent)}
.anillo{position:relative;width:112px;height:112px;flex:none} .anillo svg{transform:rotate(-90deg)}
.anillo .an-f{fill:none;stroke:rgba(255,255,255,.25);stroke-width:10} .anillo .an-v{fill:none;stroke:var(--sun);stroke-width:10;stroke-linecap:round;transition:stroke-dashoffset .8s}
.anillo>div{position:absolute;inset:0;display:grid;place-content:center;text-align:center} .anillo b{font:700 24px var(--font-d)} .anillo small{display:block;font-size:11px}
.dash-sig{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:12px;background:var(--warn-soft);color:var(--ink);text-decoration:none;margin-bottom:14px;border:1px solid color-mix(in srgb,var(--warn) 30%,transparent)}
.dash-sig .ico{color:var(--warn)} .dash-sig small{display:block;color:var(--muted)} .dash-sig .ir{margin-left:auto;font-weight:700;color:var(--deep)}
.dash-sig.ok{background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 30%,transparent)} .dash-sig.ok .ico{color:var(--ok)}
.dash-kpis .kpi{text-decoration:none;color:inherit;position:relative;transition:transform .15s} .dash-kpis .kpi:hover{transform:translateY(-2px)}
.dash-kpis .kpi .ico{position:absolute;right:12px;top:12px;opacity:.6} .dash-kpis .kpi b small{font-size:13px;color:var(--muted)}
.dash-kpis .k1{border-top:3px solid var(--accent)} .dash-kpis .k2{border-top:3px solid var(--sun)} .dash-kpis .k3{border-top:3px solid #7c3aed} .dash-kpis .k4{border-top:3px solid #2563eb}
.dash-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px}
.dash-pasos{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.dash-pasos li{display:flex;align-items:center;gap:10px} .dash-pasos .n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;background:var(--soft);color:var(--muted)}
.dash-pasos li.ok .n{background:var(--ok);color:#fff} .dash-pasos li.ok a{color:var(--muted)}
.barras{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.barra-f{display:grid;grid-template-columns:44px 1fr 60px;align-items:center;gap:8px;font-size:12px} .barra-f .et{font-weight:700} .barra-f .vl{text-align:right;color:var(--muted)}
.barra-f .pista{height:10px;border-radius:6px;background:var(--soft);overflow:hidden} .barra-f i{display:block;height:100%;border-radius:6px}
.barra-f i.ok{background:var(--ok)} .barra-f i.bajo{background:linear-gradient(90deg,var(--sun),var(--warn))} .barra-f i.alto{background:#7c3aed}
.dona-wrap{display:flex;gap:18px;align-items:center;margin-top:10px}
.dona{width:130px;height:130px;border-radius:50%;display:grid;place-items:center;flex:none}
.dona span{width:84px;height:84px;border-radius:50%;background:var(--panel);display:grid;place-content:center;text-align:center;font-size:11px;color:var(--muted)} .dona b{font:700 22px var(--font-d);color:var(--deep)}
.dona-ley{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px;font-size:13px} .dona-ley i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}
.dash-alertas{max-height:240px;overflow:auto}
.accesos{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:14px}
.accesos a{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:12px;background:var(--panel);border:1px solid var(--line);text-decoration:none;color:var(--ink);transition:all .15s}
.accesos a svg{color:var(--accent)} .accesos a small{color:var(--muted)} .accesos a:hover{border-color:var(--accent);transform:translateY(-2px)}
@media (max-width:640px){.dash-hero{flex-direction:column;align-items:flex-start}}
.dash-grid>.card.dash-al{grid-column:1/-1}

/* ===== Versión 1.4: más color ===== */
:root{--c-inicio:#f59e0b;--c-ie:#38bdf8;--c-personal:#f472b6;--c-horario:#34d399;--c-reportes:#a78bfa;--c-extra:#fb923c}
.barra .marca::before{background:url(../img/favicon.svg) center/contain no-repeat;box-shadow:none;width:26px;height:26px;border-radius:0}
.barra .menu a svg{transition:transform .15s}
.barra .menu a:hover svg{transform:translateY(-2px) scale(1.08)}
.barra .menu a[href$="panel.php"]{--mc:var(--c-inicio)} .barra .menu a[href$="mi-ie.php"],.barra .menu a[href$="colegios.php"]{--mc:var(--c-ie)}
.barra .menu a[href$="personal.php"],.barra .menu a[href$="usuarios.php"]{--mc:var(--c-personal)} .barra .menu a[href$="proyectos.php"]{--mc:var(--c-horario)}
.barra .menu a[href$="reportes.php"],.barra .menu a[href$="bitacora.php"]{--mc:var(--c-reportes)} .barra .menu a[href$="ajustes.php"]{--mc:var(--c-extra)}
.barra .menu a svg{color:var(--mc,#fff)}
.barra .menu a.on{background:color-mix(in srgb,var(--mc,#fff) 26%,transparent);box-shadow:inset 0 -3px 0 var(--mc,var(--sun))}
/* Títulos con el color de su sección */
body.p-inicio{--pc:var(--c-inicio)} body.p-ie{--pc:var(--c-ie)} body.p-personal{--pc:var(--c-personal)} body.p-horario{--pc:var(--c-horario)} body.p-reportes{--pc:var(--c-reportes)}
.tit-ico svg{color:var(--pc,var(--accent));background:color-mix(in srgb,var(--pc,var(--accent)) 16%,transparent);padding:5px;border-radius:10px;box-sizing:content-box}
.cab h1.tit-ico svg{padding:7px;border-radius:12px}
/* Indicadores con tinte */
.kpi{background:linear-gradient(160deg,var(--panel) 55%,color-mix(in srgb,var(--kc,var(--accent)) 12%,var(--panel)))}
.kpis .kpi:nth-child(4n+1){--kc:var(--accent)} .kpis .kpi:nth-child(4n+2){--kc:#f59e0b} .kpis .kpi:nth-child(4n+3){--kc:#8b5cf6} .kpis .kpi:nth-child(4n+4){--kc:#3b82f6}
.kpis .kpi{border-top-color:var(--kc)} .kpi b{color:color-mix(in srgb,var(--kc,var(--accent)) 70%,var(--ink))}
/* Tarjetas de reportes y accesos con color propio */
.rep-tipo:nth-child(8n+1),.accesos a:nth-child(4n+1){--tc:#f59e0b} .rep-tipo:nth-child(8n+2),.accesos a:nth-child(4n+2){--tc:#38bdf8} .rep-tipo:nth-child(8n+3),.accesos a:nth-child(4n+3){--tc:#22c55e} .rep-tipo:nth-child(8n+4),.accesos a:nth-child(4n+4){--tc:#a78bfa}
.rep-tipo:nth-child(8n+5){--tc:#f472b6} .rep-tipo:nth-child(8n+6){--tc:#fb923c} .rep-tipo:nth-child(8n+7){--tc:#14b8a6} .rep-tipo:nth-child(8n+8){--tc:#6366f1}
.rep-tipo .ico,.accesos a svg{color:#fff;background:linear-gradient(135deg,var(--tc),color-mix(in srgb,var(--tc) 70%,#000));padding:8px;border-radius:12px;box-sizing:content-box;display:inline-grid}
.accesos a svg{width:24px;height:24px}
.rep-tipo{border-top:4px solid var(--tc)} .accesos a{border-top:4px solid var(--tc)}
.rep-tipo.on{background:color-mix(in srgb,var(--tc) 14%,var(--panel));border-color:var(--tc);box-shadow:inset 0 0 0 1px var(--tc)}
.rep-tipo:hover,.accesos a:hover{border-color:var(--tc);box-shadow:0 8px 20px color-mix(in srgb,var(--tc) 22%,transparent)}
/* Pasos del dashboard con color */
.dash-pasos li{padding:6px 8px;border-radius:10px;transition:background .15s} .dash-pasos li:hover{background:var(--soft)}
.dash-pasos li:not(.ok) .n{background:var(--sun);color:#3a2300}
/* Personas con cinta de color */
.persona{border-left:5px solid var(--pc2,var(--accent))}
.persona:has(.t-director){--pc2:#f97316} .persona:has(.t-subdirector){--pc2:#a855f7} .persona:has(.t-jerarquico){--pc2:#3b82f6} .persona:has(.t-auxiliar){--pc2:#94a3b8} .persona:has(.t-docente){--pc2:#14b8a6}
.persona-areas span{background:color-mix(in srgb,var(--pc2,var(--accent)) 14%,var(--panel))}
/* Botones con un poco más de vida */
.btn{transition:transform .1s,box-shadow .15s,border-color .15s} .btn:active{transform:translateY(1px)}
.btn.sol{background:linear-gradient(180deg,#fbbf24,var(--sun));box-shadow:0 2px 6px color-mix(in srgb,var(--sun) 40%,transparent)}
/* Disponibilidad (docente en otra IE) */
.disp-box{border:1px dashed color-mix(in srgb,var(--sun) 60%,transparent);border-radius:12px;padding:10px 12px;background:color-mix(in srgb,var(--sun) 7%,var(--panel))}
.disp-box summary{cursor:pointer}
.dias-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.dia-chip{display:inline-flex;align-items:center;cursor:pointer;border:1px solid var(--line);border-radius:99px;background:var(--panel);font-weight:600;font-size:13px;padding:6px 12px;color:var(--ink);transition:all .12s}
label.dia-chip{padding:0} label.dia-chip input{position:absolute;opacity:0;pointer-events:none} label.dia-chip span{padding:6px 12px;border-radius:99px}
label.dia-chip:has(input:checked) span,.dia-chip.on{background:linear-gradient(135deg,#14b8a6,var(--accent));color:#fff}
.dia-chip.on{border-color:var(--accent)} label.dia-chip:has(input:checked){border-color:var(--accent)}
label.dia-chip:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.persona-disp{font-size:12px;font-weight:600;color:#9a5b00;background:color-mix(in srgb,var(--sun) 16%,var(--panel));border-radius:8px;padding:4px 8px}
/* ===== Prueba gratuita ===== */
.franja.prueba{background:linear-gradient(90deg,#ecfdf5,#fef9c3);color:#14532d;border-bottom:1px solid #bbf7d0}
.franja.prueba.pronto{background:linear-gradient(90deg,#fff7ed,#fef3c7);color:#9a3412;border-bottom-color:#fed7aa}
.franja.prueba.fin{background:linear-gradient(90deg,#fef2f2,#fff7ed);color:#991b1b;border-bottom-color:#fecaca}
.cta-prueba{display:flex;align-items:center;gap:12px;margin-top:6px;padding:12px 14px;border-radius:14px;text-decoration:none;color:#3a2300;background:linear-gradient(135deg,#fde68a,#fbbf24);box-shadow:0 4px 14px rgba(245,158,11,.35);transition:transform .15s}
.cta-prueba:hover{transform:translateY(-2px)} .cta-prueba>span:first-child{font-size:26px} .cta-prueba small{display:block} .cta-prueba .ir{margin-left:auto;font-size:24px;font-weight:700}
.reg-cab{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:14px;background:linear-gradient(135deg,#ecfdf5,#fef9c3);margin-bottom:6px}
.reg-regalo{font-size:34px} .reg-cab h1{margin:0 0 4px} .reg-cab p{margin:0}
.btn.grande{padding:11px 16px;font-size:15px;justify-content:center}
/* ===== Ingreso con imagen de fondo ===== */
.acceso{background:#0b4f6c var(--fondo-login,url(../img/fondo-login.jpg)) center/cover no-repeat;justify-items:end;padding:24px max(24px,6vw)}
@media (max-width:900px){.acceso{background-image:var(--fondo-login-movil,url(../img/fondo-login-movil.jpg));justify-items:center;background-position:20% center}}
.acceso .caja{background:color-mix(in srgb,var(--panel) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 24px 60px rgba(3,30,45,.35)}
.acceso .caja h1{display:flex;align-items:center;gap:10px}
.acceso .caja h1::before{content:"";width:34px;height:34px;flex:none;background:url(../img/favicon.svg) center/contain no-repeat}
.reg-cab h1::before{display:none}
.contenido:has(> .acceso),body.acceso-body .contenido{max-width:none;padding:0} body:has(.acceso) .pie-app{display:none}
/* ===== Crear horario: tarjetas de inicio ===== */
.origenes{border:0;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.origenes legend{font:700 14px var(--font-d);color:var(--deep);margin-bottom:20px;padding:0}
.origen{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px 14px 14px;border:2px solid var(--line);border-radius:14px;background:var(--panel);cursor:pointer;transition:transform .15s,box-shadow .15s,border-color .15s}
.origen input[type=radio]{position:absolute;opacity:0;pointer-events:none}
.origen .o-ico{font-size:26px;width:46px;height:46px;display:grid;place-items:center;border-radius:12px;background:color-mix(in srgb,var(--oc,var(--accent)) 16%,var(--panel))}
.origen b{font:700 15px var(--font-d);color:var(--ink)} .origen small{color:var(--muted);font-size:12.5px;display:flex;flex-direction:column;gap:4px}
.origen select,.origen input[type=file]{margin-top:4px;max-width:100%;font-size:12.5px}
.origen:hover{transform:translateY(-2px);border-color:var(--oc,var(--accent));box-shadow:0 8px 20px color-mix(in srgb,var(--oc,var(--accent)) 18%,transparent)}
.origen:has(input:checked){border-color:var(--oc,var(--accent));background:color-mix(in srgb,var(--oc,var(--accent)) 9%,var(--panel));box-shadow:0 0 0 3px color-mix(in srgb,var(--oc,var(--accent)) 25%,transparent)}
.origen:has(input:checked)::after{content:"✓";position:absolute;right:12px;top:12px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:13px;color:#fff;background:var(--oc,var(--accent))}
.origen:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:3px}
.origen.inactivo{opacity:.6;cursor:not-allowed}
.o-cuadro{--oc:#f59e0b} .o-ie{--oc:#0ea5e9} .o-blanco{--oc:#64748b} .o-ejemplo{--oc:#a855f7} .o-copiar{--oc:#14b8a6} .o-json{--oc:#6366f1}
.origen .chips-ie{display:flex;flex-wrap:wrap;gap:4px}
/* El más recomendado: late suavemente */
.origen.destacado{border-color:#f59e0b;background:linear-gradient(160deg,#fffbeb,var(--panel) 70%);animation:oscila 2.4s ease-in-out infinite}
.origen.destacado .o-badge{position:absolute;top:-11px;left:14px;font-size:11.5px;font-weight:800;color:#3a2300;padding:3px 10px;border-radius:99px;background:linear-gradient(135deg,#fde68a,#f59e0b);box-shadow:0 3px 10px rgba(245,158,11,.4)}
.origen.destacado .o-ico{background:linear-gradient(135deg,#fde68a,#fbbf24)}
@keyframes oscila{0%,100%{transform:translateY(0) scale(1);box-shadow:0 0 0 0 rgba(245,158,11,.45)}50%{transform:translateY(-3px) scale(1.015);box-shadow:0 0 0 8px rgba(245,158,11,0),0 10px 24px rgba(245,158,11,.25)}}
.origen.destacado:hover{animation-play-state:paused}
:root[data-theme="dark"] .origen.destacado{background:linear-gradient(160deg,#3a2c14,var(--panel) 70%)}
@media (prefers-reduced-motion: reduce){.origen.destacado{animation:none}}
/* Marca de agua en cuentas de prueba (pantalla tenue, impresión visible) */
body[data-marca]::after{content:attr(data-marca);position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-28deg);font:800 clamp(28px,5vw,64px)/1.1 var(--font-d);color:rgba(13,92,99,.05);white-space:nowrap;pointer-events:none;z-index:50;text-transform:uppercase;letter-spacing:.06em}
@media print{body[data-marca]::after{color:rgba(0,0,0,.11);font-size:54px}}
/* ===== Suscripciones y control ===== */
.sus-kpis{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))} .sus-kpis a.kpi{text-decoration:none;color:inherit}
.tabs-f{display:flex;gap:4px;flex-wrap:wrap;background:var(--soft);padding:3px;border-radius:10px}
.tabs-f a{padding:6px 11px;border-radius:8px;text-decoration:none;color:var(--muted);font-weight:600;font-size:13px} .tabs-f a.on{background:var(--panel);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.sus-cab{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:flex-start}
.sus-contacto{display:flex;flex-direction:column;gap:6px;align-items:flex-end} .sus-contacto span{color:var(--muted);font-size:13px}
.sus-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:14px;margin-top:14px}
.planes-sel{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.plan-op{position:relative;display:flex;flex-direction:column;gap:2px;padding:10px;border:2px solid var(--line);border-radius:12px;cursor:pointer}
.plan-op input{position:absolute;opacity:0} .plan-op span{font-weight:700;color:var(--deep)} .plan-op small{color:var(--ok);font-weight:600}
.plan-op:has(input:checked){border-color:var(--accent);background:var(--accent-soft)} .plan-op.sug{border-style:dashed}
.sus-resumen{margin:0;padding:8px 10px;border-radius:8px;background:var(--ok-soft);color:var(--ok)}
tr.anulado td{text-decoration:line-through;opacity:.6} tr.fila-alerta td{background:color-mix(in srgb,var(--bad) 6%,transparent)}
.medidas{margin:8px 0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:13px}
/* ===== Beta y sugerencias ===== */
.beta{display:inline-block;margin-left:7px;font:800 10px/1 var(--font-b);letter-spacing:.08em;padding:3px 6px;border-radius:6px;background:linear-gradient(135deg,#f472b6,#a855f7);color:#fff;vertical-align:middle}
.acceso .caja h1 .beta{font-size:11px}
.menu a{position:relative} .menu-badge{position:absolute;top:2px;right:4px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:#ef4444;color:#fff;font:700 11px/18px var(--font-b);font-style:normal;text-align:center}
.sug-fab{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;align-items:center;gap:8px;padding:10px 14px;border:0;border-radius:99px;background:linear-gradient(135deg,#a855f7,#ec4899);color:#fff;font-weight:700;box-shadow:0 8px 22px rgba(168,85,247,.4);cursor:pointer;transition:transform .15s}
.sug-fab span{font-size:18px} .sug-fab:hover{transform:translateY(-2px)}
.sug-fab.nuevo{animation:sugpulso 2.2s ease-in-out infinite}
@keyframes sugpulso{0%,100%{box-shadow:0 8px 22px rgba(168,85,247,.4),0 0 0 0 rgba(236,72,153,.5)}50%{box-shadow:0 8px 22px rgba(168,85,247,.4),0 0 0 12px rgba(236,72,153,0)}}
body.p-horario .contenido.editor ~ .sug-fab b,.contenido.editor~.sug-fab b{display:none}
@media (max-width:700px){.sug-fab b{display:none}.sug-fab{padding:12px}}
@media print{.sug-fab{display:none!important}}
@media (prefers-reduced-motion: reduce){.sug-fab.nuevo{animation:none}}
.sug-modal{max-width:560px;display:flex;flex-direction:column;gap:12px}
.sug-tipos{display:flex;flex-wrap:wrap;gap:6px}
.sug-tipo{display:flex;align-items:center;gap:5px;padding:6px 10px;border:1.5px solid var(--line);border-radius:99px;cursor:pointer;font-size:13px;font-weight:600}
.sug-tipo input{position:absolute;opacity:0} .sug-tipo:has(input:checked){border-color:#a855f7;background:color-mix(in srgb,#a855f7 12%,var(--panel))}
.sug-estrellas{display:flex;gap:2px} .sug-estrellas button{border:0;background:none;font-size:30px;line-height:1;color:#d4d4d8;cursor:pointer;padding:0 2px;transition:transform .1s}
.sug-estrellas button.on{color:#f59e0b} .sug-estrellas button:hover{transform:scale(1.15)}
.sug-gracias{text-align:center;display:flex;flex-direction:column;gap:10px;align-items:center;padding:10px} .sug-gracias>div{font-size:46px}
.sug-lista{display:flex;flex-direction:column;gap:10px}
.sug-item{border-left:5px solid #a855f7} .sug-item.es-nueva{border-left-color:#f59e0b;background:color-mix(in srgb,#f59e0b 5%,var(--panel))} .sug-item.nueva-resp{box-shadow:0 0 0 2px color-mix(in srgb,var(--ok) 45%,transparent)}
.sug-cab{display:flex;gap:10px;align-items:flex-start;cursor:pointer;list-style:none} .sug-cab::-webkit-details-marker{display:none}
.sug-cab b{display:block} .sug-cab small{color:var(--muted);display:block;font-size:12px} .sug-ico{font-size:24px}
.sug-prev{display:block;color:var(--ink);font-size:13px;margin-top:4px} details[open] .sug-prev{display:none}
.sug-msg{white-space:normal;margin:10px 0;line-height:1.5}
.sug-resp{background:var(--ok-soft);border-radius:10px;padding:10px 12px} .sug-resp small{display:block;color:var(--muted)} .sug-resp p{margin:6px 0 0}
.sug-cap{max-width:100%;max-height:320px;border-radius:10px;border:1px solid var(--line)}
.sug-form{border-top:1px dashed var(--line);padding-top:10px}
.beta-invita{display:flex;align-items:center;gap:12px;margin-top:14px;padding:14px;border-radius:14px;background:linear-gradient(120deg,color-mix(in srgb,#a855f7 12%,var(--panel)),color-mix(in srgb,#ec4899 8%,var(--panel)));border:1px solid color-mix(in srgb,#a855f7 30%,transparent)}
.beta-invita>span{font-size:30px} .beta-invita small{display:block;color:var(--muted)} .beta-invita .btn{margin-left:auto}