@media screen {
 .care-stat-metric{color:var(--text-primary)}
 .care-stat-metric>span,.care-stat-metric>small,.care-stat-empty{color:var(--text-secondary)}
 button.care-stat-metric:hover{border-color:var(--edge-control-hover)}
 .care-stat-track{background:var(--surface-raised)}
 .care-stat-fill{background:var(--stat-first)}
 .care-stat-fill.follow{background:var(--stat-follow)}
 .row.care-appointment{border-left-color:var(--edge-panel)}
 .row.care-appointment.initial{border-left-color:var(--stat-first)}
 .row.care-appointment.follow_up{border-left-color:var(--stat-follow)}
 .care-visit-tag{background:var(--surface-raised);color:var(--text-secondary);border-color:var(--edge-panel)}
 .care-visit-tag.initial{background:var(--status-info-fill);color:var(--status-info-text);border-color:var(--status-info-line)}
 .care-visit-tag.follow_up{background:var(--status-positive-fill);color:var(--status-positive-text);border-color:var(--status-positive-line)}
}
/* Sistema cromático: equivalencias ópticas entre claro y oscuro.
   Componentes compartidos: scripts/ui.tailwind.css → ui.css; geometría específica: care.css e inventory.css.
   Ver docs/sistema-colores.md y AGENTS.md. */
:root {
  --brand-navy: #213A57;
  --brand-teal: #0B6477;
  --brand-ocean: #14919B;
  --brand-cyan: #0AD1C8;
  --brand-mint: #45DFB1;
  --brand-leaf: #80ED99;
  --stat-first: var(--brand-ocean);
  --stat-follow: #16795F;
  --on-accent: var(--brand-navy);
  --action-primary: var(--brand-mint);
  --action-primary-hover: var(--brand-leaf);
  --action-sheen: linear-gradient(180deg,rgba(255,255,255,.16),transparent 65%);
  --glass-filter: blur(16px) saturate(120%);
  --mask-ink: #000;
  --cell-fill: radial-gradient(ellipse at 43% 41%,rgba(128,237,153,.42) 0 5%,rgba(69,223,177,.16) 6% 13%,transparent 14%),radial-gradient(ellipse at 50% 50%,rgba(10,209,200,.12),rgba(20,145,155,.045) 52%,transparent 72%);
  --cell-border: rgba(10,209,200,.24);
  --cell-inner-border: rgba(69,223,177,.15);
  --cell-shadow: inset 0 0 0 7px rgba(69,223,177,.025),inset 0 0 30px rgba(10,209,200,.11),0 0 34px rgba(69,223,177,.08);
  --molecule-shadow: 0 0 0 5px rgba(10,209,200,.07),0 0 17px rgba(10,209,200,.24);
  --molecule-glow: drop-shadow(0 0 7px rgba(10,209,200,.18));
  --particle-fill: radial-gradient(circle,rgba(20,145,155,.24) 0 1px,transparent 1.4px);
  --green: var(--brand-mint);
  --green-strong: var(--brand-leaf);
  --teal: var(--brand-teal);
  --accent: var(--brand-cyan);
  --yellow: var(--brand-leaf);
  --coral: var(--brand-ocean);
  --ink: var(--text-primary);
  --muted: var(--text-secondary);
  --bg: var(--canvas);
  --panel: var(--surface-base);
  --line: var(--border-subtle);
  --shadow: var(--shadow-panel);
  --soft: var(--surface-raised);
  --red: var(--text-primary);
  --warn: var(--text-link);
}

/* Landing: roles de acción y atmósfera. La nueva escena se limita a la página pública. */
:root {
  --landing-action: var(--brand-teal);
  --landing-action-hover: var(--brand-navy);
  --landing-on-action: #FFFFFF;
  --landing-action-edge: var(--brand-teal);
  --landing-canvas: #E0F0EA;
  --landing-cell-image: url('/assets/landing/cell-light.webp');
  --landing-cell-opacity: .44;
  --landing-reading-fill: rgba(224,240,234,.78);
  --landing-location-reading-fill: rgba(224,240,234,.78);
  --landing-reading-secondary: #17465B;
  --landing-reading-link: #09465A;
  --landing-service-fill: rgba(255,255,255,.96);
  --landing-glass-edge: rgba(255,255,255,.76);
  --landing-glass-shadow: 0 18px 55px rgba(33,58,87,.1),inset 0 1px 0 rgba(255,255,255,.8);
  --landing-button-fill: linear-gradient(125deg,#0B6477,#087E82);
  --landing-button-icon-fill: rgba(255,255,255,.14);
  --landing-button-shadow: 0 8px 24px rgba(11,100,119,.19),inset 0 1px 0 rgba(255,255,255,.18);
  --landing-button-hover-shadow: 0 12px 30px rgba(11,100,119,.28),inset 0 1px 0 rgba(255,255,255,.22);
  --landing-install-fill: linear-gradient(130deg,rgba(238,248,243,.84),rgba(200,237,224,.84));
  --landing-install-icon-fill: rgba(11,100,119,.09);
  --landing-hero-fill: linear-gradient(115deg,#102F43 20%,#12414D 58%,#12636A);
  --landing-section-fill: linear-gradient(140deg,#CEE8DF,#C2E3DE 70%);
  --landing-depth-fill: linear-gradient(130deg,#14394B,#124651 65%,#15555A);
  --landing-depth-panel: linear-gradient(140deg,rgba(28,79,88,.92),rgba(17,56,72,.94));
  --landing-depth-text: #EFF9F6;
  --landing-depth-muted: #BCDCD9;
  --landing-depth-link: #80EDC3;
  --landing-depth-edge: #3B737B;
  --landing-depth-divider: rgba(160,225,211,.25);
  --landing-glow: radial-gradient(ellipse,rgba(10,209,200,.22),transparent 68%);
  --landing-art-fill: radial-gradient(ellipse at 35% 24%,#55D2B4,#ACDED0 48%,#8BC9C4);
  --landing-depth-shadow: 0 24px 70px rgba(4,31,43,.24);
  --landing-location-fill: rgba(16,47,67,.95);
  --landing-still-opacity: 1;
  --scene-background: #12434E;
  --scene-fog: #27777B;
  --scene-membrane: #A5DED7;
  --scene-nucleus: #213A57;
  --scene-rim: #45DFB1;
  --scene-particle: #80EDC3;
}
@media screen {
  :root[data-theme=dark] {
    --landing-action: var(--action-primary);
    --landing-action-hover: var(--action-primary-hover);
    --landing-on-action: var(--brand-navy);
    --landing-action-edge: var(--action-primary);
    --landing-canvas: #1A2E45;
    --landing-cell-image: url('/assets/landing/cell-dark.webp');
    --landing-cell-opacity: .3;
    --landing-reading-fill: rgba(26,46,69,.82);
    --landing-location-reading-fill: rgba(26,46,69,.82);
    --landing-reading-secondary: #D2E5E8;
    --landing-reading-link: #91D8DB;
    --landing-glass-edge: rgba(158,223,220,.25);
    --landing-glass-shadow: 0 18px 55px rgba(4,20,34,.2),inset 0 1px 0 rgba(207,249,238,.17);
    --landing-button-fill: linear-gradient(125deg,#45DFB1,#73E5B9);
    --landing-button-icon-fill: rgba(33,58,87,.1);
    --landing-button-shadow: 0 8px 24px rgba(4,20,34,.25),inset 0 1px 0 rgba(255,255,255,.2);
    --landing-button-hover-shadow: 0 12px 30px rgba(4,20,34,.36),inset 0 1px 0 rgba(255,255,255,.25);
    --landing-install-fill: linear-gradient(130deg,rgba(27,61,78,.85),rgba(19,47,65,.85));
    --landing-install-icon-fill: rgba(69,223,177,.1);
    --landing-hero-fill: linear-gradient(115deg,#102436 20%,#112F40 58%,#124751);
    --landing-section-fill: linear-gradient(140deg,#163547,#1B4250 70%);
    --landing-depth-fill: linear-gradient(130deg,#112A3C,#123745 65%,#164A51);
    --landing-depth-panel: linear-gradient(140deg,rgba(25,63,77,.94),rgba(16,42,60,.96));
    --landing-depth-text: #E5F2F3;
    --landing-depth-muted: #B7CFD4;
    --landing-depth-link: #79DAB8;
    --landing-depth-edge: #365D70;
    --landing-depth-divider: rgba(160,207,216,.22);
    --landing-glow: radial-gradient(ellipse,rgba(10,209,200,.16),transparent 68%);
    --landing-art-fill: radial-gradient(ellipse at 35% 24%,#215B63,#173D50 48%,#1A334A);
    --landing-depth-shadow: 0 24px 70px rgba(4,20,34,.34);
    --landing-location-fill: rgba(20,43,64,.95);
    --landing-still-opacity: 1;
    --scene-background: #112F3E;
    --scene-fog: #23606B;
    --scene-membrane: #A9DAD8;
    --scene-nucleus: #213A57;
    --scene-rim: #45DFB1;
    --scene-particle: #81CDCE;
  }
}
/* Public immersive bands share roles across both themes, without changing admin. */
@media screen {
  .landing { background: var(--scene-background); }
  .landing .landing-depth {
    --landing-reading-fill: rgba(20,58,74,.84);
    --landing-reading-secondary: var(--landing-depth-muted);
    --landing-reading-link: var(--landing-depth-link);
    --landing-glass-edge: rgba(158,223,220,.25);
    --landing-glass-shadow: 0 18px 55px rgba(4,20,34,.2),inset 0 1px 0 rgba(207,249,238,.17);
    --landing-cell-image: url('/assets/landing/cell-dark.webp');
    --landing-cell-opacity: .45;
    --landing-button-fill: linear-gradient(125deg,#45DFB1,#73E5B9);
    --landing-button-icon-fill: rgba(33,58,87,.1);
    --text-primary: var(--landing-depth-text);
    --text-secondary: var(--landing-depth-muted);
    --text-eyebrow: var(--landing-depth-link);
    --text-link: var(--landing-depth-link);
    --text-link-hover: var(--landing-depth-text);
    --edge-panel: var(--landing-depth-edge);
    --edge-divider: var(--landing-depth-divider);
    --edge-control-hover: var(--landing-depth-link);
    --edge-focus: var(--landing-depth-link);
    --panel-fill: var(--landing-depth-panel);
    --shadow-panel: var(--landing-depth-shadow);
    --landing-action: var(--brand-mint);
    --landing-action-hover: var(--brand-leaf);
    --landing-on-action: var(--brand-navy);
    --landing-action-edge: var(--brand-mint);
    color: var(--text-primary);
  }
  .landing .location-copy { --landing-reading-fill: var(--landing-location-reading-fill); }
  .landing .site-footer { --landing-canvas: var(--brand-navy); }
  /* Remove source colors before tinting the public map; no overlay intercepts input. */
  .landing .map-viewport iframe { filter: grayscale(1) sepia(.25) hue-rotate(125deg) saturate(1.15); }
  .landing .faq-section.landing-depth {
    --surface-hover: var(--landing-depth-fill);
    --landing-install-icon-fill: var(--landing-depth-divider);
  }
  .landing .reading-surface,.landing .service-card,.landing .map-card,.landing .location-art,.landing .install-card,.landing .subscribe-card {
    --text-secondary: var(--landing-reading-secondary);
    --text-link: var(--landing-reading-link);
    --text-eyebrow: var(--landing-reading-link);
  }
  :root[data-theme=dark] .landing .landing-depth { --landing-reading-fill: rgba(18,45,62,.84); }
  /* Public service cards stay white against the continuous dark cell scene. */
  .landing .service-card {
    --landing-reading-fill: var(--landing-service-fill);
    --landing-reading-secondary: var(--brand-navy);
    --landing-reading-link: var(--brand-teal);
    --landing-glass-edge: var(--surface-base);
    --text-primary: var(--brand-navy);
    --edge-panel: var(--border-subtle);
    color: var(--text-primary);
  }
}
:root .care-assessment-summary{background:var(--panel-fill);border-color:var(--edge-panel)}
:root .care-insight,:root .care-insight-pain,:root .care-insight-status{border-color:var(--edge-divider)}
:root .care-insight h4,:root .care-insight-status{color:var(--text-secondary)}
:root .care-insight h4 i{color:var(--text-link)}
:root .care-insight ul,:root .care-insight-pain{color:var(--text-primary)}
:root { color-scheme: light; }
:root, :root[data-theme=light] {
  --canvas: #F7FCFB;
  --surface-base: #FFFFFF;
  --surface-raised: #F0F5F9;
  --surface-hover: #E4EEF5;
  --surface-input: #FFFFFF;
  --panel-fill: linear-gradient(145deg,rgba(255,255,255,.82),rgba(247,252,251,.62));
  --hero-fill: linear-gradient(135deg,rgba(255,255,255,.74),rgba(69,223,177,.19) 54%,rgba(10,209,200,.17));
  --topbar-fill: rgba(247,252,251,.90);
  --modal-fill: linear-gradient(145deg,rgba(255,255,255,.94),rgba(240,249,248,.90));
  --text-primary: var(--brand-navy);
  --text-secondary: var(--brand-teal);
  --text-heading: var(--brand-ocean);
  --text-eyebrow: var(--brand-teal);
  --text-placeholder: #576F7E;
  --text-subheading: var(--brand-teal);
  --text-link: var(--brand-teal);
  --text-link-hover: var(--brand-navy);
  --border-subtle: #CADBE3;
  --border-control: #778B9F;
  /* Bordes compartidos: profundidad sin cambiar fondos ni sombras. */
  --edge-panel: #C7DFE2;
  --edge-panel-top: #D1E8E8;
  --edge-panel-bottom: #BBD5DB;
  --edge-feature: #AFCFD6;
  --edge-feature-top: #BBDCDD;
  --edge-feature-bottom: #A3C7D1;
  --edge-inset: #CDDFE3;
  --edge-divider: rgba(11,100,119,.17);
  --edge-button: #A5C2CB;
  --edge-control: #718D99;
  --edge-control-hover: #557D8D;
  --edge-modal-control: #688592;
  --edge-modal-control-hover: var(--edge-control-hover);
  --edge-interactive: var(--action-primary);
  --edge-interactive-info: var(--profile-fill);
  --edge-focus: var(--brand-teal);
  --focus-ring: var(--brand-teal);
  --nav-fill: linear-gradient(165deg,rgba(33,58,87,.98),rgba(11,92,112,.98) 72%,rgba(11,92,112,.98));
  --nav-accent-text: var(--brand-leaf);
  --nav-text: #EDF4FB;
  --nav-muted: #BDCEDF;
  --nav-hover: rgba(33,58,87,.58);
  --nav-selected-fill: var(--brand-mint);
  --nav-selected-text: var(--brand-navy);
  --nav-selected-edge: var(--brand-mint);
  --nav-badge-fill: var(--brand-leaf);
  --nav-badge-text: var(--brand-navy);
  --nav-border: rgba(237,244,251,.22);
  --nav-shell-edge: var(--brand-mint);
  --notice-accent-edge: var(--brand-mint);
  --disabled-fill: #E5EFEE;
  --disabled-text: #59717C;
  /* Font Awesome Free 7.3.1 chevron-down; same colors as text roles. */
  --select-indicator: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20448%20512%22%3E%3Cpath%20fill%3D%22%230B6477%22%20d%3D%22M201.4%20406.6c12.5%2012.5%2032.8%2012.5%2045.3%200l192-192c12.5-12.5%2012.5-32.8%200-45.3s-32.8-12.5-45.3%200L224%20338.7%2054.6%20169.4c-12.5-12.5-32.8-12.5-45.3%200s-12.5%2032.8%200%2045.3l192%20192z%22%2F%3E%3C%2Fsvg%3E");
  --select-indicator-disabled: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20448%20512%22%3E%3Cpath%20fill%3D%22%2359717C%22%20d%3D%22M201.4%20406.6c12.5%2012.5%2032.8%2012.5%2045.3%200l192-192c12.5-12.5%2012.5-32.8%200-45.3s-32.8-12.5-45.3%200L224%20338.7%2054.6%20169.4c-12.5-12.5-32.8-12.5-45.3%200s-12.5%2032.8%200%2045.3l192%20192z%22%2F%3E%3C%2Fsvg%3E");
  --disabled-edge: #B8CBCD;
  --tab-selected-fill: var(--brand-teal);
  --tab-selected-text: #FFFFFF;
  --tab-selected-edge: var(--brand-teal);
  --profile-fill: var(--brand-cyan);
  --profile-text: var(--brand-navy);
  --step-selected-fill: var(--surface-base);
  --step-index-fill: var(--brand-cyan);
  --step-index-text: var(--brand-navy);
  --step-complete-text: var(--brand-teal);
  --status-positive-fill: #E4F7EF;
  --status-positive-text: var(--brand-teal);
  --status-positive-line: #97CABA;
  --status-info-fill: #E8F6F7;
  --status-info-text: var(--brand-teal);
  --status-info-line: #8FBDC5;
  --overlay-fill: rgba(33,58,87,.55);
  --shadow-panel: inset 0 1px 0 rgba(255,255,255,.9),0 18px 46px rgba(33,58,87,.075);
  --shadow-action: 0 8px 18px rgba(69,223,177,.27);
  --shadow-action-hover: 0 11px 24px rgba(69,223,177,.31);
  --shadow-nav: 4px 0 20px rgba(33,58,87,.12);
  --shadow-topbar: 0 1px 0 rgba(20,145,155,.08);
  --shadow-footer: 0 -8px 20px rgba(33,58,87,.06);
  --login-fill: var(--nav-fill);
  --login-heading: var(--brand-leaf);
  --login-text: #EDF4FB;
  --ambient-fill: linear-gradient(135deg,rgba(128,237,153,.055),transparent 36%,rgba(10,209,200,.055));
  --ambient-scene-opacity: .28;
  --ambient-still-opacity: .22;
  --ambient-membrane: var(--brand-teal);
  --ambient-nucleus: var(--brand-ocean);
  --ambient-rim: var(--brand-mint);
  --ambient-organelle: var(--brand-leaf);
  --ambient-cell-image: url('/acceso/assets/ambient-cell.webp?v=ambient-subtle-1');
  --ambient-reading-mask: radial-gradient(ellipse at 50% 45%,transparent 20%,rgba(0,0,0,.08) 42%,rgba(0,0,0,.65) 75%,#000 100%);
  --cell-opacity: 1;
  --cell-small-opacity: .65;
  --particle-mobile-opacity: .2;
  --molecule-mobile-opacity: .28;
  --molecule-opacity: .42;
  --particle-opacity: .34;
  --browser-chrome: var(--brand-navy);
}

@media screen {
  :root[data-theme=dark] {
    color-scheme: dark;
    /* Profundidad azul: lienzo → cristal → controles; sin teñir las células. */
    --canvas: #1A2E45;
    --surface-base: #0F2033;
    --surface-raised: #192F45;
    --surface-hover: #23415A;
    --surface-input: #0C1D30;
    --panel-fill: linear-gradient(145deg,rgba(20,40,62,.98),rgba(14,30,49,.98));
    --stat-fill: linear-gradient(150deg,rgba(25,47,69,.98),rgba(15,32,51,.98));
    --workflow-fill: linear-gradient(150deg,rgba(22,43,64,.98),rgba(15,32,51,.98));
    --hero-fill: linear-gradient(135deg,#142B42,#1B354D 54%,#23405A);
    --topbar-fill: linear-gradient(90deg,rgba(15,32,51,.96),rgba(20,40,62,.94));
    --modal-fill: linear-gradient(145deg,#192F45,#0F2033);
    --glass-filter: blur(18px) saturate(110%);
    --text-primary: #E5EEF5;
    --text-secondary: #ADC0D0;
    --text-heading: #81CDCE;
    --text-subheading: #C2DCDD;
    --text-eyebrow: #83BDC5;
    --text-placeholder: #94ACBF;
    --text-link: #78CCD0;
    --stat-first: var(--status-info-text);
    --stat-follow: var(--status-positive-text);
    --text-link-hover: #A4E2D2;
    --action-primary: #59CFB0;
    --action-primary-hover: #84DDA8;
    --border-subtle: #2D4762;
    --border-feature: #41627F;
    --border-control: #6686A2;
    --border-button: #567692;
    --edge-panel: #344E65;
    --edge-panel-top: #405E76;
    --edge-panel-bottom: #2A4057;
    --edge-feature: #42617A;
    --edge-feature-top: #52748A;
    --edge-feature-bottom: #304961;
    --edge-inset: #355069;
    --edge-divider: #2B435C;
    --edge-button: #55758F;
    --edge-control: var(--border-control);
    --edge-control-hover: #87A8BF;
    --edge-modal-control: var(--edge-control);
    --edge-modal-control-hover: var(--edge-control-hover);
    --edge-focus: #65C6CB;
    --focus-ring: var(--edge-focus);
    --edge-sheen: linear-gradient(90deg,transparent,var(--profile-fill),transparent);
    /* Las mismas señales de selección y perfiles de la versión clara. */
    --nav-fill: linear-gradient(165deg,#0D1C2D,#122A40);
    --nav-accent-text: #9DCDC6;
    --nav-text: var(--text-primary);
    --nav-muted: #B6CBDD;
    --nav-hover: var(--surface-raised);
    --nav-selected-fill: var(--action-primary);
    --nav-selected-text: var(--brand-navy);
    --nav-selected-edge: var(--action-primary);
    --nav-badge-fill: var(--action-primary-hover);
    --nav-badge-text: var(--brand-navy);
    --nav-border: #304D67;
    /* Contorno estructural del menú: mismo azul que las tarjetas, sin mezcla alfa. */
    --nav-shell-edge: var(--edge-panel);
    --nav-accent-edge: var(--nav-shell-edge);
    /* Misma banda de 5 px que en claro, con intensidad nocturna contenida. */
    --notice-accent-edge: #3B827D;
    --critical-accent-edge: #47899B;
    --tab-selected-fill: var(--brand-teal);
    --tab-selected-text: #FFFFFF;
    --tab-selected-edge: var(--edge-focus);
    --profile-fill: #45BEC2;
    --profile-text: var(--brand-navy);
    --avatar-fill: linear-gradient(145deg,var(--action-primary),var(--action-primary-hover));
    --step-selected-fill: var(--surface-raised);
    --step-index-fill: var(--action-primary);
    --step-index-text: var(--brand-navy);
    --step-complete-text: var(--action-primary);
    --progress-fill: linear-gradient(90deg,var(--brand-ocean),var(--profile-fill),var(--action-primary-hover));
    /* Estado en etiquetas, nunca como una gran superficie verde. */
    --status-positive-fill: #1A353D;
    --status-positive-text: #9ADBC4;
    --status-positive-line: #36585E;
    --status-info-fill: #1A3247;
    --status-info-text: #8ACED6;
    --status-info-line: #3C5D72;
    --disabled-fill: #213549;
    --disabled-text: #9AAFBF;
    --select-indicator: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20448%20512%22%3E%3Cpath%20fill%3D%22%23ADC0D0%22%20d%3D%22M201.4%20406.6c12.5%2012.5%2032.8%2012.5%2045.3%200l192-192c12.5-12.5%2012.5-32.8%200-45.3s-32.8-12.5-45.3%200L224%20338.7%2054.6%20169.4c-12.5-12.5-32.8-12.5-45.3%200s-12.5%2032.8%200%2045.3l192%20192z%22%2F%3E%3C%2Fsvg%3E");
    --select-indicator-disabled: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20448%20512%22%3E%3Cpath%20fill%3D%22%239AAFBF%22%20d%3D%22M201.4%20406.6c12.5%2012.5%2032.8%2012.5%2045.3%200l192-192c12.5-12.5%2012.5-32.8%200-45.3s-32.8-12.5-45.3%200L224%20338.7%2054.6%20169.4c-12.5-12.5-32.8-12.5-45.3%200s-12.5%2032.8%200%2045.3l192%20192z%22%2F%3E%3C%2Fsvg%3E");
    --disabled-edge: #40576A;
    --overlay-fill: rgba(4,11,21,.76);
    --shadow-panel: inset 0 1px 0 rgba(234,242,250,.055),0 16px 40px rgba(4,11,21,.20);
    --shadow-hero: inset 0 1px 0 rgba(234,242,250,.08),0 22px 50px rgba(4,11,21,.24);
    --shadow-modal: inset 0 1px 0 rgba(234,242,250,.08),0 28px 85px rgba(4,11,21,.5);
    --shadow-control: inset 0 1px 0 rgba(234,242,250,.065),0 4px 10px rgba(4,11,21,.12);
    --shadow-action: 0 8px 18px rgba(89,207,176,.14);
    --shadow-action-hover: 0 11px 24px rgba(89,207,176,.22);
    --shadow-selected: 0 8px 20px rgba(4,11,21,.24);
    --shadow-profile: 0 5px 14px rgba(69,190,194,.14);
    --shadow-focus: 0 0 0 3px rgba(101,198,203,.12);
    --shadow-nav: 10px 0 34px rgba(4,11,21,.14);
    --shadow-topbar: inset 0 -1px 0 rgba(234,242,250,.025),0 8px 28px rgba(4,11,21,.10);
    --shadow-footer: 0 -10px 24px rgba(4,11,21,.18);
    --login-fill: linear-gradient(155deg,#0F2033,#19324A 66%,#23405A);
    --login-heading: var(--action-primary-hover);
    --login-text: var(--text-secondary);
    --ambient-fill: transparent;
    --ambient-scene-opacity: .24;
    --ambient-still-opacity: .2;
    --ambient-membrane: var(--brand-cyan);
    --ambient-nucleus: var(--brand-teal);
    --ambient-rim: var(--brand-mint);
    --ambient-organelle: var(--brand-leaf);
    --ambient-cell-image: url('/acceso/assets/ambient-cell.webp?v=ambient-subtle-1');
    --ambient-reading-mask: radial-gradient(ellipse at 50% 45%,transparent 20%,rgba(0,0,0,.08) 42%,rgba(0,0,0,.65) 75%,#000 100%);
    --cell-opacity: .42;
    --cell-small-opacity: .42;
    --particle-mobile-opacity: .2;
    --molecule-mobile-opacity: .27;
    --molecule-opacity: .27;
    --particle-opacity: .2;
    --browser-chrome: var(--canvas);
    /* Adaptadores de la interfaz existente: solo se activan en oscuro. */
    --bg: var(--canvas);
    --panel: var(--surface-base);
    --ink: var(--text-primary);
    --muted: var(--text-secondary);
    --line: var(--border-subtle);
    --control-line: var(--border-control);
    --green: var(--action-primary);
    --green-strong: var(--action-primary-hover);
    --teal: var(--text-link);
    --soft: var(--status-positive-fill);
    --accent: var(--profile-fill);
    --yellow: var(--action-primary-hover);
    --coral: var(--brand-ocean);
    --warn: var(--text-link);
    --red: var(--text-primary);
    --shadow: var(--shadow-panel);
  }
}
@media screen {
  #template-form details a { color: var(--text-link); }
  #template-form details a:hover,
  #template-form details a:focus-visible { color: var(--text-link-hover); }
}

/* Papel: identidad fija, legible también al imprimir sin fondos. */
:root{--paper-ink:#213A57;--paper-accent:#0B6477;--paper-muted:#43586A;--paper-rule:#8CABB2;--paper-fill:#FFFFFF;--paper-tint:#EDF6F6}
.care-template-paper.care-patient-paper{--text-primary:var(--paper-ink);--text-heading:var(--paper-ink);--text-secondary:var(--paper-muted);--text-subheading:var(--paper-accent);--surface-input:var(--paper-fill);--surface-base:var(--paper-fill);color:var(--paper-ink);background:var(--paper-fill)}
.care-patient-paper :is(h1,h2,strong,dd){color:var(--paper-ink)}
.care-paper-brand,.care-form-title>div>p,.care-patient-paper h2{color:var(--paper-accent)}
.care-patient-paper :is(small,dt),.care-form-footer-print{color:var(--paper-muted)}
.care-form-header,.care-form-footer-print,.care-handline>div,.care-autograph-line,.care-paper-choices b{border-color:var(--paper-rule)}
.care-form-patient{background:var(--paper-tint)}
.care-patient-paper .care-paper-layout :is(tr,td){background:transparent!important}
@media print {
  .care-template-paper { --text-primary: #000000; --text-secondary: #213A57; --text-heading: #000000; --text-subheading: #000000; --surface-base: #FFFFFF; }
  :root { --canvas: #FFFFFF; --surface-base: #FFFFFF; --panel-fill: none; --hero-fill: none; --text-primary: #000000; --text-secondary: #213A57; --text-heading: #000000; --text-subheading: #000000; --shadow-panel: none; }
}
@media screen {
 :root .inv-grid-card input,:root .inv-grid-card select{background:var(--surface-input);color:var(--text-primary);border-color:var(--edge-control)}
 :root .inv-grid-card input::placeholder{color:var(--text-placeholder);opacity:1}
 :root .inv-grid-card input:hover,:root .inv-grid-card select:hover{border-color:var(--edge-control-hover)}
 :root .inv-grid-card input:focus-visible,:root .inv-grid-card select:focus-visible{border-color:var(--edge-focus);outline:2px solid var(--edge-focus);outline-offset:2px;box-shadow:var(--shadow-focus)}
 :root .inv-grid-card .inv-row-dirty{background:var(--surface-raised);box-shadow:inset 3px 0 var(--edge-focus)}
 :root .inv-grid-check{color:var(--text-secondary)}
 :root .inv-grid-check input{accent-color:var(--text-link)}
 :root .inv-grid-savebar{background:var(--modal-fill);color:var(--text-primary);border-color:var(--edge-panel);box-shadow:var(--shadow-panel)}
 :root .inv-grid-options>summary{color:var(--text-link)}
 .care-item-summary{background:var(--panel-fill);border-color:var(--edge-panel);color:var(--text-primary)}
 .care-item-summary span{color:var(--text-secondary)}
 .care-editor-footer{background:var(--modal-fill)}
 .care-confirm-dialog{color:var(--text-primary);background:var(--modal-fill);border-color:var(--edge-feature);box-shadow:var(--shadow-modal)}
 .care-confirm-dialog::backdrop{background:var(--overlay-fill);backdrop-filter:blur(8px)}
}
/* Tailwind fields reuse the stronger modal border role on the denser glass. */
@media screen {
  .admin-ui :is(.modal,dialog) { --ui-control-edge:var(--edge-modal-control); }
}
/* Marca: símbolo original y jerarquía serena con los roles compartidos. */
@media screen {
 .admin-brand-symbol{background:var(--text-link)}
 .brand.admin-brand{color:var(--text-primary)}
 :root .brand.admin-brand small{color:var(--text-secondary)}
 .sidebar .brand.admin-brand,.login-art .brand.admin-brand{color:var(--nav-text)}
 .sidebar .admin-brand-symbol,.login-art .admin-brand-symbol{background:var(--nav-accent-text)}
 :root .sidebar .brand.admin-brand small,:root .login-art .brand.admin-brand small{color:var(--nav-text)}
 .sidebar-section-label{color:var(--nav-text)}
 .topbar-signature{color:var(--text-secondary)}
 :root .topbar .profile-mark{background:var(--panel-fill);color:var(--text-link);box-shadow:inset 0 0 0 1px var(--edge-panel)}
 .brand.admin-brand:focus-visible{outline-color:var(--edge-focus)}
 .login .login-form{background:transparent}
 .login-form form{background:var(--panel-fill);border-color:var(--edge-feature);box-shadow:var(--shadow-hero)}
 .content .pagehead h1{color:var(--text-primary)}
 .content .home-focus h2{color:var(--text-subheading)}
 .brand-loading{color:var(--text-secondary)}
}

@media screen{
 :root .profile-access{color:var(--text-primary);background:transparent}
 :root .profile-access:hover{background:var(--surface-hover)}
 :root .profile-access:focus-visible{outline:2px solid var(--edge-focus);outline-offset:3px}
 :root .user-identity h2{color:var(--text-primary)}
 :root .user-professional summary{color:var(--text-primary)}
}

@media screen{.sidebar-copyright{color:var(--nav-text)}}
/* Patient disclosures share the existing panel, text and focus roles in both themes. */
@media screen{
 .care-patient-details>summary{color:var(--text-primary)}
 .care-patient-details>summary:hover h2{color:var(--text-primary)}
 .care-patient-details>summary:focus-visible{outline:3px solid var(--edge-focus);outline-offset:5px}
 .care-patient-details[open]>summary{border-bottom:1px solid var(--edge-divider);padding-bottom:16px}
}
/* Six-step care pathway: shared roles, identical geometry in light and dark. */
@media screen{
 :root .admin-ui .pw-steps>.tab{border-color:var(--edge-panel);background:var(--panel-fill);color:var(--text-primary)}
 :root .admin-ui .pw-steps>.tab small{color:var(--text-secondary)}
 :root .admin-ui .pw-steps>.tab.active{border-color:var(--edge-focus);background:var(--surface-raised)}
 .pw-files,.pw-activity,.pw-week-row{border-color:var(--edge-panel)}
 .pw-cost-row,.pw-quote,.pw-quote-lines>div,.pw-day-list-row{border-color:var(--edge-divider)}
 :root .admin-ui .pw-day{background:var(--panel-fill);border-color:var(--edge-panel);color:var(--text-primary)}
 :root .admin-ui .pw-day.has-entry{background:var(--surface-raised);border-color:var(--edge-focus)}
 :root .admin-ui .pw-day:hover:not(:disabled){border-color:var(--edge-control-hover)}
 :root .admin-ui .pw-day:disabled{background:var(--panel-fill);color:var(--text-secondary);border-color:var(--edge-divider);box-shadow:none}
 .pw-weekday,.pw-total,.pw-steps .pw-step-number{color:var(--text-primary)}
}

@media screen {.pw-modal>.pw-pagination,.pw-modal #care-form>.care-form-footer{background:var(--panel-fill)}.pw-modal #pw-content>.card,.pw-modal .pw-form{background:transparent;box-shadow:none}}

@media screen {:root .admin-ui .pw-modal .btn:disabled{color:var(--text-secondary)}}

@media screen {:root .admin-ui .pw-modal .details{background:var(--surface-base);color:var(--text-primary)}:root .admin-ui .pw-modal .details dd,:root .admin-ui .pw-modal .details .rich-content{color:var(--text-primary)}}