/* Edición retail — hoja ÚNICA de «Mi planeación patrimonial», la vista familiar y la activación.
   Los tokens vienen de tokens.css (enlazada antes). Móvil primero: columna de 560 px, márgenes de 18 px
   y navegación inferior fija; desde 900 px, barra lateral de 240 px y contenido de 880 px.
   Objetivos táctiles ≥44 px, campos a 16 px (iOS no hace zoom), foco visible, cifras tabulares.
   El dorado solo marca la posición activa y el acento funcional; el semáforo (verde/ámbar/rojo)
   solo comunica estado y siempre con texto. Nada de gradientes ni sombras decorativas. */
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0}
body{background:var(--bg);color:var(--ink);font:500 15px/1.55 var(--font-sans);-webkit-font-smoothing:antialiased;min-height:100dvh}
a{color:var(--accent)}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding-left:1.25em}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r-xs)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.num,.monto{font-variant-numeric:tabular-nums}
.monto{white-space:nowrap;font-weight:650}
.meta{color:var(--muted);font-size:13px}
.muted{color:var(--muted)}
.skip{position:absolute;left:var(--sp-3);top:-56px;z-index:var(--z-toast);background:var(--surface);color:var(--accent);padding:var(--sp-4) var(--sp-6);border:1px solid var(--accent-border);border-radius:var(--r-sm);font-weight:650}
.skip:focus{top:var(--sp-3)}
.ico{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* ── cabecera y navegación ───────────────────────────────────────────────── */
.top{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-7) var(--sp-8) var(--sp-5);max-width:560px;margin:0 auto;width:100%}
.glyph{width:32px;height:32px;flex:none}
.brand{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.brand b{font:600 17px/1.2 var(--font-serif)}
.brand span{font-size:12px;color:var(--muted)}
.cuenta-btn{margin-left:auto;display:inline-flex;align-items:center;gap:var(--sp-3);min-height:44px;padding:0 var(--sp-6);border:1px solid var(--accent-border);border-radius:var(--r-pill);background:transparent;color:var(--accent);font:650 14px var(--font-sans);cursor:pointer}
.cuenta-btn:hover{background:var(--accent-dim)}
.tabs{position:fixed;left:0;right:0;bottom:0;z-index:var(--z-nav);display:flex;background:var(--surface);border-top:1px solid var(--border);padding:var(--sp-2) var(--sp-3) calc(var(--sp-4) + env(safe-area-inset-bottom))}
.tab{position:relative;flex:1;min-width:0;min-height:48px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-1);font:650 11.5px/1.1 var(--font-sans);color:var(--muted);text-decoration:none;border-radius:var(--r-sm)}
.tab .ico{width:20px;height:20px}
.tab[aria-current="page"]{color:var(--accent)}
.tab[aria-current="page"]::before{content:"";position:absolute;top:calc(-1 * var(--sp-2));left:24%;right:24%;height:3px;border-radius:0 0 3px 3px;background:var(--gold)}
.shell{width:100%}
.col{max-width:560px;margin:0 auto;padding:0 var(--sp-8) calc(104px + env(safe-area-inset-bottom))}
.demo-banda{margin:0 calc(-1 * var(--sp-8)) var(--sp-5);padding:var(--sp-3) var(--sp-8);background:var(--gold-dim);color:var(--gold-ink);font:650 13px/1.4 var(--font-sans);border-bottom:1px solid var(--gold-border)}
main#vista{display:flex;flex-direction:column;gap:var(--sp-7);outline:none;padding-top:var(--sp-3)}
main#vista>h1,.wiz>h1{outline:none}
main#vista section:not(.card),.wiz section,#listas{display:flex;flex-direction:column;gap:var(--sp-5)}
#listas{gap:calc(var(--sp-7) * 1.5)}
#frmObj{display:flex;flex-direction:column;gap:var(--sp-7)}
#frmObj .grupo{margin:0}
.legal{margin-top:calc(var(--sp-7) * 2);padding-top:var(--sp-7);border-top:1px solid var(--border);color:var(--muted);font-size:13px;line-height:1.55}

/* ── tipografía de títulos ───────────────────────────────────────────────── */
h1{font:600 26px/1.15 var(--font-serif);letter-spacing:-.005em}
.h-sec{font:600 21px/1.2 var(--font-serif);margin-bottom:var(--sp-4)}
.h-card{font:650 16px/1.3 var(--font-sans)}
h3{font:650 16px/1.3 var(--font-sans)}
h4{font:700 12px/1.3 var(--font-sans);letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin:var(--sp-5) 0 var(--sp-1)}
.eyebrow{font:700 12px/1.2 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--gold-ink)}
.previo{color:var(--muted);font-size:14px}
.cab-v{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-5)}

/* ── piezas ───────────────────────────────────────────────────────────────── */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-7);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:var(--sp-4);min-width:0}
.card.flat{background:var(--surface-2);border-color:transparent;box-shadow:none}
.card.gold{border-color:var(--gold-border)}
.card.warn{border-color:var(--warn-border)}
.card.sig{border-color:var(--accent-border)}
.card.sig h2{font:600 22px/1.2 var(--font-serif)}
.vacio{color:var(--muted);text-align:center;padding:var(--sp-7) 0}
.pill{display:inline-flex;align-items:center;font:600 12.5px/1.3 var(--font-sans);padding:var(--sp-1) var(--sp-4);border-radius:var(--r-pill);border:1px solid var(--border-2);color:var(--muted);background:transparent}
.pill.ok{color:var(--ok);background:var(--ok-dim);border-color:transparent}
.pill.warn{color:var(--warn);background:var(--warn-dim);border-color:transparent}
.pill.danger{color:var(--danger);background:var(--danger-dim);border-color:transparent}
.pill.acento{color:var(--accent);background:var(--accent-dim);border-color:transparent}
.pills{display:flex;flex-wrap:wrap;gap:var(--sp-3)}
.msg{margin:0;padding:var(--sp-5) var(--sp-6);border-radius:var(--r);font-size:14px;display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-3)}
.msg.err{background:var(--danger-dim);color:var(--danger)}
.msg.warn{background:var(--warn-dim);color:var(--warn)}
.msg.ok{background:var(--ok-dim);color:var(--ok)}
.msg .btn{margin-top:var(--sp-1)}
.callout{background:var(--accent-dim);border-radius:var(--r);padding:var(--sp-6);font-size:14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-3);font:650 15px/1.2 var(--font-sans);color:var(--accent-ink);background:var(--accent);border:1px solid var(--accent);border-radius:var(--r);padding:var(--sp-4) var(--sp-7);min-height:48px;cursor:pointer;text-decoration:none;transition:opacity var(--t) var(--ease),background var(--t) var(--ease)}
.btn:hover{opacity:.92;text-decoration:none}
.btn.alt{color:var(--accent);background:transparent;border-color:var(--accent-border)}
.btn.alt:hover{background:var(--accent-dim);opacity:1}
.btn.mini{min-height:44px;padding:var(--sp-3) var(--sp-6);font-size:14px}
.btn.full{width:100%}
.btn.peligro{background:var(--danger);border-color:var(--danger);color:var(--accent-ink)}
.btn.peligro.alt{background:transparent;color:var(--danger);border-color:var(--danger)}
.btn.peligro.alt:hover{background:var(--danger-dim)}
.btn[disabled]{opacity:.55;cursor:not-allowed}

/* ── formularios ─────────────────────────────────────────────────────────── */
.f{display:flex;flex-direction:column;gap:var(--sp-2);min-width:0}
.f>label,.f>.lbl,label.f,legend{font:650 14px/1.35 var(--font-sans);color:var(--ink)}
label.f{gap:var(--sp-2)}
.req,.opcional{font-weight:500;color:var(--muted);font-size:13px}
.ayuda{color:var(--muted);font-size:13px;font-weight:500}
.input{display:block;width:100%;font:500 16px/1.4 var(--font-sans);color:var(--ink);background:var(--surface);border:1px solid var(--border-2);border-radius:var(--r);padding:var(--sp-4) var(--sp-5);min-height:44px}
textarea.input{resize:vertical;min-height:96px}
.input[aria-invalid="true"]{border-color:var(--danger);box-shadow:0 0 0 1px var(--danger)}
.input:disabled{background:var(--surface-2);color:var(--muted)}
.err{color:var(--danger);font-size:13.5px;font-weight:600}
.prev{color:var(--accent);font-size:13px;font-weight:600;min-height:0}
.prev:empty{display:none}
.contador{color:var(--muted);font-size:13px;text-align:right}
.grupo{border:0;padding:0;margin:0 0 var(--sp-5);min-width:0;display:flex;flex-direction:column;gap:var(--sp-3)}
.grupo legend{padding:0;margin-bottom:var(--sp-3)}
.opt{display:flex;align-items:flex-start;gap:var(--sp-5);padding:var(--sp-5) var(--sp-6);min-height:52px;background:var(--surface);border:1px solid var(--border-2);border-radius:var(--r);cursor:pointer}
.opt input{width:20px;height:20px;margin:2px 0 0;flex:none;accent-color:var(--accent)}
.opt>span{display:flex;flex-direction:column;gap:var(--sp-1);min-width:0}
.opt small{color:var(--muted);font-size:13px;font-weight:500}
.opt.compacta{min-height:44px;align-items:center;padding-block:var(--sp-3)}
.opt.compacta input{margin:0}
.opt:has(input:checked){border-color:var(--accent);background:var(--accent-dim)}
.opt:has(input:disabled){opacity:.6;cursor:not-allowed}
.opt:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.sin-ent{margin-top:var(--sp-3)}
.chk{display:flex;align-items:flex-start;gap:var(--sp-4);font-weight:600;min-height:44px;cursor:pointer}
.chk input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--accent);flex:none}
.chips{display:flex;flex-wrap:wrap;gap:var(--sp-3)}
.chip{display:inline-flex;align-items:center;gap:var(--sp-2);background:var(--accent-dim);border-radius:var(--r-pill);padding:var(--sp-1) var(--sp-1) var(--sp-1) var(--sp-5);font-weight:600}
.chip button{min-width:44px;min-height:44px;margin:-8px 0;border:0;background:none;color:var(--accent);font:700 20px var(--font-sans);cursor:pointer;border-radius:var(--r-pill)}
.mas{border:1px solid var(--border);border-radius:var(--r);padding:0 var(--sp-6);background:var(--surface)}
.mas>summary{min-height:44px;display:flex;align-items:center;font-weight:650;cursor:pointer;color:var(--accent)}
.mas[open]{padding-bottom:var(--sp-6)}
.mas[open]>summary{margin-bottom:var(--sp-3)}
.mas[open]>.f{margin-top:var(--sp-5)}
.prop-fila{display:grid;grid-template-columns:1fr;gap:var(--sp-4);padding:var(--sp-6);border:1px solid var(--border);border-radius:var(--r);margin-bottom:var(--sp-4);background:var(--surface-2)}
.prop-fila .btn{justify-self:start}
.valor{border:1px solid var(--border);border-radius:var(--r);padding:var(--sp-6);gap:var(--sp-5)}
.valor .chk{font-weight:650}

/* ── diálogos ────────────────────────────────────────────────────────────── */
dialog{--dp:20px;border:0;border-radius:var(--r-xl);padding:0;background:var(--surface);color:var(--ink);width:min(calc(100vw - 24px),540px);max-height:min(92dvh,860px);overflow:auto;box-shadow:var(--shadow-lg)}
dialog::backdrop{background:var(--overlay)}
dialog>form{padding:var(--dp);display:flex;flex-direction:column;gap:var(--sp-5)}
dialog h2{font:600 21px/1.2 var(--font-serif)}
.dlg-cuerpo{display:flex;flex-direction:column;gap:var(--sp-5)}
.dlg-acc{position:sticky;bottom:0;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--sp-4);margin:var(--sp-3) calc(-1 * var(--dp)) calc(-1 * var(--dp));padding:var(--sp-6) var(--dp);background:var(--surface);border-top:1px solid var(--border)}
.dlg-acc .btn{flex:1 1 140px}
dialog.ocupado{cursor:progress}
dialog.ocupado .btn{opacity:.6;pointer-events:none}
.opciones{display:grid;gap:var(--sp-4)}
.btn.opcion{flex-direction:column;align-items:flex-start;gap:var(--sp-1);text-align:left;font-weight:500}
.btn.opcion b{font-weight:650}
.btn.opcion small{color:var(--muted);font-size:13px}
.enum{display:flex;flex-direction:column;gap:var(--sp-3);padding-left:1.2em}
.aviso{position:fixed;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translateX(-50%) translateY(8px);z-index:var(--z-toast);max-width:min(92vw,440px);margin:0;padding:var(--sp-5) var(--sp-7);border-radius:var(--r);background:var(--ink);color:var(--accent-ink);font-size:14px;box-shadow:var(--shadow-md);opacity:0;pointer-events:none;transition:opacity var(--t-slow) var(--ease),transform var(--t-slow) var(--ease)}
.aviso.on{opacity:1;transform:translateX(-50%)}

/* ── tarjetas de registro ────────────────────────────────────────────────── */
.lista{display:flex;flex-direction:column;gap:var(--sp-5)}
.item{gap:var(--sp-3)}
.item-cab{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:var(--sp-3) var(--sp-7)}
.item-t{flex:1 1 200px;min-width:0}
.item-nom{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.item-v{display:flex;flex-direction:column;align-items:flex-start;gap:var(--sp-1);flex:0 0 auto;max-width:100%}
.item-acc{display:flex;flex-wrap:wrap;gap:var(--sp-3);margin-top:var(--sp-2)}
.pers{list-style:none;padding:0;display:flex;flex-direction:column;gap:var(--sp-3)}
.pers li{display:flex;flex-direction:column}
.rel{display:flex;flex-direction:column;gap:var(--sp-3)}
.filtros{display:grid;grid-template-columns:1fr;gap:var(--sp-5);align-items:end}
.docs{list-style:none;padding:0;display:flex;flex-direction:column;gap:var(--sp-4)}
.doc{display:grid;grid-template-columns:1fr auto;gap:var(--sp-3) var(--sp-5);align-items:center;padding:var(--sp-6);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg)}
.doc-t{display:flex;flex-direction:column;min-width:0;overflow-wrap:anywhere}
.doc-t small{color:var(--muted);font-size:13px}
.doc .btn{grid-column:1/-1;justify-self:start}

/* ── inicio ──────────────────────────────────────────────────────────────── */
.lista-av{list-style:none;padding:0;display:flex;flex-direction:column}
.lista-av li{display:flex;align-items:center;gap:var(--sp-5);padding:var(--sp-4) 0;border-bottom:1px solid var(--border);flex-wrap:wrap}
.lista-av li:last-child{border-bottom:0}
.lista-av .txt{display:flex;flex-direction:column;flex:1 1 160px;min-width:0}
.lista-av small{color:var(--muted);font-size:13px}
.marca{width:24px;height:24px;border-radius:50%;border:1.5px solid var(--border-2);display:inline-grid;place-items:center;flex:none;color:var(--accent-ink)}
.marca .ico{width:14px;height:14px;stroke-width:2}
.lista-av li.ok .marca,.etapas li.hecha .marca{background:var(--accent);border-color:var(--accent)}
progress{-webkit-appearance:none;appearance:none;width:100%;max-width:220px;height:8px;border:0;border-radius:var(--r-pill);background:var(--surface-2);vertical-align:middle;overflow:hidden}
progress::-webkit-progress-bar{background:var(--surface-2);border-radius:var(--r-pill)}
progress::-webkit-progress-value{background:var(--accent);border-radius:var(--r-pill);transition:width var(--t-slow) var(--ease)}
progress::-moz-progress-bar{background:var(--accent);border-radius:var(--r-pill)}
.etapas{list-style:none;padding:0;display:flex;flex-direction:column;gap:var(--sp-4)}
.etapas li{display:flex;align-items:center;gap:var(--sp-5);color:var(--muted)}
.etapas li.ahora{color:var(--ink);font-weight:700}
.etapas li.ahora .marca{border-color:var(--gold);background:var(--gold-dim)}
.etapas li.hecha{color:var(--ink)}
.recs,.riesgos,.abiertas{list-style:none;padding:0;display:flex;flex-direction:column;gap:var(--sp-5)}
.rec{gap:var(--sp-3)}
.rec-t{font-weight:700}
.pasos{display:flex;flex-direction:column;gap:var(--sp-3)}

/* ── recorrido ───────────────────────────────────────────────────────────── */
.wiz{display:flex;flex-direction:column;gap:var(--sp-7)}
.wiz-n{font:700 12px/1 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--gold-ink)}
.wiz-bar{max-width:none}
.estado-g{min-height:1.4em;font-size:14px;color:var(--muted)}
.estado-g.err{color:var(--danger);font-weight:600}
.wiz-acc{display:flex;flex-wrap:wrap;gap:var(--sp-4)}
.wiz-acc .btn{flex:1 1 160px}
.desc{display:flex;flex-direction:column;gap:var(--sp-3);list-style:none;padding:0}
.desc li{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3) var(--sp-5);justify-content:space-between}

/* ── tablas (se apilan por debajo de 900 px) ─────────────────────────────── */
.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl caption{text-align:left}
.tbl th,.tbl td{text-align:left;vertical-align:top;padding:var(--sp-5) var(--sp-5);border-bottom:1px solid var(--border)}
.tbl thead th{font:700 12px/1.3 var(--font-sans);letter-spacing:.07em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--border-2)}
.tbl tbody th{font-weight:700}
.tbl td p{margin-bottom:var(--sp-3)}
.tbl ul{padding-left:1.1em;display:flex;flex-direction:column;gap:var(--sp-1)}
.c-cambiar{text-align:right!important;white-space:nowrap}
@media (max-width:899px){
  .tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tbl,.tbl tbody,.tbl tr,.tbl th,.tbl td{display:block}
  .tbl tr{padding:var(--sp-5) 0;border-bottom:1px solid var(--border-2)}
  .tbl th,.tbl td{border:0;padding:var(--sp-1) 0}
  .tbl td[data-l]::before{content:attr(data-l);display:block;font:700 12px/1.3 var(--font-sans);letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-top:var(--sp-3)}
  .tbl.resumen tr{display:grid;grid-template-columns:1fr auto;column-gap:var(--sp-5)}
  .tbl.resumen th{grid-column:1/-1}
  .tbl.resumen .c-cambiar{align-self:end}
  .tbl.resumen td::before{display:none}
  .c-cambiar{text-align:left!important}
}

/* ── plan ────────────────────────────────────────────────────────────────── */
.franja{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3) var(--sp-5);font-size:14px;color:var(--muted);font-weight:600}
.barra-plan{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--sp-5)}
.barra-plan .f{flex:1 1 220px}
.alts{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-5)}
.alt ol,.alt ul{display:flex;flex-direction:column;gap:var(--sp-1)}
.refs{color:var(--muted);font-size:13px}
.cifras{display:flex;flex-direction:column;gap:var(--sp-3)}
.cifra{border:1px solid var(--border);border-radius:var(--r);background:var(--surface);padding:0 var(--sp-5)}
.cifra>summary{min-height:44px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-1) var(--sp-5);cursor:pointer;padding:var(--sp-2) 0}
.c-et{font-weight:600;flex:1 1 180px;min-width:0}
.c-v{color:var(--accent)}
.cifra dl{padding:var(--sp-3) 0 var(--sp-5);display:grid;gap:var(--sp-1);font-size:14px}
.cifra dt{font:700 12px/1.3 var(--font-sans);letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-top:var(--sp-3)}
.fuentes{display:flex;flex-direction:column;gap:var(--sp-5)}
.fuentes li{overflow-wrap:anywhere}
.fuentes li small{display:block;color:var(--muted);font-size:13px;margin:var(--sp-1) 0 var(--sp-2)}
.fuentes-m{display:flex;flex-direction:column;gap:var(--sp-3);margin:var(--sp-3) 0}

/* ── preguntar ───────────────────────────────────────────────────────────── */
.contexto{color:var(--muted)}
.cuenta{font-size:14px;color:var(--muted)}
.cuenta.tope{color:var(--danger);font-weight:650}
.chat{display:flex;flex-direction:column;gap:var(--sp-5)}
.m{display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--sp-6);border-radius:var(--r-lg);max-width:100%;overflow-wrap:anywhere}
.m-l{font:700 12px/1.3 var(--font-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.m-t>*+*{margin-top:var(--sp-3)}
.m-u{align-self:flex-end;max-width:92%;background:var(--accent-dim);border:1px solid var(--accent-border);border-bottom-right-radius:var(--r-xs)}
.m-a{align-self:stretch;background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--accent);border-bottom-left-radius:var(--r-xs)}
.m-a.err{border-left-color:var(--danger)}
.m-a .mas{background:var(--surface-2)}
.pensando{color:var(--muted)}
.sugs{display:flex;flex-direction:column;gap:var(--sp-3)}
.btn.sug{justify-content:flex-start;text-align:left;white-space:normal;font-weight:600;line-height:1.35}
#frmPreg{display:flex;flex-direction:column;gap:var(--sp-4)}

/* ── diagrama ────────────────────────────────────────────────────────────── */
.dg-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.dg-hint{display:block}
@media (min-width:900px){.dg-hint{display:none}}
.dg{display:block;width:100%;height:auto}
.dg-n .b{fill:var(--paper)}
.dg-n .f{fill:none;stroke:var(--border-2);stroke-width:1.3}
.dg-persona .f{stroke:var(--accent)}
.dg-entidad .f{fill:var(--accent-dim);stroke:var(--accent)}
.dg-t{font:650 12.5px var(--font-sans);fill:var(--ink)}
.dg-s{font:500 10.5px var(--font-sans);fill:var(--muted)}
.dg-c{font:700 9.5px var(--font-sans);letter-spacing:.1em;fill:var(--muted)}
.dg-e{fill:none;stroke:var(--muted);stroke-width:1.5}
.dg-f{fill:var(--muted)}
.dg-p rect{fill:var(--paper);stroke:var(--border-2)}
.dg-p text{font:650 10.5px var(--font-sans);fill:var(--ink);font-variant-numeric:tabular-nums}

/* ── carga ───────────────────────────────────────────────────────────────── */
.skel{height:112px;border-radius:var(--r-lg);background:var(--surface-2)}
@media (prefers-reduced-motion:no-preference){
  .skel{animation:pulso calc(var(--t-long) * 3.5) var(--ease) infinite}
  .etapas li.ahora .marca{animation:pulso calc(var(--t-long) * 3.5) var(--ease) infinite}
  @keyframes pulso{0%,100%{opacity:1}50%{opacity:.55}}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}}

/* ═══ ≥ 900 px: barra lateral de 240 px, contenido de 880 px ═════════════════ */
@media (min-width:900px){
  body.p-plan{display:grid;grid-template-columns:240px minmax(0,1fr);grid-template-rows:auto 1fr}
  .p-plan .top{grid-column:1;grid-row:1;flex-direction:column;align-items:flex-start;gap:var(--sp-5);max-width:none;margin:0;padding:24px 20px 18px}
  .p-plan .brand b{font-size:18px}
  .p-plan .tabs{position:sticky;top:18px;grid-column:1;grid-row:2;align-self:start;flex-direction:column;gap:var(--sp-1);border-top:0;background:none;padding:0 12px 80px;z-index:auto}
  .p-plan .tab{flex:none;flex-direction:row;justify-content:flex-start;gap:var(--sp-5);padding:0 var(--sp-6);min-height:44px;font-size:14.5px}
  .p-plan .tab:hover{background:var(--surface-2)}
  .p-plan .tab .ico{width:18px;height:18px}
  .p-plan .tab[aria-current="page"]{background:var(--accent-dim)}
  .p-plan .tab[aria-current="page"]::before{top:8px;bottom:8px;left:0;right:auto;width:3px;height:auto;border-radius:0 3px 3px 0}
  .p-plan .cuenta-btn{position:fixed;left:12px;bottom:16px;width:216px;margin:0;justify-content:flex-start}
  .p-plan .shell{grid-column:2;grid-row:1/-1;border-left:1px solid var(--border);min-height:100dvh}
  .col{max-width:944px;padding:var(--sp-7) 32px 56px}
  .demo-banda{margin:0 -32px var(--sp-7);padding:var(--sp-3) 32px}
  h1{font-size:30px}
  .alts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .filtros{grid-template-columns:1fr 1fr auto}
  .prop-fila{grid-template-columns:1fr 1fr auto;align-items:end}
  .aviso{bottom:24px}
  .wiz-acc .btn{flex:0 0 auto}
  .doc{grid-template-columns:1fr auto auto}
  .doc .btn{grid-column:auto}
}

/* ═══ páginas pequeñas: vista familiar y activación ═══════════════════════════ */
.p-simple .top{max-width:720px;padding-inline:var(--sp-8)}
.p-simple .col{max-width:720px;padding-bottom:56px}
.p-simple .cuenta-btn{margin-left:auto}
.p-activar .col{max-width:480px}
.p-activar .card{padding:calc(var(--sp-7) + var(--sp-2));gap:var(--sp-6)}
.p-activar form{display:flex;flex-direction:column;gap:var(--sp-5)}
.secreto{font:650 20px/1.5 var(--font-sans);font-variant-numeric:tabular-nums;letter-spacing:.06em;background:var(--surface-2);border-radius:var(--r);padding:var(--sp-6);overflow-wrap:anywhere;user-select:all}
.codigos{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-3);font:650 16px var(--font-sans);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.codigos li{background:var(--surface-2);border-radius:var(--r-sm);padding:var(--sp-4) var(--sp-5);text-align:center;user-select:all}
.paso-a{font:700 12px/1 var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--gold-ink)}
.fam-fecha{color:var(--muted);font-size:14px}
.fam-bloque{display:flex;flex-direction:column;gap:var(--sp-7)}

/* ═══ lado profesional de la edición: retail-admin e invitaciones (sobrias, sin menú de destinos) ══════════ */
.p-pro .top{max-width:880px;padding-inline:var(--sp-8)}
.p-pro .col{max-width:880px;padding-bottom:56px}
.p-pro .cuenta-btn{margin-left:auto;text-decoration:none}
.fila-form{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-4);align-items:end}
.lista-simple{list-style:none;padding:0;display:flex;flex-direction:column}
.lista-simple li{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3) var(--sp-5);justify-content:space-between;padding:var(--sp-4) 0;border-bottom:1px solid var(--border);overflow-wrap:anywhere}
.lista-simple li:last-child{border-bottom:0}
.lista-simple .quien{flex:1 1 220px;min-width:0;display:flex;flex-direction:column}
.lista-simple code{font-family:var(--font-code);font-size:13px;color:var(--muted)}
.presup{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--sp-3) var(--sp-7)}
.presup b{font:650 22px/1.2 var(--font-sans)}
@media (min-width:900px){
  .fila-form{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}
  .fila-form.una{grid-template-columns:minmax(0,1fr) auto}
}

/* ═══ «Tu motor de IA» (Mi cuenta): cada persona corre con SU Claude o SU ChatGPT ═══════════════════════════ */
.motor-card{display:flex;flex-direction:column;gap:var(--sp-5);border:1px solid var(--accent-border);border-radius:var(--r-lg);padding:var(--sp-6);background:var(--surface-2)}
.motor-card h3{outline:none}
#motorCuerpo{display:flex;flex-direction:column;gap:var(--sp-5)}
#motMsg{outline:none}
.motor-op{display:flex;flex-direction:column;gap:var(--sp-4);padding:var(--sp-5);border:1px solid var(--border);border-radius:var(--r);background:var(--surface)}
.motor-op.elegido{border-color:var(--accent)}
.motor-op .opt{border:0;padding:0;background:none;min-height:44px}
.motor-op .opt:has(input:checked){background:none}
code{font-family:var(--font-code);font-size:.92em}
.cliente-nuevo{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-4);align-items:end}
@media (min-width:900px){.cliente-nuevo{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}}

/* ═══ textos legales y autorizaciones (contrato §9) ═════════════════════════════════════════════ */
.info-legal{display:flex;flex-direction:column;gap:var(--sp-4)}
.info-l{display:flex;flex-direction:column;gap:var(--sp-4);font-size:14.5px}
.info-l ul,.info-l ol{display:flex;flex-direction:column;gap:var(--sp-4);padding-left:1.25em}
.decl{display:flex;flex-direction:column;gap:var(--sp-4);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--r);padding:var(--sp-6)}
.decl .info-l{font-size:14px}
.aut{display:flex;flex-direction:column;gap:var(--sp-2)}
.aut-l{font-weight:500;font-size:14.5px}
.aut-l>span{display:block}   /* el texto corre en línea: el .opt>span genérico es una columna y partiría cada <b> */
.opc{display:inline-block;margin-right:var(--sp-1);padding:3px 9px;border:1px solid var(--border-2);border-radius:var(--r-pill);background:var(--surface-2);font:650 12px/1.2 var(--font-sans);font-style:normal;color:var(--muted)}
.doc-legal{display:flex;flex-direction:column;gap:var(--sp-5);font-size:15px;line-height:1.6}
.doc-legal h2{font:600 19px/1.25 var(--font-serif);margin-top:var(--sp-5)}
.doc-legal h3{font:650 16px/1.3 var(--font-sans);margin-top:var(--sp-3)}
.doc-legal ul,.doc-legal ol{display:flex;flex-direction:column;gap:var(--sp-3)}
.doc-legal table{border-collapse:collapse;width:100%;font-size:14px}
.doc-legal th,.doc-legal td{border:1px solid var(--border);padding:var(--sp-3) var(--sp-4);text-align:left;vertical-align:top}
.doc-legal code{font-family:var(--font-code);font-size:.92em}

/* ── «Mi cuenta»: derechos del titular (retail-cuenta.js) ─────────────────────────────────────── */
.rc{display:flex;flex-direction:column;gap:var(--sp-6)}
.rc-sec{display:flex;flex-direction:column;gap:var(--sp-4);padding-top:var(--sp-6);border-top:1px solid var(--border)}
.rc-sec h3{font:650 16px/1.3 var(--font-sans)}
.rc-cierre{border-top-color:var(--danger)}
.aut-lista{list-style:none;padding:0;display:flex;flex-direction:column;gap:var(--sp-4)}
.aut-item{display:flex;flex-wrap:wrap;gap:var(--sp-4);justify-content:space-between;align-items:flex-start;padding:var(--sp-5);border:1px solid var(--border);border-radius:var(--r);background:var(--surface)}
.aut-t{display:flex;flex-direction:column;gap:var(--sp-2);min-width:0;flex:1 1 200px}
.aut-t small{color:var(--muted);font-size:13px;font-weight:500}
.cont{display:flex;flex-direction:column;gap:var(--sp-5)}
.m-aviso{margin-top:var(--sp-3);color:var(--muted);font-size:12.5px;font-weight:650}
.aut-t .mas{border:0;padding:0;background:none}
.aut-t .mas>summary{min-height:44px;font-size:13.5px;text-decoration:underline;text-underline-offset:3px}
.aut-t .mas[open]{padding-bottom:var(--sp-3)}
/* enlaces dentro del texto: el relleno vertical no cambia el renglón y lleva el blanco táctil a 44 px */
main a:not(.btn):not(.tab),.legal a,dialog a:not(.btn){padding-block:14px}
