@import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&family=Source+Serif+4:opsz,wght@8..60,400;8..60,600;8..60,700&display=swap');

/* Exploración aislada: solo actúa si la página carga data-identidad-preview. */
html[data-identidad-preview] {
  color-scheme: light;
  --brand-navy: #0A375B;
  --brand-teal: #317E86;
  --brand-cream: #FAF7F1;
  --brand-sun: #CD6942;
  --primary: #0A375B;
  --pmid: #1F6070;
  --plight: #317E86;
  --ppale: #E5F2F2;
  --accent: #317E86;
  --accent-light: #E5F2F2;
  --green: #277C69;
  --gbg: #E6F4EF;
  --yellow: #9C6500;
  --ybg: #FFF4D7;
  --red: #B64431;
  --rbg: #FBEAE6;
  --blue: #1E5F89;
  --bbg: #E9F2F8;
  --bg: #FAF7F1;
  --text: #183044;
  --tl: #506675;
  --tll: #667B88;
  --border: #D5E0E1;
  --control-border: #718A96;
  --card: #FFFFFF;
  --card-hover: #F0F7F6;
  --bar-bg: #EDF3F2;
  --nav-surface-start: #0A375B;
  --nav-surface-end: #114B69;
  --nav-foreground: #FFFFFF;
  --nav-muted: rgba(255,255,255,.82);
  --nav-subtle: rgba(255,255,255,.68);
  --nav-border: rgba(255,255,255,.16);
  --nav-control-border: rgba(255,255,255,.28);
  --nav-control-bg: rgba(255,255,255,.06);
  --nav-hover-bg: rgba(255,255,255,.13);
  --nav-hover-border: rgba(255,255,255,.58);
  --font-ui: 'Atkinson Hyperlegible', 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-brand: 'Source Serif 4', Georgia, serif;
  --font-accessible: 'Atkinson Hyperlegible', 'Lexend', sans-serif;
  --shadow-sm: 0 2px 8px rgba(10,55,91,.09);
  --shadow-md: 0 9px 24px rgba(10,55,91,.12);
  --shadow-lg: 0 18px 44px rgba(10,55,91,.16);
  --focus-ring: #CD6942;
  --focus-halo: 0 0 0 4px rgba(205,105,66,.26);
  --access-bg: radial-gradient(circle at 10% 12%, rgba(49,126,134,.18), transparent 27%), radial-gradient(circle at 88% 12%, rgba(205,105,66,.15), transparent 22%), linear-gradient(145deg, #FAF7F1, #F0F6F4);
  --access-heading: #0A375B;
  --access-sub: #506675;
  --access-choice: #183044;
  --access-label: #183044;
  --access-help: #506675;
  --access-meta: #667B88;
  --access-muted: #506675;
  --access-card-bg: rgba(255,255,255,.92);
  --access-card-border: #D5E0E1;
  --access-card-hover-bg: #E5F2F2;
  --access-card-hover-border: #317E86;
  --access-card-shadow: 0 7px 20px rgba(10,55,91,.08);
  --access-chip-bg: #FFFFFF;
  --access-chip-border: #D5E0E1;
  --access-icon-bg: #EDF3F2;
  --access-icon-border: #D5E0E1;
  --access-selection-bg: #E5F2F2;
  --access-selection-shadow: 0 0 0 1px rgba(49,126,134,.22), 0 12px 28px rgba(10,55,91,.14);
  --access-input-bg: #FFFFFF;
  --access-input-border: #718A96;
  --access-input-placeholder: #667B88;
  --access-input-text: #183044;
}

html[data-identidad-preview][data-theme="dark"] {
  color-scheme: dark;
  --bg: #082B44;
  --text: #F8F5EE;
  --tl: #C2D6D8;
  --tll: #9EBABD;
  --card: #103B56;
  --card-hover: #174D67;
  --bar-bg: #0D344D;
  --border: #386377;
  --control-border: #6E9AA6;
  --primary: #72C7C7;
  --pmid: #4DA5A8;
  --plight: #99DCDC;
  --accent: #72C7C7;
  --accent-light: rgba(114,199,199,.15);
  --on-primary: #082B44;
  --access-bg: radial-gradient(circle at 10% 12%, rgba(114,199,199,.18), transparent 27%), radial-gradient(circle at 88% 12%, rgba(205,105,66,.18), transparent 22%), linear-gradient(145deg, #082B44, #0A375B);
  --access-heading: #F8F5EE;
  --access-sub: #C2D6D8;
  --access-choice: #F8F5EE;
  --access-label: #F8F5EE;
  --access-help: #C2D6D8;
  --access-meta: #9EBABD;
  --access-muted: #C2D6D8;
  --access-card-bg: rgba(16,59,86,.94);
  --access-card-border: #386377;
  --access-card-hover-bg: #174D67;
  --access-card-hover-border: #72C7C7;
  --access-chip-bg: #103B56;
  --access-chip-border: #386377;
  --access-icon-bg: #0D344D;
  --access-icon-border: #386377;
  --access-selection-bg: rgba(114,199,199,.16);
  --access-input-bg: #103B56;
  --access-input-border: #6E9AA6;
  --access-input-placeholder: #9EBABD;
  --access-input-text: #F8F5EE;
}

html[data-identidad-preview] .logo-name,
html[data-identidad-preview] .bc .cur,
html[data-identidad-preview] .card h2,
html[data-identidad-preview] .pi h2,
html[data-identidad-preview] .gcn {
  font-family: var(--font-brand);
  letter-spacing: -.025em;
}

html[data-identidad-preview] .topnav {
  background: linear-gradient(112deg, var(--nav-surface-start), var(--nav-surface-end));
  box-shadow: 0 2px 12px rgba(10,55,91,.18);
}

/* Navegación: las decisiones frecuentes se nombran en el plano, sin menús efímeros ni emojis. */
html[data-identidad-preview] .identity-language-label {
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:32px;
  padding:0 10px;
  border:1px solid rgba(158,215,215,.48);
  border-radius:999px;
  color:#FFFFFF;
  font-size:12px;
  font-weight:750;
  letter-spacing:.04em;
}
html[data-identidad-preview] .identity-language-label span { color:#B9E5E3; font-weight:500; letter-spacing:0; }
html[data-identidad-preview] .identity-session {
  display:flex;
  align-items:center;
  gap:8px;
  padding-left:8px;
  color:#FFFFFF;
}
html[data-identidad-preview] .identity-session .prof-id { display:flex; align-items:baseline; gap:7px; }
html[data-identidad-preview] .identity-session .prof-name { color:#FFFFFF; font-size:12px; font-weight:750; }
html[data-identidad-preview] .identity-session .nbadge { min-height:auto; padding:2px 6px; border-color:rgba(158,215,215,.42); background:transparent; color:#CBE9E7; font-size:10px; }
html[data-identidad-preview] .identity-session .nav-av { border-color:#9ED7D7; background:#E5F2F2; color:#0A375B; }
html[data-identidad-preview] .identity-session .prof-online { position:static; display:block; flex:0 0 auto; margin-left:-12px; }
html[data-identidad-preview] .identity-signout {
  min-height:36px;
  padding:6px 9px;
  border:1px solid rgba(158,215,215,.52);
  border-radius:8px;
  background:transparent;
  color:#FFFFFF;
  font:700 12px/1 'Atkinson Hyperlegible',sans-serif;
  cursor:pointer;
}
html[data-identidad-preview] .identity-signout:hover,
html[data-identidad-preview] .identity-signout:focus-visible { border-color:#FFFFFF; background:rgba(255,255,255,.12); outline:2px solid #9ED7D7; outline-offset:2px; }
html[data-identidad-preview] .ctx-chip { gap:6px; }
html[data-identidad-preview] .ctx-chip .ci { display:inline-flex; align-items:center; justify-content:center; line-height:1; }
html[data-identidad-preview] .ctx-chip .ci .ui-icon { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* Atlas gouache: accesos de primer nivel y navegación de módulos; controles universales, SVG plano. */
html[data-identidad-preview] .topnav .identity-nav-medallion {
  width:24px;
  height:24px;
  flex:0 0 24px;
  object-fit:cover;
  border-radius:50%;
}
html[data-identidad-preview] .identity-inline-medallion {
  width:24px;
  height:24px;
  flex:0 0 24px;
  object-fit:cover;
  border-radius:50%;
  vertical-align:middle;
}
html[data-identidad-preview] .identity-session .nav-av:has(.identity-profile-medallion) {
  padding:0;
  overflow:hidden;
  border:0!important;
  background:transparent!important;
}
html[data-identidad-preview] .identity-profile-medallion {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border-radius:50%;
}
html[data-identidad-preview] .maestro-quick-action .identity-gouache-icon {
  width:44px;
  height:44px;
  flex:0 0 44px;
  object-fit:cover;
  border-radius:50%;
  vertical-align:middle;
}
html[data-identidad-preview] .maestro-quick-action .sl { display:inline-flex; align-items:center; gap:9px; }
@media (max-width:640px) {
  html[data-identidad-preview] .maestro-quick-action .identity-gouache-icon { width:40px; height:40px; flex-basis:40px; }
}

/* Perfiles: las tarjetas de entrada usan los medallones de categoría de la guía. */
html[data-identidad-preview] .role-card .identity-role-gouache {
  width:70px;
  height:70px;
  margin:0 0 10px;
  object-fit:cover;
  border:0;
  border-radius:50%;
}
html[data-identidad-preview] .role-card.selected .identity-role-gouache { filter:drop-shadow(0 5px 7px rgba(10,55,91,.18)); }

html[data-identidad-preview] .topnav .logo-name > span { color: #9ED7D7; }
html[data-identidad-preview] .card,
html[data-identidad-preview] .stat,
html[data-identidad-preview] .gc,
html[data-identidad-preview] .obj { border-radius: 16px; }
html[data-identidad-preview] .card { box-shadow: 0 2px 10px rgba(10,55,91,.045); }
html[data-identidad-preview] .gc:hover,
html[data-identidad-preview] .stat-action:hover,
html[data-identidad-preview] .stat-action:focus-visible { border-color: var(--plight); box-shadow: var(--shadow-md); }

/* Planeación: conserva el wizard intacto y traduce sus estados a los nuevos roles. */
html[data-identidad-preview] #v8-planeacion {
  --bg: #FAF7F1;
  --card: #FFFFFF;
  --card-hover: #F0F7F6;
  --bar-bg: #EDF3F2;
  --border: #D5E0E1;
  --ppale: #E5F2F2;
  --primary: #0A375B;
  --pmid: #1F6070;
  --accent: #317E86;
  --accent-light: #E5F2F2;
  --text: #183044;
  --tl: #506675;
  --tll: #667B88;
  --green: #277C69;
  --gbg: #E6F4EF;
  --red: #B64431;
  --rbg: #FBEAE6;
  --yellow: #9C6500;
  --ybg: #FFF4D7;
  --blue: #1E5F89;
  --bbg: #E9F2F8;
}
html[data-identidad-preview][data-theme="dark"] #v8-planeacion {
  --bg: #082B44;
  --card: #103B56;
  --card-hover: #174D67;
  --bar-bg: #0D344D;
  --border: #386377;
  --ppale: rgba(114,199,199,.15);
  --primary: #72C7C7;
  --pmid: #4DA5A8;
  --accent: #72C7C7;
  --accent-light: rgba(114,199,199,.15);
  --text: #F8F5EE;
  --tl: #C2D6D8;
  --tll: #9EBABD;
  --green: #79C9AB;
  --gbg: rgba(121,201,171,.15);
  --red: #F09A86;
  --rbg: rgba(240,154,134,.15);
  --yellow: #F2C66C;
  --ybg: rgba(242,198,108,.16);
  --blue: #8DC9ED;
  --bbg: rgba(141,201,237,.15);
}
html[data-identidad-preview] #v8-planeacion .pw-step.act {
  border-color: var(--brand-navy);
  background: var(--brand-navy);
  color: #FFFFFF;
}
html[data-identidad-preview] #v8-planeacion .pw-step.act b { color: var(--brand-navy); }
html[data-identidad-preview] #v8-planeacion .pw-step.done { border-color: var(--brand-teal); color: #1F6070; }
html[data-identidad-preview] #v8-planeacion .pw-step.done b { background: var(--brand-teal); }
html[data-identidad-preview] #v8-planeacion .pw-btn.pri,
html[data-identidad-preview] #v8-planeacion .pw-mini-pri { background: var(--brand-navy); border-color: var(--brand-navy); }
html[data-identidad-preview] #v8-planeacion .pw-btn.pri:hover:not(:disabled),
html[data-identidad-preview] #v8-planeacion .pw-mini-pri:hover { background: var(--brand-teal); border-color: var(--brand-teal); }
html[data-identidad-preview] #v8-planeacion .pw-bar-fill { background: var(--brand-teal); }
html[data-identidad-preview] #v8-planeacion .pw-warn,
html[data-identidad-preview] .ai-review-note { border-color: rgba(205,105,66,.45); background: #FFF1EA; }
html[data-identidad-preview][data-theme="dark"] #v8-planeacion .pw-warn,
html[data-identidad-preview][data-theme="dark"] .ai-review-note { background: rgba(205,105,66,.14); color: var(--text); }

/* IA: cada estado combina etiqueta, borde e icono; el color no carga solo el significado. */
html[data-identidad-preview] .ai-status-bar { border-left:4px solid var(--brand-teal); background:#E5F2F2; color:#0A375B; }
html[data-identidad-preview] .ai-status-bar[data-state="running"] { background:#E5F2F2; color:#0A375B; border-left-color:#317E86; }
html[data-identidad-preview] .ai-status-bar[data-state="review"] { background:#E6F4EF; color:#1C5E50; border-left-color:#277C69; }
html[data-identidad-preview] .ai-status-bar[data-state="error"] { background:#FBEAE6; color:#8F3627; border-left-color:#B64431; }
html[data-identidad-preview] .ai-origin-badge { background:#E5F2F2; color:#0A375B; border:1px solid #8CC5C8; }
html[data-identidad-preview][data-theme="dark"] .ai-status-bar[data-state="running"] { background:rgba(114,199,199,.15); color:#F8F5EE; border-left-color:#72C7C7; }
html[data-identidad-preview][data-theme="dark"] .ai-status-bar[data-state="review"] { background:rgba(121,201,171,.15); color:#D8F1E8; border-left-color:#79C9AB; }
html[data-identidad-preview][data-theme="dark"] .ai-status-bar[data-state="error"] { background:rgba(240,154,134,.15); color:#FFE2DC; border-left-color:#F09A86; }

.identity-preview-notice {
  position: fixed;
  z-index: 1000;
  right: 18px;
  bottom: 18px;
  display: flex;
  align-items: center;
  gap: 5px;
  max-width: min(calc(100vw - 36px), 440px);
  padding: 9px 12px;
  border: 1px solid rgba(10,55,91,.18);
  border-radius: 999px;
  background: rgba(250,247,241,.96);
  box-shadow: 0 8px 22px rgba(10,55,91,.18);
  color: #183044;
  font: 700 12px/1.25 'Atkinson Hyperlegible', sans-serif;
  backdrop-filter: blur(12px);
}
.identity-preview-notice span { color: #506675; font-weight: 400; }
.identity-preview-guide-trigger { min-height:44px; margin:-10px 0 -10px 3px; padding:6px 8px; border:0; background:transparent; color:#0A375B; font:inherit; font-weight:700; text-decoration:underline; text-decoration-thickness:1.5px; text-underline-offset:2px; cursor:pointer; }
.identity-preview-notice a { display:inline-flex; align-items:center; min-height:44px; margin:-10px -3px -10px 4px; padding:6px 5px; color:#0A375B; text-decoration-thickness:1.5px; text-underline-offset:2px; }
.identity-preview-notice a:hover { color: #CD6942; }
html[data-identidad-preview][data-theme="dark"] .identity-preview-notice { background: rgba(16,59,86,.96); border-color: #386377; color: #F8F5EE; }
html[data-identidad-preview][data-theme="dark"] .identity-preview-notice span { color: #C2D6D8; }
html[data-identidad-preview][data-theme="dark"] .identity-preview-guide-trigger { color: #9ED7D7; }
html[data-identidad-preview][data-theme="dark"] .identity-preview-notice a { color: #9ED7D7; }

.identity-preview-guide { width:min(620px,calc(100vw - 32px)); margin:auto; padding:0; border:1px solid #D5E0E1; border-radius:18px; background:#FAF7F1; color:#183044; box-shadow:0 24px 64px rgba(10,55,91,.26); font:16px/1.55 'Atkinson Hyperlegible',sans-serif; }
.identity-preview-guide::backdrop { background:rgba(10,55,91,.48); backdrop-filter:blur(3px); }
.identity-preview-guide-head { display:flex; justify-content:space-between; gap:20px; padding:24px 26px 16px; border-bottom:1px solid #D5E0E1; }
.identity-preview-guide-head p { margin:0 0 4px; color:#317E86; font-size:11px; font-weight:700; letter-spacing:.08em; }
.identity-preview-guide-head h2 { margin:0; color:#0A375B; font:700 26px/1.1 'Source Serif 4',Georgia,serif; }
.identity-preview-guide-head button { width:44px; height:44px; border:1px solid #D5E0E1; border-radius:50%; background:#fff; color:#0A375B; font-size:24px; cursor:pointer; }
.identity-preview-guide > p,.identity-preview-guide ol,.identity-preview-guide-note { margin:18px 26px; }
.identity-preview-guide ol { padding-left:24px; }
.identity-preview-guide li { margin:10px 0; }
.identity-preview-guide-note { padding:12px 14px; border-left:4px solid #317E86; border-radius:0 10px 10px 0; background:#E5F2F2; }
.identity-preview-guide-actions { display:flex; justify-content:flex-end; align-items:center; gap:12px; padding:16px 26px 24px; }
.identity-preview-guide-actions a,.identity-preview-guide-actions button { min-height:44px; display:inline-flex; align-items:center; padding:8px 13px; border-radius:9px; font:700 14px/1.2 'Atkinson Hyperlegible',sans-serif; }
.identity-preview-guide-actions a { color:#0A375B; }
.identity-preview-guide-actions button { border:1px solid #0A375B; background:#0A375B; color:#fff; cursor:pointer; }
html[data-identidad-preview][data-theme="dark"] .identity-preview-guide { border-color:#386377; background:#103B56; color:#F8F5EE; }
html[data-identidad-preview][data-theme="dark"] .identity-preview-guide-head { border-color:#386377; }
html[data-identidad-preview][data-theme="dark"] .identity-preview-guide-head h2 { color:#F8F5EE; }
html[data-identidad-preview][data-theme="dark"] .identity-preview-guide-head button { border-color:#386377; background:#0D344D; color:#F8F5EE; }
html[data-identidad-preview][data-theme="dark"] .identity-preview-guide-note { background:rgba(114,199,199,.15); }
html[data-identidad-preview][data-theme="dark"] .identity-preview-guide-actions a { color:#9ED7D7; }
html[data-identidad-preview][data-theme="dark"] .identity-preview-guide-actions button { border-color:#72C7C7; background:#72C7C7; color:#082B44; }

@media (max-width: 640px) {
  html[data-identidad-preview] .identity-language-label,
  html[data-identidad-preview] .identity-session .prof-id,
  html[data-identidad-preview] .identity-session .prof-online,
  html[data-identidad-preview] .identity-signout { display:none; }
  html[data-identidad-preview] .identity-session { padding-left:0; }
  .identity-preview-notice { left: 12px; right: 12px; bottom: 82px; justify-content: center; border-radius: 12px; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  html[data-identidad-preview] *, html[data-identidad-preview] *::before, html[data-identidad-preview] *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}


html[data-identidad-preview] #pg-maestro-mat .identity-material-medallion { width:34px; height:34px; display:block; object-fit:cover; border-radius:50%; }
