/* Identidad KAYA Dance Club Academy · Negro #0D0D0D · Plomo oscuro #4B4F56 · Plomo claro #D6D8DC · Beige #E8DED3
   Tipografías: Sora (títulos) · Inter (textos) · Playfair Display itálica (frases de marca). Licencias en static/fuentes/LICENCIAS.txt */
@font-face{font-family:"Sora";src:url("fuentes/sora.woff2") format("woff2");font-weight:100 800;font-display:swap}
@font-face{font-family:"Inter";src:url("fuentes/inter.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Playfair Display";src:url("fuentes/playfair-italic-400.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Playfair Display";src:url("fuentes/playfair-italic-600.woff2") format("woff2");font-weight:600;font-style:italic;font-display:swap}
:root{--negro:#0D0D0D;--plomo:#4B4F56;--plomo-claro:#D6D8DC;--beige:#E8DED3;
 --p:#0D0D0D;--p2:#4B4F56;--f:#F6F3EF;--card:#FFFFFF;--t:#0D0D0D;--m:#5C6067;--b:#E3DED7;
 --btn:#0D0D0D;--btn-t:#FFFFFF;--btn-h:#4B4F56;--acento:#E8DED3;
 --ok:#2F6B47;--okf:#E6F0E9;--er:#9E2B25;--erf:#F6E5E3;--av:#7A5A12;--avf:#F5EEDC;
 --tit:"Sora",system-ui,sans-serif;--txt:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--frase:"Playfair Display",Georgia,serif}
@media (prefers-color-scheme:dark){:root{--f:#0D0D0D;--card:#17181B;--t:#EDE6DD;--m:#A9ACB2;--b:#2C2E33;--p2:#D6D8DC;
 --btn:#E8DED3;--btn-t:#0D0D0D;--btn-h:#D6D8DC;--okf:#16291D;--erf:#331816;--avf:#2E2612;--ok:#8FC9A3;--er:#E89A93;--av:#E3C27A}}
*{box-sizing:border-box}
body{margin:0;font:16px/1.5 var(--txt);background:var(--f);color:var(--t);-webkit-font-smoothing:antialiased}
h1,h2,h3,.num,.marca,nav a,button,.btn{font-family:var(--tit)}
h1{font-size:26px;font-weight:700;letter-spacing:-.01em;margin:4px 0 12px}h2{font-size:18px;font-weight:600;margin:20px 0 8px}h3{font-weight:600}
a{color:var(--p2);text-underline-offset:2px}
.frase{font-family:var(--frase);font-style:italic;font-weight:400}
/* Encabezado y logotipo */
header{background:var(--negro);color:#fff;position:sticky;top:0;z-index:5;border-bottom:2px solid var(--beige)}
.barra{display:flex;align-items:center;gap:14px;padding:8px 16px;max-width:1200px;margin:auto;flex-wrap:wrap}
.marca{display:flex;align-items:center;gap:8px;color:#fff;text-decoration:none}
.logo-ka{font-family:var(--tit);font-weight:700;font-size:17px;line-height:.82;letter-spacing:-.02em;text-transform:lowercase}
.logo-txt{font-family:var(--tit);font-size:7.5px;letter-spacing:.32em;line-height:1.25;color:var(--beige);text-transform:uppercase}
nav{display:flex;gap:2px;flex-wrap:wrap;flex:1}nav a{color:#fff;text-decoration:none;padding:6px 10px;border-radius:8px;font-size:14.5px;font-weight:500}
nav a.activo,nav a:hover{background:rgba(232,222,211,.16);color:var(--beige)}
.usuario{font-size:13px;opacity:.95}.usuario a{color:#fff}.usuario button{background:none;border:1px solid #ffffff66;color:#fff;border-radius:6px;padding:2px 8px;cursor:pointer}
main{max-width:1200px;margin:auto;padding:16px}
/* Componentes */
.card{background:var(--card);border:1px solid var(--b);border-radius:14px;padding:14px;margin-bottom:12px}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
table{width:100%;border-collapse:collapse;background:var(--card);font-size:14px}th,td{padding:8px;border-bottom:1px solid var(--b);text-align:left;vertical-align:top}
th{color:var(--m);font-weight:600;font-family:var(--tit);font-size:13px}
.tabla{overflow-x:auto;border:1px solid var(--b);border-radius:14px}
.btn,button{display:inline-block;background:var(--btn);color:var(--btn-t);border:1px solid var(--btn);border-radius:10px;padding:8px 14px;font-size:14.5px;font-weight:500;cursor:pointer;text-decoration:none;transition:background .15s}
.btn:hover,button:hover{background:var(--btn-h);border-color:var(--btn-h)}
.btn.sec,button.sec{background:transparent;color:var(--t);border:1px solid var(--plomo)}.btn.sec:hover,button.sec:hover{background:var(--beige);color:var(--negro)}
.btn.peq,button.peq{padding:4px 10px;font-size:13px}
button.peligro{background:var(--er);border-color:var(--er);color:#fff}
input,select,textarea{font:inherit;padding:8px;border:1px solid var(--plomo-claro);border-radius:10px;background:var(--card);color:var(--t);max-width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--beige);border-color:var(--plomo)}
form p,form div.campo{margin:0 0 10px}label{display:block;font-weight:600;font-size:14px;margin-bottom:3px}
.helptext,.ayuda{display:block;color:var(--m);font-size:13px}ul.errorlist{color:var(--er);margin:4px 0;padding-left:18px}
.msg{padding:10px 14px;border-radius:12px;margin-bottom:10px;border:1px solid transparent}.msg.success{background:var(--okf);color:var(--ok)}.msg.error{background:var(--erf);color:var(--er)}
.msg.warning,.msg.info{background:var(--avf);color:var(--av)}.msg.info{background:var(--beige);color:var(--negro)}
.etq{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;background:var(--plomo-claro);color:var(--negro);white-space:nowrap}
.etq.ok{background:var(--okf);color:var(--ok)}.etq.er{background:var(--erf);color:var(--er)}.etq.av{background:var(--avf);color:var(--av)}
.demo{background:var(--beige);color:var(--negro)}.muted{color:var(--m)}.num{font-size:28px;font-weight:700}
.fila{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.derecha{margin-left:auto}
.res{font-size:22px;padding:18px;border-radius:12px;text-align:center}.res.ok{background:var(--okf);color:var(--ok)}.res.error{background:var(--erf);color:var(--er)}
pre.mensaje{white-space:pre-wrap;background:var(--f);padding:10px;border-radius:10px;border:1px dashed var(--plomo-claro);font-family:var(--txt)}
/* Tablero (panel de Hoy) */
.kpi{background:var(--negro)!important;color:#fff;border-top:3px solid var(--beige)}.kpi .t{color:var(--beige)!important;font-family:var(--tit)}
/* Identidad por sede */
.sede-cerro{background:var(--plomo-claro);color:var(--negro);border-left:6px solid var(--beige)}
.sede-jlbr{background:var(--plomo);color:#fff;border-left:6px solid var(--beige)}
.sede-yana{background:var(--negro);color:var(--beige);border-left:6px solid var(--beige)}
.chip-sede{display:inline-block;padding:1px 7px;border-radius:6px;font-size:11px;font-weight:600;font-family:var(--tit);letter-spacing:.02em;border-left:none}
@media (max-width:640px){nav a{padding:6px 8px;font-size:14px}main{padding:12px}h1{font-size:22px}}
@media print{header{display:none}body{background:#fff}}
/* ---------- Sistema interno: predomina el beige (la web de alumnos conserva el negro) ---------- */
body.sistema{--f:#F3EEE7}
body.sistema header{background:var(--beige);color:var(--negro);border-bottom:2px solid var(--negro)}
body.sistema .marca{color:var(--negro)}body.sistema .logo-txt{color:var(--plomo)}
body.sistema nav a{color:var(--negro)}body.sistema nav a.activo,body.sistema nav a:hover{background:rgba(13,13,13,.09);color:var(--negro)}
body.sistema .usuario a{color:var(--negro)}body.sistema .usuario button{border-color:var(--negro);color:var(--negro)}
body.sistema .kpi{background:var(--beige)!important;color:var(--negro);border:1px solid #D9CDBE;border-top:4px solid var(--negro)}
body.sistema .kpi .t{color:var(--negro)!important;border-bottom-color:#0D0D0D22!important}
@media (prefers-color-scheme:dark){body.sistema{--f:#141310}body.sistema header{background:#2A2621;color:var(--beige);border-bottom-color:var(--beige)}
 body.sistema .marca,body.sistema nav a,body.sistema .usuario a{color:var(--beige)}body.sistema .logo-txt{color:var(--plomo-claro)}
 body.sistema .usuario button{border-color:var(--beige);color:var(--beige)}body.sistema .kpi{background:#2A2621!important;color:var(--beige);border-color:#3a352e;border-top-color:var(--beige)}
 body.sistema .kpi .t{color:var(--beige)!important}}
body.sistema .usuario a{text-decoration:underline}
