/* Portal de clientes · sistema de diseño «Estudio»: sobrio, compacto, para estudios de abogados.
   Todo en rem: el zoom de Configuración (html{font-size}) escala TODA la pantalla. Tema: html[data-tema=oscuro|claro]. Densidad: html[data-dens=compacta|comoda]. */
:root{
  --fs:.8125rem; --fs-chico:.75rem; --fs-h2:.8125rem; --fs-titulo:1.25rem; --fs-hero:2.25rem; --fs-kpi:1.5rem;
  --r-card:.75rem; --r-ctrl:.5rem; --r-pill:999px;
  --pad:.875rem; --gap:.625rem; --alto-ctrl:2.25rem;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:ui-monospace,Menlo,Consolas,monospace;
  --side-w:13.5rem; --insp-w:0px; --insp-h:0px;
}
html[data-tema=oscuro],:root{
  --bg:#0b0e13; --nav:#090c10; --surface:#11151c; --raised:#171c25; --hover:#1b2130; --line:#232a37; --line-2:#2c3544;
  --ink:#e9ecf1; --ink-2:#cfd5df; --mute:#9aa4b4; --dim:#8793a6; --borde-ui:#66738a;
  --accent:#c9a96e; --accent-ink:#17120a; --accent-soft:rgba(201,169,110,.12); --accent-line:rgba(201,169,110,.35);
  --link:#8db0e0;
  --ok:#62c597; --ok-bg:rgba(98,197,151,.12); --warn:#e5b95f; --warn-bg:rgba(229,185,95,.12); --bad:#ec7f74; --bad-bg:rgba(236,127,116,.13);
  --shadow:0 .5rem 1.5rem rgba(0,0,0,.35); color-scheme:dark;
}
html[data-tema=claro]{
  --bg:#f4f3ee; --nav:#ecebe4; --surface:#ffffff; --raised:#faf9f5; --hover:#f0eee6; --line:#dedcd2; --line-2:#cfccc0;
  --ink:#14171c; --ink-2:#2a303a; --mute:#4b5565; --dim:#5b6576; --borde-ui:#85827a;
  --accent:#7a5d24; --accent-ink:#ffffff; --accent-soft:rgba(138,106,44,.10); --accent-line:rgba(138,106,44,.40);
  --link:#1f4f9a;
  --ok:#0f7a4a; --ok-bg:rgba(15,122,74,.10); --warn:#8a5a00; --warn-bg:rgba(138,90,0,.11); --bad:#b3261e; --bad-bg:rgba(179,38,30,.09);
  --shadow:0 .5rem 1.5rem rgba(20,23,28,.14); color-scheme:light;
}
html[data-dens=comoda]{--fs:.9375rem; --fs-chico:.8125rem; --fs-h2:.875rem; --pad:1.125rem; --gap:.875rem; --alto-ctrl:max(2.75rem,44px); --fs-kpi:1.75rem}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{font-size:calc(16px * var(--zoom,.92));height:100%}
body{height:100%;background:var(--bg);color:var(--ink);font:var(--fs)/1.4 var(--sans);-webkit-font-smoothing:antialiased}
#app{height:100%}
button{font:inherit;color:inherit}
:focus-visible{outline:.125rem solid var(--accent);outline-offset:.125rem}
h1,h2,h3{font-weight:600}
h1{font-family:var(--serif);font-size:var(--fs-titulo);letter-spacing:-.005em;line-height:1.15;overflow-wrap:anywhere}
h2{font-size:var(--fs-h2);color:var(--mute);font-weight:600;letter-spacing:.02em}
.sub,.mute{color:var(--mute)}
.small{font-size:var(--fs-chico);color:var(--mute)}
.num{font-variant-numeric:tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- cáscara ---------- */
.shell{display:flex;height:calc(100% - var(--insp-h));min-height:0;margin-right:var(--insp-w)}
.side{flex:none;width:var(--side-w);background:var(--nav);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:.75rem .625rem;gap:.75rem;overflow-y:auto;transition:width .18s ease}
@media (max-width:860px){.shell.plegado .side{width:3.5rem;padding-inline:.5rem}
.shell.plegado .side .tx,.shell.plegado .side .rol,.shell.plegado .side .nm,.shell.plegado .side .quien{display:none}}
.marca{display:flex;align-items:center;gap:.625rem;padding:.25rem .375rem}
.logo{flex:none;width:1.875rem;height:1.875rem;border-radius:.5rem;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-family:var(--serif);font-weight:700;font-size:1.0625rem}
.marca .nm{font-family:var(--serif);font-size:1rem;font-weight:600;line-height:1.1}
.marca .rol{display:block;margin-top:.125rem;font-family:var(--sans);font-size:.75rem;letter-spacing:.12em;color:var(--accent);font-weight:700}
.nav{display:flex;flex-direction:column;gap:.125rem}
.nav a{display:flex;align-items:center;gap:.625rem;min-height:2.125rem;padding:.25rem .625rem;border-radius:var(--r-ctrl);color:var(--mute);text-decoration:none;font-weight:550}
.nav a svg{width:1.125rem;height:1.125rem;flex:none}
.nav a:hover{background:var(--hover);color:var(--ink)}
.nav a[aria-current=page]{background:var(--accent-soft);color:var(--ink);box-shadow:inset 0 0 0 1px var(--accent-line)}
.nav a[aria-current=page] svg{color:var(--accent)}
.nav .grupo{margin:.625rem .625rem .125rem;font-size:.75rem;letter-spacing:.1em;color:var(--dim);font-weight:700;text-transform:uppercase}
@media (max-width:860px){.shell.plegado .nav .grupo{display:none}}
.side .pie{margin-top:auto;display:flex;align-items:center;gap:.625rem;padding:.5rem .375rem;border-top:1px solid var(--line)}
.avatar{flex:none;width:1.75rem;height:1.75rem;border-radius:50%;background:var(--raised);border:1px solid var(--line-2);display:grid;place-items:center;font-weight:700;font-size:.75rem;color:var(--accent)}
.pie .quien{min-width:0;line-height:1.2}
.pie .quien b{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.col-main{flex:1;min-width:0;display:flex;flex-direction:column;min-height:0}
.ej{flex:none;text-align:center;font-size:var(--fs-chico);font-weight:700;letter-spacing:.06em;padding:.1875rem .5rem;background:var(--warn-bg);color:var(--warn);border-bottom:1px solid var(--line)}
.vc{flex:none;text-align:center;font-size:var(--fs-chico);font-weight:650;padding:.25rem .5rem;background:var(--ok-bg);color:var(--ok);border-bottom:1px solid var(--line)}
.vc button{background:none;border:0;color:inherit;font-weight:700;text-decoration:underline;cursor:pointer;min-height:1.75rem;padding:0 .25rem}
.top{flex:none;display:flex;align-items:center;gap:.5rem;min-height:2.875rem;padding:.375rem var(--pad);border-bottom:1px solid var(--line);background:var(--bg)}
.top .mig{flex:1;min-width:0;display:flex;align-items:center;gap:.375rem;color:var(--mute);white-space:nowrap;overflow:hidden}
.top .mig b{color:var(--ink);font-weight:600;overflow:hidden;text-overflow:ellipsis}
.ico{flex:none;display:grid;place-items:center;width:var(--alto-ctrl);height:var(--alto-ctrl);border-radius:var(--r-ctrl);border:1px solid transparent;background:none;color:var(--mute);cursor:pointer}
.ico:hover{background:var(--hover);color:var(--ink)}
.ico[aria-pressed=true]{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-line)}
.ico svg{width:1.125rem;height:1.125rem}
.buscar{display:flex;align-items:center;gap:.5rem;min-width:11rem;height:var(--alto-ctrl);padding:0 .625rem;border:1px solid var(--line);border-radius:var(--r-ctrl);background:var(--surface);color:var(--dim);cursor:pointer}
.buscar svg{width:1rem;height:1rem;flex:none}
.buscar kbd{margin-left:auto;font:inherit;font-size:.75rem;border:1px solid var(--line);border-radius:.25rem;padding:0 .3125rem;color:var(--dim)}
.page{flex:1;min-height:0;overflow-y:auto;padding:var(--pad) calc(var(--pad) * 1.25) calc(var(--pad) * 2);display:flex;flex-direction:column;gap:var(--gap);outline:none;overscroll-behavior:contain}
.page>*{flex:none}
.cab{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--gap);flex-wrap:wrap}
.cab .acc{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.tabbar{display:none}

/* ---------- piezas ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card)}
.pad{padding:var(--pad)}
.cab-card{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.625rem var(--pad);border-bottom:1px solid var(--line)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4375rem;height:var(--alto-ctrl);padding:0 .875rem;border-radius:var(--r-ctrl);border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);font-weight:650;cursor:pointer;white-space:nowrap;text-decoration:none}
.btn:hover{filter:brightness(1.08)}
.btn svg{width:1rem;height:1rem;flex:none}
.btn.ghost{background:transparent;border-color:var(--borde-ui);color:var(--ink)}
.btn.ghost:hover{background:var(--hover);filter:none}
.btn.mini{height:2rem;padding:0 .625rem;font-size:var(--fs-chico)}
.btn.full{width:100%}
.btn[disabled]{opacity:.55;cursor:default}
.armado{background:var(--bad)!important;border-color:var(--bad)!important;color:#fff!important}
.armado .name,.armado .small{color:#fff!important}
.pensando{opacity:.6;pointer-events:none}
.inp{width:100%;height:var(--alto-ctrl);padding:0 .625rem;border-radius:var(--r-ctrl);border:1px solid var(--borde-ui);background:var(--raised);color:var(--ink);font:inherit}
.inp::placeholder{color:var(--dim)}
select.inp{padding-right:.25rem}
.lbl{display:flex;flex-direction:column;gap:.3125rem;font-weight:600}
.ayuda{font-weight:450;color:var(--mute);font-size:var(--fs-chico)}
.form{display:flex;flex-direction:column;gap:.75rem}
.err{color:var(--bad);font-weight:600}.err:empty{display:none}
.okmsg{color:var(--ok);font-weight:600}.okmsg:empty{display:none}
.fila3{display:grid;grid-template-columns:1fr 1fr 1.5fr;gap:.625rem}
.fecha{border:0;display:flex;flex-direction:column;gap:.375rem}.fecha legend{font-weight:600;padding:0;margin-bottom:.375rem}
.mostrar{display:flex;align-items:center;gap:.625rem;min-height:2.25rem;font-weight:550;cursor:pointer}.mostrar input{width:1.125rem;height:1.125rem;accent-color:var(--accent)}
.pill{display:inline-flex;align-items:center;gap:.3125rem;height:1.375rem;padding:0 .5rem;border-radius:var(--r-pill);font-size:var(--fs-chico);font-weight:650;white-space:nowrap}
.pill svg{width:.8125rem;height:.8125rem}
.p-ok{background:var(--ok-bg);color:var(--ok)}.p-warn{background:var(--warn-bg);color:var(--warn)}.p-bad{background:var(--bad-bg);color:var(--bad)}.p-gris{background:var(--raised);color:var(--mute);border:1px solid var(--line)}
.seg{display:inline-flex;border:1px solid var(--borde-ui);border-radius:var(--r-ctrl);overflow:hidden;background:var(--raised);flex-wrap:wrap}
.seg button{height:calc(var(--alto-ctrl) - .25rem);padding:0 .75rem;border:0;background:none;color:var(--mute);font-weight:600;cursor:pointer}
.seg button[aria-pressed=true]{background:var(--accent-soft);color:var(--ink);box-shadow:inset 0 0 0 1px var(--accent-line)}
.grid{display:grid;gap:var(--gap)}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g-res{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
.kpi{padding:var(--pad);display:flex;flex-direction:column;gap:.25rem}
.kpi .et{color:var(--mute);font-weight:600}
.kpi .v{font-family:var(--serif);font-size:var(--fs-kpi);font-weight:600;line-height:1.1;font-variant-numeric:tabular-nums}
.kpi .pie-k{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;color:var(--mute);font-size:var(--fs-chico)}
.delta{font-weight:700}.delta.arriba{color:var(--ok)}.delta.abajo{color:var(--bad)}.delta.igual{color:var(--mute)}
.hero{padding:calc(var(--pad) * 1.3);display:flex;flex-direction:column;gap:.5rem;background:linear-gradient(135deg,var(--accent-soft),transparent 60%),var(--surface)}
.hero .v{font-family:var(--serif);font-size:var(--fs-hero);font-weight:600;line-height:1;font-variant-numeric:tabular-nums}
.hero .v small{font-size:.5em;color:var(--mute);font-weight:500}
.barra{position:relative;height:.5rem;border-radius:var(--r-pill);background:var(--line-2);border:1px solid var(--line);overflow:visible}
.barra i{display:block;height:100%;border-radius:var(--r-pill);background:var(--accent)}
.barra i.ok{background:var(--ok)}.barra i.warn{background:var(--warn)}.barra i.bad{background:var(--bad)}
.barra b{position:absolute;top:-.1875rem;bottom:-.1875rem;width:2px;background:var(--ink);opacity:.45}
.graf{width:100%;height:auto;display:block;overflow:visible}
.graf .eje{stroke:var(--line);stroke-width:1}.graf .txt{fill:var(--mute);font-size:12px}.graf .bar{fill:var(--accent)}.graf .bar.cur{fill:var(--link)}
.graf .linea{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.graf .area{fill:var(--accent-soft)}
.graf .banda{fill:var(--ok-bg)}.graf .meta{stroke:var(--ok);stroke-dasharray:3 3;stroke-width:1}
.graf .d-ok{stroke:var(--ok)}.graf .d-warn{stroke:var(--warn)}.graf .d-bad{stroke:var(--bad)}.graf .d-vacio{stroke:var(--raised)}
.leyenda{display:flex;flex-wrap:wrap;gap:.25rem .875rem;color:var(--mute);font-size:var(--fs-chico)}
.leyenda i{display:inline-block;width:.5625rem;height:.5625rem;border-radius:50%;margin-right:.3125rem}
.embudo{display:flex;flex-direction:column;gap:.5rem}
.embudo .fila{display:grid;grid-template-columns:8.5rem 1fr 3.5rem;align-items:center;gap:.625rem}
.embudo .fila .b{height:1.25rem;border-radius:.3125rem;background:var(--accent);opacity:.9;min-width:2px}
.embudo .conv{font-size:var(--fs-chico);color:var(--mute);padding-left:9.125rem;margin-top:-.25rem}
.rank{display:flex;flex-direction:column}
.rank .r{display:grid;grid-template-columns:1.25rem minmax(0,1fr) 3rem;align-items:center;gap:.625rem;padding:.4375rem var(--pad);border-top:1px solid var(--line)}
.rank .r:first-child{border-top:0}
.rank .n{color:var(--dim);font-variant-numeric:tabular-nums}
.vacio{padding:1.5rem var(--pad);color:var(--mute);text-align:center}

/* tabla (div): una fila = una grilla; en celular pasa a tarjetas */
.tabla{overflow:clip}
.tabla .th,.tabla .tr{display:grid;grid-template-columns:var(--cols);align-items:center;gap:.625rem;padding:.5rem var(--pad)}
.tabla .th{color:var(--dim);font-size:var(--fs-chico);font-weight:700;letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid var(--line);background:var(--raised)}
.tabla .tr{border:0;border-top:1px solid var(--line);color:inherit;text-decoration:none;cursor:pointer;min-height:max(2.75rem,44px);background:none;width:100%;text-align:left;font:inherit}
.tabla .th+.tr{border-top:0}
.tabla .tr:hover{background:var(--hover)}
.tabla .name{font-weight:600;overflow-wrap:anywhere}
.celda-barra{display:flex;align-items:center;gap:.5rem}.celda-barra .barra{flex:1;min-width:2.5rem}
.row{display:flex;align-items:center;gap:.625rem;min-height:max(2.75rem,44px);padding:.4375rem var(--pad);width:100%;text-align:left;background:none;border:0;cursor:pointer;color:inherit;text-decoration:none;font:inherit}
.row+.row,.row2+.row2,.row2+.row,.row+.row2{border-top:1px solid var(--line)}
.row:hover{background:var(--hover)}
.row2{display:flex;align-items:center;flex-wrap:wrap;gap:.25rem;padding-right:.5rem}.row2 .row{flex:1 1 12rem;min-width:0}
.grow{flex:1;min-width:0;display:block}
.name{display:block;font-weight:600;overflow-wrap:anywhere}
.glyph{flex:none;width:1.75rem;height:1.75rem;border-radius:50%;display:grid;place-items:center}.glyph svg{width:1rem;height:1rem}
.g-ok{background:var(--ok-bg);color:var(--ok)}.g-warn{background:var(--warn-bg);color:var(--warn)}.g-bad{background:var(--bad-bg);color:var(--bad)}
.chk{flex:none;width:1.25rem;height:1.25rem;border-radius:.3125rem;border:1.5px solid var(--mute);display:grid;place-items:center;color:transparent}.chk svg{width:.8125rem;height:.8125rem}
[aria-checked=true] .chk{background:var(--ok);border-color:var(--ok);color:#fff}[aria-checked=true] .name{text-decoration:line-through;color:var(--mute)}
.acc2{display:flex;gap:.5rem;flex-wrap:wrap;margin-left:auto;padding:.25rem 0}
.stp{flex:none;width:var(--alto-ctrl);height:var(--alto-ctrl);border-radius:var(--r-ctrl);border:1px solid var(--borde-ui);background:var(--raised);color:var(--ink);display:grid;place-items:center;cursor:pointer}.stp:hover{background:var(--hover)}.stp.ghost{border-color:transparent;background:none;color:var(--mute)}.stp svg{width:1rem;height:1rem}
.nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.numc{padding:var(--pad);display:flex;flex-direction:column;gap:.5rem}
.step{display:flex;align-items:center;justify-content:space-between;gap:.375rem}.step b{font-family:var(--serif);font-size:var(--fs-kpi);min-width:2ch;text-align:center;font-variant-numeric:tabular-nums}
.tablero{display:grid;grid-template-columns:repeat(auto-fit,minmax(9rem,1fr));gap:var(--gap);align-items:start}
.col-t{display:flex;flex-direction:column;gap:.5rem}.col-t h2{display:flex;justify-content:space-between}
.pieza{padding:.625rem;display:flex;flex-direction:column;gap:.375rem}
.add{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}.add .inp{flex:1 1 9rem}
.linkbox{padding:var(--pad);display:flex;flex-direction:column;gap:.5rem}
.cod{font-family:var(--mono);overflow-wrap:anywhere;user-select:all;background:var(--raised);border:1px solid var(--line);border-radius:var(--r-ctrl);padding:.5rem .625rem}

/* ---------- ventanas, avisos, buscador ---------- */
.toast{position:fixed;z-index:60;left:50%;bottom:1.25rem;transform:translate(-50%,.75rem);background:var(--ink);color:var(--bg);padding:.5rem .875rem;border-radius:var(--r-pill);font-weight:600;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:90vw;text-align:center;box-shadow:var(--shadow)}
.toast.on{opacity:1;transform:translate(-50%,0)}
.ov{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.55);display:flex;align-items:flex-start;justify-content:center;padding:12vh 1rem 1rem}
.modal{width:100%;max-width:34rem;background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-card);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column;max-height:76vh}
.modal .cab-m{display:flex;align-items:center;gap:.5rem;padding:.625rem var(--pad);border-bottom:1px solid var(--line)}
.modal .cab-m input{flex:1;height:var(--alto-ctrl);border:0;background:none;color:var(--ink);font:inherit;outline:none}
.modal .res{overflow-y:auto;padding:.375rem}.modal .res a,.modal .res button{display:flex;align-items:center;gap:.625rem;width:100%;min-height:2.5rem;padding:.375rem .625rem;border-radius:var(--r-ctrl);background:none;border:0;color:var(--ink);text-decoration:none;text-align:left;cursor:pointer}
.modal .res [aria-selected=true]{background:var(--accent-soft)}
.modal .res small{margin-left:auto;color:var(--dim)}
.modal .cuerpo{padding:var(--pad);display:flex;flex-direction:column;gap:.75rem;overflow-y:auto}
.pop{position:fixed;z-index:45;top:3.5rem;right:.75rem;width:19rem;max-height:calc(100vh - 4.5rem);overflow-y:auto;background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-card);box-shadow:var(--shadow);padding:var(--pad);display:flex;flex-direction:column;gap:.75rem}

/* ---------- ingreso ---------- */
.ent{height:100%;min-height:0;-webkit-overflow-scrolling:touch;display:flex;align-items:center;justify-content:center;padding:1.25rem;background:radial-gradient(60rem 30rem at 50% -10%,var(--accent-soft),transparent 60%),var(--bg);overflow-y:auto}
.ent-in{width:100%;max-width:25rem;display:flex;flex-direction:column;gap:1rem;margin:auto}
.ent h1{font-size:1.625rem}
.ent .card{padding:1.25rem;display:flex;flex-direction:column;gap:.875rem}
.back{display:inline-flex;align-items:center;gap:.25rem;color:var(--link);font-weight:650;text-decoration:none;min-height:2.25rem}.back svg{width:1rem;height:1rem}

/* ---------- celular ---------- */
/* diseño de celular: se activa por html[data-ancho=cel] (lo calcula app.js con el ancho útil y el zoom) */
html[data-ancho=cel] .side{display:none}
html[data-ancho=cel] .top .buscar span,html[data-ancho=cel] .top .buscar kbd{display:none}
html[data-ancho=cel] .top .buscar{min-width:0;width:var(--alto-ctrl);padding:0;justify-content:center}
html[data-ancho=cel] .tabbar{display:flex;flex:none;border-top:1px solid var(--line);background:var(--nav);padding:.25rem .25rem calc(.25rem + env(safe-area-inset-bottom))}
html[data-ancho=cel] .tabbar a{flex:1 1 4rem;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.125rem;min-height:3rem;border-radius:var(--r-ctrl);color:var(--mute);text-decoration:none;font-size:.75rem;font-weight:600;overflow-wrap:normal;hyphens:none;text-align:center}
html[data-ancho=cel] .tabbar a svg{width:1.25rem;height:1.25rem}
html[data-ancho=cel] .tabbar a[aria-current=page]{color:var(--ink);background:var(--accent-soft)}
html[data-ancho=cel] .shell{flex-direction:column}
html[data-ancho=cel] .g4,html[data-ancho=cel] .nums{grid-template-columns:repeat(2,minmax(0,1fr))}
html[data-ancho=cel] .g3{grid-template-columns:repeat(2,minmax(0,1fr))}
html[data-ancho=cel] .g-res,html[data-ancho=cel] .g2{grid-template-columns:minmax(0,1fr)}
html[data-ancho=cel] .tablero{grid-template-columns:minmax(0,1fr)}
html[data-ancho=cel] .tabla .th{display:none}
html[data-ancho=cel] .tabla .tr{grid-template-columns:minmax(0,1fr) auto;row-gap:.25rem}
html[data-ancho=cel] .tabla .tr>[data-oculto]{display:none}
html[data-ancho=cel] .embudo .fila{grid-template-columns:6.5rem 1fr 3rem}
html[data-ancho=cel] .embudo .conv{padding-left:7.125rem}
html[data-ancho=cel] .pop{left:.75rem;right:.75rem;width:auto}
html[data-ancho=cel] .ov{padding-top:4vh}

@media (max-width:420px){.fila3{grid-template-columns:1fr 1fr 1.3fr}.kpi .v{font-size:1.375rem}}
@media (max-height:480px){html[data-ancho=cel] .tabbar a{flex-direction:row;min-height:2.5rem;font-size:.75rem}}
@media (pointer:coarse){.pieza .btn.mini{min-height:max(2.75rem,44px)}.mostrar,.cab-card .back,.vc button{min-height:max(2.75rem,44px)}.seg button{min-width:max(2.75rem,44px)}.modal .cab-m input{min-height:max(2.75rem,44px)}.btn,.inp,.ico,.stp,.buscar{min-height:max(2.75rem,44px)}.ico,.stp,.buscar{min-width:max(2.75rem,44px)}.btn.mini{min-height:max(2.75rem,44px)}.nav a{min-height:max(2.75rem,44px)}.seg button{min-height:max(2.75rem,44px)}.rank .r{min-height:max(2.75rem,44px)}.back{min-height:max(2.75rem,44px)}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
html[data-mov=quieto] *{transition:none!important;animation:none!important}

.g-res{align-items:start}
.pie .quien{flex:1}
.pie .quien .small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.graf .txt.cur{fill:var(--ink);font-weight:700}

.modal .cab-m svg{width:1.125rem;height:1.125rem;flex:none;color:var(--dim)}
.cab-card .back{min-height:1.75rem;padding:0 .5rem}
.armado-suave{box-shadow:0 0 0 2px var(--accent)!important}
.vacio-grande{padding:2rem var(--pad);display:flex;flex-direction:column;align-items:flex-start;gap:.625rem;max-width:34rem}
.vacio-grande .btn{align-self:flex-start}
.g2>.card{align-self:start}
.ej{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html[data-ancho=cel] .solo-pc{display:none}
html[data-ancho=cel] .toast{bottom:calc(4.5rem + env(safe-area-inset-bottom))}
@media (max-width:420px){html[data-ancho=cel] .top .mig>span{display:none}}

.pieza .btn.mini{white-space:normal;height:auto;min-height:2rem;padding:.375rem .5rem;text-align:center;line-height:1.25}

html[data-ancho=cel] .top .buscar{width:max(2.75rem,44px)}

.small{overflow-wrap:anywhere}
@media (pointer:coarse){.pieza .btn.mini,.cab-card .back{min-height:max(2.75rem,44px)}}
html[data-min] .tabla .tr{grid-template-columns:minmax(0,1fr)}
html[data-min] .g4,html[data-min] .nums,html[data-min] .g3{grid-template-columns:minmax(0,1fr)}
html[data-min] .kpi .et,html[data-min] .small{overflow-wrap:anywhere}
html[data-min] .page{padding-inline:.625rem}
html[data-min] .embudo .fila{grid-template-columns:5rem 1fr 2.5rem}html[data-min] .embudo .conv{padding-left:5.625rem}

html[data-min] .rank .r{grid-template-columns:minmax(0,1fr) 2.25rem}html[data-min] .rank .n{display:none}

/* MVP comercial */
.g5{grid-template-columns:repeat(5,minmax(0,1fr))}
html[data-ancho=cel] .g5{grid-template-columns:repeat(2,minmax(0,1fr))}
.graf .bar-a{fill:var(--ok)}.graf .bar-b{fill:var(--bad);opacity:.8}
.pipe{display:grid;grid-template-columns:repeat(6,minmax(8.5rem,1fr));gap:var(--gap);align-items:start;overflow-x:auto;padding-bottom:.25rem}
html[data-ancho=cel] .pipe{grid-template-columns:repeat(6,minmax(13rem,1fr))}
.lead{display:flex;flex-direction:column;gap:.125rem;padding:.5rem .625rem;text-align:left;cursor:pointer;width:100%;color:inherit;font:inherit}
.lead:hover{border-color:var(--accent-line)}
.sel-cl{width:auto;max-width:14rem}
.ov-peek{justify-content:flex-end;align-items:stretch;padding:0}
.peek{width:100%;max-width:26rem;height:100%;background:var(--surface);border-left:1px solid var(--line-2);box-shadow:var(--shadow);display:flex;flex-direction:column;overflow-y:auto;animation:entra .18s ease}
@keyframes entra{from{transform:translateX(1.5rem);opacity:.4}to{transform:none;opacity:1}}
html[data-ancho=cel] .ov-peek{align-items:flex-end}
html[data-ancho=cel] .peek{max-width:none;height:auto;max-height:85vh;border-left:0;border-top:1px solid var(--line-2);border-radius:var(--r-card) var(--r-card) 0 0}
.peek .cuerpo{padding:var(--pad);display:flex;flex-direction:column;gap:.875rem}
.peek .cab-m{display:flex;align-items:center;gap:.5rem;padding:.625rem var(--pad);border-bottom:1px solid var(--line)}
.datos{display:grid;grid-template-columns:7.5rem 1fr;gap:.375rem .75rem}.datos dt{color:var(--mute)}.datos dd{overflow-wrap:anywhere}
.lead .name,.lead .small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plega>summary{list-style:none;display:inline-flex;cursor:pointer;width:auto}.plega>summary::-webkit-details-marker{display:none}.plega[open]>summary{margin-bottom:.5rem}
html .embudo.gastos .fila{grid-template-columns:minmax(0,9rem) 1fr auto}
.lnk{font:inherit;text-decoration:underline;text-underline-offset:2px}.lnk,.col-t .lnk{background:none;border:0;color:var(--accent);padding:.25rem 0;cursor:pointer;text-align:left}

/* Plan de trabajo */
.barrita{display:inline-block;width:4.5rem;height:.4rem;border-radius:99px;background:var(--line);overflow:hidden;vertical-align:middle;margin-right:.375rem}.barrita i{display:block;height:100%}
.fase-p>summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.625rem var(--pad);cursor:pointer}.fase-p>summary::-webkit-details-marker{display:none}
.fase-p[open]>summary{border-bottom:1px solid var(--line)}
.plan-t{display:flex;align-items:center;gap:.5rem;padding-right:.5rem}.plan-t .row{flex:1;min-width:0}.plan-t .fecha-t{width:auto;flex:0 0 auto;max-width:9.5rem}
.plan-t .row[aria-disabled=true]{cursor:default;opacity:.85}
.plan-link{display:flex;gap:.75rem;align-items:center;color:inherit;text-decoration:none}.plan-link:hover{border-color:var(--accent-line)}
html[data-ancho=cel] .plan-t{flex-wrap:wrap}html[data-ancho=cel] .plan-t .fecha-t{margin-left:2.25rem}
.add .lbl{white-space:nowrap}
@media (pointer:coarse){.lnk{display:inline-flex;align-items:center;min-height:max(2.75rem,44px);padding:0 .25rem}}

/* ===== Tablero arrastrable (16/10 noche) ===== */
.kb{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(15rem,1fr);gap:.75rem;overflow-x:auto;padding:.125rem .125rem .75rem;scroll-snap-type:x proximity;align-items:start}
.kb-col{background:var(--surface-2,var(--surface));border:1px solid var(--line);border-radius:var(--r-card);display:flex;flex-direction:column;min-height:12rem;max-height:calc(100dvh - 15rem);scroll-snap-align:start;transition:border-color .15s,background .15s,box-shadow .15s}
.kb-col.sobre{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft,rgba(200,170,110,.15)) inset}
.kb-h{display:flex;align-items:center;gap:.5rem;padding:.625rem .75rem;border-bottom:1px solid var(--line);position:sticky;top:0}
.kb-h i{width:.5rem;height:.5rem;border-radius:99px;flex:none}.kb-h b{font-size:.8125rem;letter-spacing:.01em}
.kb-n{font-size:.75rem;font-variant-numeric:tabular-nums;padding:.0625rem .4375rem;border-radius:99px;background:var(--line);color:var(--ink)}
.kb-pie{margin-left:auto;font-size:.75rem;color:var(--mute);font-variant-numeric:tabular-nums}
.kb-lista{display:flex;flex-direction:column;gap:.5rem;padding:.5rem;overflow-y:auto;min-height:4rem}
.kb-card{background:var(--surface);border:1px solid var(--line-2,var(--line));border-radius:.625rem;padding:.625rem .75rem;cursor:grab;user-select:none;touch-action:pan-y;transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s,border-color .15s;animation:kbIn .28s cubic-bezier(.2,.8,.2,1) both}
.kb-card:hover{border-color:var(--accent-line,var(--accent));transform:translateY(-1px);box-shadow:0 6px 18px rgba(0,0,0,.18)}
.kb-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.kb-card:not([data-drag]){cursor:pointer}
.kb-t{display:block;font-size:.875rem;line-height:1.3;overflow-wrap:anywhere}
.kb-meta{display:flex;flex-wrap:wrap;gap:.25rem .5rem;align-items:center;margin-top:.3125rem;font-size:.75rem;color:var(--mute)}
.kb-chip{display:inline-flex;align-items:center;font-size:.75rem;padding:.0625rem .4375rem;border-radius:99px;border:1px solid var(--line);color:var(--ink);font-variant-numeric:tabular-nums}
.kb-chip.tarde{border-color:var(--bad);color:var(--bad)}
.kb-orig{opacity:.35;transform:scale(.98)}
.kb-ghost{position:fixed;z-index:9999;pointer-events:none;transform:rotate(2.2deg) scale(1.03);box-shadow:0 18px 40px rgba(0,0,0,.35);border-color:var(--accent);cursor:grabbing;animation:none}
body.arrastrando,body.arrastrando *{cursor:grabbing!important;user-select:none}
.kb-vacio{margin:auto;font-size:.75rem;color:var(--mute);opacity:.7;padding:1rem 0}
.kb-mas{text-align:center;padding:.25rem}
@keyframes kbIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
html[data-ancho=cel] .kb{grid-auto-columns:82%}
html[data-ancho=cel] .kb-col{max-height:none}
html[data-mov=quieto] .kb-card{animation:none;transition:none}
/* embudo de 3 pasos + ventas */
.ventas-fin{display:flex;align-items:baseline;gap:.75rem;margin-top:.875rem;padding:.75rem .875rem;border-radius:.75rem;background:color-mix(in srgb,var(--ok) 12%,transparent);border:1px solid color-mix(in srgb,var(--ok) 35%,transparent)}
.ventas-fin b{font-size:1.75rem;color:var(--ok);font-family:var(--f-display,inherit)}
/* cuentas como objetos */
/* links para compartir: una fila por tipo de cuenta (nombre, link, botones y vencimiento en la misma línea; en celular se apilan) */
.links-l{display:flex;flex-direction:column}.lk{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.6fr) auto minmax(6.5rem,.5fr);gap:.375rem .875rem;align-items:center;padding:.625rem var(--pad);border-top:1px solid var(--line)}.lk:first-child{border-top:0}
.lk-t{display:flex;flex-wrap:wrap;align-items:center;gap:.125rem .5rem;min-width:0}.lk-d{flex:1 1 100%;color:var(--mute)}.lk .cod.lk-c{min-width:0;font-family:ui-monospace,monospace;font-size:.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:.375rem .5rem;border-radius:.5rem;border:1px dashed var(--line)}.lk-crear{grid-column:2/-1}.lk-v{min-width:0}
/* Cuentas en compus bajas (≤760 px de alto): con 5 links la tarjeta se comía la pantalla y la lista de cuentas quedaba en 167 px. Se juntan las filas y la descripción pasa al tooltip del nombre (28/10, QA) */
@media (max-height:760px){html:not([data-ancho=cel]) .lk{padding-block:.125rem}html:not([data-ancho=cel]) #main[data-vista=vCuentas] .cab .sub{display:none}html:not([data-ancho=cel]) .lk-d,html:not([data-ancho=cel]) .sw-ap .small{display:none}}
html[data-ancho=cel] .lk{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) auto}html[data-ancho=cel] .lk-t{grid-row:span 2}html[data-ancho=cel] .lk-v{grid-column:2/-1}
@media (max-width:700px){html[data-ancho=cel] .lk{grid-template-columns:auto minmax(0,1fr)}html[data-ancho=cel] .lk-t,html[data-ancho=cel] .lk-crear,html[data-ancho=cel] .lk .cod.lk-c{grid-column:1/-1;grid-row:auto}html[data-ancho=cel] .lk-v{grid-column:auto}html[data-ancho=cel] .lk .cod.lk-c{white-space:normal;word-break:break-all;overflow:visible}}
.objs{display:grid}.obj{display:grid;grid-template-columns:auto 1fr auto;gap:.75rem;align-items:start;padding:.75rem var(--pad);border-top:1px solid var(--line)}
.objs .obj:first-child{border-top:0}
.av{width:2.25rem;height:2.25rem;border-radius:99px;display:grid;place-items:center;background:var(--accent-soft,rgba(200,170,110,.15));color:var(--accent);font-weight:700}
.av-xl{width:3.5rem;height:3.5rem;font-size:1.25rem}
.obj-d{display:grid;grid-template-columns:repeat(auto-fit,minmax(8.5rem,1fr));gap:.25rem .875rem;margin:.375rem 0 0}.obj-d div{min-width:0}.obj-d dt{font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--mute)}.obj-d dd{margin:0;font-size:.8125rem;overflow-wrap:anywhere}
.mono{font-family:ui-monospace,monospace}
.obj-a{display:flex;flex-direction:column;gap:.375rem;align-items:stretch}.obj-a .inp{width:auto}
html[data-ancho=cel] .obj{grid-template-columns:auto 1fr}html[data-ancho=cel] .obj-a{grid-column:1/-1;flex-direction:row;flex-wrap:wrap}
/* roles: los botones de la cuenta quedan siempre arriba a la derecha (compu) o antes del panel (celular); el panel abre en su propia fila */
.obj>.av{grid-column:1;grid-row:1}.obj>.obj-c{grid-column:2;grid-row:1;min-width:0}.obj>.obj-a{grid-column:3;grid-row:1}
html[data-ancho=cel] .obj>.obj-a{grid-column:1/-1;grid-row:auto;order:2}html[data-ancho=cel] .obj>.obj-roles{order:1}html[data-ancho=cel] .obj>.obj-asig{order:3}html[data-ancho=cel] .obj>.obj-panel{grid-column:1/-1;order:4}
.tchips{display:flex;flex-wrap:wrap;gap:.25rem}
.seg-scroll{overflow-x:auto;max-width:100%;flex-wrap:nowrap}.seg-scroll button{white-space:nowrap}
/* configuración: ventana central flotante */
.ov-cfg{display:grid;place-items:center;padding:max(1rem,env(safe-area-inset-top)) 1rem;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);animation:ovIn .2s ease both}
.modal.cfg{width:min(58rem,100%);max-width:none;height:min(38rem,calc(100dvh - 2rem));display:grid;grid-template-columns:14rem 1fr;padding:0;overflow:hidden;animation:cfgIn .28s cubic-bezier(.2,.8,.2,1) both;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.cfg-nav{display:flex;flex-direction:column;gap:.125rem;padding:1rem .625rem;border-right:1px solid var(--line);background:var(--surface-2,var(--surface))}
.cfg-tit{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--mute);padding:.25rem .625rem .625rem}
.cfg-nav button{display:flex;align-items:center;gap:.625rem;padding:.5rem .625rem;border-radius:.5rem;border:0;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer;transition:background .15s}
.cfg-nav button:hover{background:var(--line)}.cfg-nav button[aria-current=true]{background:var(--accent-soft,rgba(200,170,110,.15));color:var(--accent);font-weight:600}
.cfg-nav svg{width:1rem;height:1rem;flex:none}
.cfg-cuerpo{display:flex;flex-direction:column;min-width:0;overflow:hidden}.cfg-in{padding:1.25rem 1.5rem;overflow-y:auto;display:flex;flex-direction:column;gap:1rem}
.cfg-in h3{margin:.5rem 0 0;font-size:.875rem}
.cfg-perfil{display:flex;gap:1rem;align-items:center}
@keyframes cfgIn{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
@keyframes ovIn{from{opacity:0}to{opacity:1}}
html[data-ancho=cel] .ov-cfg{place-items:end stretch;padding:0}
html[data-ancho=cel] .modal.cfg{grid-template-columns:1fr;grid-template-rows:auto 1fr;height:92dvh;border-radius:1.25rem 1.25rem 0 0;animation-name:cfgUp}
html[data-ancho=cel] .cfg-nav{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);padding:.5rem}
html[data-ancho=cel] .cfg-tit{display:none}html[data-ancho=cel] .cfg-nav button{white-space:nowrap;flex:none}
@keyframes cfgUp{from{transform:translateY(100%)}to{transform:none}}
html[data-mov=quieto] .modal.cfg,html[data-mov=quieto] .ov-cfg{animation:none}
/* respiración: tarjetas y KPIs entran suave */
.card,.kpi{animation:entraSuave .35s cubic-bezier(.2,.8,.2,1) both}
@keyframes entraSuave{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
html[data-mov=quieto] .card,html[data-mov=quieto] .kpi{animation:none}
@media (prefers-reduced-motion:reduce){.card,.kpi,.kb-card,.modal.cfg,.ov-cfg{animation:none!important;transition:none!important}}

/* Ventas y finanzas premium */
.fin-hero{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:1rem;align-items:center;padding:1.125rem 1.25rem;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 10%,var(--surface)) 0%,var(--surface) 60%);border-color:color-mix(in srgb,var(--accent) 30%,var(--line))}
.fh-a{display:flex;flex-direction:column;gap:.25rem}.fh-v{font-family:var(--f-display,inherit);font-size:2.25rem;line-height:1.05;font-variant-numeric:tabular-nums}
.fh-b{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem}.fh-b .graf{width:100%!important;max-width:14rem;height:3rem}
.fh-c{display:flex;align-items:center;gap:.75rem}.fh-c b{font-size:1.5rem}
.anillo{width:4.25rem;height:4.25rem;flex:none}.an-f{fill:none;stroke:var(--line);stroke-width:9}.an-v{fill:none;stroke:var(--accent);stroke-width:9;stroke-linecap:round;transition:stroke-dasharray .6s cubic-bezier(.2,.8,.2,1)}
.d-acc{stroke:var(--accent)}
.gasto-d{display:flex;gap:1rem;align-items:center}.gasto-d .graf{max-width:7.5rem;flex:none}
.leyenda-v{list-style:none;margin:0;padding:0;display:grid;gap:.375rem;flex:1;min-width:0}.leyenda-v li{display:grid;grid-template-columns:.625rem 1fr auto 2.5rem;gap:.5rem;align-items:center;font-size:.8125rem}
.leyenda-v i{width:.625rem;height:.625rem;border-radius:3px}.lg-acc{background:var(--accent)}.lg-bad{background:var(--bad)}.lg-warn{background:var(--warn)}.lg-ok{background:var(--ok)}
.leyenda-v .small{text-align:right}
html[data-ancho=cel] .fin-hero{grid-template-columns:1fr 1fr}html[data-ancho=cel] .fh-a{grid-column:1/-1}
.aviso-vacio{display:flex;gap:1rem;align-items:center;justify-content:space-between;flex-wrap:wrap;border-style:dashed}
select.inp:empty{display:none}
.gc-lista{display:grid}.gc-fila{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap;padding:.625rem var(--pad);border-top:1px solid var(--line)}.gc-lista .gc-fila:first-child{border-top:0}.gc-dat{flex:1 1 14rem;min-width:0;display:flex;flex-direction:column;gap:.125rem}.gc-fila .inp{flex:0 1 13rem;width:auto}
.numc-auto{font-size:1.75rem;font-family:var(--f-display,inherit);display:block;margin-top:.25rem}

/* Archivos */
.zona-subir{display:flex;align-items:center;justify-content:center;text-align:center;padding:1.25rem;border:1.5px dashed var(--line-2,var(--line));border-radius:var(--r-card);cursor:pointer;transition:border-color .15s,background .15s}
.zona-subir>span{display:flex;flex-direction:column;align-items:center;gap:.25rem}.zona-subir svg{width:1.5rem;height:1.5rem;color:var(--accent)}
.zona-subir:hover,.zona-subir.sobre{border-color:var(--accent);background:var(--accent-soft,rgba(200,170,110,.08))}
.subida{display:flex;align-items:center;gap:.75rem;padding:.25rem .125rem}.subida .small:first-child{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.meta-12{display:flex;align-items:center;gap:.5rem;font-size:.875rem}.meta-12 b{font-size:1.25rem}
.arch .acc2{display:flex;gap:.375rem;align-items:center}
.obj-asig{grid-column:2/-1}.asig{display:flex;flex-direction:column;gap:.375rem;align-items:flex-start}.asig-op{cursor:pointer;gap:.25rem}

/* Seguimiento */
.seg-cards{align-items:stretch}.seg-c{display:flex;flex-direction:column;gap:.5rem;align-items:flex-start}.seg-c .btn{align-self:stretch;text-align:center;justify-content:center}
.seg-opc{display:flex;flex-wrap:wrap;gap:.375rem}.seg-opc label{display:inline-flex;cursor:pointer}.seg-opc input{position:absolute;opacity:0;pointer-events:none}.seg-opc span{padding:.5rem .875rem;border:1px solid var(--line);border-radius:99px}.seg-opc input:checked+span{border-color:var(--accent);background:var(--accent-soft,rgba(200,170,110,.15));color:var(--accent);font-weight:600}.seg-opc input:focus-visible+span{outline:2px solid var(--accent)}
.rep-fila{border-top:1px solid var(--line)}.rep-fila:first-child{border-top:0}.rep-fila>summary{list-style:none;display:flex;gap:.75rem;align-items:center;padding:.75rem var(--pad);cursor:pointer}.rep-fila>summary::-webkit-details-marker{display:none}.rep-fila .name{flex:1}.rep-fila .datos{padding:0 var(--pad) var(--pad)}
html[data-ancho=cel] .rep-fila .datos{grid-template-columns:1fr}

/* celular del cliente (17/10) */
.seg-carp{flex-wrap:wrap;max-width:100%}.seg-carp button{flex:0 0 auto;white-space:nowrap}
html[data-ancho=cel] .seg-carp{display:grid;grid-template-columns:1fr 1fr;border-radius:var(--r-card)}html[data-ancho=cel] .seg-carp button{justify-content:space-between}
.seg-mes{display:grid;grid-template-columns:repeat(4,1fr);max-width:32rem}.seg-mes button{white-space:nowrap;padding-inline:.375rem}
fieldset.lbl{border:0;padding:0;margin:0;min-width:0}fieldset.lbl legend{padding:0;margin-bottom:.375rem;font-weight:600}
@media (pointer:coarse){.cfg-nav button{min-height:max(2.75rem,44px)}.mostrar input,label input[type=checkbox]{width:1.375rem;height:1.375rem}}
html[data-ancho=cel] .kb-n,html[data-ancho=cel] .kb-pie,html[data-ancho=cel] .kb-chip{font-size:.75rem}
html[data-ancho=cel] .tabbar a .tx{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}

/* Marca Nexus (logo de facundoledesma.com, mejorado) */
.logo-ico{width:2.125rem;height:2.125rem;border-radius:.5rem;flex:none;display:block;box-shadow:0 0 0 1px rgba(214,170,80,.25)}
.logo-palabra{display:block;margin-bottom:.1875rem}
.marca-ent{display:flex;flex-direction:column;align-items:center;gap:.625rem;margin-bottom:.5rem}
.logo-ent{width:min(17rem,78%);height:auto;display:block}
.marca-ent .rol{font-size:.75rem;letter-spacing:.18em;color:var(--mute)}
.logo-c{display:none}
html[data-tema=claro] .logo-o{display:none}html[data-tema=claro] .logo-c{display:block}

/* una pantalla: en compu, el bloque principal llena el alto y se desplaza por dentro */
.kpis-c .kpi{padding:.5rem var(--pad);gap:.0625rem}.kpis-c .kpi .v{font-size:1.375rem}.kpis-c .pie-k{min-height:0}
html:not([data-ancho=cel]) .page>.llena{flex:1 1 0;min-height:15rem;display:flex;flex-direction:column}
html:not([data-ancho=cel]) .llena>.kb{flex:1;min-height:0;align-items:stretch;padding-bottom:.25rem}
html:not([data-ancho=cel]) .llena .kb-col{max-height:none;min-height:0}
html:not([data-ancho=cel]) .llena .kb-lista{flex:1;min-height:0}
html:not([data-ancho=cel]) .llena>.tabla{flex:1;min-height:0;overflow-y:auto}
html:not([data-ancho=cel]) .llena>.vacio,html:not([data-ancho=cel]) .llena>.card:only-child{flex:1}
.fin-cuerpo{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1.15fr);gap:var(--gap);flex:1;min-height:0}
.fin-c{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.fin-in{flex:1;min-height:0;padding:var(--pad);display:flex;align-items:center;justify-content:center}
.fin-in>.graf{width:100%;height:100%;max-height:100%}
.fin-lista{flex-direction:column;align-items:stretch;justify-content:flex-start;overflow-y:auto;padding:.25rem 0}
.fin-lista>.fin-vacio{margin:auto}
.fin-mov{display:grid;grid-template-columns:minmax(0,1fr) auto 2.25rem;gap:.5rem;align-items:center;padding:.5rem var(--pad);border-top:1px solid var(--line)}
.fin-mov:first-child{border-top:0}.fm-n{display:flex;flex-direction:column;min-width:0}.fm-n b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fin-form{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin:.5rem;border-style:dashed}.fin-form .btn{grid-column:1/-1}
.fin-vacio{display:flex;flex-direction:column;align-items:center;text-align:center;gap:.375rem;max-width:18rem;padding:1rem}
.fin-vacio b{font-family:var(--serif);font-size:1rem;font-weight:600}
.fv-ico{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:99px;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent);margin-bottom:.25rem}
.fv-ico svg{width:1.125rem;height:1.125rem}
.fin-hero{padding:.75rem 1.25rem}.fh-v{font-size:1.875rem}.anillo{width:3.25rem;height:3.25rem}
html[data-ancho=cel] .fin-cuerpo{grid-template-columns:minmax(0,1fr)}
html[data-ancho=cel] .fin-in{min-height:11rem}html[data-ancho=cel] .fin-lista{max-height:none}
.leyenda-v b{white-space:nowrap}.leyenda-v li>span:nth-child(2){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html:not([data-ancho=cel]) .page>.llena{min-height:11rem}
@media (max-height:660px){.fin-hero{padding:.5rem 1rem}.fh-v{font-size:1.5rem}.fh-b .graf{height:2.25rem}.anillo{width:2.5rem;height:2.5rem}.kpis-c .kpi{padding:.375rem .75rem}.kpis-c .kpi .v{font-size:1.125rem}}
@media (max-width:1400px){.gasto-d{flex-direction:column;align-items:stretch}.gasto-d .graf{align-self:center;max-width:6rem}}
.fh-b .graf{overflow:hidden}
.fin-in.gasto-d>.graf{height:auto;max-height:55%}

/* roles con casillas */
.rol-chips{display:flex;flex-wrap:wrap;gap:.25rem;margin:.25rem 0}
.rol-chip{font-size:.75rem;font-weight:650;padding:.125rem .5rem;border-radius:99px;background:color-mix(in srgb,var(--c) 16%,transparent);color:var(--c);border:1px solid color-mix(in srgb,var(--c) 40%,transparent)}
.rc-accent{--c:var(--accent)}.rc-link{--c:var(--link)}.rc-warn{--c:var(--warn)}.rc-ok{--c:var(--ok)}.rc-mute{--c:var(--mute)}.rc-bad{--c:var(--bad)}
.obj-roles{grid-column:1/-1}.rol-btn{min-height:2.5rem}
.roles-f{display:flex;flex-direction:column;gap:.5rem;border-style:dashed;min-width:0;scroll-margin:.75rem 0 6rem}.roles-f .add{margin-top:.25rem}html[data-ancho=cel] .roles-f .add .btn{flex:1 1 40%;min-height:max(2.75rem,44px)}
.roles-l{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,13rem),1fr));gap:.5rem}
html:not([data-ancho=cel]) .roles-f{scroll-margin-bottom:.75rem} /* en compu no hay barra de abajo: el margen de 6 rem corría el panel hacia arriba y lo cortaba (QA 28/10) */
.rol-op{display:flex;gap:.625rem;align-items:center;min-width:0;min-height:max(3rem,44px);padding:.5rem .75rem;border-radius:.75rem;border:1px solid var(--line);cursor:pointer;transition:background .2s,border-color .2s}
.rol-op{position:relative}.rol-op input{position:absolute;opacity:0;pointer-events:none}.rol-op>span:last-child{display:flex;flex-direction:column;min-width:0;overflow-wrap:anywhere}
.rol-box{display:grid;place-items:center;width:1.5rem;height:1.5rem;flex:none;border-radius:.4rem;border:2px solid color-mix(in srgb,var(--c) 60%,var(--line));color:transparent;transition:all .2s}
.rol-box svg{width:1rem;height:1rem}
.rol-op:has(input:checked){background:color-mix(in srgb,var(--c) 12%,transparent);border-color:color-mix(in srgb,var(--c) 50%,var(--line))}
.rol-op:has(input:checked) .rol-box{background:var(--c);border-color:var(--c);color:var(--bg)}
.rol-op:has(input:focus-visible){outline:2px solid var(--c);outline-offset:2px}
/* inicio del cliente: bloques grandes de color */
.hola h1{font-size:1.625rem}.mano{display:inline-block;animation:saluda 2.4s ease-in-out 1}
@keyframes saluda{0%,60%,100%{transform:rotate(0)}10%,30%{transform:rotate(14deg)}20%,40%{transform:rotate(-8deg)}}
.bloques{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.bloque{--c:var(--accent);position:relative;display:flex;flex-direction:column;gap:.25rem;padding:1.125rem;min-height:8.5rem;border-radius:1.125rem;text-decoration:none;color:var(--ink);background:linear-gradient(160deg,color-mix(in srgb,var(--c) 26%,var(--surface)),color-mix(in srgb,var(--c) 8%,var(--surface)));border:1px solid color-mix(in srgb,var(--c) 38%,transparent);transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .2s,opacity .2s}
.bloque:hover{transform:translateY(-2px);box-shadow:0 10px 28px color-mix(in srgb,var(--c) 22%,transparent)}.bloque:active{transform:scale(.97);opacity:.85}
.bloque:focus-visible{outline:3px solid var(--c);outline-offset:3px}
.bloque b{font-size:1.125rem;margin-top:auto}.bloque>span:last-child{font-size:.875rem;opacity:.75}
.b-ico{display:grid;place-items:center;width:max(2.75rem,44px);height:max(2.75rem,44px);border-radius:.875rem;background:color-mix(in srgb,var(--c) 30%,transparent);color:var(--c)}.b-ico svg{width:1.375rem;height:1.375rem}
.b-oro{--c:var(--accent)}.b-azul{--c:var(--link)}.b-verde{--c:var(--ok)}.b-lila{--c:#b48ae0}
.respira{animation:respira 3.6s ease-in-out infinite}
@keyframes respira{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--c) 0%,transparent)}50%{box-shadow:0 0 0 .5rem color-mix(in srgb,var(--c) 14%,transparent)}}
.meta-s{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;padding:.875rem var(--pad)}.meta-s b{display:block;font-size:1.5rem}.meta-s small{font-size:.8125rem;color:var(--mute);font-weight:500}
.mas-num>summary{align-self:flex-start}.mas-num[open]{display:flex;flex-direction:column;gap:var(--gap)}
html[data-ancho=cel] .bloques{grid-template-columns:1fr 1fr}html[data-ancho=cel] .bloque{min-height:8rem;padding:1rem}
html[data-ancho=cel] .meta-s{grid-template-columns:1fr auto}html[data-ancho=cel] .meta-s .barra{grid-column:1/-1;grid-row:2}
html[data-mov=quieto] .respira,html[data-mov=quieto] .mano{animation:none}
@media (prefers-reduced-motion:reduce){.respira,.mano{animation:none!important}}

/* calendario de contenido por mes */
.cal{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.cal-top{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;padding:.5rem var(--pad);border-bottom:1px solid var(--line)}
.cal-tit{font-family:var(--serif);font-size:1.125rem;min-width:9rem;text-align:center;text-transform:capitalize}.cal-ley{margin-left:auto}
.cal-cuerpo{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column}
.cal-s{display:grid;grid-template-columns:6.5rem 1fr;border-top:1px solid var(--line)}.cal-s:first-child{border-top:0}
.cal-sh{display:flex;flex-direction:column;justify-content:center;gap:.125rem;padding:.5rem .75rem;background:var(--raised)}
.cal-g{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.cal-d{min-height:4.25rem;padding:.3125rem;border-left:1px solid var(--line);display:flex;flex-direction:column;gap:.25rem;min-width:0}
.cal-d.fuera{opacity:.35}.cal-d.hoy{background:var(--accent-soft)}.cal-d.hoy .cal-n{color:var(--accent);font-weight:700}
.cal-n{font-size:.75rem;color:var(--mute)}
.cal-p{display:flex;flex-direction:column;padding:.25rem .375rem;border-radius:.4rem;border-left:3px solid var(--c);background:color-mix(in srgb,var(--c) 14%,transparent);font-size:.75rem;line-height:1.25;min-width:0}
.cal-p b,.cal-p span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cal-p span{opacity:.75;font-size:.75rem}
html:not([data-ancho=cel]) .llena>.cal{flex:1}
html[data-ancho=cel] .cal-s{grid-template-columns:1fr}html[data-ancho=cel] .cal-g{grid-template-columns:1fr}
html[data-ancho=cel] .cal-d{border-left:0;border-top:1px solid var(--line);min-height:0;display:grid;grid-template-columns:3.5rem minmax(0,1fr);column-gap:.5rem;row-gap:.25rem;align-items:start}
html[data-ancho=cel] .cal-d>.cal-n{grid-column:1;grid-row:1;align-self:center;min-height:2.25rem;display:flex;align-items:center}html[data-ancho=cel] .cal-d>.cal-p{grid-column:2}
html[data-ancho=cel] .cal-d.vacio-d,html[data-ancho=cel] .cal-d.fuera{display:none}html[data-ancho=cel] .cal-n{min-width:3.5rem;font-size:.75rem}
html[data-ancho=cel] .cal-p{min-width:0}html[data-ancho=cel] .cal-ley{display:none}
html[data-ancho=cel] .cal-p span{font-size:.75rem}
.cal-tit{text-transform:none}.cal-tit::first-letter{text-transform:uppercase}
.cal-nada{display:none}html[data-ancho=cel] .cal-nada{display:block;padding:.5rem .75rem;font-size:.8125rem;color:var(--mute)}
.mostrar{display:flex;align-items:center;gap:.625rem;min-height:max(2.75rem,44px);cursor:pointer}.mostrar input{width:1.5rem;height:1.5rem;flex:none}

/* barra lateral que se asoma */
.lat-zona{display:none}
@media (min-width:861px){
  .shell.plegado .side{position:fixed;left:8px;top:var(--lat-top,3.25rem);bottom:.625rem;width:calc(var(--side-w) - .25rem);z-index:45;border:1px solid var(--line-2,var(--line));border-radius:14px;box-shadow:0 24px 64px -10px rgba(0,0,0,.65);visibility:hidden;opacity:0;transform:translateX(-16px);pointer-events:none;transition:opacity .15s,transform .2s,visibility 0s linear .2s}
  html[data-peek="1"] .shell.plegado .side{visibility:visible;opacity:1;transform:none;pointer-events:auto;transition:opacity .15s,transform .2s,visibility 0s}
  .shell.plegado~.lat-zona,html:has(.shell.plegado) .lat-zona{display:block;position:fixed;left:0;top:0;bottom:0;width:10px;z-index:44}
  html[data-peek="1"] [data-act=plegar]{background:var(--hover);color:var(--ink)}
}
/* compu baja: la barra asomada entra entera sin desplazarse (sin el logo, filas de 28 px; solo mouse, el dedo sigue con 44 px) */
@media (min-width:861px) and (max-height:820px) and (pointer:fine){
  .shell.plegado .side{gap:.375rem;padding-block:.5rem}
  .shell.plegado .side .marca{padding-block:0}
  .shell.plegado .side .nav a{min-height:1.75rem;padding-block:.125rem}
  .shell.plegado .side .nav .grupo{margin-top:.375rem}
  .shell.plegado .side .pie{padding-block:.375rem}
}
@media (prefers-reduced-motion:reduce){.shell.plegado .side{transition:none!important}}
/* clientes: tarjetas y lista */
.cl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(14rem,1fr));gap:var(--gap);overflow-y:auto;align-content:start;min-height:0}
.cl-tarj{display:flex;flex-direction:column;align-items:flex-start;gap:.375rem;padding:var(--pad);text-decoration:none;color:inherit;transition:transform .18s,border-color .18s}
.cl-tarj:hover{transform:translateY(-2px);border-color:var(--accent-line)}.cl-tarj b{font-size:1rem}
.cl-lista{display:flex;flex-direction:column;overflow-y:auto}.cl-fila{display:grid;grid-template-columns:auto minmax(0,1.5fr) minmax(0,1fr) auto;gap:.75rem;align-items:center;padding:.5rem var(--pad);border-top:1px solid var(--line);text-decoration:none;color:inherit;min-height:max(2.75rem,44px)}
.cl-fila:first-child{border-top:0}.cl-fila:hover{background:var(--hover)}.cl-fila b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kb-link{color:inherit;text-decoration:none;display:block}
.llena>.tabla .th{position:sticky;top:0;z-index:1}

/* Medidas tomadas de Notion (docs/NOTION_medidas.md, 17/10): con mouse, filas de 37 px y encabezado liviano de 36 px.
   Con el dedo (pointer:coarse) no cambia nada: las filas siguen en 44 px. Densidad «Cómoda» deja las filas como estaban. */
@media (pointer:fine){
  html:not([data-dens=comoda]) .tabla .tr{min-height:2.3125rem;padding-block:.3125rem}
  .tabla .th{min-height:2.25rem;padding-block:.375rem;text-transform:none;letter-spacing:0;font-weight:500;font-size:var(--fs)}
}
/* selector de vista común (Plan, Tareas, Archivos): en el celular, solo íconos */
.seg-vista button{display:inline-flex;align-items:center;gap:.375rem}
.seg-vista svg{width:1rem;height:1rem;flex:none}
html[data-ancho=cel] .seg-vista .tx{display:none}
html[data-ancho=cel] .seg-vista button{min-width:max(2.75rem,44px);justify-content:center}
/* lista larga que se desplaza por dentro para que la página entre en una pantalla (Plan · Lista) */
.llena-scroll{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--gap);padding-right:2px}
html[data-ancho=cel] .llena-scroll{overflow:visible}
/* barra asomada en compus bajas: marca completa pero compacta */
@media (min-width:861px) and (max-height:820px) and (pointer:fine){
  .shell.plegado .side .marca{gap:.5rem;padding:0 .375rem}.shell.plegado .side .marca .logo-ico{width:1.625rem;height:1.625rem}
  .shell.plegado .side .logo-palabra{font-size:.9375rem;margin-bottom:.0625rem}.shell.plegado .side .marca .rol{display:none}
  .shell.plegado .side .pie{padding-block:.25rem}.shell.plegado .side .pie .quien .small{display:none}
}
@media (min-width:861px) and (max-height:680px) and (pointer:fine){
  .shell.plegado .side{gap:.25rem;padding-block:.375rem}
  .shell.plegado .side .nav a{min-height:1.5rem;padding-block:0;font-size:.8125rem}
  .shell.plegado .side .nav .grupo{margin:.25rem .625rem 0;font-size:.75rem}
}
@media (min-width:861px) and (max-height:600px) and (pointer:fine){
  .shell.plegado .side .nav a{min-height:1.3125rem;font-size:.78125rem}.shell.plegado .side .nav{gap:0}
}

/* «Ver como» en el encabezado (solo equipo): un toque para pasar a la vista de un cliente y volver */
.ver-como{display:inline-flex;align-items:center;gap:.375rem;min-height:var(--alto-ctrl,2.25rem);padding:0 .625rem;border:1px solid var(--line-2,var(--line));border-radius:var(--r-ctrl);background:var(--surface);color:var(--ink);font:inherit;font-size:var(--fs);cursor:pointer;max-width:16rem}
.ver-como svg{width:1rem;height:1rem;flex:none;color:var(--accent)}
.ver-como .vc-et{color:var(--mute)}
.ver-como b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ver-como.es-cl{border-color:var(--ok);background:var(--ok-bg)}.ver-como.es-cl svg{color:var(--ok)}
.ver-como:hover{border-color:var(--accent-line)}
.vc-fl{color:var(--mute);font-size:.75em}
.pop-vc{width:18rem;padding:.375rem;display:flex;flex-direction:column;gap:.25rem}
.vc-op{display:flex;align-items:center;gap:.625rem;width:100%;min-height:2.5rem;padding:.25rem .5rem;border:0;border-radius:var(--r-ctrl);background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.vc-op:hover,.vc-op[aria-current=true]{background:var(--hover)}.vc-op[aria-current=true]{box-shadow:inset 0 0 0 1px var(--accent-line)}
.vc-op .av{width:1.75rem;height:1.75rem;flex:none;display:grid;place-items:center;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-weight:700}
.vc-op .av svg{width:1rem;height:1rem}
.vc-tit{padding:.5rem .5rem .125rem;font-size:var(--fs-chico);font-weight:700;color:var(--dim);text-transform:uppercase;letter-spacing:.06em}
.vc-lista{display:flex;flex-direction:column;gap:.125rem;overflow-y:auto;max-height:min(22rem,calc(100vh - 12rem))}
html[data-ancho=cel] .ver-como{max-width:9.5rem;min-height:max(2.75rem,44px);padding:0 .5rem}
html[data-ancho=cel] .ver-como .vc-et{display:none}
html[data-ancho=cel] .vc-op{min-height:max(2.75rem,44px)}
/* botón de la barra lateral: se nota si está fija (dorado) o escondida */
.lat-btn[aria-pressed=true]{background:var(--accent-soft);color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent-line)}
/* compus muy bajas (≤600 px útiles, p. ej. 1280×570): el resumen y el embudo comprimen arriba y lo largo se desplaza por dentro */
@media (min-width:861px) and (max-height:600px){
  html:not([data-ancho=cel]) .page>.llena{min-height:6.5rem}
  .hero{padding-block:.5rem}.hero .v{font-size:1.75rem}.hero svg{max-height:1.25rem}
  .kpi{padding-block:.375rem}
}
/* accesos de la ficha (Archivos, Plan): el ícono no tenía tamaño y salía gigante */
.plan-link>svg{width:1.5rem;height:1.5rem;flex:none;color:var(--accent)}
/* dentro del contenedor que se desplaza, los bloques conservan su alto (como .page>*) */
.llena-scroll>*{flex:none}
/* celulares angostos (≤360 px): «Ver como» queda solo con el ícono para no cortar el título (el cartel verde ya dice qué cliente) */
@media (max-width:360px){html[data-ancho=cel] .ver-como b,html[data-ancho=cel] .ver-como .vc-fl{display:none}html[data-ancho=cel] .ver-como{min-width:max(2.75rem,44px);justify-content:center}}
/* Logo NEXUS (17/10): texto real, Times New Roman, espaciado 0,278 em, color sólido; sin imagen, no se estira ni se reescala */
.logo-palabra,.logo-nexus{font-family:"Times New Roman",Times,serif;font-weight:400;font-style:normal;text-transform:none;letter-spacing:.278em;margin-right:-.278em;color:#EDEFF3;opacity:1;line-height:1;white-space:nowrap;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision;font-kerning:none}
.logo-palabra{font-size:1.0625rem}
.logo-ent-txt{display:block;font-size:2.25rem;text-align:center;padding:.25rem 0}
html[data-tema=claro] .logo-palabra,html[data-tema=claro] .logo-nexus{color:#16181a}
/* Leads: vistas Lista y Cronograma (las otras reusan tabla, tablero, calendario y tarjetas) */
.lv-lista{padding:.25rem 0}
.lv-fila{display:flex;align-items:center;gap:.625rem;width:100%;min-height:max(2.75rem,44px);padding:.5rem var(--pad);background:none;border:0;border-top:1px solid var(--line);color:inherit;font:inherit;text-align:left;cursor:pointer}
.lv-fila:first-child{border-top:0}
.lv-fila:hover{background:var(--hover)}
.lv-punto{width:.5rem;height:.5rem;border-radius:50%;flex:none}
.lv-fila .name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lv-der{margin-left:auto;white-space:nowrap}
.lv-cscroll{overflow-x:auto}
.lv-cgrid{display:grid;grid-template-columns:minmax(8rem,11rem) repeat(var(--dias),minmax(1.6rem,1fr));min-width:52rem;row-gap:.25rem;padding:0 var(--pad) var(--pad);align-items:center}
.lv-dia{font-size:max(.72rem,11px);color:var(--mute);text-align:center;font-variant-numeric:tabular-nums;padding-bottom:.25rem;border-bottom:1px solid var(--line)}
.lv-dia.hoy{color:var(--ink);font-weight:700}
.lv-cn{grid-column:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:.5rem}
.lv-barra{min-height:1.75rem;border:1px solid var(--c);background:color-mix(in srgb,var(--c) 22%,transparent);color:var(--ink);border-radius:.375rem;font:inherit;font-size:.75rem;padding:0 .4rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;margin:0 1px}
html[data-ancho=cel] .lv-barra{min-height:max(2.75rem,44px)} /* en el celular las barras del cronograma se tocan con el dedo: 44 px */
.lv-barra:hover{background:color-mix(in srgb,var(--c) 38%,transparent)}

/* ===== Traído del portal de embajadores (17/10), con la marca de Nexus ===== */
/* menú de la cuenta */
.cta-btn{display:flex;align-items:center;gap:.625rem;width:100%;min-width:0;padding:.375rem;border:0;border-radius:var(--r-ctrl);background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:background .15s}
.cta-btn:hover,.cta-btn[aria-expanded=true]{background:var(--hover)}
.cta-btn .quien{display:flex;flex-direction:column;min-width:0;flex:1}.cta-btn .quien b,.cta-btn .quien .small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cta-fl{color:var(--mute);font-size:.75em;transition:transform .2s}.cta-btn[aria-expanded=true] .cta-fl{transform:rotate(180deg)}
.pop-cta{top:auto;bottom:calc(4.25rem + env(safe-area-inset-bottom,0px));left:.75rem;right:auto;width:16.5rem;padding:.375rem;display:flex;flex-direction:column;gap:.125rem;transform-origin:bottom left;animation:cta-in .16s ease-out}
@keyframes cta-in{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}
.cta-cab{display:flex;gap:.625rem;align-items:center;padding:.5rem .5rem .625rem;border-bottom:1px solid var(--line);margin-bottom:.25rem}
.cta-cab>span:last-child{display:flex;flex-direction:column;min-width:0}.cta-cab .small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cta-rol{margin-top:.25rem;align-self:flex-start;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);background:var(--accent-soft);border-radius:999px;padding:.0625rem .5rem}
.cta-it{display:flex;align-items:center;gap:.625rem;width:100%;min-height:2.375rem;padding:0 .625rem;border:0;border-radius:var(--r-ctrl);background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.cta-it:hover,.cta-it:focus-visible{background:var(--hover)}.cta-it svg{width:1.0625rem;height:1.0625rem;flex:none;color:var(--mute)}
.cta-sep{height:1px;background:var(--line);margin:.25rem .375rem}
html[data-ancho=cel] .pop-cta{left:.75rem;right:.75rem;width:auto;bottom:calc(4.75rem + env(safe-area-inset-bottom,0px))}
html[data-ancho=cel] .cta-it{min-height:max(2.75rem,44px)}
/* barra de progreso al cambiar de pantalla */
#progreso{position:fixed;top:0;left:0;height:2px;width:0;z-index:80;background:linear-gradient(90deg,var(--accent),#f0d8a0);box-shadow:0 0 8px var(--accent);opacity:0;pointer-events:none}
#progreso.va{opacity:1;animation:prog .38s cubic-bezier(.2,.8,.2,1) forwards}#progreso.fin{opacity:0;transition:opacity .25s .05s}
@keyframes prog{from{width:0}to{width:100%}}
/* esqueleto de carga */
.esq-bloque{display:flex;flex-direction:column;gap:.625rem}
.esq-bloque i{display:block;height:2.5rem;border-radius:var(--r-ctrl);background:linear-gradient(90deg,var(--surface) 0%,var(--hover) 50%,var(--surface) 100%);background-size:200% 100%;animation:esq 1.2s ease-in-out infinite}
.esq-bloque i:nth-child(1){height:4.5rem}.esq-bloque i:nth-child(odd){width:96%}
@keyframes esq{from{background-position:100% 0}to{background-position:-100% 0}}
@media (prefers-reduced-motion:reduce){.esq-bloque i,#progreso.va,.pop-cta{animation:none}}
html[data-mov=quieto] .esq-bloque i,html[data-mov=quieto] .pop-cta{animation:none}
/* nitidez: texto e íconos definidos en todas las pantallas */
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
svg{shape-rendering:geometricPrecision}
img{image-rendering:auto}
.logo-ico{image-rendering:-webkit-optimize-contrast}
.lv-dia.finde{opacity:.6}
.llena>.lv-crono{display:flex;flex-direction:column;min-height:0;max-height:100%}.llena>.lv-crono>.lv-cscroll{overflow:auto;flex:1;min-height:0}.lv-cgrid .lv-dia{position:sticky;top:0;background:var(--surface);z-index:1}
.llena>.lv-lista{overflow-y:auto;min-height:0;flex:0 1 auto}

/* ===== Tamaños coherentes (17/10, pedido de David) =====
   Una sola escala: la barra lateral no se achica (si no entra, sus módulos se desplazan por dentro y la cuenta queda fija abajo);
   todos los controles del encabezado y los selectores de vista miden lo mismo en todos los módulos. */
:root{--ctl:2.25rem}
.shell:not(.plegado) .side{overflow:hidden}
.shell:not(.plegado) .side .nav{flex:1 1 auto;min-height:0;overflow-y:auto;scrollbar-width:thin;margin-inline:-.25rem;padding-inline:.25rem}
.side .pie{flex:none}
.side .nav a{font-size:var(--fs);min-height:2.125rem}
.cta-btn .quien b{font-size:var(--fs);font-weight:600}
.cta-btn .avatar{width:1.75rem;height:1.75rem;font-size:.75rem}
.top .ver-como,.top .buscar,.top .ico{height:var(--ctl);min-height:0}
.top .ico{width:var(--ctl)}
.ver-como,.buscar{font-size:var(--fs)}
#main .seg button{height:2rem;min-height:0;font-size:var(--fs);font-weight:600;padding:0 .75rem;display:inline-flex;align-items:center;gap:.375rem}
#main .seg button svg{width:1rem;height:1rem;flex:none}
#main .btn{min-height:var(--ctl)}#main .btn.mini{min-height:2rem;font-size:var(--fs-chico)}
@media (pointer:coarse){:root{--ctl:max(2.75rem,44px)}#main .seg button{height:max(2.75rem,44px)}#main .btn.mini{min-height:max(2.75rem,44px)}#main .ctd-s{min-width:max(4.5rem,44px)}}
.vc-rol{background:var(--accent-soft);color:var(--accent)}
/* «Ver como» nunca en dos renglones; la zona de subir se resalta al llegar desde «Subir un video» */
.ver-como .vc-et,.ver-como b{white-space:nowrap}
.zona-subir.resalta{animation:resalta 1.6s ease-out 2;border-color:var(--accent)}
@keyframes resalta{0%{box-shadow:0 0 0 0 var(--accent-line)}100%{box-shadow:0 0 0 14px transparent}}
@media (prefers-reduced-motion:reduce){.zona-subir.resalta{animation:none}}
/* ===== Pieza de contenido: página central como Notion ===== */
.ov-pz{align-items:center}
.pz{width:min(46rem,calc(100% - 2rem));max-height:min(92vh,52rem);background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-card);box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden;margin:auto}
.pz-cab{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem .5rem 1.5rem;border-bottom:1px solid var(--line)}.pz-cab .ico{margin-left:auto}
.pz-cuerpo{flex:1;min-height:0;overflow-y:auto;padding:1.25rem 1.5rem 1rem;display:flex;flex-direction:column;gap:.75rem}
.pz-tit{font-family:var(--serif);font-size:1.75rem;font-weight:600;border:0;background:none;color:var(--ink);padding:0;outline:none;width:100%}
.pz-tit::placeholder{color:var(--dim)}
.pz-err{margin:-.25rem 0 0;font-size:.875rem}
.pz-props{display:flex;flex-direction:column;gap:.125rem;padding-bottom:.75rem;border-bottom:1px solid var(--line)}
.pz-prop{display:grid;grid-template-columns:8.5rem minmax(0,1fr);align-items:center;min-height:2.25rem;border-radius:var(--r-ctrl)}
.pz-prop:hover{background:var(--hover)}
.pz-n{display:flex;align-items:center;gap:.5rem;color:var(--mute);font-size:var(--fs);padding-left:.25rem}.pz-n svg{width:1rem;height:1rem;flex:none}
.pz-v{display:flex;align-items:center;gap:.5rem;min-width:0}
.pz-in{min-width:0;flex:0 1 auto;max-width:100%;height:2rem;border:1px solid transparent;border-radius:var(--r-ctrl);background:none;color:var(--ink);font:inherit;font-size:var(--fs);padding:0 .5rem}
.pz-in[type=url]{flex:1}
.pz-in:hover,.pz-in:focus{border-color:var(--line-2);background:var(--raised);outline:none}
.pz-in option{background:var(--surface)}
.pz-txt{padding:0 .5rem;font-size:var(--fs)}
.pz-punto{width:.5rem;height:.5rem;border-radius:50%;flex:none;margin-left:.5rem}
.pz-glbl{font-size:var(--fs-chico);color:var(--mute);font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.pz-guion{flex:1;min-height:12rem;resize:vertical;border:1px solid var(--line);border-radius:var(--r-ctrl);background:var(--raised);color:var(--ink);font:inherit;font-size:var(--fs);line-height:1.6;padding:.75rem}
.pz-guion:focus{outline:2px solid var(--accent-line)}
.pz-pie{display:flex;align-items:center;gap:.5rem;padding:.625rem 1.5rem;border-top:1px solid var(--line)}.pz-pie .small{margin-right:auto}
html[data-ancho=cel] .pz{width:100%;max-height:100%;height:100%;border-radius:0}
html[data-ancho=cel] .pz-prop{grid-template-columns:6.5rem minmax(0,1fr)}
html[data-ancho=cel] .pz-cuerpo,html[data-ancho=cel] .pz-pie{padding-inline:1rem}
/* ===== Calendario como Notion: tarjetas teñidas con chips y «+» por día ===== */
.cal-p{font:inherit;text-align:left;color:var(--ink);background:color-mix(in srgb,var(--c) 14%,var(--surface));border:1px solid color-mix(in srgb,var(--c) 30%,transparent);border-left:1px solid color-mix(in srgb,var(--c) 30%,transparent);gap:.25rem;padding:.375rem .5rem;width:100%}
button.cal-p{cursor:pointer}button.cal-p:hover{background:color-mix(in srgb,var(--c) 24%,var(--surface))}
.cal-chips{display:flex;flex-wrap:wrap;gap:.25rem;opacity:1!important;white-space:normal!important}
.cal-chip{display:inline-flex;align-items:center;gap:.25rem;font-size:.75rem;line-height:1.1;padding:.125rem .375rem;border-radius:.25rem;background:var(--hover);color:var(--ink-2);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-chip i{width:.4rem;height:.4rem;border-radius:50%;flex:none}
.cal-chip.fo{background:color-mix(in srgb,var(--warn) 18%,transparent)}
.cal-n{display:flex;align-items:center;gap:.25rem}
.cal-mas{margin-left:auto;width:1.75rem;height:1.75rem;margin-block:-.25rem;border:0;border-radius:.25rem;background:none;color:var(--mute);font:inherit;line-height:1;cursor:pointer;opacity:0}
.cal-d:hover .cal-mas,.cal-mas:focus-visible{opacity:1}.cal-mas:hover{background:var(--hover);color:var(--ink)}
@media (pointer:coarse){.cal-mas{display:none}} /* en pantallas táctiles el «+» de cada día es muy chico: se crea con «Nueva pieza» */
.ov-pz{padding:4vh 1rem}html[data-ancho=cel] .ov-pz{padding:0}
/* ===== Franja de tema por semana (como el calendario de publicación de Notion) ===== */
.cal-s.con-franja{grid-template-rows:auto 1fr}
.cal-franja{grid-column:1/-1;display:block;width:calc(100% - 1rem);margin:.5rem .5rem 0;padding:.5rem .875rem;border-radius:.5rem;border:0;text-align:left;font:inherit;font-size:var(--fs);color:#15171c;background:var(--tc);line-height:1.35;overflow-wrap:anywhere}
.cal-franja b{font-weight:700}
button.cal-franja{cursor:pointer}button.cal-franja:hover{filter:brightness(1.06)}
.cal-franja.vacia{background:var(--raised);color:var(--ink-2);border:1px solid var(--line)}
.cal-franja.vacia:hover{color:var(--ink);border-color:var(--borde-ui)}
.tema-cols{display:flex;gap:.5rem}
.tema-col{position:relative;cursor:pointer}.tema-col input{position:absolute;opacity:0}
.tema-col span[aria-hidden]{display:block;width:2rem;height:2rem;border-radius:50%;background:var(--tc);border:2px solid transparent}
.tema-col input:checked+span{border-color:var(--ink);box-shadow:0 0 0 2px var(--surface) inset}
.tema-col input:focus-visible+span{outline:2px solid var(--accent)}

/* «Mi plan» con formularios de GHL: ventana con el formulario real adentro, con el marco de Nexus */
.form-btn{gap:.375rem}.form-btn svg{width:.9375rem;height:.9375rem}
.ov-form{z-index:60}
.modal.fform{width:min(46rem,96vw);max-width:none;height:min(52rem,92vh);display:flex;flex-direction:column}
.ff-tit{display:flex;flex-direction:column;min-width:0}.ff-tit b{font-family:var(--serif);font-size:1.125rem;line-height:1.2}
.ff-marco{position:relative;flex:1;min-height:0;background:#fff;border-block:1px solid var(--line)}
.ff-marco iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#fff}
.ff-carga{position:absolute;inset:1rem;z-index:1}
.ff-pie{display:flex;align-items:center;justify-content:flex-end;gap:.75rem;padding:.75rem var(--pad);flex-wrap:wrap}.ff-pie .small{margin-right:auto}
.modal.pforms{width:min(44rem,96vw);max-width:none;max-height:90vh;display:flex;flex-direction:column}
.pf-in{padding:var(--pad);overflow-y:auto;display:flex;flex-direction:column;gap:.5rem;min-height:0}
.pf-fila{display:flex;align-items:center;gap:.75rem;padding:.5rem 0;border-top:1px solid var(--line)}.pf-fila .grow{display:flex;flex-direction:column;min-width:0}
.pf-fila select{flex:0 1 16rem;min-width:0}
html[data-ancho=cel] .modal.fform{width:100vw;height:100%;max-height:none;border-radius:0}
html[data-ancho=cel] .pf-fila{flex-wrap:wrap}html[data-ancho=cel] .pf-fila select{flex:1 1 100%}
/* ===== Guiones por mes: contenido | anuncios ===== */
.gu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);min-height:0;height:100%}
.gu-col{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.gu-cab{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;padding:.625rem var(--pad);border-bottom:1px solid var(--line)}.gu-cab .btn{margin-left:auto}
.gu-lista{flex:1;min-height:0;overflow-y:auto;padding:.5rem;display:flex;flex-direction:column;gap:.5rem}
.gu-it{display:flex;flex-direction:column;gap:.375rem;width:100%;text-align:left;font:inherit;color:var(--ink);background:var(--raised);border:1px solid var(--line);border-radius:var(--r-ctrl);padding:.625rem .75rem;cursor:pointer}
.gu-it:hover{border-color:var(--borde-ui);background:var(--hover)}
.gu-t{display:flex;flex-direction:column;gap:.125rem}
.gu-g{font-size:var(--fs-chico);color:var(--ink-2);line-height:1.5;white-space:pre-line;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.gu-g i{color:var(--dim)}
.gu-it .kb-chip{align-self:flex-start}
html[data-ancho=cel] .gu{grid-template-columns:1fr;height:auto}
/* ===== Armar el plan de contenido ===== */
.modal.pc{max-width:40rem}
.pc-fila{display:flex;gap:.75rem;flex-wrap:wrap;align-items:flex-end}.pc-fila .lbl{flex:1 1 12rem}
.pc-dias{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.375rem}
.pc-dia{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.pc-dia>button{height:2.25rem;border:1px solid var(--line-2);border-radius:var(--r-ctrl);background:var(--raised);color:var(--mute);font:inherit;font-weight:600;cursor:pointer}
.pc-dia.on>button{background:var(--accent-soft);color:var(--ink);border-color:var(--accent-line)}
.pc-dia select{height:2rem;padding:0 .25rem;font-size:var(--fs-chico)}
html[data-ancho=cel] .pc-dias{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (pointer:coarse){button.cal-franja{min-height:max(2.75rem,44px)}}

.pf-dos{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}html[data-ancho=cel] .pf-dos{grid-template-columns:1fr}
.pforms .lbl{gap:.25rem}

/* Archivos como el Drive de Ro: tres carpetas grandes y el resto detrás de «Más carpetas» */
.carp-grandes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:.5rem;margin-bottom:.5rem}
.carp-g{display:flex;align-items:center;gap:.625rem;padding:.5rem .875rem;border:1px solid var(--line);border-radius:var(--r,.75rem);background:var(--surface);color:var(--ink);text-align:left;cursor:pointer;min-height:0;min-width:0}
.carp-g>span{display:flex;flex-direction:column;min-width:0}.carp-g b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.carp-g svg{width:1.375rem;height:1.375rem;flex:none;color:var(--accent)}
.carp-g[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft)}
.carp-mas{padding:0 1rem;border:1px dashed var(--line);border-radius:var(--r,.75rem);background:transparent;color:var(--mute);cursor:pointer;min-height:max(2.75rem,44px)}
html[data-ancho=cel] .carp-grandes{grid-template-columns:repeat(4,minmax(0,1fr));gap:.375rem}html[data-ancho=cel] .carp-g{flex-direction:column;align-items:flex-start;gap:.25rem;min-height:0;padding:.5rem .625rem}html[data-ancho=cel] .carp-g svg{width:1.25rem;height:1.25rem}html[data-ancho=cel] .carp-g b{white-space:normal;font-size:.8125rem;line-height:1.15}html[data-ancho=cel] .carp-g .small{display:none}html[data-ancho=cel] .carp-mas{grid-column:1/-1;min-height:2.25rem}

/* Configuración: misma caja en todas las secciones (no cambia de tamaño al pasar de una a otra) */
.ov-cfg>.modal.cfg{width:min(58rem,calc(100vw - 2rem));height:min(38rem,calc(100dvh - 2rem))}
.cfg-cuerpo{height:100%;min-height:0}.cfg-in{flex:1;min-height:0}.cfg-in .inp{width:100%;max-width:26rem}
html[data-ancho=cel] .ov-cfg>.modal.cfg{width:100vw;height:92dvh}
/* carpetas grandes en una sola línea (que Archivos siga entrando en una pantalla de 1366×640) */
.carp-g{padding:.375rem .75rem}.carp-g>span{flex-direction:row;align-items:baseline;gap:.5rem}.carp-g .small{white-space:nowrap}
.carp-mas{min-height:2.25rem}
@media (max-height:720px){.zona-subir{padding:.625rem}.carp-grandes{margin-bottom:.25rem}}
/* Onboarding (18/10): pasos, tarjetas de los 2 formularios y formulario tipo Typeform a pantalla completa */
.ing-pasos{list-style:none;display:flex;gap:.5rem;margin:0 0 1rem;padding:0;flex-wrap:wrap}
.ing-pasos li{display:flex;align-items:center;gap:.5rem;padding:.375rem .75rem .375rem .375rem;border:1px solid var(--line);border-radius:999px;color:var(--mute);font-size:.875rem}
.ing-pasos li.ahora{border-color:var(--accent);color:var(--ink)}.ing-pasos li.hecho{color:var(--ink-2)}
.ing-num{display:grid;place-items:center;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--raised);font-size:.75rem;font-weight:700}
.ing-pasos li.ahora .ing-num{background:var(--accent);color:var(--accent-ink)}.ing-pasos li.hecho .ing-num{background:var(--accent-soft);color:var(--accent)}.ing-num svg{width:.875rem;height:.875rem}
.ing-forms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.ing-form{display:flex;flex-direction:column;gap:.625rem;padding:1.125rem}.ing-form .btn{align-self:flex-start}.ing-form.listo{opacity:.85}
.ing-f-cab{display:flex;justify-content:space-between;align-items:center;gap:.5rem}.ing-f-cab b{font-family:var(--serif);font-size:1.125rem}
.ing-nota{margin-top:.75rem}
.ing-paso{display:flex;flex-direction:column;gap:.75rem;align-items:flex-start;padding:1.5rem;max-width:40rem}.ing-paso h2{margin:0;font-family:var(--serif)}
.ing-eq{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.625rem}.ing-eq-fila{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}
.ing-sw{display:flex;flex-direction:row;align-items:center;gap:.5rem;font-size:.8125rem;color:var(--ink-2);margin-left:auto;cursor:pointer}.ing-sw input{width:1.25rem;height:1.25rem}
.ing-sec{margin:.25rem 0}.ing-sec summary{cursor:pointer;font-weight:600;padding:.375rem 0}.ing-qa{padding:.375rem 0;border-top:1px solid var(--line)}.ing-qa p{margin:.125rem 0 0;white-space:pre-wrap}
.ov-tf{position:fixed;inset:0;z-index:70;background:var(--bg);display:flex;animation:ovIn .2s both}
.tf{flex:1;display:flex;flex-direction:column;min-height:0}
.tf-cab{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem}
.tf-barra{position:absolute;left:0;right:0;top:0;height:4px;background:var(--line)}.tf-barra i{display:block;height:100%;background:var(--accent);transition:width .3s}
.tf-q{flex:1;width:min(42rem,100%);margin:0 auto;padding:1rem 1.25rem 2rem;display:flex;flex-direction:column;justify-content:center;gap:.875rem;overflow-y:auto;animation:tfIn .25s both}
.tf-q h2{margin:0;font-family:var(--serif);font-size:clamp(1.25rem,2.4vw,1.75rem);line-height:1.25}
.tf-n{color:var(--accent);font-weight:700;font-size:.875rem}.tf-obl{color:var(--accent)}
.tf-in{width:100%;font:inherit;font-size:1.25rem;color:var(--ink);background:transparent;border:0;border-bottom:2px solid var(--line-2);padding:.5rem 0;outline:none;resize:vertical}
.tf-in:focus{border-bottom-color:var(--accent)}
.tf-ops{display:flex;flex-direction:column;gap:.5rem}
.tf-op{display:flex;align-items:center;gap:.75rem;text-align:left;padding:.75rem 1rem;min-height:max(2.75rem,44px);border:1px solid var(--line-2);border-radius:.625rem;background:var(--surface);color:var(--ink);font:inherit;cursor:pointer}
.tf-op[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft)}
.tf-letra{display:grid;place-items:center;width:1.5rem;height:1.5rem;border:1px solid var(--line-2);border-radius:.25rem;font-size:.75rem;font-weight:700;flex:none}
.tf-acc{display:flex;gap:.625rem;margin-top:.5rem}
@keyframes tfIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
html[data-mov=quieto] .tf-q,html[data-mov=quieto] .ov-tf{animation:none}
html[data-ancho=cel] .ing-forms{grid-template-columns:1fr}html[data-ancho=cel] .ing-sw{margin-left:0}
html[data-ancho=cel] .tf-in{font-size:1.0625rem}html[data-ancho=cel] .tf-q{justify-content:flex-start;padding-top:1.5rem}
.ing-barra{height:6px;border-radius:999px;background:var(--line);overflow:hidden}.ing-barra i{display:block;height:100%;background:var(--accent);border-radius:inherit}.ing-barra.ok i{background:var(--ok)}
.ov.ov-tf{padding:0;place-items:stretch;align-items:stretch}.tf-q h2,.ing-paso h2{color:var(--ink)}.ing-paso h2{font-size:1.375rem}
/* Chat estudio ↔ equipo (18/10) */
.ch-n{display:inline-grid;place-items:center;min-width:1.25rem;height:1.25rem;padding:0 .3rem;margin-left:auto;border-radius:999px;background:var(--accent);color:var(--accent-ink);font-size:.75rem;font-weight:700;line-height:1}
.chat{display:flex;flex-direction:column;flex:1;min-height:0;border:1px solid var(--line);border-radius:var(--r-card,.75rem);background:var(--surface);overflow:hidden}
.ch-lista{flex:1;min-height:12rem;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.5rem}
.ch-m{max-width:min(36rem,82%);align-self:flex-start;padding:.5rem .75rem;border-radius:.875rem .875rem .875rem .25rem;background:var(--raised);display:flex;flex-direction:column;gap:.125rem}
.ch-m.mio{align-self:flex-end;border-radius:.875rem .875rem .25rem .875rem;background:var(--accent-soft);border:1px solid var(--accent-line)}
.ch-m p{margin:0;white-space:pre-wrap;word-break:break-word}.ch-autor{font-size:.75rem;font-weight:600;color:var(--ink-2)}.ch-m.eq:not(.mio) .ch-autor{color:var(--accent)}.ch-hora{font-size:.75rem;color:var(--dim);align-self:flex-end}
.ch-env{display:flex;gap:.5rem;align-items:flex-end;padding:.625rem;border-top:1px solid var(--line)}.ch-env textarea{flex:1;resize:none;min-height:max(2.75rem,44px);max-height:10rem}
.ch-dos{display:grid;grid-template-columns:18rem 1fr;gap:.75rem;flex:1;min-height:0}
.ch-ests{display:flex;flex-direction:column;gap:.25rem;overflow-y:auto;min-height:0}
.ch-est{display:flex;align-items:center;gap:.5rem;padding:.625rem .75rem;border-radius:.625rem;color:var(--ink);text-decoration:none;border:1px solid transparent}
.ch-est:hover{background:var(--hover)}.ch-est.on{background:var(--accent-soft);border-color:var(--accent-line)}
.ch-est .grow{display:flex;flex-direction:column;min-width:0}.ch-est .small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ch-der{display:flex;flex-direction:column;gap:.5rem;min-height:0}.ch-tit{font-family:var(--serif);font-size:1.125rem}.ch-volver{display:none}
#main[data-vista=vChatCl],#main[data-vista=vChatEq]{display:flex;flex-direction:column}
html[data-ancho=cel] .ch-dos{grid-template-columns:1fr}html[data-ancho=cel] .ch-dos.con-sel .ch-ests{display:none}html[data-ancho=cel] .ch-dos:not(.con-sel) .ch-der{display:none}html[data-ancho=cel] .ch-volver{display:inline}
html[data-ancho=cel] .ing-pasos{gap:.375rem}html[data-ancho=cel] .ing-pasos li{padding:.25rem .625rem .25rem .25rem;font-size:.8125rem}
/* Celular: casillas y «Más carpetas» con zona de toque de 40 px o más */
html[data-ancho=cel] .carp-mas{min-height:max(2.75rem,44px)}
html[data-ancho=cel] input[type=checkbox]{-webkit-appearance:none;appearance:none;flex:none;width:2.5rem;height:2.5rem;margin:0;border:1.5px solid var(--borde-ui);border-radius:.625rem;background:var(--surface);display:inline-grid;place-items:center;cursor:pointer}
html[data-ancho=cel] input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}
html[data-ancho=cel] input[type=checkbox]:checked::after{content:'';width:.5rem;height:1rem;border:solid var(--accent-ink);border-width:0 3px 3px 0;transform:translateY(-2px) rotate(45deg)}
html[data-ancho=cel] input[type=checkbox]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.seg-opc label{position:relative}.seg-opc input[type=radio]{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}.seg-opc label:has(input:checked){background:var(--accent-soft);color:var(--ink);box-shadow:inset 0 0 0 1px var(--accent-line)}.seg-opc label:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:-2px}
html[data-ancho=cel] .seg-opc label{min-height:max(2.75rem,44px);display:flex;align-items:center;justify-content:center}
/* Google Drive con varias cuentas (Integraciones) */
.drv-cta{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:12px 0;border-top:1px solid var(--line)}
.drv-nueva{display:grid;gap:6px;padding-top:12px;border-top:1px solid var(--line)}
.drv-nueva input{flex:1 1 180px;min-width:0}
.drv-est{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line)}
.drv-est select{max-width:55%}

.punto{display:inline-block;width:.5625rem;height:.5625rem;border-radius:50%;background:#d33;margin-left:.375rem;flex:none;vertical-align:middle}
.tx + .punto{margin-left:auto}

/* === Pruebas de Ro del 19/10 (celular primero) === */
.ej{font-size:.75rem;padding:.0625rem .5rem;line-height:1.3}
.top-cta{display:none;padding:0}
.top-cta .avatar{width:1.75rem;height:1.75rem;font-size:.8125rem}
html[data-ancho=cel] .top-cta{display:inline-grid}
html[data-ancho=cel] .ej .ej-x{display:none}
html[data-ancho=cel] .vc{font-size:.75rem;padding:.125rem .5rem;line-height:1.35}
html[data-ancho=cel] .vc button{min-height:2rem}
html[data-ancho=cel] .top{gap:.375rem}
/* «Ver como»: desplegable chico, pegado arriba a la derecha */
.pop-vc{width:15rem;max-height:min(26rem,calc(100vh - 5rem))}
.pop-vc .vc-op{min-height:2.25rem;padding:.125rem .5rem}
.pop-vc .vc-op b{font-weight:600}
.vc-det{display:flex;flex-direction:column}
.vc-det>summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;min-height:2.25rem}
.vc-det>summary::-webkit-details-marker{display:none}
.vc-det>summary::after{content:'▾';color:var(--mute);margin-left:auto;padding-left:.5rem;transition:transform .15s}
.vc-det[open]>summary::after{transform:rotate(180deg)}
.vc-det .vc-lista{max-height:min(14rem,calc(100vh - 14rem))}
html[data-ancho=cel] .pop-vc{top:calc(var(--alto-top, 3.5rem) + .25rem);right:.5rem;left:auto;width:min(15rem,calc(100vw - 1rem))}
/* cuenta desde el encabezado del celular */
html[data-ancho=cel] .pop-cta{top:3.5rem;bottom:auto;left:auto;right:.5rem;width:min(16.5rem,calc(100vw - 1rem));transform-origin:top right}
/* ventanas: el fondo no se desliza y la ventana respeta el celular */
html.con-modal,html.con-modal body{overflow:hidden}
.modal{overscroll-behavior:contain}
html[data-ancho=cel] .ov{padding:calc(env(safe-area-inset-top,0px) + .75rem) .75rem calc(env(safe-area-inset-bottom,0px) + .75rem);align-items:flex-end}
html[data-ancho=cel] .modal{max-height:calc(100dvh - 2rem);max-width:none}
html[data-ancho=cel] #f-ncl .cuerpo{gap:.625rem}
html[data-ancho=cel] #f-ncl .btn{width:100%}
/* logo de la entrada: menos ancho y menos «de escritorio» en el celular */
html[data-ancho=cel] .logo-ent-txt{font-size:1.5rem;letter-spacing:.14em}
html[data-ancho=cel] .marca-ent{gap:.375rem}

/* Archivos: carpetas propias y mover */
.nueva-carp{margin:.25rem 0}.nueva-carp>summary{display:inline-flex;list-style:none;cursor:pointer}.nueva-carp>summary::-webkit-details-marker{display:none}
.nc-f{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.5rem}.nc-f .inp{flex:1 1 12rem;min-width:0}
.mov{position:relative;display:inline-block}.mov>summary{list-style:none;cursor:pointer}.mov>summary::-webkit-details-marker{display:none}
.mov-f{position:absolute;z-index:30;right:0;top:calc(100% + .25rem);display:flex;flex-direction:column;gap:.375rem;width:14rem;padding:.5rem;background:var(--surface);border:1px solid var(--line-2);border-radius:var(--r-card);box-shadow:var(--shadow)}
.page>[data-act=carp-del],.page>.nueva-carp{align-self:flex-start}

.cta-tit{padding:.375rem .5rem .125rem;font-size:var(--fs-chico);font-weight:700;color:var(--dim);text-transform:uppercase;letter-spacing:.06em}
.pop-cta .cta-it .avatar{width:1.5rem;height:1.5rem;font-size:.75rem;flex:none}

/* Videos de módulos y proceso comercial (20/10) */
.vids{margin:.5rem 0 1rem}.vids h2{margin:0 0 .5rem}
.vid-fila{display:flex;gap:.625rem;overflow-x:auto;padding-bottom:.25rem;scroll-snap-type:x proximity}
.vid-card{flex:0 0 min(15rem,78%);scroll-snap-align:start;display:flex;flex-direction:column;gap:.25rem;text-align:left;padding:.75rem;border:1px solid var(--line-2);border-radius:var(--r-card);background:var(--surface);color:var(--ink);font:inherit;cursor:pointer;min-height:5.5rem}
.vid-card:hover{border-color:var(--accent-line)}.vid-card.visto{opacity:.8}
.vid-pl{width:2rem;height:2rem;display:grid;place-items:center;border-radius:50%;background:var(--accent-soft);color:var(--accent)}.vid-pl svg{width:1rem;height:1rem}
.vid-m{max-width:44rem}.vid-marco{position:relative;aspect-ratio:16/9;background:#000;border-radius:var(--r-ctrl);overflow:hidden}.vid-marco video{position:absolute;inset:0;width:100%;height:100%}.vid-sube{display:flex;flex-wrap:wrap;gap:.5rem}.vid-b{min-height:44px;cursor:pointer}.vid-marco iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vid-links{display:flex;flex-wrap:wrap;gap:.5rem}
.seg-proc{display:flex;flex-wrap:wrap;max-width:32rem}.seg-proc button{flex:1 1 auto;white-space:nowrap;padding-inline:.5rem}

/* Pasada «romper» 20/10: desplegables y etiquetas chicas */
details.card.pad>summary{cursor:pointer;min-height:2rem;display:flex;align-items:center;gap:.5rem}
@media (pointer:coarse){details>summary{min-height:max(2.75rem,44px);display:flex;align-items:center}}
html[data-ancho=cel] details.card.pad>summary{min-height:max(2.75rem,44px)}

/* === Testeo 3 (20/10): una sola pantalla, sin rebote, ventanas centrales === */
html,body{overflow:hidden;overscroll-behavior:none}
body{position:fixed;inset:0;width:100%}
.page{overscroll-behavior-y:none}
.shell{height:calc(100dvh - var(--insp-h))}
html[data-ancho=cel] .bloques{gap:.5rem}
html[data-ancho=cel] .bloque{display:grid;grid-template-columns:2rem 1fr;grid-template-areas:"i t" "i d";column-gap:.625rem;row-gap:0;align-items:center;min-height:3.25rem;padding:.5rem .75rem;border-radius:.875rem}
html[data-ancho=cel] .bloque .b-ico{grid-area:i;width:2rem;height:2rem;border-radius:.625rem}
html[data-ancho=cel] .bloque .b-ico svg{width:1.125rem;height:1.125rem}
html[data-ancho=cel] .bloque b{grid-area:t;font-size:.9375rem;margin-top:0;line-height:1.15}
html[data-ancho=cel] .bloque>span:last-child{grid-area:d;font-size:.75rem;line-height:1.2;opacity:.75}
html[data-ancho=cel] .vids{margin:.125rem 0 .375rem}
html[data-ancho=cel] .vids h2{margin:0 0 .25rem}
html[data-ancho=cel] .vid-card{min-height:3.75rem;padding:.5rem .625rem;gap:.125rem}
html[data-ancho=cel] .vid-pl{width:1.5rem;height:1.5rem}
html[data-ancho=cel] .hola h1{font-size:1.375rem}
html[data-ancho=cel] .hola .sub{margin:0}
/* «Ver como»: la palabra completa */
html[data-ancho=cel] .ver-como{max-width:none;min-width:0;flex:0 1 auto}
html[data-ancho=cel] .ver-como>svg{display:none}
html[data-ancho=cel] .ver-como b{overflow:visible;text-overflow:clip;max-width:none}
@media (max-width:360px){html[data-ancho=cel] .ver-como b,html[data-ancho=cel] .ver-como .vc-fl{display:inline}html[data-ancho=cel] .ver-como{min-width:44px;justify-content:flex-start}}
.top .mig{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* ventanas: tarjeta central con aire, no pantalla completa */
html[data-ancho=cel] .ov-cfg{place-items:center;padding:max(1rem,env(safe-area-inset-top)) .75rem max(1rem,env(safe-area-inset-bottom))}
html[data-ancho=cel] .modal.cfg{height:min(82dvh,40rem);border-radius:1.125rem;animation-name:cfgIn}
html[data-ancho=cel] .ov:not(.ov-peek):not(.ov-cfg){align-items:center}
html[data-ancho=cel] .modal{max-height:min(86dvh,calc(100dvh - 2rem))}
/* fechas y campos adentro de las ventanas: nunca pasan el borde */
.modal input,.modal select,.modal textarea,.pforms input,.pforms select,.pforms textarea{min-width:0;max-width:100%;box-sizing:border-box}
.modal input[type=date],.modal input[type=time],.modal input[type=datetime-local],.modal input[type=month]{width:100%;-webkit-appearance:none;appearance:none;min-height:2.5rem}

/* Ficha: accesos grandes y permiso */
.accesos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.acc-g{min-height:4.5rem}
html[data-ancho=cel] .accesos{grid-template-columns:1fr}
.drv-auto{display:flex;gap:.5rem;align-items:center;cursor:pointer;min-height:2.75rem}.drv-auto input{width:1.25rem;height:1.25rem;flex:none}.drv-auto span{line-height:1.2}.drv-auto .small{display:block}
.perm-f{display:flex;gap:.75rem;align-items:flex-start;cursor:pointer}.perm-f input{margin-top:.25rem;width:1.25rem;height:1.25rem;flex:none}

/* Resumen del estudio en pantallas bajas (compu chica, 720 px o menos): las mismas fichas bajas que en el celular */
.bloque{min-height:6.25rem;padding:.875rem}
.vid-card{min-height:4.5rem}
@media (max-height:760px){
  .bloques{gap:.5rem}
  .bloque{display:grid;grid-template-columns:2rem 1fr;grid-template-areas:"i t" "i d";column-gap:.625rem;row-gap:0;align-items:center;min-height:3.25rem;padding:.5rem .75rem;border-radius:.875rem}
  .bloque .b-ico{grid-area:i;width:2rem;height:2rem;border-radius:.625rem}.bloque .b-ico svg{width:1.125rem;height:1.125rem}
  .bloque b{grid-area:t;font-size:.9375rem;margin-top:0;line-height:1.15}
  .bloque>span:last-child{grid-area:d;font-size:.75rem;line-height:1.2;opacity:.75}
  .vid-card{min-height:3.75rem;padding:.5rem .625rem}.vids{margin:.125rem 0 .375rem}.vids h2{margin:0 0 .25rem}
  .hola h1{font-size:1.375rem}
}

/* Chat: la caja de escribir queda fija abajo y solo los mensajes se deslizan (testeo 3) */
.chat{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
.chat .ch-lista{flex:1 1 0;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.chat .ch-env{flex:none;align-items:center;padding:.5rem .625rem calc(.5rem + env(safe-area-inset-bottom,0px))}
.chat .ch-env textarea{min-height:2.5rem;align-self:stretch}
.chat .ch-env .btn{align-self:stretch;flex:none}
.ch-dos .chat{min-height:0}

/* === Selector de carpetas de Google Drive (administradores) === */
.sel-drive{display:flex;flex-direction:column;width:min(34rem,calc(100vw - 1.5rem));max-height:min(40rem,calc(100dvh - 2rem))}
.sel-cuerpo{display:flex;flex-direction:column;gap:.5rem;min-height:0;flex:1;overflow:hidden}
.sel-raices{flex:none;display:flex;gap:.25rem;overflow-x:auto}
.sel-raices .seg-b{flex:1 1 auto;white-space:nowrap;min-height:2.5rem}
.sel-busca{flex:none;display:flex;gap:.375rem}.sel-busca .inp{flex:1;min-width:0}
.sel-migas{flex:none;display:flex;flex-wrap:wrap;gap:.125rem .25rem;align-items:center;font-size:.8125rem}
.sel-migas .lnk{min-height:2rem;padding:0 .25rem;overflow-wrap:anywhere;text-align:left}
.sel-lista{flex:1;min-height:6rem;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:.25rem}
.sel-it{min-height:max(2.75rem,44px);width:100%;text-align:left}.sel-it .name{min-width:0;overflow-wrap:anywhere}
.sel-msg{padding:.75rem .25rem;margin:0}
.sel-nueva{flex:none}.sel-nueva .inp{flex:1;min-width:0}
.sel-pie{flex-wrap:wrap;gap:.5rem}.sel-donde{flex:1 1 100%;overflow-wrap:anywhere}
.sel-pie .btn{flex:1 1 auto;min-height:max(2.75rem,44px)}
.sel-cta{flex:none}
.drv-aviso{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;padding:.625rem .75rem;border-radius:.75rem;background:var(--warn-bg,rgba(230,160,40,.14));margin:.25rem 0}
.drv-fila{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;justify-content:space-between;padding:.5rem 0;border-top:1px solid var(--line,rgba(128,128,128,.2))}
.drv-fila .add{display:flex;gap:.375rem;flex-wrap:wrap}
.drv-ficha{margin-top:.75rem}
.nc-loc{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;justify-content:space-between;margin-top:.5rem}
.nc-loc .add{display:flex;gap:.375rem;flex-wrap:wrap}
html[data-ancho=cel] .sel-drive{width:calc(100vw - 1.5rem);max-height:calc(100dvh - 2rem)}

.sel-it{display:flex;align-items:center;gap:.625rem;padding:.375rem .625rem}
.sel-ic{flex:none;display:inline-grid;place-items:center;width:1.5rem;height:1.5rem}
.sel-ic svg{width:1.25rem;height:1.25rem}
.sel-raices .seg-b{font-size:.875rem;padding:0 .5rem;min-width:0}
/* globito de «sin leer» sobre el ícono de la barra de abajo (no empuja la fila) */
html[data-ancho=cel] .tabbar a{position:relative}
html[data-ancho=cel] .tabbar a .ch-n{position:absolute;top:.125rem;left:calc(50% + .25rem);margin:0;min-width:1.1875rem;height:1.1875rem;font-size:.75rem}

/* texto mínimo legible aunque todo nazca al 92 % */
.kb-n,.kb-chip{font-size:max(.6875rem,11px)}

/* === Revisar mis respuestas: ventana central, lista a la izquierda y la pregunta (mismo diseño de siempre) a la derecha === */
.tf-revbtn{margin-left:auto;margin-right:.5rem;flex:none}
.ov-rev{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.6);display:grid;place-items:center;padding:1rem;animation:ovIn .2s both}
.tf-ventana{width:min(72rem,100%);height:min(42rem,calc(100dvh - 2rem));display:flex;flex-direction:column;min-height:0;background:var(--bg);border:1px solid var(--line);border-radius:1rem;overflow:hidden;box-shadow:0 1.5rem 4rem rgba(0,0,0,.5)}
.tf-ventana .cab-m{flex:none}.tf-cuenta{margin-left:.75rem}
.tf-rev{flex:1;min-height:0;display:grid;grid-template-columns:minmax(15rem,22rem) minmax(0,1fr)}
.tf-lista{overflow-y:auto;overscroll-behavior:contain;border-right:1px solid var(--line);padding:.5rem;display:flex;flex-direction:column;gap:.125rem}
.tf-lista-cab{position:sticky;top:-.5rem;background:var(--bg);padding:.25rem 0 .5rem;z-index:1}
.tf-sec{font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);padding:.75rem .5rem .25rem}
.tf-fila{display:flex;align-items:flex-start;gap:.625rem;text-align:left;width:100%;min-height:max(2.75rem,44px);padding:.5rem;border:1px solid transparent;border-radius:.625rem;background:transparent;color:var(--ink);cursor:pointer}
.tf-fila:hover{background:var(--surface)}
.tf-fila.on{border-color:var(--accent);background:var(--accent-soft)}
.tf-est{flex:none;display:grid;place-items:center;width:1.25rem;height:1.25rem;margin-top:.125rem;border:1.5px solid var(--line-2);border-radius:50%}
.tf-fila.ok .tf-est{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.tf-est svg{width:.75rem;height:.75rem}
.tf-ft{display:flex;flex-direction:column;min-width:0;font-size:.875rem;line-height:1.3;overflow-wrap:anywhere}
.tf-fin{margin-top:.5rem}
.tf-vacio{padding:.75rem .5rem;margin:0}
.tf-vista{display:flex;flex-direction:column;min-width:0;min-height:0;position:relative}
.tf-vista .tf-q{width:min(36rem,100%)}
.tf-volver{display:none;align-self:flex-start;margin:.5rem}
html[data-ancho=cel] .ov-rev{padding:0}
html[data-ancho=cel] .tf-ventana{height:100dvh;border-radius:0;width:100%;border:0}
html[data-ancho=cel] .tf-rev{grid-template-columns:1fr}
html[data-ancho=cel] .tf-ventana[data-v=lista] .tf-vista{display:none}
html[data-ancho=cel] .tf-ventana[data-v=pregunta] .tf-lista{display:none}
html[data-ancho=cel] .tf-volver{display:inline-flex}
html[data-ancho=cel] .tf-lista{border-right:0}
html[data-ancho=cel] .tf-revbtn{font-size:.75rem;padding:0 .5rem}
.tf-fila,.tf-sec,.tf-lista-cab{flex:none}
.tf-ventana .cab-m{display:flex;align-items:center;gap:.5rem;padding:.75rem 1rem;border-bottom:1px solid var(--line)}
.tf-ft{line-height:1.35;gap:.125rem}
.tf-fila{padding:.625rem .5rem}

/* === 4º testeo (20/10): formulario sin barra, botón fijo sobre el teclado, sin fundido que deje ver la app === */
.ov-tf{inset:auto;left:0;right:0;top:var(--vvt,0px);height:var(--vvh,100dvh);animation:none;background:var(--bg)}
.ov-rev{inset:auto;left:0;right:0;top:var(--vvt,0px);height:var(--vvh,100dvh)}
.tf-cab{padding:0;height:4px}
.tf-sec-et{font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--mute)}
.tf-pie{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem}
.tf-enlaces{display:flex;flex-wrap:wrap;gap:.25rem 1.25rem}
.tf-enlaces .lnk{min-height:2.25rem;font-size:.875rem}
.tf-bigbtn{display:none;align-self:flex-start}
.tf-in.tf-big{min-height:min(22rem,calc(var(--vvh,100dvh) - 14rem))}
.tf-resp{display:block;color:var(--mute);font-size:.8125rem;margin-top:.125rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html[data-ancho=cel] .tf-q{justify-content:flex-start;padding-top:1.5rem;padding-bottom:0;min-height:0}
html[data-ancho=cel] .tf-pie{position:sticky;bottom:0;margin-top:auto;background:var(--bg);padding:.75rem 0 calc(.5rem + env(safe-area-inset-bottom,0px));z-index:2}
html[data-ancho=cel] .tf-acc{display:flex;gap:.5rem;margin-top:0}
html[data-ancho=cel] .tf-acc .btn{flex:1;min-height:max(2.75rem,44px)}
html[data-ancho=cel] .tf-acc.tf-acc-fin{flex-direction:column-reverse}
html[data-ancho=cel] .tf-tec{display:none}
html[data-ancho=cel] .tf-bigbtn{display:inline-flex}
html[data-ancho=cel] .tf-enlaces{justify-content:center}
html[data-ancho=cel] .tf-ventana{height:var(--vvh,100dvh)}
.ov-tf{padding:0;align-items:stretch;justify-content:stretch}
.ov-tf .tf{width:100%}
html[data-ancho] .ov.ov-tf:not(.zz1):not(.zz2){padding:0;align-items:stretch;justify-content:stretch}
.tf-vista .tf-enlaces{display:none}

.sug-fila{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;justify-content:space-between;padding:.5rem 0;border-top:1px solid var(--line,rgba(128,128,128,.2))}
.sug-fila .inp{flex:1 1 14rem;min-width:0;max-width:100%}

/* === Configurar el reporte semanal (administradores) === */
.rep-ver,.rep-ant{padding:.5rem .75rem;margin:0 0 .75rem}.rep-ant{margin:.5rem 0 0;border-top:1px solid var(--line,#e5e5e5);padding-top:.5rem}
.rv-fila{border-bottom:1px solid var(--line,#eee);padding:.2rem 0}.rv-fila:last-child{border-bottom:0}
.rv-a{all:unset;cursor:pointer;display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;width:100%;padding:.25rem 0}.rv-a:focus-visible{outline:2px solid var(--accent)}
.rv-pre{margin:.25rem 0 .25rem 1.2rem}.rv-acc{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin:.3rem 0}.rv-ed{display:grid;gap:.4rem}.rep-ley{margin:0 0 .5rem}
.rc-barra{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:.25rem 0 .75rem}
.rc-modal .sel-lista{gap:.5rem}
.rc-ven{display:flex;flex-direction:column;gap:.375rem;padding-bottom:.5rem}
.rc-f{display:flex;flex-wrap:wrap;gap:.375rem;align-items:flex-end}
.rc-f .lbl{flex:1 1 7rem;min-width:0}
.rc-q{display:flex;gap:.5rem;padding:.5rem 0;border-top:1px solid var(--line,rgba(128,128,128,.2))}
.rc-n{flex:none;width:1.25rem;color:var(--mute);padding-top:.625rem;font-size:.8125rem}
.rc-c{flex:1;min-width:0;display:flex;flex-direction:column;gap:.375rem}
.rc-c .inp,.rc-f .inp{min-width:0;max-width:100%}
.rc-f>select.inp{flex:0 0 9.5rem}
.rc-f>input.inp{flex:1 1 9rem}
.rc-b{display:inline-flex;gap:.25rem;margin-left:auto}
.rc-b .btn{min-width:2.75rem;min-height:2.75rem}
.rc-modal .btn.mini{min-height:2.75rem}

.rep-ghl{display:flex;flex-wrap:wrap;gap:.375rem;align-items:center;margin-top:.25rem}

/* === Centro de avisos === */
.top .campana{position:relative}
.camp-n{position:absolute;top:2px;right:2px;min-width:1.1rem;height:1.1rem;padding:0 .25rem;border-radius:99px;background:var(--bad,#d8434b);color:#fff;font-size:.75rem;font-weight:700;line-height:1.1rem;text-align:center}
.av-modal .sel-lista{gap:.375rem}
.av-fila{width:100%;text-align:left;align-items:flex-start;gap:.625rem}
.av-fila .grow{display:grid;gap:.125rem;min-width:0}
.av-fila .small{display:block;overflow-wrap:anywhere}
.av-p{flex:none;width:.625rem;height:.625rem;border-radius:50%;margin-top:.5rem;background:transparent}
.av-fila.nuevo .av-p{background:var(--accent)}
.av-fila.nuevo .name{font-weight:700}
.av-t{opacity:.75}
.av-vacio{display:grid;gap:.375rem;padding:1.5rem .5rem;text-align:center}

/* Ideas de contenido */
.idea-f{display:flex;flex-direction:column;gap:.5rem;margin-bottom:.5rem}.idea-f textarea{resize:vertical;min-height:2.75rem;max-height:7rem}
.idea-pie{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.idea-nom{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.idea-pie .btn[type=submit]{margin-left:auto}
.idea-ar{cursor:pointer}
.idea-lista{display:flex;flex-direction:column;gap:.5rem}
.idea{display:flex;flex-direction:column;gap:.375rem}.idea.off{opacity:.6}
.idea-cab{display:flex;align-items:flex-start;gap:.5rem;justify-content:space-between}.idea-t{overflow-wrap:anywhere}
.idea-x{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.idea-l{color:var(--accent);overflow-wrap:anywhere;font-size:.875rem}
.idea-img{display:block;max-width:100%}.idea-img img{max-width:100%;max-height:11rem;border-radius:.5rem;display:block;object-fit:cover}
.idea-ctrl{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}.idea-ctrl select{width:auto;min-width:0;flex:0 1 11rem}
.idea-cs{display:flex;flex-direction:column;gap:.25rem;border-top:1px solid var(--line);padding-top:.375rem}
.idea-c{display:flex;flex-direction:column;font-size:.875rem;overflow-wrap:anywhere}.idea-c.eq b{color:var(--accent)}
.idea-cf{display:flex;gap:.5rem}.idea-cf .inp{flex:1;min-width:0}
.idea-fila{display:flex;gap:.5rem;align-items:center}.idea-fila .inp{flex:1;min-width:0}.idea-mas{display:flex;flex-direction:column;gap:.5rem}.idea-mas>summary{cursor:pointer;color:var(--mute);padding:.25rem 0;min-height:2.75rem;display:flex;align-items:center}.idea-mas[open]>summary{margin-bottom:.375rem}.idea-mas[open]{display:flex}.idea-mas .inp{margin-bottom:.375rem}
.idea-f{padding:.625rem}

/* Formularios de anuncios */
.fa-vacio{display:flex;flex-direction:column;gap:.25rem;margin-bottom:.5rem}
.fa-k{margin-bottom:.5rem}
.fa-forms{display:flex;flex-wrap:wrap;gap:.375rem;align-items:center;margin-bottom:.5rem}.fa-err{color:var(--bad)}
.fa-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:.5rem;align-items:start}
html[data-ancho=cel] .fa-cols,html[data-min] .fa-cols{grid-template-columns:minmax(0,1fr)}
.fa-sem,.fa-lista{display:flex;flex-direction:column;gap:.375rem}
.fa-s{display:grid;grid-template-columns:5.5rem minmax(0,1fr) 2rem;gap:.5rem;align-items:center}.fa-s .num{text-align:right}
.fa-e{display:flex;gap:.5rem;align-items:flex-start;border-top:1px solid var(--line);padding-top:.375rem}.fa-e .grow{display:flex;flex-direction:column;min-width:0;overflow-wrap:anywhere}.fa-r{display:block}
.fa-cal{width:auto;flex:0 0 8.5rem}
.fa-f{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.5rem}.fa-f select{flex:1 1 12rem;min-width:0}
.fa-con{margin-top:.5rem}
html[data-ancho=cel] .fa-k{gap:.375rem}html[data-ancho=cel] .fa-k .kpi{padding:.5rem .625rem;gap:.125rem}

/* Campañas */
.cp-ctl{align-items:center}.cp-av{display:flex;flex-direction:column;gap:.125rem;margin:.375rem 0}
.cp-tabla .num{text-align:right}.cp-tot{font-weight:700;border-top:2px solid var(--line)}
.cp-cfg{display:inline-flex;align-items:center;gap:.5rem;margin-left:auto;flex-wrap:wrap}.cp-cfg-btn{border-color:var(--ink);font-weight:650}.cp-modal .cp-script{font-family:ui-monospace,monospace;font-size:var(--fs-chico);resize:none;min-height:3.5rem}.cp-modal .fa-f{flex-wrap:wrap}.cp-modal .cp-fila{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}@media (pointer:coarse){.cp-modal .btn.mini{min-height:max(2.75rem,44px)}#main .cp-cfg-btn{min-height:max(2.75rem,44px)}}html[data-ancho=cel] .cp-cfg{margin-left:0;width:100%}html[data-ancho=cel] #main .cp-cfg-btn,html[data-ancho=cel] .cp-modal .btn.mini{min-height:max(2.75rem,44px)}.cp-bloque{display:flex;flex-direction:column;gap:.5rem;padding:.5rem 0}.cp-bloque h3{margin:0;font-size:.9375rem}
.cp-script{font-family:ui-monospace,Consolas,monospace;font-size:.8125rem;resize:vertical}
.cp-fila{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.cp-otras{margin-top:.5rem}.cp-sc{display:flex;flex-direction:column;gap:.25rem}
html[data-ancho=cel] .cp-otras{grid-template-columns:minmax(0,1fr)}
.cp-tabla .th span:not(:first-child){text-align:right}

/* Seguridad */
.lbl[hidden]{display:none}
.sg-sec{font-size:1.125rem;letter-spacing:.08em;overflow-wrap:anywhere;margin:.25rem 0}
.sg-rec{display:block;padding:.5rem .75rem;background:var(--raised);border:1px dashed var(--line);border-radius:.5rem;margin:.375rem 0;font-size:.9375rem}
.sg-llave{overflow-wrap:anywhere;font-size:.875rem;user-select:all}
.sg-nueva{display:flex;flex-direction:column;gap:.375rem;margin:.375rem 0}
.sg-acc .row2{padding:.125rem 0}

.ia-ruta{display:flex;flex-direction:column;gap:.5rem;margin:.5rem 0}
html[data-ancho=cel] .cp-tabla .tr{grid-template-columns:minmax(0,1fr) repeat(3,auto);column-gap:.75rem;align-items:end}
html[data-ancho=cel] .cp-tabla .tr>.num{display:flex;flex-direction:column;align-items:flex-end;min-width:3.25rem}
html[data-ancho=cel] .cp-tabla .tr>.num::before{content:attr(data-et);font-size:.6875rem;color:var(--dim);font-weight:400}
.av-fila .small{white-space:pre-line}
.top>.buscar,.top>.campana{flex:none}.top>.ver-como{min-width:44px;flex:0 1 auto}
html[data-ancho=cel] .cp-tabla .tr>.num[data-oculto]{display:none}

/* Feedback de Rocío y Reportes y feedback */
.proc-dos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.75rem;align-items:start}
html[data-ancho=cel] .proc-dos,html[data-min] .proc-dos{grid-template-columns:minmax(0,1fr)}
.proc-izq,.proc-der{display:flex;flex-direction:column;gap:.5rem;min-width:0}.sec-t{font-size:1.0625rem;margin:0}
.fro-bloque{display:flex;flex-direction:column;gap:.375rem;border-color:var(--accent-line)}.fro-bloque h2{margin:0;font-size:1.0625rem}
.fro-x{display:block;white-space:pre-line;overflow-wrap:anywhere}
.fro .row{align-items:flex-start}.fro .name{overflow-wrap:anywhere}
.fro-f{display:flex;flex-direction:column;gap:.5rem;margin:.5rem 0}.fro-f textarea{resize:vertical;min-height:3rem;max-height:9rem}
.fro-nuevo{margin-top:.25rem}
.cic-dos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:.75rem;align-items:start}
html[data-ancho=cel] .cic-dos,html[data-min] .cic-dos{grid-template-columns:minmax(0,1fr)}
.cic-der{display:flex;flex-direction:column;gap:.75rem;min-width:0}.cic-resp h2,.cic-fb h2{margin:0 0 .25rem;font-size:1.0625rem}.cic-fb h3{font-size:.9375rem;margin:.5rem 0 0}
html[data-ancho=cel] .cic-resp .datos{grid-template-columns:minmax(0,1fr);gap:.125rem}html[data-ancho=cel] .cic-resp .datos dt{margin-top:.5rem;font-size:.8125rem}html[data-ancho=cel] .cic-resp .datos dd{margin:0;overflow-wrap:anywhere}

.carp-arriba{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:var(--gap);margin-bottom:var(--gap)}.carp-form{min-height:5.5rem}
.ctd{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;align-items:center;padding-block:.5rem}
.ctd-g{display:flex;align-items:center;gap:.5rem}
.ctd-g .num{font-size:1.25rem}
.ctd-n{flex-basis:100%}
.ctd-s{width:auto;text-align:center;font-weight:600}
.ctd-h{flex-basis:100%;margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:.125rem;color:var(--mute);font-size:.75rem}
.ctd-todo{flex-basis:100%}
.ctd-flot{position:fixed;z-index:61;left:50%;bottom:4.25rem;transform:translateX(-50%);max-width:92vw;pointer-events:none}
.ctd-flot .ctd-und{pointer-events:auto;min-height:44px;padding:0 1rem;position:relative;overflow:hidden;background:var(--ink);color:var(--bg);border-radius:var(--r-pill);font-weight:600;box-shadow:var(--shadow);white-space:nowrap}
.ctd-und::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:currentColor;opacity:.5;transform-origin:left;animation:ctd-t 5s linear forwards}
@keyframes ctd-t{to{transform:scaleX(0)}}
html[data-ancho=cel] .ctd-flot{bottom:calc(8rem + env(safe-area-inset-bottom))}
/* zoom 140 % en celular chico (ancho efectivo < 340 px): «Ver como» queda de ícono solo, si no se pisaba con la lupa y la campana (QA noche 22) */
html[data-min] .ver-como{min-width:max(2.75rem,44px);justify-content:center;flex:none}html[data-min] .ver-como b,html[data-min] .ver-como .vc-fl,html[data-min] .ver-como .vc-et{display:none}html[data-min] .ver-como>svg{display:block}html[data-min] .top{padding-inline:.375rem;gap:.25rem}
/* Celular (390): todo control tocable mide 44 px o más (QA 22/10, T1 a T6). En compu siguen compactos. */
html[data-ancho=cel] .drv-auto{min-height:max(2.75rem,44px)}
html[data-ancho=cel] .pz-tit{min-height:max(2.75rem,44px)}
html[data-ancho=cel] .pz-in,html[data-ancho=cel] .nxs-campo{height:max(2.75rem,44px)}
html[data-ancho=cel] .pz-prop{min-height:max(2.75rem,44px)}
html[data-ancho=cel] .tf-in{min-height:max(2.75rem,44px)}
html[data-ancho=cel] .tf-enlaces .lnk{display:inline-flex;align-items:center;min-height:max(2.75rem,44px)}
html[data-ancho=cel] a.kb-link{display:flex;flex-direction:column;justify-content:center;min-height:max(2.75rem,44px)}
html[data-ancho=cel] a.btn.mini[href*="?ver=1"]{min-width:max(2.75rem,44px)}
/* ---------- Plan de trabajo como documento (22/10): fila simple arriba del plan + lector dentro de la app (estilo Notion: sin bordes pesados, mucho aire) ---------- */
.pdoc-b{display:flex;flex-direction:column;gap:.25rem;padding:.25rem 0 .75rem;border-bottom:1px solid var(--line)}
.pdoc-b.pdoc-vacio{flex-direction:row;flex-wrap:wrap;align-items:center;gap:.5rem .75rem}.pdoc-vacio .grow{flex:1 1 14rem;min-width:0}.pdoc-vacio .grow b,.pdoc-fila .grow b{display:block}.pdoc-vacio .small{display:block}
.pdoc-fila{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .75rem}.pdoc-fila .grow{flex:1 1 14rem;min-width:0}.pdoc-fila .small{display:block;overflow-wrap:anywhere}
.pdoc-fila .acc2{margin-left:0;padding:0}
.pdoc-hist{padding-top:.25rem}.pdoc-hist summary{cursor:pointer;color:var(--dim);padding:.25rem 0}.pdoc-hist .pdoc-fila{padding:.375rem 0;border-top:1px solid var(--line)}
.pdoc-b .btn{cursor:pointer}
.modal.pdoc{max-width:52rem;height:min(46rem,calc(100dvh - 8vh));max-height:none}
.modal.pdoc .cab-m{flex:none}.modal.pdoc .cab-m .small{color:var(--dim)}
.modal.pdoc .cuerpo{flex:1;min-height:0}
.doc-pdfw{flex:1;min-height:0;background:var(--surface)}.doc-pdf{display:block;width:100%;height:100%;border:0}
.doc-pie{flex:none;padding:.375rem var(--pad);border-top:1px solid var(--line)}
.doc-img{align-items:center}.doc-img img{max-width:100%;height:auto;border-radius:var(--r-ctrl)}
.doc-cuerpo{padding:1.25rem var(--pad) 2rem}
.doc-leer{width:100%;max-width:42rem;margin:0 auto;line-height:1.65;font-size:1rem;color:var(--ink);overflow-wrap:anywhere}
.doc-leer h1,.doc-leer h2,.doc-leer h3,.doc-leer h4{font-family:inherit;font-weight:650;line-height:1.25;margin:1.6em 0 .4em}.doc-leer h1{font-size:1.65rem;margin-top:.4em}.doc-leer h2{font-size:1.3rem}.doc-leer h3{font-size:1.1rem}.doc-leer h4{font-size:1rem;color:var(--dim)}
.doc-leer p{margin:.5em 0}.doc-leer hr{border:0;border-top:1px solid var(--line);margin:1.5em 0}
.doc-leer ol,.doc-leer ul{margin:.5em 0;padding-left:1.5rem}.doc-leer li{margin:.3em 0;padding-left:.25rem}.doc-leer li.n1{margin-left:1.25rem}.doc-leer li.n2{margin-left:2.5rem}.doc-leer li.n3{margin-left:3.75rem}
.doc-leer blockquote{margin:.75em 0;padding:.125rem 0 .125rem 1rem;border-left:3px solid var(--line-2,var(--line));color:var(--dim)}
.doc-leer code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.9em;padding:.05em .35em;border-radius:4px;background:var(--hover)}
.doc-leer a{color:var(--accent);text-decoration:underline}
.doc-leer .doc-tabla{overflow-x:auto;margin:.75em 0}.doc-leer table{border-collapse:collapse;min-width:100%;font-size:.9375rem}.doc-leer th,.doc-leer td{text-align:left;vertical-align:top;padding:.5rem .625rem;border-bottom:1px solid var(--line)}.doc-leer th{color:var(--dim);font-weight:600;white-space:nowrap}
.doc-leer .doc-nota{color:var(--dim);font-size:.875rem;margin-top:1.5em}
html[data-ancho=cel] .modal.pdoc{height:92dvh;max-width:none}
html[data-ancho=cel] #main .pdoc-b .btn.mini,html[data-ancho=cel] .modal.pdoc .btn,html[data-ancho=cel] .pdoc-hist summary{height:auto;min-height:max(2.75rem,44px)}
html[data-ancho=cel] .pdoc-hist summary{display:flex;align-items:center}
html[data-ancho=cel] .doc-pie .lnk{display:inline-flex;align-items:center;min-height:max(2.75rem,44px)}
html[data-ancho=cel] .doc-cuerpo{padding:1rem var(--pad) 2rem}
/* «‹ Volver» del celular (pedido de David 22/10): siempre arriba a la izquierda en toda pantalla menos el Resumen; en las ventanas, el botón de cerrar dice «Cerrar» */
.volver{display:none}
html[data-ancho=cel] .volver{display:inline-flex;align-items:center;gap:.25rem;flex:none;min-height:max(2.75rem,44px);min-width:max(2.75rem,44px);padding:0 .625rem;border:1px solid var(--line-2,var(--line));border-radius:var(--r-ctrl);background:var(--surface);color:var(--ink);font:inherit;font-size:var(--fs);font-weight:650;cursor:pointer}
html[data-ancho=cel] .volver span{font-size:1.25em;line-height:1}
html[data-ancho=cel] .top .volver{height:auto}
html[data-ancho=cel] .top .volver~.mig{visibility:hidden}
/* con el botón Volver el título de la barra no entra (lo repite el encabezado de la página): queda como espacio para que los botones sigan a la derecha */
html[data-ancho=cel] .modal .cab-m .ico[aria-label^=Cerrar]{width:auto;min-width:max(2.75rem,44px);padding:0 .5rem;gap:.25rem;display:inline-flex;align-items:center}
html[data-ancho=cel] .modal .cab-m .ico[aria-label^=Cerrar]::after{content:'Cerrar';font-size:var(--fs);font-weight:650}
/* desplegables legibles: la lista nativa toma el tema (oscuro/claro) y cada opción lleva fondo y letra del tema */
select{color-scheme:inherit}
select option,select optgroup{background-color:var(--surface);color:var(--ink)}
select optgroup{color:var(--mute);font-weight:600}
select option:disabled{color:var(--mute)}
.pz-subir{cursor:pointer}.pz-subir:focus-within{outline:2px solid var(--accent);outline-offset:2px}

/* Importar desde Drive (22/10) */
.imp-drive{width:min(46rem,calc(100vw - 1.5rem))}.imp-grupo{margin:.4rem 0 .6rem}.imp-h{font-size:.85rem;margin:.3rem 0}.imp-fila{display:flex;gap:.5rem;align-items:center;padding:.3rem 0;border-top:1px solid var(--line,rgba(127,127,127,.2))}.imp-nom{flex:1;min-width:0;display:flex;flex-direction:column}.imp-nom b{overflow-wrap:anywhere;font-weight:600}.imp-fila select{flex:0 0 11rem;max-width:45%}.imp-rev .imp-nom b{color:var(--warn,#b45309)}
html[data-ancho=cel] .imp-drive{width:calc(100vw - 1.5rem)}html[data-ancho=cel] .imp-fila select{flex-basis:9rem}
/* Noticias (22/10): tarjetas en grilla (1 col celular, 2-3 en compu) */
.nt-form{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem;max-width:44rem}
.nt-form textarea.inp{height:auto;min-height:3.5rem;padding:.5rem .625rem;resize:vertical}
.nt-arch{display:flex;flex-direction:column;gap:.25rem;min-width:0}.nt-arch input{max-width:100%;min-height:2.75rem}
.nt-quitar{display:flex;align-items:center;gap:.375rem;min-height:2.75rem}
.nt-acc{display:flex;gap:.5rem;justify-content:flex-end}
.nt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr));gap:.75rem}
.nt-card{display:flex;flex-direction:column;overflow:hidden;min-width:0;padding:0}
.nt-media{aspect-ratio:16/9;background:var(--raised);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:center;overflow:hidden}
.nt-media.sin{aspect-ratio:auto;height:4.5rem}
.nt-media img,.nt-media video{width:100%;height:100%;object-fit:cover;display:block}
.nt-ico{color:var(--mute)}.nt-ico svg{width:1.75rem;height:1.75rem}
.nt-cuerpo{padding:.75rem .875rem .25rem;display:flex;flex-direction:column;gap:.25rem;min-width:0}
.nt-cuerpo h2{font-size:1rem;line-height:1.3;overflow-wrap:anywhere}
.nt-x{color:var(--ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-line;overflow-wrap:anywhere}
.nt-nuevo{color:var(--accent)}
.nt-pie{display:flex;flex-wrap:wrap;align-items:center;gap:.375rem;padding:.5rem .875rem .75rem;margin-top:auto}
.nt-pie .grow{flex:1}
.nt-tira{display:flex;align-items:center;gap:.5rem;min-height:2.75rem;padding:0 .875rem;margin-bottom:.75rem;border:1px solid var(--line);border-radius:var(--r-ctrl);background:var(--surface);color:var(--ink);text-decoration:none}
.nt-tira svg{width:1.125rem;height:1.125rem;color:var(--mute)}.nt-tira .grow{flex:1}
.nt-tira.hay{border-color:var(--accent-line);background:var(--accent-soft)}.nt-tira.hay svg{color:var(--accent)}
@media (min-width:861px){.nt-tira:not(.hay){display:none}}

.sync-fila .sync-chk{display:flex;gap:.5rem;align-items:flex-start;flex:1 1 16rem;min-width:0}.sync-fila .sync-chk input{margin-top:.2rem}.sync-fila .inp{flex:0 1 15rem}

/* Aprobación de cuentas nuevas (23/10): pantalla de espera, panel «Esperan tu aprobación» e interruptor del link de clientes */
.ent .card.esp{gap:.75rem}.ent .card.esp .pill{align-self:flex-start}.ent .card.esp .sub{margin:.125rem 0 0}.ent .card.esp p{margin:0}
.esp-pasos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.esp-p{display:flex;align-items:center;gap:.625rem;font-size:var(--fs)}
.esp-n{width:1.5rem;height:1.5rem;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:none;font-size:var(--fs-chico);font-weight:700;border:1.5px solid var(--line-2);color:var(--mute)}
.esp-n svg{width:.875rem;height:.875rem}
.esp-hecho .esp-n{background:var(--ok);border-color:var(--ok);color:var(--bg)}
.esp-ahora .esp-n{border-color:var(--warn);color:var(--warn)}.esp-ahora .esp-t{font-weight:650}
.esp-falta{color:var(--mute)}
.ent .card.esp .btn{min-height:max(2.75rem,44px)}
.pend-ap{border-color:var(--warn)}
.pend-ap .btn.peligro,.obj-a .btn.peligro{color:var(--bad);border-color:var(--bad)}
.sw-ap{display:inline-flex;align-items:center;gap:.5rem;flex:1 1 100%;min-height:2rem;padding:0;background:none;border:0;color:var(--ink);font:inherit;font-size:var(--fs);cursor:pointer;text-align:left}
.sw-ap .sw-k{position:relative;flex:none;width:2.25rem;height:1.25rem;border-radius:99px;background:var(--line-2);transition:background .15s}
.sw-ap .sw-k::after{content:"";position:absolute;top:.125rem;left:.125rem;width:1rem;height:1rem;border-radius:50%;background:#fff;transition:transform .15s}
.sw-ap[aria-checked="true"] .sw-k{background:var(--ok)}.sw-ap[aria-checked="true"] .sw-k::after{transform:translateX(1rem)}
.sw-ap:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (pointer:coarse){.sw-ap{min-height:max(2.75rem,44px)}.obj-a .btn.mini{min-height:max(2.75rem,44px)}}
@media (prefers-reduced-motion:reduce){.sw-ap .sw-k,.sw-ap .sw-k::after{transition:none}}

/* Traer CRM de Drive (26/10): ventana central flotante, barra de avance y filas compactas; controles de 44 px */
.crm-btn{min-height:44px}.btn.mini.crm-btn,#main .btn.mini.crm-btn{height:auto;min-height:44px;font-size:var(--fs-chico)}
.crm-drive{width:min(44rem,calc(100vw - 1.5rem));max-height:calc(100dvh - 1.5rem)}html[data-ancho=cel] .crm-drive{width:calc(100vw - 1.5rem)}
.crm-barra{height:.75rem;border-radius:999px;background:var(--line,rgba(127,127,127,.25));overflow:hidden;margin:.5rem 0}.crm-barra i{display:block;height:100%;background:var(--accent,#2563eb);transition:width .25s}
.crm-fila{display:flex;flex-direction:column;gap:.125rem;padding:.4rem 0;border-top:1px solid var(--line,rgba(127,127,127,.2))}.crm-fila b{overflow-wrap:anywhere}.crm-rev b{color:var(--warn,#b45309)}
.drv-ficha .cab .add{display:flex;gap:.5rem;flex-wrap:wrap}
/* n28-e · estado «Sin datos» (gris, nunca verde) y mensaje general del Resumen */
.p-sd{background:var(--raised);color:var(--mute);border:1px solid var(--line)}.graf .d-sd{stroke:var(--mute)}
.res-gral{display:flex;align-items:center;justify-content:space-between;gap:.5rem .75rem;flex-wrap:wrap;margin:.5rem .75rem;padding:.5rem .75rem;border-radius:var(--r-card,10px);font-weight:600;font-size:var(--fs-base,.9375rem);line-height:1.35}
.res-gral-ok{background:var(--ok-bg);color:var(--ok)}.res-gral-warn{background:var(--warn-bg);color:var(--warn)}.res-gral-bad{background:var(--bad-bg);color:var(--bad)}.res-gral-sd{background:var(--raised);color:var(--mute);border:1px solid var(--line)}
#main .res-gral .btn{flex:none}@media (pointer:coarse){#main .res-gral .btn{min-height:max(2.75rem,44px)}}html[data-ancho=cel] #main .res-gral .btn{min-height:max(2.75rem,44px)}
