/* ==========================================================================
   Sistema de diseño del estudio. Documentado en docs/DISENO.md.
   Capas: tokens → base → componentes → layouts (panel, acceso, público).
   ========================================================================== */

/* ---------- Fuentes locales (OFL) ---------- */
@font-face { font-family: "Public Sans"; src: url("../vendor/fonts/public-sans-300.woff2") format("woff2"); font-weight: 300; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url("../vendor/fonts/source-serif-4-300.woff2") format("woff2"); font-weight: 300; font-display: swap; }
@font-face { font-family: "Public Sans"; src: url("../vendor/fonts/public-sans-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Public Sans"; src: url("../vendor/fonts/public-sans-500.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Public Sans"; src: url("../vendor/fonts/public-sans-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Public Sans"; src: url("../vendor/fonts/public-sans-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url("../vendor/fonts/source-serif-4-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url("../vendor/fonts/source-serif-4-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Source Serif 4"; src: url("../vendor/fonts/source-serif-4-400-italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }

/* ---------- Tokens EBE — Bonifacini Espinelli ----------
   Paleta aprobada: marfil cálido #F7F3ED, piedra suave #DED5CA, verde salvia #8D9988,
   carbón cálido #292A27, bronce champagne #A68B67. Ver docs/BRANDING_EBE.md.
   Los nombres heredados (--blue, --ochre, --ink…) se conservan como alias semánticos
   para no tocar las vistas del panel. */
:root {
    color-scheme: light;
    --ink: #292A27;
    --ink-2: #3A3B37;
    --paper: #F7F3ED;
    --surface: #FFFDF9;
    --surface-alt: #F1EBE2;
    --surface-tint: #E9E1D5;
    --graphite: #292A27;
    --gray: #66625A;
    --line: #DED5CA;
    --line-soft: #EAE3D8;
    --line-strong: #B9AD9C;
    --accent-bronze: #A68B67;
    --accent-bronze-dark: #866A46;
    --accent-bronze-soft: #F3EBDF;
    --accent-line: #E2D3BD;
    --accent-salvia: #8D9988;
    --accent-salvia-soft: #E6EAE3;
    --blue: #866A46;
    --blue-hover: #6E5536;
    --blue-soft: #F3EBDF;
    --ochre: #866A46;
    --ochre-soft: #F3EBDF;
    --btn-primary: #8A6A45;
    --btn-primary-hover: #765A39;
    --btn-primary-ink: #FFFDF9;
    --rule: #BBA283;
    --band-contact: #DED5CA;
    --badge-juridica: #848E7F;
    --badge-notarial: #8F7150;
    --badge-ink: #FFFDF9;
    --hover: rgba(41, 42, 39, .05);
    --backdrop: rgba(41, 42, 39, .45);
    --selection: #E9DCC8;
    --ring: rgba(166, 139, 103, .35);
    --field-line: #CDC2B3;
    --field-line-hover: #A99C8A;
    --placeholder: #8C877E;
    --ok: #2A6E48;
    --ok-soft: #E7F2EB;
    --ok-line: #B5D6C2;
    --ok-ink: #15482F;
    --warn: #8A5300;
    --warn-soft: #FBF0DD;
    --warn-line: #E9CF9F;
    --warn-ink: #5E3A02;
    --bad: #A3271F;
    --bad-soft: #FBE9E7;
    --bad-line: #EBC1BC;
    --bad-ink: #7A1D17;
    --ai-soft: #F1EEF4;
    --ai-ink: #5B4A6E;
    --ai-line: #D9D1E2;
    --note-soft: #FCF8EC;
    --side-bg: #292A27;
    --side-bg-2: #353632;
    --side-ink: #DED5CA;
    --side-strong: #F7F3ED;
    --side-muted: #A39D92;
    --side-accent: #C4A985;
    --side-line: rgba(247, 243, 237, .1);
    --carbon-bg: #292A27;
    --shadow: 0 1px 2px rgba(41, 42, 39, .05);
    --shadow-card: 0 2px 10px rgba(41, 42, 39, .06);
    --shadow-pop: 0 10px 30px rgba(41, 42, 39, .16);
    --focus: 0 0 0 2px var(--paper), 0 0 0 4px var(--accent-bronze-dark);
    --info: var(--blue); --info-soft: var(--blue-soft);

    --font-ui: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --font-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
    --fs-xs: .8125rem;  /* 13 */
    --fs-sm: .875rem;   /* 14 */
    --fs-md: 1rem;      /* 16 */
    --fs-lg: 1.125rem;  /* 18 */
    --fs-xl: 1.375rem;  /* 22 */
    --fs-2xl: 1.75rem;  /* 28 */
    --fs-3xl: 2.25rem;  /* 36 */
    --lh: 1.55;
    --s-1: .25rem; --s-2: .5rem; --s-3: .75rem; --s-4: 1rem; --s-5: 1.5rem; --s-6: 2rem; --s-7: 3rem;
    --radius: 3px;
    --radius-lg: 5px;
    --sidebar-w: 16rem;
    --topbar-h: 3.5rem;
    --bottom-h: 4rem;
    --tap: 44px;
    --ease: cubic-bezier(.2, .6, .2, 1);
}

/* Modo noche: elegido (data-theme) o, sin JS, según el sistema. */
html[data-theme="dark"] {
    color-scheme: dark;
    --ink: #F3EEE6;
    --ink-2: #E2DCD2;
    --paper: #1F1F1D;
    --surface: #272825;
    --surface-alt: #2C2D2A;
    --surface-tint: #33342F;
    --graphite: #E9E4DB;
    --gray: #ADA79C;
    --line: #393A35;
    --line-soft: #2F302C;
    --line-strong: #55564F;
    --accent-bronze: #C4A985;
    --accent-bronze-dark: #C4A985;
    --accent-bronze-soft: #332E26;
    --accent-line: #4D4335;
    --accent-salvia: #A3B09E;
    --accent-salvia-soft: #2A3128;
    --blue: #CDB38E;
    --blue-hover: #DEC7A5;
    --blue-soft: #332E26;
    --ochre: #C4A985;
    --ochre-soft: #332E26;
    --btn-primary: #66725F;
    --btn-primary-hover: #727F6A;
    --btn-primary-ink: #F7F3ED;
    --rule: #A68B67;
    --band-contact: #1C231E;
    --badge-juridica: #7B8575;
    --badge-notarial: #A68B67;
    --badge-ink: #F7F3ED;
    --hover: rgba(247, 243, 237, .06);
    --backdrop: rgba(0, 0, 0, .6);
    --selection: #5A4C38;
    --ring: rgba(196, 169, 133, .4);
    --field-line: #4A4B45;
    --field-line-hover: #6A6B63;
    --placeholder: #8A857B;
    --ok: #7DC39A;
    --ok-soft: #1C2C22;
    --ok-line: #2F5A40;
    --ok-ink: #B5E0C4;
    --warn: #E2AE5C;
    --warn-soft: #33291A;
    --warn-line: #5E4A26;
    --warn-ink: #F0CF98;
    --bad: #EE8A82;
    --bad-soft: #3A1F1C;
    --bad-line: #6A332E;
    --bad-ink: #F6BBB5;
    --ai-soft: #2C2932;
    --ai-ink: #CFC3E0;
    --ai-line: #4A4258;
    --note-soft: #2E2B22;
    --side-bg: #181816;
    --side-bg-2: #262724;
    --side-ink: #D6D0C5;
    --side-muted: #99938A;
    --side-line: rgba(247, 243, 237, .08);
    --carbon-bg: #3A3B37;
    --shadow: 0 1px 2px rgba(0, 0, 0, .35);
    --shadow-card: 0 2px 12px rgba(0, 0, 0, .3);
    --shadow-pop: 0 12px 36px rgba(0, 0, 0, .55);
}
@media (prefers-color-scheme: dark) {
    html:not([data-theme]) {
        color-scheme: dark;
        --ink: #F3EEE6;
        --ink-2: #E2DCD2;
        --paper: #1F1F1D;
        --surface: #272825;
        --surface-alt: #2C2D2A;
        --surface-tint: #33342F;
        --graphite: #E9E4DB;
        --gray: #ADA79C;
        --line: #393A35;
        --line-soft: #2F302C;
        --line-strong: #55564F;
        --accent-bronze: #C4A985;
        --accent-bronze-dark: #C4A985;
        --accent-bronze-soft: #332E26;
        --accent-line: #4D4335;
        --accent-salvia: #A3B09E;
        --accent-salvia-soft: #2A3128;
        --blue: #CDB38E;
        --blue-hover: #DEC7A5;
        --blue-soft: #332E26;
        --ochre: #C4A985;
        --ochre-soft: #332E26;
        --btn-primary: #66725F;
        --btn-primary-hover: #727F6A;
        --btn-primary-ink: #F7F3ED;
        --rule: #A68B67;
        --band-contact: #1C231E;
        --badge-juridica: #7B8575;
        --badge-notarial: #A68B67;
        --badge-ink: #F7F3ED;
        --hover: rgba(247, 243, 237, .06);
        --backdrop: rgba(0, 0, 0, .6);
        --selection: #5A4C38;
        --ring: rgba(196, 169, 133, .4);
        --field-line: #4A4B45;
        --field-line-hover: #6A6B63;
        --placeholder: #8A857B;
        --ok: #7DC39A;
        --ok-soft: #1C2C22;
        --ok-line: #2F5A40;
        --ok-ink: #B5E0C4;
        --warn: #E2AE5C;
        --warn-soft: #33291A;
        --warn-line: #5E4A26;
        --warn-ink: #F0CF98;
        --bad: #EE8A82;
        --bad-soft: #3A1F1C;
        --bad-line: #6A332E;
        --bad-ink: #F6BBB5;
        --ai-soft: #2C2932;
        --ai-ink: #CFC3E0;
        --ai-line: #4A4258;
        --note-soft: #2E2B22;
        --side-bg: #181816;
        --side-bg-2: #262724;
        --side-ink: #D6D0C5;
        --side-muted: #99938A;
        --side-line: rgba(247, 243, 237, .08);
        --carbon-bg: #3A3B37;
        --shadow: 0 1px 2px rgba(0, 0, 0, .35);
        --shadow-card: 0 2px 12px rgba(0, 0, 0, .3);
        --shadow-pop: 0 12px 36px rgba(0, 0, 0, .55);
    }
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
    margin: 0;
    font-family: var(--font-ui);
    font-size: var(--fs-md);
    line-height: var(--lh);
    color: var(--graphite);
    background: var(--paper);
    -webkit-font-smoothing: antialiased;
}
h1, h2, h3 { color: var(--ink); line-height: 1.25; margin: 0 0 var(--s-3); font-weight: 600; }
h1 { font-family: var(--font-serif); font-size: var(--fs-2xl); letter-spacing: -.005em; }
h2 { font-size: var(--fs-lg); }
h3 { font-size: var(--fs-md); }
p { margin: 0 0 var(--s-3); }
a { color: var(--blue); text-underline-offset: .18em; }
a:hover { color: var(--blue-hover); }
code { font-size: .9em; background: var(--line-soft); padding: .05em .35em; border-radius: 3px; overflow-wrap: anywhere; }
img, svg { max-width: 100%; }
[hidden] { display: none !important; }
[x-cloak] { display: none !important; }
:focus { outline: none; }
:focus-visible { box-shadow: var(--focus); border-radius: var(--radius); }
h1:focus, h1:focus-visible, main:focus { box-shadow: none; }
::selection { background: var(--selection); }

.visually-hidden {
    position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
    position: absolute; left: var(--s-3); top: -3rem; z-index: 100;
    background: var(--carbon-bg); color: #F7F3ED; padding: var(--s-2) var(--s-4); border-radius: var(--radius);
}
.skip-link:focus { top: var(--s-3); }
.muted { color: var(--gray); }
.optional { color: var(--gray); font-weight: 400; }

.icon { width: 1.125rem; height: 1.125rem; flex: none; vertical-align: -.2em; }
.icon--xl { width: 2.25rem; height: 2.25rem; color: var(--gray); }

/* ---------- Botones ---------- */
.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2);
    min-height: var(--tap); padding: 0 var(--s-4);
    font: 500 var(--fs-sm)/1 var(--font-ui); text-decoration: none; white-space: nowrap;
    color: var(--ink); background: var(--surface);
    border: 1px solid var(--line); border-radius: var(--radius);
    cursor: pointer; transition: background-color .15s var(--ease), border-color .15s var(--ease);
}
.btn:hover { background: var(--line-soft); color: var(--ink); }
.btn--primary { background: var(--blue); border-color: var(--blue); color: #fff; }
.btn--primary:hover { background: var(--blue-hover); border-color: var(--blue-hover); color: #fff; }
.btn--danger { color: var(--bad); border-color: var(--bad-line); }
.btn--danger:hover { background: var(--bad-soft); color: var(--bad); }
.btn--ghost { border-color: transparent; background: transparent; }
.btn--small { min-height: 36px; padding: 0 var(--s-3); }
.btn--block { width: 100%; }
.btn[disabled], .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.btn.is-busy { position: relative; color: transparent !important; }
.btn.is-busy::after {
    content: ""; position: absolute; width: 1rem; height: 1rem; border-radius: 50%;
    border: 2px solid currentColor; border-color: var(--gray) transparent var(--gray) transparent;
    animation: spin .8s linear infinite;
}
.btn--primary.is-busy::after { border-color: #fff transparent #fff transparent; }
.icon-btn {
    display: inline-grid; place-items: center; width: var(--tap); height: var(--tap);
    background: transparent; border: 0; border-radius: var(--radius); color: inherit; cursor: pointer;
}
.icon-btn:hover { background: var(--hover); }
.linklike { background: none; border: 0; padding: 0; font: inherit; color: inherit; cursor: pointer; }

/* ---------- Formularios ---------- */
.form { display: grid; gap: var(--s-4); }
.form-fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: var(--s-4); min-width: 0; }
.form-fieldset + .form-fieldset { border-top: 1px solid var(--line-soft); padding-top: var(--s-5); }
.form-section { font-weight: 600; color: var(--ink); font-size: var(--fs-md); padding: 0; margin-bottom: var(--s-1); }
.form-grid { display: grid; gap: var(--s-4); grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }
.field { display: grid; gap: var(--s-1); min-width: 0; }
.field--grow { flex: 1 1 16rem; }
.field > label, .label { font-weight: 500; font-size: var(--fs-sm); color: var(--ink); }
input:not([type=checkbox]):not([type=radio]), select, textarea {
    width: 100%; min-height: var(--tap); padding: .55rem .75rem;
    font: inherit; font-size: max(16px, var(--fs-md)); /* 16px evita el zoom de iOS */
    color: var(--graphite); background: var(--surface);
    border: 1px solid var(--field-line); border-radius: var(--radius);
    transition: border-color .15s var(--ease);
}
textarea { min-height: 7rem; resize: vertical; line-height: var(--lh); }
input:hover, select:hover, textarea:hover { border-color: var(--field-line-hover); }
input:focus-visible, select:focus-visible, textarea:focus-visible { border-color: var(--blue); box-shadow: 0 0 0 3px var(--ring); border-radius: var(--radius); }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: var(--bad); }
input:disabled, select:disabled, textarea:disabled { background: var(--line-soft); color: var(--gray); }
::placeholder { color: var(--placeholder); }
.field-help { font-size: var(--fs-sm); color: var(--gray); margin: 0; }
.field-error { display: flex; gap: var(--s-1); align-items: flex-start; font-size: var(--fs-sm); color: var(--bad); margin: 0; font-weight: 500; }
.field-error .icon { margin-top: .15em; }
.input-group { display: flex; align-items: stretch; }
.input-group input { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group .icon-btn { border: 1px solid var(--field-line); border-left: 0; border-radius: 0 var(--radius) var(--radius) 0; height: auto; }
.check { display: inline-flex; gap: var(--s-2); align-items: center; min-height: var(--tap); cursor: pointer; font-size: var(--fs-sm); }
.check input { width: 1.125rem; height: 1.125rem; accent-color: var(--blue); margin: 0; }
.check-grid { display: flex; flex-wrap: wrap; gap: 0 var(--s-5); }
.form-actions { display: flex; flex-wrap: wrap; gap: var(--s-3); padding-top: var(--s-2); }
.form-actions--sticky {
    position: sticky; bottom: 0; background: var(--paper); padding: var(--s-3) 0;
    border-top: 1px solid var(--line); margin-top: var(--s-4);
}
.inline-form { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; width: 100%; }
.inline-form input:not([type=checkbox]) { flex: 1 1 12rem; width: auto; }

/* ---------- Avisos ---------- */
.alert {
    display: flex; gap: var(--s-3); align-items: flex-start;
    padding: var(--s-3) var(--s-4); margin-bottom: var(--s-4);
    border: 1px solid; border-left-width: 4px; border-radius: var(--radius);
    font-size: var(--fs-sm);
}
.alert p { margin: 0; flex: 1; }
.alert .icon { margin-top: .1em; }
.alert .icon-btn { width: 32px; height: 32px; margin: -.35rem -.5rem -.35rem 0; }
.alert--success { background: var(--ok-soft); border-color: var(--ok-line); border-left-color: var(--ok); color: var(--ok-ink); }
.alert--error { background: var(--bad-soft); border-color: var(--bad-line); border-left-color: var(--bad); color: var(--bad-ink); }
.alert--warning { background: var(--warn-soft); border-color: var(--warn-line); border-left-color: var(--warn); color: var(--warn-ink); }
.alert--info { background: var(--info-soft); border-color: var(--accent-line); border-left-color: var(--blue); color: var(--ink); }

.badge {
    display: inline-flex; gap: .3rem; align-items: center; padding: .15rem .55rem;
    font-size: var(--fs-xs); font-weight: 600; border-radius: 3px; border: 1px solid; white-space: nowrap;
    vertical-align: middle;
}
.badge .icon { width: .875rem; height: .875rem; }
.badge--success { background: var(--ok-soft); color: var(--ok); border-color: var(--ok-line); }
.badge--warning { background: var(--warn-soft); color: var(--warn); border-color: var(--warn-line); }
.badge--neutral { background: var(--line-soft); color: var(--gray); border-color: var(--line); }
.badge--info { background: var(--info-soft); color: var(--blue); border-color: var(--accent-line); }
.badge + .badge { margin-left: var(--s-2); }

.toasts {
    position: fixed; z-index: 60; right: var(--s-4); bottom: calc(var(--s-4) + env(safe-area-inset-bottom));
    display: grid; gap: var(--s-2); width: min(26rem, calc(100vw - 2rem));
}
.toast {
    display: flex; gap: var(--s-3); align-items: flex-start; padding: var(--s-3) var(--s-4);
    background: var(--carbon-bg); color: #F7F3ED; border-radius: var(--radius-lg); box-shadow: var(--shadow-pop);
    font-size: var(--fs-sm);
}
.toast p { margin: 0; }
.toast--error { background: #6E1A14; color: #fff; }

/* ---------- Superficies ---------- */
.panel-box {
    background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: var(--s-5); margin-bottom: var(--s-5); box-shadow: var(--shadow);
}
.panel-box__title { font-size: var(--fs-md); margin-bottom: var(--s-3); }
.action-row {
    display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-5); align-items: center; justify-content: space-between;
    padding: var(--s-4) 0; border-top: 1px solid var(--line-soft);
}
.action-row p { margin: 0; font-size: var(--fs-sm); }
.disclosure { padding: var(--s-2) 0 var(--s-4); }
.disclosure summary { cursor: pointer; font-weight: 500; color: var(--blue); min-height: var(--tap); display: flex; align-items: center; }
.disclosure[open] summary { margin-bottom: var(--s-3); }

/* Margen de folio: doble filete a la izquierda, como un pliego de protocolo. */
.folio { position: relative; }
.folio::before {
    content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 5px;
    border-left: 1px solid var(--ochre); border-right: 1px solid var(--ochre); opacity: .55;
}

.empty { text-align: center; padding: var(--s-7) var(--s-4); color: var(--gray); }
.empty h1 { margin-top: var(--s-3); }
.empty p { max-width: 36rem; margin-inline: auto; }

/* ---------- Tablas ---------- */
.table { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); font-size: var(--fs-sm); }
.table th { text-align: left; font-weight: 600; color: var(--gray); font-size: var(--fs-xs); padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--line); background: var(--surface-alt); }
.table td { padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--line-soft); vertical-align: top; overflow-wrap: anywhere; }
.table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr:hover { background: var(--hover); }
.table--compact td { padding: var(--s-2) var(--s-4); }
.table__primary { font-weight: 600; text-decoration: none; display: block; }
.table__primary:hover { text-decoration: underline; }
.table__sub { display: block; color: var(--gray); font-size: var(--fs-xs); }

.results { position: relative; transition: opacity .15s; }
.results.htmx-request { opacity: .55; }

.filters { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: flex-end; margin-bottom: var(--s-4); }
.filters .field { flex: 0 1 12rem; }
.filters .field--grow { flex: 1 1 16rem; }

.pagination { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; justify-content: space-between; padding: var(--s-4) 0; font-size: var(--fs-sm); }
.pagination a { display: inline-flex; gap: var(--s-1); align-items: center; min-height: var(--tap); padding: 0 var(--s-2); text-decoration: none; font-weight: 500; }
.pagination__info { color: var(--gray); }

.list-rows { list-style: none; margin: 0 0 var(--s-5); padding: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); }
.list-rows__item { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--line-soft); }
.list-rows__item:last-child { border-bottom: 0; }
.list-rows__item > div { flex: 1 1 14rem; min-width: 0; }
.list-rows__item strong, .list-rows__item span.muted { display: block; overflow-wrap: anywhere; }
.list-rows__item span.muted { font-size: var(--fs-sm); }

.timeline-mini { list-style: none; margin: 0; padding: 0; font-size: var(--fs-sm); }
.timeline-mini li { display: grid; grid-template-columns: 8.5rem 1fr; gap: var(--s-3); padding: var(--s-2) 0; border-bottom: 1px solid var(--line-soft); }
.timeline-mini li:last-child { border-bottom: 0; }
.timeline-mini time { color: var(--gray); font-variant-numeric: tabular-nums; }

.tabs { display: flex; gap: var(--s-1); border-bottom: 1px solid var(--line); margin-top: var(--s-4); overflow-x: auto; scrollbar-width: thin; }
.tabs a { padding: var(--s-3) var(--s-4); text-decoration: none; color: var(--gray); font-weight: 500; border-bottom: 2px solid transparent; margin-bottom: -1px; white-space: nowrap; }
.tabs a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--ochre); }

.breadcrumb { display: flex; flex-wrap: wrap; gap: var(--s-2); font-size: var(--fs-sm); color: var(--gray); margin-bottom: var(--s-3); }
.breadcrumb span[aria-current] { color: var(--graphite); overflow-wrap: anywhere; }

.perm-matrix { display: grid; gap: var(--s-2); }
.perm-matrix__row { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--s-2) var(--s-4); margin: 0; }
.perm-matrix__row legend { font-weight: 600; color: var(--ink); padding: 0 var(--s-1); font-size: var(--fs-sm); }

.checklist { list-style: none; padding: 0; margin: 0 0 var(--s-5); font-size: var(--fs-sm); }
.checklist li { padding: var(--s-2) var(--s-3); border-left: 3px solid var(--line); margin-bottom: var(--s-1); background: var(--surface); }
.checklist li.is-ok { border-left-color: var(--ok); }
.checklist li.is-bad { border-left-color: var(--bad); background: var(--bad-soft); }
.checklist li.is-warn { border-left-color: var(--warn); }
.steps { padding-left: 1.25rem; }
.steps li { margin-bottom: var(--s-2); }

.dialog {
    border: 1px solid var(--line); border-radius: var(--radius-lg); padding: var(--s-5);
    max-width: min(28rem, calc(100vw - 2rem)); box-shadow: var(--shadow-pop); color: var(--graphite);
}
.dialog::backdrop { background: var(--backdrop); }
.dialog__actions { display: flex; flex-wrap: wrap; gap: var(--s-3); justify-content: flex-end; margin-top: var(--s-4); }

/* ---------- Páginas ---------- */
.page { max-width: 72rem; margin: 0 auto; padding: var(--s-6) var(--s-5) var(--s-7); }
.page--narrow { max-width: 46rem; }
.page-header { margin-bottom: var(--s-5); }
.page-header--row { display: flex; flex-wrap: wrap; gap: var(--s-4); align-items: flex-start; justify-content: space-between; }
.page-header--row > div { flex: 1 1 20rem; min-width: 0; }
.page-header h1 { overflow-wrap: anywhere; }
.page-header__lead { color: var(--gray); max-width: 44rem; margin: 0; }
.dash-grid { display: grid; gap: var(--s-5); grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); align-items: start; }
.dash-grid .panel-box { margin: 0; }

/* ---------- Layout del panel ---------- */
.shell { display: grid; grid-template-columns: var(--sidebar-w) minmax(0, 1fr); min-height: 100vh; min-height: 100dvh; }
.sidebar {
    position: sticky; top: 0; height: 100vh; height: 100dvh; overflow-y: auto;
    display: flex; flex-direction: column; background: var(--side-bg); color: var(--side-ink);
    padding-bottom: env(safe-area-inset-bottom);
}
.sidebar__brand { display: flex; align-items: center; justify-content: space-between; padding: var(--s-4) var(--s-4) var(--s-3); }
.brand { display: flex; gap: var(--s-3); align-items: center; color: var(--side-strong); text-decoration: none; min-width: 0; }
.brand:hover { color: var(--side-strong); }
.brand__mark { display: grid; place-items: center; flex: none; color: var(--side-accent); }
.brand__mark .ebe-mono { --mono-h: 1.6rem; }
.theme-icon-btn { color: var(--ink); }
.brand__name { font-family: var(--font-serif); font-size: .8125rem; font-weight: 400; letter-spacing: .16em; line-height: 1.3; overflow-wrap: anywhere; }
.sidebar__close { display: none; color: var(--side-strong); }
.sidebar__nav { flex: 1; padding: var(--s-2) var(--s-3); }
.sidebar__nav ul { list-style: none; margin: 0 0 var(--s-3); padding: 0; }
.sidebar__group { font-size: var(--fs-xs); color: var(--side-muted); margin: var(--s-4) var(--s-3) var(--s-1); font-weight: 600; }
.sidebar__nav a, .sidebar__account a, .sidebar__account .linklike {
    display: flex; gap: var(--s-3); align-items: center; min-height: 40px; padding: 0 var(--s-3);
    color: var(--side-ink); text-decoration: none; border-radius: var(--radius); font-size: var(--fs-sm); width: 100%;
}
.sidebar__nav a:hover, .sidebar__account a:hover, .sidebar__account .linklike:hover { background: var(--side-bg-2); color: var(--side-strong); }
.sidebar__nav a[aria-current="page"] { background: var(--side-bg-2); color: var(--side-strong); box-shadow: inset 3px 0 0 var(--side-accent); }
.sidebar__nav a:focus-visible, .sidebar__account a:focus-visible, .sidebar__account .linklike:focus-visible { box-shadow: 0 0 0 2px var(--side-accent); }
.sidebar__user { display: flex; gap: var(--s-3); align-items: center; padding: var(--s-4); border-top: 1px solid var(--side-line); }
.avatar { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--side-accent); color: var(--side-bg); font-size: var(--fs-xs); font-weight: 600; flex: none; }
.sidebar__who { min-width: 0; font-size: var(--fs-sm); }
.sidebar__who strong { display: block; color: var(--side-strong); font-weight: 500; overflow-wrap: anywhere; }
.sidebar__who span { display: block; color: var(--side-muted); font-size: var(--fs-xs); overflow-wrap: anywhere; }
.sidebar__account { padding: 0 var(--s-3) var(--s-4); }
.workspace { min-width: 0; display: flex; flex-direction: column; }
.topbar { display: none; }
#main { flex: 1; min-width: 0; }
.net-badge { display: inline-flex; gap: var(--s-1); align-items: center; font-size: var(--fs-xs); font-weight: 600; color: var(--warn); background: var(--warn-soft); border: 1px solid var(--warn-line); padding: .2rem .5rem; border-radius: 3px; }
.bottom-nav { display: none; }
.scrim { display: none; }

@media (max-width: 960px) {
    .shell { grid-template-columns: minmax(0, 1fr); }
    .sidebar {
        position: fixed; z-index: 50; inset: 0 auto 0 0; width: min(20rem, 86vw);
        transform: translateX(-100%); transition: transform .2s var(--ease); visibility: hidden;
    }
    .sidebar.is-open { transform: none; visibility: visible; box-shadow: var(--shadow-pop); }
    .sidebar__close { display: inline-grid; }
    .scrim.is-open { display: block; position: fixed; inset: 0; z-index: 45; background: var(--backdrop); }
    .topbar {
        display: flex; align-items: center; gap: var(--s-2); position: sticky; top: 0; z-index: 30;
        height: calc(var(--topbar-h) + env(safe-area-inset-top)); padding: env(safe-area-inset-top) var(--s-2) 0;
        background: var(--surface); border-bottom: 1px solid var(--line);
    }
    .topbar__brand { display: inline-flex; align-items: center; gap: var(--s-2); font-family: var(--font-serif); font-size: .8125rem; letter-spacing: .14em; color: var(--ink); text-decoration: none; overflow: hidden; white-space: nowrap; min-width: 0; }
    .topbar__brand .ebe-mono { --mono-h: 1.25rem; color: var(--accent-bronze); }
    .topbar__spacer { flex: 1; }
    .bottom-nav {
        display: flex; position: fixed; z-index: 30; left: 0; right: 0; bottom: 0;
        height: calc(var(--bottom-h) + env(safe-area-inset-bottom)); padding-bottom: env(safe-area-inset-bottom);
        background: var(--surface); border-top: 1px solid var(--line);
    }
    .bottom-nav a, .bottom-nav button {
        flex: 1; display: flex; flex-direction: column; gap: 2px; align-items: center; justify-content: center;
        min-width: 0; font: 500 .6875rem/1.2 var(--font-ui); color: var(--gray); text-decoration: none;
        background: none; border: 0; cursor: pointer;
    }
    .bottom-nav span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 2px; }
    .bottom-nav .icon { width: 1.375rem; height: 1.375rem; }
    .bottom-nav a { position: relative; }
    .bottom-nav__count { position: absolute; top: .35rem; left: calc(50% + .45rem); min-width: 1.1rem; height: 1.1rem; padding: 0 .25rem; border-radius: 999px; background: var(--bad); color: #fff; font: 600 .6875rem/1.1rem var(--font-ui); text-align: center; }
    .bottom-nav a[aria-current="page"] { color: var(--blue); }
    body.panel { padding-bottom: calc(var(--bottom-h) + env(safe-area-inset-bottom)); }
    .toasts { bottom: calc(var(--bottom-h) + var(--s-3) + env(safe-area-inset-bottom)); }
    .page { padding: var(--s-5) var(--s-4) var(--s-6); }
    h1 { font-size: var(--fs-xl); }
}

/* Tablas → filas de resumen en pantallas angostas */
@media (max-width: 720px) {
    .table--responsive, .table--responsive tbody, .table--responsive tr, .table--responsive td { display: block; width: 100%; }
    .table--responsive thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .table--responsive tr { padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--line-soft); }
    .table--responsive tbody tr:last-child { border-bottom: 0; }
    .table--responsive td { padding: 2px 0; border: 0; display: grid; grid-template-columns: 7.5rem 1fr; gap: var(--s-3); }
    .table--responsive td::before { content: attr(data-label); color: var(--gray); font-size: var(--fs-xs); font-weight: 600; padding-top: .1em; }
    .table--responsive td > .badge { justify-self: start; }
    .table--responsive td:first-child { display: block; padding-bottom: var(--s-2); }
    .table--responsive td:first-child::before { content: none; }
    .panel-box { padding: var(--s-4); }
    .filters .field { flex: 1 1 100%; }
    .timeline-mini li { grid-template-columns: 1fr; gap: 0; }
}

/* ---------- Menú agrupado ---------- */
.nav-root, .nav-group__list { list-style: none; margin: 0; padding: 0; }
.nav-root > li { margin-bottom: 2px; }
.nav-group__btn {
    display: flex; gap: var(--s-3); align-items: center; width: 100%; min-height: 40px; padding: 0 var(--s-3);
    background: none; border: 0; border-radius: var(--radius); color: var(--side-ink); font: 500 var(--fs-sm)/1.2 var(--font-ui); text-align: left; cursor: pointer;
}
.nav-group__btn:hover { background: var(--side-bg-2); color: var(--side-strong); }
.nav-group__btn:focus-visible { box-shadow: 0 0 0 2px var(--side-accent); }
.nav-group.is-active > .nav-group__btn { color: var(--side-strong); }
.nav-group__chev { margin-left: auto; display: inline-flex; transition: transform .15s var(--ease); }
.nav-group__btn[aria-expanded="true"] .nav-group__chev { transform: rotate(180deg); }
.nav-group__list { padding: 2px 0 var(--s-2) var(--s-4); }
.nav-group__list a { min-height: 38px; }
.sidebar__nav .nav-top, .sidebar__nav .nav-group__list a { font-size: var(--fs-sm); }
.nav-pref { display: flex; gap: var(--s-2); align-items: center; margin: var(--s-4) var(--s-3) var(--s-2); font-size: var(--fs-xs); color: var(--side-muted); cursor: pointer; }
.nav-pref input { accent-color: var(--side-accent); }
.sidebar__collapse { color: var(--side-muted); flex: none; }
.sidebar__collapse:hover { color: var(--side-strong); background: var(--side-bg-2); }
.count--alert { background: var(--side-accent); color: var(--side-bg); }
.topbar__bell { position: relative; color: var(--ink); }
.topbar__bell .dot { position: absolute; top: 9px; right: 9px; width: 8px; height: 8px; border-radius: 50%; background: var(--bad); }
/* Barra contraída (sólo escritorio): íconos con etiqueta accesible y título. */
@media (min-width: 961px) {
    body.nav-collapsed .shell { grid-template-columns: 4.25rem minmax(0, 1fr); }
    body.nav-collapsed .nav-label, body.nav-collapsed .nav-group__chev, body.nav-collapsed .sidebar__who { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    body.nav-collapsed .sidebar__brand { flex-direction: column; gap: var(--s-2); padding: var(--s-3) var(--s-2); }
    body.nav-collapsed .sidebar__collapse .icon { transform: rotate(180deg); }
    body.nav-collapsed .sidebar__nav { padding: var(--s-2); }
    body.nav-collapsed .nav-group__list { padding-left: 0; }
    body.nav-collapsed .nav-group__btn, body.nav-collapsed .sidebar__nav a, body.nav-collapsed .sidebar__account a, body.nav-collapsed .sidebar__account .linklike { justify-content: center; padding: 0; }
    body.nav-collapsed .sidebar__user { justify-content: center; padding: var(--s-3) 0; }
    body.nav-collapsed .sidebar__account { padding: 0 var(--s-2) var(--s-3); }
}
@media (max-width: 960px) { .sidebar__collapse { display: none; } }

/* ---------- Agenda interactiva (FullCalendar) ---------- */
.calendar { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: var(--s-3); margin-bottom: var(--s-3); --fc-border-color: var(--line-soft); --fc-today-bg-color: var(--accent-bronze-soft); --fc-page-bg-color: var(--surface); --fc-neutral-bg-color: var(--surface-alt); --fc-event-bg-color: var(--surface-alt); --fc-event-border-color: var(--line); --fc-event-text-color: var(--graphite); --fc-button-bg-color: var(--surface); --fc-button-border-color: var(--line); --fc-button-text-color: var(--ink); --fc-button-hover-bg-color: var(--line-soft); --fc-button-hover-border-color: var(--line); --fc-button-active-bg-color: var(--blue-soft); --fc-button-active-border-color: var(--blue); --fc-now-indicator-color: var(--bad); }
.calendar .fc { font-size: var(--fs-sm); }
.calendar .fc .fc-toolbar-title { font-family: var(--font-serif); font-size: var(--fs-lg); color: var(--ink); text-transform: capitalize; }
.calendar .fc .fc-button { min-height: 40px; font-weight: 500; text-transform: none; box-shadow: none !important; }
.calendar .fc .fc-button:focus-visible { box-shadow: var(--focus) !important; }
.calendar .fc .fc-button-primary:not(:disabled).fc-button-active { color: var(--ink); }
.calendar .fc-event { border-left-width: 4px !important; cursor: pointer; }
.calendar .fc-event:focus-visible { box-shadow: var(--focus); }
.fc-crm-event { display: grid; overflow: hidden; padding: 1px 3px; line-height: 1.3; }
.fc-crm-kind { font-size: .6875rem; font-weight: 700; opacity: .85; }
.fc-crm-title { white-space: normal; overflow-wrap: anywhere; }
.calendar .kind--audiencia { border-left-color: var(--bad) !important; background: var(--bad-soft); }
.calendar .kind--vencimiento { border-left-color: var(--warn) !important; background: var(--warn-soft); }
.calendar .kind--reunion, .calendar .kind--entrevista { border-left-color: var(--blue) !important; background: var(--blue-soft); }
.calendar .kind--recordatorio, .calendar .kind--otro { border-left-color: var(--gray) !important; }
.calendar .status--realizado { opacity: .65; }
.calendar .fc-list-event .fc-crm-event { display: flex; gap: var(--s-2); }
.kind-legend { list-style: none; display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-4); padding: 0; margin: 0 0 var(--s-3); }
.calendar-help { margin-bottom: var(--s-5); }
.dialog--wide { max-width: min(42rem, calc(100vw - 1rem)); width: 100%; max-height: calc(100dvh - 2rem); overflow: auto; }
.dialog__head { display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); margin-bottom: var(--s-3); }
.dialog__head h2 { margin: 0; }
.reminders-box { background: var(--surface-alt); border-radius: var(--radius); padding: var(--s-3) !important; }
.list-rows__item.is-unread { background: var(--accent-bronze-soft); }
@media (max-width: 720px) {
    .calendar { padding: var(--s-2); }
    .calendar .fc .fc-toolbar { flex-wrap: wrap; gap: var(--s-2); }
    .calendar .fc .fc-toolbar-title { font-size: var(--fs-md); }
    .dialog--wide { padding: var(--s-4); }
}

/* ---------- Módulos de trabajo (Etapa 3+) ---------- */
.page--wide { max-width: 84rem; }
.action-bar { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; margin: 0 0 var(--s-4); }
.page-header .action-bar { margin: 0; }
.row-actions { display: flex; flex-wrap: wrap; gap: var(--s-1); align-items: center; }
.row-between { display: flex; gap: var(--s-3); align-items: center; justify-content: space-between; }
.prewrap { white-space: pre-wrap; overflow-wrap: anywhere; }
.num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.badge--danger { background: var(--bad-soft); color: var(--bad); border-color: var(--bad-line); }
.count { display: inline-block; min-width: 1.4em; padding: 0 .35em; border-radius: 3px; background: var(--line-soft); color: var(--gray); font-size: var(--fs-xs); font-weight: 600; text-align: center; }

.detail-grid { display: grid; gap: var(--s-5); grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr)); align-items: start; margin-bottom: var(--s-5); }
.detail-grid .panel-box { margin: 0; }
.dl { display: grid; grid-template-columns: minmax(8rem, 11rem) 1fr; gap: var(--s-2) var(--s-4); margin: 0 0 var(--s-3); font-size: var(--fs-sm); }
.dl dt { color: var(--gray); font-weight: 500; }
.dl dd { margin: 0; overflow-wrap: anywhere; }
.link-list { list-style: none; margin: 0 0 var(--s-3); padding: 0; }
.link-list li { padding: var(--s-2) 0; border-bottom: 1px solid var(--line-soft); overflow-wrap: anywhere; }
.link-list li:last-child { border-bottom: 0; }
.link-list .muted { font-size: var(--fs-sm); }
.inline-list { list-style: none; margin: 0 0 var(--s-3); padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-4); }

/* Opción segmentada (persona física/jurídica, honorario/gasto) */
.segmented { display: inline-flex; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: var(--surface); }
.segmented__opt { position: relative; }
.segmented__opt input { position: absolute; opacity: 0; inset: 0; }
.segmented__opt span { display: flex; align-items: center; min-height: var(--tap); padding: 0 var(--s-4); font-size: var(--fs-sm); font-weight: 500; cursor: pointer; color: var(--gray); }
.segmented__opt + .segmented__opt span { border-left: 1px solid var(--line); }
.segmented__opt input:checked + span { background: var(--blue-soft); color: var(--ink); box-shadow: inset 0 -2px 0 var(--blue); }
.segmented__opt input:focus-visible + span { box-shadow: var(--focus); }

/* Elección de tipo de asunto */
.choice-grid { display: grid; gap: var(--s-4); grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); margin-bottom: var(--s-5); }
.choice { display: grid; gap: var(--s-2); padding: var(--s-5) var(--s-5) var(--s-5) calc(var(--s-5) + 6px); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); text-decoration: none; color: var(--graphite); }
.choice:hover { border-color: var(--blue); color: var(--graphite); }
.choice strong { font-family: var(--font-serif); font-size: var(--fs-lg); color: var(--ink); }
.choice span { font-size: var(--fs-sm); color: var(--gray); }
.choice .icon--xl { color: var(--ochre); }

/* Ficha del asunto */
.matter-head__code { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; margin: 0 0 var(--s-2); font-weight: 600; color: var(--ochre); font-variant-numeric: tabular-nums; }
.matter-head__code .badge + .badge { margin-left: 0; }
.tabs--scroll { margin-top: 0; }
.tab-panel { padding-top: var(--s-5); }
.folio-box { position: relative; padding-left: calc(var(--s-5) + 6px); }
.folio-box::before { content: ""; position: absolute; top: var(--s-4); bottom: var(--s-4); left: 0; width: 5px; border-left: 1px solid var(--ochre); border-right: 1px solid var(--ochre); opacity: .55; }

.checklist-items { list-style: none; margin: 0 0 var(--s-3); padding: 0; }
.checklist-items li { border-bottom: 1px solid var(--line-soft); }
.check-toggle { display: grid; grid-template-columns: auto 1fr auto; gap: var(--s-3); align-items: center; width: 100%; min-height: var(--tap); padding: var(--s-2) 0; background: none; border: 0; text-align: left; font: inherit; font-size: var(--fs-sm); color: inherit; cursor: pointer; }
.check-toggle:disabled { cursor: default; }
.check-toggle .muted { font-size: var(--fs-xs); }
.checklist-items .is-done .icon { color: var(--ok); }
.checklist-items .is-done span:nth-child(2) { color: var(--gray); }

/* Cronología de hechos */
.timeline { list-style: none; margin: 0 0 var(--s-3); padding: 0 0 0 var(--s-1); }
.timeline__item { display: grid; grid-template-columns: 6.5rem 1fr; gap: var(--s-4); padding: var(--s-3) 0; border-bottom: 1px solid var(--line-soft); }
.timeline__item:last-child { border-bottom: 0; }
.timeline__item time { color: var(--gray); font-size: var(--fs-sm); font-variant-numeric: tabular-nums; padding-top: .1em; }
.timeline__item > div { min-width: 0; display: grid; gap: 2px; }
.timeline__item p { margin: var(--s-1) 0; font-size: var(--fs-sm); }
.timeline__type { font-size: var(--fs-xs); font-weight: 600; color: var(--ochre); }
.timeline__item--evento .timeline__type { color: var(--blue); }
.timeline__item .btn { justify-self: start; }

/* Tareas */
.task-list { list-style: none; margin: 0 0 var(--s-4); padding: 0; }
.task-list.panel-box { padding: 0 var(--s-4); }
.task-list__item { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-3); align-items: center; padding: var(--s-2) 0; border-bottom: 1px solid var(--line-soft); }
.task-list__item:last-child { border-bottom: 0; }
.task-list__item > div { flex: 1 1 14rem; min-width: 0; }
.task-list__item strong { display: block; overflow-wrap: anywhere; }
.task-list__item .muted { font-size: var(--fs-sm); }
.task-list__item.is-done strong { text-decoration: line-through; color: var(--gray); }
.task-list__item.is-done .icon-btn { color: var(--ok); }
.due { display: inline-flex; gap: .3rem; align-items: center; font-size: var(--fs-sm); white-space: nowrap; font-variant-numeric: tabular-nums; }
.due--late { color: var(--bad); font-weight: 600; }
.due--today { color: var(--warn); font-weight: 600; }
.board { display: grid; gap: var(--s-4); grid-template-columns: repeat(4, minmax(15rem, 1fr)); overflow-x: auto; padding-bottom: var(--s-3); }
.board__col { background: var(--surface-alt); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: var(--s-3); min-width: 0; }
.board__title { font-size: var(--fs-sm); display: flex; gap: var(--s-2); align-items: center; }
.board .task-list__item { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: var(--s-2) var(--s-3); margin-bottom: var(--s-2); }
.board__move { list-style: none; margin: -.4rem 0 var(--s-2); }

/* Eventos */
.event-list { list-style: none; margin: 0 0 var(--s-3); padding: 0; }
.event-list__item { display: grid; grid-template-columns: 8.5rem 6.5rem 1fr auto; gap: var(--s-3); align-items: start; padding: var(--s-2) 0; border-bottom: 1px solid var(--line-soft); font-size: var(--fs-sm); }
.event-list__item:last-child { border-bottom: 0; }
.event-list__item > span:nth-of-type(2) { min-width: 0; overflow-wrap: anywhere; }
.event-list__item .muted, .event-list__item a { display: block; }
.event-list__item time { font-variant-numeric: tabular-nums; color: var(--gray); }
.event-list--compact .event-list__item { grid-template-columns: 7.5rem 1fr; }
.event-list--compact .kind { display: none; }
.event-list__item.is-cancelled { opacity: .6; }
.kind { font-size: var(--fs-xs); font-weight: 600; padding-left: var(--s-2); border-left: 3px solid var(--line); line-height: 1.4; }
.kind--audiencia { border-color: var(--bad); }
.kind--vencimiento { border-color: var(--warn); }
.kind--reunion, .kind--entrevista { border-color: var(--blue); }
.kind--recordatorio, .kind--otro { border-color: var(--gray); }

/* Calendario */
.cal-toolbar { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-5); align-items: flex-end; justify-content: space-between; margin-bottom: var(--s-4); }
.cal-toolbar .tabs { margin: 0; border: 0; }
.cal-toolbar .filters { margin: 0; }
.cal-nav { display: flex; gap: var(--s-2); align-items: center; flex-wrap: wrap; }
.cal-nav__title { margin: 0 0 0 var(--s-2); font-family: var(--font-serif); font-size: var(--fs-lg); }
.cal { border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); overflow: hidden; margin-bottom: var(--s-5); }
.cal__head, .cal__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal__head span { padding: var(--s-2) var(--s-3); font-size: var(--fs-xs); font-weight: 600; color: var(--gray); background: var(--surface-alt); border-bottom: 1px solid var(--line); }
.cal__day { min-height: 7.5rem; padding: var(--s-1) var(--s-2) var(--s-2); border-right: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.cal__day:nth-child(7n) { border-right: 0; }
.cal--week .cal__day { min-height: 16rem; }
.cal__day.is-other { background: var(--surface-alt); }
.cal__day.is-other .cal__date { color: var(--placeholder); }
.cal__day.is-today .cal__date > span { color: #fff; background: var(--blue); border-radius: 3px; padding: 0 .4em; }
.cal__date { display: flex; justify-content: space-between; align-items: center; font-size: var(--fs-sm); font-weight: 600; color: var(--ink); min-height: 28px; }
.cal__dow { display: none; }
.cal__add { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: var(--radius); color: var(--gray); opacity: 0; }
.cal__day:hover .cal__add, .cal__add:focus-visible { opacity: 1; }
.cal__add:hover { background: var(--line-soft); }
.cal-event { display: grid; gap: 0; padding: 2px var(--s-2); border-left: 3px solid var(--line); border-radius: 2px; background: var(--surface-alt); text-decoration: none; color: var(--graphite); font-size: var(--fs-xs); line-height: 1.35; min-width: 0; }
.cal-event:hover { background: var(--blue-soft); color: var(--ink); }
.cal-event__time { color: var(--gray); font-variant-numeric: tabular-nums; }
.cal-event__title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.cal__more { font-size: var(--fs-xs); }
.cal-toolbar .filters { flex-wrap: nowrap; }
.cal-toolbar .filters .field { flex: 0 0 12rem; }
.cal-event.kind--audiencia { border-left-color: var(--bad); }
.cal-event.kind--vencimiento { border-left-color: var(--warn); }
.cal-event.kind--reunion, .cal-event.kind--entrevista { border-left-color: var(--blue); }
.cal-event.kind--recordatorio, .cal-event.kind--otro { border-left-color: var(--gray); }
@media (max-width: 720px) { .cal-toolbar .filters { flex-wrap: wrap; } .cal-toolbar .filters .field { flex: 1 1 100%; } }
.agenda-list__day { margin-bottom: var(--s-4); }
.agenda-list__day h3 { font-size: var(--fs-sm); color: var(--gray); border-bottom: 1px solid var(--line); padding-bottom: var(--s-1); margin-bottom: 0; }
.agenda-list__day.is-today h3 { color: var(--ink); }

/* Honorarios */
.balances { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-6); margin-bottom: var(--s-3); }
.balance { margin: 0; }
.balance dt { font-size: var(--fs-xs); font-weight: 600; color: var(--gray); }
.balance dd { margin: 0; font-size: var(--fs-sm); }
.balance__main { font-family: var(--font-serif); font-size: var(--fs-xl) !important; color: var(--ink); font-variant-numeric: tabular-nums; }
.balance__main .muted { font-family: var(--font-ui); font-size: var(--fs-xs); }
tr.is-void td { color: var(--gray); }
tr.is-void .num { text-decoration: line-through; }
.void-box { display: inline-block; }
.void-box summary { list-style: none; }
.void-box summary::-webkit-details-marker { display: none; }
.void-box[open] { display: block; margin-top: var(--s-2); }

/* Documentos */
.version-list { list-style: none; margin: 0 0 var(--s-3); padding: 0; }
.version-list li { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; justify-content: space-between; padding: var(--s-3) 0; border-bottom: 1px solid var(--line-soft); }
.version-list li > div { flex: 1 1 16rem; min-width: 0; }
.version-list .muted { display: block; font-size: var(--fs-sm); overflow-wrap: anywhere; }
.mono-hash { font-variant-numeric: tabular-nums; letter-spacing: .02em; }

.notes { list-style: none; padding: 0; margin: 0; }
.notes .panel-box p:last-child { margin: 0; font-size: var(--fs-sm); }

/* Inicio */
.stat-row { display: flex; flex-wrap: wrap; gap: var(--s-3); margin-bottom: var(--s-5); }
.stat { display: flex; gap: var(--s-2); align-items: baseline; padding: var(--s-3) var(--s-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); text-decoration: none; color: var(--graphite); }
.stat:hover { border-color: var(--blue); color: var(--graphite); }
.stat__n { font-family: var(--font-serif); font-size: var(--fs-xl); font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.stat__l { font-size: var(--fs-sm); color: var(--gray); display: inline-flex; gap: .25rem; align-items: center; }
.stat--alert { border-color: var(--bad-line); background: var(--bad-soft); }
.stat--alert .stat__n, .stat--alert .stat__l { color: var(--bad); }

/* Catálogos y roles */
.chips { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-bottom: var(--s-5); }
.chips a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 var(--s-3); border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); font-size: var(--fs-sm); text-decoration: none; color: var(--graphite); }
.chips a[aria-current="page"] { border-color: var(--blue); background: var(--blue-soft); color: var(--ink); font-weight: 600; }
.perm-matrix--reserved .perm-matrix__row { background: var(--surface-alt); }
.filters--tight { gap: var(--s-2); }

@media (max-width: 720px) {
    .dl { grid-template-columns: 1fr; gap: 0; }
    .dl dd { margin-bottom: var(--s-2); }
    .timeline__item { grid-template-columns: 1fr; gap: var(--s-1); }
    .event-list__item, .event-list--compact .event-list__item { grid-template-columns: 1fr; gap: 2px; }
    .event-list__item .btn { justify-self: start; }
    .detail-grid { grid-template-columns: minmax(0, 1fr); }
    .board { grid-template-columns: repeat(4, minmax(15rem, 85vw)); }
    /* Calendario en celular: los días se apilan en lista. */
    .cal__head { display: none; }
    .cal__grid { grid-template-columns: minmax(0, 1fr); }
    .cal__day { min-height: 0; border-right: 0; }
    .cal__day.is-other { display: none; }
    .cal--week .cal__day { min-height: 0; }
    .cal__dow { display: inline; }
    .cal__add { opacity: 1; }
    .cal-event__title { white-space: normal; }
}

/* ---------- IA, biblioteca y plantillas ---------- */
.ai-thread { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-4); }
.ai-msg { padding: var(--s-3) var(--s-4); border-radius: var(--radius-lg); border: 1px solid var(--line); background: var(--surface); }
.ai-msg--user { background: var(--blue-soft); border-color: var(--accent-line); }
.ai-msg--assistant { border-left: 3px solid var(--ochre); }
.ai-msg__who { font-size: var(--fs-sm); font-weight: 600; color: var(--ink); margin-bottom: var(--s-1); }
.ai-msg__body { font-size: var(--fs-md); line-height: 1.65; }
.ai-sources { margin-top: var(--s-2); font-size: var(--fs-sm); }
.ai-sources summary { cursor: pointer; color: var(--blue); }
.consent-list { list-style: none; margin: 0 0 var(--s-3); padding: 0; }
.consent-list li { border-bottom: 1px solid var(--line-soft); padding: var(--s-1) 0; }
.consent-list details summary { cursor: pointer; font-size: var(--fs-xs); padding-left: 1.6rem; }
.consent-preview { white-space: pre-wrap; overflow-wrap: anywhere; font: var(--fs-xs)/1.5 var(--font-ui); background: var(--surface-alt); border: 1px solid var(--line-soft); border-radius: var(--radius); padding: var(--s-2) var(--s-3); max-height: 16rem; overflow: auto; }
.sugg-list { list-style: none; margin: 0; padding: 0; }
.sugg-list li { display: grid; gap: var(--s-2); padding: var(--s-3) 0; border-bottom: 1px solid var(--line-soft); }
.sugg-list p { margin: var(--s-1) 0 0; font-size: var(--fs-sm); }
.source-list { list-style: none; margin: 0; padding: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); }
.source-list li { display: flex; gap: var(--s-3); padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--line-soft); }
.source-list li:last-child { border-bottom: 0; }
.source-list li > div { min-width: 0; display: grid; gap: 2px; }
.source-list .muted { font-size: var(--fs-sm); }
.source-list p { margin: var(--s-1) 0 0; }
.source-body { max-height: 40rem; overflow: auto; }
.template-preview { font-family: var(--font-serif); font-size: 1.0625rem; line-height: 1.7; background: var(--surface); border: 1px solid var(--line-soft); padding: var(--s-5); max-width: 46rem; }
textarea.mono { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 15px; }
.ai-job { margin: var(--s-2) 0; font-size: var(--fs-sm); }
.spinner { display: inline-block; width: .9rem; height: .9rem; border-radius: 50%; border: 2px solid var(--gray); border-color: var(--gray) transparent var(--gray) transparent; animation: spin .8s linear infinite; vertical-align: -.1em; }
form.htmx-request .btn[type=submit], .btn.is-busy { cursor: progress; }

/* ---------- Marca EBE (monograma y bloque de marca) ---------- */
/* El monograma es la máscara del logotipo aprobado: toma el color del texto (currentColor). */
.ebe-mono {
    --mono-h: 2rem;
    display: inline-block; flex: none; height: var(--mono-h); aspect-ratio: 958 / 600;
    background: currentColor;
    -webkit-mask: url("../brand/ebe/monogram-mask.png") center / contain no-repeat;
    mask: url("../brand/ebe/monogram-mask.png") center / contain no-repeat;
}
.ebe-lockup { display: inline-flex; align-items: center; gap: .85rem; color: var(--ink); min-width: 0; }
.ebe-lockup .ebe-mono { --mono-h: 2.35rem; color: var(--accent-bronze); }
.ebe-lockup__text { display: grid; gap: .25rem; min-width: 0; }
.ebe-lockup__name { font-family: var(--font-serif); font-weight: 400; font-size: .95rem; letter-spacing: .2em; text-transform: uppercase; line-height: 1.1; white-space: nowrap; }
.ebe-lockup__tag { font-family: var(--font-ui); font-weight: 400; font-size: .5625rem; letter-spacing: .22em; text-transform: uppercase; color: var(--gray); line-height: 1.1; white-space: nowrap; }
.ebe-lockup--sm .ebe-mono { --mono-h: 1.9rem; }
.ebe-lockup--sm .ebe-lockup__name { font-size: .8125rem; }
.rule { display: block; width: 2.25rem; height: 1px; background: var(--rule); margin: var(--s-5) 0; }
.rule--sm { width: 1.5rem; margin: var(--s-3) 0; }

/* Interruptor día / noche: ícono del modo activo + pista */
.theme-switch {
    display: inline-flex; align-items: center; gap: .55rem; min-height: var(--tap); padding: 0 .25rem;
    background: none; border: 0; color: var(--ink); cursor: pointer; border-radius: 999px;
}
.theme-switch .icon { width: 1rem; height: 1rem; }
.theme-switch__icon { display: inline-flex; }
html:not([data-theme="dark"]) .theme-switch__icon--moon,
html[data-theme="dark"] .theme-switch__icon--sun { display: none; }
.theme-switch__track { position: relative; width: 2.25rem; height: 1.25rem; border-radius: 999px; background: var(--accent-bronze); transition: background-color .2s var(--ease); }
.theme-switch__knob { position: absolute; top: 2px; left: 2px; width: calc(1.25rem - 4px); height: calc(1.25rem - 4px); border-radius: 50%; background: var(--paper); box-shadow: 0 1px 2px rgba(0, 0, 0, .2); transition: transform .2s var(--ease); }
html[data-theme="dark"] .theme-switch__knob { transform: translateX(1rem); }
.theme-switch:hover .theme-switch__track { background: var(--accent-bronze-dark); }

/* ---------- Sitio público ---------- */
body.site { background: var(--paper); color: var(--graphite); }
.site-wrap { --gutter: clamp(1.25rem, 5.5vw, 5rem); width: 100%; max-width: 90rem; margin: 0 auto; padding: 0 var(--gutter); }
.site-narrow { max-width: 44rem; }
.preview-bar { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; justify-content: center; padding: var(--s-2) var(--s-4); background: var(--warn-soft); color: var(--warn-ink); font-size: var(--fs-sm); border-bottom: 1px solid var(--warn-line); }

.site-header { position: sticky; top: 0; z-index: 40; background: var(--paper); border-bottom: 1px solid var(--line-soft); }
.site-header__in { display: flex; align-items: center; gap: var(--s-5); min-height: 4.75rem; }
.site-header__brand { text-decoration: none; color: inherit; min-width: 0; }
.site-header__brand:hover { color: inherit; }
.site-nav { display: flex; gap: clamp(1.25rem, 3vw, 2.75rem); margin-left: auto; }
.site-nav a { display: inline-flex; align-items: center; min-height: var(--tap); color: var(--ink); text-decoration: none; font-size: .875rem; border-bottom: 1px solid transparent; }
.site-nav a:hover { color: var(--accent-bronze-dark); border-bottom-color: var(--rule); }
.site-header__actions { display: flex; align-items: center; gap: var(--s-4); margin-left: clamp(1rem, 3vw, 3rem); }
.site-header__sep { width: 1px; height: 1.75rem; background: var(--line); }
.site-access { display: inline-flex; align-items: center; gap: .55rem; min-height: var(--tap); color: var(--ink); text-decoration: none; font-size: .8125rem; white-space: nowrap; }
.site-access .icon { width: 1rem; height: 1rem; }
.site-access:hover { color: var(--accent-bronze-dark); }
.site-menu-btn { display: none; place-items: center; width: var(--tap); height: var(--tap); margin-right: -.5rem; background: none; border: 0; color: var(--ink); cursor: pointer; border-radius: var(--radius); }
.site-menu-btn .icon { width: 1.35rem; height: 1.35rem; }

/* Hoja de navegación móvil */
.site-sheet-scrim { position: fixed; inset: 0; z-index: 60; background: var(--backdrop); opacity: 0; visibility: hidden; transition: opacity .2s var(--ease), visibility .2s; }
.site-sheet-scrim.is-open { opacity: 1; visibility: visible; }
.site-sheet {
    position: fixed; z-index: 61; top: 0; right: 0; bottom: 0; width: min(22rem, 88vw);
    display: flex; flex-direction: column; background: var(--paper); box-shadow: var(--shadow-pop);
    padding: max(var(--s-4), env(safe-area-inset-top)) var(--s-5) max(var(--s-5), env(safe-area-inset-bottom));
    transform: translateX(100%); transition: transform .24s var(--ease);
}
.site-sheet.is-open { transform: none; }
.site-sheet__head { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); padding-bottom: var(--s-4); border-bottom: 1px solid var(--line); }
.site-sheet__nav { display: grid; padding: var(--s-4) 0; }
.site-sheet__nav a { display: flex; align-items: center; min-height: 3.25rem; font-family: var(--font-serif); font-weight: 300; font-size: 1.375rem; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--line-soft); }
.site-sheet__foot { margin-top: auto; display: grid; gap: var(--s-3); padding-top: var(--s-4); border-top: 1px solid var(--line); }
.site-sheet__theme { display: flex; align-items: center; justify-content: space-between; font-size: var(--fs-sm); color: var(--gray); }
body.site-drawer-open { overflow: hidden; }

/* Botones del sitio: rectos, mayúsculas espaciadas, como el mockup aprobado */
.btn-ebe {
    display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2);
    min-height: 3rem; padding: 0 1.6rem; border-radius: 2px; border: 1px solid transparent;
    font: 500 .6875rem/1 var(--font-ui); letter-spacing: .16em; text-transform: uppercase; text-decoration: none; white-space: nowrap;
    cursor: pointer; transition: background-color .18s var(--ease), border-color .18s var(--ease), color .18s var(--ease);
}
.btn-ebe--primary { background: var(--btn-primary); border-color: var(--btn-primary); color: var(--btn-primary-ink); }
.btn-ebe--primary:hover { background: var(--btn-primary-hover); border-color: var(--btn-primary-hover); color: var(--btn-primary-ink); }
.btn-ebe--outline { background: transparent; border-color: var(--line-strong); color: var(--ink); }
.btn-ebe--outline:hover { border-color: var(--ink); color: var(--ink); background: var(--hover); }
.btn-ebe--wide { width: 100%; white-space: normal; text-align: center; line-height: 1.4; padding-block: .75rem; }
.inquiry-form { grid-template-columns: minmax(0, 1fr); }
.btn-ebe[disabled] { opacity: .55; cursor: not-allowed; }
.btn-ebe.is-busy { position: relative; color: transparent !important; }
.btn-ebe.is-busy::after { content: ""; position: absolute; width: 1rem; height: 1rem; border-radius: 50%; border: 2px solid var(--btn-primary-ink); border-color: var(--btn-primary-ink) transparent; animation: spin .8s linear infinite; }

/* Portada: texto a la izquierda, fotografía a sangre a la derecha */
.hero { background: var(--paper); border-bottom: 1px solid var(--line-soft); }
.hero__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr); max-width: 90rem; margin: 0 auto; min-height: clamp(28rem, 64vh, 38rem); }
.hero__copy { align-self: center; padding: var(--s-7) clamp(1.5rem, 3vw, 3rem) var(--s-7) clamp(1.25rem, 5.5vw, 5rem); }
.hero__title { font-family: var(--font-serif); font-weight: 300; font-size: clamp(2.25rem, 3.6vw, 3.5rem); line-height: 1.1; letter-spacing: -.012em; color: var(--ink); margin: 0; }
.hero .rule { margin: 1.75rem 0; }
.hero__text { font-family: var(--font-serif); font-weight: 300; font-size: clamp(1.0625rem, 1.4vw, 1.25rem); line-height: 1.55; color: var(--graphite); max-width: 30rem; margin: 0 0 2.25rem; }
.hero__cta { display: flex; flex-wrap: wrap; gap: var(--s-4); }
.hero__direct { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); margin: var(--s-5) 0 0; font-size: var(--fs-sm); }
.hero__direct a { display: inline-flex; align-items: center; gap: var(--s-2); min-height: var(--tap); color: var(--gray); text-decoration: none; }
.hero__direct a:hover { color: var(--ink); }
.hero__media { position: relative; overflow: hidden; background: var(--surface-tint); }
.hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 78% 45%; }
.hero__img--night { display: none; }
html[data-theme="dark"] .hero__img--day { display: none; }
html[data-theme="dark"] .hero__img--night { display: block; }

/* Áreas: titular + dos tarjetas separadas por filetes verticales */
.areas { background: var(--paper); border-bottom: 1px solid var(--line-soft); }
.areas__in { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr) minmax(0, 1fr); padding-top: clamp(2.5rem, 5vw, 3.5rem); padding-bottom: clamp(2.5rem, 5vw, 3.5rem); }
.display-2 { font-family: var(--font-serif); font-weight: 300; font-size: clamp(1.75rem, 2.6vw, 2.25rem); line-height: 1.2; letter-spacing: -.005em; color: var(--ink); margin: 0; }
.areas__head .rule { margin-bottom: 0; }
.area { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 1.4rem; align-items: start; padding: 0 clamp(1.25rem, 3vw, 2.5rem); border-left: 1px solid var(--line); }
.area__badge { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; color: var(--badge-ink); }
.area__badge .icon { width: 1.35rem; height: 1.35rem; }
.area--juridica .area__badge { background: var(--badge-juridica); }
.area--notarial .area__badge { background: var(--badge-notarial); }
.area__title { font-family: var(--font-serif); font-weight: 400; font-size: 1.1875rem; line-height: 1.3; color: var(--ink); margin: .2rem 0 0; }
.area__text { font-size: .875rem; line-height: 1.6; color: var(--gray); margin: 0 0 var(--s-2); max-width: 22rem; }
.area__link { display: inline-flex; align-items: center; min-height: var(--tap); font-size: .6875rem; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-bronze-dark); text-decoration: none; border-bottom: 1px solid transparent; }
.area__link:hover { border-bottom-color: currentColor; color: var(--accent-bronze-dark); }

/* Bandas de contenido */
.band { padding: clamp(3rem, 7vw, 5.5rem) 0; border-bottom: 1px solid var(--line-soft); }
.band--about { background: var(--surface-alt); }
.band__cols { display: grid; grid-template-columns: minmax(14rem, 22rem) minmax(0, 1fr); gap: var(--s-5) clamp(2rem, 6vw, 6rem); align-items: start; }
.band__head .rule { margin-bottom: var(--s-5); }
.band__lead { font-family: var(--font-serif); font-weight: 300; font-size: clamp(1.1875rem, 1.8vw, 1.5rem); line-height: 1.6; color: var(--ink); max-width: 38rem; margin: 0; }
.band__note { color: var(--gray); max-width: 26rem; }
.about { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.about__media { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; background: var(--surface-tint); }
.about__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.band__head .display-2 + .rule { margin-bottom: var(--s-6); }
.band--method { background: var(--paper); }
.team-list .person { display: block; padding-top: var(--s-5); border-top: 1px solid var(--line); }
.person__mark { display: grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; border: 1px solid var(--accent-bronze); color: var(--accent-bronze-dark); font-family: var(--font-serif); font-size: 1.125rem; margin-bottom: var(--s-4); }
.person__name { font-family: var(--font-serif); font-weight: 400; font-size: var(--fs-xl); color: var(--ink); margin: 0 0 var(--s-1); }
.person__role { font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--accent-bronze-dark); margin: 0 0 var(--s-3); }
.person__bio { color: var(--graphite); font-size: var(--fs-sm); line-height: 1.65; }
.person__cred { color: var(--gray); font-size: var(--fs-xs); }
/* Secciones propias (Sitio web → Secciones propias) */
.block__in { display: grid; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.block--imagen_izq .block__in, .block--imagen_der .block__in { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.block--imagen_der .block__media { order: 2; }
.block--texto .block__in { grid-template-columns: minmax(0, 1fr); align-items: start; }
.block--texto .block__copy { display: grid; grid-template-columns: minmax(14rem, 22rem) minmax(0, 1fr); gap: var(--s-5) clamp(2rem, 6vw, 6rem); align-items: start; }
.block--texto .block__media--wide { aspect-ratio: 21 / 9; }
.block--destacado .block__in { justify-items: center; text-align: center; max-width: 52rem; }
.block--destacado .rule { margin-left: auto; margin-right: auto; }
.block--destacado .band__lead { margin: 0 auto; }
.block__media { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; background: var(--surface-tint); }
.block__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.block__cta { margin: var(--s-5) 0 0; }
.block--bg-suave { background: var(--surface-alt); }
.block--bg-oscuro { background: var(--carbon-bg, #292A27); --ink: #F7F3ED; --graphite: #EAE4DA; color: #EAE4DA; }
html[data-theme="dark"] .block--bg-oscuro { background: #141413; }
.band--contact { position: relative; background: var(--band-contact); border-bottom: 0; }
.band--contact .rule { background: var(--accent-bronze); }
.anchor { position: absolute; top: -5rem; }
.contact-card { background: var(--surface); border: 1px solid var(--line); border-radius: 2px; padding: clamp(1.25rem, 3vw, 2.25rem); box-shadow: var(--shadow-card); }
html[data-theme="dark"] .contact-card { background: var(--paper); }
.inquiry-form { max-width: none; }
.contact-dl { display: grid; grid-template-columns: 6rem 1fr; gap: var(--s-2) var(--s-3); margin: var(--s-5) 0 0; font-size: var(--fs-sm); }
.contact-dl dt { color: var(--gray); }
.contact-dl dd { margin: 0; overflow-wrap: anywhere; color: var(--ink); }
.contact-dl a { color: var(--ink); }

.service-list { margin: 0; padding-bottom: clamp(2rem, 4vw, 3rem); display: grid; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); gap: 0 var(--s-6); }
.service-list__item { padding: var(--s-4) 0; border-top: 1px solid var(--line); }
.service-list dt { font-family: var(--font-serif); font-size: var(--fs-lg); color: var(--ink); margin-bottom: var(--s-1); }
.service-list__area { font-family: var(--font-ui); font-size: var(--fs-xs); color: var(--gray); margin-left: var(--s-2); }
.service-list dd { margin: 0; color: var(--gray); font-size: var(--fs-sm); }
.service-list__who { display: block; margin-top: var(--s-1); }
.service-list__cta { display: inline-flex; margin-top: var(--s-2); font-size: var(--fs-sm); color: var(--accent-bronze-dark); }
.team-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-5); grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
.team-list li { display: flex; gap: var(--s-4); align-items: flex-start; }
.team-list__initials { display: grid; place-items: center; width: 3.25rem; height: 3.25rem; flex: none; border-radius: 50%; border: 1px solid var(--accent-bronze); color: var(--accent-bronze-dark); font-family: var(--font-serif); }
.team-list strong { display: block; font-family: var(--font-serif); font-weight: 400; font-size: var(--fs-lg); color: var(--ink); }
.team-list__role { display: block; font-size: var(--fs-sm); color: var(--gray); margin-bottom: var(--s-2); }
.team-list p { font-size: var(--fs-sm); margin-bottom: var(--s-2); }
.steps-list { list-style: none; counter-reset: paso; margin: 0; padding: 0; display: grid; gap: var(--s-5); grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); }
.steps-list li { counter-increment: paso; padding-top: var(--s-4); border-top: 1px solid var(--line); }
.steps-list li::before { content: counter(paso); display: block; font-family: var(--font-serif); font-weight: 300; font-size: var(--fs-xl); color: var(--accent-bronze); margin-bottom: var(--s-2); }
.steps-list strong { display: block; font-family: var(--font-serif); font-weight: 400; font-size: var(--fs-lg); color: var(--ink); margin-bottom: var(--s-1); }
.steps-list p { margin: 0; color: var(--gray); font-size: var(--fs-sm); }
.faq details { border-top: 1px solid var(--line); padding: var(--s-2) 0; }
.faq details:last-child { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; font-family: var(--font-serif); font-size: var(--fs-lg); color: var(--ink); min-height: var(--tap); display: flex; align-items: center; }
.faq p { margin: var(--s-2) 0; max-width: 62ch; color: var(--gray); }
.hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.site-footer { background: var(--paper); border-top: 1px solid var(--line); padding: var(--s-6) 0 calc(var(--s-6) + env(safe-area-inset-bottom)); font-size: var(--fs-sm); color: var(--gray); }
.site-footer__in { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-4) var(--s-6); }
.site-footer__nav { display: flex; flex-wrap: wrap; gap: 0 var(--s-5); margin-left: auto; }
.site-footer__nav a { display: inline-flex; align-items: center; min-height: var(--tap); color: var(--gray); text-decoration: none; }
.site-footer__nav a:hover { color: var(--ink); }
.site-footer__copy { flex-basis: 100%; margin: 0; font-size: var(--fs-xs); }
.list-item summary { cursor: pointer; min-height: var(--tap); display: flex; align-items: center; gap: var(--s-2); }
.list-item[open] summary { margin-bottom: var(--s-3); }

@media (max-width: 1080px) {
    .site-header__in { gap: var(--s-4); }
    .site-nav { gap: 1.25rem; }
    .site-header__actions { margin-left: var(--s-4); gap: var(--s-3); }
    .areas__in { grid-template-columns: 1fr 1fr; row-gap: var(--s-6); }
    .areas__head { grid-column: 1 / -1; }
    .areas__in .area:first-of-type { border-left: 0; padding-left: 0; }
}
@media (max-width: 900px) {
    .site-nav, .site-header__sep, .site-header__actions > .site-access { display: none; }
    .site-menu-btn { display: inline-grid; }
    .site-header__actions { margin-left: auto; gap: 0; }
    .site-header__actions > .theme-switch { width: var(--tap); justify-content: center; }
    .site-header__actions > .theme-switch .theme-switch__track { display: none; }
    .site-header__actions > .theme-switch .icon { width: 1.2rem; height: 1.2rem; }
    .site-header__in { min-height: 4rem; gap: var(--s-2); }
    .ebe-lockup { gap: .6rem; }
    .ebe-lockup .ebe-mono { --mono-h: 1.75rem; }
    .ebe-lockup__name { font-size: .6875rem; letter-spacing: .15em; }
    .ebe-lockup__tag { font-size: .4375rem; letter-spacing: .17em; }

    .hero__in { grid-template-columns: minmax(0, 1fr); min-height: 0; }
    .hero__copy { padding: 2.25rem clamp(1.25rem, 5vw, 2rem) 2.5rem; }
    .hero__title { font-size: clamp(2rem, 8.4vw, 2.75rem); }
    .hero .rule { margin: 1.25rem 0; }
    .hero__text { margin-bottom: 1.75rem; }
    .hero__cta { display: grid; gap: var(--s-3); }
    .hero__cta .btn-ebe { width: 100%; }
    .hero__media { aspect-ratio: 16 / 10; }

    .areas__in { grid-template-columns: minmax(0, 1fr); row-gap: 0; }
    .areas__head { padding-bottom: var(--s-5); }
    .area, .areas__in .area:first-of-type { border-left: 0; padding: var(--s-5) 0; border-top: 1px solid var(--line); gap: 1.1rem; }
    .area__badge { width: 3rem; height: 3rem; }
    .band__cols { grid-template-columns: minmax(0, 1fr); }
    .about { grid-template-columns: minmax(0, 1fr); }
    .block--imagen_izq .block__in, .block--imagen_der .block__in, .block--texto .block__in { grid-template-columns: minmax(0, 1fr); }
    .block--imagen_der .block__media { order: 0; }
    .block--texto .block__copy { grid-template-columns: minmax(0, 1fr); }
    .block--texto .block__media--wide { aspect-ratio: 16 / 10; }
    .about__media { aspect-ratio: 16 / 10; }
    .band__cols > *, .contact-card .field { min-width: 0; }
    .contact-card .form-grid { grid-template-columns: minmax(0, 1fr); }
    .contact-card select { text-overflow: ellipsis; }
    .site-footer__nav { margin-left: 0; }
    .contact-dl { grid-template-columns: 1fr; gap: 0; }
    .contact-dl dd { margin-bottom: var(--s-2); }
}
@media (max-width: 360px) {
    .ebe-lockup__tag { display: none; }
}

/* ---------- Acceso (login, recuperación) ---------- */
body.auth { min-height: 100vh; min-height: 100dvh; display: grid; grid-template-rows: auto 1fr; background: var(--paper); }
.auth__header { display: flex; align-items: center; justify-content: space-between; padding: max(var(--s-3), env(safe-area-inset-top)) clamp(1rem, 4vw, 2.5rem) 0; }
.auth__back-link { display: inline-flex; align-items: center; gap: var(--s-1); min-height: var(--tap); color: var(--gray); text-decoration: none; font-size: var(--fs-sm); }
.auth__back-link:hover { color: var(--ink); }
.auth__main { display: grid; place-content: center; padding: var(--s-5) var(--s-4) calc(var(--s-6) + env(safe-area-inset-bottom)); }
.auth__brand { display: grid; justify-items: center; gap: .9rem; text-align: center; margin-bottom: var(--s-6); color: var(--ink); }
.auth__brand .ebe-mono { --mono-h: 3.5rem; color: var(--accent-bronze); }
.auth__brand-name { display: block; font-family: var(--font-serif); font-weight: 400; font-size: 1rem; letter-spacing: .22em; text-transform: uppercase; }
.auth__brand-tag { display: block; margin-top: .4rem; font-size: .5625rem; letter-spacing: .24em; text-transform: uppercase; color: var(--gray); }
.auth__brand .rule { margin: .1rem auto 0; }
.auth__card {
    width: min(26rem, calc(100vw - 2rem)); background: var(--surface);
    border: 1px solid var(--line); border-radius: 2px; padding: clamp(1.5rem, 5vw, 2.5rem);
    box-shadow: var(--shadow-card);
}
.auth__title { font-family: var(--font-serif); font-weight: 300; font-size: var(--fs-2xl); }
.auth__card .btn--primary { min-height: 3rem; border-radius: 2px; background: var(--btn-primary); border-color: var(--btn-primary); color: var(--btn-primary-ink); font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; }
.auth__card .btn--primary:hover { background: var(--btn-primary-hover); border-color: var(--btn-primary-hover); }
.auth__alt { margin: var(--s-4) 0 0; font-size: var(--fs-sm); }
.auth__foot { text-align: center; font-size: var(--fs-sm); margin-top: var(--s-4); }
.auth__foot a { color: var(--gray); }

/* ---------- Páginas simples (instalador, sitio provisional, errores) ---------- */
.plain__main { min-height: 100vh; }
.provisional { padding-top: var(--s-7); }
.provisional h1 { font-size: var(--fs-3xl); margin-top: var(--s-4); }

/* ---------- Movimiento ---------- */
@keyframes spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

@media print {
    .sidebar, .topbar, .bottom-nav, .toasts, .filters, .form-actions { display: none !important; }
    .shell { display: block; }
    body { background: #fff; }
}

/* ---------- Respuestas de IA y fuentes citadas ---------- */
.badge--ai { background: var(--ai-soft); color: var(--ai-ink); border-color: var(--ai-line); }
.badge--source { background: var(--ochre-soft); color: var(--ochre); border-color: var(--accent-line); }
.ai-prose { line-height: 1.6; overflow-wrap: anywhere; }
.ai-prose > * + * { margin-top: var(--s-3); }
.ai-prose h3, .ai-prose h4, .ai-prose h5 { font-size: var(--fs-md); font-weight: 650; margin-top: var(--s-4); }
.ai-prose ul, .ai-prose ol { padding-left: 1.4rem; }
.ai-prose li + li { margin-top: var(--s-1); }
.ai-prose blockquote { border-left: 3px solid var(--line); padding-left: var(--s-3); color: var(--gray); }
.ai-prose code { font-size: .92em; background: var(--line-soft); padding: 0 .25em; border-radius: 3px; }
.cite { font-size: .82em; font-weight: 650; text-decoration: none; padding: 0 .15em; border-radius: 3px; background: var(--blue-soft); color: var(--blue); white-space: nowrap; }
a.cite:hover { text-decoration: underline; }
.cite--invalid { background: var(--bad-soft); color: var(--bad); text-decoration: line-through; }
.ai-msg--assistant .ai-msg__body { border-left: 3px solid var(--ai-line); padding-left: var(--s-4); }
.ai-sources { margin-top: var(--s-4); }
.ai-sources__title { font-size: var(--fs-sm); font-weight: 650; color: var(--gray); margin-bottom: var(--s-2); }
.ai-sources__list { display: grid; gap: var(--s-2); }
.source-card { border: 1px solid var(--accent-line); background: var(--accent-bronze-soft); border-radius: var(--radius-lg); padding: var(--s-3); }
.source-card__title { overflow-wrap: anywhere; }
.source-card__actions { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; margin-top: var(--s-2); }
.source-card__actions form { display: inline; }
.source-card__saved { display: inline-flex; gap: var(--s-1); align-items: center; font-size: var(--fs-sm); }
.ai-sent { margin-top: var(--s-3); font-size: var(--fs-sm); }
.ai-sent summary { cursor: pointer; color: var(--gray); }
.ai-sent li { margin-top: var(--s-2); }
.ai-sent__excerpt { display: block; color: var(--gray); font-family: var(--font-serif); }
.ai-layout { display: grid; gap: var(--s-4); grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); align-items: start; }
@media (max-width: 960px) { .ai-layout { grid-template-columns: minmax(0, 1fr); } }
.source-teaser { color: var(--gray); font-family: var(--font-serif); }

/* ---------- Lector jurídico ---------- */
.reader-page { max-width: 84rem; --reader-fs: 18px; }
.reader-head { margin-bottom: var(--s-4); }
.reader-head h1 { font-family: var(--font-serif); font-size: var(--fs-2xl); line-height: 1.25; overflow-wrap: anywhere; margin: var(--s-2) 0 var(--s-3); }
.reader-head__kind { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; font-size: var(--fs-sm); }
.reader-meta { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: var(--s-2) var(--s-4); font-size: var(--fs-sm); margin-bottom: var(--s-2); }
.reader-meta dt { color: var(--gray); font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: .03em; }
.reader-meta dd { margin: 0; overflow-wrap: anywhere; }
.reader-meta__wide { grid-column: 1 / -1; }
.reader-versions summary { cursor: pointer; font-size: var(--fs-sm); color: var(--blue); }
.reader-versions ul { font-size: var(--fs-sm); padding-left: 1.2rem; margin-top: var(--s-1); }

.reader-toolbar {
    position: sticky; top: 0; z-index: 15; display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center;
    background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: var(--s-2); box-shadow: var(--shadow);
}
.reader-toolbar__group { display: inline-flex; gap: 2px; }
.tool-btn {
    display: inline-flex; align-items: center; gap: var(--s-1); min-height: 2.5rem; padding: 0 var(--s-3);
    border: 1px solid transparent; border-radius: var(--radius); background: transparent; color: var(--graphite);
    font: inherit; font-size: var(--fs-sm); cursor: pointer; text-decoration: none; white-space: nowrap;
}
.tool-btn:hover { background: var(--line-soft); }
.tool-btn[aria-pressed="true"] { background: var(--blue-soft); border-color: var(--accent-line); }
.tool-btn:focus-visible { box-shadow: var(--focus); outline: none; }
.reader-search { display: inline-flex; align-items: center; gap: 2px; flex: 1 1 16rem; min-width: 0; }
.reader-search input { flex: 1; min-width: 6rem; min-height: 2.5rem; }
.reader-search__count { font-size: var(--fs-xs); white-space: nowrap; min-width: 4.5rem; }
.reader-hint { display: flex; gap: var(--s-2); align-items: center; font-size: var(--fs-sm); color: var(--gray); margin: var(--s-3) 0; }
.reader-hint.is-warn { color: var(--warn); font-weight: 600; }

.reader-layout { display: grid; grid-template-columns: minmax(0, 1fr) 22rem; gap: var(--s-5); align-items: start; }
.reader-doc { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: var(--s-6) clamp(var(--s-4), 5vw, var(--s-7)); box-shadow: var(--shadow); }
.reader-text { max-width: 44rem; margin: 0 auto; font-family: var(--font-serif); font-size: var(--reader-fs); line-height: 1.7; color: var(--graphite); }
.reader-text .rb { white-space: pre-line; overflow-wrap: anywhere; scroll-margin-top: 6rem; border-radius: 3px; }
.reader-text .rb + .rb { margin-top: .85em; }
.reader-text .rb--h { font-family: var(--font-ui); font-size: .82em; font-weight: 700; letter-spacing: .05em; color: var(--ink); margin-top: 2em; padding-top: .8em; border-top: 1px solid var(--line-soft); }
.reader-text .rb--art { font-family: var(--font-ui); font-size: .85em; font-weight: 700; color: var(--ochre); margin-top: 1.6em; }
.reader-text .rb--art + .rb { margin-top: .35em; }
.reader-text .rb--li { padding-left: 1.2em; text-indent: -1.2em; }
.reader-text ::selection { background: var(--selection); }
.reader-end { margin-top: var(--s-6); text-align: center; font-size: var(--fs-sm); }
.is-flash { animation: reader-flash 1.6s ease-out; }
@keyframes reader-flash { 0%, 30% { background: #FFF0B3; box-shadow: 0 0 0 4px #FFF0B3; } 100% { background: transparent; box-shadow: none; } }

/* Resaltados (texto de la fuente) frente a notas del usuario e IA (panel) */
mark.hl { color: inherit; padding: .05em 0; border-radius: 2px; cursor: pointer; }
.hl--amarillo { background: #FFF1A8; }
.hl--verde { background: #CFEFD3; }
.hl--azul { background: #CFE3F7; }
.hl--rosa { background: #F8D3E2; }
mark.hl--shared { box-shadow: inset 0 -2px 0 var(--line-strong); }
mark.hl--note.hl--end::after { content: "\270E"; font-family: var(--font-ui); font-size: .7em; vertical-align: super; margin-left: 1px; color: var(--ochre); }
::highlight(reader-search) { background: #FFD27A; }
::highlight(reader-search-current) { background: #F59E0B; color: #111; }

.reader-panel {
    position: sticky; top: 4.25rem; max-height: calc(100dvh - 5.5rem); overflow: auto;
    background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow);
}
.reader-panel__head { position: sticky; top: 0; z-index: 1; display: flex; align-items: flex-start; gap: var(--s-1); background: var(--surface); border-bottom: 1px solid var(--line); }
.reader-panel__close { display: none; }
.reader-tabs { display: flex; flex-wrap: wrap; flex: 1; }
.reader-tabs [role="tab"] { flex: 1 0 auto; min-height: 2.75rem; padding: 0 var(--s-3); background: none; border: 0; border-bottom: 3px solid transparent; font: inherit; font-size: var(--fs-sm); color: var(--gray); cursor: pointer; }
.reader-tabs [role="tab"][aria-selected="true"] { color: var(--ink); border-bottom-color: var(--blue); font-weight: 650; }
.reader-tabs [role="tab"]:focus-visible { box-shadow: inset 0 0 0 2px var(--blue); outline: none; }
.reader-tabpanel { padding: var(--s-4); }
.reader-subtitle { font-size: var(--fs-sm); font-weight: 650; margin: var(--s-4) 0 var(--s-1); }
.reader-panel-toggle { display: none; }

.ann-list { display: grid; gap: var(--s-3); }
.ann-item { border: 1px solid var(--line); border-left: 4px solid #E9D67A; border-radius: var(--radius); padding: var(--s-3); background: var(--note-soft); }
.ann-item--mark { border-left-color: var(--blue); background: var(--surface); }
.ann-item__head { display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-2); align-items: center; font-size: var(--fs-xs); }
.ann-item__note { margin-top: var(--s-2); white-space: pre-line; overflow-wrap: anywhere; }
.ann-item__colors { display: inline-flex; gap: 4px; align-items: center; }
.ann-item .row-actions { margin-top: var(--s-2); flex-wrap: wrap; }
.btn--danger-text { color: var(--bad); }
.chip { display: inline-block; padding: 0 .4em; border-radius: 3px; font-size: var(--fs-xs); color: var(--graphite); }
.chip--amarillo { background: #FFF1A8; } .chip--verde { background: #CFEFD3; } .chip--azul { background: #CFE3F7; } .chip--rosa { background: #F8D3E2; }
.passage-quote { font-family: var(--font-serif); border-left: 3px solid var(--line); padding-left: var(--s-3); margin: var(--s-2) 0; color: var(--graphite); white-space: pre-line; overflow-wrap: anywhere; }
.passage-preview { background: var(--paper); border: 1px dashed var(--line); border-radius: var(--radius); padding: var(--s-3); margin-bottom: var(--s-3); }
.passage-preview__label, .passage-preview__ref { font-size: var(--fs-xs); color: var(--gray); overflow-wrap: anywhere; }
.quick-actions { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-bottom: var(--s-3); }
.ai-answer { margin-top: var(--s-4); border: 1px solid var(--ai-line); background: var(--ai-soft); border-radius: var(--radius-lg); padding: var(--s-3); }
.ai-answer__label { font-size: var(--fs-xs); margin-bottom: var(--s-2); }
.ctx-items { display: grid; gap: var(--s-3); margin-top: var(--s-2); }
.ctx-item { border: 1px solid var(--line); border-radius: var(--radius); padding: var(--s-3); }
.ctx-item__ref { font-size: var(--fs-xs); color: var(--gray); overflow-wrap: anywhere; }
.ctx-item form { display: inline; }
.draft-body { font-family: var(--font-serif); font-size: var(--fs-md); line-height: 1.6; }

/* Muestras de color (botones) */
.swatch { width: 1.9rem; height: 1.9rem; border-radius: 50%; border: 2px solid var(--line-strong); cursor: pointer; padding: 0; }
.swatch--small { width: 1.35rem; height: 1.35rem; }
.swatch[aria-pressed="true"] { border-color: var(--ink); box-shadow: 0 0 0 2px #fff inset; }
.swatch--amarillo { background: #FFE45C; } .swatch--verde { background: #7FD08A; } .swatch--azul { background: #7DB6EC; } .swatch--rosa { background: #F09AB9; }
.swatch:focus-visible { box-shadow: var(--focus); outline: none; }

/* Barra contextual de selección */
.selbar {
    position: absolute; z-index: 60; display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-1);
    max-width: min(46rem, calc(100vw - 1rem)); padding: var(--s-2); background: var(--carbon-bg); color: #F7F3ED;
    border-radius: var(--radius-lg); box-shadow: var(--shadow-pop);
}
.selbar[hidden] { display: none; }
.selbar__colors { display: inline-flex; align-items: center; gap: 6px; padding-right: var(--s-2); margin-right: var(--s-1); border-right: 1px solid rgba(255, 255, 255, .25); }
.selbar__label { font-size: var(--fs-xs); opacity: .85; }
.selbar__btn { display: inline-flex; align-items: center; gap: var(--s-1); min-height: 2.5rem; padding: 0 var(--s-3); border: 0; border-radius: var(--radius); background: transparent; color: #fff; font: inherit; font-size: var(--fs-sm); cursor: pointer; }
.selbar__btn:hover { background: rgba(255, 255, 255, .12); }
.selbar__btn:focus-visible { box-shadow: 0 0 0 2px #fff; outline: none; }
.selbar--dock { position: fixed; left: .5rem !important; right: .5rem; top: auto !important; bottom: calc(var(--bottom-h, 0px) + env(safe-area-inset-bottom) + .5rem); max-width: none; justify-content: center; }

/* Lector ampliado: oculta el menú lateral y usa todo el ancho */
body.reader-wide .sidebar, body.reader-wide .topbar, body.reader-wide .bottom-nav { display: none !important; }
body.reader-wide .shell { grid-template-columns: minmax(0, 1fr) !important; }
body.reader-wide .reader-page { max-width: none; }

@media (max-width: 1000px) {
    .reader-layout { grid-template-columns: minmax(0, 1fr); }
    .reader-doc { padding: var(--s-4); border-left: 0; border-right: 0; border-radius: 0; margin: 0 calc(-1 * var(--s-4)); }
    .reader-text { max-width: none; }
    /* Panel como hoja inferior con pestañas */
    .reader-panel {
        position: fixed; z-index: 55; left: 0; right: 0; bottom: 0; top: auto; max-height: 75dvh;
        border-radius: var(--radius-lg) var(--radius-lg) 0 0; transform: translateY(105%); visibility: hidden;
        transition: transform .2s ease, visibility .2s; box-shadow: var(--shadow-pop); padding-bottom: env(safe-area-inset-bottom);
    }
    .reader-panel.is-open { transform: none; visibility: visible; }
    .reader-panel__close { display: inline-flex; margin: var(--s-1); }
    .reader-panel-toggle { display: inline-flex; position: fixed; z-index: 40; right: var(--s-3); bottom: calc(var(--bottom-h, 0px) + env(safe-area-inset-bottom) + var(--s-3)); box-shadow: var(--shadow-pop); background: var(--surface); }
    .reader-toolbar { overflow-x: auto; flex-wrap: nowrap; border-radius: 0; margin: 0 calc(-1 * var(--s-4)); }
    .reader-search { flex: 0 0 13rem; }
    .reader-toolbar .tool-btn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
    .reader-toolbar .tool-btn { padding: 0 var(--s-2); min-width: 2.75rem; justify-content: center; }
}
@media print {
    .reader-toolbar, .reader-panel, .reader-hint, .selbar, .reader-panel-toggle { display: none !important; }
    .reader-layout { display: block; }
}
.source-card--uncited { border-style: dashed; background: var(--surface); }
.ann-list, .ctx-items, .ai-sources__list { list-style: none; padding: 0; margin: 0; }
.reader-search { flex: 0 1 15rem; }
.reader-panel { top: calc(var(--toolbar-h, 3.5rem) + .75rem); max-height: calc(100dvh - var(--toolbar-h, 3.5rem) - 1.5rem); }
.reader-text .rb { scroll-margin-top: calc(var(--toolbar-h, 3.5rem) + 1.5rem); }
@media (max-width: 1000px) { .reader-panel { top: auto; max-height: 75dvh; } .reader-search { flex: 0 0 13rem; } }
@media (max-width: 960px) { .reader-toolbar { top: calc(var(--topbar-h) + env(safe-area-inset-top)); } .reader-text .rb { scroll-margin-top: calc(var(--topbar-h) + var(--toolbar-h, 3.5rem) + 1rem); } }

/* Panel: editor de apariencia del sitio */
.color-grid { display: grid; gap: var(--s-4); grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.color-input { display: flex; align-items: center; gap: var(--s-3); }
.color-input input[type=color] { width: 3.25rem; min-height: 2.75rem; padding: .2rem; cursor: pointer; flex: none; }
.media-field__preview { display: block; max-width: min(100%, 22rem); max-height: 10rem; object-fit: contain; border: 1px solid var(--line); border-radius: var(--radius); background: repeating-conic-gradient(var(--line-soft) 0% 25%, var(--surface) 0% 50%) 50% / 16px 16px; margin-bottom: var(--s-2); }