/* ============ TOKENS ============
Los colores, la tipografía, las formas y las sombras los da la hoja de VARIABLES
compartida de la casa, y el menú, las tarjetas y los botones la de COMPONENTES
(assets/dashboard-kit/ del repo, publicadas en labs.ohwow.es/dashboard-kit/). El
index.html las carga ANTES que a este archivo.
Los bloques que ahora da el sistema los recorta _scripts/build-public.py al copiar el
CSS del canónico: aquí solo quedan los tres nombres de color propios de esta pieza. */
:root{ --cream:var(--bg); --blush:var(--surface); --white:var(--surface); }
/* ============ RESET / BASE ============ */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);font-size:var(--fs-body);line-height:var(--lh-normal);color:var(--text);
background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
transition:background var(--mov-lento),color var(--mov-lento)}
a{color:inherit;text-decoration:none}
button{font-family:inherit;color:inherit;cursor:pointer;border:none;background:none}
h1,h2,h3,h4{font-family:var(--display);line-height:var(--lh-titulo);font-weight:var(--w-medio);letter-spacing:var(--ls-medio)}
::selection{background:var(--lime);color:var(--on-accent)}
input,select{font-family:inherit;color:inherit}
/* Todo lo clickable con cursor pointer */
button,a,label,summary,[role="button"],[onclick],[data-view],[data-goto],[data-doc],[data-fase],[data-map-area],[data-prompt-toggle],[data-toggle],.clickable,.card.clickable,.nav-item,.nav-head,.nav-sub a,.map-node,.atom-leg,.stat.clickable,.chip.clickable{cursor:pointer}
/* Scrollbars minimalistas */
*{scrollbar-width:thin;scrollbar-color:var(--rule) transparent}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--rule);border-radius:var(--r-pill);border:3px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:var(--text-soft);background-clip:content-box}
::-webkit-scrollbar-corner{background:transparent}
code,.mono{font-family:var(--mono)}
/* ============ HELPERS ============ */
.hl{background:var(--lime);color:var(--on-accent);border-radius:.28em;padding:.02em .2em;
box-decoration-break:clone;-webkit-box-decoration-break:clone}
.tag{display:inline-flex;align-items:center;gap:.4em;border:var(--hairline);border-radius:var(--r-pill);
padding:.22em .8em;font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:var(--ls-rotulo);
font-weight:var(--w-medio);white-space:nowrap}
.tag--fill{background:var(--lime);color:var(--on-accent);border-color:var(--lime)}
.tag--pend{background:var(--ink);color:var(--surface);border-color:var(--ink)}
.tag--soft{border:var(--hair-soft);color:var(--text-dim);text-transform:none;letter-spacing:0}
.muted{color:var(--text-dim)}
.pad{padding:var(--sp-3) var(--sp-1)}
/* ============ LAYOUT ============ */
#app{display:grid;grid-template-columns:auto 1fr;min-height:100vh}
#sidebar{position:sticky;top:0;height:100vh;display:flex;flex-direction:row;background:var(--surface);
border-right:var(--hair-soft);z-index:var(--capa-menu)}
#side-rail{width:var(--sidebar-w);flex:none;height:100%;overflow-y:auto;overflow-x:hidden;
padding:var(--sp-17) var(--sp-13) var(--sp-15);display:flex;flex-direction:column;gap:4px;transition:width var(--mov-lento) var(--ease),padding var(--mov-lento) var(--ease)}
#side-sub{width:0;flex:none;height:100%;overflow:hidden;border-left:var(--hair-soft);background:var(--bg);opacity:var(--op-nada);
transition:width var(--mov-lento) var(--ease),opacity var(--mov-medio) ease}
html[data-panel] #side-sub{width:248px;opacity:var(--op-total);overflow-y:auto;overflow-x:hidden}
#side-sub .sub-inner{padding:var(--sp-17) var(--sp-11) var(--sp-15);width:248px}
.sub-title{font-size:var(--fs-xs);font-weight:var(--w-max);letter-spacing:var(--ls-rotulo-ancho);text-transform:uppercase;color:var(--text-dim);padding:var(--sp-3) var(--sp-11) var(--sp-11)}
#side-sub .sub-inner>a[data-view]{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:var(--sp-8) var(--sp-11);border-radius:var(--r-in);font-size:var(--fs-md);font-weight:var(--w-medio);color:var(--text);transition:background var(--mov-rapido),color var(--mov-rapido);margin-bottom:var(--sp-1)}
#side-sub .sub-inner>a[data-view]:hover{background:var(--surface-alt)}
#side-sub .sub-inner>a[data-view].active{background:var(--ink);color:var(--surface);font-weight:var(--w-fuerte)}
#side-sub .sub-inner>a[data-view] .nav-ic{width:18px;height:18px}
#shell{display:flex;flex-direction:column;min-height:100vh;min-width:0}
#topbar{position:sticky;top:0;z-index:var(--capa-pegado);background:color-mix(in srgb,var(--bg) 84%,transparent);
backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:var(--hair-soft);
padding:var(--sp-10) var(--sp-16b);display:flex;align-items:center;gap:12px;flex-wrap:wrap}
main{flex:1;padding:var(--sp-20) var(--sp-21) var(--sp-23);max-width:1180px;width:100%;margin:0 auto}
.crumbs{display:flex;align-items:center;flex-wrap:wrap;gap:1px;margin-bottom:var(--sp-14);font-size:var(--fs-sm);line-height:var(--lh-pegado)}
.crumb{background:none;border:none;padding:var(--sp-3) var(--sp-6);border-radius:var(--r-sm);color:var(--text-dim);cursor:pointer;font-family:inherit;font-size:inherit;transition:background var(--mov-rapido),color var(--mov-rapido)}
button.crumb:hover{background:var(--surface-alt);color:var(--text)}
.crumb-cur{color:var(--text);font-weight:var(--w-fuerte);padding:var(--sp-3) var(--sp-6)}
.crumb-sep{color:var(--text-soft);user-select:none}
.pers-avatar{width:84px;height:84px;border-radius:var(--r-circle);overflow:hidden;position:relative;background:var(--surface-alt);border:1px solid var(--rule);margin-bottom:var(--sp-12);flex:none;transition:border-color var(--mov-medio),transform var(--mov-medio) var(--ease)}
.pers-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.pers-card:hover .pers-avatar{border-color:var(--ink);transform:scale(1.04)}
.pers-ini{position:absolute;inset:0;display:none;align-items:center;justify-content:center;font-family:var(--display);font-weight:var(--w-fuerte);font-size:var(--fs-2xl);color:var(--text-dim)}
.pers-avatar.noimg .pers-ini{display:flex}
#foot{border-top:var(--hair-soft);padding:var(--sp-17) var(--sp-16b);color:var(--text-dim);font-size:var(--fs-sm);
display:flex;align-items:center;gap:16px}
/* Pie: logotipo completo en tinta. El isologo en lima sobre fondo claro no se lee, y
volteado deja de ser el logo. O el isologo entero o el logotipo, nunca una version girada. */
#foot .foot-logo,.foot .foot-logo{width:104px;height:auto;color:var(--ink);flex:none}
html[data-theme="dark"] #foot .foot-logo,html[data-theme="dark"] .foot .foot-logo{color:var(--ink)}
@media(max-width:640px){#foot .foot-logo,.foot .foot-logo{width:86px}}
#foot strong{color:var(--text)}
#scroll-top{position:fixed;right:22px;bottom:22px;width:44px;height:44px;border-radius:var(--r-pill);
border:var(--hair-soft);background:var(--surface);box-shadow:var(--sh-2);font-size:var(--t-18);
opacity:var(--op-nada);pointer-events:none;transition:opacity var(--mov-medio),transform var(--mov-medio);z-index:var(--capa-pegado)}
#scroll-top.show{opacity:var(--op-total);pointer-events:auto}
#scroll-top:hover{transform:translateY(-2px)}
/* ============ TOPBAR CONTROLS ============ */
#burger{display:none;font-size:var(--t-20);padding:var(--sp-3) var(--sp-7);border-radius:var(--r-in)}
#topbar-title{font-weight:var(--w-fuerte);font-size:var(--fs-lg);margin-right:auto}
#q{flex:0 1 260px;min-width:150px;padding:var(--sp-7) var(--sp-12);border-radius:var(--r-pill);
border:var(--hair-soft);background:var(--surface);font-size:var(--fs-md);transition:border-color var(--mov-medio)}
#q:focus{outline:none;border:1.5px solid var(--ink)}
#mode-seg,.zoom{display:inline-flex;border:var(--hair-soft);border-radius:var(--r-pill);
padding:var(--sp-1);background:var(--surface)}
#mode-seg button,.zoom button{padding:var(--sp-5) var(--sp-12);border-radius:var(--r-pill);font-size:var(--fs-sm);
color:var(--text-dim);transition:background var(--mov-rapido),color var(--mov-rapido)}
#mode-seg button.on{background:var(--ink);color:var(--surface);font-weight:var(--w-fuerte)}
.zoom button{padding:var(--sp-5) var(--sp-8);font-weight:var(--w-fuerte);display:inline-flex;align-items:center;justify-content:center;min-width:30px;line-height:var(--lh-pegado)}
.zoom button.zoom-sign{font-size:var(--fs-lg);font-weight:var(--w-medio)}
.zoom button.zoom-rst{padding:var(--sp-5) var(--sp-7)}
.zoom button.zoom-rst svg{width:15px;height:15px;display:block}
.zoom button:hover{background:var(--surface-alt);color:var(--text)}
#theme-btn{width:38px;height:38px;border-radius:var(--r-pill);border:var(--hair-soft);
display:inline-flex;align-items:center;justify-content:center;background:var(--surface)}
#theme-btn:hover{background:var(--surface-alt)}
#theme-btn svg{width:15px;height:15px;transition:transform var(--mov-lento)}
html[data-theme="dark"] #theme-btn svg{transform:rotate(180deg)}
/* ============ CARDS / GRID ============ */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-top:var(--sp-14)}
.card{background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);padding:var(--sp-14);
box-shadow:var(--sh-1);display:flex;flex-direction:column;gap:10px;transition:box-shadow var(--mov-medio),transform var(--mov-medio)}
.card:hover{border-color:var(--ink)}
a.card:hover{transform:translateY(-2px);border-color:var(--ink)}
.card__meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.card__t{font-size:var(--fs-lg);font-weight:var(--w-fuerte);line-height:var(--lh-subtitulo)}
.card__d{font-size:var(--fs-sm);color:var(--text-dim);line-height:var(--lh-normal)}
.card__foot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:auto;padding-top:var(--sp-5)}
.path{font-family:var(--mono);font-size:var(--fs-xs);color:var(--text-soft);
background:var(--surface-alt);padding:var(--sp-2) var(--sp-6);border-radius:var(--r-xs);word-break:break-all}
.btn-ghost{display:inline-flex;align-items:center;gap:6px;padding:var(--sp-6) var(--sp-11b);border-radius:var(--r-pill);
border:var(--hair-soft);font-size:var(--fs-sm);color:var(--text);transition:background var(--mov-rapido),border-color var(--mov-rapido)}
.btn-ghost:hover{background:var(--surface-alt);border-color:var(--ink)}
.btn-ghost svg{width:13px;height:13px}
.btn-primary{background:var(--ink);color:var(--surface);border-color:var(--ink);font-weight:var(--w-fuerte)}
.btn-primary:hover{filter:brightness(.96)}
/* ============ STATS ============ */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:var(--sp-15) 0}
.stat{background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);padding:var(--sp-16) var(--sp-16b) var(--sp-15);
box-shadow:var(--sh-1)}
.stat__n{font-family:var(--display);font-size:clamp(2rem,4vw,2.5rem);font-weight:var(--w-normal);line-height:var(--lh-pegado);letter-spacing:var(--ls-titulo)}
.stat__l{font-size:var(--fs-xs);font-weight:var(--w-fuerte);margin-top:var(--sp-7);text-transform:uppercase;letter-spacing:var(--ls-rotulo-ancho);color:var(--text-dim)}
.stat__d{font-size:var(--fs-xs);color:var(--text-soft);margin-top:var(--sp-4);line-height:var(--lh-normal)}
/* ============ HERO ============ */
.hero{position:relative;overflow:hidden;background:var(--surface-alt);border:var(--hair-soft);
border-radius:var(--r-hero);padding:var(--sp-19c) var(--sp-18b);margin-bottom:var(--sp-7)}
.hero h1{font-family:var(--display);font-size:var(--fs-hero);letter-spacing:var(--ls-titulo);font-weight:var(--w-normal);line-height:var(--lh-pegado)}
.hero .lead{font-size:var(--fs-lead);color:var(--text-dim);margin-top:var(--sp-9);max-width:60ch}
.hero .star-bg{position:absolute;right:-40px;top:-40px;width:220px;height:220px;color:var(--lime);
opacity:var(--op-alto);pointer-events:none}
html[data-theme="dark"] .hero .star-bg{opacity:var(--op-medio)}
/* ============ FILTERS BAR ============ */
.filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:var(--sp-3)}
.filters .count{margin-left:auto;font-size:var(--fs-sm);color:var(--text-dim);font-weight:var(--w-fuerte)}
.section-lead{font-family:var(--display);font-size:var(--fs-h2);font-weight:var(--w-medio);color:var(--text);margin-bottom:var(--sp-11);letter-spacing:var(--ls-medio)}
/* ============ GROUPS (colapsables) ============ */
.grp{border:var(--hair-soft);border-radius:var(--r-lg);margin-bottom:var(--sp-11);overflow:hidden;background:var(--surface)}
.grp__head{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-12) var(--sp-14);
cursor:pointer;font-weight:var(--w-fuerte)}
.grp__head .n{font-size:var(--fs-sm);color:var(--text-dim);font-weight:var(--w-medio)}
.grp__body{padding:0 var(--sp-14) var(--sp-13);display:none}
.grp.open .grp__body{display:block}
.grp .chev{transition:transform var(--mov-medio)}
.grp.open .chev{transform:rotate(90deg)}
/* ============ ANIM ============ */
@keyframes floatHover{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes fadeUp{from{opacity:var(--op-nada);transform:translateY(10px)}to{opacity:var(--op-total);transform:none}}
.reveal.in{animation:fadeUp .5s ease}
.floaty:hover{animation:floatHover 1.6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1}}
/* ============ COMPONENTES DE VISTA ============ */
.council-members{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--sp-7)}
.cm-label{width:100%;font-size:var(--fs-xs);color:var(--text-soft);text-transform:uppercase;letter-spacing:var(--ls-rotulo);margin-bottom:var(--sp-1)}
.chip{font-size:var(--fs-xs);padding:var(--sp-2) var(--sp-8);border-radius:var(--r-pill);background:var(--surface-alt);border:var(--hair-soft);white-space:nowrap}
.skill-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.prog-toggle{font-size:var(--fs-xs);padding:var(--sp-3) var(--sp-10);border-radius:var(--r-pill);border:var(--hair-soft);color:var(--text-dim);white-space:nowrap;flex:none}
.prog-toggle.on{background:var(--lime);color:var(--on-accent);border-color:var(--lime);font-weight:var(--w-fuerte)}
.prompt-box,.info-box{display:none;margin-top:var(--sp-11);border:var(--hair-soft);border-radius:var(--r-card);var(--surface);padding:var(--sp-11)}
.prompt-box.show,.info-box.show{display:block}
.pb-bar{display:flex;justify-content:flex-end;margin:var(--sp-1) 0}
.pb-pre{white-space:pre-wrap;word-break:break-word;font-family:var(--mono);font-size:var(--fs-xs);line-height:var(--lh-normal);margin:var(--sp-7) 0;max-height:340px;overflow:auto;color:var(--text)}
.info-box{font-size:var(--fs-sm);line-height:var(--lh-lectura)}
.info-box strong{color:var(--text)}
.atom-stage{min-height:60px}
html[data-mode="present"] .internal-only{display:none}
.map-wrap{display:flex;gap:18px;align-items:stretch;flex-wrap:wrap;background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);padding:var(--sp-13)}
.agent-map{flex:1 1 520px;min-width:0;width:100%;height:auto}
.map-edge{stroke:var(--rule);stroke-width:1}
.map-edge.thin{stroke-width:.7;opacity:var(--op-medio)}
.map-node{cursor:pointer}
.map-disp{cursor:default}
.md-dot{fill:var(--lime);stroke:var(--ink);stroke-width:1}
.md-t{fill:var(--text);font-size:var(--t-13);font-weight:var(--w-max);font-family:var(--font)}
.md-s{fill:var(--text);font-size:var(--t-9b);font-family:var(--font);opacity:var(--op-casi);text-transform:uppercase;letter-spacing:var(--ls-rotulo)}
.ma-dot{fill:var(--ink);stroke:var(--surface);stroke-width:2;transition:fill var(--mov-rapido)}
.mn-dot{fill:var(--text-soft);stroke:var(--surface);stroke-width:1.5;transition:fill var(--mov-rapido),r var(--mov-rapido)}
.mn-label{fill:var(--text-dim);font-size:var(--t-10);font-family:var(--font);pointer-events:none;transition:fill var(--mov-rapido)}
.map-node:hover .mn-dot,.map-node.hl .mn-dot,.map-node:hover .ma-dot,.map-node.hl .ma-dot,.map-area.focus .ma-dot{fill:var(--lime);stroke:var(--ink)}
.map-node:hover .mn-label,.map-node.hl .mn-label{fill:var(--text);font-weight:var(--w-fuerte)}
.map-node.dim{opacity:.2}
.map-panel{flex:0 0 220px;var(--surface);border-radius:var(--r-card);padding:var(--sp-13);align-self:flex-start}
.mp-k{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:var(--ls-rotulo);color:var(--text-soft)}
.mp-t{font-weight:var(--w-max);font-size:var(--fs-lg);margin:var(--sp-3) 0 var(--sp-7)}
.mp-b{font-size:var(--fs-sm);color:var(--text-dim);line-height:var(--lh-normal)}
@media(max-width:640px){.map-panel{flex:1 1 100%}}
/* ============ DETAIL MODAL ============ */
.dv{position:fixed;inset:0;z-index:var(--capa-ventana);display:none;align-items:flex-start;justify-content:center;
background:var(--shade);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);padding:6vh var(--sp-15);overflow:auto}
.dv.open{display:flex}
.dv__panel{position:relative;width:100%;max-width:760px;background:var(--surface);border:var(--hair-soft);
border-radius:var(--r-hero);box-shadow:var(--sh-3);padding:var(--sp-19) var(--sp-19b) var(--sp-18);animation:dvIn var(--mov-medio) ease}
@keyframes dvIn{from{opacity:var(--op-nada);transform:translateY(14px) scale(.985)}to{opacity:var(--op-total);transform:none}}
.dv__close{position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:var(--r-pill);
border:var(--hair-soft);background:var(--surface);font-size:var(--t-14)}
.dv__close:hover{background:var(--surface-alt)}
.dv__eyebrow{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:var(--ls-rotulo-ancho);color:var(--text-dim);margin-bottom:var(--sp-7)}
.dv__title{font-size:var(--fs-h1);font-weight:var(--w-fuerte);line-height:var(--lh-titulo);margin-bottom:var(--sp-12);padding-right:var(--sp-18b)}
.dv__metacard{display:flex;flex-wrap:wrap;gap:14px;padding:var(--sp-11) var(--sp-12);var(--surface);border-radius:var(--r-card);margin-bottom:var(--sp-13)}
.dv__metacard .m{font-size:var(--fs-xs);color:var(--text-dim)}
.dv__metacard .m b{color:var(--text);font-weight:var(--w-fuerte)}
.dv__lead{font-size:var(--fs-lead);line-height:var(--lh-lectura);color:var(--text)}
.dv__prompt{margin-top:var(--sp-14);border-top:var(--hair-soft);padding-top:var(--sp-13)}
.dv__note{margin-top:var(--sp-13);padding:var(--sp-12) var(--sp-13);var(--surface);border-radius:var(--r-card);font-size:var(--fs-sm);color:var(--text-dim)}
.dv__doc{margin-top:var(--sp-14);border-top:var(--hair-soft);padding-top:var(--sp-15)}
.md-body{font-size:var(--fs-body);line-height:var(--lh-lectura);color:var(--text)}
.md-body h3{font-size:var(--fs-h3);font-weight:var(--w-fuerte);margin:var(--sp-16b) 0 var(--sp-9);line-height:var(--lh-subtitulo)}
.md-body h4{font-size:var(--fs-lead);font-weight:var(--w-fuerte);margin:var(--sp-15) 0 var(--sp-7)}
.md-body h5,.md-body h6{font-size:var(--fs-body);font-weight:var(--w-fuerte);margin:var(--sp-13) 0 var(--sp-5);color:var(--text-dim);text-transform:uppercase;letter-spacing:.03em}
.md-body p{margin:0 0 var(--sp-11)}
.md-body ul,.md-body ol{margin:0 0 var(--sp-12);padding-left:var(--sp-16)}
.md-body li{margin:var(--sp-3) 0;line-height:var(--lh-lectura)}
.md-body strong{font-weight:var(--w-fuerte);color:var(--text)}
.md-body a{color:var(--accent-ink,inherit);font-weight:var(--w-fuerte);text-decoration:underline}
.md-body code{font-family:var(--mono,ui-monospace,monospace);font-size:.9em;background:var(--surface-alt);padding:var(--sp-0) var(--sp-4);border-radius:var(--sp-4)}
.md-body pre.md-code{background:var(--surface-alt);border-radius:var(--r-card);padding:var(--sp-12) var(--sp-13);overflow-x:auto;margin:0 0 var(--sp-12)}
.md-body pre.md-code code{background:none;padding:0;font-size:.86em;line-height:var(--lh-normal)}
.md-body blockquote{border-left:2px solid var(--line);margin:0 0 var(--sp-12);padding:var(--sp-1) 0 var(--sp-1) var(--sp-13);color:var(--text-dim)}
.md-body hr{border:0;border-top:var(--hair-soft);margin:var(--sp-16) 0}
.md-tablewrap{overflow-x:auto;margin:0 0 var(--sp-13)}
.md-body table.md-table{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}
.md-body table.md-table th,.md-body table.md-table td{text-align:left;padding:var(--sp-7) var(--sp-11);border-bottom:var(--hair-soft);vertical-align:top}
.md-body table.md-table th{font-weight:var(--w-fuerte);color:var(--text);background:var(--surface-alt)}
.md-body table.md-table tr:last-child td{border-bottom:0}
/* ============ ATOM + CHARTS ============ */
.atom-wrap{display:flex;gap:24px;align-items:center;flex-wrap:wrap;justify-content:center;background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);padding:var(--sp-16)}
.atom-svg{width:min(100%,520px);height:auto;overflow:visible}
.atom-svg .orbit{fill:none;stroke:var(--rule);stroke-width:1}
.atom-svg .nucleus{fill:var(--lime)}
.atom-svg .nuc-t{fill:var(--text);font-size:var(--t-15);font-weight:var(--w-max);font-family:var(--font)}
.atom-svg .nuc-s{fill:var(--text);font-size:var(--t-8b);text-transform:uppercase;letter-spacing:var(--ls-rotulo-ancho);opacity:var(--op-casi);font-family:var(--font)}
.atom-svg .node{fill:var(--text-soft)}
.atom-svg .node.t0{fill:var(--lime);stroke:var(--ink);stroke-width:.8}
.atom-svg .node.t1{fill:var(--ink)}
.atom-svg .node.t2{fill:var(--text-soft)}
.ring-g{transform-box:view-box}
.r0{animation:atomspin 55s linear infinite}
.r1{animation:atomspin 82s linear infinite reverse}
.r2{animation:atomspin 110s linear infinite}
@keyframes atomspin{to{transform:rotate(360deg)}}
.atom-legend{display:flex;flex-direction:column;gap:8px;min-width:158px}
.atom-leg{display:flex;align-items:center;gap:9px;padding:var(--sp-8) var(--sp-12);border:var(--hair-soft);border-radius:var(--r-pill);font-size:var(--fs-sm);color:var(--text);transition:background var(--mov-rapido),transform var(--mov-rapido)}
.atom-leg:hover{background:var(--surface-alt);transform:translateY(-1px)}
.atom-leg .ld{width:11px;height:11px;border-radius:var(--r-circle);flex:none}
.atom-leg .ld.t0{background:var(--lime);border:1px solid var(--ink);color:var(--on-accent)}
.atom-leg .ld.t1{background:var(--ink)}
.atom-leg .ld.t2{background:var(--text-soft)}
.atom-leg b{margin-left:auto;font-variant-numeric:tabular-nums}
.chart-card{background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);padding:var(--sp-15);overflow-x:auto}
/* ===== BLOQUES DE DATA REAL (departamentos) ===== */
.blk{margin-top:var(--sp-14)}
.blk-t{font-family:var(--display);font-weight:var(--w-medio);font-size:var(--fs-lg);letter-spacing:var(--ls-medio);margin-bottom:var(--sp-11)}
.tbl-wrap{overflow-x:auto}
.data-table{width:100%;border-collapse:collapse;font-size:var(--fs-md);line-height:var(--lh-normal)}
.data-table th{text-align:left;font-size:var(--fs-xs);font-weight:var(--w-max);text-transform:uppercase;letter-spacing:var(--ls-rotulo-ancho);color:var(--text-dim);padding:var(--sp-7) var(--sp-11);border-bottom:var(--hair-soft);white-space:nowrap}
.data-table td{padding:var(--sp-9) var(--sp-11);border-bottom:var(--hair-soft);vertical-align:top;color:var(--text-dim)}
.data-table td.td-lead{color:var(--text);font-weight:var(--w-fuerte)}
.data-table tr:last-child td{border-bottom:none}
.data-table tr:hover td{background:var(--surface-alt)}
.clean-list{list-style:none;display:flex;flex-direction:column;gap:8px}
.clean-list li{position:relative;padding-left:var(--sp-16);font-size:var(--fs-md);color:var(--text-dim);line-height:var(--lh-normal)}
.clean-list li::before{content:"";position:absolute;left:4px;top:.55em;width:7px;height:7px;border-radius:var(--r-circle);background:var(--lime);border:1px solid var(--ink);color:var(--on-accent)}
.callout{display:flex;gap:12px;align-items:flex-start;var(--surface);border-radius:var(--r-card);padding:var(--sp-13) var(--sp-14)}
.callout .co-ic{width:20px;height:20px;flex:none;margin-top:var(--sp-1);color:var(--text)}
.callout p{font-size:var(--fs-body);line-height:var(--lh-normal);color:var(--text)}
.pull-quote{background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);padding:var(--sp-16) var(--sp-16b)}
.pull-quote blockquote{font-family:var(--display);font-weight:var(--w-normal);font-size:var(--fs-xl);line-height:var(--lh-normal);letter-spacing:var(--ls-medio)}
.pull-quote figcaption{margin-top:var(--sp-9);font-size:var(--fs-sm);color:var(--text-dim)}
.card-grid.mini{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin-top:0}
.card-grid.mini .card{padding:var(--sp-12)}
.gal-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}
.gal-tile{margin:0}
.gal-img{display:flex;align-items:center;justify-content:center;height:110px;border-radius:var(--r-card);border:var(--hair-soft);background:var(--surface);padding:var(--sp-14)}
.gal-tile--dark .gal-img{background:var(--text);border-color:var(--text)}
.gal-img img{max-width:100%;max-height:100%;object-fit:contain}
/* ============ BLOQUE CALENDARIO EDITORIAL (tipo "calendar" del motor) ============ */
:root{
--cal-reel:#2f5fd8; --cal-carrusel:#8b5cc7; --cal-estatica:#c07b1f; --cal-story:#c2417a; --cal-other:#7a7264;
--cal-linkedin:#0A66C2; --cal-instagram:#C13584; --cal-facebook:#1877F2; --cal-tiktok:var(--text); --cal-youtube:#E60000; --cal-x:#111;
}
html[data-theme="dark"]{
--cal-reel:#8ba9ff; --cal-carrusel:#c8adf0; --cal-estatica:#e6b45f; --cal-story:#f093bf; --cal-other:#b0a898;
--cal-linkedin:#5aa0e6; --cal-instagram:#e888c0; --cal-facebook:#6aa6f7; --cal-tiktok:#e8e3d8; --cal-youtube:#ff7a7a; --cal-x:#e8e3d8;
}
.cal-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:var(--sp-13)}
.cal-head .blk-t{margin-bottom:0}
.cal-view-switch{display:inline-flex;flex-wrap:wrap;gap:2px;background:var(--surface-alt);border:var(--hair-soft);border-radius:var(--r-pill);padding:var(--sp-2)}
.cal-vs-btn{display:inline-flex;align-items:center;gap:7px;font-size:var(--fs-sm);font-weight:var(--w-fuerte);color:var(--text-dim);background:transparent;border:none;padding:var(--sp-7) var(--sp-13);border-radius:var(--r-pill);transition:background var(--mov-rapido),color var(--mov-rapido)}
.cal-vs-btn svg{width:15px;height:15px}
.cal-vs-btn:hover{color:var(--text)}
.cal-vs-btn.on{background:var(--ink);color:var(--surface)}
.cal-block[data-cal-vista="dias"] .cal-meses-pane{display:none}
.cal-block[data-cal-vista="meses"] .cal-dias-pane{display:none}
/* --- vista por días: parrilla mensual real (lunes primero) --- */
.cal-month-block{margin-bottom:var(--sp-16);padding:var(--sp-15) var(--sp-16);background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);box-shadow:var(--sh-1)}
.cal-month-bh{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:var(--sp-12);padding-bottom:var(--sp-11);border-bottom:var(--hair-soft)}
.cal-month-bh h3{font-family:var(--display);font-size:var(--fs-xl);font-weight:var(--w-medio);letter-spacing:var(--ls-medio);text-transform:capitalize}
.cal-month-bh-meta{font-size:var(--fs-xs);color:var(--text-dim);text-transform:uppercase;letter-spacing:var(--ls-rotulo);font-weight:var(--w-fuerte)}
.cal-month-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.cal-dow{font-size:var(--fs-xs);font-weight:var(--w-max);color:var(--text-dim);text-align:center;padding:var(--sp-4) 0;text-transform:uppercase;letter-spacing:var(--ls-rotulo-ancho)}
.cal-day-cell{min-height:92px;padding:var(--sp-5) var(--sp-6);background:transparent;border:var(--hair-soft);border-radius:var(--r-in);display:flex;flex-direction:column;gap:5px;min-width:0;overflow:hidden;transition:border-color var(--mov-rapido),transform var(--mov-medio),box-shadow var(--mov-medio)}
.cal-day-cell.empty{background:transparent;border-color:transparent}
.cal-day-cell.has-piece{background:var(--surface-alt);border-color:var(--rule)}
.cal-day-cell.has-piece:hover{border-color:var(--ink);box-shadow:var(--sh-1)}
.cal-day-cell.is-open{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.cal-day-num{font-family:var(--display);font-size:var(--fs-sm);font-weight:var(--w-fuerte);color:var(--text-dim);align-self:flex-end;line-height:var(--lh-pegado)}
.cal-day-cell.has-piece .cal-day-num{color:var(--text)}
.cal-day-pieces{display:flex;flex-direction:column;gap:4px;min-width:0}
.cal-day-piece{--tone:var(--cal-other);display:inline-flex;align-items:center;font-size:var(--fs-xs);font-weight:var(--w-fuerte);line-height:var(--lh-subtitulo);padding:var(--sp-1) var(--sp-6);border-radius:var(--r-pill);color:var(--text);background:color-mix(in srgb,var(--tone) 13%,var(--surface));border:1px solid color-mix(in srgb,var(--tone) 34%,var(--rule));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.cal-day-piece.t-reel{--tone:var(--cal-reel)}
.cal-day-piece.t-carrusel{--tone:var(--cal-carrusel)}
.cal-day-piece.t-estatica{--tone:var(--cal-estatica)}
.cal-day-piece.t-story{--tone:var(--cal-story)}
.cal-day-more{font-size:var(--fs-2xs);font-weight:var(--w-max);color:var(--text)}
/* --- detalle inline del día (expand, sin modal nuevo) --- */
.cal-day-details{margin-top:var(--sp-1)}
.cal-day-detail{display:none;margin-top:var(--sp-12);padding:var(--sp-13) var(--sp-14);var(--surface);border:var(--hair-soft);border-radius:var(--r-card)}
.cal-day-detail.show{display:block;animation:fadeUp var(--mov-lento) ease}
.cal-dd-head{font-family:var(--display);font-size:var(--fs-body);font-weight:var(--w-fuerte);margin-bottom:var(--sp-11);text-transform:capitalize}
.cal-dd-idea{padding:var(--sp-11) 0;border-top:var(--hair-soft)}
.cal-dd-idea:first-of-type{border-top:none;padding-top:0}
.cal-dd-hook{font-size:var(--fs-body);font-weight:var(--w-fuerte);line-height:var(--lh-subtitulo);margin-bottom:var(--sp-7)}
.cal-dd-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.cal-dd-pieces{display:flex;flex-wrap:wrap;gap:5px;margin-top:var(--sp-7)}
.cal-dd-pieces .cal-day-piece{white-space:normal}
/* canal + estado chips */
.cal-canal{--tone:var(--text-soft);display:inline-flex;align-items:center;gap:5px;font-size:var(--fs-xs);font-weight:var(--w-fuerte);padding:var(--sp-2) var(--sp-8);border-radius:var(--r-pill);color:var(--text);background:color-mix(in srgb,var(--tone) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--tone) 30%,var(--rule))}
.cal-canal .cal-canal-dot{width:7px;height:7px;border-radius:var(--r-circle);background:var(--tone);flex:none}
.cal-canal.c-linkedin{--tone:var(--cal-linkedin)}
.cal-canal.c-instagram{--tone:var(--cal-instagram)}
.cal-canal.c-facebook{--tone:var(--cal-facebook)}
.cal-canal.c-tiktok{--tone:var(--cal-tiktok)}
.cal-canal.c-youtube{--tone:var(--cal-youtube)}
.cal-canal.c-x{--tone:var(--cal-x)}
.cal-estado{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-xs);font-weight:var(--w-fuerte);padding:var(--sp-2) var(--sp-8);border-radius:var(--r-pill);border:var(--hair-soft);color:var(--text)}
.cal-estado::before{content:"";width:7px;height:7px;border-radius:var(--r-circle);flex:none;border:1px solid var(--text-soft)}
.cal-estado.is-hecho{color:var(--on-accent);border-color:color-mix(in srgb,var(--lime) 55%,var(--rule));background:color-mix(in srgb,var(--lime) 16%,var(--surface))}
.cal-estado.is-hecho::before{background:var(--lime);border-color:var(--ink);color:var(--on-accent)}
/* --- vista por meses: cards colapsables con conteo --- */
.cal-tools{display:flex;gap:8px;margin-bottom:var(--sp-12)}
.cal-month-card{background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);box-shadow:var(--sh-1);margin-bottom:var(--sp-11);overflow:hidden}
.cal-month-head{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:var(--sp-13) var(--sp-15)}
.cal-mh-title{font-family:var(--display);font-size:var(--fs-lg);font-weight:var(--w-fuerte);text-transform:capitalize}
.cal-mh-count{font-size:var(--fs-xs);color:var(--text-dim);text-transform:uppercase;letter-spacing:var(--ls-rotulo);font-weight:var(--w-fuerte)}
.cal-chev{width:13px;height:13px;color:var(--text-dim);margin-left:auto;transition:transform var(--mov-medio);flex:none}
.cal-month-card.is-open .cal-month-head .cal-chev{transform:rotate(90deg)}
.cal-month-body{display:none;padding:0 var(--sp-15) var(--sp-11)}
.cal-month-card.is-open .cal-month-body{display:block}
.cal-empty-line{font-size:var(--fs-sm);color:var(--text-dim);padding:var(--sp-5) 0 var(--sp-11)}
.cal-idea{border-top:var(--hair-soft)}
.cal-idea:first-child{border-top:none}
.cal-idea-head{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:var(--sp-11) 0}
.cal-idea-tone{--tone:var(--cal-other);width:9px;height:9px;border-radius:var(--r-circle);background:var(--tone);flex:none}
.cal-idea-tone.t-reel{--tone:var(--cal-reel)}
.cal-idea-tone.t-carrusel{--tone:var(--cal-carrusel)}
.cal-idea-tone.t-estatica{--tone:var(--cal-estatica)}
.cal-idea-tone.t-story{--tone:var(--cal-story)}
.cal-idea-day{font-size:var(--fs-xs);font-weight:var(--w-max);color:var(--text-dim);text-transform:uppercase;letter-spacing:.04em;flex:none;min-width:78px}
.cal-idea-hook{font-size:var(--fs-md);font-weight:var(--w-medio);line-height:var(--lh-subtitulo);flex:1;min-width:0}
.cal-idea-body{display:none;padding:0 0 var(--sp-12) var(--sp-14b)}
.cal-idea.is-expanded .cal-idea-body{display:block}
.cal-idea.is-expanded .cal-idea-head .cal-chev{transform:rotate(90deg)}
@media(max-width:680px){
.cal-day-cell{min-height:76px}
.cal-day-piece{font-size:var(--fs-2xs);padding:var(--sp-1) var(--sp-4)}
.cal-idea-day{min-width:0}
}
/* ============ BANCO DE IDEAS POR TOPICOS (tipo "ideas" del motor) ============ */
:root{
--topico-lima:#5f7a00; --topico-tinta:var(--dark-hover); --topico-crema:#97631d;
}
html[data-theme="dark"]{
--topico-lima:#c1fe1a; --topico-tinta:#c8c0b0; --topico-crema:#e0bd82;
}
/* cabecera del bloque: titulo + conteo (N topicos, M ideas, desglose por estado) + toggle expandir/colapsar */
.ideas-block{margin-top:var(--sp-14)}
.ideas-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:var(--sp-13)}
.ideas-head-left{min-width:0}
.ideas-head-left .blk-t{margin-bottom:var(--sp-7)}
.ideas-meta{display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap}
.ideas-count{font-size:var(--fs-sm);color:var(--text-dim);font-weight:var(--w-fuerte)}
.ideas-estados{display:flex;gap:6px;flex-wrap:wrap}
.ideas-tools{display:flex;gap:8px;flex-wrap:wrap;flex:none}
.ideas-topicos{display:flex;flex-direction:column;gap:12px}
/* grupo colapsable por topico (tenido por su color de marca lima/tinta/crema) */
.topico-group{background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);box-shadow:var(--sh-1);overflow:hidden}
.topico-group.c-lima{--topico-tone:var(--topico-lima)}
.topico-group.c-tinta{--topico-tone:var(--topico-tinta)}
.topico-group.c-crema{--topico-tone:var(--topico-crema)}
.topico-head{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:var(--sp-12b) var(--sp-15);background:color-mix(in srgb,var(--topico-tone) 6%,var(--surface));transition:background var(--mov-rapido)}
.topico-head:hover{background:color-mix(in srgb,var(--topico-tone) 13%,var(--surface))}
.topico-dot{width:11px;height:11px;border-radius:var(--r-circle);background:var(--topico-tone);flex:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--topico-tone) 20%,transparent)}
.topico-name{font-family:var(--display);font-size:var(--fs-lg);font-weight:var(--w-fuerte);letter-spacing:var(--ls-medio);color:var(--text);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topico-vertical{font-size:var(--fs-xs);color:var(--text-dim);border:var(--hair-soft);border-radius:var(--r-pill);padding:var(--sp-1) var(--sp-8);white-space:nowrap;flex:none}
.topico-count{margin-left:auto;font-size:var(--fs-xs);color:var(--text-dim);text-transform:uppercase;letter-spacing:var(--ls-rotulo);font-weight:var(--w-fuerte);white-space:nowrap;flex:none}
.topico-chev{width:13px;height:13px;color:var(--text-dim);transition:transform var(--mov-medio);flex:none}
.topico-group.is-open .topico-head .topico-chev{transform:rotate(90deg)}
.topico-body{display:none;padding:var(--sp-1) var(--sp-15) var(--sp-9)}
.topico-group.is-open .topico-body{display:block}
/* fila-acordeon de idea: hook + chips en la cabecera; por que + mini-guion al expandir */
.topico-idea{border-top:var(--hair-soft)}
.topico-idea:first-child{border-top:none}
.topico-idea.is-validada{background:color-mix(in srgb,var(--lime) 5%,transparent);color:var(--on-accent)}
.idea-head{display:flex;align-items:flex-start;gap:12px;width:100%;text-align:left;padding:var(--sp-12) var(--sp-1)}
.idea-head-main{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.idea-hook{flex:1 1 240px;min-width:0;font-size:var(--fs-body);font-weight:var(--w-medio);line-height:var(--lh-normal);color:var(--text)}
.topico-idea.is-descartada .idea-hook{color:var(--text-dim);text-decoration:line-through;text-decoration-color:var(--text-soft)}
.idea-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.idea-chev{flex:none;width:12px;height:12px;color:var(--text-dim);margin-top:var(--sp-3);transition:transform var(--mov-medio)}
.topico-idea.is-expanded .idea-head .idea-chev{transform:rotate(90deg)}
.idea-body{display:none;padding:0 var(--sp-1) var(--sp-13)}
.topico-idea.is-expanded .idea-body{display:block}
.idea-block{border:var(--hair-soft);border-radius:var(--r-card);background:var(--surface);padding:var(--sp-11) var(--sp-12)}
.idea-block+.idea-block{margin-top:var(--sp-9)}
.idea-label{display:block;font-size:var(--fs-xs);font-weight:var(--w-max);text-transform:uppercase;letter-spacing:.07em;color:var(--text-dim);margin-bottom:var(--sp-5)}
.idea-text{font-size:var(--fs-md);line-height:var(--lh-lectura);color:var(--text)}
.idea-text.idea-guion{white-space:pre-wrap}
/* chips de formato y canal: reutilizan el sistema de tonos --cal-* de M1 (AA verificado en ambos temas) */
.idea-chip{--tone:var(--cal-other);display:inline-flex;align-items:center;gap:5px;font-size:var(--fs-xs);font-weight:var(--w-fuerte);line-height:var(--lh-subtitulo);padding:var(--sp-2) var(--sp-9);border-radius:var(--r-pill);color:var(--text);background:color-mix(in srgb,var(--tone) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--tone) 32%,var(--rule));white-space:nowrap}
.idea-chip.f-reel{--tone:var(--cal-reel)}
.idea-chip.f-carrusel{--tone:var(--cal-carrusel)}
.idea-chip.f-estatica{--tone:var(--cal-estatica)}
.idea-chip.f-story{--tone:var(--cal-story)}
.idea-canal-dot{width:6px;height:6px;border-radius:var(--r-circle);background:var(--tone);flex:none}
.idea-chip.canal.c-linkedin{--tone:var(--cal-linkedin)}
.idea-chip.canal.c-instagram{--tone:var(--cal-instagram)}
.idea-chip.canal.c-facebook{--tone:var(--cal-facebook)}
.idea-chip.canal.c-tiktok{--tone:var(--cal-tiktok)}
.idea-chip.canal.c-youtube{--tone:var(--cal-youtube)}
.idea-chip.canal.c-x{--tone:var(--cal-x)}
/* chip de estado (propuesta / validada / descartada) */
.idea-estado{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-xs);font-weight:var(--w-fuerte);line-height:var(--lh-subtitulo);padding:var(--sp-2) var(--sp-9);border-radius:var(--r-pill);border:var(--hair-soft);color:var(--text-dim);white-space:nowrap}
.idea-estado::before{content:"";width:7px;height:7px;border-radius:var(--r-circle);flex:none;border:1px solid var(--text-soft);background:transparent}
.idea-estado.is-validada{color:var(--on-accent);border-color:color-mix(in srgb,var(--lime) 55%,var(--rule));background:color-mix(in srgb,var(--lime) 16%,var(--surface))}
.idea-estado.is-validada::before{background:var(--lime);border-color:var(--ink);color:var(--on-accent)}
.idea-estado.is-descartada::before{background:var(--text-soft);border-color:var(--text-soft)}
.ideas-empty-line{font-size:var(--fs-sm);color:var(--text-dim);padding:var(--sp-7) 0}
@media(max-width:560px){
.topico-head{padding:var(--sp-12) var(--sp-12b)}
.topico-body{padding:var(--sp-1) var(--sp-12b) var(--sp-9)}
.topico-vertical{display:none}
.idea-chips{width:100%}
}
/* ============ PACK DE BLOQUES NARRATIVOS (persona / journey / foda / heuristica) ============ */
:root{
--vert-agencia:#2f5fd8; --vert-edlab:#8b5cc7; --vert-editorial:#c07b1f; --vert-express:#c2417a; --vert-other:#7a7264;
}
html[data-theme="dark"]{
--vert-agencia:#8ba9ff; --vert-edlab:#c8adf0; --vert-editorial:#e6b45f; --vert-express:#f093bf; --vert-other:#b0a898;
}
.v-agencia{--vtone:var(--vert-agencia)} .v-edlab{--vtone:var(--vert-edlab)} .v-editorial{--vtone:var(--vert-editorial)} .v-express{--vtone:var(--vert-express)} .v-other{--vtone:var(--vert-other)}
/* --- persona: cards con avatar tipografico + detalle colapsable --- */
.pv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;margin-top:var(--sp-5)}
.pv-card{--vtone:var(--vert-other);background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:var(--sp-15);display:flex;flex-direction:column;gap:12px;transition:border-color var(--mov-rapido),box-shadow var(--mov-medio)}
.pv-card:hover{border-color:var(--ink)}
.pv-head{display:flex;gap:14px;align-items:flex-start}
.pv-avatar{--vtone:var(--vert-other);width:56px;height:56px;flex:none;position:relative;border-radius:var(--r-card);overflow:hidden;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--vtone) 20%,var(--surface));border:1.5px solid color-mix(in srgb,var(--vtone) 42%,var(--rule))}
.pv-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.pv-ini{position:absolute;inset:0;display:none;align-items:center;justify-content:center;font-family:var(--display);font-weight:var(--w-fuerte);font-size:var(--fs-xl);letter-spacing:var(--ls-titulo);color:var(--text)}
.pv-avatar.noimg .pv-ini{display:flex}
.pv-id{min-width:0;flex:1}
.pv-name{font-family:var(--display);font-size:var(--fs-lg);font-weight:var(--w-fuerte);letter-spacing:var(--ls-medio);line-height:var(--lh-subtitulo);color:var(--text)}
.pv-rol{font-size:var(--fs-sm);color:var(--text-dim);line-height:var(--lh-normal);margin-top:var(--sp-2)}
.pv-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--sp-7);align-items:center}
.pv-edad{font-size:var(--fs-xs);color:var(--text-dim);font-weight:var(--w-fuerte);text-transform:uppercase;letter-spacing:.04em}
.pv-vert{--vtone:var(--vert-other);font-size:var(--fs-xs);font-weight:var(--w-fuerte);padding:var(--sp-1) var(--sp-8);border-radius:var(--r-pill);color:var(--text);background:color-mix(in srgb,var(--vtone) 14%,var(--surface));border:1px solid color-mix(in srgb,var(--vtone) 34%,var(--rule));white-space:nowrap}
.pv-perfil{font-size:var(--fs-md);line-height:var(--lh-normal);color:var(--text-dim)}
.pv-toggle{align-self:flex-start}
.pv-chev{width:12px;height:12px;transition:transform var(--mov-medio)}
.pv-card.pv-open .pv-toggle .pv-chev{transform:rotate(90deg)}
.pv-detail{display:none;flex-direction:column;gap:13px}
.pv-card.pv-open .pv-detail{display:flex}
.pv-col-l{display:block;font-size:var(--fs-xs);font-weight:var(--w-max);text-transform:uppercase;letter-spacing:.07em;color:var(--text-dim);margin-bottom:var(--sp-5)}
.pv-list{list-style:none;display:flex;flex-direction:column;gap:5px}
.pv-list li{position:relative;padding-left:var(--sp-14);font-size:var(--fs-sm);line-height:var(--lh-normal);color:var(--text)}
.pv-list li::before{content:"";position:absolute;left:2px;top:.5em;width:7px;height:7px;border-radius:var(--r-circle)}
.pv-goals .pv-list li::before{background:var(--lime);border:1px solid var(--ink);color:var(--on-accent)}
.pv-frust .pv-list li::before{background:transparent;border:1.5px solid var(--text-soft)}
.pv-obj .pv-list li::before{border-radius:var(--sp-1);background:color-mix(in srgb,var(--vert-editorial) 70%,var(--surface));border:1px solid color-mix(in srgb,var(--vert-editorial) 55%,var(--ink))}
.pv-chip-row{display:flex;flex-wrap:wrap;gap:6px}
.pv-chip{font-size:var(--fs-xs);padding:var(--sp-2) var(--sp-8);border-radius:var(--r-pill);background:var(--surface-alt);border:var(--hair-soft);color:var(--text);white-space:normal;line-height:var(--lh-subtitulo);max-width:100%}
.pv-trigger{background:color-mix(in srgb,var(--vtone) 8%,var(--surface-alt));border-radius:var(--r-card);padding:var(--sp-11) var(--sp-12)}
.pv-trigger p{font-size:var(--fs-sm);line-height:var(--lh-normal);color:var(--text);margin-top:var(--sp-1)}
.pv-cita{margin-top:var(--sp-1)}
.pv-cita blockquote{font-family:var(--display);font-style:italic;font-size:var(--fs-body);line-height:var(--lh-normal);color:var(--text);position:relative;padding-left:var(--sp-16)}
.pv-cita blockquote::before{content:"\201C";position:absolute;left:0;top:-2px;font-size:var(--fs-3xl);line-height:var(--lh-pegado);font-family:var(--display);color:color-mix(in srgb,var(--vtone) 62%,var(--text-dim))}
@media(max-width:520px){.pv-grid{grid-template-columns:1fr}}
/* -- persona card compacta + boton ficha (motor M4) -- */
.pv-teaser{font-size:var(--fs-md);line-height:var(--lh-normal);color:var(--text-dim)}
.pv-more{align-self:flex-start;margin-top:auto;font-size:var(--fs-sm);color:var(--text)}
.pv-more .pv-chev{width:12px;height:12px;transition:transform var(--mov-medio)}
.pv-card:hover .pv-more{background:var(--surface-alt)}
.pv-card:hover .pv-more .pv-chev{transform:translateX(2px)}
/* -- persona modal (reutiliza .dv) -- */
.dv__panel:has(.pm-wrap){max-width:880px}
.pm-wrap{display:flex;gap:26px;align-items:flex-start;flex-wrap:wrap}
.pm-aside{flex:0 0 210px;max-width:210px;display:flex;flex-direction:column;gap:12px}
.pm-avatar{--vtone:var(--vert-other);width:100%;aspect-ratio:3/4;position:relative;border-radius:var(--r-lg);overflow:hidden;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--vtone) 22%,var(--surface));border:1.5px solid color-mix(in srgb,var(--vtone) 42%,var(--rule))}
.pm-avatar img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
.pm-ini{position:absolute;inset:0;display:none;align-items:center;justify-content:center;font-family:var(--display);font-weight:var(--w-fuerte);font-size:var(--fs-4xl);letter-spacing:var(--ls-titulo);color:var(--text)}
.pm-avatar.noimg .pm-ini{display:flex}
.pm-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.pm-main{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:16px}
.pm-idblock{display:flex;flex-direction:column;gap:3px}
.pm-name{font-family:var(--display);font-size:var(--fs-2xl);font-weight:var(--w-fuerte);letter-spacing:var(--ls-medio);line-height:var(--lh-titulo);color:var(--text)}
.pm-rol{font-size:var(--fs-sm);color:var(--text-dim);line-height:var(--lh-normal)}
.pm-perfil{font-size:var(--fs-body);line-height:var(--lh-lectura);color:var(--text)}
.pm-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px}
@media(max-width:640px){.pm-aside{flex-basis:100%;max-width:100%;flex-direction:row;align-items:flex-start}.pm-avatar{width:150px;flex:none}.pm-tags{flex-direction:column;align-items:flex-start}}
/* -- swatch de color junto a hex (motor M4) -- */
.hexsw{display:inline-block;width:14px;height:14px;border-radius:var(--sp-3);border:1px solid color-mix(in srgb,var(--ink) 26%,transparent);vertical-align:-2px;margin-right:var(--sp-4)}
/* -- chips de estado del motor (motor M4) -- */
.est-chip{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-xs);font-weight:var(--w-fuerte);line-height:var(--lh-subtitulo);padding:var(--sp-2) var(--sp-9);border-radius:var(--r-pill);border:var(--hair-soft);color:var(--text);white-space:nowrap;vertical-align:middle}
.est-chip .est-dot{width:7px;height:7px;border-radius:var(--r-circle);flex:none;background:var(--text-soft)}
.est-chip.is-pend{background:color-mix(in srgb,var(--blue) 12%,var(--surface));border-color:color-mix(in srgb,var(--blue) 32%,var(--rule))}
.est-chip.is-pend .est-dot{background:var(--blue)}
.est-chip.is-warn{background:color-mix(in srgb,var(--text) 20%,var(--surface));border-color:color-mix(in srgb,var(--text) 46%,var(--rule))}
.est-chip.is-warn .est-dot{background:var(--text)}
.est-chip.is-ok{background:color-mix(in srgb,var(--lime) 16%,var(--surface));border-color:color-mix(in srgb,var(--lime) 55%,var(--rule));color:var(--on-accent)}
.est-chip.is-ok .est-dot{background:var(--lime);border:1px solid var(--ink);color:var(--on-accent)}
html[data-theme="dark"] .est-chip.is-warn .est-dot{background:var(--text)}
/* --- journey: recorrido horizontal con scroll-x en su contenedor --- */
.jr-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:var(--sp-7)}
.jr-head .blk-t{margin-bottom:0}
.jr-vert{font-size:var(--fs-xs);font-weight:var(--w-fuerte);color:var(--text-dim);text-transform:uppercase;letter-spacing:var(--ls-rotulo)}
.jr-scroll{overflow-x:auto;overflow-y:hidden;padding:var(--sp-1) 0 var(--sp-9)}
.jr-track{display:flex;align-items:stretch;gap:4px;min-width:min-content}
.jr-arrow{flex:0 0 auto;display:flex;align-items:flex-start;padding:var(--sp-13) var(--sp-5) 0;color:var(--text-soft)}
.jr-arrow svg{width:18px;height:18px}
.jr-stage{flex:0 0 clamp(224px,24vw,268px);display:flex;flex-direction:column;gap:10px;background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);box-shadow:var(--sh-1);padding:var(--sp-13)}
.jr-stage-top{display:flex;align-items:center;gap:9px}
.jr-num{width:24px;height:24px;flex:none;border-radius:var(--r-circle);background:var(--ink);color:var(--surface);font-family:var(--display);font-weight:var(--w-fuerte);font-size:var(--fs-sm);display:flex;align-items:center;justify-content:center}
.jr-etapa{font-family:var(--display);font-size:var(--fs-body);font-weight:var(--w-fuerte);letter-spacing:var(--ls-medio);color:var(--text);line-height:var(--lh-subtitulo)}
.jr-think{font-style:italic;font-size:var(--fs-md);line-height:var(--lh-normal);color:var(--text);padding-left:var(--sp-10);border-left:var(--hair-soft)}
.jr-emo-chip{display:inline-block;font-size:var(--fs-xs);font-weight:var(--w-fuerte);padding:var(--sp-5) var(--sp-10);border-radius:var(--r-in);color:var(--text);background:var(--surface-alt);border:var(--hair-soft);line-height:var(--lh-normal);max-width:100%}
.jr-field-l{display:block;font-size:var(--fs-xs);font-weight:var(--w-max);text-transform:uppercase;letter-spacing:var(--ls-rotulo);color:var(--text-dim);margin-bottom:var(--sp-2)}
.jr-field p{font-size:var(--fs-sm);line-height:var(--lh-normal);color:var(--text-dim)}
.jr-opp{background:color-mix(in srgb,var(--lime) 14%,var(--surface));border-radius:var(--r-card);padding:var(--sp-9) var(--sp-11);margin-top:auto;color:var(--on-accent)}
.jr-opp .jr-field-l{color:var(--text)}
.jr-opp p{font-size:var(--fs-sm);line-height:var(--lh-normal);color:var(--text)}
/* --- foda: matriz 2x2, positivo lima suave / riesgo tinta suave --- */
.foda-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:var(--sp-5)}
.foda-q{border-radius:var(--r-lg);padding:var(--sp-13) var(--sp-14);border:var(--hair-soft)}
.foda-q.is-pos{background:color-mix(in srgb,var(--lime) 12%,var(--surface));border-color:color-mix(in srgb,var(--lime) 34%,var(--rule));color:var(--on-accent)}
.foda-q.is-risk{background:color-mix(in srgb,var(--ink) 7%,var(--surface));border-color:color-mix(in srgb,var(--ink) 17%,var(--rule))}
.foda-q-head{display:flex;align-items:center;gap:10px;margin-bottom:var(--sp-11);padding-bottom:var(--sp-9);border-bottom:var(--hair-soft)}
.foda-q-t{font-family:var(--display);font-size:var(--fs-body);font-weight:var(--w-fuerte);color:var(--text);flex:1;min-width:0}
.foda-scope{font-size:var(--fs-xs);font-weight:var(--w-fuerte);text-transform:uppercase;letter-spacing:var(--ls-rotulo);color:var(--text-dim);background:var(--surface);border:var(--hair-soft);border-radius:var(--r-pill);padding:var(--sp-1) var(--sp-8)}
.foda-q-n{font-family:var(--display);font-size:var(--fs-body);font-weight:var(--w-fuerte);color:var(--text);font-variant-numeric:tabular-nums;background:var(--surface);border:var(--hair-soft);border-radius:var(--r-pill);min-width:28px;height:26px;display:inline-flex;align-items:center;justify-content:center;padding:0 var(--sp-7)}
.foda-list{list-style:none;display:flex;flex-direction:column;gap:8px}
.foda-list li{position:relative;padding-left:var(--sp-14);font-size:var(--fs-sm);line-height:var(--lh-normal);color:var(--text)}
.foda-list li::before{content:"";position:absolute;left:3px;top:.55em;width:7px;height:7px;border-radius:var(--r-circle)}
.foda-q.is-pos .foda-list li::before{background:var(--lime);border:1px solid var(--ink);color:var(--on-accent)}
.foda-q.is-risk .foda-list li::before{background:var(--text-soft)}
.foda-empty{color:var(--text-dim);font-style:italic}
@media(max-width:680px){.foda-grid{grid-template-columns:1fr}}
/* --- heuristica: filas con barra de score, o lista honesta sin score --- */
.heur-grid{display:flex;flex-direction:column;gap:16px;margin-top:var(--sp-3)}
.heur-row{display:flex;flex-direction:column;gap:7px}
.heur-head{display:flex;align-items:center;gap:10px}
.heur-n{width:26px;height:26px;flex:none;border-radius:var(--r-pill);var(--surface);border:var(--hair-soft);font-family:var(--display);font-weight:var(--w-fuerte);font-size:var(--fs-sm);color:var(--text);display:inline-flex;align-items:center;justify-content:center}
.heur-name{font-size:var(--fs-body);font-weight:var(--w-fuerte);color:var(--text);line-height:var(--lh-subtitulo);flex:1;min-width:0}
.heur-score{font-family:var(--display);font-size:var(--fs-sm);font-weight:var(--w-fuerte);color:var(--text);font-variant-numeric:tabular-nums;flex:none}
.heur-score--na{color:var(--text-dim);font-weight:var(--w-medio)}
.heur-row .bar-track{height:14px}
.heur-nota{font-size:var(--fs-sm);line-height:var(--lh-normal);color:var(--text-dim)}
.heur-list{display:flex;flex-direction:column;gap:12px;margin-top:var(--sp-3)}
.heur-list .heur-nota{padding-left:var(--sp-19b)}
@media(max-width:560px){.heur-list .heur-nota{padding-left:0}}
.gal-tile figcaption{margin-top:var(--sp-5);font-size:var(--fs-xs);color:var(--text-dim);text-align:center}
.sec-nav{display:flex;justify-content:space-between;gap:10px;margin-top:var(--sp-17);padding-top:var(--sp-13);border-top:var(--hair-soft)}
.src-line{margin-top:var(--sp-16);font-size:var(--fs-xs);color:var(--text-soft)}
.src-line .path{margin-left:var(--sp-3)}
.stat__n--txt{font-size:clamp(1.3rem,3vw,1.9rem);line-height:var(--lh-titulo);word-break:break-word}
.barsh{width:100%;min-width:460px;height:auto}
.barsh .bar-l{fill:var(--text-dim);font-size:var(--t-11b);font-family:var(--font)}
.barsh .bar-track{fill:var(--surface-alt)}
.barsh .bar-fill{fill:var(--lime)}
.barsh .bar-v{fill:var(--text);font-size:var(--t-11b);font-weight:var(--w-fuerte);font-family:var(--font)}
.barsh2{display:flex;flex-direction:column;gap:10px}
.bar-row{display:grid;grid-template-columns:160px 1fr 32px;align-items:center;gap:12px}
.barsh2 .bar-l{font-size:var(--fs-sm);color:var(--text-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-track{height:15px;background:var(--surface-alt);border-radius:var(--r-pill);overflow:hidden}
.bar-fill{height:100%;background:var(--lime);border-radius:var(--r-pill);transition:width var(--mov-lento) ease;color:var(--on-accent)}
.barsh2 .bar-v{font-size:var(--fs-sm);font-weight:var(--w-fuerte);color:var(--text);text-align:left}
@media(max-width:600px){.bar-row{grid-template-columns:110px 1fr 28px}}
/* ============ RESPONSIVE ============ */
@media(max-width:860px){
#app{grid-template-columns:1fr}
#sidebar{position:fixed;left:-110%;top:0;max-width:92vw;transition:left var(--mov-medio)}
#sidebar.open{left:0;box-shadow:var(--sh-3)}
html[data-panel] #side-rail{width:var(--sidebar-w-collapsed);padding:var(--sp-16) var(--sp-7)}
html[data-panel] #side-rail .nav-item>span,
html[data-panel] #side-rail .chev{display:none}
html[data-panel] #side-rail .nav-item{justify-content:center;padding:var(--sp-9)}
html[data-panel] #side-sub{width:min(248px,64vw)}
html[data-panel] .side-logo .logo-word{opacity:var(--op-nada);transform:translate(-10px,-50%)}
html[data-panel] .side-logo .logo-mark{opacity:var(--op-total);transform:translate(-50%,-50%) scale(1) rotate(0deg)}
html[data-panel] .side-top{flex-direction:column;gap:12px;margin:0 0 var(--sp-14)}
#burger{display:inline-flex}
#q{flex:1 1 100%;order:5}
main{padding:var(--sp-16) var(--sp-13)}
.hero{padding:var(--sp-18) var(--sp-16b)}
.hero .star-bg{width:150px;height:150px;right:-28px;top:-28px;opacity:var(--op-medio)}
.atom-wrap{padding:var(--sp-13)}
/* Bug CEO 2026-07-11: en movil el sidebar es off-canvas; el estado "colapsado" del rail (concepto de escritorio) NO debe estrechar el menu ni ocultar sus etiquetas. Se muestra siempre completo. El boton de colapsar cierra el menu via JS, no deja un rail encima del contenido. */
html[data-side="collapsed"] #side-rail{width:var(--sidebar-w);padding:var(--sp-16) var(--sp-7)}
html[data-side="collapsed"] #side-rail .nav-item>span,
html[data-side="collapsed"] #side-rail .chev{display:inline}
html[data-side="collapsed"] #side-rail .nav-item{justify-content:flex-start;padding:var(--sp-9) var(--sp-11)}
html[data-side="collapsed"] .side-logo .logo-word{opacity:var(--op-total);transform:translate(0,-50%)}
html[data-side="collapsed"] .side-top{flex-direction:row}
html[data-side="collapsed"] .side-logo{flex:1 1 auto;width:auto;height:34px}
}
@media(max-width:600px){
.hero h1{font-size:clamp(1.7rem,8vw,2.2rem)}
.hero .star-bg{width:118px;height:118px;opacity:var(--op-tenue)}
.stat-grid{grid-template-columns:repeat(2,1fr)}
}
/* Movil (canon CEO 2026-07-11): zoom de texto fuera; el boton del menu abierto es una X de cerrar, no el chevron de colapsar */
@media(max-width:860px){
.zoom{display:none}
#side-toggle{position:relative}
#side-toggle svg{display:none}
#side-toggle::before,#side-toggle::after{content:"";position:absolute;left:50%;top:50%;width:17px;height:2px;background:currentColor;border-radius:var(--sp-1)}
#side-toggle::before{transform:translate(-50%,-50%) rotate(45deg)}
#side-toggle::after{transform:translate(-50%,-50%) rotate(-45deg)}
}
/* ============ MAPA DEL SISTEMA (grafo agentico Obsidian) ============ */
/* Regla del brand: SOLO el lienzo (.agm-stage / #agm-cvs) es dark/techy.
Todo lo demas (panel, arbol, aristas, leyenda, salud, ficha, buscador,
zoom, titulo) usa las superficies y tokens del kit OH WOW!, en claro Y oscuro. */
.agm-head{margin-bottom:var(--sp-13)}
.agm-title{font-size:var(--fs-h1);text-transform:none;letter-spacing:normal;margin-bottom:var(--sp-3)}
.agm-sub{font-size:var(--fs-sm);max-width:680px;line-height:var(--lh-normal)}
/* --- buscador en fila propia, ancho completo (nombres largos) --- */
.agm-searchrow{margin-bottom:var(--sp-13)}
.agm-search{position:relative;width:100%}
#agm-q{width:100%;padding:var(--sp-10) var(--sp-13);border:var(--hair-soft);border-radius:var(--r-in);background:var(--surface);font-size:var(--fs-md);outline:none;transition:border-color var(--mov-rapido),box-shadow var(--mov-rapido)}
#agm-q:focus{border-color:var(--ink);box-shadow:var(--sh-1)}
.agm-res{position:absolute;top:calc(100% + 6px);left:0;right:0;background:var(--surface);border:var(--hair-soft);border-radius:var(--r-in);max-height:340px;overflow:auto;box-shadow:var(--sh-2);display:none;z-index:var(--capa-pegado);padding:var(--sp-4)}
.agm-res.on{display:block}
.agm-r{display:flex;align-items:flex-start;gap:9px;width:100%;text-align:left;padding:var(--sp-8) var(--sp-10);border-radius:var(--r-md);background:none}
.agm-r:hover{background:var(--surface-alt)}
.agm-rdot{width:8px;height:8px;border-radius:var(--r-circle);flex:none;margin-top:var(--sp-5)}
.agm-rt{font-size:var(--fs-md);flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.agm-rname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.agm-rty{margin-left:auto;font-size:var(--fs-xs);color:var(--text-dim);white-space:nowrap;flex:none;margin-top:var(--sp-1)}
.agm-empty{padding:var(--sp-11);text-align:center;color:var(--text-dim);font-size:var(--fs-sm)}
/* --- cuerpo: panel brand (izq) + lienzo dark (der) --- */
.agm-body{display:flex;gap:16px;align-items:stretch;position:relative;min-width:0}
.agm-panel{flex:0 0 274px;width:274px;align-self:stretch;max-height:min(76vh,760px);overflow-y:auto;
background:var(--surface);border:var(--hair-soft);border-radius:var(--r-lg);box-shadow:var(--sh-1)}
.agm-phead{display:none;align-items:center;justify-content:space-between;padding:var(--sp-12) var(--sp-13);border-bottom:var(--hair-soft);
font-family:var(--display);font-weight:var(--w-fuerte);font-size:var(--fs-body);position:sticky;top:0;background:var(--surface);z-index:var(--capa-fondo)}
.agm-pclose{width:28px;height:28px;border-radius:var(--r-md);border:var(--hair-soft);background:var(--surface-alt);color:var(--text-dim);display:grid;place-items:center;font-size:var(--t-13)}
.agm-pclose:hover{color:var(--text)}
.agm-ptoggle{display:none}
.agm-backdrop{display:none}
/* --- drawers colapsables (brand) --- */
.agm-drawer{border-top:var(--hair-soft)}
.agm-drawer:first-child{border-top:none}
.agm-dh{display:flex;align-items:center;gap:9px;padding:var(--sp-11b) var(--sp-12b);cursor:pointer;font-size:var(--fs-sm);font-weight:var(--w-max);
letter-spacing:var(--ls-rotulo);color:var(--text);font-family:var(--display)}
.agm-dh:hover{color:var(--ink)}
.agm-car{color:var(--text-soft);font-size:var(--t-9b);transition:transform var(--mov-rapido);flex:none}
.agm-car.open{transform:rotate(90deg)}
.agm-collapse{margin-left:auto;font-size:var(--fs-xs);font-weight:var(--w-fuerte);letter-spacing:0;text-transform:none;color:var(--text-dim);
padding:var(--sp-2) var(--sp-8);border-radius:var(--r-pill);border:var(--hair-soft);background:var(--surface-alt);font-family:var(--font)}
.agm-collapse:hover{color:var(--text);border-color:var(--ink)}
.agm-dc{display:none;padding:0 var(--sp-11) var(--sp-12)}
.agm-dc.on{display:block}
/* --- arbol del sistema --- */
#agm-tree{max-height:340px;overflow-y:auto;padding:var(--sp-1) var(--sp-1) var(--sp-5)}
.agm-trow{display:flex;align-items:center;gap:7px;padding:var(--sp-4) var(--sp-7);border-radius:var(--r-md);cursor:pointer;transition:background var(--mov-rapido),color var(--mov-rapido)}
.agm-trow:hover{background:var(--surface-alt)}
.agm-trow.sel{background:var(--lime);color:var(--on-accent)}
.agm-tcar{width:10px;flex:none;color:var(--text-soft);font-size:var(--t-8);transition:transform var(--mov-rapido)}
.agm-trow.sel .agm-tcar{color:var(--ink)}
.agm-tcar.open{transform:rotate(90deg)}
.agm-tdot{width:8px;height:8px;border-radius:var(--r-circle);flex:none}
.agm-tnm{flex:1;min-width:0;font-size:var(--fs-sm);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.agm-tcnt{font-size:var(--fs-xs);color:var(--text-dim);flex:none;var(--surface);border-radius:var(--r-pill);padding:var(--sp-0) var(--sp-6)}
.agm-trow.sel .agm-tcnt{background:var(--shade-soft);color:var(--ink)}
.agm-tkids{margin-left:var(--sp-1)}
/* --- aristas visibles (checkboxes) --- */
.agm-flt{display:flex;align-items:center;gap:9px;padding:var(--sp-5) var(--sp-6);border-radius:var(--r-md);cursor:pointer;font-size:var(--fs-sm)}
.agm-flt:hover{background:var(--surface-alt)}
.agm-flt input{width:15px;height:15px;flex:none;accent-color:var(--ink);cursor:pointer}
.agm-fsw{width:16px;height:3px;border-radius:var(--sp-1);flex:none}
.agm-ftx{flex:1;min-width:0}
/* --- leyenda de capas --- */
.agm-leg{display:flex;align-items:center;gap:9px;padding:var(--sp-3) var(--sp-6);font-size:var(--fs-sm);color:var(--text)}
.agm-lsw{width:11px;height:11px;border-radius:var(--r-circle);flex:none}
/* --- salud de datos --- */
.agm-hnote{font-size:var(--fs-xs);color:var(--text-dim);line-height:var(--lh-normal);padding:var(--sp-1) var(--sp-3) var(--sp-8)}
.agm-hrow{border-top:var(--hair-soft);padding:var(--sp-1) 0}
.agm-htop{display:flex;align-items:center;gap:8px;cursor:pointer;padding:var(--sp-6) var(--sp-3)}
.agm-hcar{color:var(--text-soft);font-size:var(--t-9b);transition:transform var(--mov-rapido);flex:none}
.agm-pill{font-size:var(--fs-2xs);font-weight:var(--w-max);letter-spacing:.03em;padding:var(--sp-1) var(--sp-7);border-radius:var(--r-pill);color:var(--on-solid);flex:none}
.agm-pill-solida{background:var(--ok)}
.agm-pill-parcial{background:var(--warn)}
.agm-pill-debil{background:var(--danger)}
.agm-htitle{flex:1;min-width:0;font-size:var(--fs-sm);color:var(--text);line-height:var(--lh-subtitulo)}
.agm-hfrac{font-size:var(--fs-xs);color:var(--text-dim);flex:none;font-variant-numeric:tabular-nums}
.agm-hdet{display:none;padding:0 var(--sp-3) var(--sp-9) var(--sp-15)}
.agm-hrow.open .agm-hdet{display:block}
.agm-hp{font-size:var(--fs-sm);color:var(--text-dim);line-height:var(--lh-normal);margin:0 0 var(--sp-5)}
.agm-hp b{color:var(--text)}
/* --- lienzo (dark, unica zona que rompe el brand) --- */
.agm-stage{position:relative;flex:1;min-width:0;height:min(76vh,760px);min-height:520px;border-radius:var(--r-lg);
overflow:hidden;background:#0b0e15;box-shadow:var(--sh-2);border:var(--hair-soft)}
#agm-cvs{width:100%;height:100%;display:block;cursor:grab}
#agm-cvs.drag{cursor:grabbing}
.agm-zoom{position:absolute;right:14px;bottom:14px;display:flex;flex-direction:column;gap:6px;z-index:var(--capa-fondo)}
.agm-zoom button{width:34px;height:34px;border-radius:var(--r-9);border:1px solid var(--veil-light);
background:rgba(10,14,21,.62);backdrop-filter:blur(7px);color:#d6d9e2;font-size:var(--t-16);display:grid;place-items:center}
.agm-zoom button:hover{border-color:var(--lime);color:var(--on-solid)}
/* --- ficha de nodo (brand, overlay sobre el lienzo) --- */
/* La ficha se lee por encima de TODO lo que vive en el lienzo (nodos, controles
de zoom): sin z-index propio se apilaba por orden del DOM y los botones de
zoom le pasaban por encima, molestando la lectura. */
.agm-ficha{position:absolute;top:14px;right:14px;width:min(360px,calc(100% - 28px));max-height:calc(100% - 28px);z-index:var(--capa-fondo);
overflow:auto;background:var(--surface);border:var(--hair-soft);border-radius:var(--r-card);box-shadow:var(--sh-3);
padding:var(--sp-14) var(--sp-14) var(--sp-15);transform:translateX(calc(100% + 24px));opacity:var(--op-nada);transition:transform var(--mov-medio) var(--ease),opacity var(--mov-medio);pointer-events:none}
.agm-ficha.on{transform:none;opacity:var(--op-total);pointer-events:auto}
.agm-fclose{position:absolute;top:12px;right:12px;width:28px;height:28px;border-radius:var(--r-md);border:var(--hair-soft);background:var(--surface-alt);color:var(--text-dim);display:grid;place-items:center;font-size:var(--t-13)}
.agm-fclose:hover{color:var(--text)}
.agm-badge{display:inline-block;font-size:var(--fs-sm);font-weight:var(--w-fuerte);letter-spacing:.01em;padding:var(--sp-4) var(--sp-11);border-radius:var(--r-pill);color:#10131a}
.agm-ftitle{font-size:var(--fs-xl);margin:var(--sp-10) 0 var(--sp-12);line-height:var(--lh-subtitulo);word-break:break-word}
.agm-card{var(--surface);border-radius:var(--r-in);padding:var(--sp-11b) var(--sp-12);margin-bottom:var(--sp-10)}
.agm-h{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:var(--ls-rotulo-ancho);color:var(--text-dim);font-weight:var(--w-max);margin-bottom:var(--sp-5)}
.agm-p{font-size:var(--fs-md);color:var(--text);line-height:var(--lh-normal);margin:0}
.agm-p.agm-dim{color:var(--text-dim)}
.agm-krow{display:flex;align-items:center;gap:9px;padding:var(--sp-6) 0;border-top:var(--hair-soft)}
.agm-krow:first-of-type{border-top:none}
.agm-kbar{width:9px;height:9px;border-radius:var(--sp-1);flex:none}
.agm-kname{font-size:var(--fs-sm);color:var(--text)}
.agm-kn{margin-left:auto;font-size:var(--fs-sm);color:var(--text-dim)}
.agm-plain{font-size:var(--fs-xs);color:var(--text-dim);margin:-2px 0 var(--sp-4) var(--sp-14)}
.agm-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--sp-7)}
.agm-chip{font-size:var(--fs-xs);padding:var(--sp-3) var(--sp-8);border-radius:var(--r-md);background:var(--surface);border:var(--hair-soft);color:var(--text);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.agm-chip:hover{border-color:var(--ink)}
.agm-chip.agm-more{opacity:var(--op-casi);cursor:default}
/* --- responsive: el panel colapsa a drawer off-canvas --- */
@media(max-width:880px){
.agm-body{display:block}
.agm-ptoggle{display:inline-flex;align-items:center;gap:8px;margin-bottom:var(--sp-11);padding:var(--sp-8) var(--sp-12b);border-radius:var(--r-pill);
border:var(--hairline);background:var(--surface);color:var(--text);font-weight:var(--w-fuerte);font-size:var(--fs-sm);font-family:var(--display);box-shadow:var(--sh-1)}
.agm-ptoggle:hover{background:var(--surface-alt)}
.agm-panel{position:fixed;top:0;left:0;bottom:0;width:min(320px,86vw);max-height:100vh;z-index:var(--capa-ventana);border-radius:0;
border:none;border-right:var(--hair-soft);transform:translateX(-105%);transition:transform var(--mov-medio) var(--ease);box-shadow:var(--sh-3)}
.agm-panel.open{transform:none}
.agm-phead{display:flex}
.agm-backdrop{position:fixed;inset:0;background:var(--shade);z-index:var(--capa-ventana);opacity:var(--op-nada);pointer-events:none;transition:opacity var(--mov-medio);display:block}
.agm-backdrop.on{opacity:var(--op-total);pointer-events:auto}
#agm-tree{max-height:none}
.agm-stage{height:min(66vh,560px);min-height:420px}
.agm-ficha{width:calc(100% - 20px);left:10px;right:10px;top:auto;bottom:10px;max-height:56%;transform:translateY(calc(100% + 24px))}
.agm-ficha.on{transform:none}
}
/* ============ REBRAND DEL MAPA A LA WEB ohwow.es ============
Override de tokens SOLO dentro de #agmap-root: rebrandea TODO el chrome del mapa
(panel, arbol, filtros, salud, ficha, buscador, leyenda) al brand editorial de la
web ohwow.es (crema #FDF8F2, tinta #252525, lima #C1FE1A, Space Grotesk + Inter,
esquinas rectas). No toca el motor ni el resto del dashboard; el lienzo sigue
Obsidian. Fuentes via en index.html. ============ */
#agmap-root{
--bg:#FDF8F2; --surface:#FDF8F2; --white:var(--on-solid); --surface-alt:#F3ECE1;
--ink:var(--text); --text:var(--text); --text-dim:#6f6a63; --text-soft:#9a938a;
--rule:rgba(37,37,37,.16); --lime:var(--accent);
--r-lg:4px; --r-card:4px; --r-in:4px;
--font:'Inter',system-ui,-apple-system,sans-serif;
--display:'Space Grotesk','Inter',system-ui,sans-serif;
font-family:'Inter',system-ui,-apple-system,sans-serif;
}
#agmap-root .agm-title,#agmap-root .agm-ftitle{letter-spacing:var(--ls-titulo)}
#agmap-root .agm-dh{text-transform:uppercase;letter-spacing:.11em;font-size:var(--fs-xs)}
#agmap-root .agm-badge{text-transform:uppercase;letter-spacing:var(--ls-rotulo-ancho);font-size:var(--fs-2xs);padding:var(--sp-4) var(--sp-11)}
#agmap-root .agm-h{letter-spacing:var(--ls-rotulo-ancho)}
#agmap-root .agm-chip{border-radius:var(--r-pill)}
/* ============================================================================
SELECTOR DE FILTRO OH WOW! (componente del kit, portado 2026-07-28)
El desplegable de un