/* ============================================================
   Cota 14 · sistema de diseño común
   Un solo archivo para todas las materias. Cada página lo enlaza
   DESPUÉS de sus estilos propios y declara su materia en <html>:
   <html data-materia="fisica | dibujo | matematicas | quimica">
   Sustituye los colores y la tipografía de las webs de Física y
   Dibujo y de las píldoras PIF sin tocar su contenido ni su JS.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Instrument+Serif:ital@0;1&family=IBM+Plex+Mono:wght@400;500&display=swap');

/* ---------- 1. Tokens ---------- */
:root{
  --bg:#F6F6F4;
  --surface:#FFFFFF;
  --sheet:#FFFFFF;
  --ink:#141417;
  --muted:#5B5B63;
  --line:#DEDEDA;
  --accent:#1D4ED8;
  --accent-ink:#FFFFFF;
  --accent-soft:#E8EEFD;
  --axis:#B45309;
  --aux:#8A8A92;
  --card:#FFFFFF;
  --text:#141417;
  --sub:#4A4A52;
  --border:#DEDEDA;
  --danger:#B42318;
  --success:#177245;
  --g-50:#F3F6FE;
  --g-100:#EAF0FD;
  --g-200:#CFDDF8;
  --g-400:#4F83E8;
  --g-500:#1D4ED8;
  --g-600:#1740B0;
  --g-800:#0F2A7A;
  --mat-fisica:#1D4ED8;
  --mat-dibujo:#C2410C;
  --mat-mates:#8A5A00;
  --mat-quimica:#0F766E;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --serif:'Instrument Serif',Georgia,'Times New Roman',serif;
  --r:14px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0D0D0F;
  --surface:#141417;
  --sheet:#101013;
  --ink:#F2F2F0;
  --muted:#A1A1A8;
  --line:#26262B;
  --accent:#6EA0FF;
  --accent-ink:#0B1320;
  --accent-soft:#16213A;
  --axis:#F0A34F;
  --aux:#6E6E77;
  --card:#141417;
  --text:#F2F2F0;
  --sub:#B6B6BD;
  --border:#26262B;
  --danger:#FF7B6B;
  --success:#4FD1A5;
  --g-50:#0E1424;
  --g-100:#131B2E;
  --g-200:#24324F;
  --g-400:#6EA0FF;
  --g-500:#6EA0FF;
  --g-600:#A9C4FF;
  --g-800:#141417;
  --mat-fisica:#6EA0FF;
  --mat-dibujo:#FF8F6B;
  --mat-mates:#F2C04D;
  --mat-quimica:#4FD1A5;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0D0D0F;
  --surface:#141417;
  --sheet:#101013;
  --ink:#F2F2F0;
  --muted:#A1A1A8;
  --line:#26262B;
  --accent:#6EA0FF;
  --accent-ink:#0B1320;
  --accent-soft:#16213A;
  --axis:#F0A34F;
  --aux:#6E6E77;
  --card:#141417;
  --text:#F2F2F0;
  --sub:#B6B6BD;
  --border:#26262B;
  --danger:#FF7B6B;
  --success:#4FD1A5;
  --g-50:#0E1424;
  --g-100:#131B2E;
  --g-200:#24324F;
  --g-400:#6EA0FF;
  --g-500:#6EA0FF;
  --g-600:#A9C4FF;
  --g-800:#141417;
  --mat-fisica:#6EA0FF;
  --mat-dibujo:#FF8F6B;
  --mat-mates:#F2C04D;
  --mat-quimica:#4FD1A5;
  color-scheme:dark}

/* color de identidad de la materia */
:root{--materia:var(--accent)}
[data-materia="fisica"]{--materia:var(--mat-fisica)}
[data-materia="dibujo"]{--materia:var(--mat-dibujo)}
[data-materia="matematicas"]{--materia:var(--mat-mates)}
[data-materia="quimica"]{--materia:var(--mat-quimica)}
html{--materia-soft:color-mix(in srgb,var(--materia) 14%,var(--surface))}

/* ---------- 2. Base ---------- */
body{font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1{font-weight:500;letter-spacing:-.03em}
.kicker{color:var(--materia)}

/* ---------- 3. Componentes de las webs (Física y Dibujo) ---------- */
.card,.enun,.sec,.figure,.step{border-radius:16px}
.brand{border-radius:16px;padding:8px 18px}
.chip{border-radius:999px;padding:5px 12px}
.pill{border-radius:999px}
.btn,.segb,.topbar a{border-radius:999px}
.why{border-radius:0 12px 12px 0}
.note{border-radius:10px}
.sheet{border-radius:12px}
.btn.primary:hover,.btn-primary:hover{filter:brightness(1.06)}

/* ---------- 4. Píldoras PIF ---------- */
.pif-header{background:var(--surface);color:var(--sub);border-bottom:1px solid var(--line);box-shadow:none}
.pif-logo{color:var(--materia)}
.pif-pill-id{background:var(--materia);color:var(--accent-ink);border-radius:999px;padding:.2rem .65rem}
.pif-unit-title{color:var(--sub);opacity:1}
.pif-progress-bar{background:var(--line)}
.pif-progress-fill{background:var(--materia)}
.section-hero{background:var(--surface);border:1px solid var(--line);color:var(--text);border-radius:20px}
.section-hero::after{display:none}
.section-hero .eyebrow{color:var(--materia)}
.section-hero h1{color:var(--text);font-weight:500;letter-spacing:-.03em;font-size:2rem}
.section-hero p{color:var(--sub)}
.btn-primary,.quiz-submit-btn,.kepler-header,.pif-nav-item.active .pif-nav-num{color:var(--accent-ink)}
.pif-nav-buttons .btn,.quiz-submit-btn{border-radius:999px}
.quiz-opt.correct,.quiz-feedback.ok{background:color-mix(in srgb,var(--success) 14%,var(--card))}
.quiz-opt.wrong,.quiz-feedback.ko{background:color-mix(in srgb,var(--danger) 14%,var(--card))}
.formula-main,.legend-sym,.summary-item .si-val{font-family:var(--serif)}
.formula-main{font-size:1.7rem}

/* ---------- 5. Barra de Cota 14 ---------- */
.c14-bar{box-sizing:border-box;width:100%;max-width:1180px;margin:0 auto 16px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:8px 8px 8px 18px;background:var(--surface);border:1px solid var(--line);border-radius:999px}
body:has(> .pif-header) .c14-bar{margin:12px auto 0;width:calc(100% - 32px)}
.c14-mark{display:inline-flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none;font:400 26px/1 var(--serif)}
.c14-mark svg{display:block;flex:none;width:34px;height:20px;min-width:0}
.c14-theme svg{width:18px;height:18px;min-width:0}
.c14-word{white-space:nowrap}
.c14-word i{color:var(--accent);font-style:italic}
.c14-nav{margin-left:auto;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.c14-nav a{color:var(--muted);text-decoration:none;font:500 14px/1 var(--sans);padding:12px 16px;border-radius:999px;border:1px solid transparent}
.c14-nav a:hover{color:var(--ink)}
.c14-nav a[aria-current="page"]{color:var(--materia);border-color:var(--materia)}
.c14-theme{width:44px;height:44px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink);
  cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}
.c14-theme:hover{border-color:var(--muted)}
.c14-bar a:focus-visible,.c14-theme:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:560px){.c14-bar{position:relative;border-radius:20px;padding:10px 10px 6px 14px;gap:4px}.c14-theme{position:absolute;top:10px;right:10px}.c14-nav{margin-left:-6px;width:100%;flex-wrap:nowrap;overflow-x:auto}.c14-nav a{padding:12px 12px;white-space:nowrap}}

/* ---------- 6. Impresión: siempre claro y sin controles ---------- */
@media print{
  :root,:root:not([data-theme="light"]),:root[data-theme="dark"]{
  --bg:#F6F6F4 !important;
  --surface:#FFFFFF !important;
  --sheet:#FFFFFF !important;
  --ink:#141417 !important;
  --muted:#5B5B63 !important;
  --line:#DEDEDA !important;
  --accent:#1D4ED8 !important;
  --accent-ink:#FFFFFF !important;
  --accent-soft:#E8EEFD !important;
  --axis:#B45309 !important;
  --aux:#8A8A92 !important;
  --card:#FFFFFF !important;
  --text:#141417 !important;
  --sub:#4A4A52 !important;
  --border:#DEDEDA !important;
  --danger:#B42318 !important;
  --success:#177245 !important;
  --g-50:#F3F6FE !important;
  --g-100:#EAF0FD !important;
  --g-200:#CFDDF8 !important;
  --g-400:#4F83E8 !important;
  --g-500:#1D4ED8 !important;
  --g-600:#1740B0 !important;
  --g-800:#0F2A7A !important;
  --mat-fisica:#1D4ED8 !important;
  --mat-dibujo:#C2410C !important;
  --mat-mates:#8A5A00 !important;
  --mat-quimica:#0F766E !important;
    color-scheme:light}
  body{background:#fff !important}
  .c14-bar,.nav,.topbar,.pills,.pif-sidebar,.pif-nav-buttons,.pif-header{display:none !important}
}

/* Fórmulas en línea: nunca se parten entre dos líneas; si no caben, pasan enteras a la siguiente */
:not(.katex-display)>.katex{display:inline-block;white-space:nowrap;max-width:100%;vertical-align:baseline}