/* Launch Distribution · sistema visual (v4, estilo «Inbox»)
   Concepto: la consola a oscuras. Negro profundo, paneles carbón muy redondeados,
   un menú lateral con nombres e iconos en cuadritos; lo destacado se enciende con
   un degradado naranja-violeta, la acción principal es violeta y la pestaña elegida
   es una píldora blanca. Oscuro por defecto; el claro se elige con el botón. */
:root{
  --fondo:#050505; --fondo-2:#050505; --marco:#0E0E0F;
  --panel:#171718; --panel-s:#1B1B1D; --panel-2:#242426; --panel-3:#323235;
  --linea:rgba(255,255,255,.05); --linea-2:rgba(255,255,255,.14);
  --tinta:#F4F4F5; --tinta-2:#B4B4BA; --tinta-3:#808087;
  --inv:#171718; --inv-2:#242426; --inv-3:#323235; --inv-linea:rgba(255,255,255,.06);
  --inv-tinta:#F3F3F4; --inv-tinta-2:#B6B6BC; --inv-tinta-3:#86868D;
  --accion:#F4F4F5; --accion-tinta:#0B0B0C; --accion-s:rgba(255,255,255,.12);
  --azul:#7B3FF2; --azul-2:#6A2FE0; --azul-tinta:#FFFFFF; --amarillo:#F4E54C; --vivo:#C6F04A;
  --grad:radial-gradient(90% 90% at 35% 95%, rgba(28,12,70,.9) 0%, rgba(28,12,70,0) 60%), radial-gradient(80% 90% at 0% 45%, #F68B36 0%, rgba(246,139,54,0) 60%), radial-gradient(90% 90% at 100% 80%, #7B3FF2 0%, rgba(123,63,242,0) 70%), linear-gradient(135deg, #E07B5C 0%, #B062A8 50%, #6E3BEA 100%);
  --grad-s:linear-gradient(135deg, #F28A3C 0%, #B85FA8 50%, #7B3FF2 100%);
  --ok:#86DC94; --ok-s:rgba(134,220,148,.14); --aviso:#F2C55A; --aviso-s:rgba(242,197,90,.14);
  --mal:#FF8670; --mal-s:rgba(255,134,112,.14); --info:#9AA6FF; --info-s:rgba(154,166,255,.15);
  --lila:#B9A6FF; --lila-s:rgba(185,166,255,.15);
  --sombra:0 24px 60px rgba(0,0,0,.45); --velo:rgba(10,10,12,.6);
  --f-t:'Urbanist',system-ui,sans-serif; --f-b:'Manrope',system-ui,sans-serif; --f-c:'JetBrains Mono',ui-monospace,Menlo,monospace;
  --r-s:12px; --r:18px; --r-l:24px; --r-xl:30px;
  color-scheme:dark;
}
:root[data-theme="light"]{
  --fondo:#E4E4E8; --fondo-2:#E4E4E8; --marco:#F4F4F6;
  --panel:#FFFFFF; --panel-s:#FAFAFB; --panel-2:#F0F0F3; --panel-3:#E3E3E8;
  --linea:rgba(20,20,30,.07); --linea-2:rgba(20,20,30,.14);
  --tinta:#18181B; --tinta-2:#55555D; --tinta-3:#8B8B93;
  --inv:#FFFFFF; --inv-2:#F0F0F3; --inv-3:#E3E3E8; --inv-linea:rgba(20,20,30,.07);
  --inv-tinta:#18181B; --inv-tinta-2:#55555D; --inv-tinta-3:#8B8B93;
  --ok:#2C8A4B; --ok-s:rgba(44,138,75,.12); --aviso:#9A6200; --aviso-s:rgba(214,150,20,.16);
  --mal:#CC3F27; --mal-s:rgba(204,63,39,.11); --info:#3F4CD6; --info-s:rgba(63,76,214,.1);
  --lila:#6A4FDB; --lila-s:rgba(106,79,219,.1);
  --accion:#121214; --accion-tinta:#FFFFFF; --accion-s:rgba(0,0,0,.08);
  --sombra:0 24px 60px rgba(30,30,40,.14); color-scheme:light; }

*{ box-sizing:border-box; }
html,body{ margin:0; height:100%; }
#app{ height:100%; }
body{ background:var(--fondo); color:var(--tinta); font:500 14px/1.5 var(--f-b); -webkit-font-smoothing:antialiased; }
button,input,select,textarea{ font:inherit; color:inherit; }
a{ color:inherit; text-decoration:none; }
:focus-visible{ outline:2px solid var(--accion); outline-offset:2px; }
[hidden]{ display:none !important; }
.num{ font-variant-numeric:tabular-nums; }
.cod{ font-family:var(--f-c); font-size:12.5px; letter-spacing:.02em; }
svg.i{ width:18px; height:18px; flex:none; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
svg.i.s{ width:15px; height:15px; }
h1,h2,h3{ font-family:var(--f-t); text-wrap:balance; margin:0; }
.arrancando{ min-height:100vh; display:grid; place-items:center; color:var(--tinta-3); }
@media (prefers-reduced-motion: reduce){ *{ transition:none !important; animation:none !important; } }

/* ── Estructura: menú lateral con nombres ── */
.app{ display:grid; grid-template-columns:228px minmax(0,1fr); gap:14px; height:calc(100% - 28px); margin:14px max(14px, env(safe-area-inset-right,0px)) 14px max(14px, env(safe-area-inset-left,0px)); background:var(--marco); border-radius:34px; padding:14px 0 14px 14px; border:1px solid var(--linea); }
.riel{ display:flex; flex-direction:column; gap:12px; min-height:0; }
.riel-cab{ display:flex; align-items:center; gap:10px; background:var(--panel); border-radius:24px; padding:12px; }
.logo-riel{ width:50px; height:50px; border-radius:16px; background:var(--grad); display:grid; place-items:center; flex:none; box-shadow:0 8px 24px rgba(123,63,242,.3); }
.logo-riel img, .logo-l img, .entrada-ico img{ width:58%; height:auto; display:block; }
.marca-txt{ flex:1; font:700 13.5px/1.15 var(--f-t); }
.yo{ display:flex; align-items:center; gap:8px; padding:10px 4px 2px; margin-top:6px; border-top:1px solid var(--linea); }
.yo .avatar{ width:40px; height:40px; border-radius:14px; font-size:12.5px; }
.yo .avatar::after{ width:10px; height:10px; border-width:2px; }
.yo .txt{ flex:1; min-width:0; display:flex; flex-direction:column; line-height:1.2; }
.yo .txt b{ font:700 13px var(--f-t); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.yo .txt small{ color:var(--tinta-3); font-size:11.5px; }
.yo .ib{ width:34px; height:34px; border-radius:11px; background:var(--panel-2); border:0; }
.riel-cab .esp{ flex:1; }
.redactar{ width:50px; height:50px; border-radius:16px; background:var(--azul); color:#fff; display:grid; place-items:center; flex:none; box-shadow:0 8px 24px rgba(123,63,242,.35); }
.redactar:hover{ background:var(--azul-2); }
.avatar{ position:relative; width:46px; height:46px; border-radius:16px; background:var(--grad-s); color:#fff; display:grid; place-items:center; font:800 14px var(--f-t); flex:none; }
.yo .avatar::after, .avatar::after{ content:''; position:absolute; right:-2px; bottom:-2px; width:12px; height:12px; border-radius:50%; background:var(--vivo); border:2.5px solid var(--panel); }
.menu{ flex:1; background:var(--panel); border-radius:24px; padding:12px 10px; display:flex; flex-direction:column; gap:4px; overflow-y:auto; min-height:0; }
.menu .grupo{ font:700 11px var(--f-b); letter-spacing:.08em; text-transform:uppercase; color:var(--tinta-3); padding:14px 10px 6px; }
.menu a, .menu button{ display:flex; align-items:center; gap:12px; padding:5px; border-radius:18px; color:var(--tinta); background:none; border:0; font:600 14.5px var(--f-t); cursor:pointer; text-align:left; width:100%; }
.menu .ico{ width:44px; height:44px; border-radius:15px; background:var(--panel-2); display:grid; place-items:center; color:var(--tinta-2); flex:none; transition:background .15s; }
.menu a:hover .ico, .menu button:hover .ico{ color:var(--tinta); background:var(--panel-3); }
.menu a.on .ico{ background:var(--grad); color:#fff; box-shadow:0 6px 18px rgba(123,63,242,.3); }
.menu .txt{ flex:1; min-width:0; }
.menu em{ font-style:normal; font:700 11.5px var(--f-b); min-width:24px; height:24px; padding:0 6px; border-radius:999px; display:grid; place-items:center; border:1px solid var(--linea-2); color:var(--tinta-2); }
.menu em:empty{ display:none; }
.menu em.mal{ border-color:transparent; background:var(--mal-s); color:var(--mal); }
.menu .esp{ flex:1; min-height:8px; }
.btn-azul{ display:inline-flex; align-items:center; gap:8px; background:var(--azul); color:var(--azul-tinta); border:0; border-radius:16px; padding:12px 20px; font:700 13.5px var(--f-b); cursor:pointer; white-space:nowrap; }
.btn-azul:hover{ background:var(--azul-2); }
.ib{ width:42px; height:42px; border-radius:14px; display:grid; place-items:center; background:var(--panel); border:1px solid var(--linea); color:var(--tinta-2); cursor:pointer; flex:none; }
.ib:hover{ color:var(--tinta); border-color:var(--linea-2); }
.ib.lima{ background:var(--accion); color:var(--accion-tinta); border-color:transparent; }
.principal{ min-width:0; display:flex; flex-direction:column; height:100%; overflow:hidden; }
.top{ display:flex; align-items:center; gap:14px; padding:10px 22px 16px 6px; flex-wrap:wrap; }
.saludo h1{ font:400 34px/1.05 var(--f-t); letter-spacing:-.8px; margin:0; }
.saludo p{ margin:3px 0 0; color:var(--tinta-3); font-size:13.5px; }
.top .der{ margin-left:auto; display:flex; align-items:center; gap:10px; }
.buscar{ display:flex; align-items:center; gap:8px; background:var(--panel-2); border:1px solid transparent; border-radius:16px; padding:12px 16px; width:min(320px, 50vw); color:var(--tinta-3); }
.buscar input{ border:0; background:transparent; outline:none; width:100%; color:var(--tinta); font-weight:600; }
.btn-azul{ display:inline-flex; align-items:center; gap:8px; background:var(--azul); color:var(--azul-tinta); border:0; border-radius:999px; padding:11px 20px; font:800 13.5px var(--f-b); cursor:pointer; white-space:nowrap; }
.btn-azul:hover{ background:var(--azul-2); }
.ib{ width:42px; height:42px; border-radius:50%; display:grid; place-items:center; background:var(--panel); border:1px solid var(--linea); color:var(--tinta-2); cursor:pointer; flex:none; }
.ib:hover{ color:var(--tinta); border-color:var(--linea-2); }
.ib.lima{ background:var(--accion); color:var(--accion-tinta); border-color:transparent; }
.vista{ flex:1; min-height:0; overflow-y:auto; padding-right:18px; }
.marco{ padding:0 4px 30px 4px; max-width:1500px; margin:0 auto; width:100%; }
.tabs-movil{ display:none; }

/* ── Cabecera de página ── */
.cab{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:4px 0 16px; }
.cab h1{ font:600 clamp(22px, 2.4vw, 30px)/1.1 var(--f-t); letter-spacing:-.4px; }
.cab p{ margin:6px 0 0; color:var(--tinta-2); max-width:62ch; }
.cab .acc{ margin-left:auto; display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.atras{ width:40px; height:40px; border-radius:50%; border:1px solid var(--linea-2); display:grid; place-items:center; color:var(--tinta); flex:none; }
.atras:hover{ background:var(--panel); }

/* ── Botones, cápsulas y etiquetas ── */
.btn{ display:inline-flex; align-items:center; gap:8px; background:var(--panel); border:1px solid var(--linea-2); border-radius:999px; padding:9px 16px; font:700 13.5px var(--f-b); cursor:pointer; color:var(--tinta); white-space:nowrap; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.btn:hover{ border-color:var(--tinta-3); }
.btn.pri{ background:var(--accion); color:var(--accion-tinta); border-color:transparent; }
.btn.pri:hover{ filter:brightness(1.04); }
.btn.pri:disabled{ opacity:.45; cursor:not-allowed; filter:none; }
.btn.osc{ background:var(--azul); color:#fff; border-color:transparent; }
.btn.fan{ background:transparent; border-color:transparent; color:var(--tinta-2); backdrop-filter:none; }
.btn.fan:hover{ color:var(--tinta); }
.btn.peligro{ color:var(--mal); }
.pill{ display:inline-flex; align-items:center; gap:6px; border-radius:999px; padding:4px 11px; font:700 12px var(--f-b); white-space:nowrap; background:var(--panel-3); color:var(--tinta-2); border:1px solid transparent; }
.pill.ok{ background:var(--ok-s); color:var(--ok); } .pill.aviso{ background:var(--aviso-s); color:var(--aviso); }
.pill.mal{ background:var(--mal-s); color:var(--mal); } .pill.info{ background:var(--info-s); color:var(--info); }
.pill.lila{ background:var(--lila-s); color:var(--lila); }
.pill.lima{ background:var(--amarillo); color:#151100; }
.etq-am{ display:inline-block; background:var(--amarillo); color:#151100; font:700 11.5px var(--f-b); padding:3px 9px; border-radius:8px; }
.chips{ display:flex; gap:6px; flex-wrap:wrap; }
.chip{ white-space:nowrap; border:1px solid var(--linea-2); background:var(--panel); border-radius:999px; padding:8px 14px; font:700 13px var(--f-b); color:var(--tinta-2); cursor:pointer; display:inline-flex; align-items:center; gap:8px; }
.chip:hover{ color:var(--tinta); }
.chip.on{ background:var(--accion); color:var(--accion-tinta); border-color:transparent; }
.chip em{ font-style:normal; border:1px solid var(--linea-2); font-size:11px; min-width:20px; height:20px; display:inline-grid; place-items:center; border-radius:999px; background:var(--panel-3); padding:0 6px; color:var(--tinta-2); }
.chip.on em{ background:var(--accion-tinta); color:var(--accion); }
.vacio{ padding:40px 20px; text-align:center; color:var(--tinta-3); border:1.5px dashed var(--linea-2); border-radius:var(--r-l); }
.flecha{ width:38px; height:38px; border-radius:50%; border:1px solid var(--linea-2); display:grid; place-items:center; color:var(--tinta-2); flex:none; }
.flecha:hover{ color:var(--tinta); }

/* ── Tarjetas ── */
.card{ background:var(--panel); border:1px solid var(--linea); border-radius:var(--r-l); padding:20px 22px; min-width:0; }
.card h2{ font:600 15px var(--f-b); color:var(--tinta-2); margin:0; }
.inv{ background:var(--inv); color:var(--inv-tinta); border-radius:var(--r-l); padding:20px; position:relative; border:1px solid var(--linea); }
.inv .pill{ background:var(--inv-2); color:var(--inv-tinta-2); }
.inv .pill.ok{ background:var(--ok-s); color:var(--ok); } .inv .pill.mal{ background:var(--mal-s); color:var(--mal); } .inv .pill.aviso{ background:var(--aviso-s); color:var(--aviso); } .inv .pill.info{ background:var(--info-s); color:var(--info); } .inv .pill.lila{ background:var(--lila-s); color:var(--lila); }
.inv .btn{ background:var(--inv-2); color:var(--inv-tinta); border-color:var(--inv-linea); }
.inv .btn.pri{ background:var(--accion); color:var(--accion-tinta); }
.inv .btn.fan{ background:transparent; color:var(--inv-tinta-2); }
.inv .vacio{ border-color:var(--inv-3); color:var(--inv-tinta-3); }

/* Grande, fina: los números */
.cifra{ font:400 clamp(30px, 3.4vw, 42px)/1 var(--f-t); letter-spacing:-1px; display:flex; align-items:baseline; gap:6px; }
.cifra small{ font:500 15px var(--f-t); color:var(--tinta-3); letter-spacing:0; }
.etq{ font:600 13px var(--f-b); color:var(--tinta-2); }

/* ── Catálogo: tarjetas de resumen ── */
.resumen-g{ display:grid; grid-template-columns:minmax(0,1.75fr) minmax(0,1fr); gap:16px; margin-bottom:20px; }
.metricas{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.metricas > div{ display:flex; flex-direction:column; gap:10px; }
.metricas .mal .cifra{ color:var(--mal); }
.meses{ display:grid; gap:14px; margin-top:24px; }
.mes{ display:flex; flex-direction:column; gap:8px; min-width:0; }
.mes .nom{ font:600 12.5px var(--f-b); color:var(--tinta-2); }
.rayita{ height:10px; border-radius:99px; background:var(--panel-3); overflow:hidden; }
.rayita i{ display:block; height:100%; border-radius:99px; background:repeating-linear-gradient(-45deg, var(--accion) 0 6px, color-mix(in oklab, var(--accion) 70%, #6c8a10) 6px 9px); }
.mini-portadas{ display:flex; }
.mini-portadas .portada{ width:30px; border-radius:50%; box-shadow:0 0 0 2px var(--panel-s); margin-left:-8px; }
.mini-portadas .portada:first-child{ margin-left:0; }
.proxima{ display:flex; flex-direction:column; gap:16px; }
.proxima .arriba{ display:flex; align-items:flex-start; gap:10px; }
.proxima .arriba > div{ flex:1; min-width:0; }
.proxima h3{ font:600 18px var(--f-t); margin-top:6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tarjetitas{ display:flex; gap:6px; align-items:flex-end; margin-top:auto; }
.tarjetita{ flex:1; min-width:0; background:var(--panel-3); border-radius:16px 16px 6px 6px; padding:10px 10px 12px; height:84px; display:flex; flex-direction:column; justify-content:space-between; font-size:12px; color:var(--tinta-2); }
.tarjetita b{ font:700 13px var(--f-b); color:var(--tinta); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tarjetita.lima{ background:var(--accion); color:var(--accion-tinta); height:104px; }
.tarjetita.lima b{ color:var(--accion-tinta); }
.tarjetita.mas{ background:var(--grad); color:#fff; align-items:center; justify-content:center; text-align:center; font:700 12.5px var(--f-b); flex:1.15; height:44px; border-radius:999px; cursor:pointer; }

/* Inicio estilo «Hola»: chispas, calendario, anillo y tarjetas de actividad */
.inicio{ display:grid; grid-template-columns:minmax(0,2fr) minmax(300px,1fr); grid-template-rows:auto auto; gap:14px; margin-bottom:20px; }
.chispas{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.chispa{ display:flex; flex-direction:column; gap:10px; min-width:0; }
.chispa svg.g{ width:100%; height:78px; overflow:visible; }
.chispa .gl{ fill:none; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.chispa .burbuja{ font:800 10.5px var(--f-b); }
.chispa .cifra{ font:700 34px/1 var(--f-t); letter-spacing:-.6px; }
.chispa .pie-ch{ display:grid; grid-template-columns:auto auto; justify-content:space-between; gap:2px 12px; font-size:12px; color:var(--tinta-3); }
.chispa .pie-ch b{ color:var(--tinta-2); font-weight:700; text-align:right; }
.cal{ background:var(--grad); color:#fff; border-radius:var(--r-l); padding:20px; display:flex; flex-direction:column; gap:14px; grid-row:span 2; }
.cal-cab{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.cal-cab h2{ font:700 17px var(--f-t); margin:0; }
.cal-cab span{ font:700 13px var(--f-b); opacity:.85; }
.cal-dias{ display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:8px 6px; text-align:center; justify-items:center; }
.cal-dias .dn{ font:800 11px var(--f-b); opacity:.75; padding-bottom:4px; }
.cal-dias .d{ width:100%; max-width:40px; aspect-ratio:1; border-radius:50%; display:grid; place-items:center; font:700 13px var(--f-b); border:1.5px dashed rgba(255,255,255,.35); position:relative; color:#fff; }
.cal-dias .d.hueco{ border:0; aspect-ratio:auto; height:0; }
.cal-dias .d.pasado{ border:0; background:rgba(255,255,255,.12); color:rgba(255,255,255,.7); }
.cal-dias .d.sale{ background:rgba(10,8,25,.75); border:0; cursor:pointer; }
.cal-dias .d.sale::after{ content:''; position:absolute; bottom:5px; width:4px; height:4px; border-radius:50%; background:var(--amarillo); }
.cal-dias .d.hoy{ background:#fff; color:#0B0B0C; border:0; }
.cal-ley{ display:flex; gap:12px; flex-wrap:wrap; font-size:12px; opacity:.9; margin-top:auto; }
.cal-ley i{ display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:6px; vertical-align:-1px; }
.fila-mini{ display:grid; grid-template-columns:minmax(250px,.85fr) minmax(0,1.7fr); gap:14px; }
.apilado{ display:flex; flex-direction:column; gap:14px; }
.anillo-c{ display:flex; align-items:center; justify-content:space-between; gap:14px; }
.anillo-c h3{ font:700 15px var(--f-t); margin:0 0 4px; }
.anillo-c p{ margin:0; font-size:12.5px; color:var(--tinta-3); }
.anillo-c .lnk{ display:inline-block; margin-top:10px; font:700 12.5px var(--f-b); color:var(--tinta-2); }
.anillo{ width:76px; height:76px; flex:none; position:relative; display:grid; place-items:center; }
.anillo svg{ position:absolute; inset:0; transform:rotate(-90deg); }
.anillo b{ font:700 17px var(--f-t); }
.barra-plan h3{ font:700 15px var(--f-t); margin:0; display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.barra-plan h3 small{ font:700 12px var(--f-b); color:var(--tinta-3); }
.barra-plan .bp{ height:12px; border-radius:99px; background:var(--panel-3); overflow:hidden; margin:14px 0 8px; }
.barra-plan .bp i{ display:block; height:100%; background:var(--grad-s); border-radius:99px; }
.barra-plan .ext{ display:flex; justify-content:space-between; font-size:12px; color:var(--tinta-3); font-weight:700; }
.actividades .cab-a{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.actividades .cab-a h3{ font:700 16px var(--f-t); margin:0; flex-basis:100%; }
.actividades .cab-a .chip{ padding:6px 13px; font-size:12.5px; }
.act-g{ display:grid; grid-template-columns:repeat(auto-fill,minmax(128px,1fr)); gap:10px; }
.act{ border-radius:20px; padding:12px 14px 14px; background:var(--panel-2); display:flex; flex-direction:column; gap:20px; min-width:0; position:relative; min-height:120px; }
.act .ap{ display:flex; }
.act .ap .portada{ width:30px; border-radius:50%; margin-left:-8px; box-shadow:0 0 0 2px var(--panel-2); }
.act .ap .portada:first-child{ margin-left:0; }
.act .ap .ini{ width:30px; height:30px; border-radius:50%; margin-left:-8px; display:grid; place-items:center; font:800 10.5px var(--f-b); background:var(--accion); color:var(--accion-tinta); box-shadow:0 0 0 2px var(--panel-2); }
.act.azul .ap .ini{ box-shadow:0 0 0 2px rgba(255,255,255,.35); }
.act .flecha{ position:absolute; top:10px; right:10px; width:28px; height:28px; border:0; }
.act b{ display:block; font:700 15px var(--f-t); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.act small{ font:800 12.5px var(--f-b); color:var(--tinta-2); }
.act.azul{ background:var(--grad); color:#fff; }
.act.azul small{ color:rgba(255,255,255,.85); }
.act.azul .ap .portada{ box-shadow:0 0 0 2px rgba(255,255,255,.35); }
.act.azul .flecha{ color:#fff; background:rgba(255,255,255,.18); }
.act.nueva{ background:transparent; border:1.5px dashed var(--linea-2); align-items:center; justify-content:center; text-align:center; gap:6px; color:var(--tinta-2); font:700 13px var(--f-b); }
.act.nueva:hover{ border-color:var(--accion); color:var(--tinta); }

/* Filtros */
.filtros{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:18px; }
.filtros .titulo{ font:700 15px var(--f-t); display:flex; align-items:center; gap:8px; margin-right:6px; }
.filtros .titulo em{ font-style:normal; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font-size:11.5px; background:var(--azul); color:#fff; }
.filtros select{ background:var(--panel); border:1px solid var(--linea); border-radius:999px; padding:9px 14px; font-weight:600; min-width:150px; }
.esp{ flex:1; }

/* ── Panel invertido con pestañas en la muesca ── */
.muesca-wrap{ position:relative; margin-top:22px; }
.muesca{ position:absolute; top:-22px; left:50%; transform:translateX(-50%); background:var(--marco); padding:6px 8px 8px; border-radius:0 0 24px 24px; display:flex; gap:6px; z-index:2; max-width:calc(100% - 32px); overflow-x:auto; }
.muesca .chip{ background:var(--panel-s); }
.muesca .chip.on{ background:var(--accion); }
.inv-cab{ display:flex; align-items:center; gap:10px; margin:6px 4px 16px; min-height:40px; }
.inv-cab h2{ font:500 18px var(--f-t); }
.inv-cab .der{ margin-left:auto; display:flex; gap:8px; }
.inv .ib{ background:transparent; border-color:var(--inv-3); color:var(--inv-tinta-2); backdrop-filter:none; }
.inv .ib:hover{ color:var(--inv-tinta); }
.inv .ib.on{ background:var(--accion); color:var(--accion-tinta); border-color:transparent; }

/* Lista + detalle */
.md{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.45fr); gap:16px; }
.md-lista{ display:flex; flex-direction:column; gap:8px; max-height:560px; overflow-y:auto; padding-right:4px; }
.fila{ display:flex; align-items:center; gap:12px; padding:9px 12px 9px 9px; border-radius:20px; background:var(--inv-2); cursor:pointer; border:0; text-align:left; width:100%; color:inherit; }
.fila:hover{ background:var(--inv-3); }
.fila.on{ background:var(--grad); color:#fff; }
.fila.on .pill{ background:rgba(255,255,255,.2); color:#fff; }
.detalle .pill{ background:var(--inv-3); }
.fila .portada{ width:46px; border-radius:50%; flex:none; box-shadow:none; }
.fila .t{ flex:1; min-width:0; }
.fila .t b{ display:block; font:700 14px var(--f-b); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fila .t small{ display:block; color:var(--inv-tinta-3); font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fila.on .t small{ color:inherit; opacity:.65; }
.fila .fecha{ font:500 15px var(--f-t); white-space:nowrap; }
.fila input[type=checkbox]{ accent-color:var(--accion); width:16px; height:16px; flex:none; }
.detalle{ background:var(--panel-s); border-radius:28px; padding:20px; display:flex; flex-direction:column; gap:16px; min-width:0; }
.det-cab{ display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:16px; align-items:center; }
.det-cab .portada{ width:84px; border-radius:20px; }
.det-cab .etq{ color:var(--inv-tinta-3); font-size:12px; }
.det-cab h3{ font:500 clamp(22px,2.4vw,30px)/1.1 var(--f-t); letter-spacing:-.6px; margin:2px 0 6px; overflow-wrap:anywhere; }
.det-cab .quien{ text-align:right; font-size:12.5px; color:var(--inv-tinta-2); }
.det-cab .quien b{ display:block; font:700 14px var(--f-b); color:var(--inv-tinta); }
.cuadros{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.cuadro{ background:var(--panel-2); border-radius:20px; padding:14px; display:flex; flex-direction:column; gap:22px; min-width:0; position:relative; }
.cuadro .v{ font:400 24px/1 var(--f-t); letter-spacing:-.4px; }
.cuadro .v small{ font-size:13px; color:var(--inv-tinta-3); }
.cuadro span{ font-size:12px; color:var(--inv-tinta-2); }
.cuadro .flecha{ position:absolute; right:10px; top:10px; width:28px; height:28px; border-color:var(--inv-linea); color:var(--inv-tinta-2); }
.cuadro.lima{ background:var(--accion); color:var(--accion-tinta); }
.cuadro.lima span, .cuadro.lima .v small{ color:var(--accion-tinta); opacity:.75; }
.cuadro.rayado{ background:repeating-linear-gradient(-45deg, var(--inv-3) 0 8px, transparent 8px 14px); border:1.5px dashed var(--inv-3); align-items:center; justify-content:center; color:var(--inv-tinta-2); cursor:pointer; }
.det-pie{ background:var(--panel-2); border-radius:22px; padding:12px 12px 12px 18px; display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.det-pie div small{ display:block; font-size:11.5px; color:var(--inv-tinta-3); }
.det-pie div b{ font:500 18px var(--f-t); }
.det-pie .acc{ margin-left:auto; display:flex; gap:8px; align-items:center; }
.tiendas-mini{ display:flex; flex-wrap:wrap; gap:6px; }
.tiendas-mini span{ display:inline-flex; align-items:center; gap:6px; border-radius:999px; padding:3px 10px 3px 3px; background:var(--inv-3); font-size:12px; font-weight:700; }
.tiendas-mini .punto{ width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font:800 8.5px var(--f-t); color:#fff; }
.tiendas-mini span.mal{ background:var(--mal-s); color:var(--mal); }

/* Rejilla de portadas */
.rejilla{ display:grid; grid-template-columns:repeat(auto-fill, minmax(168px,1fr)); gap:18px 14px; }
.disco-c{ display:flex; flex-direction:column; gap:10px; padding:8px; margin:-8px; border-radius:24px; cursor:pointer; min-width:0; }
.disco-c:hover{ background:var(--inv-2); }
.portada{ position:relative; aspect-ratio:1; border-radius:18px; overflow:hidden; max-width:100%; }
.portada svg, .portada img{ width:100%; height:100%; display:block; object-fit:cover; }
.portada img.real{ position:absolute; inset:0; z-index:1; }
.portada .pill{ position:absolute; left:8px; bottom:8px; background:var(--velo); color:#fff; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.disco-c h3{ font:700 14.5px/1.25 var(--f-b); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.disco-c p{ margin:2px 0 0; color:var(--inv-tinta-3); font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Selección por lote */
.lote{ position:sticky; bottom:calc(14px + env(safe-area-inset-bottom,0px)); margin-top:16px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; background:var(--accion); color:var(--accion-tinta); border-radius:999px; padding:8px 8px 8px 20px; box-shadow:var(--sombra); z-index:5; }
.lote b{ margin-right:auto; font-weight:800; }
.lote .btn{ background:var(--accion-tinta); color:var(--accion); border-color:transparent; }
.lote .btn.fan{ background:transparent; color:var(--accion-tinta); }

/* ── Ficha ── */
.ficha-top{ display:grid; grid-template-columns:auto minmax(0,1fr) minmax(0,1fr); gap:16px; margin-bottom:16px; align-items:stretch; }
.ficha-top > .portada{ align-self:start; width:250px; border-radius:var(--r-xl); box-shadow:var(--sombra); }
.ficha-datos{ display:flex; flex-direction:column; gap:12px; justify-content:space-between; }
.ficha-datos .tipo{ font:700 12px var(--f-b); letter-spacing:.08em; text-transform:uppercase; color:var(--tinta-3); }
.ficha-datos .linea{ display:flex; gap:6px 12px; flex-wrap:wrap; align-items:center; color:var(--tinta-2); font-size:13.5px; }
.ficha-datos .linea b{ color:var(--tinta); }
.cuentas{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.cuenta{ border-radius:var(--r-l); padding:18px; display:flex; flex-direction:column; justify-content:space-between; gap:18px; background:var(--panel); border:1px solid var(--linea); position:relative; min-height:128px; backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.cuenta .flecha{ position:absolute; right:14px; top:14px; width:32px; height:32px; }
.cuenta b{ font:400 40px/1 var(--f-t); letter-spacing:-1px; }
.cuenta span{ font:700 13px var(--f-b); color:var(--tinta-2); }
.cuenta.lima{ background:var(--accion); color:var(--accion-tinta); border-color:transparent; }
.cuenta.lima span{ color:var(--accion-tinta); }
.cuenta.osc{ background:var(--grad); color:#fff; border-color:transparent; }
.cuenta.osc span{ color:rgba(255,255,255,.8); }
.cuenta.mal b{ color:var(--mal); }
.aviso-caja{ display:flex; gap:12px; align-items:center; border-radius:var(--r-l); padding:14px 16px; background:var(--mal-s); margin-bottom:12px; flex-wrap:wrap; }
.aviso-caja > svg{ color:var(--mal); }
.aviso-caja > div{ flex:1; min-width:200px; }
.aviso-caja b{ display:block; } .aviso-caja p{ margin:2px 0 0; color:var(--tinta-2); }
.aviso-caja.info{ background:var(--info-s); } .aviso-caja.info > svg{ color:var(--info); }
.seg-tabs{ display:inline-flex; gap:4px; background:var(--panel); border:1px solid var(--linea); border-radius:999px; padding:4px; margin-bottom:16px; flex-wrap:wrap; }
.seg-tabs button{ border:0; background:none; border-radius:999px; padding:8px 16px; font:700 13.5px var(--f-b); color:var(--tinta-2); cursor:pointer; display:inline-flex; gap:8px; align-items:center; }
.seg-tabs button.on{ background:var(--accion); color:var(--accion-tinta); }
.seg-tabs button em{ font-style:normal; font-size:11px; background:var(--panel-3); border-radius:999px; padding:1px 7px; color:var(--tinta-2); }
.seg-tabs button.on em{ background:var(--accion-tinta); color:var(--accion); }
.ficha-cuerpo{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:16px; }
.bloque h2{ font:500 20px var(--f-t); margin:0 0 12px; display:flex; align-items:center; gap:10px; }
.bloque h2 small{ font:600 12.5px var(--f-b); color:var(--tinta-3); margin-left:auto; }
.inv .bloque h2 small{ color:var(--inv-tinta-3); }
.pistas{ width:100%; border-collapse:separate; border-spacing:0 6px; }
.pistas th{ text-align:left; font:700 11px var(--f-b); letter-spacing:.07em; text-transform:uppercase; color:var(--inv-tinta-3); padding:0 12px; }
.pistas td{ padding:12px; background:var(--inv-2); vertical-align:top; }
.pistas td:first-child{ border-radius:16px 0 0 16px; } .pistas td:last-child{ border-radius:0 16px 16px 0; }
.pistas .n{ color:var(--inv-tinta-3); width:30px; }
.pistas .t b{ display:block; font-weight:700; } .pistas .t small{ color:var(--inv-tinta-3); }
.pistas .cod{ white-space:nowrap; }
.e{ display:inline-grid; place-items:center; width:16px; height:16px; border-radius:4px; background:currentColor; font:800 9.5px var(--f-b); margin-left:6px; vertical-align:1px; }
.e::after{ content:'E'; color:var(--inv-2); }
.meta{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:12px; }
.meta div{ background:var(--inv-2); border-radius:16px; padding:10px 14px; min-width:0; }
.meta div small{ display:block; color:var(--inv-tinta-3); font-size:11.5px; }
.meta div span{ display:block; overflow-wrap:anywhere; font-weight:600; }
.tiendas{ display:flex; flex-direction:column; gap:6px; }
.tienda{ display:flex; align-items:center; gap:12px; padding:8px 10px 8px 8px; border-radius:18px; background:var(--panel); border:1px solid var(--linea); }
.tienda .punto, .t-sel .punto, .cal-ts .punto, .envios .punto{ width:30px; height:30px; border-radius:50%; display:grid; place-items:center; font:800 10.5px var(--f-t); color:#fff; flex:none; }
.tienda b{ font-weight:700; flex:1; min-width:0; }
.tienda .err{ display:block; font-weight:600; font-size:12.5px; color:var(--mal); }
.calendario{ display:flex; flex-direction:column; gap:12px; }
.cal-g{ display:flex; gap:16px; align-items:flex-start; border-radius:var(--r-l); padding:16px; background:var(--panel); border:1px solid var(--linea); }
.cal-f{ width:70px; flex:none; text-align:center; background:var(--accion); color:var(--accion-tinta); border-radius:20px; padding:10px 4px; }
.cal-f b{ display:block; font:500 22px/1.1 var(--f-t); } .cal-f small{ font-weight:700; opacity:.7; }
.cal-g h3{ font:600 16px var(--f-t); margin:2px 0 10px; }
.cal-ts{ display:flex; flex-wrap:wrap; gap:6px; }
.cal-ts span{ display:inline-flex; align-items:center; gap:7px; background:var(--panel-s); border:1px solid var(--linea); border-radius:999px; padding:3px 11px 3px 3px; font-size:12.5px; font-weight:700; }
.cal-ts .punto{ width:24px; height:24px; font-size:9px; }

/* Tablas de envíos (filas redondeadas) */
.tabla-sc{ overflow-x:auto; }
.envios{ width:100%; border-collapse:separate; border-spacing:0 6px; }
.envios th{ text-align:left; font:700 11px var(--f-b); letter-spacing:.07em; text-transform:uppercase; color:var(--tinta-3); padding:0 12px; white-space:nowrap; }
.envios td{ padding:10px 12px; background:var(--panel); border-top:1px solid var(--linea); border-bottom:1px solid var(--linea); vertical-align:middle; }
.envios td:first-child{ border-radius:20px 0 0 20px; border-left:1px solid var(--linea); } .envios td:last-child{ border-radius:0 20px 20px 0; border-right:1px solid var(--linea); }
.envios tr.clic{ cursor:pointer; } .envios tr.clic:hover td{ background:var(--panel-s); }
.envios .lz{ display:flex; align-items:center; gap:11px; min-width:0; }
.envios .lz .portada{ width:42px; flex:none; border-radius:50%; }
.envios .lz b{ display:block; font-weight:700; } .envios .lz small{ color:var(--tinta-3); }
.envios .err{ display:block; color:var(--mal); font-size:12.5px; font-weight:600; margin-top:3px; max-width:46ch; }
.envios .como{ display:block; color:var(--tinta-3); font-size:12px; max-width:46ch; }
.inv .envios td{ background:var(--inv-2); border-color:transparent; }
.inv .envios th{ color:var(--inv-tinta-3); }
.inv .envios .lz small, .inv .envios .como{ color:var(--inv-tinta-3); }

/* ── Revisión ── */
.rev-det .checks{ display:flex; flex-direction:column; gap:6px; max-height:300px; overflow-y:auto; }
.rev-i{ display:flex; gap:10px; padding:10px 12px; border-radius:16px; background:var(--inv-3); align-items:flex-start; }
.rev-i .ic{ width:24px; height:24px; border-radius:50%; display:grid; place-items:center; flex:none; }
.rev-i.ok .ic{ background:var(--ok-s); color:var(--ok); } .rev-i.aviso .ic{ background:var(--aviso-s); color:var(--aviso); } .rev-i.error .ic{ background:var(--mal-s); color:var(--mal); }
.rev-i div{ flex:1; min-width:0; } .rev-i b{ font-weight:700; display:block; } .rev-i small{ color:var(--inv-tinta-3); display:block; }
.nota{ background:var(--inv-3); border-radius:16px; padding:10px 14px; font-size:13px; }
.rev-det textarea{ background:var(--inv-3); border:1px solid transparent; color:var(--inv-tinta); border-radius:16px; padding:11px 13px; width:100%; min-height:80px; resize:vertical; }
.rev-det textarea:focus{ outline:none; border-color:var(--accion); }

/* ── Colaboradores ── */
.artistas{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px; }
.artista{ display:flex; gap:14px; align-items:center; padding:14px; border-radius:var(--r-l); background:var(--panel); border:1px solid var(--linea); min-width:0; backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.artista .foto{ width:58px; height:58px; border-radius:50%; flex:none; display:grid; place-items:center; font:700 18px var(--f-t); color:#fff; }
.artista div{ min-width:0; flex:1; }
.artista b{ display:block; font:700 15px var(--f-b); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.artista small{ color:var(--tinta-3); display:block; margin-bottom:6px; }
.ids{ display:flex; gap:6px; flex-wrap:wrap; }

/* ── Carga ── */
.pasos{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin-bottom:18px; }
.paso{ display:inline-flex; align-items:center; gap:10px; height:52px; padding:0 18px 0 6px; border-radius:999px; border:0; cursor:pointer; background:var(--panel); color:var(--tinta-2); font:700 13.5px var(--f-b); border:1px solid var(--linea); }
.paso .nro{ width:40px; height:40px; border-radius:50%; display:grid; place-items:center; font:500 18px var(--f-t); background:var(--panel-3); color:var(--tinta); flex:none; }
.paso small{ display:none; }
.paso.listo .nro{ background:var(--azul); color:#fff; }
.paso.falla .nro{ background:var(--mal-s); color:var(--mal); }
.paso.on{ background:var(--accion); color:var(--accion-tinta); border-color:transparent; padding-right:24px; }
.paso.on .nro{ background:var(--accion-tinta); color:var(--accion); }
.carga{ display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:16px; align-items:start; }
.hoja{ background:var(--panel); border:1px solid var(--linea); border-radius:var(--r-xl); padding:26px; min-width:0; backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.hoja > h2{ font:400 32px var(--f-t); letter-spacing:-.8px; }
.hoja > p.sub{ margin:4px 0 20px; color:var(--tinta-2); }
.campos{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 16px; }
.campo{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.campo.ancho{ grid-column:1/-1; }
.campo label{ font:700 12.5px var(--f-b); color:var(--tinta-2); }
.campo label em{ font-style:normal; color:var(--tinta-3); font-weight:600; }
.campo input, .campo select, .campo textarea{ background:var(--panel-s); border:1px solid var(--linea-2); border-radius:16px; padding:11px 14px; outline:none; width:100%; min-width:0; }
.campo textarea{ resize:vertical; min-height:96px; line-height:1.55; }
.campo input:focus, .campo select:focus, .campo textarea:focus{ border-color:var(--tinta); box-shadow:0 0 0 3px var(--accion-s); }
.campo .ayuda{ font-size:12px; color:var(--tinta-3); }
.campo .ayuda.mal{ color:var(--mal); } .campo .ayuda.aviso{ color:var(--aviso); }
.seg{ display:flex; background:var(--panel-3); border-radius:999px; padding:4px; gap:4px; }
.seg button{ flex:1; border:0; background:none; border-radius:999px; padding:8px 10px; font:700 13px var(--f-b); color:var(--tinta-2); cursor:pointer; }
.seg button.on{ background:var(--accion); color:var(--accion-tinta); }
.pie-hoja{ display:flex; gap:10px; justify-content:space-between; margin-top:24px; padding-top:18px; border-top:1px solid var(--linea); flex-wrap:wrap; }
.importar{ display:flex; gap:12px; align-items:center; background:var(--grad); color:#fff; border-radius:var(--r-l); padding:14px 16px; margin-bottom:22px; flex-wrap:wrap; }
.importar > svg{ color:#fff; }
.importar div{ flex:1; min-width:180px; } .importar b{ display:block; } .importar small{ color:rgba(255,255,255,.8); }
.importar select{ background:rgba(255,255,255,.16); color:#fff; border:0; border-radius:999px; padding:9px 14px; max-width:100%; }
.importar .btn{ background:var(--accion); color:var(--accion-tinta); border-color:transparent; }
.soltar{ border:1.5px dashed var(--linea-2); border-radius:var(--r-l); padding:22px; display:flex; gap:16px; align-items:center; cursor:pointer; position:relative; background:repeating-linear-gradient(-45deg, transparent 0 10px, var(--panel-2) 10px 12px); }
.soltar:hover, .soltar.encima{ border-color:var(--tinta); background:var(--accion-s); }
.soltar input{ position:absolute; inset:0; opacity:0; cursor:pointer; }
.soltar .ic{ width:48px; height:48px; border-radius:50%; background:var(--accion); display:grid; place-items:center; color:var(--accion-tinta); flex:none; }
.soltar b{ display:block; font:600 16px var(--f-t); } .soltar small{ color:var(--tinta-3); }
.archivos-g{ display:flex; flex-direction:column; gap:20px; }
.cover-zona{ display:flex; gap:16px; align-items:center; flex-wrap:wrap; }
.cover-zona > label{ width:150px; flex:none; }
.cover-zona .portada{ border-radius:22px; }
.cover-zona .soltar{ aspect-ratio:1; flex-direction:column; justify-content:center; text-align:center; padding:12px; gap:8px; }
.cover-zona .veredicto{ flex:1; min-width:180px; }
.veredicto{ display:flex; flex-direction:column; gap:4px; font-size:12.5px; font-weight:600; }
.veredicto span{ display:flex; gap:6px; align-items:flex-start; }
.veredicto .ok{ color:var(--ok); } .veredicto .aviso{ color:var(--aviso); } .veredicto .mal{ color:var(--mal); }
.lista-pistas{ display:flex; flex-direction:column; gap:8px; margin-top:12px; }
.pista-f{ display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:20px; background:var(--panel-s); border:1px solid var(--linea); }
.pista-f .n{ font:500 18px var(--f-t); color:var(--tinta-3); width:22px; text-align:center; }
.pista-f .d{ flex:1; min-width:0; }
.pista-f .d b{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-weight:700; }
.pista-f .d small{ color:var(--tinta-3); display:block; overflow-wrap:anywhere; }
.icono-b{ background:none; border:0; color:var(--tinta-3); cursor:pointer; padding:7px; border-radius:50%; display:grid; place-items:center; }
.icono-b:hover{ color:var(--tinta); background:var(--panel-3); }
.cancion-b{ border:1px solid var(--linea); border-radius:var(--r-l); margin-bottom:10px; overflow:hidden; background:var(--panel-s); }
.cancion-b > summary{ list-style:none; display:flex; align-items:center; gap:12px; padding:14px 16px; cursor:pointer; }
.cancion-b > summary::-webkit-details-marker{ display:none; }
.cancion-b > summary b{ flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cancion-b > .dentro{ padding:4px 16px 18px; }
.reparto{ display:flex; flex-direction:column; gap:8px; }
.reparto .fila-r{ display:grid; grid-template-columns:minmax(0,1fr) 90px 34px; gap:8px; }
.reparto .fila-r input{ background:var(--panel); border:1px solid var(--linea-2); border-radius:14px; padding:10px 12px; min-width:0; }
.barra-rep{ height:10px; border-radius:99px; background:var(--panel-3); overflow:hidden; display:flex; gap:2px; }
.barra-rep i{ display:block; height:100%; border-radius:99px; }
.grupo-t{ margin-top:18px; }
.grupo-t h3{ font:700 13px var(--f-b); color:var(--tinta-2); margin:0 0 8px; display:flex; justify-content:space-between; align-items:center; }
.rejilla-t{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:8px; }
.t-sel{ display:flex; align-items:center; gap:10px; padding:6px 12px 6px 6px; border-radius:999px; cursor:pointer; background:var(--panel-s); border:1px solid var(--linea); }
.t-sel:has(input:checked){ border-color:var(--tinta); }
.t-sel input{ accent-color:var(--accion); width:16px; height:16px; order:3; margin-left:auto; }
.t-sel span{ font-weight:700; font-size:13px; }
.revision{ display:flex; flex-direction:column; gap:18px; }
.rev-g h3{ font:700 12px var(--f-b); letter-spacing:.07em; text-transform:uppercase; color:var(--tinta-3); margin:0 0 8px; }
.revision .rev-i{ background:var(--panel-s); border:1px solid var(--linea); }
.revision .rev-i small{ color:var(--tinta-3); }
.marcador{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:6px; }

/* Vista previa tipo tienda */
.previa{ position:sticky; top:0; display:flex; flex-direction:column; gap:10px; }
.previa > small{ font:700 11.5px var(--f-b); letter-spacing:.08em; text-transform:uppercase; color:var(--tinta-3); padding-left:6px; }
.telefono{ --amb:#5A3A8A; border-radius:38px; padding:10px; background:#0D0E10; box-shadow:var(--sombra), inset 0 0 0 1px #2A2C31; }
.pantalla{ border-radius:30px; overflow:hidden; background:linear-gradient(180deg, color-mix(in oklab, var(--amb) 70%, #0D0E10) 0%, #0D0E10 62%); color:#F4F5F7; padding:22px 16px 18px; display:flex; flex-direction:column; gap:12px; min-height:470px; }
.pantalla .portada{ width:72%; margin:4px auto 4px; box-shadow:0 18px 40px rgba(0,0,0,.55); border-radius:12px; }
.pantalla .pv-vacia{ aspect-ratio:1; width:72%; margin:4px auto; border-radius:12px; border:1.5px dashed rgba(255,255,255,.25); display:grid; place-items:center; color:rgba(255,255,255,.5); font-size:12px; text-align:center; padding:12px; }
.pantalla h4{ margin:0; font:700 19px/1.15 var(--f-t); overflow-wrap:anywhere; }
.pantalla .pv-a{ font:700 13px var(--f-b); color:rgba(255,255,255,.85); }
.pantalla .pv-m{ font-size:11.5px; color:rgba(255,255,255,.6); }
.pantalla ol{ list-style:none; margin:4px 0 0; padding:0; display:flex; flex-direction:column; gap:9px; }
.pantalla li{ display:flex; gap:10px; align-items:center; font-size:13px; }
.pantalla li i{ font-style:normal; color:rgba(255,255,255,.5); width:14px; text-align:right; }
.pantalla li span{ flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pantalla li small{ color:rgba(255,255,255,.55); }
.pantalla .e{ color:rgba(255,255,255,.6); } .pantalla .e::after{ color:#0D0E10; }
.previa .nota{ font-size:12px; color:var(--tinta-3); background:none; padding:0 6px; }

/* Aviso flotante */
.toast{ position:fixed; left:50%; bottom:calc(24px + env(safe-area-inset-bottom,0px)); transform:translateX(-50%); background:var(--accion); color:var(--accion-tinta); border-radius:999px; padding:12px 20px; font:700 13.5px var(--f-b); box-shadow:var(--sombra); z-index:50; max-width:calc(100% - 32px); text-align:center; animation:sube .25s ease; }
@keyframes sube{ from{ transform:translate(-50%,10px); opacity:0; } }

/* ── Pantallas medianas ── */
@media (max-width:1200px){
  .md{ grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); }
  .cuadros{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ficha-top{ grid-template-columns:auto minmax(0,1fr); }
  .ficha-top .cuentas{ grid-column:1/-1; grid-template-columns:repeat(4,minmax(0,1fr)); }
  .carga{ grid-template-columns:1fr; }
  .previa{ display:none; }
}
@media (max-width:1020px){
  .inicio{ grid-template-columns:1fr; }
  .cal{ grid-row:auto; }
  .act-g{ grid-template-columns:1fr 1fr; }
  .md{ grid-template-columns:1fr; }
  .md-lista{ max-height:none; }
  .ficha-cuerpo{ grid-template-columns:1fr; }
}
/* ── Teléfono ── */
@media (max-width:760px){
  .app{ grid-template-columns:1fr; margin:0; border-radius:0; padding:14px 0 0; height:100%; gap:0; }
  .riel, .solo-esc{ display:none !important; }
  .app{ border:0; }
  .principal{ padding:0; }
  .top{ padding:0 max(16px, env(safe-area-inset-right,0px)) 12px max(16px, env(safe-area-inset-left,0px)); }
  .buscar{ width:100%; order:3; }
  .vista{ padding-right:0; }
  .marco{ padding:0 max(16px, env(safe-area-inset-right,0px)) 28px max(16px, env(safe-area-inset-left,0px)); }
  .tabs-movil{ display:flex; justify-content:space-between; align-items:center; gap:4px; background:var(--panel); border-radius:999px; padding:6px; margin:6px max(12px, env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) max(12px, env(safe-area-inset-left,0px)); box-shadow:var(--sombra); }
  .tabs-movil a{ display:grid; place-items:center; width:46px; height:46px; border-radius:50%; color:var(--tinta-2); background:var(--panel-2); }
  .tabs-movil a span{ display:none; }
  .tabs-movil a.on{ background:var(--accion); color:var(--accion-tinta); }
  .inicio, .fila-mini{ grid-template-columns:1fr; }
  .cal{ grid-row:auto; }
  .chispas{ grid-template-columns:1fr 1fr; }
  .chispas .chispa:first-child{ grid-column:1/-1; }
  .act-g{ grid-template-columns:1fr 1fr; }
  .tabs-movil a.cargar{ width:auto; padding:0 18px; border-radius:999px; background:var(--azul); color:#fff; display:flex; gap:6px; font:800 13px var(--f-b); }
  .tabs-movil a.cargar span{ display:inline; }
  .metricas{ grid-template-columns:1fr 1fr; }
  .metricas > div:first-child{ grid-column:1/-1; }
  .meses{ grid-template-columns:1fr 1fr !important; }
  .cuadros{ grid-template-columns:1fr 1fr; }
  .det-cab{ grid-template-columns:auto minmax(0,1fr); }
  .det-cab .quien{ grid-column:1/-1; text-align:left; }
  .ficha-top{ grid-template-columns:1fr; }
  .ficha-top > .portada{ width:180px; }
  .ficha-top .cuentas{ grid-template-columns:1fr 1fr; }
  .campos{ grid-template-columns:1fr; }
  .meta{ grid-template-columns:1fr; }
  .hoja{ padding:20px 16px; border-radius:var(--r-l); }
  .inv{ padding:16px; border-radius:var(--r-l); }
  .detalle{ padding:14px; }
  .pista-f{ flex-wrap:wrap; }
  .pista-f .d{ flex-basis:calc(100% - 40px); }
  .rejilla{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ocultar-m{ display:none; }
  .lote{ border-radius:var(--r-l); }
  .muesca{ position:static; transform:none; background:none; padding:0 0 12px; margin:0 auto; max-width:100%; }
  .muesca-wrap{ margin-top:0; }
  .paso{ height:46px; padding:0 6px; } .paso.on{ padding-right:16px; } .paso:not(.on) .lbl{ display:none; }
  .paso .nro{ width:34px; height:34px; font-size:16px; }
}

.movil-tema{ display:none; }
@media (max-width:760px){ .movil-tema{ display:grid; } .saludo h1{ font-size:24px; } .top .logo-riel{ width:42px; height:42px; border-radius:14px; } .top{ flex-wrap:wrap; } .top .der{ width:100%; } }

/* ── Entrada (login) ── */
.arrancando{ min-height:100%; display:grid; place-items:center; color:var(--tinta-3); font:600 14px var(--f-b); }
.entrada{ min-height:100%; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr); gap:14px; padding:14px; }
.entrada-arte{ position:relative; overflow:hidden; border-radius:34px; background:var(--grad); color:#fff; padding:40px; display:flex; flex-direction:column; justify-content:space-between; gap:40px; min-height:280px; }
.entrada-arte::after{ content:''; position:absolute; inset:0; background:radial-gradient(60% 50% at 80% 10%, rgba(255,255,255,.18), transparent 70%); pointer-events:none; }
.entrada-marca{ display:flex; align-items:center; gap:12px; font:700 15px/1.1 var(--f-t); position:relative; z-index:1; }
.logo-l{ width:46px; height:46px; border-radius:16px; background:rgba(255,255,255,.18); backdrop-filter:blur(8px); display:grid; place-items:center; font:800 22px var(--f-t); }
.entrada-frase{ position:relative; z-index:1; }
.entrada-frase h2{ font:400 clamp(38px, 5vw, 68px)/1.02 var(--f-t); letter-spacing:-1.8px; margin:0 0 16px; }
.entrada-frase h2 em{ font-style:normal; opacity:.75; }
.entrada-frase p{ margin:0; font-size:15px; opacity:.85; max-width:34ch; }
.entrada-chips{ display:flex; gap:8px; flex-wrap:wrap; position:relative; z-index:1; }
.entrada-chips span{ background:rgba(10,8,25,.35); border:1px solid rgba(255,255,255,.2); border-radius:999px; padding:7px 13px; font:700 12.5px var(--f-b); }
.entrada-form{ background:var(--marco); border:1px solid var(--linea); border-radius:34px; display:grid; place-items:center; padding:40px 28px; }
.entrada-form form{ width:min(380px, 100%); display:flex; flex-direction:column; gap:14px; }
.entrada-ico{ width:54px; height:54px; border-radius:18px; background:var(--grad); color:#fff; display:grid; place-items:center; box-shadow:0 10px 30px rgba(123,63,242,.35); margin-bottom:6px; }
.entrada-form h1{ font:400 40px/1 var(--f-t); letter-spacing:-1px; margin:0; }
.entrada-form .sub{ margin:-4px 0 6px; color:var(--tinta-3); font-size:14px; }
.entrada-form .campo{ display:flex; flex-direction:column; gap:7px; }
.entrada-form .campo > span{ font:700 13px var(--f-b); color:var(--tinta-2); }
.entrada-form input{ width:100%; background:var(--panel-2); border:1px solid transparent; border-radius:16px; padding:14px 16px; color:var(--tinta); font:600 15px var(--f-b); outline:none; }
.entrada-form input:focus{ border-color:var(--azul); box-shadow:0 0 0 3px rgba(123,63,242,.25); }
.entrada-form .clave{ position:relative; display:block; }
.entrada-form .clave input{ padding-right:84px; }
.entrada-form .ver{ position:absolute; right:8px; top:50%; transform:translateY(-50%); border:0; background:var(--panel-3); color:var(--tinta-2); border-radius:11px; padding:7px 11px; font:700 12px var(--f-b); cursor:pointer; }
.entrada-msg{ min-height:20px; font:700 13px var(--f-b); color:var(--mal); }
.entrada-msg:empty{ min-height:0; margin-top:-8px; }
.entrada-msg.aviso{ color:var(--aviso); }
.btn-azul.ancho, .btn.ancho{ width:100%; justify-content:center; padding:15px 20px; font-size:15px; }
.btn-azul:disabled{ opacity:.6; cursor:wait; }
.entrada-pie{ margin:4px 0 0; text-align:center; color:var(--tinta-3); font-size:13px; }
.entrada-pie a{ color:var(--tinta); font-weight:700; text-decoration:underline; text-underline-offset:3px; }
@media (max-width:860px){
  .entrada{ grid-template-columns:1fr; grid-template-rows:auto 1fr; padding:10px; }
  .entrada-arte{ padding:24px; gap:22px; min-height:0; border-radius:28px; }
  .entrada-frase h2{ font-size:34px; letter-spacing:-1px; }
  .entrada-frase p, .entrada-chips{ display:none; }
  .entrada-form{ border-radius:28px; padding:28px 20px; place-items:start center; }
}
:root[data-theme="light"] .entrada-form input{ background:var(--panel); border-color:var(--linea-2); }
