/* ==========================================================================
   «Sala de control»: la capa visual de Ecom Doctor. Va después de app.css y saas.css y redefine sus tokens y
   piezas comunes, así que vale para todas las pantallas sin tocarlas una a una.
   La idea: un instrumento de precisión. Casi negro neutro (sin tinte azul), un solo color de señal (el naranja
   de la marca) y solo en lo que importa, superficies planas separadas por líneas finas, y la Archivo variable
   como identidad: títulos anchos y finos, cifras estrechas y tabulares.
   ========================================================================== */

/* títulos: la Archivo a 112 % de ancho (la «Ancha» de app.css va a 116 %, demasiado gruesa con peso alto) */
@font-face { font-family:"Archivo Mando"; font-style:normal; font-weight:100 900; font-stretch:112%; font-display:swap; src:url(/static/fonts/archivo-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family:"Archivo Mando"; font-style:normal; font-weight:100 900; font-stretch:112%; font-display:swap; src:url(/static/fonts/archivo-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C0; }

:root {
  --lienzo:#F4F4F5; --lienzo-2:#EBEBED; --tarjeta:#FFFFFF; --campo:#FFFFFF; --hover:#F0F0F2; --elevado:#FFFFFF;
  --tinta:#0B0C0E; --suave:#50525C; --tenue:#878995; --linea:#E3E3E7; --linea-2:#D2D3D8; --linea-3:#A9AAB3;
  --accion:#FF5B1F; --accion-2:#FF6F38; --accion-osc:#E8480E; --accion-claro:#FFEEE6; --accion-borde:#FFC7AF; --accion-brillo:rgba(255,91,31,.28);
  --ok:#0B8A57; --ok-claro:#E3F5EC; --ok-borde:#A9DCC4;
  --alerta:#8F5A06; --alerta-claro:#FFF3DC; --alerta-borde:#EDCD8B;
  --error:#C9332B; --error-claro:#FCEBEA; --error-borde:#F1BFBB;
  --info:#3A4BC9; --info-claro:#EEF0FB; --info-borde:#CDD2F2;
  --solido:#0B0C0E; --solido-txt:#FFFFFF; --solido-suave:#9A9CA6; --solido-linea:#26272D;
  /* el carril va en tinta en los dos temas: el instrumento tiene su panel */
  --lateral:#0A0B0D; --rail-txt:#A3A5AF; --rail-tenue:#686A75; --rail-linea:rgba(255,255,255,.07); --rail-hover:rgba(255,255,255,.05); --rail-on:rgba(255,255,255,.07);
  --sombra-1:none; --sombra-2:none;
  --sombra-3:0 24px 64px -24px rgba(11,12,14,.42), 0 0 0 1px rgba(11,12,14,.06);
  --titulo:"Archivo Mando", "Archivo", "Segoe UI", system-ui, sans-serif;
  --r:8px; --r-peq:6px; --r-card:12px; --r-xl:16px;
  /* movimiento: curvas fuertes de salida, sin rebotes */
  --ease-out:cubic-bezier(.22,1,.36,1); --ease-expo:cubic-bezier(.16,1,.3,1); --ease-io:cubic-bezier(.76,0,.24,1); --ease-muelle:cubic-bezier(.22,1,.36,1);
  --escaneo:#FF5B1F;
}
[data-tema="oscuro"] {
  --lienzo:#08090B; --lienzo-2:#0C0D10; --tarjeta:#0F1013; --campo:#0B0C0F; --hover:#17181C; --elevado:#141519;
  --tinta:#EFEFF2; --suave:#A0A2AC; --tenue:#686B76; --linea:#1C1D22; --linea-2:#27282E; --linea-3:#3A3C44;
  --accion:#FF5B1F; --accion-2:#FF7240; --accion-osc:#FF6B30; --accion-claro:rgba(255,91,31,.12); --accion-borde:rgba(255,91,31,.4); --accion-brillo:rgba(255,91,31,.4);
  --ok:#3DD994; --ok-claro:rgba(61,217,148,.1); --ok-borde:rgba(61,217,148,.3);
  --alerta:#F2B544; --alerta-claro:rgba(242,181,68,.1); --alerta-borde:rgba(242,181,68,.3);
  --error:#FF625A; --error-claro:rgba(255,98,90,.1); --error-borde:rgba(255,98,90,.32);
  --info:#93A3FF; --info-claro:rgba(147,163,255,.08); --info-borde:rgba(147,163,255,.26);
  --solido:#17181C; --solido-txt:#FFFFFF; --solido-suave:#9A9CA6; --solido-linea:#2A2B31;
  --lateral:#050607; --rail-linea:rgba(255,255,255,.06);
  --sombra-3:0 30px 80px -24px rgba(0,0,0,.9), 0 0 0 1px rgba(255,255,255,.07);
}

body { font-size:14px; letter-spacing:-.003em; }
::selection { background:var(--accion); color:#fff; }

/* ------------------------------------------------------------ tipografía */
h1, h2, h3, h4 { font-family:var(--titulo); }
h1 { font-size:38px; line-height:1.02; font-weight:620; letter-spacing:-.045em; }
h2 { font-size:18px; font-weight:620; letter-spacing:-.025em; }
h3 { font-family:var(--titulo); font-size:15px; font-weight:620; letter-spacing:-.02em; }
.cifra, [data-contar], .odo { font-family:var(--cifras); }

/* ------------------------------------------------------------ carril */
.lateral { box-shadow:inset -1px 0 0 var(--rail-linea); }
.logo-marca { border-radius:8px; box-shadow:none; }
.logo:hover .logo-marca { transform:rotate(-6deg); }
.logo-txt { font-weight:640; letter-spacing:-.035em; }
.ia-app, .ts-btn { background:transparent; border-color:var(--rail-linea); border-radius:8px; }
.ia-app:hover, .ts-btn:hover { background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.12); }
.ts-av { border-radius:6px; }
.nav a { border-radius:6px; min-height:36px; font-size:13.5px; }
.nav a.on { background:var(--rail-on); }
.nav-hov { border-radius:6px; height:36px; }
.nav-ind { width:2px; border-radius:0; box-shadow:none; }
.nav a.nueva { border-radius:8px; box-shadow:none; font-weight:620; }
.nav a.nueva::after { display:none; }                       /* sin barrido brillante */
.nav a.nueva:hover { box-shadow:none; background:var(--accion-2); transform:none; }
.badge { border-radius:4px; box-shadow:none; font-family:var(--cifras); }
.tema { border-radius:8px; background:rgba(255,255,255,.04); } .tema button { border-radius:6px; }
.plegar { border-radius:8px; background:rgba(255,255,255,.04); }
.ts-menu { border-radius:12px; }

/* ------------------------------------------------------------ barra superior: plana, sin cristal */
.topbar { background:var(--lienzo); backdrop-filter:none; -webkit-backdrop-filter:none; }
.topbar.bajado { box-shadow:none; }
.tb-buscar { border-radius:8px; box-shadow:none; background:var(--tarjeta); }
.tb-buscar:hover { box-shadow:none; }
kbd { border-radius:4px; border-bottom-width:1px; font-family:var(--cifras); }
.estado-sis, .cp-boton { border-radius:8px; box-shadow:none; }
.cp-boton:hover { box-shadow:none; }

/* lo que se está creando, visto desde cualquier pantalla: barrita en la píldora y línea arriba del todo */
.estado-sis.activo { overflow:hidden; }
.estado-sis.activo::after { content:""; position:absolute; left:0; bottom:0; height:2px; width:var(--pct, 0%); background:var(--accion); transition:width 1.2s var(--ease-out); }
.barra-trabajo { position:fixed; left:0; right:0; top:0; height:2px; z-index:499; pointer-events:none; background:var(--accion); transform-origin:0 50%;
  transform:scaleX(0); opacity:0; transition:transform 1.4s var(--ease-out), opacity .4s; }
.barra-trabajo.on { opacity:1; }

/* ------------------------------------------------------------ cabecera de página: el título manda, sin icono en un cuadrado */
.pag-ic, .pend-ic { display:none !important; }
.pag-tit { display:block; }
.pag-cab { margin-bottom:32px; }
.pag-cab p { font-size:14.5px; }

/* ------------------------------------------------------------ superficies */
.card { border-radius:var(--r-card); box-shadow:none; }
a.card:hover { box-shadow:none; transform:none; border-color:var(--linea-3); }
.foco::before { background:radial-gradient(220px circle at var(--mx, 50%) var(--my, 50%), var(--accion), transparent 70%); }

/* ------------------------------------------------------------ formularios */
input, select, textarea { border-radius:var(--r); box-shadow:none; min-height:40px; }
input:focus, select:focus, textarea:focus { box-shadow:0 0 0 3px var(--accion-claro); }
input[type=checkbox] { border-radius:4px; }

/* ------------------------------------------------------------ botones: planos, un solo relleno */
button, a.boton, .boton-s { min-height:38px; border-radius:var(--r); font-weight:620; font-size:13.5px; border-color:var(--accion);
  box-shadow:none; transition:transform .14s var(--ease-out), background-color .18s, border-color .18s, color .18s, opacity .18s; }
button:hover, a.boton:hover { filter:none; background-color:var(--accion-2); border-color:var(--accion-2); }
:is(button:not([class]), button.sec, button.peq, button.oscuro, a.boton, .boton-s):hover { transform:none; box-shadow:none; }
:is(button, a.boton, .boton-s):active { transform:scale(.97); transition-duration:.08s; }
button.sec, a.sec, .boton-s { background:transparent; border-color:var(--linea-2); box-shadow:none; }
button.sec:hover, a.sec:hover, .boton-s:hover { background:var(--hover); border-color:var(--linea-3); box-shadow:none !important; }
button.peq, a.peq, .boton-s.peq { min-height:32px; border-radius:6px; font-size:12.5px; }
button.oscuro { background:var(--solido); border-color:var(--solido-linea); }
button.oscuro:hover { background:var(--hover); color:var(--tinta); border-color:var(--linea-3); }

/* ------------------------------------------------------------ avisos, chips y estados: etiquetas rectas, sin brillo */
.aviso, .ok, .info { border-radius:10px; }
.chip { border-radius:5px; font-weight:600; letter-spacing:0; }
.chip::before { box-shadow:none !important; }
details > summary::before { border-width:1.5px; }
pre { border-radius:var(--r); }

/* ------------------------------------------------------------ capas flotantes: lo único con sombra */
.pc-fondo { background:rgba(5,6,7,.62); backdrop-filter:none; -webkit-backdrop-filter:none; }
.pc { border-radius:14px; animation:pc-entra .32s var(--ease-expo); }
@keyframes pc-entra { from { opacity:0; transform:translateY(-8px) scale(.98); } }
.pc-it { border-radius:8px; } .pc-it .pc-ic { border-radius:6px; }
.toast { border-radius:10px; background:var(--solido); box-shadow:var(--sombra-3); animation:toast-entra .42s var(--ease-expo) both; }
@keyframes toast-entra { from { opacity:0; transform:translateY(16px); } }
.toast > i { border-radius:6px; }
.cp { border-radius:14px; animation:cp-entra .38s var(--ease-expo); }
@keyframes cp-entra { from { opacity:0; transform:translateY(14px) scale(.98); } }
.cp-cab { background:var(--elevado); color:var(--tinta); }
.cp-cab small { color:var(--suave); } .cp-x { color:var(--suave); } .cp-x:hover { background:var(--hover); color:var(--tinta); }
.cp-m { border-radius:12px; animation:cp-m .32s var(--ease-expo) both; }
@keyframes cp-m { from { opacity:0; transform:translateY(8px); } }
.cp-m.user { border-bottom-right-radius:4px; } .cp-m.assistant { border-bottom-left-radius:4px; }
.cp-form textarea, .cp-form button { border-radius:10px; }
.velo { background:rgba(5,6,7,.6); backdrop-filter:none; }
.barra-carga { height:2px; } .barra-carga::before { background:var(--accion); box-shadow:none; }

/* ------------------------------------------------------------ «¿Cómo funciona esta pantalla?»: una franja de la consola, no un cartel azul */
.ayp { border-color:var(--linea); background:var(--tarjeta); border-radius:var(--r-card); }
.ayp > summary { padding:10px 14px; }
.ayp-ic { border-radius:6px; background:var(--accion-claro); color:var(--accion); border:0; width:30px; height:30px; }
.ayp-t b { font-size:14px; } .ayp-abrir { color:var(--suave); }
.ayp-chip { border-radius:5px; }
.ayp-cuerpo section { border-radius:8px; background:var(--lienzo-2); border-color:transparent; }
.ayp-cuerpo h4 { text-transform:none; letter-spacing:0; font-size:12.5px; color:var(--tenue); }
.ayp-pasos li::before { border-radius:5px; font-family:var(--cifras); }

/* ------------------------------------------------------------ acceso y registro */
.acc-lado, [data-tema="oscuro"] .acc-lado { background:#050607; box-shadow:inset -1px 0 0 rgba(255,255,255,.06); }
.acc-lado::before { display:none; }
.acc-lado h2 { font-family:var(--titulo); font-size:52px; line-height:1; font-weight:560; letter-spacing:-.05em; max-width:12ch; }
.acc-lado p { font-size:15px; }
.acc-pasos i { border-radius:5px; background:transparent; border:1px solid rgba(255,255,255,.14); color:var(--accion); font:600 13px var(--cifras); }
.acc-card h1 { font-size:34px; }
.acc-tema button { border-radius:6px; }
@media (max-width:860px) { .acc-lado h2 { font-size:34px; } }
/* entrada del acceso (aquí no se carga app.js): titular, texto, pasos y formulario, en ese orden */
@media (prefers-reduced-motion:no-preference) {
  .acc-lado h2, .acc-lado p, .acc-pasos li, .acc-card { animation:acc-entra .9s var(--ease-expo) both; }
  .acc-lado h2 { animation-delay:.05s; } .acc-lado p { animation-delay:.16s; }
  .acc-pasos li:nth-child(1) { animation-delay:.26s; } .acc-pasos li:nth-child(2) { animation-delay:.34s; } .acc-pasos li:nth-child(3) { animation-delay:.42s; }
  .acc-card { animation-delay:.2s; }
  .acc-lado::after { content:""; position:absolute; left:0; right:0; top:0; height:1px; background:var(--accion); opacity:0; animation:acc-escaneo 1.1s var(--ease-io) .1s; }
}
@keyframes acc-entra { from { opacity:0; transform:translateY(16px); } }
@keyframes acc-escaneo { 0% { opacity:0; transform:translateY(0); } 10% { opacity:.8; } 100% { opacity:0; transform:translateY(100vh); } }

/* ------------------------------------------------------------ editor con Claude */
.ed-ia { border-left-color:var(--linea); }
.ed-ia-btn { background:var(--accion) !important; }
.ed-ia-m { border-radius:12px; }

/* ==========================================================================
   Movimiento (sala.js). Todo lo que oculta algo lo pone el script; sin script se ve todo.
   ========================================================================== */
/* el escaneo: una línea de señal que baja por la pantalla al abrirla; cada bloque aparece cuando pasa por él */
.sx-linea { position:fixed; left:0; right:0; top:0; height:1px; z-index:35; pointer-events:none; background:var(--escaneo);
  opacity:0; transform:translateY(var(--y0, 60px)); }
.sx-linea::after { content:""; position:absolute; left:0; right:0; bottom:1px; height:90px; background:var(--escaneo); opacity:.05;
  transform-origin:50% 100%; }
.sx-linea.va { animation:sx-baja var(--dur, 820ms) var(--ease-io) forwards; }
@keyframes sx-baja { 0% { opacity:0; transform:translateY(var(--y0, 60px)); } 8% { opacity:.85; } 85% { opacity:.6; } 100% { opacity:0; transform:translateY(100vh); } }
.sx { opacity:0; transform:translateY(14px); }
.sx.sx-on { opacity:1; transform:none; transition:opacity .7s var(--ease-expo), transform .8s var(--ease-expo); transition-delay:var(--sd, 0ms); }
/* el título se descifra (scramble de head.js): las letras sin resolver, en tenue */
h1 .scr, h1.descifrando { color:inherit; }
h1.descifrando i { font-style:normal; color:var(--accion); opacity:.85; }
/* el carril entra en cascada la primera vez de la sesión */
.cascada .nav a, .cascada .nav-grupo { animation:rail-entra .6s var(--ease-expo) both; animation-delay:calc(var(--k, 0) * 22ms + 80ms); }
@keyframes rail-entra { from { opacity:0; transform:translateX(-10px); } }
/* filas de tabla y listas: una detrás de otra al aparecer */
.sx-fila { opacity:0; transform:translateY(6px); }
.sx-fila.sx-on { opacity:1; transform:none; transition:opacity .5s var(--ease-out), transform .55s var(--ease-out); transition-delay:var(--sd, 0ms); }
/* botones principales: un tirón hacia el puntero (imán), nada más */
.iman { transition:transform .5s var(--ease-expo), background-color .18s, border-color .18s, color .18s; }
.iman.iman-on { transition:transform .12s linear, background-color .18s, border-color .18s, color .18s; }
/* transición entre pantallas: la anterior se va hacia arriba y se apaga; la nueva la presenta el escaneo */
::view-transition-old(contenido) { animation:vt-sale .18s var(--ease-out) both; }
::view-transition-new(contenido) { animation:vt-entra .3s var(--ease-out) both; }
@keyframes vt-sale { to { opacity:0; transform:translateY(-6px); } }

/* ------------------------------------------------------------ fx.js: la capa viva */
.estado-sis.activo::before { display:none; }               /* el borde giratorio sobra: ahora hay barra de progreso */
/* campo de puntos detrás del contenido de la zona de trabajo */
.fx-campo { position:fixed; top:0; z-index:0; pointer-events:none; }
.app > main > .contenido { position:relative; z-index:1; }
.app > main > .topbar { z-index:30; }
/* títulos de sección: cada letra sube desde una máscara */
.fx-letras .fx-pal { display:inline-block; overflow:hidden; vertical-align:top; padding-bottom:.12em; margin-bottom:-.12em; white-space:nowrap; }
.fx-letras .fx-letra { display:inline-block; transform:translateY(110%); }
.fx-letras.fx-letras-on .fx-letra { transform:none; transition:transform .75s var(--ease-expo); transition-delay:calc(min(var(--k, 0), 40) * 16ms); }
/* fotos: se acercan despacio bajo el puntero (la cortinilla de entrada la hace el script) */
.fx-foto { transition:transform 1.4s var(--ease-expo), opacity .5s var(--ease-out); }
a:hover .fx-foto, .lt:hover .fx-foto, .in-pl:hover .fx-foto, .pl-it:hover .fx-foto { transform:scale(1.05); }
:is(.lt, .in-pl, .pl-it, a.card) :is(.lt-img, .in-pl-mini, .pl-it-mini, .lt-foto) { overflow:hidden; }
/* botones principales: un destello los cruza al pasar por encima */
:is(button, a.boton):not(.sec):not(.peq):not(.oscuro):not(.sin-onda):not([role="tab"]):not(.pr-x):not(.cp-x):not(.ed-ia-x) { position:relative; overflow:hidden; isolation:isolate; }
:is(button, a.boton):not(.sec):not(.peq):not(.oscuro):not(.sin-onda):not([role="tab"])::after { content:""; position:absolute; top:0; bottom:0; left:0; width:60%; z-index:-1;
  background:linear-gradient(105deg, transparent, rgba(255,255,255,.32), transparent); transform:translateX(-120%); pointer-events:none; }
:is(button, a.boton):not(.sec):not(.peq):not(.oscuro):not(.sin-onda):not([role="tab"]):hover::after { transform:translateX(220%); transition:transform .75s var(--ease-io); }
/* el anillo que sigue al cursor */
.fx-anillo { position:fixed; left:0; top:0; z-index:1000; width:30px; height:30px; margin:-15px 0 0 -15px; border-radius:50%; pointer-events:none;
  border:1px solid color-mix(in srgb, var(--accion) 70%, transparent); opacity:0; transition:width .35s var(--ease-expo), height .35s var(--ease-expo), margin .35s var(--ease-expo),
  opacity .3s, background-color .3s, border-color .3s; }
.fx-anillo.on { opacity:.9; }
.fx-anillo.pulsable { width:48px; height:48px; margin:-24px 0 0 -24px; background:color-mix(in srgb, var(--accion) 10%, transparent); border-color:var(--accion); }
.fx-anillo.texto { width:4px; height:26px; margin:-13px 0 0 -2px; border-radius:2px; background:var(--accion); border-color:transparent; opacity:.5; }
.fx-anillo.pulsa { width:20px; height:20px; margin:-10px 0 0 -10px; background:color-mix(in srgb, var(--accion) 30%, transparent); }
/* números de la cabecera de cada tarjeta-cifra: un tic al pasar por encima */
[data-tilt] { transform-style:preserve-3d; }

@media (prefers-reduced-motion:reduce) {
  .sx, .sx-fila { opacity:1 !important; transform:none !important; }
  .sx-linea, .fx-campo, .fx-anillo { display:none; }
  .fx-letras .fx-letra { transform:none !important; }
}
@media (max-width:600px) { h1 { font-size:28px; } }
@media print { .sx, .sx-fila { opacity:1 !important; transform:none !important; } .sx-linea { display:none; } }

/* ------------------------------------------------------------ submenú del menú lateral (apartado Tienda y apps) */
.nav .nav-sub { position:relative; display:flex; flex-direction:column; gap:1px; margin:2px 0 6px; }
.nav .nav-sub::before { content:""; position:absolute; left:19px; top:4px; bottom:4px; width:1px; background:var(--rail-linea); }
.nav .nav-sub a { min-height:30px; padding-left:40px; font-size:13px; font-weight:450; }
.nav .nav-sub a.on { background:var(--rail-on); color:#fff; font-weight:600; }
.nav .nav-sub a.on::before { content:""; position:absolute; left:17px; top:50%; width:5px; height:5px; margin-top:-2.5px; border-radius:50%; background:var(--accion); }
.nav .nav-sub a .ext { width:12px; height:12px; margin-left:auto; opacity:.55; }
.rail-compacta .nav .nav-sub { display:none; }
@media (max-width:900px) { .rail-compacta .lateral .nav .nav-sub { display:flex; } }

/* ------------------------------------------------------------ selector de colecciones de Shopify (Nueva landing y publicar) */
.sc { display:flex; flex-direction:column; gap:8px; margin:2px 0 4px; }
.sc-cab { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.sc-cab .sc-q { flex:1 1 200px; min-width:0; min-height:34px; padding:6px 11px; font-size:13.5px; }
.sc-n { font-size:12.5px; font-weight:600; color:var(--suave); margin-right:auto; }
.sc-cab .sc-q:not([hidden]) + .sc-n { margin-right:0; }
.sc-lista { display:flex; flex-wrap:wrap; gap:6px; max-height:212px; overflow-y:auto; padding:2px; }
.sc-it { margin:0; align-items:center; gap:8px; padding:6px 11px; border:1px solid var(--linea); border-radius:var(--r); font-size:13.5px; background:var(--tarjeta); max-width:100%; }
.sc-it span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sc-it input { margin:0; }
.sc-it:has(input:checked) { border-color:var(--accion); background:var(--accion-claro); }
.sc-it[hidden] { display:none; }
.sc-auto { opacity:.55; cursor:not-allowed; }
.sc-auto small { font-size:11px; font-weight:600; color:var(--tenue); border:1px solid var(--linea); border-radius:4px; padding:0 5px; }
.sc-recien { animation:sc-entra .6s var(--ease-out); }
@keyframes sc-entra { from { opacity:0; transform:translateY(-4px) scale(.96); } }
.sc-msg { margin:0; }
.sc-nueva { border:1px dashed var(--linea-3); border-radius:var(--r); padding:4px 14px 14px; }
.sc-nueva label { font-size:13px; }
.sc-nueva label input, .sc-nueva label textarea { margin-top:6px; font-weight:400; }
.sc-bots { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }

/* ------------------------------------------------------------ logo de Ecom Doctor (fragments/marca-app.html)
   El símbolo: baldosa naranja, la bolsa blanca (tu tienda) y la línea del pulso en tinta (el diagnóstico).
   Al pasar por encima, el pulso se vuelve a trazar. */
.logo-marca { background:var(--accion); box-shadow:none; }
.logo-marca svg { width:100%; height:100%; display:block; overflow:visible; }
.logo:hover .logo-marca, .logo:hover .logo-marca svg { transform:none; }
.logo-marca .lm-c { fill:#fff; }
.logo-marca .lm-asa { fill:none; stroke:#fff; stroke-width:32; stroke-linecap:round; }
.logo-marca .lm-b { fill:none; stroke:#0B0C0E; stroke-width:36; stroke-linejoin:round; stroke-dasharray:100 100; stroke-dashoffset:0; }
.logo:hover .lm-b { animation:lm-pulso .9s var(--ease-out); }
@keyframes lm-pulso { from { stroke-dashoffset:100; } }
.logo-nombre { display:block; font:inherit; color:#fff; }
.logo-nombre span { color:var(--accion); }
.logo-txt small { margin-top:3px; font-size:11.5px; letter-spacing:-.003em; }
@media (prefers-reduced-motion:reduce) { .logo:hover .lm-b { animation:none; } }

/* ------------------------------------------------------------ paleta de comandos (Ctrl K) ---- [paleta: inicio]
   Grupos con su título fijo al bajar, la fila elegida con su ↵, el link pegado y el copiloto destacados. Casi sin
   animación: se abre con el teclado muchas veces al día. */
.pc { width:min(660px, 100%); }
.pc-lista { max-height:min(480px, 60vh); scroll-padding:34px 0 6px; }
.pc-g + .pc-g { margin-top:2px; }
.pc-grupo { position:sticky; top:-6px; z-index:1; background:var(--elevado, var(--tarjeta)); padding:10px 10px 5px; font-size:11px; font-weight:650; letter-spacing:.05em; text-transform:uppercase; color:var(--tenue); }
.pc-it { position:relative; gap:11px; min-height:42px; padding:6px 10px; scroll-margin:34px 0 6px; }
.pc-it .pc-t { flex:1; min-width:0; }
.pc-it small { max-width:42%; overflow:hidden; text-overflow:ellipsis; font-variant-numeric:tabular-nums; }
.pc-it .pc-enter { display:none; flex:none; margin-left:2px; font-size:11px; line-height:1; padding:3px 5px; }
.pc-it.sel .pc-enter { display:inline-block; }
.pc-it.sel::before { content:""; position:absolute; left:0; top:9px; bottom:9px; width:2px; border-radius:2px; background:var(--accion); }
.pc-crear .pc-ic, .pc-cop .pc-ic { color:var(--accion); border-color:var(--accion-borde); background:var(--accion-claro); }
.pc-crear .pc-t { font-weight:620; }
.pc-cop .pc-t { color:var(--suave); }
.pc-cop.sel .pc-t { color:var(--tinta); }
.pc-buscando { display:flex; align-items:center; gap:9px; padding:10px 12px 8px; font-size:12.5px; color:var(--tenue); }
.pc-buscando::before { content:""; width:12px; height:12px; border-radius:50%; border:2px solid var(--linea-2); border-top-color:var(--accion); animation:pc-gira .8s linear infinite; }
@keyframes pc-gira { to { transform:rotate(360deg); } }
@media (max-width:640px) {
  .pc-fondo { padding:8px; align-items:flex-start; }
  .pc-lista { max-height:calc(100dvh - 140px); }
  .pc-it small { display:none; } .pc-pie { display:none; }
}
@media (prefers-reduced-motion:reduce) { .pc-buscando::before { animation:none; } }
/* ---------------------------------------------------------------------------------- [paleta: fin] */
