/* Promtdea Studio en escritorio (≥ 900 px, public/studio/escritorio.js). Ronda 1 del juez externo, 2-nov-2026.
   Todo va bajo :root.st-esc (la clase la pone escritorio.js solo a 900 px o más), así el celular no cambia. Usa los tokens de /estilo.css:
   claro y oscuro AA. Primario único = --accent sobre --accent-ink (7,1:1 en claro; 6,7:1 en oscuro, pruebas/prueba_studio_escritorio.js).
   Tipografía: Inter en toda la interfaz con cifras tabulares; la monoespaciada solo dentro de <kbd>. */
:root:not(.st-esc) .e-only{display:none!important}
:root.st-esc .e-only[hidden]{display:none!important}

/* ---- 6. tipografía ---- */
:root.st-esc{--mono:var(--body)} /* i1: titulares ≥ 20 px en Jost (var(--display)); por debajo, Inter 600 */
:root.st-esc body.st-body{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1,"cv11" 1}
:root.st-esc kbd{font-family:var(--f-mono)}
:root.st-esc .st-h3,:root.st-esc .st-col-cab h2,:root.st-esc .st-cad-k,:root.st-esc .st-cons-l .imp,:root.st-esc .st-plan .rec{text-transform:none;letter-spacing:0}
:root.st-esc .st-h3{font:600 13px var(--body);color:var(--ink);margin:18px 0 8px}
:root.st-esc .st-modo{display:none!important}

/* ---- 8. primario único ---- */
:root.st-esc .st-btn.primario,:root.st-esc .si-btn.primario,:root.st-esc .st-barra .st-enviar,:root.st-esc .sop-barra button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);box-shadow:none;filter:none}
:root.st-esc .st-btn.primario:hover:not([disabled]),:root.st-esc .si-btn.primario:hover,:root.st-esc .st-barra .st-enviar:hover{background:color-mix(in srgb,var(--accent) 88%,var(--ink));transform:none;box-shadow:none}
:root.st-esc .st-enviar .ico-w{color:inherit}

/* ---- 4. cabecera ---- */
:root.st-esc header.st-top{gap:6px;padding:0 12px 0 16px}
:root.st-esc .st-top-der>#stModoSel,:root.st-esc .st-top-der>#btnFalla,:root.st-esc .st-top-der>#btnImportar,:root.st-esc .st-top-der>#lnkEstudio,:root.st-esc .st-top-der>#lnkAgencia,:root.st-esc .st-top-der>#btnMaria,:root.st-esc .st-top-der>#stCreditos,:root.st-esc .st-top-der>#btnPaleta,:root.st-esc .st-top-der>.idioma,:root.st-esc .st-top-der>#btnTema{display:none!important}
:root.st-esc .st-masop{display:flex}
:root.st-esc #btnMas{min-width:36px;min-height:36px;padding:0;border-radius:10px;justify-content:center}
:root.st-esc .st-top-der{gap:8px}
:root.st-esc .st-marca span{font-weight:600;font-size:14px;color:var(--muted)}
:root.st-esc .st-marca:hover span{color:var(--ink)}
:root.st-esc .st-sep{color:var(--muted);opacity:.6;font-size:16px}
:root.st-esc .st-nombre{flex:0 1 auto;width:auto;min-width:60px;max-width:280px;field-sizing:content;font-weight:600}
:root.st-esc .st-miga{position:relative;display:flex;margin-right:auto}
:root.st-esc .st-miga-b{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:0;border-radius:7px;background:transparent;color:var(--muted);cursor:pointer;padding:0}
:root.st-esc .st-miga-b:hover,:root.st-esc .st-miga-b[aria-expanded="true"]{background:var(--st-s2);color:var(--ink)}
:root.st-esc .st-miga-b:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.st-miga-menu,.st-comp-menu{position:absolute;z-index:60;min-width:260px;max-width:340px;max-height:min(420px,70vh);overflow:auto;display:flex;flex-direction:column;gap:2px;padding:6px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink);box-shadow:0 18px 44px -12px rgba(15,14,31,.35)}
.st-miga-menu{position:fixed;top:52px;left:var(--st-miga-x,96px)}
.st-miga-menu[hidden],.st-comp-menu[hidden]{display:none}
.st-miga-menu button,.st-comp-menu button{display:flex;align-items:center;gap:10px;min-height:40px;padding:0 10px;border:0;border-radius:9px;background:none;color:var(--ink);font:500 14px var(--body);text-align:left;cursor:pointer}
.st-miga-menu button:hover,.st-comp-menu button:hover,.st-miga-menu button:focus-visible,.st-comp-menu button:focus-visible{background:var(--st-s2);outline:none}
.st-miga-menu button[aria-current="true"]{background:var(--accent-soft)}
.st-miga-menu .ico-w,.st-comp-menu .ico-w{color:var(--muted);display:inline-flex}
.st-miga-menu .nom{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.st-miga-menu .st-estado{font-style:normal}
.st-miga-vacia{margin:6px 10px;color:var(--muted);font-size:13px}
:root.st-esc .st-publicar{min-height:36px;padding:6px 16px;border-radius:10px;font:600 14px var(--body)}
:root.st-esc .st-publicar[disabled]{opacity:.45}
:root.st-esc .st-top-der #btnCuenta{min-height:36px}
/* menú ⋯ en escritorio: saldo, acciones, vista, idioma, tema y al final «¿Algo no funciona?» */
:root.st-esc .st-masop-menu{min-width:260px}
:root.st-esc .st-masop-menu>button,:root.st-esc .st-masop-menu>a{min-height:40px;font-weight:500}
:root.st-esc .st-masop-menu>button kbd{margin-left:auto}
:root.st-esc .st-masop-menu .st-masop-falla{order:9;border-top:1px solid var(--line);border-radius:0 0 10px 10px;margin-top:4px;padding-top:4px}
.st-masop-saldo{margin:2px 10px 6px;padding:0 0 8px;border-bottom:1px solid var(--line);font:600 13px var(--body);color:var(--ink)}
.st-masop-modo{display:flex;align-items:center;gap:10px;min-height:40px;padding:0 6px 0 12px;font:500 14px var(--body);color:var(--ink);white-space:nowrap}
.st-masop-modo .ico-w{color:var(--muted)}
.st-masop-modo select{margin-left:auto;min-height:32px;max-width:116px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);font:13px var(--body);padding:2px 6px}
:root.st-esc .st-top-der .st-masop-menu .idioma{margin:4px 0;padding:6px 0;border-bottom:1px solid var(--line)}
:root.st-esc .st-top-der .st-masop-menu .idioma button{min-height:34px}
/* Con el Inicio abierto: migas solo «Studio» y nada de Publicar */
:root.st-esc.st-en-inicio .st-sep,:root.st-esc.st-en-inicio .st-nombre,:root.st-esc.st-en-inicio .st-miga-b,:root.st-esc.st-en-inicio .st-publicar{visibility:hidden}
/* Sin sesión: la cabecera solo con el logo y entrar/registrarme en texto */
:root.st-esc body.st-sin-sesion .st-masop,:root.st-esc body.st-sin-sesion .st-publicar,:root.st-esc body.st-sin-sesion .st-miga,:root.st-esc body.st-sin-sesion [data-pwa-instalar]{display:none!important}

/* ---- grilla: sin fila de barra abajo ---- */
:root.st-esc .st{grid-template-rows:48px 0 minmax(0,1fr) 0;--st-izq:240px;--st-der:340px}
:root.st-esc.st-plegado .st{--st-izq:56px}
:root.st-esc .st-main{transition:grid-template-columns .2s ease}

/* ---- 2. panel Proyecto (240 px, plegable a 56) ---- */
:root.st-esc .st-izq .st-col-cab{justify-content:space-between;padding:0 8px 0 14px}
:root.st-esc .st-plegar{width:32px;height:32px}
:root.st-esc .st-izq .st-scroll{padding:10px;display:flex;flex-direction:column}
:root.st-esc .st-nueva{min-height:36px;border-radius:10px;margin-bottom:8px}
.st-buscar-w{position:relative}
:root.st-esc .st-buscar-w .st-buscar{min-height:34px;padding-right:62px;border-radius:9px}
.st-buscar-k,.st .st-buscar-k:hover:not(:disabled){position:absolute;right:6px;top:50%;transform:translateY(-50%);min-height:0;height:22px;border:0;border-radius:5px;background:none;padding:0;cursor:pointer;display:inline-flex;align-items:center;box-shadow:none}
.st-buscar-k kbd{pointer-events:none}
:root.st-esc .st-izq .st-h3{display:flex;margin:16px 4px 6px}
:root.st-esc .st-app{min-height:36px;border-radius:9px;font-size:13.5px}
:root.st-esc .st-estado{font:500 11px var(--body)}
.st-explorar{display:flex;align-items:center;gap:8px;margin-top:auto;min-height:40px;padding:0 10px;border:0;border-top:1px solid var(--line);border-radius:0;background:none;color:var(--ink);font:500 13.5px var(--body);cursor:pointer;text-align:left}
:root.st-esc .st-explorar{margin-top:auto;padding-top:6px}
.st-explorar:hover{color:var(--accent)}
.st-explorar .ico-w{color:var(--muted)}
.st-explorar:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:8px}
/* plegado: solo íconos */
:root.st-esc.st-plegado .st-izq #tProyecto,:root.st-esc.st-plegado .st-izq .st-buscar-w,:root.st-esc.st-plegado .st-izq .st-h3,:root.st-esc.st-plegado .st-izq #stCadenas,:root.st-esc.st-plegado .st-izq .st-app .nom,:root.st-esc.st-plegado .st-izq .st-app .st-estado,:root.st-esc.st-plegado .st-explorar>span:not(.ico-w),:root.st-esc.st-plegado .st-izq .st-vacia,:root.st-esc.st-plegado .st-izq label{display:none!important}
:root.st-esc.st-plegado .st-izq .st-col-cab{justify-content:center;padding:0}
:root.st-esc.st-plegado .st-izq .st-scroll{padding:8px 6px;align-items:center}
:root.st-esc.st-plegado .st-nueva{width:40px;height:40px;min-height:40px;padding:0;font-size:0;border-radius:12px}
:root.st-esc.st-plegado .st-nueva::before{content:"+";font:500 22px/1 var(--body)}
:root.st-esc.st-plegado .st-app{width:40px;justify-content:center;padding:0}
:root.st-esc.st-plegado .st-explorar{width:40px;justify-content:center;padding:0;border-top:0}

/* ---- modal «Explorar plantillas» ---- */
.st-pls{max-width:min(980px,calc(100vw - 48px));margin-top:64px;margin-bottom:auto;max-height:calc(100dvh - 112px);display:none;flex-direction:column}
.st-pls[open]{display:flex}
.st-pls-c{overflow:auto;padding:4px 20px 20px;min-height:0}
.st-pls .st-pl-sec>.st-h3:first-of-type{margin-top:20px}
.st-pls #stPlantillas{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:4px 16px;align-items:start}
.st-pls #stPlantillas>.st-cat{margin:0}
.st-pls #stBuscarPl{max-width:420px}
.st-pls .st-seg{max-width:420px}
.st-pls .sl{margin:12px 0 0}
.st-pls .sl-areas{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}

/* ---- 3. vista previa protagonista ---- */
:root.st-esc .st-centro{position:relative}
:root.st-esc .st-centro>.st-col-cab{position:absolute;top:14px;right:14px;z-index:6;height:auto;padding:4px;gap:4px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 6px 18px -8px rgba(15,14,31,.25)}
:root.st-esc .st-centro>.st-col-cab>h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:root.st-esc .st-centro .st-insignia{margin:0 4px;font:500 12px var(--body)}
:root.st-esc .st-lienzo{flex:1;height:100%;padding:28px 28px calc(var(--st-form-h,76px) + 40px)}
:root.st-esc .st-marco.movil{height:100%;max-height:940px;width:auto;max-width:100%;aspect-ratio:390/844;border:10px solid #16151f;border-radius:44px;box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 18%,transparent),0 30px 70px -24px rgba(15,14,31,.45)}
:root.st-esc .st-marco.escritorio{border-radius:12px;box-shadow:0 0 0 1px var(--line),0 24px 60px -28px rgba(15,14,31,.4)}
:root.st-esc .st-vacio{margin-bottom:60px}
:root.st-esc .st-resultado{left:50%;right:auto;transform:translateX(-50%);width:min(720px,calc(100% - 48px));bottom:calc(var(--st-form-h,76px) + 32px);max-height:min(50%,460px);border-radius:16px;z-index:6}
:root.st-esc .st-cadena{padding-bottom:120px}

/* ---- 7. compositor flotante dentro del lienzo ---- */
:root.st-esc #stForm{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);width:min(720px,calc(100% - 48px));z-index:5;padding:0;margin:0;background:none;border:0}
:root.st-esc #stForm .st-sugs{max-width:none;margin:0 0 10px;justify-content:center;flex-wrap:nowrap;gap:6px}
:root.st-esc #stForm .st-sugs li{min-width:0;flex:0 1 auto}
:root.st-esc #stForm .st-sug-c{max-width:100%;white-space:nowrap}
:root.st-esc #stForm .st-sug-c span{display:block;overflow:hidden;text-overflow:ellipsis}
:root.st-esc #stForm .st-sug-c{min-height:34px;padding:4px 14px;font:500 13px var(--body);background:var(--surface);box-shadow:0 4px 14px -8px rgba(15,14,31,.3)}
:root.st-esc #stForm .st-sug-c:hover{border-color:var(--accent);transform:none}
:root.st-esc #stForm .st-capsula{max-width:none;display:flex;flex-wrap:wrap;align-items:flex-end;gap:4px;min-height:56px;padding:8px;border:1px solid var(--line);border-radius:28px;background:var(--surface);box-shadow:0 1px 2px rgba(15,14,31,.06),0 12px 32px -12px rgba(15,14,31,.35);animation:none}
:root.st-esc #stForm .st-capsula:focus-within{border-color:color-mix(in srgb,var(--accent) 55%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent),0 12px 32px -12px rgba(15,14,31,.35)}
:root.st-esc #stForm .st-ctx,:root.st-esc #stForm .st-enlace{flex:0 0 100%;margin:2px 4px 6px}
:root.st-esc #stForm .st-capsula textarea{order:2;flex:1 1 200px;min-width:0;height:40px;min-height:40px;max-height:200px;padding:8px 6px;font:15px/24px var(--body);border:0;background:transparent}
:root.st-esc #stForm .st-cap-pie{display:contents}
:root.st-esc #stForm .st-cap-pie .st-herr{display:contents}
:root.st-esc #stForm .st-cap-pie .st-herr>.st-ic:not(#btnVoz),:root.st-esc #stForm .st-cuenta,:root.st-esc #stForm .st-kbd{display:none!important}
:root.st-esc #stForm .st-comp{order:1;position:relative;display:flex}
:root.st-esc #stForm .st-ic.st-comp-b,:root.st-esc #stForm #btnVoz,:root.st-esc #stForm .st-candado{width:40px;height:40px;min-height:40px;border-radius:50%;color:var(--muted)}
:root.st-esc #stForm #btnVoz{order:3}
:root.st-esc #stForm .st-candado{order:3;position:relative}
:root.st-esc #stForm .st-ic:hover{background:var(--st-s2);color:var(--ink)}
:root.st-esc #stForm .st-enviar{order:4;width:36px;height:36px;min-height:36px;margin:2px 2px 2px 4px;padding:0;border-radius:50%;justify-content:center}
:root.st-esc #stForm .st-enviar #stEnviarT{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:root.st-esc #stForm .st-enviar[disabled]{opacity:.6}
.st-comp-menu{bottom:48px;left:0}
:root.st-esc #stForm .st-priv{display:none}
:root.st-esc #stForm .st-entendi{max-width:none;margin:8px 4px 0}
/* candado: el aviso de datos en un globo al pasar o enfocar */
.st-candado[data-tip]:hover::after,.st-candado[data-tip]:focus-visible::after{content:attr(data-tip);position:absolute;right:-8px;bottom:50px;width:300px;padding:10px 12px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:400 12.5px/1.45 var(--body);text-align:left;white-space:normal;box-shadow:0 12px 30px -10px rgba(15,14,31,.35);z-index:8;pointer-events:none}

/* ---- 5. Inspector con pestañas fijas ---- */
:root.st-esc .st-der>.st-col-cab{height:44px;padding:0 8px;gap:0}
:root.st-esc .st-der>.st-col-cab>h2{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.st-itabs{display:flex;align-items:stretch;height:100%;gap:2px;width:100%}
.st-itabs [role="tab"]{flex:1 1 auto;min-width:0;padding:0 8px;border:0;border-bottom:2px solid transparent;background:none;color:var(--muted);font:500 13.5px var(--body);cursor:pointer;white-space:nowrap}
.st-itabs [role="tab"]:hover{color:var(--ink)}
.st-itabs [role="tab"][aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent);font-weight:600}
.st-itabs [role="tab"]:focus-visible{outline:2px solid var(--focus);outline-offset:-2px;border-radius:6px}
:root.st-esc .st-der .st-scroll{padding:16px;display:flex;flex-direction:column}
:root.st-esc .st-der .st-panel{display:none;border:0;border-radius:0;background:none;margin:0}
:root.st-esc .st-der[data-itab="diseno"] .st-panel[data-itab="diseno"],:root.st-esc .st-der[data-itab="calidad"] .st-panel[data-itab="calidad"],:root.st-esc .st-der[data-itab="publicar"] .st-panel[data-itab="publicar"],:root.st-esc .st-der[data-itab="historial"] .st-panel[data-itab="historial"]{display:block}
:root.st-esc .st-der:not([data-itab]) .st-panel[data-itab="diseno"]{display:block}
:root.st-esc #pEstilo,:root.st-esc #pPlan{order:1}
:root.st-esc #pConsultor,:root.st-esc #pPublicacion{order:2}
/* títulos de panel = rótulos (no acordeones); en las pestañas de un solo panel no se repiten */
:root.st-esc .st-der .st-panel>summary{pointer-events:none;cursor:default;min-height:0;padding:0;margin:0 0 10px;font:600 15px var(--body);color:var(--ink)}
:root.st-esc .st-der .st-panel>summary::after{display:none}
:root.st-esc #pCalidad>summary,:root.st-esc #pVersiones>summary{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
:root.st-esc #pConsultor,:root.st-esc #pPublicacion{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
:root.st-esc .st-der .st-panel-c{padding:0;font-size:13.5px}
:root.st-esc .st-fila{padding:7px 0}
:root.st-esc .st-fila>b,:root.st-esc .st-fila>span:last-child{font:500 13.5px var(--body)}
:root.st-esc .st-otro-plan{margin-top:10px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
:root.st-esc .st-otro-plan .st-linkbtn,.st-sello-ver{min-height:32px;font:600 13px var(--body);color:var(--accent);text-decoration:none;background:none;border:0;padding:0;cursor:pointer}
:root.st-esc .st-otro-plan .st-linkbtn:hover,.st-sello-ver:hover{text-decoration:underline}
.st-sello-fila{display:flex;align-items:center;gap:8px;min-height:40px;padding:6px 10px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.st-sello-fila .n{font:700 15px var(--body)}
.st-sello-fila>span:not(.st-sello-ic){color:var(--muted)}
.st-sello-fila .st-sello-ver{margin-left:auto}
.st-sello-ic{display:inline-flex}.st-sello-ic.ok{color:var(--ok)}.st-sello-ic.amb{color:var(--warn)}
.st-sello-det{margin-top:10px}
:root.st-esc .st-version small{font:12px var(--body)}
/* María como pestaña de la columna derecha */
:root.st-esc .st-body .sop-panel{margin:0;padding:0;top:92px;right:0;bottom:0;left:auto;width:var(--st-der,340px);height:auto;max-height:none;border-radius:0;border:0;border-left:1px solid var(--line);box-shadow:none;animation:none;z-index:30}
:root.st-esc .st-body .sop-panel .sop-tit .hint,:root.st-esc .st-body .sop-panel .sop-pie{display:none}
:root.st-esc .st-body .sop-panel .sop-cab{padding:8px 8px 8px 14px;min-height:48px}
:root.st-esc.st-plegado .st-body .sop-panel{width:var(--st-der,340px)}

/* ---- 9. Importar ---- */
:root.st-esc #dlgImportar{max-width:640px;margin-top:80px;margin-bottom:auto}
:root.st-esc #dlgImportar:has(#impPaso2:not([hidden])){max-width:min(980px,calc(100vw - 48px))}
:root.st-esc #dlgImportar .st-imp-c{max-height:calc(100dvh - 200px)}
:root.st-esc #dlgImportar .st-imp-zona{min-height:260px;border-radius:18px;gap:10px}
:root.st-esc #dlgImportar .st-imp-zona strong{font-size:16px}
:root.st-esc #dlgImportar textarea{min-height:180px}

/* ---- 1. Inicio único (pantalla completa con sesión y sin proyecto) ---- */
:root.st-esc .si-c-esc{max-width:1280px;padding:64px 48px 96px}
:root.st-esc .si-c-esc .si-h1{font-weight:700;letter-spacing:-.04em}
:root.st-esc .si-c-esc .si-idea{margin-top:32px}
.si-explorar{margin:14px 0 0}
.si-explorar .si-link{background:none;border:0;padding:0;min-height:36px;font:600 14px var(--body);color:var(--accent);cursor:pointer}
.si-explorar .si-link:hover{text-decoration:underline}
.si-tusapps{margin-top:56px}
.si-num{color:var(--muted);font-weight:500;font-size:.8em;margin-left:6px}
.si-apps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.si-app{position:relative}
.si-app-b{display:flex;flex-direction:column;width:100%;padding:0;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--ink);text-align:left;cursor:pointer;overflow:hidden;transition:border-color .15s,box-shadow .15s,transform .15s}
.si-app-b:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line));box-shadow:0 14px 34px -18px rgba(15,14,31,.45);transform:translateY(-2px)}
.si-app-b:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.si-app-mini{position:relative;display:flex;justify-content:center;height:190px;overflow:hidden;background:var(--bg-2,var(--bg));border-bottom:1px solid var(--line)}
.si-app-if{position:absolute;top:10px;left:50%;width:390px;height:760px;border:0;border-radius:18px;transform:translateX(-50%) scale(.46);transform-origin:top center;pointer-events:none;background:var(--bg);box-shadow:0 0 0 2px color-mix(in srgb,var(--ink) 10%,transparent)}
.si-app-ic{display:flex;align-items:center;justify-content:center;width:100%;color:var(--muted)}
.si-app-c{display:flex;flex-direction:column;gap:3px;padding:12px 14px 14px}
.si-app-c b{font:600 15px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:30px}
.si-app-c>span{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px}
.si-app-est{font-style:normal;font-size:11.5px;padding:1px 7px;border-radius:999px;border:1px solid var(--line)}
.si-app-est.publicada{color:var(--ok)}.si-app-est.por-vencer{color:var(--warn)}.si-app-est.vencida{color:var(--coral)}
.si-app-cont{position:absolute;right:8px;bottom:12px;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:8px;background:none;color:var(--muted);cursor:pointer}
.si-app-cont:hover{background:var(--st-s2,rgba(0,0,0,.05));color:var(--ink)}

/* ---- 10. puerta sin sesión: dos columnas ---- */
:root.st-esc .st-puerta{top:48px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:48px;padding:40px max(48px,calc((100vw - 1200px)/2))}
:root.st-esc .st-puerta-c{max-width:540px;text-align:left;justify-self:end}
:root.st-esc .st-puerta-c .marca{display:none}
:root.st-esc .st-puerta-c h1{font:var(--w-tit) clamp(40px,4.4vw,60px)/1.04 var(--display);letter-spacing:var(--ls-display);margin:0 0 14px}
:root.st-esc .st-puerta-c>p:not(.st-sub):not(.st-puerta-entrar){font-size:17px;line-height:1.5;margin:0 0 26px}
:root.st-esc .st-puerta-lista,:root.st-esc .st-puerta-acc{display:none}
.st-puerta-idea{display:flex;align-items:flex-end;gap:10px;padding:12px 12px 12px 18px;border:1px solid var(--line);border-radius:22px;background:var(--surface);box-shadow:0 18px 44px -24px rgba(15,14,31,.4)}
.st-puerta-idea textarea{flex:1;min-width:0;min-height:72px;max-height:180px;border:0;background:transparent;color:var(--ink);font:16px/1.5 var(--body);resize:none;padding:4px 0}
.st-puerta-idea textarea:focus{outline:none}
.st-puerta-idea:focus-within{border-color:color-mix(in srgb,var(--accent) 55%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent)}
.st-puerta-idea .st-btn{min-height:44px;padding:8px 18px;border-radius:12px;flex:none}
:root.st-esc .st-puerta-entrar{margin:16px 0 22px;font-size:14px;color:var(--muted)}
:root.st-esc .st-puerta-entrar .st-linkbtn{min-height:32px;font-weight:600;text-decoration:none}
:root.st-esc .st-puerta-entrar .st-linkbtn:hover{text-decoration:underline}
:root.st-esc .st-puerta-c .st-sub{font-size:13px;margin:0 0 6px}
.st-puerta-vista{margin:0;justify-self:start;display:flex;flex-direction:column;align-items:center;gap:12px}
.st-puerta-tel{position:relative;height:min(640px,calc(100dvh - 190px));aspect-ratio:390/800;border:10px solid #16151f;border-radius:44px;overflow:hidden;background:var(--bg);box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 18%,transparent),0 40px 90px -30px rgba(15,14,31,.5)}
.st-puerta-tel iframe{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none}
.st-puerta-vista figcaption{font-size:13px;color:var(--muted)}
@media (max-width:1100px){ :root.st-esc .st-puerta{grid-template-columns:minmax(0,1fr) auto;gap:32px;padding:32px} }
@media (prefers-reduced-motion:reduce){ :root.st-esc .st-main,.si-app-b{transition:none} }

/* ================= Ronda 2 del juez (2-nov-2026) ================= */
/* 1. Carril propio de 40 px para la barra de la vista previa: dispositivo al centro, acciones a la derecha; el celular empieza 16 px abajo */
:root.st-esc .st-centro>.st-col-cab{position:relative;top:auto;right:auto;z-index:6;flex:none;height:40px;padding:0 12px;gap:4px;justify-content:flex-end;border:0;border-bottom:1px solid var(--line);border-radius:0;background:var(--bg);box-shadow:none}
:root.st-esc .st-centro .st-herr{display:contents}
:root.st-esc .st-centro .st-insignia{margin:0 auto 0 0}
:root.st-esc .st-centro #btnMovil{position:absolute;top:4px;left:calc(50% - 34px)}
:root.st-esc .st-centro #btnEscritorio{position:absolute;top:4px;left:calc(50% + 2px)}
:root.st-esc .st-lienzo{padding:16px 24px var(--st-reserva,92px)}
/* 4. El celular muestra la app a 390 × 844 y escala para caber en el alto (escritorio.js pone --st-k) */
:root.st-esc .st-marco.movil{width:calc(390px * var(--st-k,.8) + 20px);height:calc(844px * var(--st-k,.8) + 20px);max-width:none;max-height:none;aspect-ratio:auto;flex:none;align-self:flex-start;margin:0 auto}
:root.st-esc .st-marco.movil .st-iframe{inset:auto;top:0;left:0;width:390px;height:844px;transform:scale(var(--st-k,.8));transform-origin:0 0}
:root.st-esc[data-theme="dark"] .st-marco.movil,:root.st-esc[data-theme="dark"] .st-puerta-tel{border-color:#2A2A30}
/* 2. La pista «Así quedaría tu app…» es una línea tenue sobre el compositor; «Entendí» se acomoda en filas y pliega lo demás en «+N» */
:root.st-esc .st-resultado.linea{bottom:calc(var(--st-form-h,76px) + 26px);padding:0;border:0;border-radius:0;background:none;box-shadow:none;max-height:none;overflow:visible;text-align:center}
.st-res-linea{margin:0;font:400 13px/1.4 var(--body);color:var(--muted)}
:root.st-esc #stForm .st-entendi{flex-wrap:wrap;align-items:flex-start}
:root.st-esc #stForm .st-ent-lista{flex-wrap:wrap;overflow:visible;-webkit-mask-image:none;mask-image:none}
:root.st-esc .st-ent-mas{cursor:pointer;font:600 12.5px var(--body);color:var(--accent);min-height:30px}
/* 4. Sugerencias solo con el compositor en foco; caben enteras (rótulos cortos) */
:root.st-esc #stForm .st-sugs{display:none!important;flex-wrap:wrap}
:root.st-esc #stForm:focus-within .st-sugs:not([hidden]){display:flex!important}
:root.st-esc #stForm .st-sug-c span{overflow:visible;text-overflow:clip}
/* 5. Primario único: violeta lleno con texto blanco (7,1:1 en claro; 5,7:1 en oscuro). Un solo velo para los modales. */
:root.st-esc{--st-pri:#6D28D9;--st-pri-ink:#FFFFFF}
:root.st-esc[data-theme="dark"]{--st-pri:#7C3AED;--st-pri-ink:#FFFFFF}
:root.st-esc .st-btn.primario,:root.st-esc .si-btn.primario,:root.st-esc .st-barra .st-enviar,:root.st-esc .st-body button.primary,:root.st-esc header #btnRegistro,:root.st-esc .sop-barra button.primary{background:var(--st-pri);border-color:var(--st-pri);color:var(--st-pri-ink);box-shadow:none;filter:none}
:root.st-esc .st-btn.primario:hover:not([disabled]),:root.st-esc .si-btn.primario:hover,:root.st-esc .st-barra .st-enviar:hover,:root.st-esc .st-body button.primary:hover:not(:disabled),:root.st-esc header #btnRegistro:hover{background:color-mix(in srgb,var(--st-pri) 86%,#000)}
:root.st-esc .si-btn.primario .ico,:root.st-esc .st-btn.primario .ico{color:inherit}
:root.st-esc dialog::backdrop{background:rgba(0,0,0,.4)}
:root.st-esc[data-theme="dark"] dialog::backdrop{background:rgba(0,0,0,.6)}
:root.st-esc[data-theme="dark"] dialog{border:1px solid rgba(255,255,255,.08)}
/* 6. Diseño más tranquilo: 3 × 2 muestras con solo el nombre, color al elegirlo, acciones de texto con ícono, 24 px entre grupos */
:root.st-esc .st-der .st-h3{margin:24px 0 8px}
:root.st-esc .st-der .st-panel-c>.st-h3:first-child{margin-top:0}
:root.st-esc .st-arqs{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0}
:root.st-esc .st-arq{min-height:56px;padding:8px;gap:6px;justify-content:center;border-radius:10px;font:500 13px var(--body)}
:root.st-esc .st-arq small{display:none}
:root.st-esc #stEstilo [data-acento]{display:none}
:root.st-esc .st-color{margin:0}
:root.st-esc .st-color input[type=color]{width:56px;height:32px;border-radius:8px;cursor:pointer}
:root.st-esc .st-seg{margin:0}
:root.st-esc #stEstilo [data-foto],:root.st-esc #stConsultor [data-cons-iniciar]{width:auto;min-height:32px;padding:0;gap:6px;border:0;background:none;color:var(--accent);font:600 14px var(--body);justify-content:flex-start}
:root.st-esc #stEstilo [data-foto]:hover,:root.st-esc #stConsultor [data-cons-iniciar]:hover{text-decoration:underline}
:root.st-esc #stConsultor .st-nota{margin:0 0 8px}
/* 7. Publicar: enlace + «Copiar enlace» lleno; QR y abrir como íconos; «Crecer» como filas con flecha */
.st-enlace-e{display:flex;align-items:center;gap:4px;margin:0}
.st-enlace-e code{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:13px var(--body);background:var(--st-s2);border-radius:8px;padding:8px 10px}
:root.st-esc #stPublicacion [data-copiar]{margin-top:8px}
:root.st-esc .st-qr{margin:8px 0 0}
.st-filas{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.st .st-filab{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;margin:0;padding:0 12px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;color:var(--ink);font:500 14px var(--body);text-align:left;cursor:pointer}
.st .st-filab:last-child{border-bottom:0}
.st .st-filab:hover:not(:disabled){background:var(--st-s2)}
.st .st-filab .ico{color:var(--muted)}
.st-filab .st-fl{margin-left:auto;color:var(--muted);font-size:20px;line-height:1}
/* 8. Plan y precio: el plan en una línea, tokens en una línea con «estimación» tenue, «Ver todos los planes» como enlace */
.st-plan-l{margin:0 0 6px;font:500 15px var(--body);color:var(--ink)}
.st-plan-l b{font-weight:700}
.st-sub-p{color:var(--muted);font-size:13px}
.st-muted{color:var(--muted);font-weight:400}
.st-tok{white-space:nowrap}
:root.st-esc .st-recibo .st-fila{font-size:13px}
:root.st-esc .st-recibo .st-fila>span:last-child{font-size:13px}
:root.st-esc .st-todos>summary{list-style:none;min-height:36px;color:var(--accent);font:600 13.5px var(--body)}
:root.st-esc .st-todos>summary::-webkit-details-marker{display:none}
:root.st-esc .st-todos>summary:hover{text-decoration:underline}
/* 3. Resumen de una app publicada */
.st-rs-est{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 14px;font-size:13.5px;color:var(--muted)}
.st-rs-est b{color:var(--ink)}
:root.st-esc #pResumen .st-sello-fila{margin-top:12px}
.st-rs-ult{margin:0 0 16px;font-size:13.5px;color:var(--ink)}
/* 9. Inicio: una columna centrada de 880 px; la primera fila de apps se ve a 1440 × 900 */
:root.st-esc .si-c-esc{max-width:880px;margin:0 auto;padding:40px 0 72px}
@media (max-width:960px){ :root.st-esc .si-c-esc{padding:32px 40px 64px} }
:root.st-esc .si-c-esc .si-h1{font-size:clamp(36px,4.4vw,56px)}
:root.st-esc .si-c-esc .si-idea{margin-top:20px;max-width:none}
:root.st-esc .si-c-esc .si-ejs{max-width:none}
:root.st-esc .si-c-esc .si-explorar{margin-top:8px}
.si-tusapps{margin-top:28px}
:root.st-esc .si-tusapps .si-sec-cab{margin-bottom:12px}
.si-app-mini{height:150px}
.si-app-if{transform:translateX(-50%) scale(.36)}
/* 10. Cabecera y modales */
:root.st-esc .st-publicar{min-width:116px}
:root.st-esc .st-publicar[disabled]{opacity:1;background:var(--st-s2);border-color:var(--line);color:var(--muted)}
.st-pls .st-pl-sec{display:flex;flex-direction:column}
.st-pls #stLateral{order:9;margin-top:28px}
.st-pls .sl-pers{width:auto;gap:6px;padding:0 10px}
.st-pls .sl-pers::after{content:attr(aria-label);font:500 13px var(--body)}
:root.st-esc .st-pls #stBuscarPl:focus,:root.st-esc .st-pls #stBuscarPl:focus-visible{outline:none;border-color:var(--focus);box-shadow:0 0 0 3px color-mix(in srgb,var(--focus) 30%,transparent)}
:root.st-esc .st-imp .etq{text-transform:none;letter-spacing:0;font:600 13px var(--body);color:var(--ink)}
:root.st-esc #dlgImportar #btnImpSubir:disabled{opacity:1;background:var(--st-s2);border-color:var(--line);color:var(--muted);cursor:not-allowed}
/* Historial: la versión actual es un rótulo, no una caja */
:root.st-esc .st-versiones{gap:0}
:root.st-esc .st-version{padding:10px 0;border:0;border-bottom:1px solid var(--line);border-radius:0}
:root.st-esc .st-version.actual>span{font-weight:600}
:root.st-esc .st-version.actual small{display:none}
/* Menú ⋯: «Vista de Studio» como radios del menú */
.st-masop-vista{display:grid;grid-template-columns:1fr 1fr;gap:2px;margin:4px 0;padding:6px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.st-masop-vista .st-masop-k{grid-column:1/-1;margin:0 0 4px;padding:0 12px;font:600 12px var(--body);color:var(--muted)}
.st-masop-vista [role="radio"]{display:flex;align-items:center;gap:8px;min-height:36px;margin:0;padding:0 10px;border:0;border-radius:8px;background:none;color:var(--ink);font:500 13.5px var(--body);text-align:left;cursor:pointer}
.st-masop-vista [role="radio"]::before{content:"";width:14px;height:14px;flex:none;border:1.5px solid var(--muted);border-radius:50%;box-sizing:border-box}
.st-masop-vista [role="radio"][aria-checked="true"]::before{border:4px solid var(--st-pri,var(--accent))}
.st-masop-vista [role="radio"]:hover,.st-masop-vista [role="radio"]:focus-visible{background:var(--st-s1);outline:none}
:root.st-esc .st-der[data-itab="resumen"] .st-panel[data-itab="resumen"]{display:block}
:root.st-esc .st-centro>.st-col-cab .st-ic{width:32px;height:32px;min-height:32px}
:root.st-esc .st-itabs [role="tab"]{padding:0 6px;font-size:13px}
/* «Entendí» en una sola línea (2 chips + «+N» + Ajustar); desplegado, se acomoda en filas */
:root.st-esc #stForm .st-entendi{flex-wrap:nowrap;align-items:center}
:root.st-esc #stForm .st-ent-lista{flex:0 1 auto;min-width:0;flex-wrap:nowrap;overflow:hidden}
:root.st-esc #stForm .st-ent{max-width:220px}
:root.st-esc #stForm .st-ent>span:last-child{overflow:hidden;text-overflow:ellipsis}
:root.st-esc #stForm .st-entendi.abierta,:root.st-esc #stForm .st-entendi.abierta .st-ent-lista{flex-wrap:wrap;overflow:visible}
:root.st-esc #stForm .st-entendi.abierta .st-ent{max-width:none}
:root.st-esc #stForm .st-ent-aj{flex:none;white-space:nowrap}
/* Recibo: el rótulo puede ir en dos líneas; la cifra de tokens en una */
:root.st-esc .st-recibo .st-fila>span:first-child{white-space:normal}
:root.st-esc .st-recibo .st-fila{align-items:baseline}

/* ================= Ronda 3 del juez (2-nov-2026) ================= */
/* Inspector más ancho y pestañas que nunca se aprietan: 16 px a los lados, subrayado del ancho exacto del texto */
:root.st-esc .st{--st-der:360px}
:root.st-esc .st-der>.st-col-cab{padding:0 16px}
:root.st-esc .st-itabs{justify-content:space-between;gap:0}
:root.st-esc .st-itabs [role="tab"]{position:relative;flex:0 0 auto;padding:0 6px;border-bottom:0;font:500 13.5px var(--body)}
:root.st-esc .st-itabs [role="tab"][aria-selected="true"]{font-weight:600}
:root.st-esc .st-itabs [role="tab"][aria-selected="true"]::after{content:"";position:absolute;left:6px;right:6px;bottom:0;height:2px;border-radius:2px 2px 0 0;background:var(--st-pri,var(--accent))}
:root.st-esc .st-itabs [role="tab"]:first-child{margin-left:-6px}
:root.st-esc .st-itabs [role="tab"]:last-child{margin-right:-6px}
/* Tamaños mínimos: 14 px el texto, 13 px lo secundario */
:root.st-esc .st-der .st-panel-c,:root.st-esc .st-der .st-fila,:root.st-esc .st-der .st-fila>b,:root.st-esc .st-der .st-fila>span:last-child,:root.st-esc .st-recibo .st-fila,:root.st-esc .st-recibo .st-fila>span:last-child,:root.st-esc .st-cons-l li{font-size:14px}
:root.st-esc .st-der .st-nota,:root.st-esc .st-der small,:root.st-esc .st-version small{font-size:13px}
:root.st-esc .st-der .st-fila>:last-child,:root.st-esc .st-der .st-fila>:last-child b{font-weight:600}
:root.st-esc .st-der .st-fila>:last-child span{font-weight:inherit}
/* 1. Precio en una línea; los tokens en un globo */
.st-precio>span:first-child{white-space:nowrap}
.st-precio[title]>:last-child{text-decoration:underline dotted color-mix(in srgb,var(--muted) 70%,transparent);text-underline-offset:4px;cursor:help}
/* 2. María reemplaza el Inspector (columna completa) con «← Volver» */
:root.st-esc .st-body .sop-panel{top:48px;border-left:1px solid var(--line)}
:root.st-esc .st-body .sop-panel .sop-cerrar{display:none}
.sop-volver{display:none}
:root.st-esc .sop-volver{display:inline-flex;align-items:center;gap:4px;min-height:32px;margin:0 4px 0 -4px;padding:0 8px;border:0;border-radius:8px;background:none;color:var(--ink);font:600 13.5px var(--body);cursor:pointer}
:root.st-esc .sop-volver:hover{background:var(--st-s2)}
:root.st-esc .sop-volver:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
:root.st-esc .st-body .sop-panel .sop-cab{gap:8px}
:root.st-esc .st-body .sop-panel .sop-avatar{width:32px;height:32px}
/* 3. Calidad: las pruebas a la vista, por tipo. Historial vacío con invitación. */
.st-pruebas{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.st-pruebas li{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;line-height:1.4;color:var(--ink)}
.st-pruebas li .st-sello-ic{margin-top:2px}
:root.st-esc #stCalidad .st-sello-fila{margin-bottom:4px}
:root.st-esc #stCalidad .st-h3 .st-num{font-weight:500;margin-left:4px}
:root.st-esc .st-ensayo-b{margin-top:20px}
.st-vacio-h{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:40px 12px}
.st-vacio-h-ic{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;background:var(--st-s2);color:var(--muted)}
.st-vacio-h p{margin:0;font-size:14px;color:var(--muted);max-width:260px}
/* 4. Sugerencias dentro del compositor, encima del campo; ocultas con el menú + abierto */
:root.st-esc #stForm .st-capsula>.st-sugs{order:0;flex:0 0 100%;margin:0 0 4px;padding:0 4px;justify-content:flex-start;gap:6px}
:root.st-esc #stForm .st-capsula>.st-sugs .st-sug-c{min-height:30px;padding:3px 12px;font:500 13px var(--body);box-shadow:none;background:var(--st-s1)}
:root.st-esc #stForm:has(#stCompMenu:not([hidden])) .st-sugs{display:none!important}
/* 5. La pista va al carril, junto a «Borrador»; nunca tapa el celular */
:root.st-esc .st-resultado.linea{display:none!important}
.st-pista-l{min-width:0;max-width:calc(50% - 150px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-right:auto;font:400 13px var(--body);color:var(--muted)}
:root.st-esc .st-centro .st-insignia:not([hidden])+.st-pista-l{margin-left:-2px}
:root.st-esc .st-centro .st-insignia:not([hidden]){margin-right:8px}
:root.st-esc .st-centro .st-insignia:not([hidden]):has(+.st-pista-l:not([hidden])){margin-right:8px}
/* 6. Modal de plantillas: sin el título repetido, 24 px bajo los tamaños, 2 columnas a 1280, sin «Sugeridas» repetidas, desvanecido abajo */
.st-pls .st-pl-sec>h3.st-h3{display:none}
.st-pls #stBuscarPl{margin-top:4px}
.st-pls #stTamano{margin:8px 0 24px}
.st-pls .st-sug{display:none}
@media (max-width:1439px){ .st-pls #stPlantillas{grid-template-columns:repeat(2,minmax(0,1fr))} }
.st-pls-c{padding-bottom:48px;-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 48px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 48px),transparent)}
/* 7. Paleta: sin la columna «Ir a» */
:root.st-esc .st-paleta-l li small{font:500 11px "IBM Plex Mono",ui-monospace,monospace}
/* 8. Publicar: QR y abrir con área de 32 px y fondo al pasar, alineados al campo de 36 px */
:root.st-esc .st-enlace-e code{min-height:36px;display:flex;align-items:center;padding:0 10px}
:root.st-esc .st-enlace-e .st-ic{width:32px;height:32px;min-height:32px;border-radius:8px;border:0}
:root.st-esc .st-enlace-e .st-ic:hover{background:var(--st-s2);color:var(--ink)}
:root.st-esc #pResumen .st-enlace-e .st-btn{min-height:36px}
/* 9. Menú ⋯: el idioma activo en violeta en los dos modos */
:root.st-esc .st-top-der .st-masop-menu .idioma button[aria-pressed="true"]{background:var(--st-pri);border-color:var(--st-pri);color:var(--st-pri-ink)}
/* 10. Importar: botón principal abajo a la derecha (apagado como principal), «¿Cómo lo traigo?» como desplegable */
:root.st-esc #impPaso1>.st-imp-acc{justify-content:flex-end}
:root.st-esc #dlgImportar #btnImpSubir{background:var(--st-pri);border-color:var(--st-pri);color:var(--st-pri-ink)}
:root.st-esc #dlgImportar #btnImpSubir:disabled{background:var(--st-pri);border-color:var(--st-pri);color:var(--st-pri-ink);opacity:.45;cursor:not-allowed}
:root.st-esc .st-imp-guia{border:1px solid var(--line);background:var(--st-s1);border-radius:10px}
:root.st-esc .st-imp-guia>summary{list-style:none;justify-content:space-between;min-height:44px}
:root.st-esc .st-imp-guia>summary::-webkit-details-marker{display:none}
:root.st-esc .st-imp-guia>summary::after{content:"";width:8px;height:8px;margin-right:4px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .15s}
:root.st-esc .st-imp-guia[open]>summary::after{transform:rotate(-135deg)}
/* 11. Inicio: cuadrícula de 4 columnas con «+ Nueva app»; «Crear» centrado en la caja */
:root.st-esc .si-apps{grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:16px}
.si-app-nueva .si-app-b{border-style:dashed;background:transparent}
.si-app-nueva .si-app-mini{background:transparent;border-bottom-style:dashed}
.si-app-nueva .si-app-ic{color:var(--st-pri,var(--accent))}
:root.st-esc .si-c-esc .si-idea{align-items:center}
/* 12. Campo de María: un solo anillo de 2 px y «Enviar» como botón de ícono de 36 px dentro del campo */
:root.st-esc .sop-barra{position:relative;align-items:center;gap:0;margin:10px 12px 0;padding:4px 4px 4px 12px;border:1px solid var(--line);border-radius:22px;background:var(--surface)}
:root.st-esc .sop-barra:focus-within{border-color:var(--focus);box-shadow:0 0 0 2px color-mix(in srgb,var(--focus) 35%,transparent)}
:root.st-esc .sop-barra textarea,:root.st-esc .sop-barra textarea:focus{flex:1;min-width:0;border:0;outline:none;box-shadow:none;background:transparent;padding:6px 0;min-height:36px}
:root.st-esc .sop-barra button.primary{flex:none;width:36px;height:36px;min-height:36px;padding:0;border-radius:50%;font-size:0;display:inline-flex;align-items:center;justify-content:center}
:root.st-esc .sop-barra button.primary::before{content:"";width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat}
/* Puerta: el celular de ejemplo a 390 × 844 escalado y un desvanecido abajo (nada queda cortado a medias) */
.st-puerta-tel{aspect-ratio:390/844}
.st-puerta-tel iframe{inset:auto;top:0;left:0;width:390px;height:844px;transform:scale(var(--st-kp,.72));transform-origin:0 0}
.st-puerta-tel::after{content:"";position:absolute;left:0;right:0;bottom:0;height:56px;background:linear-gradient(to bottom,transparent,var(--bg));pointer-events:none;z-index:1}
/* María: el ancho del Inspector (el panel vive fuera de .st, donde está la variable) */
:root.st-esc .st-body .sop-panel{width:360px}
.st-pista-l{max-width:none}
/* Diseño: el primer panel no repite «Estilo» (la pestaña ya dice Diseño) */
:root.st-esc #pEstilo>summary{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ================= Ronda 4 del juez (2-nov-2026) ================= */
/* 2. Las mismas pestañas, a la izquierda, sin estirarse */
:root.st-esc .st-itabs{justify-content:flex-start;gap:4px}
/* 1. Calidad: el texto completo, envuelto (sin cortes a media palabra) */
.st-pruebas li{cursor:default}
.st-pr{min-width:0;overflow-wrap:anywhere}
/* 3. Un solo botón lleno: con «Publicar/Compartir» abierto en el Inspector, el de la cabecera pasa a secundario */
:root.st-esc.st-tab-pub .st-publicar:not([disabled]){background:transparent;border-color:var(--line);color:var(--ink)}
:root.st-esc.st-tab-pub .st-publicar:not([disabled]):hover{background:var(--st-s2)}
:root.st-esc #pResumen [data-pedir-cambio]{gap:8px}
/* 4. Títulos de los modales: 19 px semibold, alineados con el borde del contenido (20 px) */
:root.st-esc .st-dlg-cab{padding:16px 16px 14px 20px}
:root.st-esc .st-dlg-cab h2{font:600 19px/1.3 var(--body);letter-spacing:-.01em}
:root.st-esc .st-pls-c{padding:8px 20px 48px}
:root.st-esc .st-imp-c{padding:16px 20px 20px}
:root.st-esc #stEnsayo{padding:16px 20px}
/* 5. Puerta: una línea bajo la caja y un pie discreto */
:root.st-esc .st-puerta-c .st-sub{display:none}
.st-puerta-pie{margin:40px 0 0;font-size:13px;color:var(--muted);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.st-puerta-pie .st-linkbtn,.st-puerta-pie a.st-linkbtn{min-height:32px;display:inline-flex;align-items:center;color:var(--muted);font:500 13px var(--body);text-decoration:underline;text-underline-offset:3px}
.st-puerta-pie .st-linkbtn:hover{color:var(--ink)}
.st-puerta-idea textarea{min-height:48px}
/* 6. «Construir gratis» de 44 px */
:root.st-esc #stPlan [data-construir],:root.st-esc #stPlan a.st-btn.primario{min-height:44px;font-size:14.5px}
/* 7. La tarjeta del plan con superficie elevada también en oscuro */
:root.st-esc[data-theme="dark"] .st-recibo,:root.st-esc[data-theme="dark"] .st-sello-fila{background:color-mix(in srgb,#fff 5%,var(--surface));border:1px solid rgba(255,255,255,.09)}
:root.st-esc .st-recibo{border-radius:12px;padding:12px 14px}
/* 8. Inicio: ejemplos en una fila, tarjetas de la misma altura, nombre sin subrayado */
:root.st-esc .si-c-esc .si-ejs{flex-wrap:nowrap}
:root.st-esc .si-c-esc .si-ej{white-space:nowrap}
:root.st-esc .si-c-esc .si-nom i{display:none}
:root.st-esc .si-apps{align-items:stretch}
:root.st-esc .si-app{display:flex}
:root.st-esc .si-app-b{flex:1;height:100%}
:root.st-esc .si-app-c{flex:1}
/* 9. Modales y menús en oscuro: superficie un paso arriba, borde 1 px más claro; velo ≥ 50 % */
:root.st-esc[data-theme="dark"] dialog,:root.st-esc[data-theme="dark"] .st-masop-menu,:root.st-esc[data-theme="dark"] .st-miga-menu,:root.st-esc[data-theme="dark"] .st-comp-menu{background:color-mix(in srgb,#fff 4%,var(--surface));border:1px solid rgba(255,255,255,.12)}
:root.st-esc[data-theme="dark"] dialog::backdrop{background:rgba(0,0,0,.62)}
:root.st-esc dialog::backdrop{background:rgba(15,14,31,.42)}
:root.st-esc[data-theme="dark"] .st-pls-c,:root.st-esc[data-theme="dark"] .st-imp-c{background:transparent}
/* 10. Plantillas: la insignia dentro de la tarjeta; descripciones de 13 px en una línea */
.st-pls .st-denso-t{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.st-pls .st-sugerido{white-space:nowrap}
.st-pls .st-plantilla>span:last-child{min-width:0}
.st-pls .st-plantilla .d,.st-pls .st-denso .d{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-pls .st-denso{min-width:0}
/* 11. Enlace legible en Resumen y Publicar */
:root.st-esc .st-enlace-e code{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 12. Color principal con su código y «Editar» */
.st-color-e{display:flex;align-items:center;gap:10px;min-height:40px;padding:4px 10px 4px 4px;border:1px solid var(--line);border-radius:10px;cursor:pointer;width:fit-content}
.st-color-e:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
.st-color-e:focus-within{outline:2px solid var(--focus);outline-offset:1px}
.st-color-e input[type=color]{width:32px;height:32px;min-height:32px;padding:0;border:0;border-radius:8px;background:none;cursor:pointer}
.st-hex{font:600 14px var(--body);letter-spacing:.02em}
.st-lapiz{display:inline-flex;align-items:center;gap:4px;margin-left:8px;color:var(--accent);font:600 13px var(--body)}
/* Bugs: Importar «3 MB» sin cortar; ⋯ con ES alineado a los íconos; María a 16 px del borde */
.st-nw{white-space:nowrap}
:root.st-esc .st-top-der .st-masop-menu .idioma{padding:6px 6px;gap:2px}
:root.st-esc .st-top-der .st-masop-menu .idioma button{flex:0 0 auto;min-width:56px;justify-content:flex-start;text-align:left;padding:0 6px}
:root.st-esc .sop-barra{margin:12px 16px 0}
:root.st-esc .st-body .sop-panel .sop-ayuda-in{margin:6px 16px 0}
/* Bugs 13/14: el menú + dentro del compositor, encima del campo (el celular se encoge, nada lo tapa) */
:root.st-esc #stForm .st-capsula>.st-comp-menu{position:static;order:0;flex:0 0 100%;flex-direction:row;flex-wrap:wrap;gap:6px;min-width:0;max-width:none;max-height:none;margin:0 0 6px;padding:0 4px;border:0;border-radius:0;background:none;box-shadow:none}
:root.st-esc #stForm .st-capsula>.st-comp-menu[hidden]{display:none}
:root.st-esc #stForm .st-capsula>.st-comp-menu button{min-height:32px;padding:0 12px;gap:6px;border:1px solid var(--line);border-radius:999px;background:var(--st-s1);font:500 13px var(--body)}
:root.st-esc #stForm .st-capsula>.st-comp-menu button:hover{border-color:var(--accent)}
/* Revisión propia de la ronda 4: 5 pestañas con aire a los lados (Inspector de 380 px), «Borrador» a la izquierda del carril, tamaños en una línea */
:root.st-esc .st{--st-der:380px}
:root.st-esc .st-body .sop-panel{width:380px}
:root.st-esc .st-itabs{gap:2px}
:root.st-esc .st-itabs [role="tab"]{font-size:13px}
:root.st-esc .st-centro .st-insignia:not([hidden]){margin-right:auto}
.st-pls #stTamano{max-width:600px}
.st-pls #stTamano button{white-space:nowrap}
/* Sin filos blancos en las esquinas del celular (redondeo de subpíxeles): el fondo del marco es el del bisel */
:root.st-esc .st-marco.movil{background:#16151f}
:root.st-esc[data-theme="dark"] .st-marco.movil{background:#2A2A30}

/* ================= Ronda 5 del juez (3-nov-2026) ================= */
:root:not(.st-esc) .m-only{display:inline}
:root.st-esc .m-only{display:none}
/* E1 + C7: el celular con barra de estado (28 px) y recorte redondo de todo su contenido; sin fondo blanco asomando */
:root.st-esc .st-marco.movil{border-width:28px 10px 10px;height:calc(844px * var(--st-k,.8) + 38px);clip-path:inset(0 round 44px);background:#16151f}
:root.st-esc .st-marco.movil::before{content:"";position:absolute;top:-19px;left:50%;transform:translateX(-50%);width:72px;height:10px;border-radius:6px;background:#000;opacity:.55;z-index:3}
:root.st-esc .st-marco.movil .st-iframe{border-radius:0;background:transparent}
:root.st-esc .st-marco.movil .st-esq{background:var(--bg)}
:root.st-esc[data-theme="dark"] .st-marco.movil{background:#2A2A30}
:root.st-esc .st-centro>.st-col-cab{background:transparent;border-bottom-color:transparent}
:root.st-esc .st-lienzo{padding-top:12px}
/* C11: el lienzo en otro nivel de fondo que los paneles; texto en oscuro sin engrosar */
:root.st-esc .st-centro{background:color-mix(in srgb,var(--ink) 4%,var(--bg))}
:root.st-esc[data-theme="dark"] .st-centro{background:#0B0B0F}
:root.st-esc body.st-body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
:root.st-esc[data-theme="dark"] .st-enlace-e code{background:color-mix(in srgb,#fff 6%,var(--surface))}
:root.st-esc[data-theme="dark"] .sop-panel .sop-log .bot,:root.st-esc[data-theme="dark"] .sop-panel .sop-log [class*="bot"]{background:color-mix(in srgb,#fff 7%,var(--surface));border-color:rgba(255,255,255,.1)}
:root.st-esc[data-theme="dark"] .st-hueco .t{text-decoration-color:var(--accent)}
/* C3: Inspector que crece con la pantalla (380 → 440 px) y texto base de 14 px */
:root.st-esc .st{--st-der:clamp(380px,23vw,440px)}
:root.st-esc .st-body .sop-panel{width:clamp(380px,23vw,440px)}
:root.st-esc .st-itabs [role="tab"]{font-size:14px}
:root.st-esc .st-rs-est{font-size:14px}
/* E3: el umbral del ensayo, tenue y en su propia línea */
.st-umbral{display:block;color:var(--muted);font-size:13px;margin-top:1px}
:root.st-esc .st-num.amb{color:var(--warn)}
/* C12: precio con ⓘ (abre su globo al pasar) */
.st-precio-v{display:inline-flex;align-items:center;gap:6px}
.st-precio[title] .st-precio-v{text-decoration:none;cursor:help}
.st-precio .st-precio-v>span:first-child{text-decoration:none}
.st-info{display:inline-flex;color:var(--muted)}
:root.st-esc .st-precio[title]>:last-child{text-decoration:none}
/* E4: con María abierta se oculta el compositor del lienzo; el pie de María tenue */
:root.st-esc.st-maria #stForm{visibility:hidden}
:root.st-esc .st-body .sop-panel .sop-falla-btn{font-weight:400;color:var(--muted);text-decoration:none}
:root.st-esc .st-body .sop-panel .sop-falla-btn:hover{color:var(--ink);text-decoration:underline}
/* E5: idioma en 3 celdas iguales con un solo separador; cabecera de la cuenta tenue */
:root.st-esc .st-top-der .st-masop-menu .idioma{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin:4px 6px;padding:2px;border:1px solid var(--line);border-radius:10px;background:var(--st-s1)}
:root.st-esc .st-top-der .st-masop-menu .idioma button{min-width:0;min-height:30px;justify-content:center;text-align:center;border:0;border-radius:8px;background:transparent}
:root.st-esc .st-masop-vista{border-bottom:0}
.st-masop-saldo{font:400 12px var(--body);color:var(--muted)}
:root.st-esc .st-masop-menu .st-masop-falla{border-top:1px solid var(--line)}
/* E7 + C10: plantillas con mosaico de color e ícono, insignia arriba a la derecha, descripción de hasta 2 líneas, controles al ancho del contenido */
.st-pls #stTamano{width:fit-content;max-width:none}
.st-pls #stTamano button{flex:0 0 auto;padding:6px 16px}
.st-pls .st-denso{position:relative;padding-right:120px}
.st-pls .st-denso-t{display:block}
.st-pls .st-denso-t .st-sugerido{position:absolute;top:10px;right:10px}
.st-pls .st-plantilla{align-items:center;gap:12px;min-height:56px}
.st-pls .st-plantilla>span:first-child{width:40px;height:40px;flex:0 0 40px;border-radius:12px;background:var(--accent-soft);color:var(--accent);margin:0}
.st-pls .st-plantilla>span:first-child .ico{width:20px;height:20px}
.st-pls .st-cat:nth-child(5n+2) .st-plantilla>span:first-child{background:color-mix(in srgb,#0EA5E9 16%,transparent);color:#0369A1}
.st-pls .st-cat:nth-child(5n+3) .st-plantilla>span:first-child{background:color-mix(in srgb,#16A34A 16%,transparent);color:#15803D}
.st-pls .st-cat:nth-child(5n+4) .st-plantilla>span:first-child{background:color-mix(in srgb,#F59E0B 18%,transparent);color:#B45309}
.st-pls .st-cat:nth-child(5n) .st-plantilla>span:first-child{background:color-mix(in srgb,#EC4899 16%,transparent);color:#BE185D}
:root.st-esc[data-theme="dark"] .st-pls .st-cat .st-plantilla>span:first-child{color:#ECECF0}
.st-pls .st-plantilla .d,.st-pls .st-denso .d{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.st-pls .st-tema .st-plantilla{padding-left:10px}
.st-pls-c{padding-bottom:96px;-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 32px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 32px),transparent)}
/* E8 (vista previa): nada */
/* C2: pulso del compositor al pedir un cambio */
@keyframes st-pulso-borde{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--st-pri,#6D28D9) 55%,transparent)}100%{box-shadow:0 0 0 12px transparent}}
:root.st-esc #stForm .st-capsula.st-pulso{border-color:var(--st-pri,#6D28D9);animation:st-pulso-borde 1.2s ease-out 1}
@media (prefers-reduced-motion:reduce){ :root.st-esc #stForm .st-capsula.st-pulso{animation:none} }
/* C4: actividad y siguiente paso en Resumen */
:root.st-esc #pResumen .st-h3{margin-top:24px}
.st-rs-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px}
.st-rs-kpis>div{display:flex;flex-direction:column;padding:10px 12px;border:1px solid var(--line);border-radius:10px}
.st-rs-kpis b{font:700 18px var(--body)}
.st-rs-kpis span{font-size:13px;color:var(--muted)}
.st-rs-vacio{display:flex;gap:10px;align-items:flex-start;margin:0;padding:12px;border:1px dashed var(--line);border-radius:10px;font-size:14px;color:var(--muted)}
.st-rs-vacio .ico{flex:none;margin-top:2px}
.st .st-filab.st-sig{min-height:56px;text-decoration:none}
.st-sig-ic{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;flex:none;border-radius:9px;background:var(--accent-soft);color:var(--accent)}
.st-sig-c{display:flex;flex-direction:column;min-width:0}
.st-sig-c b{font:600 14px var(--body)}
.st-sig-c small{font-size:13px;color:var(--muted)}
.st-rs-lista{margin:0;padding-left:18px;font-size:14px;line-height:1.6}
/* C8: con varias líneas el texto ocupa su fila y los íconos bajan a la suya; «Entendí» sin cortar */
:root.st-esc #stForm .st-capsula.multi textarea{order:1;flex:0 0 100%;padding:6px 10px 2px}
:root.st-esc #stForm .st-capsula.multi .st-comp{order:2}
:root.st-esc #stForm .st-capsula.multi #btnVoz{order:3;margin-left:auto}
:root.st-esc #stForm .st-capsula.multi .st-candado,:root.st-esc #stForm .st-capsula.multi .st-enviar{order:4}
:root.st-esc #stForm .st-entendi{flex-wrap:wrap}
:root.st-esc #stForm .st-ent-lista{flex-wrap:wrap;overflow:visible}
:root.st-esc #stForm .st-ent{max-width:none}
:root.st-esc #stForm .st-ent>span:last-child{overflow:visible;text-overflow:clip;white-space:normal}
/* C9: paleta con grupos, íconos y coincidencia */
.st-pal-g{min-height:0!important;padding:10px 10px 4px!important;font:600 12px var(--body);color:var(--muted);cursor:default!important}
.st-pal-ic{display:inline-flex;color:var(--muted)}
:root.st-esc .st-paleta-l li[aria-selected="true"] .st-pal-ic{color:var(--accent)}
:root.st-esc .st-paleta-l mark{background:color-mix(in srgb,var(--accent) 22%,transparent);color:inherit;border-radius:3px;padding:0 1px}
.st-pal-act{font:600 11px var(--body)!important;color:var(--accent)!important;border:1px solid color-mix(in srgb,var(--accent) 40%,var(--line));border-radius:999px;padding:1px 8px}
/* E10 + C5: Inicio */
:root.st-esc .si-c-esc{padding-top:28px}
:root.st-esc .si-c-esc .si-idea{margin-top:16px}
:root.st-esc .si-c-esc .si-sub{margin-top:8px}
.si-tusapps{margin-top:20px}
.si-app-mini{height:116px}
.si-app-if{top:8px;transform:translateX(-50%) scale(.3)}
.si-app-cont{position:static;width:auto;height:28px;gap:4px;padding:0 8px;margin:0 14px 12px;font:500 12.5px var(--body);border:1px solid var(--line);border-radius:999px}
.si-app-cont .ico{flex:none}
.si-app{flex-direction:column}
.si-app-vence{position:absolute;top:8px;right:8px;padding:2px 8px;border-radius:999px;background:color-mix(in srgb,var(--bg) 82%,transparent);border:1px solid var(--line);font:500 12px var(--body);color:var(--muted)}
:root.st-esc .si-app{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden}
:root.st-esc .si-app .si-app-b{border:0;border-radius:0;flex:1}
:root.st-esc .si-app.si-app-nueva{border-style:dashed;background:transparent}
:root.st-esc .si-app-b:hover{transform:none;box-shadow:none}
:root.st-esc .si-app:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
@media (min-width:1600px){
  :root.st-esc .si-c-esc{max-width:1120px}
  :root.st-esc .si-c-esc .si-hero,:root.st-esc .si-c-esc .si-idea,:root.st-esc .si-c-esc .si-sub,:root.st-esc .si-c-esc .si-ejs,:root.st-esc .si-c-esc .si-explorar{max-width:880px}
}
.si-parati{margin-top:28px}
.si-pts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));gap:16px}
.si-pt{display:flex;flex-direction:column;align-items:flex-start;gap:12px;width:100%;height:100%;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--ink);text-align:left;cursor:pointer}
.si-pt:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
.si-pt:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.si-pt-tile{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;background:var(--accent-soft);color:var(--accent)}
.si-pt-c{display:flex;flex-direction:column;gap:2px}
.si-pt-c b{font:600 15px var(--body)}
.si-pt-c span{font-size:13px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* C6: puerta con la promesa como titular, la marca como antetítulo y los 3 pasos */
.st-puerta-k{margin:0 0 10px;font:600 14px var(--body);color:var(--accent);letter-spacing:.02em}
:root.st-esc .st-puerta{grid-template-columns:minmax(0,600px) auto;justify-content:center;gap:clamp(48px,6vw,112px)}
:root.st-esc .st-puerta-c{justify-self:stretch}
:root.st-esc .st-puerta-c h1{font-size:clamp(40px,4vw,68px);line-height:1.02}
.st-puerta-pasos{list-style:none;margin:28px 0 0;padding:16px 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.st-puerta-pasos li{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--muted)}
.st-puerta-pasos b{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;flex:none;border-radius:50%;background:var(--accent-soft);color:var(--accent);font:700 13px var(--body)}
.st-puerta-pasos strong{color:var(--ink);font-weight:600}
:root.st-esc .st-puerta-pie{margin-top:24px}
/* E6: menú de migas */
.st-miga-menu{min-width:240px}
/* Revisión propia ronda 5: a 1280 × 800 la fila de apps entra completa sobre el pliegue */
:root.st-esc .si-c-esc .si-h1{font-size:clamp(34px,min(4.4vw,6.4vh),56px)}
.si-app-mini{height:104px}
.si-app-cont{position:absolute;right:10px;bottom:12px;margin:0}
:root.st-esc .si-app-c{padding-right:96px}
.st-puerta-pie{margin-top:28px!important}
/* Tarjetas de «Tus apps»: «Contenido» arriba a la izquierda y «Vence» arriba a la derecha, sobre la miniatura; el nombre completo abajo */
:root.st-esc .si-app-c{padding-right:14px}
.si-app-cont{top:8px;left:8px;right:auto;bottom:auto;background:color-mix(in srgb,var(--bg) 82%,transparent)}
/* Plan: cada opción en su línea también con el Inspector ancho (1920) */
:root.st-esc .st-frase .st-hueco-w::after{content:"";display:block}

/* ================= Ronda 6 del juez (3-nov-2026): pulido y densidad ================= */
/* 1. Puerta: titular en dos líneas fijas; texto y celular centrados sin aire muerto */
.st-h1-l{display:block;white-space:nowrap}
:root.st-esc .st-puerta-c h1{font-size:clamp(40px,3.3vw,64px)}
:root.st-esc .st-puerta{align-content:center;padding-top:24px;padding-bottom:24px}
:root.st-esc .st-puerta-tel{height:min(780px,calc(100dvh - 170px))}
/* 2–3. Inicio: una sola columna (un borde derecho), tarjetas con miniatura a sangre 16:10 y pie con estado, vencimiento y «Contenido» */
:root.st-esc .si-c-esc{max-width:960px}
:root.st-esc .si-c-esc .si-hero,:root.st-esc .si-c-esc .si-idea,:root.st-esc .si-c-esc .si-sub,:root.st-esc .si-c-esc .si-ejs,:root.st-esc .si-c-esc .si-explorar{max-width:none}
@media (max-width:1100px){ :root.st-esc .si-c-esc{max-width:880px} }
:root.st-esc .si-apps{grid-template-columns:repeat(var(--si-n,4),minmax(0,1fr))}
:root.st-esc .si-pts{grid-template-columns:repeat(4,minmax(0,1fr))}
.si-app-mini{height:auto;aspect-ratio:16/10;display:block;padding:0;background:var(--surface)}
.si-app-if{top:0;left:0;width:390px;height:844px;border-radius:0;box-shadow:none;transform:scale(var(--st-km,.55));transform-origin:0 0}
.si-app-ic{height:100%}
.si-app-pie{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 14px 12px}
.si-app-cont{position:static;margin:0;top:auto;left:auto}
.si-app-vence{position:static;padding:0;border:0;background:none;font:500 13px var(--body);color:var(--muted)}
.si-app-vence.pronto{color:var(--warn)}
.si-app-nueva .si-app-mini{aspect-ratio:16/10;display:flex;align-items:center;justify-content:center}
.si-app-nueva .si-app-c span{text-wrap:balance}
/* 4. Inspector: tres niveles — título 15/600 con 24 px de aire, etiqueta 13 tenue, dato 14; nada por debajo de 12 px */
:root.st-esc .st-der .st-h3,:root.st-esc .st-der .st-panel>summary,:root.st-esc .st-plan-l{font:600 15px/1.3 var(--body);color:var(--ink);margin:24px 0 10px;letter-spacing:0;text-transform:none}
:root.st-esc .st-der .st-panel-c>.st-h3:first-child,:root.st-esc #pResumen>.st-rs-est+.st-h3{margin-top:16px}
:root.st-esc .st-der .st-panel>summary{margin-top:0}
:root.st-esc .st-der .st-fila>span:first-child{font-size:13px;color:var(--muted)}
:root.st-esc .st-der .st-fila>:last-child{font-size:14px;color:var(--ink)}
:root.st-esc .st-estado,:root.st-esc .st-der .st-estado{font-size:12px}
:root.st-esc kbd{font-size:12px}
:root.st-esc .st-top-der #btnCuenta .nom,:root.st-esc .st-top-der #btnCuenta{font-size:13px}
/* 5. Historial vacío centrado en el alto; QR del enlace en Resumen y Publicar */
:root.st-esc .st-der[data-itab="historial"] #pVersiones{flex:1 1 auto;display:flex!important;flex-direction:column}
:root.st-esc #pVersiones .st-panel-c{flex:1 1 auto;display:flex;flex-direction:column}
:root.st-esc .st-vacio-h{flex:1 1 auto;justify-content:center}
.st-rs-qr{display:flex;align-items:center;gap:14px;padding:12px;border:1px solid var(--line);border-radius:12px}
.st-rs-qr img{width:112px;height:112px;flex:none;background:#fff;padding:6px;border-radius:8px}
.st-rs-qr span{font-size:13px;color:var(--muted)}
:root.st-esc #stPublicacion .st-qr{justify-content:flex-start;background:none;padding:0;margin:12px 0 0}
:root.st-esc #stPublicacion .st-qr img{width:112px;height:112px;background:#fff;padding:6px;border-radius:8px}
/* 6. Celular más grande: barra de estado de 20 px y bisel de 8; compositor de 2 líneas como máximo; «Entendí» y «Ajustar» en una fila */
:root.st-esc .st-marco.movil{border-width:20px 8px 8px;width:calc(390px * var(--st-k,.8) + 16px);height:calc(844px * var(--st-k,.8) + 28px);clip-path:inset(0 round 40px);border-radius:40px}
:root.st-esc .st-marco.movil::before{top:-14px;width:64px;height:8px}
:root.st-esc .st-lienzo{padding-top:8px}
:root.st-esc #stForm{bottom:16px}
:root.st-esc #stForm .st-capsula.multi textarea{max-height:52px;overflow-y:auto}
:root.st-esc #stForm .st-capsula.multi{padding:6px 8px}
:root.st-esc #stForm .st-entendi{flex-wrap:nowrap;align-items:center;margin-top:6px}
:root.st-esc #stForm .st-ent-lista{flex:0 1 auto;min-width:0;flex-wrap:nowrap;overflow:hidden}
:root.st-esc #stForm .st-ent{max-width:240px;min-width:0}
:root.st-esc #stForm .st-ent>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root.st-esc #stForm .st-entendi.abierta,:root.st-esc #stForm .st-entendi.abierta .st-ent-lista{flex-wrap:wrap}
:root.st-esc #stForm .st-entendi.abierta .st-ent{max-width:none}
:root.st-esc .st-ent-aj{flex:none;min-height:30px;padding:0 4px;color:var(--accent);font:600 13px var(--body);text-decoration:none}
:root.st-esc .st-ent-aj:hover{text-decoration:underline;text-underline-offset:3px}
/* 8. Ficha del plan: el precio como cifra protagonista y la nota de la cuenta como insignia */
.st-precio-g{display:flex;align-items:baseline;gap:6px;margin:2px 0 6px;font:var(--w-tit) 30px/1.1 var(--display);color:var(--ink);letter-spacing:-.02em}
.st-precio-g>span:not(.st-info){font:500 14px var(--body);color:var(--muted);letter-spacing:0}
.st-precio-g[title]{cursor:help}
.st-precio-ins{margin:0 0 8px}
.st-ins-ok{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;background:color-mix(in srgb,var(--ok) 14%,transparent);color:color-mix(in srgb,var(--ok) 70%,var(--ink));font:600 13px var(--body)}
/* 10. Calidad con un solo veredicto */
.st-aprob{display:inline-flex;align-items:center;gap:4px;margin-left:6px;padding:1px 8px;border-radius:999px;background:color-mix(in srgb,var(--ok) 14%,transparent);color:color-mix(in srgb,var(--ok) 70%,var(--ink));font:600 12px var(--body)}
/* 11. Plantillas: un solo lenguaje de tarjeta, proyectos grandes como fila destacada, nombres en 600 */
.st-pls #stPlantillas>.st-densos{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px}
.st-pls #stPlantillas>.st-densos>.st-cat-t,.st-pls #stPlantillas>.st-densos>.st-mas{grid-column:1/-1}
.st-pls .st-denso{margin:0;border-radius:12px;padding:12px 120px 12px 14px;background:var(--surface)}
.st-pls .st-chips-m{flex-wrap:nowrap;overflow:hidden}
.st-pls .st-chip-m{white-space:nowrap}
.st-pls .st-plantilla>span:last-child>span:first-child,.st-pls .st-denso-t>span:first-child{font-weight:600}
.st-pls .st-plantilla{border:1px solid transparent;border-radius:12px}
.st-pls .st-plantilla:hover{border-color:var(--line);background:var(--st-s1)}
:root.st-esc dialog.st-pls::backdrop,:root.st-esc #dlgImportar::backdrop{background:rgba(15,14,31,.52)}
/* 12. Diseño: muestras de 16 px con borde (visibles en oscuro), color a ancho completo, segmento activo claro */
:root.st-esc .st-arq .sw i{width:16px;height:16px;border-radius:4px;border:1px solid color-mix(in srgb,var(--ink) 25%,transparent)}
.st-color-e{width:100%;box-sizing:border-box}
.st-color-e .st-lapiz{margin-left:auto}
/* 13. Dos alturas de botón: 36 px en el panel y 44 px la acción principal */
:root.st-esc .st-der .st-btn,:root.st-esc #pResumen .st-btn,:root.st-esc .st-der .st-btn.ancho,:root.st-esc .st-der a.st-btn{min-height:36px;padding-top:6px;padding-bottom:6px}
:root.st-esc .st-der [data-construir],:root.st-esc .st-der a.st-btn.primario[href="/recarga"]{min-height:44px}
:root.st-esc .st-top-der .st-btn,:root.st-esc .st-publicar,:root.st-esc #btnMas,:root.st-esc .st-top-der #btnCuenta{min-height:36px;height:36px}
/* 14. Paleta: grupos visibles sin desplazar */
:root.st-esc .st-paleta-l{max-height:min(62vh,560px)}
.st-pal-sub{font:600 16px var(--body)!important;color:var(--muted)}
/* 15. Componentes unificados: subrayado recto, un control segmentado, deshabilitado gris neutro, separadores del menú */
:root.st-esc .st-itabs [role="tab"][aria-selected="true"]::after{border-radius:0}
:root.st-esc .st-imp-tabs button{border-bottom:0;position:relative}
:root.st-esc .st-imp-tabs button[aria-selected="true"]::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:2px;background:var(--st-pri,var(--accent))}
:root.st-esc .st-seg,:root.st-esc .st-top-der .st-masop-menu .idioma{display:inline-flex;gap:2px;width:auto;padding:2px;border:1px solid var(--line);border-radius:10px;background:var(--st-s1);overflow:visible}
:root.st-esc .st-top-der .st-masop-menu .idioma{display:grid}
:root.st-esc .st-seg{display:flex;width:100%}
.st-pls #stTamano.st-seg{width:fit-content}
:root.st-esc .st-seg button,:root.st-esc .st-top-der .st-masop-menu .idioma button{flex:1 1 0;min-height:32px;border:0;border-radius:8px;background:transparent;color:var(--muted);font:500 13px var(--body)}
:root.st-esc .st-seg button+button{border-left:0}
:root.st-esc .st-seg button[aria-pressed="true"],:root.st-esc .st-top-der .st-masop-menu .idioma button[aria-pressed="true"]{background:var(--surface);color:var(--ink);font-weight:600;box-shadow:0 1px 2px rgba(15,14,31,.12),0 0 0 1px var(--line)}
:root.st-esc[data-theme="dark"] .st-seg button[aria-pressed="true"],:root.st-esc[data-theme="dark"] .st-top-der .st-masop-menu .idioma button[aria-pressed="true"]{background:color-mix(in srgb,#fff 12%,var(--surface))}
:root.st-esc .st-btn[disabled],:root.st-esc .st-btn.primario[disabled],:root.st-esc #dlgImportar #btnImpSubir:disabled{opacity:1;background:var(--st-s2);border-color:var(--line);color:var(--muted);cursor:not-allowed}
:root.st-esc .st-masop-menu>.st-masop-saldo,:root.st-esc .st-masop-menu .st-masop-vista,:root.st-esc .st-masop-menu .st-masop-falla{border:0;margin:0}
:root.st-esc .st-masop-menu .st-masop-vista,:root.st-esc .st-masop-menu #stMasTema,:root.st-esc .st-masop-menu .st-masop-falla{border-top:1px solid var(--line);margin-top:4px;padding-top:4px}
:root.st-esc .st-masop-menu #stMasTema,:root.st-esc .st-masop-menu .st-masop-falla{border-radius:0}
:root.st-esc .st-masop-menu>.st-masop-saldo{border-bottom:1px solid var(--line);margin:0 0 4px;padding:6px 10px 8px}
/* 16. Menús y velos en oscuro */
:root.st-esc[data-theme="dark"] .st-masop-menu,:root.st-esc[data-theme="dark"] .st-miga-menu{box-shadow:0 24px 60px -10px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.08)}
.st-miga-menu{top:56px}
:root.st-esc[data-theme="dark"] #dlgPaleta::backdrop{background:rgba(0,0,0,.45)}
:root.st-esc .st-paleta-l mark{background:color-mix(in srgb,var(--accent) 40%,transparent);color:var(--ink);font-weight:700}
/* 17. Panel Proyecto con pocas apps: plan y plantillas para empezar otra */
.st-lat-extra{margin-top:16px;display:flex;flex-direction:column;gap:6px}
.st-lat-plan{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;font-size:13px}
.st-lat-plan b{font-weight:600}
.st-lat-plan a{color:var(--accent);font-weight:600;text-decoration:none;white-space:nowrap}
.st-lat-pls{display:flex;flex-direction:column;gap:2px}
:root.st-esc.st-plegado .st-lat-extra{display:none}
/* 18. Detalles: atajos de María a ancho completo; marco del celular casi negro en oscuro; aire bajo Importar */
:root.st-esc .st-body .sop-panel .sop-rapidas{display:flex;flex-direction:column;align-items:stretch;gap:6px}
:root.st-esc .st-body .sop-panel .sop-rapidas button{width:100%;text-align:left;justify-content:flex-start;border-radius:12px;white-space:normal}
:root.st-esc[data-theme="dark"] .st-marco.movil,:root.st-esc[data-theme="dark"] .st-puerta-tel{border-color:#0B0B0F;background:#0B0B0F;box-shadow:0 0 0 1px rgba(255,255,255,.14),0 30px 70px -24px rgba(0,0,0,.7)}
:root.st-esc #dlgImportar .st-imp-c{padding-bottom:28px}
/* Revisión propia ronda 6: QR siempre visible en Publicar (sin el botón que lo abría), marco del celular con borde visible en oscuro */
:root.st-esc #stPublicacion [data-qr]{display:none}
:root.st-esc #stPublicacion .st-qr:not([hidden]){display:flex;align-items:center;gap:14px;padding:12px;border:1px solid var(--line);border-radius:12px}
:root.st-esc #stPublicacion .st-qr span{font-size:13px;color:var(--muted)}
:root.st-esc[data-theme="dark"] .st-marco.movil,:root.st-esc[data-theme="dark"] .st-puerta-tel{box-shadow:0 0 0 1px rgba(255,255,255,.22),0 30px 70px -24px rgba(0,0,0,.7)}
:root.st-esc .st-recibo .st-plan-l{margin-top:0}

/* ================= Ronda 7 del juez (3-nov-2026): cero errores visibles, coherencia y oscuro ================= */
/* 1. Miniatura de «Tus apps»: la app en su ancho de escritorio (el héroe entra completo) y el borde inferior se desvanece en lugar de partir letras */
.si-app-if{width:760px;height:475px;transform:scale(var(--st-km2,.4));transform-origin:0 0}
.si-app-mini::after{content:"";position:absolute;left:0;right:0;bottom:0;height:34%;background:linear-gradient(to bottom,transparent,var(--surface));pointer-events:none}
/* 3. Compositor de varias líneas: crece hasta ~6 líneas y luego se desplaza por dentro */
:root.st-esc #stForm .st-capsula.multi textarea{max-height:148px;overflow-y:auto}
/* 4. Celular en oscuro: bisel grafito con borde claro de 1 px */
:root.st-esc[data-theme="dark"] .st-marco.movil,:root.st-esc[data-theme="dark"] .st-puerta-tel{border-color:#2B2B31;background:#2B2B31;box-shadow:0 0 0 1px rgba(255,255,255,.28),0 30px 70px -24px rgba(0,0,0,.75)}
/* 5. Paleta: filas compactas y más alto disponible */
:root.st-esc .st-paleta{margin-top:8vh}
:root.st-esc .st-paleta-l{max-height:calc(100dvh - 8vh - 150px)}
:root.st-esc .st-paleta-l li{min-height:32px;padding:6px 10px}
:root.st-esc .st-pal-g{padding:8px 10px 2px!important}
/* 6. Historial vacío centrado en el alto del panel (el <details> no admite flex: el vacío ocupa el alto disponible) */
:root.st-esc .st-vacio-h{min-height:calc(100dvh - 48px - 44px - 64px);justify-content:center;padding:0 12px}
/* 7. «Compartir» igual en todas las pestañas */
:root.st-esc.st-tab-pub .st-publicar:not([disabled]){background:var(--st-pri);border-color:var(--st-pri);color:var(--st-pri-ink)}
/* 8. Precio: «Hoy gratis con tu cuenta» como dato principal y el de lista en una línea secundaria */
.st-precio-desp{margin:-2px 0 8px;font-size:13px;color:var(--muted)}
.st-precio-desp span:last-child{font-weight:600;color:var(--ink)}
/* 9. Importar: el modal cabe en el alto y su nota tiene aire */
:root.st-esc #dlgImportar[open]{max-height:calc(100dvh - 104px);display:flex;flex-direction:column;margin-top:56px}
:root.st-esc #dlgImportar .st-imp-c{flex:1 1 auto;min-height:0;overflow:auto;max-height:none;padding-bottom:28px}
/* 10. Inspector desplazado: sombra bajo las pestañas fijas */
:root.st-esc .st-der>.st-col-cab{position:relative;z-index:2;transition:box-shadow .2s}
:root.st-esc .st-der.st-desplazado>.st-col-cab{box-shadow:0 8px 16px -10px rgba(15,14,31,.35)}
:root.st-esc[data-theme="dark"] .st-der.st-desplazado>.st-col-cab{box-shadow:0 8px 18px -8px rgba(0,0,0,.8)}
/* 11. Plantillas: sin píldoras de módulos, desvanecido abajo más largo, íconos en oscuro con un mismo tono base */
.st-pls .st-denso{padding-right:14px}
.st-pls .st-denso-t{padding-right:120px}
.st-pls-c{-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 56px),transparent)}
:root.st-esc[data-theme="dark"] .st-pls .st-cat .st-plantilla>span:first-child{background:color-mix(in srgb,#fff 8%,var(--surface));color:#C4B5FD}
/* 13. Oscuro con tres superficies: lienzo, paneles, modales y menús */
:root.st-esc[data-theme="dark"] header.st-top{background:#121216}
:root.st-esc[data-theme="dark"] .st-izq,:root.st-esc[data-theme="dark"] .st-der,:root.st-esc[data-theme="dark"] .st-body .sop-panel{background:#121216}
:root.st-esc[data-theme="dark"] .st-centro{background:#0B0B0F}
:root.st-esc[data-theme="dark"] dialog,:root.st-esc[data-theme="dark"] .st-masop-menu,:root.st-esc[data-theme="dark"] .st-miga-menu{background:#1C1C21;border-color:rgba(255,255,255,.12)}
:root.st-esc[data-theme="dark"] .st-rs-qr img,:root.st-esc[data-theme="dark"] #stPublicacion .st-qr img{background:#ECECF0;padding:8px;border-radius:10px;box-shadow:0 0 0 6px #1C1C21,0 0 0 7px rgba(255,255,255,.12)}
/* 14. María: chips neutros como en el resto, un solo cuerpo de texto, cabecera sin franja */
:root.st-esc .st-body .sop-panel .sop-cab{background:transparent}
:root.st-esc .st-body .sop-panel .sop-rapidas button{border:1px solid var(--line);background:transparent;color:var(--ink);font:500 14px var(--body)}
:root.st-esc .st-body .sop-panel .sop-rapidas button:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line));background:var(--st-s1)}
:root.st-esc .st-body .sop-panel .sop-log{font-size:14px}
:root.st-esc .st-body .sop-panel .sop-log *{font-size:inherit}
/* 15. Resumen: tarjeta principal, siguiente paso y lo demás discreto; «Para empezar otra» más tenue */
.st-rs-card{display:flex;flex-direction:column;gap:12px;padding:14px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
:root.st-esc[data-theme="dark"] .st-rs-card{background:color-mix(in srgb,#fff 4%,var(--surface))}
.st-rs-card .st-rs-est{margin:0}
.st-rs-card .st-sello-fila{margin:0!important;border:0;padding:0;background:none}
:root.st-esc #pResumen .st-rs-kpis div,:root.st-esc #pResumen .st-rs-vacio{padding:8px 10px;font-size:13px}
:root.st-esc #pResumen .st-rs-qr img{width:84px;height:84px}
:root.st-esc #pResumen .st-rs-qr{border:0;padding:0}
.st-lat-extra .st-h3{color:var(--muted)!important;font-size:12px!important;font-weight:600}
.st-lat-pls .st-app{color:var(--muted);font-size:13px}
/* 16. Textos de ayuda a 13 px con más contraste */
:root.st-esc .st-body .sop-panel .sop-ayuda-in{font-size:13px;color:color-mix(in srgb,var(--ink) 70%,var(--muted))}
.st-umbral{color:color-mix(in srgb,var(--ink) 65%,var(--muted))}
/* 17. «Vista» en el menú ⋯ como control segmentado compacto */
.st-masop-vista{display:flex!important;flex-wrap:wrap;align-items:center;gap:2px;margin:4px 6px;padding:6px 0 4px}
.st-masop-vista .st-masop-k{flex:0 0 100%;padding:0 6px 4px}
.st-masop-vista [role="radio"]{flex:1 1 0;justify-content:center;min-height:30px;padding:0 4px;border-radius:8px;font:500 12.5px var(--body);color:var(--muted);background:var(--st-s1)}
.st-masop-vista [role="radio"]::before{display:none}
.st-masop-vista [role="radio"][aria-checked="true"]{background:var(--surface);color:var(--ink);font-weight:600;box-shadow:0 0 0 1px var(--line)}
/* 18. Lienzo a 1280: el carril y los márgenes más finos para que el celular gane alto */
:root.st-esc .st-centro>.st-col-cab{height:36px}
:root.st-esc .st-lienzo{padding-top:4px}
/* 19. Inicio: «Nueva app» compacta; a 1920 la cabecera alineada con la columna */
:root.st-esc .si-app.si-app-nueva{align-self:start}
:root.st-esc .si-app-nueva .si-app-mini{aspect-ratio:auto;height:72px;border-bottom:0}
:root.st-esc .si-app-nueva .si-app-mini::after{display:none}
:root.st-esc .si-app-nueva .si-app-c{padding-top:0}
:root.st-esc.st-en-inicio header.st-top{padding-left:max(16px,calc((100vw - 960px) / 2));padding-right:max(12px,calc((100vw - 960px) / 2))}
/* 20. Puerta a 1920: celular más grande */
:root.st-esc .st-puerta-tel{height:min(900px,calc(100dvh - 150px))}
/* 21. Diseño: foto de portada actual y ejemplo del consultor */
.st-foto-act{display:flex;align-items:center;gap:12px;margin:0 0 10px}
.st-foto-act img{width:72px;height:54px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.st-foto-act b{display:block;font:600 14px var(--body)}
.st-foto-act small{font-size:13px;color:var(--muted)}
.st-cons-ej{margin:0 0 10px;padding:10px 12px;border:1px dashed var(--line);border-radius:10px;font-size:13px;color:var(--muted)}
.st-cons-ej i{font-style:normal;color:var(--ink)}
/* 22. «Entendí»: las fichas envuelven en lugar de cortarse */
:root.st-esc #stForm .st-entendi{flex-wrap:wrap;row-gap:6px}
:root.st-esc #stForm .st-ent-lista{flex-wrap:wrap;overflow:visible}
:root.st-esc #stForm .st-ent{max-width:none}
:root.st-esc #stForm .st-ent>span:last-child{white-space:normal;overflow:visible;text-overflow:clip}
/* Vista en el menú ⋯: 4 celdas iguales dentro del ancho del menú */
.st-masop-vista{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));margin:4px 6px;padding:6px 0 4px}
.st-masop-vista .st-masop-k{grid-column:1/-1}
.st-masop-vista [role="radio"]{min-width:0;padding:0 2px;font-size:12px;overflow:hidden;text-overflow:ellipsis}
:root.st-esc #pResumen .st-rs-qr{padding-left:8px}

/* ================= Ronda 8 del juez (3-nov-2026): jerarquía, densidad y un solo componente por cosa ================= */
/* 1. Un solo violeta lleno por vista: «+ Nueva app» secundario; el enviar del compositor neutro hasta que haya texto */
:root.st-esc .st-nueva{background:transparent;border:1px solid var(--line);color:var(--ink)}
:root.st-esc .st-nueva:hover:not([disabled]){background:var(--st-s2);border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}
:root.st-esc #stForm:has(textarea:placeholder-shown) .st-enviar{background:var(--st-s2);border-color:var(--line);color:var(--muted)}
/* 2. Pestañas: inactivas con más contraste y aire; la activa en 700 con subrayado */
:root.st-esc .st-itabs{gap:6px}
:root.st-esc .st-itabs [role="tab"]{color:color-mix(in srgb,var(--ink) 72%,var(--muted));padding:0 8px}
:root.st-esc .st-itabs [role="tab"][aria-selected="true"]{color:var(--ink);font-weight:700}
:root.st-esc .st-itabs [role="tab"][aria-selected="true"]::after{left:8px;right:8px;height:2.5px}
/* 3. Rótulos de sección a 12,5 px 600 con más contraste; a partir de 1800 px el cromo un punto mayor */
:root.st-esc .st-col-cab h2,:root.st-esc .st-izq .st-h3,.st-lat-extra .st-h3,:root.st-esc .st-masop-k{font:600 12.5px var(--body)!important;letter-spacing:.01em;color:color-mix(in srgb,var(--ink) 80%,var(--muted))!important;text-transform:none}
@media (min-width:1800px){
  :root.st-esc .st-itabs [role="tab"]{font-size:15px}
  :root.st-esc .st-app,:root.st-esc .st-explorar{font-size:14.5px}
  :root.st-esc .st-col-cab h2,:root.st-esc .st-izq .st-h3{font-size:13.5px!important}
}
/* 4. Columna izquierda más angosta a 1280–1439 (el lienzo gana el ancho) */
@media (max-width:1439px){ :root.st-esc .st{--st-izq:208px} }
/* 5. «Entendí» en una sola fila (2 fichas + «+N», «Ajustar» a la derecha); atajos del menú + en una fila con desplazamiento */
:root.st-esc #stForm .st-entendi{flex-wrap:nowrap}
:root.st-esc #stForm .st-ent-lista{flex:1 1 auto;flex-wrap:nowrap;overflow:hidden}
:root.st-esc #stForm .st-ent{max-width:200px;min-width:0}
:root.st-esc #stForm .st-ent>span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root.st-esc #stForm .st-ent-aj{margin-left:auto}
:root.st-esc #stForm .st-entendi.abierta,:root.st-esc #stForm .st-entendi.abierta .st-ent-lista{flex-wrap:wrap}
:root.st-esc #stForm .st-capsula>.st-comp-menu{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
:root.st-esc #stForm .st-capsula>.st-comp-menu::-webkit-scrollbar{display:none}
:root.st-esc #stForm .st-capsula>.st-comp-menu button{flex:none;white-space:nowrap}
/* El compositor de varias líneas se recoge a una línea cuando no tiene el foco (el celular conserva su alto) */
:root.st-esc #stForm:not(:focus-within) .st-capsula.multi textarea{max-height:40px;overflow:hidden}
/* 6. Inicio: tarjetas de igual alto, acción pequeña con ícono y metadatos */
:root.st-esc .si-apps{align-items:stretch}
:root.st-esc .si-app.si-app-nueva{align-self:stretch}
:root.st-esc .si-app-nueva .si-app-b{height:100%;justify-content:center}
.si-app-meta{font-size:13px;color:var(--muted)}
.si-app-cont{width:32px;height:32px;padding:0;justify-content:center;border-radius:8px}
/* 7. Un solo control segmentado: pista, alto y relleno iguales (Vista, Idioma, Tema de la app, filtros de plantillas) */
:root.st-esc .st-seg,:root.st-esc .st-top-der .st-masop-menu .idioma,:root.st-esc .st-masop-vista{display:grid!important;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:2px;padding:3px;margin:0;border:1px solid var(--line);border-radius:10px;background:var(--st-s1);box-sizing:border-box}
:root.st-esc .st-seg button,:root.st-esc .st-top-der .st-masop-menu .idioma button,:root.st-esc .st-masop-vista [role="radio"]{min-height:30px;height:30px;padding:0 8px;border:0;border-radius:7px;background:transparent;color:var(--muted);font:500 13px var(--body);box-shadow:none;white-space:nowrap}
:root.st-esc .st-seg button[aria-pressed="true"],:root.st-esc .st-top-der .st-masop-menu .idioma button[aria-pressed="true"],:root.st-esc .st-masop-vista [role="radio"][aria-checked="true"]{background:var(--surface);color:var(--ink);font-weight:600;box-shadow:0 1px 2px rgba(15,14,31,.14),0 0 0 1px var(--line)}
:root.st-esc[data-theme="dark"] .st-seg button[aria-pressed="true"],:root.st-esc[data-theme="dark"] .st-top-der .st-masop-menu .idioma button[aria-pressed="true"],:root.st-esc[data-theme="dark"] .st-masop-vista [role="radio"][aria-checked="true"]{background:color-mix(in srgb,#fff 12%,var(--surface))}
:root.st-esc .st-masop-vista{margin:2px 10px 6px;grid-template-columns:none}
:root.st-esc .st-masop-vista .st-masop-k{display:none}
:root.st-esc .st-masop-vista::before{content:none}
:root.st-esc .st-top-der .st-masop-menu .idioma{margin:2px 10px 6px}
:root.st-esc .st-masop-k{margin:6px 12px 4px;padding:0}
.st-masop-vista-t{display:block}
.st-pls #stTamano.st-seg{width:min(560px,100%)}
.st-pls #stBuscarPl{width:min(560px,100%);max-width:none}
/* 8. Un solo componente de enlace: campo + Copiar + abrir */
:root.st-esc .st-enlace-e{display:flex;align-items:center;gap:6px}
:root.st-esc .st-enlace-e code{flex:1 1 auto;min-height:36px}
:root.st-esc .st-enlace-e .st-btn{flex:none;min-height:36px;height:36px;background:transparent;border:1px solid var(--line);color:var(--ink)}
:root.st-esc .st-enlace-e .st-ic{flex:none}
:root.st-esc #stPublicacion .st-qr:not([hidden]){margin-top:12px}
/* 9. Una sola insignia: tamaño, radio y relleno iguales */
:root.st-esc .st-estado,:root.st-esc .si-app-est,.st-aprob,.st-pal-act,:root.st-esc .st-sugerido,.st-ins-ok,:root.st-esc .st-insignia{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 9px;border-radius:999px;font:600 12px/1 var(--body)!important;box-sizing:border-box;white-space:nowrap}
.st-ins-ok{height:26px}
/* 10. Paleta: alto en filas completas, desvanecido sobre el pie */
:root.st-esc .st-paleta-l li[role="option"]{min-height:36px;height:36px;box-sizing:border-box}
:root.st-esc .st-paleta-l{max-height:min(calc(36px * 13 + 8px),calc(100dvh - 8vh - 150px));-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent);padding-bottom:20px}
/* 11. Plantillas: tinte por categoría también en oscuro, insignia con el mismo margen del título, «Ver los proyectos grandes» como enlace junto al título */
:root.st-esc[data-theme="dark"] .st-pls .st-cat .st-plantilla>span:first-child{background:color-mix(in srgb,var(--accent) 22%,var(--surface));color:#DDD6FE}
:root.st-esc[data-theme="dark"] .st-pls .st-cat:nth-child(5n+2) .st-plantilla>span:first-child{background:color-mix(in srgb,#0EA5E9 22%,var(--surface));color:#BAE6FD}
:root.st-esc[data-theme="dark"] .st-pls .st-cat:nth-child(5n+3) .st-plantilla>span:first-child{background:color-mix(in srgb,#16A34A 22%,var(--surface));color:#BBF7D0}
:root.st-esc[data-theme="dark"] .st-pls .st-cat:nth-child(5n+4) .st-plantilla>span:first-child{background:color-mix(in srgb,#F59E0B 22%,var(--surface));color:#FDE68A}
:root.st-esc[data-theme="dark"] .st-pls .st-cat:nth-child(5n) .st-plantilla>span:first-child{background:color-mix(in srgb,#EC4899 22%,var(--surface));color:#FBCFE8}
.st-pls .st-denso{padding:14px 16px}
.st-pls .st-denso-t .st-sugerido{top:14px;right:16px}
.st-pls #stPlantillas>.st-densos>.st-cat-t{grid-column:1/2;grid-row:1}
.st-pls #stPlantillas>.st-densos>.st-mas{grid-column:2/3;grid-row:1;justify-self:end;width:auto;min-height:28px;margin:0;padding:0;border:0;background:none;color:var(--accent);font:600 13px var(--body)}
.st-pls #stPlantillas>.st-densos>.st-mas:hover{text-decoration:underline}
.st-pls-c{box-shadow:inset 0 -18px 18px -18px rgba(15,14,31,.35)}
/* 12. Resumen: la fila del sello igual en claro y oscuro, con aire a la derecha; QR con un solo marco */
:root.st-esc .st-rs-card .st-sello-fila,:root.st-esc[data-theme="dark"] .st-rs-card .st-sello-fila{padding:8px 12px!important;border:1px solid var(--line)!important;border-radius:10px;background:transparent!important}
:root.st-esc[data-theme="dark"] .st-rs-qr img,:root.st-esc[data-theme="dark"] #stPublicacion .st-qr img{box-shadow:none}
:root.st-esc .st-rs-qr,:root.st-esc #stPublicacion .st-qr:not([hidden]){border:0!important;padding:0!important}
/* 13. Velo de los modales en oscuro más denso y modal con borde y elevación */
:root.st-esc[data-theme="dark"] dialog::backdrop,:root.st-esc[data-theme="dark"] dialog.st-pls::backdrop,:root.st-esc[data-theme="dark"] #dlgImportar::backdrop,:root.st-esc[data-theme="dark"] #dlgPaleta::backdrop{background:rgba(2,2,8,.74)}
:root.st-esc[data-theme="dark"] dialog{border:1px solid rgba(255,255,255,.16);box-shadow:0 30px 80px -20px rgba(0,0,0,.85)}
/* 14. Importar en oscuro: borde de la zona ≥ 3:1 y botón apagado inconfundible */
:root.st-esc[data-theme="dark"] #dlgImportar .st-imp-zona{border-color:rgba(255,255,255,.42)}
:root.st-esc #dlgImportar #btnImpSubir:disabled{background:transparent;border:1px dashed var(--line);color:color-mix(in srgb,var(--muted) 75%,transparent)}
/* 15. Pestañas fijas con borde y sombra al desplazar; el contenido se desvanece bajo ellas */
:root.st-esc .st-der.st-desplazado>.st-col-cab{border-bottom-color:color-mix(in srgb,var(--ink) 18%,var(--line))}
:root.st-esc .st-der.st-desplazado .st-scroll{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 14px);mask-image:linear-gradient(to bottom,transparent,#000 14px)}
/* 16. Menú de migas más angosto: no tapa la cabecera del celular */
.st-miga-menu{min-width:200px;max-width:220px}
/* 17. María: atajos como píldoras de sugerencia y bienvenida arriba */
:root.st-esc .st-body .sop-panel .sop-rapidas{flex-direction:row;flex-wrap:wrap;gap:6px}
:root.st-esc .st-body .sop-panel .sop-rapidas button{width:auto;min-height:32px;padding:4px 12px;border-radius:999px;font:500 13px var(--body);text-align:left}
.sop-bienv{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin:8px 16px 16px;padding:16px;border:1px solid var(--line);border-radius:14px}
.sop-bienv[hidden]{display:none}
.sop-bienv-ic{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:var(--accent-soft);color:var(--accent)}
.sop-bienv b{font:600 16px var(--body)}
.sop-bienv span:last-child{font-size:13.5px;color:var(--muted)}
/* 18. Calidad: margen bajo «Ver ensayo en vivo» */
:root.st-esc .st-ensayo-b{margin-bottom:24px}
/* Revisión propia ronda 8 */
:root.st-esc .st-nueva.st-btn.primario,:root.st-esc .st-nueva.st-btn.primario:hover:not([disabled]){background:transparent;border:1px solid var(--line);color:var(--ink);box-shadow:none}
:root.st-esc .st-nueva.st-btn.primario:hover:not([disabled]){background:var(--st-s2)}
@media (max-width:1439px){
  :root.st-esc .st{--st-izq:224px}
  :root.st-esc .st-itabs{gap:0}
  :root.st-esc .st-itabs [role="tab"]{padding:0 7px;font-size:13.5px}
  :root.st-esc .st-itabs [role="tab"][aria-selected="true"]::after{left:7px;right:7px}
}
:root.st-esc .st-estado,:root.st-esc .si-app-est,.st-aprob,.st-pal-act,:root.st-esc .st-sugerido,:root.st-esc .st-insignia{height:20px;padding:0 8px}
:root.st-esc .st-der>.st-col-cab{overflow:hidden}
.st-lat-plan{flex-wrap:wrap}
:root.st-esc .st-top-der .st-masop-menu .st-masop-vista{display:grid!important;grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr));margin:4px 10px 6px;padding:3px;border:1px solid var(--line)}
:root.st-esc .st-top-der .st-masop-menu .st-masop-vista .st-masop-k{display:none}
:root.st-esc .st-top-der .st-masop-menu .st-masop-vista::before{content:none}
.st-miga-menu{min-width:176px;max-width:180px}
.st-miga-menu .st-estado{display:none}
:root.st-esc .st-itabs{gap:2px}
:root.st-esc .st-itabs [role="tab"]{padding:0 7px;font-size:14px}
:root.st-esc .st-itabs [role="tab"][aria-selected="true"]::after{left:7px;right:7px}
@media (min-width:1800px){ :root.st-esc .st-itabs [role="tab"]{font-size:15px;padding:0 9px} :root.st-esc .st-itabs [role="tab"][aria-selected="true"]::after{left:9px;right:9px} }
@media (max-width:1439px){ :root.st-esc .st-itabs [role="tab"]{font-size:13.5px;padding:0 6px} :root.st-esc .st-itabs [role="tab"][aria-selected="true"]::after{left:6px;right:6px} }

/* ================= Ronda 9 del juez (3-nov-2026): cero textos cortados, densidad y un solo sistema ================= */
/* 21. Escala fija de títulos: 28 (Inicio), 19 (modal), 15 (sección del panel), 12,5 (rótulo) */
:root.st-esc .si-c-esc .si-sec-cab h2{font:var(--w-tit) 28px/1.15 var(--display);letter-spacing:var(--ls-titulo)}
/* 1. Barra lateral bajo 1440 px: 240 px, estado como punto de color (con globo), sin «Ctrl K» bajo 1366 px */
@media (max-width:1439px){
  :root.st-esc .st{--st-izq:240px}
  :root.st-esc #stApps .st-estado,:root.st-esc #stLatExtra .st-estado{width:9px;height:9px;min-width:9px;padding:0;border:0;font-size:0!important;border-radius:50%;background:var(--muted)}
  :root.st-esc #stApps .st-estado.publicada{background:var(--ok)}
  :root.st-esc #stApps .st-estado.borrador{background:var(--accent)}
  :root.st-esc #stApps .st-estado.por-vencer{background:var(--warn)}
  :root.st-esc #stApps .st-estado.vencida,:root.st-esc #stApps .st-estado.retirada{background:var(--coral)}
}
@media (max-width:1365px){ :root.st-esc .st-buscar-k{display:none} :root.st-esc .st-buscar-w .st-buscar{padding-right:9px} }
/* 2. Menú de migas: ancho mínimo 240 px, nombres enteros */
.st-miga-menu{min-width:240px;max-width:300px}
.st-miga-menu .nom{white-space:normal;overflow:visible}
/* 3. Atajos del compositor: fila desplazable con desvanecido al borde derecho */
:root.st-esc #stForm .st-capsula>.st-comp-menu{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);padding-right:36px}
/* 4. Enlace: «Copiar» a la altura del campo */
:root.st-esc .st-enlace-e{align-items:stretch}
:root.st-esc .st-enlace-e code,:root.st-esc .st-enlace-e .st-btn{height:36px;min-height:36px;box-sizing:border-box;margin:0}
:root.st-esc .st-enlace-e .st-ic{align-self:center}
/* 5. Paleta: filas enteras de 36 px (también los grupos) y el mismo alto al abrir */
:root.st-esc .st-pal-g{height:36px;min-height:36px!important;box-sizing:border-box;display:flex;align-items:flex-end;padding:0 10px 6px!important}
:root.st-esc .st-paleta-l{height:calc(36px * var(--st-pal-n,12) + 6px);max-height:none;padding:6px 6px 0;-webkit-mask-image:none;mask-image:none;box-sizing:border-box}
@media (max-height:860px){ :root.st-esc .st-paleta-l{--st-pal-n:11} }
@media (max-height:760px){ :root.st-esc .st-paleta-l{--st-pal-n:9} }
@media (min-height:1000px){ :root.st-esc .st-paleta-l{--st-pal-n:14} }
/* 6. Pestañas que no se mueven: reservan el ancho de la negrita */
:root.st-esc .st-itabs [role="tab"]{display:inline-flex;flex-direction:column;align-items:center;justify-content:center}
:root.st-esc .st-itabs [role="tab"]::before{content:attr(data-t);font-weight:700;height:0;overflow:hidden;visibility:hidden;pointer-events:none}
/* 7. La vista previa de escritorio se desvanece abajo (nada queda cortado en seco) */
:root.st-esc .st-marco.escritorio::after{content:"";position:absolute;left:0;right:0;bottom:0;height:40px;background:linear-gradient(to bottom,transparent,color-mix(in srgb,var(--bg) 85%,transparent));pointer-events:none;z-index:2}
/* 8. Plantillas: el último contenido sube por encima del desvanecido, insignia con margen, enlace en la línea base del título, buscador y segmentado a la fila completa, velo más fuerte en claro */
.st-pls-c{padding-bottom:120px}
.st-pls .st-denso-t .st-sugerido{top:14px;right:14px}
.st-pls .st-denso-t{padding-right:130px}
.st-pls #stPlantillas>.st-densos{align-items:baseline}
.st-pls #stPlantillas>.st-densos>.st-mas{align-self:baseline}
.st-pls #stTamano.st-seg,.st-pls #stBuscarPl{width:100%}
:root.st-esc dialog.st-pls::backdrop,:root.st-esc #dlgImportar::backdrop,:root.st-esc #dlgPaleta::backdrop{background:rgba(15,14,31,.6)}
:root.st-esc[data-theme="dark"] dialog.st-pls::backdrop,:root.st-esc[data-theme="dark"] #dlgImportar::backdrop,:root.st-esc[data-theme="dark"] #dlgPaleta::backdrop{background:rgba(2,2,8,.74)}
/* 12. Descripciones sin palabras huérfanas */
:root.st-esc .st-pls .d,:root.st-esc .st-sig-c small,:root.st-esc .si-pt-c span,:root.st-esc .st-der .st-nota,:root.st-esc .si-sub,.st-lat-tx small{text-wrap:pretty}
/* 9. María: la bienvenida reemplaza la primera burbuja; pista alineada al texto del campo; atajos largos con buen interlineado */
:root.st-esc .sop-bienv:not([hidden])~#sopLog>:first-child{display:none}
:root.st-esc .st-body .sop-panel .sop-ayuda-in{margin:6px 16px 0;padding-left:13px}
:root.st-esc .st-body .sop-panel .sop-rapidas button{line-height:1.35;padding:6px 12px;border-radius:16px;max-width:100%}
/* 10. Importar: botón apagado ≥ 3:1, aire entre «Nombre de tu app» y la zona, nota legal a la izquierda del botón */
:root.st-esc[data-theme="dark"] #dlgImportar #btnImpSubir:disabled{border-color:rgba(255,255,255,.42);color:#9A9AA3}
:root.st-esc #dlgImportar #btnImpSubir:disabled{color:#6B6880;border-color:#9A97AE}
:root.st-esc #dlgImportar .st-imp-fila{margin-top:16px}
:root.st-esc #impPaso1>.st-imp-acc{align-items:center;flex-wrap:nowrap;gap:16px}
:root.st-esc #impPaso1>.st-imp-acc .st-imp-legal{flex:1 1 auto;margin:0}
/* 13. Barra lateral: «Para empezar otra» con descripción de una línea */
.st-lat-tx{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.st-lat-tx small{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st-lat-pls .st-app{min-height:48px;align-items:center}
/* 14. Inspector hasta 400 px; el resto al lienzo */
:root.st-esc .st{--st-der:clamp(380px,23vw,400px)}
:root.st-esc .st-body .sop-panel{width:clamp(380px,23vw,400px)}
/* 15. Inicio más compacto: «Tus apps» a la vista a 1280, «Nueva app» a la altura de su contenido, acción de contenido como enlace */
:root.st-esc .si-c-esc{padding-top:20px}
:root.st-esc .si-c-esc .si-h1{font-size:clamp(34px,min(3.6vw,5.4vh),52px)}
:root.st-esc .si-c-esc .si-idea{margin-top:14px}
:root.st-esc .si-c-esc .si-explorar{margin:4px 0 0}
.si-tusapps{margin-top:28px!important}
:root.st-esc .si-app.si-app-nueva{align-self:start}
:root.st-esc .si-app-nueva .si-app-b{height:auto;padding:20px 16px;align-items:center;text-align:center}
:root.st-esc .si-app-nueva .si-app-mini{height:40px;background:transparent}
:root.st-esc .si-app-nueva .si-app-c{align-items:center;padding:4px 0 0}
.si-app-cont{width:auto;height:28px;padding:0;border:0;background:none;color:var(--accent);font:600 13px var(--body)}
.si-app-pie{flex-wrap:wrap;row-gap:4px}
/* 16. Vista previa con poco alto: el celular no baja de su tamaño legible y el lienzo se desplaza */
:root.st-esc .st-lienzo.st-lz-scroll{overflow-y:auto;align-items:flex-start}
/* 17. Cabecera de la puerta alineada con la columna de contenido */
:root.st-esc body.st-sin-sesion header.st-top{padding-left:var(--st-hx,16px);padding-right:var(--st-hxr,12px)}
/* 18. Resumen: bloque protagonista y filas compactas */
.st-rs-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.st-rs-vis{font-size:13px;color:var(--muted)}
.st-rs-vis b{font:var(--w-tit) 22px var(--display);color:var(--ink);margin-right:2px}
.st-rs-plan{margin:0;font-size:13px;color:var(--muted)}
.st-rs-plan b{color:var(--ink)}
.st-rs-filas{display:flex;flex-direction:column;margin-top:20px;border-top:1px solid var(--line)}
.st-rs-row{display:grid;grid-template-columns:112px minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);font-size:13.5px}
.st-rs-k{color:var(--muted);font-size:13px}
.st-rs-v{min-width:0;overflow-wrap:anywhere}
.st-rs-row .st-linkbtn{min-height:28px;color:var(--accent);font:600 13px var(--body);text-decoration:none}
.st-rs-qrrow{grid-template-columns:112px minmax(0,1fr)}
:root.st-esc #pResumen .st-rs-qr{display:flex;align-items:center;gap:12px}
:root.st-esc #pResumen .st-rs-qr img{width:72px;height:72px}
:root.st-esc #pResumen .st-rs-qr span{font-size:12.5px}
/* 19. Un solo control segmentado: misma pista, mismo ancho por celda y el elegido con fondo de superficie */
:root.st-esc .st-seg,:root.st-esc .st-top-der .st-masop-menu .idioma,:root.st-esc .st-top-der .st-masop-menu .st-masop-vista{background:var(--st-s2)}
:root.st-esc[data-theme="dark"] .st-seg,:root.st-esc[data-theme="dark"] .st-top-der .st-masop-menu .idioma,:root.st-esc[data-theme="dark"] .st-top-der .st-masop-menu .st-masop-vista{background:rgba(0,0,0,.25)}
:root.st-esc .st-top-der .st-masop-menu .idioma{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:row}
/* 20. QR con el mismo marco en claro y oscuro */
:root.st-esc .st-rs-qr img,:root.st-esc #stPublicacion .st-qr img,:root.st-esc[data-theme="dark"] .st-rs-qr img,:root.st-esc[data-theme="dark"] #stPublicacion .st-qr img{background:#fff;padding:6px;border-radius:10px;border:1px solid var(--line);box-shadow:none;box-sizing:content-box}
/* 22. Candado del compositor con rótulo visible */
:root.st-esc #stForm .st-candado{width:auto!important;padding:0 10px 0 8px;border-radius:999px!important;gap:4px}
.st-candado-t{font:500 12.5px var(--body);color:var(--muted)}
/* 4. Enlace de Publicar: campo y «Copiar» a la misma altura y línea */
:root.st-esc #colInspector .st-enlace-e{align-items:center!important}
:root.st-esc #colInspector .st-enlace-e>code,:root.st-esc #colInspector .st-enlace-e>.st-btn{height:36px!important;min-height:36px!important;margin:0!important;align-self:center!important;box-sizing:border-box}
/* 15. Inicio: separación entre secciones ≤ 40 px y, en pantallas anchas, plantillas en tarjetas horizontales para que queden a la vista */
:root.st-esc .si .si-sec.si-parati{margin-top:40px}
:root.st-esc .si-parati .si-sec-cab{margin-bottom:12px}
@media (min-width:1600px){
  :root.st-esc .si-pt{flex-direction:row;align-items:center;gap:14px;padding:14px 16px}
  :root.st-esc .si-pt-tile{width:44px;height:44px;min-width:44px;border-radius:12px}
  :root.st-esc .si-pt-tile svg{width:24px;height:24px}
}
/* 6. Pestañas del Inspector: caben enteras con el ancho reservado de la negrita */
:root.st-esc .st-itabs [role="tab"]{padding-left:6px;padding-right:6px}

/* ================= Ronda 10 del juez (3-nov-2026): verificado a ojo, punto por punto ================= */
/* 1. Inicio: aire bajo la cabecera, una sola rejilla (3 columnas; 4 desde 1700 px), «Nueva app» y sus hermanas del mismo alto, sin resplandor verde */
:root.st-esc .si-c-esc{padding-top:56px}
:root.st-esc[data-theme="dark"] .si::before{background:radial-gradient(42% 60% at 18% 0%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%)}
:root.st-esc .si-c-esc .si-rejilla{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px;align-items:stretch}
@media (min-width:1700px){ :root.st-esc .si-c-esc .si-rejilla{grid-template-columns:repeat(4,minmax(0,1fr))!important} }
:root.st-esc .si-app.si-app-nueva,:root.st-esc .si-app.si-app-pl{align-self:stretch;border:1px solid var(--line);border-style:solid;background:var(--surface)}
:root.st-esc .si-app-nueva .si-app-b{height:100%;padding:24px 16px;justify-content:center;align-items:center;text-align:center;border:0}
:root.st-esc .si-app-nueva .si-app-mini{height:48px;aspect-ratio:auto;background:transparent;border:0}
:root.st-esc .si-app-pl .si-app-b{border:0;flex:1}
:root.st-esc .si-app-pl .si-pl-mini{aspect-ratio:16/10;height:auto;display:flex;align-items:center;justify-content:center;background:var(--si-t-bg,var(--accent-soft));color:var(--si-t-ink,var(--accent));border-bottom:1px solid var(--line)}
:root.st-esc .si-app-pl .si-pl-mini::after{display:none}
:root.st-esc .si-app-pl .si-app-c span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--muted);font-size:13px;text-wrap:pretty}
:root.st-esc .si .si-sec.si-parati{margin-top:40px}
/* 2. Atajos del compositor: en dos filas, todos enteros (nada se corta sin señal) */
:root.st-esc #stForm .st-capsula>.st-comp-menu{flex-wrap:wrap!important;overflow:visible!important;-webkit-mask-image:none!important;mask-image:none!important;padding-right:0!important;row-gap:6px}
/* 4. Paleta: alto según los resultados, desplazable a la vista (desvanecido y barra), coincidencia con más contraste, sin línea violeta bajo el campo */
:root.st-esc .st-paleta-l{height:auto!important;max-height:calc(36px * var(--st-pal-n,12) + 6px)!important;overflow-y:auto;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--ink) 30%,transparent) transparent}
:root.st-esc .st-paleta-l.st-pal-mas{-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 44px),rgba(0,0,0,.25));mask-image:linear-gradient(to bottom,#000 calc(100% - 44px),rgba(0,0,0,.25))}
:root.st-esc .st-paleta .st-paleta-pie .st-pal-baja{float:right;color:var(--ink);font-weight:600}
:root.st-esc #paletaQ,:root.st-esc #paletaQ:focus,:root.st-esc #paletaQ:focus-visible{border:0!important;border-bottom:1px solid var(--line)!important;box-shadow:none!important;outline:none!important}
:root.st-esc[data-theme="dark"] .st-paleta-l mark{background:color-mix(in srgb,var(--lime) 30%,transparent);color:#fff;font-weight:700}
/* 5. Plantillas: aire tras «Proyectos grandes» y «Ver las N» en la cabecera del tema */
:root.st-esc .st-pls #stPlantillas>.st-densos{margin-bottom:28px}
:root.st-esc .st-pls .st-tema summary .st-tema-ver{margin-left:auto;min-height:28px;padding:0 4px;border:0;background:none;color:var(--accent);font:600 13px var(--body);cursor:pointer;white-space:nowrap}
:root.st-esc .st-pls .st-tema summary .st-tema-ver:hover{text-decoration:underline}
:root.st-esc .st-pls .st-tema summary .st-tema-ver:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:6px}
/* 6. Punteado solo en zonas de soltar: botón apagado lleno y atenuado; «Nueva app», ejemplo del consultor y vacíos con borde normal */
:root.st-esc #dlgImportar #btnImpSubir:disabled,:root.st-esc #stPublicar:disabled{background:color-mix(in srgb,var(--accent) 38%,var(--surface))!important;border:1px solid transparent!important;color:color-mix(in srgb,#fff 72%,transparent)!important;opacity:1;cursor:not-allowed}
:root.st-esc:not([data-theme="dark"]) #dlgImportar #btnImpSubir:disabled,:root.st-esc:not([data-theme="dark"]) #stPublicar:disabled{background:color-mix(in srgb,var(--accent) 42%,#fff)!important;color:#fff!important}
.st-cons-ej,.st-rs-vacio{border-style:solid!important}
/* 7. Enlace: monoespaciado, un solo truncado al medio (escritorio.js lo mide), 8 px hasta «Copiar» */
:root.st-esc #colInspector .st-enlace-e{gap:8px}
:root.st-esc #colInspector .st-enlace-e>code{font:500 12.5px/1 "IBM Plex Mono",ui-monospace,monospace!important;font-variant-numeric:tabular-nums;text-overflow:clip!important;letter-spacing:-.01em}
/* 8. Barra lateral: la descripción se acorta por palabras (sin «…») */
:root.st-esc .st-lat-tx small{text-overflow:clip}
/* 9. Resumen: visitas en la línea del plan; etiquetas encima del valor */
:root.st-esc #pResumen .st-rs-row{grid-template-columns:minmax(0,1fr) auto;row-gap:4px;align-items:center}
:root.st-esc #pResumen .st-rs-row .st-rs-k{grid-column:1/-1;font-size:12px}
:root.st-esc #pResumen .st-rs-qrrow{grid-template-columns:minmax(0,1fr)}
:root.st-esc #pResumen .st-rs-card>.st-enlace-e:first-child{margin-top:0}
/* 10. Estado de la app: insignia en todos los anchos (deshace el punto de la ronda 9) */
@media (max-width:1439px){
  :root.st-esc #stApps .st-estado,:root.st-esc #stLatExtra .st-estado{width:auto;height:20px;min-width:0;padding:0 7px;border:1px solid currentColor;font-size:11.5px!important;border-radius:999px;background:transparent}
  :root.st-esc #stApps .st-estado.publicada,:root.st-esc #stApps .st-estado.borrador,:root.st-esc #stApps .st-estado.por-vencer,:root.st-esc #stApps .st-estado.vencida,:root.st-esc #stApps .st-estado.retirada{background:transparent}
  :root.st-esc #stApps .st-app .nom{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
/* 12. Capas en oscuro: modales y paleta con borde más claro y sombra visible */
:root.st-esc[data-theme="dark"] dialog.st-dlg,:root.st-esc[data-theme="dark"] dialog.st-pls,:root.st-esc[data-theme="dark"] #dlgImportar,:root.st-esc[data-theme="dark"] #dlgPaleta,:root.st-esc[data-theme="dark"] .st-miga-menu,:root.st-esc[data-theme="dark"] .st-masop-menu{border:1px solid rgba(255,255,255,.16)!important;box-shadow:0 28px 72px -12px rgba(0,0,0,.75),0 0 0 1px rgba(0,0,0,.4)!important}
/* 13. Inspector: hasta 460 px a 1920 y una sola escala (12 etiquetas · 14 datos · 15/600 títulos) */
:root.st-esc .st{--st-der:clamp(380px,23vw,460px)}
:root.st-esc .st-body .sop-panel{width:clamp(380px,23vw,460px)}
:root.st-esc #colInspector .st-panel>summary,:root.st-esc #colInspector .st-h3{font:600 15px/1.3 var(--body)!important}
:root.st-esc #colInspector .st-fila{font-size:14px}
:root.st-esc #colInspector .st-fila>span:first-child,:root.st-esc #colInspector .st-rs-k{font-size:12px!important;color:var(--muted)}
:root.st-esc #colInspector .st-rs-plan,:root.st-esc #colInspector .st-rs-v,:root.st-esc #colInspector .st-sig-c b{font-size:14px}
/* 15. Selectores del plan con forma de control: chip con borde y flecha */
:root.st-esc .st-frase .st-hueco-w{display:inline-flex;align-items:center;margin:2px 0;border:1px solid var(--line);border-radius:10px;background:var(--st-s2);vertical-align:middle}
:root.st-esc .st-frase .st-hueco-w:hover{border-color:color-mix(in srgb,var(--accent) 55%,var(--line))}
:root.st-esc .st-frase .st-hueco{min-height:34px;padding:0 4px 0 10px;font-size:15px}
:root.st-esc .st-frase .st-hueco .t{text-decoration:none}
:root.st-esc .st-frase .st-hueco-m{width:30px;height:34px;margin:0;color:var(--ink)}
:root.st-esc .st-frase .st-hueco-w::after{display:none!important}
/* 17. Vista de escritorio: desvanecido real abajo; «Entendí» con aire hasta el borde */
:root.st-esc .st-marco.escritorio::after{height:84px;background:linear-gradient(to bottom,transparent,var(--bg) 92%)}
:root.st-esc #colVista:has(#stEntendi:not([hidden])) #stForm{bottom:26px}
/* 18. Menú de migas: se abre sobre la barra lateral, no sobre el celular */
:root.st-esc .st-miga-menu{left:12px!important}
/* 19. María: el anillo de foco no toca el botón; atajos en una columna a todo el ancho */
:root.st-esc .st-body .sop-panel .sop-barra{padding:6px 6px 6px 14px}
:root.st-esc .st-body .sop-panel .sop-rapidas{flex-direction:column!important;align-items:stretch}
:root.st-esc .st-body .sop-panel .sop-rapidas button{width:100%!important;border-radius:12px!important;justify-content:flex-start}
/* 20. QR en oscuro: placa blanca atenuada con borde y sombra suaves */
:root.st-esc[data-theme="dark"] .st-rs-qr img,:root.st-esc[data-theme="dark"] #stPublicacion .st-qr img{filter:brightness(.88);border-color:rgba(255,255,255,.12);box-shadow:0 6px 18px -8px rgba(0,0,0,.6)}
/* 15 (ajuste): la flecha del selector se ve y el control mide 36 px */
:root.st-esc .st-frase .st-hueco-m{width:30px!important;min-width:30px!important;height:34px!important;min-height:34px!important;padding:0!important;margin:0!important}
:root.st-esc .st-frase .st-hueco-m svg{width:12px!important;height:12px!important;flex:none!important;display:block}
:root.st-esc .st-frase .st-hueco{min-height:34px!important;height:34px}
:root.st-esc .st-frase{line-height:2.6}
/* 1 (ajuste): el contenido de «Nueva app» queda centrado en su tarjeta; la hermana sugerida con fondo neutro */
:root.st-esc .si-app-nueva .si-app-c{flex:0 0 auto}
:root.st-esc .si-app-pl .si-pl-mini{background:color-mix(in srgb,var(--si-t-ink,var(--accent)) 12%,var(--surface))}
/* 2 (ajuste): atajos más compactos para que quepan en dos filas */
:root.st-esc #stForm .st-capsula>.st-comp-menu button{min-height:32px;height:32px;padding:0 10px;font-size:13px;gap:6px}
/* 9 (ajuste): visitas en su propia línea pequeña */
.st-rs-vis-l{margin:2px 0 0;font-size:13px;color:var(--muted)}
/* 15 (ajuste): cada parte de la frase del plan en su línea */
:root.st-esc .st-frase .st-hueco-w+span::before{content:"";display:block}

/* ================= Ronda 11 del juez (3-nov-2026): cambio estructural del layout ================= */
/* A1. Celular de tamaño fijo por ventana, a escala 1 (escritorio.js pone --st-mw y --st-mh); el compositor y el menú + flotan encima */
:root.st-esc .st-marco.movil{width:calc(var(--st-mw,390px) * var(--st-k,1) + 16px)!important;height:calc(var(--st-mh,844px) * var(--st-k,1) + 28px)!important}
:root.st-esc .st-marco.movil .st-iframe{width:var(--st-mw,390px)!important;height:var(--st-mh,844px)!important;transform:scale(var(--st-k,1))!important}
:root.st-esc #stForm,:root.st-esc #colVista:has(#stEntendi:not([hidden])) #stForm{bottom:16px!important}
:root.st-esc #stForm .st-capsula:has(>.st-comp-menu:not([hidden])),:root.st-esc #stForm .st-capsula.multi{box-shadow:0 22px 56px -14px rgba(15,14,31,.5)!important}
:root.st-esc[data-theme="dark"] #stForm .st-capsula:has(>.st-comp-menu:not([hidden])),:root.st-esc[data-theme="dark"] #stForm .st-capsula.multi{box-shadow:0 22px 56px -12px rgba(0,0,0,.85),0 0 0 1px rgba(255,255,255,.12)!important}
/* A2. Compositor de una línea sin foco; con foco crece hasta 6 líneas como capa */
:root.st-esc #stForm:not(:focus-within) .st-capsula textarea{height:40px!important;max-height:40px!important;white-space:nowrap;overflow:hidden!important;text-overflow:ellipsis}
:root.st-esc #stForm .st-capsula.multi textarea{max-height:144px!important;overflow-y:auto}
/* «Entendí» en el Inspector, encima de «Plan y precio» */
:root.st-esc #pEntendi{margin:0 0 4px}
:root.st-esc #pEntendi:has(>#stEntendi[hidden]){display:none!important}
:root.st-esc #pEntendi .st-entendi{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--st-s1,var(--surface))}
:root.st-esc #pEntendi .st-ent-lista{display:flex;flex-wrap:wrap;gap:6px;min-width:0}
:root.st-esc #pEntendi .st-ent{max-width:100%}
/* A3. Columnas laterales con ancho máximo; el sobrante va al lienzo */
:root.st-esc .st{--st-izq:clamp(240px,15vw,260px)!important;--st-der:clamp(360px,21vw,400px)!important}
:root.st-esc .st-body .sop-panel{width:clamp(360px,21vw,400px)!important}
:root.st-esc .st-explorar{margin-top:8px!important;border-top:0!important;padding-top:0}
/* María: atajos que envuelven y el campo pegado a la conversación (no al fondo) */
:root.st-esc .st-body .sop-panel .sop-rapidas{flex-direction:row!important;flex-wrap:wrap!important;gap:6px}
:root.st-esc .st-body .sop-panel .sop-rapidas button{width:auto!important;border-radius:999px!important;padding:6px 12px}
:root.st-esc .st-body .sop-panel #sopLog{flex:0 1 auto!important}
:root.st-esc .st-body .sop-panel .sop-falla{margin-top:auto}
/* A4. Las tres cabeceras de columna en la misma línea: 44 px, centradas */
:root.st-esc .st-izq>.st-col-cab,:root.st-esc .st-centro>.st-col-cab,:root.st-esc .st-der>.st-col-cab{height:44px!important;min-height:44px!important;box-sizing:border-box;display:flex;align-items:center;padding-top:0!important;padding-bottom:0!important}
:root.st-esc .st-itabs,:root.st-esc .st-itabs [role="tab"]{height:44px;min-height:44px;box-sizing:border-box}
/* B5. Resumen plano en tres bloques */
:root.st-esc #pResumen .st-rs-b{padding:16px 0;border-top:1px solid var(--line)}
:root.st-esc #pResumen .st-rs-b1{padding-top:4px;border-top:0}
:root.st-esc #pResumen .st-rs-b:last-child{border-bottom:0}
:root.st-esc #pResumen .st-rs-b>.st-h3:first-child{margin-top:0}
.st-rs-l1{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px;font-size:14px}
.st-rs-sep{color:var(--muted)}
.st-rs-pr{display:inline-flex;align-items:center;gap:4px;color:var(--ink)}
.st-rs-pr.ok .ico,.st-rs-pr.ok svg{color:var(--ok)}
.st-rs-l1 .st-sello-ver{margin-left:auto}
:root.st-esc #pResumen .st-rs-plan{margin:10px 0 0;font-size:13px;color:var(--muted);line-height:1.5}
:root.st-esc #pResumen .st-rs-plan b{color:var(--ink)}
/* Un solo QR en todo el producto: 112 px con marco blanco */
:root.st-esc .st-qr-u{display:flex;align-items:center;gap:14px}
:root.st-esc .st-qr-u img,:root.st-esc #pResumen .st-rs-qr img,:root.st-esc #stPublicacion .st-qr img{width:112px!important;height:112px!important}
:root.st-esc .st-qr-u span{font-size:13px;color:var(--muted)}
/* B6. Enlace: la ruta corta siempre termina en el nombre del proyecto; sin ícono suelto (el lienzo ya tiene «Abrir») */
:root.st-esc #colInspector .st-enlace-e>.st-ic{display:none!important}
:root.st-esc #colInspector .st-enlace-e>code{font-size:12px!important}
/* Publicar: datos en una línea plana con el precio */
.st-plan-l1{margin:0 0 4px;font-size:14px;color:var(--muted)}
.st-plan-l1 b{color:var(--ink)}
.st-plan-l2{margin:0 0 8px;font-size:13px;color:var(--muted)}
/* B7. Inicio: «Nueva app» cubre lo que queda de la fila; plantillas con miniaturas diseñadas por categoría */
:root.st-esc .si-app-nueva.ancha .si-app-b{flex-direction:row!important;gap:16px;padding:20px 24px;justify-content:center;align-items:center;text-align:left}
:root.st-esc .si-app-nueva.ancha .si-app-mini{width:56px;height:56px!important;flex:none;border-radius:16px;background:var(--accent-soft)!important;display:flex;align-items:center;justify-content:center}
:root.st-esc .si-app-nueva.ancha .si-app-c{align-items:flex-start;padding:0}
:root.st-esc .si-pt.si-pt-mk{flex-direction:column!important;align-items:stretch!important;gap:0!important;padding:0!important;overflow:hidden}
:root.st-esc .si-pt-mk .si-pt-c{padding:12px 14px 14px}
.si-mk{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:min-content;gap:6px;aspect-ratio:16/9;padding:10px;box-sizing:border-box;overflow:hidden;background:color-mix(in srgb,var(--mk) 14%,var(--surface));border-bottom:1px solid var(--line)}
.si-mk i{display:block;border-radius:5px}
.si-mk .mk-cab{grid-column:1/-1;height:10px;background:color-mix(in srgb,var(--mk) 32%,var(--surface));display:flex;align-items:center;padding:0 4px}
.si-mk .mk-cab>i{width:24px;height:4px;border-radius:2px;background:color-mix(in srgb,var(--mk) 70%,var(--surface))}
.si-mk .mk-hero{grid-column:1/-1;height:44px;border-radius:7px;background:linear-gradient(135deg,var(--mk),color-mix(in srgb,var(--mk) 55%,#1e1b4b))}
.si-mk .mk-c{height:28px;background:var(--surface);box-shadow:0 0 0 1px color-mix(in srgb,var(--mk) 18%,transparent)}
.si-mk-tienda{grid-template-columns:repeat(3,minmax(0,1fr))}
.si-mk-bot{grid-template-columns:1fr}
.si-mk .mk-b{height:16px;border-radius:9px}
.si-mk .mk-b1{width:62%;background:var(--surface)}
.si-mk .mk-b2{width:48%;justify-self:end;background:var(--mk)}
.si-mk .mk-b3{width:74%;background:var(--surface)}
.si-mk-tablero{grid-template-columns:repeat(3,minmax(0,1fr))}
.si-mk .mk-kpi{height:18px;background:var(--surface)}
.si-mk .mk-barras{grid-column:1/-1;height:44px;display:flex;align-items:flex-end;gap:5px;border-radius:0}
.si-mk .mk-barras>i{flex:1;border-radius:3px 3px 0 0;background:var(--mk)}
.si-mk .mk-barras>i:nth-child(1){height:40%}.si-mk .mk-barras>i:nth-child(2){height:65%}.si-mk .mk-barras>i:nth-child(3){height:50%}.si-mk .mk-barras>i:nth-child(4){height:85%}.si-mk .mk-barras>i:nth-child(5){height:70%}
.si-mk .mk-ic{position:absolute;right:10px;bottom:10px;display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:var(--surface);color:var(--mk);box-shadow:0 4px 12px -4px rgba(15,14,31,.35)}
:root.st-esc .si-pt-mk .si-pt-c span{-webkit-line-clamp:2}
/* B9. Descripciones con mayúscula inicial */
:root.st-esc .st-lat-tx small::first-letter,:root.st-esc .si-pt-c span::first-letter,:root.st-esc .st-pls .st-plantilla .d::first-letter,:root.st-esc .si-app-c>span::first-letter{text-transform:uppercase}
:root.st-esc .st-pls .st-plantilla .d{display:block}
/* C10. Menú de migas: bajo la barra del lienzo y a la derecha del panel izquierdo */
:root.st-esc .st-miga-menu{left:var(--st-miga-x,252px)!important;top:92px!important}
/* C11. Paleta: filas de 32 px y alto suficiente para ver los tres grupos */
:root.st-esc .st-paleta-l li[role="option"],:root.st-esc .st-pal-g{height:32px!important;min-height:32px!important}
:root.st-esc .st-paleta-l{max-height:calc(100dvh - 8vh - 130px)!important}
/* C12 y C13. Botón apagado neutro: superficie, texto gris legible (≥ 4,5:1), sin color de marca */
:root.st-esc #dlgImportar #btnImpSubir:disabled,:root.st-esc #stPublicar:disabled{background:#EEEDF4!important;border:1px solid #D9D7E5!important;color:#55526B!important;cursor:not-allowed!important;opacity:1!important;box-shadow:none!important}
:root.st-esc[data-theme="dark"] #dlgImportar #btnImpSubir:disabled,:root.st-esc[data-theme="dark"] #stPublicar:disabled{background:#232329!important;border:1px solid #33333A!important;color:#A9A9B2!important}
/* C14. Menú ⋯ a 16 px del borde derecho */
:root.st-esc .st-top-der .st-masop-menu{position:fixed!important;right:16px!important;left:auto!important;top:52px!important}
/* C15. Modal de plantillas: pie con desvanecido y señal de desplazamiento */
:root.st-esc .st-pls .st-pls-mas{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:3;padding:6px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font:600 13px var(--body);box-shadow:0 8px 24px -10px rgba(15,14,31,.45);pointer-events:none}
:root.st-esc .st-pls .st-pls-fade{position:absolute;left:1px;right:1px;bottom:1px;height:72px;border-radius:0 0 16px 16px;background:linear-gradient(to bottom,transparent,var(--surface) 85%);pointer-events:none;z-index:2}
/* C16. Selectores de la frase del plan en la línea base del texto */
:root.st-esc .st-frase .st-hueco-w{vertical-align:baseline!important}
/* C17. Sin desvanecidos sobre fotos en la vista previa ni texto cortado en las miniaturas del Inicio */
:root.st-esc .st-marco.escritorio::after,.si-app-mini::after,.st-puerta-tel::after{display:none!important}
/* C18. Mismo peso tipográfico en claro y oscuro */
:root.st-esc body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
:root.st-esc .st-pls .st-pls-mas[hidden]{display:none}
:root.st-esc #pResumen button.st-rs-pr{min-height:28px;padding:0 2px;border:0;border-radius:6px;background:none;font:inherit;color:var(--ink);cursor:pointer}
:root.st-esc #pResumen button.st-rs-pr:hover span{text-decoration:underline}
:root.st-esc #pResumen button.st-rs-pr:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* María (ajuste r11): el cuerpo mide lo que su contenido y el campo queda pegado a la conversación */
:root.st-esc .st-body .sop-panel>.sop-cuerpo{flex:0 1 auto!important;min-height:0}
/* B7 (ajuste r11): sin resplandor lima en el Inicio de escritorio, también en claro */
:root.st-esc .si::before{background:radial-gradient(42% 60% at 18% 0%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 70%)!important}
:root.st-esc #pEntendi .st-entendi{padding:10px 12px;gap:6px 6px}
/* A2 (ajuste r11): el campo crece en su sitio, junto a los botones */
:root.st-esc #stForm:focus-within .st-capsula textarea{max-height:144px!important;overflow-y:auto;white-space:pre-wrap}
/* C12/C13 (ajuste r11): también gana a la regla clara de la ronda 10 */
:root.st-esc:not([data-theme="dark"]) #dlgImportar #btnImpSubir:disabled,:root.st-esc:not([data-theme="dark"]) #stPublicar:disabled{background:#EEEDF4!important;border:1px solid #D9D7E5!important;color:#55526B!important}

/* ================= Ronda 12 del juez (3-nov-2026): bugs objetivos, densidad y jerarquía ================= */
/* 1. Panel plegado de verdad: 56 px (la regla de la ronda 11 usaba !important y anulaba el plegado) */
:root.st-esc.st-plegado .st{--st-izq:56px!important}
:root.st-esc.st-plegado .st-izq .st-lat-extra{display:none!important}
/* 11. Inspector hasta 360 px; el sobrante al lienzo */
:root.st-esc .st{--st-der:clamp(340px,19vw,360px)!important}
:root.st-esc .st-body .sop-panel{width:clamp(340px,19vw,360px)!important}
:root.st-esc.st-plegado .st-body .sop-panel{width:clamp(340px,19vw,360px)!important}
/* 2. Menú +: globo que sale hacia arriba desde el botón +, al lado del celular (escritorio.js lo coloca) */
:root.st-esc #stForm .st-capsula>.st-comp-menu.st-globo{position:fixed!important;order:0;flex:none!important;flex-direction:column!important;flex-wrap:nowrap!important;align-items:stretch;gap:2px!important;margin:0!important;padding:6px!important;max-height:min(360px,60vh);overflow:auto!important;border:1px solid var(--line)!important;border-radius:14px!important;background:var(--surface)!important;box-shadow:0 22px 50px -14px rgba(15,14,31,.45)!important;z-index:30}
:root.st-esc[data-theme="dark"] #stForm .st-capsula>.st-comp-menu.st-globo{border-color:rgba(255,255,255,.16)!important;box-shadow:0 22px 56px -12px rgba(0,0,0,.85)!important}
:root.st-esc #stForm .st-capsula>.st-comp-menu.st-globo[hidden]{display:none!important}
:root.st-esc #stForm .st-capsula>.st-comp-menu.st-globo button{width:100%;height:auto!important;min-height:36px!important;padding:6px 10px!important;border:0!important;border-radius:9px!important;background:none!important;justify-content:flex-start;text-align:left;white-space:normal!important;line-height:1.3;font:500 13.5px var(--body)!important}
:root.st-esc #stForm .st-capsula>.st-comp-menu.st-globo button:hover,:root.st-esc #stForm .st-capsula>.st-comp-menu.st-globo button:focus-visible{background:var(--st-s2)!important}
:root.st-esc #stForm .st-capsula:has(>.st-comp-menu:not([hidden])){box-shadow:0 1px 2px rgba(15,14,31,.06)!important}
/* 3. Texto largo: a todo el ancho y los íconos en su fila; el campo llega a 2 líneas y luego se desplaza */
:root.st-esc #stForm .st-capsula.multi textarea{order:1;flex:0 0 100%!important;height:auto!important;min-height:44px!important;max-height:52px!important;padding:6px 10px 2px!important;white-space:pre-wrap!important;overflow-y:auto!important}
:root.st-esc #stForm .st-capsula:not(.multi) textarea{white-space:nowrap;overflow:hidden!important}
/* 4. María: el campo al pie del panel; bienvenida y atajos arriba */
:root.st-esc .st-body .sop-panel>.sop-cuerpo{flex:1 1 0%!important;min-height:0}
:root.st-esc .st-body .sop-panel .sop-falla{margin-top:0}
/* 5. Resumen: «Actividad» con las últimas acciones */
.st-act{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.st-act li{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:start;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.st-act li:last-child{border-bottom:0}
.st-act-ic{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;background:var(--st-s2);color:var(--muted)}
.st-act-c{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:14px;line-height:1.4}
.st-act-c b{font-weight:600}
.st-act-d{font-size:12.5px;color:var(--muted)}
.st-act .st-linkbtn{min-height:28px;color:var(--accent);font:600 13px var(--body)}
:root.st-esc .st-der.st-desplazado>.st-col-cab{box-shadow:0 10px 18px -10px rgba(15,14,31,.45)!important;position:relative;z-index:3}
:root.st-esc[data-theme="dark"] .st-der.st-desplazado>.st-col-cab{box-shadow:0 10px 20px -8px rgba(0,0,0,.9)!important}
/* 6. Plantillas: sin el botón flotante; solo el desvanecido y 48 px de relleno abajo */
:root.st-esc .st-pls .st-pls-mas{display:none!important}
:root.st-esc .st-pls-c{padding-bottom:48px!important}
/* 7. 24 px entre «Entendí» y «Plan y precio» */
:root.st-esc #pEntendi{margin:0 0 24px!important}
/* 9. Pestañas del Inspector: «Historial» a 16 px del borde; con el menú ⋯ abierto, el Inspector se atenúa (nada asoma) */
:root.st-esc .st-itabs{gap:0!important;padding-left:12px!important;padding-right:16px!important;justify-content:space-between!important}
:root.st-esc .st-itabs [role="tab"]{padding-left:4px!important;padding-right:4px!important}
:root.st-esc body:has(#stMasMenu:not([hidden])) #colInspector{opacity:.25;transition:opacity .15s}
/* 10. Columna izquierda: lista, «Explorar plantillas» pegado y «Tu cuenta» al pie */
:root.st-esc .st-izq .st-explorar{order:0;margin-top:4px!important}
:root.st-esc .st-izq .st-lat-extra{margin-top:auto;padding-top:12px}
:root.st-esc .st-lat-plan>span{font-size:13px;color:var(--muted)}
:root.st-esc .st-lat-plan>span b{color:var(--ink)}
/* 12. Inicio: «Nueva app» del tamaño de una tarjeta; «Plantillas para ti» en el primer pliegue a 1440 */
:root.st-esc .si-app.si-app-nueva{grid-column:auto!important;align-self:stretch}
:root.st-esc .si-app-nueva .si-app-b{flex-direction:column!important;justify-content:center;align-items:center;text-align:center}
:root.st-esc .si-app-nueva .si-app-mini{width:56px!important;height:56px!important;border-radius:16px;background:var(--accent-soft)!important;display:flex;align-items:center;justify-content:center;aspect-ratio:auto!important}
:root.st-esc .si-c-esc{padding-top:32px!important}
:root.st-esc .si-c-esc .si-h1{font-size:clamp(34px,min(3.2vw,4.8vh),46px)!important}
:root.st-esc .si-c-esc .si-tusapps{margin-top:24px!important}
:root.st-esc .si .si-sec.si-parati{margin-top:32px!important}
:root.st-esc .si-app:not(.si-app-nueva) .si-app-mini{aspect-ratio:16/8!important}
:root.st-esc .si-app-pie{padding-top:6px}
/* 15. QR de Publicar: el texto debajo, 13 px y legible */
:root.st-esc #stPublicacion .st-qr,:root.st-esc #stQr{flex-direction:column!important;align-items:flex-start!important;gap:8px!important}
:root.st-esc #stPublicacion .st-qr span,:root.st-esc #stQr span{font-size:13px!important;color:var(--muted)!important;max-width:280px}
/* 16. Oscuro: lienzo neutro un nivel más claro que los paneles; celular con bisel negro y borde visible; sin borde verde-amarillo en Inicio */
:root.st-esc[data-theme="dark"] .st-centro{background:#18181D!important}
:root.st-esc[data-theme="dark"] .st-marco.movil,:root.st-esc[data-theme="dark"] .st-puerta-tel{border-color:#050509!important;background:#050509!important;box-shadow:0 0 0 1px rgba(255,255,255,.3),0 30px 70px -24px rgba(0,0,0,.8)!important}
:root.st-esc[data-theme="dark"] .st-marco.escritorio{box-shadow:0 0 0 1px rgba(255,255,255,.22),0 24px 60px -28px rgba(0,0,0,.8)!important}
:root.st-esc .si[data-ambiente="vivo"] .si-idea{background:linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(120deg,var(--accent),var(--accent-2,#818CF8),var(--accent)) border-box!important}
:root.st-esc[data-theme="dark"] .st-der .st-nota,:root.st-esc[data-theme="dark"] .st-der .st-muted,:root.st-esc[data-theme="dark"] .st-act-d{color:#A9A9B2}
/* 17. Cabecera: el logo en la rejilla del panel (14 px) y «Studio» de 13 px legible */
:root.st-esc:not(.st-en-inicio) body:not(.st-sin-sesion) header.st-top{padding-left:14px!important}
:root.st-esc .st-marca span{font-size:13px!important;font-weight:600;color:var(--muted)!important}
/* 18. Importar: el mismo control segmentado que el resto de modales */
:root.st-esc .st-imp-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;padding:3px;border:0!important;border-radius:10px;background:var(--st-s2);margin-bottom:14px}
:root.st-esc[data-theme="dark"] .st-imp-tabs{background:rgba(0,0,0,.25)}
:root.st-esc .st-imp-tabs button{min-height:34px!important;padding:0 8px!important;border:0!important;border-radius:8px;color:var(--muted);font:600 13px var(--body)}
:root.st-esc .st-imp-tabs button::after{display:none!important}
:root.st-esc .st-imp-tabs button[aria-selected="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(15,14,31,.18)}
/* 5 (ajuste r12): sombra visible bajo las pestañas fijas cuando el Inspector está desplazado */
:root.st-esc .st-der.st-desplazado>.st-col-cab::after{content:"";position:absolute;left:0;right:0;top:100%;height:14px;background:linear-gradient(rgba(15,14,31,.18),transparent);pointer-events:none;z-index:4}
:root.st-esc[data-theme="dark"] .st-der.st-desplazado>.st-col-cab::after{background:linear-gradient(rgba(0,0,0,.6),transparent)}
/* 9 (ajuste r12): las cinco pestañas caben con «Historial» a 16 px del borde también a 1440 */
@media (max-width:1679px){ :root.st-esc .st-itabs [role="tab"]{font-size:13.5px!important;padding-left:2px!important;padding-right:2px!important} :root.st-esc .st-itabs{padding-left:10px!important} }

/* ================= Cierre aprobado por el titular (3-nov-2026): cinco arreglos ================= */
/* 1. Pie fijo del Inspector con el precio y «Construir» (idea dimensionada) */
:root.st-esc .st-pie-insp{flex:none;display:flex;flex-direction:column;gap:8px;padding:12px 16px 14px;border-top:1px solid var(--line);background:var(--bg);box-shadow:0 -10px 20px -14px rgba(15,14,31,.35);position:relative;z-index:3}
:root.st-esc[data-theme="dark"] .st-pie-insp{background:#121216;box-shadow:0 -12px 22px -12px rgba(0,0,0,.8)}
:root.st-esc .st-pie-insp[hidden]{display:none}
.st-pie-precio{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:2px;margin:0;font-size:13px;color:var(--muted)}
.st-pie-plan{width:100%;font:600 13px var(--body);color:var(--ink)}
.st-pie-g{font:var(--w-tit) 20px/1.2 var(--display,var(--body));color:var(--ink)}
.st-pie-g small,.st-pie-g span{font-size:13px;font-weight:500;color:var(--muted)}
.st-pie-d b{color:var(--ink)}
.st-pie-nota{margin:0;font-size:12.5px;color:var(--muted)}
:root.st-esc .st-der.st-con-pie #stPlan [data-construir],:root.st-esc .st-der.st-con-pie #stPlan .st-recibo .st-nota{display:none!important}
:root.st-esc .st-der.st-con-pie #stPlan .st-recibo .st-plan-l,:root.st-esc .st-der.st-con-pie #stPlan .st-recibo .st-precio-g,:root.st-esc .st-der.st-con-pie #stPlan .st-recibo .st-precio-desp{display:none!important}
/* 2. Pestañas: 14 px entre ellas y 16 px al borde; «Historial» como ícono con su nombre en el globo */
:root.st-esc .st-itabs{gap:14px!important;justify-content:flex-start!important;padding-left:16px!important;padding-right:16px!important}
:root.st-esc .st-itabs [role="tab"]{padding-left:0!important;padding-right:0!important;font-size:13.5px!important}
:root.st-esc .st-itabs #itHistorial{width:28px;min-width:28px;margin-left:0;align-items:center}
:root.st-esc .st-itabs #itHistorial::before{display:none}
:root.st-esc .st-itabs .st-tab-ic{display:inline-flex;color:var(--muted)}
:root.st-esc .st-itabs #itHistorial[aria-selected="true"] .st-tab-ic{color:var(--ink)}
/* ⋯ abierto: el cuerpo del Inspector no asoma detrás del menú */
:root.st-esc body:has(#stMasMenu:not([hidden])) #colInspector{opacity:1!important}
:root.st-esc body:has(#stMasMenu:not([hidden])) #colInspector>.st-scroll,:root.st-esc body:has(#stMasMenu:not([hidden])) #colInspector>.st-pie-insp{visibility:hidden}
/* 3. Menú +: sus opciones reemplazan la línea del texto dentro del compositor (mismo alto, nunca sobre el celular) */
:root.st-esc #stForm .st-capsula>.st-comp-menu{position:static!important;order:2!important;flex:1 1 0%!important;min-width:0;display:flex;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center;gap:4px!important;margin:0!important;padding:0 2px!important;max-height:none!important;overflow:hidden!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;-webkit-mask-image:none!important;mask-image:none!important}
:root.st-esc #stForm .st-capsula>.st-comp-menu[hidden]{display:none!important}
:root.st-esc #stForm .st-capsula>.st-comp-menu button{flex:none;width:auto!important;height:36px!important;min-height:36px!important;padding:0 10px!important;gap:6px;border:1px solid var(--line)!important;border-radius:999px!important;background:var(--st-s1,var(--surface))!important;white-space:nowrap!important;font:500 13px var(--body)!important}
:root.st-esc #stForm .st-capsula:has(>.st-comp-menu:not([hidden]))>textarea,:root.st-esc #stForm .st-capsula:has(>.st-comp-menu:not([hidden])) #btnVoz,:root.st-esc #stForm .st-capsula:has(>.st-comp-menu:not([hidden])) .st-candado,:root.st-esc #stForm .st-capsula:has(>.st-comp-menu:not([hidden])) .st-enviar{display:none!important}
:root.st-esc #stForm .st-capsula:has(>.st-comp-menu:not([hidden])){box-shadow:0 1px 2px rgba(15,14,31,.06)!important}
@media (max-width:1365px){ :root.st-esc #stForm .st-capsula>.st-comp-menu button{padding:0 8px!important;gap:4px} :root.st-esc #stForm .st-capsula>.st-comp-menu button .ico-w svg{width:16px;height:16px} }
/* 5. Miniaturas: una mini app distinta por forma */
.si-mk{display:flex!important;flex-direction:column;gap:6px}
.si-mk .mk-cab{flex:none}
.si-mk .mk-t,.si-mk .mk-p{display:block;height:5px;border-radius:3px;background:color-mix(in srgb,var(--ink) 22%,transparent)}
.si-mk .mk-p{background:var(--mk)}
.si-mk .mk-rej{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;flex:1}
.si-mk .mk-prod{display:flex;flex-direction:column;gap:4px;padding:4px;border-radius:6px;background:var(--surface)}
.si-mk .mk-foto{display:block;flex:1;min-height:28px;border-radius:4px;background:linear-gradient(135deg,color-mix(in srgb,var(--mk) 70%,#fff),var(--mk))}
.si-mk .mk-prod .mk-t{width:80%}.si-mk .mk-prod .mk-p{width:45%}
.si-mk .mk-chips{display:flex;gap:4px}.si-mk .mk-chips>i{width:26px;height:9px;border-radius:5px;background:color-mix(in srgb,var(--mk) 35%,var(--surface))}.si-mk .mk-chips>i:first-child{background:var(--mk)}
.si-mk .mk-li{display:flex;justify-content:space-between;align-items:center;height:14px;padding:0 6px;border-radius:5px;background:var(--surface)}
.si-mk .mk-dias{display:grid;grid-template-columns:repeat(5,1fr);gap:4px}.si-mk .mk-dias>i{height:16px;border-radius:5px;background:var(--surface)}.si-mk .mk-dias>i:nth-child(2){background:var(--mk)}
.si-mk .mk-hora{display:flex;align-items:center;gap:6px}.si-mk .mk-h{width:22px;height:5px;border-radius:3px;background:color-mix(in srgb,var(--ink) 25%,transparent)}.si-mk .mk-slot{flex:1;height:14px;border-radius:5px;background:var(--surface);border-left:3px solid var(--mk)}
.si-mk .mk-b{height:14px;border-radius:8px}.si-mk .mk-b1{width:62%;background:var(--surface)}.si-mk .mk-b2{width:46%;align-self:flex-end;background:var(--mk)}.si-mk .mk-b3{width:70%;background:var(--surface)}.si-mk .mk-b4{width:38%;align-self:flex-end;background:var(--mk)}
.si-mk .mk-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.si-mk .mk-kpis>i{height:16px;border-radius:5px;background:var(--surface)}
.si-mk-tablero .mk-barras{flex:1;height:auto!important;min-height:30px}
.si-mk .mk-planes{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;flex:1}.si-mk .mk-planes>i{border-radius:6px;background:var(--surface)}.si-mk .mk-planes>i.on{background:var(--mk);transform:translateY(-3px)}
.si-mk .mk-gal{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;gap:4px;flex:1}.si-mk .mk-gal>i{border-radius:4px;background:linear-gradient(135deg,color-mix(in srgb,var(--mk) 55%,#fff),var(--mk))}
.si-mk-web .mk-hero{display:flex!important;flex-direction:column;justify-content:flex-end;gap:5px;padding:8px;height:auto!important;flex:1}.si-mk-web .mk-hero .mk-t{width:55%;background:rgba(255,255,255,.85)}.si-mk-web .mk-btn{display:block;width:30%;height:9px;border-radius:5px;background:#fff}
.si-mk .mk-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.si-mk .mk-cols>i{height:14px;border-radius:5px;background:var(--surface)}
/* Cierre: master abre María sola al entrar al Studio (≥ 1100 px). El compositor sigue a la vista con María abierta y el Inicio
   se estrecha para no quedar debajo del panel. */
:root.st-esc.st-maria #stForm{visibility:visible!important}
:root.st-esc.st-maria .si{right:clamp(340px,19vw,360px)}

/* ================= Ronda 14 del juez (3-nov-2026) ================= */
/* 1. Menú ⋯: el Inspector queda intacto debajo de un velo; el menú flota encima a 16 px del borde */
:root.st-esc body:has(#stMasMenu:not([hidden])) #colInspector>.st-scroll,:root.st-esc body:has(#stMasMenu:not([hidden])) #colInspector>.st-pie-insp{visibility:visible!important}
:root.st-esc #colInspector{position:relative}
:root.st-esc body:has(#stMasMenu:not([hidden])) #colInspector::after{content:"";position:absolute;inset:0;z-index:5;background:color-mix(in srgb,var(--bg) 55%,transparent);pointer-events:none}
:root.st-esc .st-top-der .st-masop-menu{right:16px!important;z-index:70}
/* 15. Menú ⋯: separadores iguales antes de cada sección */
:root.st-esc #stMasMenu>*{border-top:0!important;border-bottom:0!important}
:root.st-esc #stMasMenu>.st-masop-saldo{border-bottom:1px solid var(--line)!important;margin-bottom:4px}
:root.st-esc #stMasMenu>#stMasVistaL,:root.st-esc #stMasMenu>.st-masop-k-id,:root.st-esc #stMasMenu>#stMasTema{border-top:1px solid var(--line)!important;margin-top:6px!important;padding-top:10px!important}
:root.st-esc #stMasMenu .st-masop-vista,:root.st-esc #stMasMenu .idioma{display:grid!important;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
/* 2. Marco de la vista previa: recorte limpio de las esquinas */
:root.st-esc .st-marco.escritorio{overflow:hidden;border-radius:12px;isolation:isolate}
:root.st-esc .st-marco.escritorio .st-iframe{border-radius:12px;overflow:hidden}
/* 5. El pie fijo del plan nunca tapa la última fila */
:root.st-esc .st-der.st-con-pie>.st-scroll{padding-bottom:24px!important;scroll-padding-bottom:24px}
/* 6. Calidad: «Ver ensayo en vivo» siempre alcanzable (fijo al pie del panel) */
:root.st-esc #stCalidad .st-ensayo-b{position:sticky;bottom:0;z-index:2;margin-top:12px;background:var(--surface);box-shadow:0 -14px 16px -6px var(--bg)}
/* 10. Calidad: el ensayo en una sola fila */
:root.st-esc #stCalidad .st-ens-fila{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
/* 11. «Entendí»: el «+N» queda en la fila del último chip */
:root.st-esc #pEntendi .st-entendi:not(.abierta) .st-ent-lista{flex-wrap:nowrap!important;min-width:0;max-width:100%}
:root.st-esc #pEntendi .st-entendi:not(.abierta) .st-ent{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root.st-esc #pEntendi .st-ent-mas{flex:none!important}
/* 12. Frase del plan como filas etiqueta–valor alineadas */
:root.st-esc #stFrase{display:grid!important;grid-template-columns:max-content minmax(0,1fr);align-items:center;column-gap:10px;row-gap:8px;line-height:1.3}
:root.st-esc #stFrase .st-hueco-w{justify-self:start}
:root.st-esc #stFrase .st-hueco-w+span::before{display:none!important}
/* 13. «Compartir» apagado: su razón en un globo al pasar */
:root.st-esc #stPublicar{position:relative}
:root.st-esc #stPublicar[disabled][data-tip]:hover::after{content:attr(data-tip);position:absolute;top:calc(100% + 8px);right:0;z-index:80;white-space:nowrap;padding:6px 10px;border-radius:8px;background:var(--ink);color:var(--bg);font:500 12.5px var(--body);box-shadow:0 8px 20px -8px rgba(0,0,0,.4);pointer-events:none}
/* 14. Tipografía de las barras laterales en tres niveles */
:root.st-esc .st-izq .st-h3,:root.st-esc .st-izq .st-col-cab h2,:root.st-esc .st-der .st-panel>summary.st-h3{font:600 12px/1.3 var(--body)!important;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
:root.st-esc .st-izq .st-app .nom,:root.st-esc .st-izq .st-explorar,:root.st-esc .st-izq .st-nueva{font:500 14px var(--body)!important}
:root.st-esc .st-izq .st-lat-plan>span,:root.st-esc .st-act-d,:root.st-esc .st-fila>span:first-child{font:400 12px var(--body)!important;color:var(--muted)}
:root.st-esc .st-pie-plan{font:700 14px var(--body)!important;color:var(--accent)!important}
/* 9. María: un solo foco de escritura, cabecera alineada con las pestañas, sin hueco antes de los atajos */
:root.st-esc.st-maria body:has(#sopIn:focus) #stForm{opacity:.55;transition:opacity .15s}
:root.st-esc .st-body .sop-panel .sop-cab{height:44px!important;min-height:44px!important;box-sizing:border-box;padding-top:0!important;padding-bottom:0!important;align-items:center}
:root.st-esc .st-body .sop-panel .sop-cab #sopFalla{display:none!important}
:root.st-esc .st-body .sop-panel #sopLog:empty,:root.st-esc .st-body .sop-panel #sopLog{min-height:0!important;margin:0!important;padding-top:0!important}
:root.st-esc .st-body .sop-panel .sop-bienv{margin-bottom:12px!important}
:root.st-esc .st-body .sop-panel .sop-rapidas.st-oculto{display:none!important}
:root.st-esc .sop-mas{position:relative;display:inline-flex}
:root.st-esc .sop-mas-b span{font-size:18px;line-height:1}
:root.st-esc .sop-mas-menu{position:absolute;top:calc(100% + 6px);right:0;z-index:30;min-width:220px;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 16px 36px -12px rgba(15,14,31,.45)}
:root.st-esc .sop-mas-menu[hidden]{display:none}
:root.st-esc .sop-mas-menu button{display:flex;align-items:center;gap:8px;width:100%;min-height:36px;padding:0 10px;border:0;border-radius:8px;background:none;color:var(--ink);font:500 14px var(--body);cursor:pointer}
:root.st-esc .sop-mas-menu button:hover{background:var(--st-s2)}
:root.st-esc .sop-proy{display:flex;flex-direction:column;align-items:stretch;gap:6px;margin:0 0 8px}
:root.st-esc .sop-proy[hidden]{display:none}
:root.st-esc .sop-proy button{min-height:36px;padding:7px 12px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--ink);font:500 13.5px/1.35 var(--body);text-align:left;cursor:pointer}
:root.st-esc .sop-proy button:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
/* 8. Inicio: columna más ancha a 1920, sin «Nueva app», apps en fila compacta si son pocas, plantillas en el primer pliegue */
@media (min-width:1700px){ :root.st-esc .si-c-esc{max-width:1160px!important} }
:root.st-esc .si-c-esc{padding-top:28px!important}
:root.st-esc .si-c-esc .si-tusapps{margin-top:20px!important}
:root.st-esc .si .si-sec.si-parati{margin-top:24px!important}
:root.st-esc .si-apps.si-apps-pocas{grid-template-columns:repeat(2,minmax(0,1fr))!important}
:root.st-esc .si-apps-pocas .si-app-b{flex-direction:row!important;align-items:stretch}
:root.st-esc .si-apps-pocas .si-app-mini{--si-ifw:520;flex:none;width:200px!important;aspect-ratio:auto!important;height:auto!important;min-height:120px;border-bottom:0!important;border-right:1px solid var(--line)}
:root.st-esc .si-apps-pocas .si-app-if{width:520px!important;height:400px!important}
:root.st-esc .si-apps-pocas .si-app-c{padding:14px 16px 4px!important}
:root.st-esc .si-apps-pocas .si-app-pie{padding:0 16px 12px!important}
:root.st-esc[data-theme="dark"] .si-c-esc .si-idea{box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 18%,transparent),0 18px 44px -24px rgba(0,0,0,.55)!important}

/* Ronda 14 (ajustes): frase del plan en 14,5 px sin partir los selectores; atajos de María dentro del margen del panel */
:root.st-esc #stFrase,:root.st-esc #stFrase .st-hueco{font-size:14.5px!important}
:root.st-esc #stFrase .st-hueco .t{white-space:nowrap}
:root.st-esc .st-body .sop-panel .sop-proy{margin:0 16px 8px!important;padding:0!important;border:0!important;background:none!important}
:root.st-esc .sop-mas-b{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center}
/* 8 (ajuste r14): miniaturas de plantillas más bajas para que «Plantillas para ti» entre en el primer pliegue */
:root.st-esc .si-pt-mk .si-mk{aspect-ratio:16/7!important}
:root.st-esc .si-pt-mk .si-pt-c span{-webkit-line-clamp:1!important}
:root.st-esc #stFrase{grid-template-columns:max-content minmax(0,max-content)}
:root.st-esc #stFrase .st-hueco-w{max-width:100%}
:root.st-esc #stFrase .st-hueco .t{overflow:hidden;text-overflow:ellipsis}

/* ================= Ronda 15 del juez (3-nov-2026) ================= */
/* 1. Riel plegado: solo un «+» de 32 px centrado (el texto queda para lectores de pantalla y el globo) */
:root.st-esc.st-plegado .st-izq .st-nueva{width:32px!important;height:32px!important;min-height:32px!important;padding:0!important;font-size:0!important;border-radius:10px!important;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;align-self:center}
:root.st-esc.st-plegado .st-izq .st-nueva::before{content:"+";font:500 20px/1 var(--body)}
:root.st-esc.st-plegado .st-izq .st-lat-hers,:root.st-esc.st-plegado .st-izq .st-lat-t{display:none!important}
/* 2. Inicio: cabecera y contenido en el mismo contenedor (mismo ancho máximo y margen) */
:root.st-esc.st-en-inicio{--si-col:960px}
@media (min-width:1700px){ :root.st-esc.st-en-inicio{--si-col:1160px} }
:root.st-esc.st-en-inicio header.st-top{padding-left:max(16px,calc((100vw - var(--si-col)) / 2))!important;padding-right:max(12px,calc((100vw - var(--si-col)) / 2))!important}
:root.st-esc .si-c-esc{max-width:var(--si-col,960px)!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important;padding-bottom:32px!important}
/* 3. «Entendí»: las fichas pasan a otra línea completas (nunca cortadas a mitad de palabra) */
:root.st-esc #pEntendi .st-entendi:not(.abierta) .st-ent-lista,:root.st-esc #pEntendi .st-ent-lista{flex-wrap:wrap!important}
:root.st-esc #pEntendi .st-ent{flex:0 0 auto!important;max-width:100%;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
/* 4. María: el título con el peso de los títulos del Inspector y 8 px hasta su «⋯» */
:root.st-esc .st-body .sop-panel .sop-tit{min-width:0;margin-right:8px}
:root.st-esc .st-body .sop-panel .sop-tit b{font:600 15px/1.2 var(--body)!important;letter-spacing:0;text-decoration:none!important}
:root.st-esc .st-body .sop-panel .sop-mas{margin-left:auto}
:root.st-esc .st-body .sop-panel .sop-mas-b{position:relative;z-index:1}
/* 5. Pestañas del Inspector: la misma raya en todas (sombra inferior del propio botón, sin depender del pseudo-elemento) */
:root.st-esc .st-itabs [role="tab"][aria-selected="true"]::after{display:none!important}
:root.st-esc .st-itabs [role="tab"][aria-selected="true"]{box-shadow:inset 0 -2.5px 0 var(--st-pri,var(--accent))!important}
:root.st-esc .st-itabs [role="tab"]:first-child{margin-left:0!important}
/* 6. Oscuro: mismo grosor de letra que en claro, etiquetas AA y velo de modales menos opaco */
:root.st-esc body,:root.st-esc[data-theme="dark"] body{-webkit-font-smoothing:antialiased!important;-moz-osx-font-smoothing:grayscale!important;text-rendering:optimizeLegibility}
:root.st-esc[data-theme="dark"] .st-izq .st-h3,:root.st-esc[data-theme="dark"] .st-izq .st-col-cab h2{color:#ADADB5!important}
:root.st-esc[data-theme="dark"] dialog::backdrop,:root.st-esc[data-theme="dark"] dialog.st-pls::backdrop,:root.st-esc[data-theme="dark"] #dlgImportar::backdrop,:root.st-esc[data-theme="dark"] #dlgPaleta::backdrop{background:rgba(2,2,8,.58)!important}
/* 7. Fechas sin partir */
:root.st-esc .st-plan-l1 span[data-no-i18n]{white-space:nowrap}
/* 8. Botones apagados: el mismo botón principal, al 45 % y con cursor no permitido */
:root.st-esc #dlgImportar #btnImpSubir:disabled,:root.st-esc #stPublicar:disabled,:root.st-esc:not([data-theme="dark"]) #dlgImportar #btnImpSubir:disabled,:root.st-esc:not([data-theme="dark"]) #stPublicar:disabled,:root.st-esc[data-theme="dark"] #dlgImportar #btnImpSubir:disabled,:root.st-esc[data-theme="dark"] #stPublicar:disabled{background:var(--st-pri,var(--accent))!important;border:1px solid var(--st-pri,var(--accent))!important;color:var(--st-pri-ink,#fff)!important;opacity:.45!important;cursor:not-allowed!important;box-shadow:none!important}
/* 9. Modal de plantillas: degradado y relleno al pie; a 1280 todas las categorías siguen en orden (dos columnas que envuelven) */
:root.st-esc .st-pls{position:relative}
:root.st-esc .st-pls::after{content:"";position:absolute;left:1px;right:1px;bottom:1px;height:64px;border-radius:0 0 16px 16px;background:linear-gradient(to bottom,transparent,var(--surface) 90%);pointer-events:none;z-index:3}
:root.st-esc .st-pls-c{padding-bottom:72px!important}
@media (max-width:1439px){ :root.st-esc .st-pls #stPlantillas{grid-template-columns:repeat(2,minmax(0,1fr))!important} }
/* 10. Portada sin sesión: botones de 36 px; a 1920 el texto centrado con el celular */
:root.st-esc body.st-sin-sesion header #btnEntrar,:root.st-esc body.st-sin-sesion header #btnRegistro{height:36px!important;min-height:36px!important;padding-top:0!important;padding-bottom:0!important;display:inline-flex;align-items:center}
@media (min-width:1700px){ :root.st-esc .st-puerta{align-items:center!important} :root.st-esc .st-puerta-c{align-self:center!important;margin-top:0!important} }
/* 11. 1280: Inspector de 300 px para que el celular entre entero */
@media (max-width:1365px){
  :root.st-esc .st{--st-der:300px!important;--st-izq:228px!important}
  :root.st-esc .st-body .sop-panel{width:300px!important}
}
/* 12. Panel izquierdo: «Herramientas» bajo «Mis apps» y el uso de la cuenta al pie */
:root.st-esc .st-lat-extra{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}
:root.st-esc .st-lat-t{margin:16px 0 4px!important}
:root.st-esc .st-lat-hers{display:flex;flex-direction:column;gap:2px}
:root.st-esc .st-lat-her{text-decoration:none;color:var(--ink)}
:root.st-esc .st-lat-extra .st-lat-plan{margin-top:auto;display:grid!important;grid-template-columns:1fr auto;align-items:center;row-gap:4px}
:root.st-esc .st-lat-uso{grid-column:1/-1;font:400 12px var(--body);color:var(--muted)}
:root.st-esc .st-izq .st-lat-extra{margin-top:0!important;padding-top:0}
/* 13. Inicio: rejilla de 3 (4 a 1920) con tarjetas del mismo tamaño; «+ Nueva app» y «Actividad reciente» llenan la fila */
:root.st-esc .si-apps .si-app{min-height:0}
:root.st-esc .si-app.si-app-nueva.si-app-igual{grid-column:auto!important;border:1px solid var(--line)!important;border-style:solid!important;background:var(--surface)!important}
:root.st-esc .si-app-nueva.si-app-igual .si-app-b{height:100%;flex-direction:column!important;justify-content:center;align-items:center;text-align:center;gap:8px}
:root.st-esc .si-app-nueva.si-app-igual .si-app-mini{width:48px!important;height:48px!important;aspect-ratio:auto!important;border-radius:14px;border:0!important;background:var(--accent-soft)!important;display:flex;align-items:center;justify-content:center}
:root.st-esc .si-app-act{border:1px solid var(--line);border-radius:16px;background:var(--surface)}
:root.st-esc .si-act{display:flex;flex-direction:column;gap:10px;height:100%;padding:16px;box-sizing:border-box}
:root.st-esc .si-act-t{font:600 15px var(--body)}
:root.st-esc .si-act ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
:root.st-esc .si-act li{display:flex;flex-direction:column;gap:2px;font-size:13px;color:var(--muted)}
:root.st-esc .si-act li b{color:var(--ink);font:600 14px var(--body)}
:root.st-esc .si-act .si-link{margin-top:auto;font-size:13px}
:root.st-esc .si-nw{white-space:nowrap}
/* 14. Resumen: estado arriba más fuerte; «Actividad» como lista ligera */
:root.st-esc #pResumen .st-rs-b1{padding:14px!important;border:1px solid var(--line)!important;border-radius:14px;background:var(--st-s1,var(--surface))}
:root.st-esc #pResumen .st-rs-l1{font-size:15px}
:root.st-esc #pResumen .st-rs-l1 .st-estado{height:24px!important;font-size:13px!important;padding:0 10px!important}
:root.st-esc #pResumen .st-rs-b1 .st-enlace-e{margin-top:10px}
:root.st-esc .st-act li{grid-template-columns:minmax(0,1fr) auto!important;padding:8px 0!important;border-bottom:0!important}
:root.st-esc .st-act-ic{display:none!important}
:root.st-esc .st-act li+li{border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent)}
/* 15. María: contexto del proyecto arriba y las sugerencias junto al campo */
:root.st-esc .sop-ctx{margin:12px 16px 0;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--st-s1,var(--surface))}
:root.st-esc .sop-ctx[hidden]{display:none}
:root.st-esc .sop-ctx-t{margin:0;font:600 12px/1.3 var(--body);letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
:root.st-esc .sop-ctx-t+.sop-ctx-l{margin:4px 0 10px}
:root.st-esc .sop-ctx-l{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:14px;color:var(--ink)}
:root.st-esc .sop-ctx-l:last-child{margin-bottom:0}
:root.st-esc .st-body .sop-panel>.sop-cuerpo{display:flex!important;flex-direction:column}
:root.st-esc .st-body .sop-panel .sop-proy{margin-top:auto!important}
/* 16. Escala de alto de botones: 32 en barras, 36 secundarios y cabecera, 44 principales */
:root.st-esc .st-centro>.st-col-cab .st-ic,:root.st-esc #stForm .st-capsula .st-ic,:root.st-esc #stForm .st-candado{height:32px!important;min-height:32px!important}
:root.st-esc header.st-top .st-btn,:root.st-esc header.st-top .st-ic,:root.st-esc header.st-top #stPublicar,:root.st-esc .st-btn:not(.primario):not(.ancho),:root.st-esc .st-enlace-e .st-btn{height:36px!important;min-height:36px!important}
:root.st-esc .st-btn.primario.ancho,:root.st-esc #stPieInsp [data-pie-construir],:root.st-esc .si-crear{min-height:44px!important}
/* Ronda 15 (ajustes tras el repaso) */
:root.st-esc .st-itabs [role="tab"]{border-radius:0!important}
:root.st-esc #pEntendi .st-ent *{white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
@media (max-width:1365px){
  :root.st-esc .st{--st-izq:240px!important}
  :root.st-esc .st-itabs{gap:10px!important;padding-left:12px!important;padding-right:16px!important}
  :root.st-esc .st-itabs [role="tab"]{font-size:13px!important}
  :root.st-esc #stFrase{grid-template-columns:minmax(0,1fr)!important;row-gap:4px}
  :root.st-esc #stFrase .st-hueco-w{margin-bottom:6px}
  :root.st-esc #pResumen .st-rs-l1{font-size:14px;gap:6px}
}

/* ================= Ronda 16 del juez (3-nov-2026) ================= */
/* 2. Cabecera de María: «←» con globo, nombre entero y un solo «⋯» (Nueva conversación, Abrir aparte, Reportar) */
:root.st-esc .st-body .sop-panel .sop-cab #sopNueva,:root.st-esc .st-body .sop-panel .sop-cab #sopCompleta{display:none!important}
:root.st-esc .st-body .sop-panel .sop-volver{width:36px;min-width:36px;height:36px;padding:0;justify-content:center;font-size:18px}
:root.st-esc .st-body .sop-panel .sop-tit{flex:1 1 auto;min-width:0;overflow:visible}
:root.st-esc .st-body .sop-panel .sop-tit b{white-space:nowrap}
:root.st-esc .st-body .sop-panel .sop-mas{margin-left:0}
:root.st-esc .st-body .sop-panel .sop-barra{margin-bottom:16px!important}
/* 3. María: saludo y preguntas del proyecto arriba, nada pegado al fondo */
:root.st-esc .st-body .sop-panel .sop-proy{margin:0 16px 8px!important}
:root.st-esc .st-body .sop-panel>.sop-cuerpo{justify-content:flex-start}
/* 4. Enlace: «Copiar» del alto del campo */
:root.st-esc #colInspector .st-enlace-e>code,:root.st-esc #colInspector .st-enlace-e>.st-btn{height:36px!important;min-height:36px!important}
/* 5. Calidad: un veredicto que no parte; «Ver ensayo en vivo» fijo y opaco */
:root.st-esc #stCalidad .st-veredicto{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:14px}
:root.st-esc #stCalidad .st-veredicto .st-nw{white-space:nowrap}
:root.st-esc #stCalidad .st-ensayo-b{background:var(--surface)!important;border:1px solid var(--line)!important;box-shadow:0 -12px 16px -4px var(--bg),0 -1px 0 var(--line)!important;opacity:1!important}
:root.st-esc[data-theme="dark"] #stCalidad .st-ensayo-b{background:#1C1C21!important}
/* 6. Pie del plan con sombra superior y relleno que no tapa la tabla; «cuenta» separado del ⓘ */
:root.st-esc .st-pie-insp{box-shadow:0 -1px 0 var(--line),0 -14px 22px -14px rgba(15,14,31,.4)!important}
:root.st-esc .st-der.st-con-pie>.st-scroll{padding-bottom:var(--st-pie-h,180px)!important}
:root.st-esc .st-pie-g [data-tip],:root.st-esc .st-pie-g .st-info,:root.st-esc .st-pie-g button{margin-left:4px}
/* 7. Paleta: coincidencia en violeta tenue */
:root.st-esc .st-paleta-l mark,:root.st-esc[data-theme="dark"] .st-paleta-l mark{background:color-mix(in srgb,var(--accent) 22%,transparent)!important;color:inherit!important;font-weight:700}
/* 8. Oscuro: halo del celular; velo de modales ≥ 60 % con desenfoque en ambos temas */
:root.st-esc[data-theme="dark"] .st-marco.movil{box-shadow:0 0 0 1px rgba(255,255,255,.28),0 0 0 6px rgba(124,58,237,.10),0 30px 70px -24px rgba(0,0,0,.8)!important}
:root.st-esc dialog::backdrop,:root.st-esc dialog.st-pls::backdrop,:root.st-esc #dlgImportar::backdrop,:root.st-esc #dlgPaleta::backdrop{background:rgba(15,14,31,.6)!important;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
:root.st-esc[data-theme="dark"] dialog::backdrop,:root.st-esc[data-theme="dark"] dialog.st-pls::backdrop,:root.st-esc[data-theme="dark"] #dlgImportar::backdrop,:root.st-esc[data-theme="dark"] #dlgPaleta::backdrop{background:rgba(2,2,8,.62)!important;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
/* 9. Menú ⋯: cubre la fila entera de pestañas, sin íconos asomando */
:root.st-esc .st-top-der .st-masop-menu{right:8px!important}
/* 11. Barra izquierda: títulos al mismo x; ítems con el texto al mismo x; tarjeta de cuenta a 13 px */
:root.st-esc .st-izq .st-h3,:root.st-esc .st-izq .st-lat-t{padding-left:4px!important;margin-left:0!important}
:root.st-esc .st-izq .st-lat-plan,:root.st-esc .st-izq .st-lat-plan *{font-size:13px!important}
:root.st-esc .st-izq .st-lat-plan .st-lat-uso,:root.st-esc .st-izq .st-lat-plan .st-lat-uso *{font-size:12px!important}
/* 12. Portada: el celular recorta la app con su mismo radio (sin esquinas que asomen) */
:root.st-esc .st-puerta-tel{overflow:hidden!important;isolation:isolate}
:root.st-esc .st-puerta-tel iframe{border-radius:34px;clip-path:inset(0 round 34px)}
/* 13. Resumen: «Compartir por WhatsApp» como acción secundaria llena bajo el estado; visitas de 7 días y QR pequeño */
:root.st-esc #pResumen .st-rs-wa{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;margin-top:10px;height:40px!important;min-height:40px!important;border-radius:10px;background:color-mix(in srgb,var(--accent) 12%,var(--surface))!important;border:1px solid color-mix(in srgb,var(--accent) 30%,var(--line))!important;color:var(--ink)!important;font:600 14px var(--body);text-decoration:none}
:root.st-esc #pResumen .st-rs-wa:hover{background:color-mix(in srgb,var(--accent) 20%,var(--surface))!important}
:root.st-esc #pResumen .st-rs-ancho{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:start}
:root.st-esc #pResumen .st-rs-vis7 .st-v7{display:block;width:100%;height:36px;color:var(--muted)}
:root.st-esc #pResumen .st-v7-t,:root.st-esc #pResumen .st-v7-n{margin:6px 0 0;font-size:13px;color:var(--muted)}
:root.st-esc #pResumen .st-v7-n b{color:var(--ink);font-size:20px}
:root.st-esc #pResumen .st-rs-qrmini .st-h3{display:none}
:root.st-esc #pResumen .st-rs-qrmini .st-qr-u{flex-direction:column;align-items:center;gap:4px}
:root.st-esc #pResumen .st-rs-qrmini img{width:84px!important;height:84px!important}
:root.st-esc #pResumen .st-rs-qrmini span{display:none}
:root.st-esc .st-filas-l .st-filab{border:0!important;padding-left:0;background:none!important}
:root.st-esc .st-filas-l{border:0!important;background:none!important}
:root.st-esc .st-filas-l .st-sig-ic{width:28px;height:28px}
/* 15. Inicio: «Actividad reciente» del alto de su contenido; compositor de una línea */
:root.st-esc .si-app-act{align-self:start}
:root.st-esc .si-act li{flex-direction:row!important;justify-content:space-between;gap:12px}
:root.st-esc .si-act li span{color:var(--muted)}
:root.st-esc .si-c-esc .si-idea{min-height:0!important;padding-top:10px!important;padding-bottom:10px!important;align-items:center!important}
:root.st-esc .si-c-esc .si-idea textarea{min-height:44px!important;height:44px;padding-top:10px!important;padding-bottom:10px!important}
/* 16. Modal de plantillas: columnas balanceadas */
@media (min-width:1440px){
  :root.st-esc .st-pls #stPlantillas{display:block!important;columns:3;column-gap:24px}
  :root.st-esc .st-pls #stPlantillas>.st-cat{break-inside:avoid;margin:0 0 16px!important;display:block}
  :root.st-esc .st-pls #stPlantillas>.st-densos,:root.st-esc .st-pls #stPlantillas>.st-sug,:root.st-esc .st-pls #stPlantillas>.st-vacia{column-span:all}
}
:root.st-esc .st-pls #stPlantillas>.st-densos>.st-mas{display:none!important}
@media (min-width:1440px){ :root.st-esc .st-pls #stPlantillas>.st-sug{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:16px} :root.st-esc .st-pls #stPlantillas>.st-sug>.st-cat-t{grid-column:1/-1} }

/* ================= Ronda 17 del juez (3-nov-2026) ================= */
/* 1. Resumen: visitas como una línea en la tarjeta de estado */
:root.st-esc #pResumen .st-rs-vis-l{margin:8px 0 0;font-size:13px;color:var(--muted)}
:root.st-esc #pResumen .st-rs-vis-l b{color:var(--ink)}
/* 9. Estado y pruebas siempre en la misma línea; sin doble línea bajo la tarjeta */
:root.st-esc #pResumen .st-rs-l1{flex-wrap:nowrap!important;white-space:nowrap;gap:8px!important;font-size:14px!important}
:root.st-esc #pResumen .st-rs-l1 .st-rs-pr{min-width:0;overflow:hidden;text-overflow:ellipsis}
:root.st-esc #pResumen .st-rs-b1+.st-rs-b{border-top:0!important}
/* 2. Pestañas del Inspector a ≤ 1365 px: 13 px, sin espacios de más; el reloj a ≥ 12 px del borde */
@media (max-width:1365px){
  :root.st-esc .st-itabs{gap:8px!important;padding-left:10px!important;padding-right:14px!important}
  :root.st-esc .st-itabs [role="tab"]{font-size:13px!important;letter-spacing:-.01em}
  :root.st-esc .st-itabs #itHistorial{width:24px;min-width:24px}
}
/* 3. Un solo componente de fila para «Más pasos» (Resumen) y «Crecer» (Publicar) */
:root.st-esc #colInspector .st-filas .st-filab{display:grid!important;grid-template-columns:28px minmax(0,1fr) 16px;align-items:center;gap:10px;min-height:52px;padding:8px 10px!important;border:0!important;border-radius:10px;background:none!important;text-align:left}
:root.st-esc #colInspector .st-filas .st-filab:hover{background:var(--st-s2)!important}
:root.st-esc #colInspector .st-filas{display:flex;flex-direction:column;gap:2px;border:0!important;background:none!important;padding:0!important}
:root.st-esc #colInspector .st-filas .st-sig-ic,:root.st-esc #colInspector .st-filas .ico-w:first-child{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:var(--st-s2)}
:root.st-esc #colInspector .st-filas .st-sig-c{display:flex;flex-direction:column;min-width:0}
:root.st-esc #colInspector .st-filas .st-sig-c b{font:600 14px var(--body)}
:root.st-esc #colInspector .st-filas .st-sig-c small,:root.st-esc #colInspector .st-filas .st-filab small{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 4. Calidad: «Aprobada» grande sobre la línea de cifras */
:root.st-esc #stCalidad .st-veredicto{display:grid!important;grid-template-columns:auto minmax(0,1fr);column-gap:10px;row-gap:2px;align-items:center;padding:14px!important;border:1px solid color-mix(in srgb,var(--ok) 35%,var(--line))!important;border-radius:12px;background:color-mix(in srgb,var(--ok) 10%,var(--surface))!important}
:root.st-esc #stCalidad .st-veredicto .st-sello-ic{grid-row:1/3}
:root.st-esc #stCalidad .st-veredicto .st-ver-t{font:700 18px/1.2 var(--body);color:var(--ink)}
:root.st-esc #stCalidad .st-veredicto .st-ver-l{display:flex;gap:6px;white-space:nowrap;font-size:13.5px;color:var(--muted)}
:root.st-esc #stCalidad .st-veredicto .st-ver-l .st-nw+.st-nw::before{content:"·";margin-right:6px}
:root.st-esc #stCalidad .st-veredicto .st-ver-l>span[aria-hidden]{display:none}
:root.st-esc #stCalidad .st-veredicto .st-ver-l b{color:var(--ink)}
/* 5. Inicio: actividad agrupada por app; tarjetas de la fila del mismo alto; «Nueva app» estrecha */
:root.st-esc .si-apps.si-rejilla{align-items:stretch!important}
:root.st-esc .si-app-act{align-self:stretch!important}
:root.st-esc .si-act ul{gap:6px}
:root.st-esc .si-act-app{flex-direction:column!important;gap:4px}
:root.st-esc .si-act-app>b{font:600 14px var(--body);color:var(--ink)}
:root.st-esc .si-act-app>ul{display:flex;flex-direction:column;gap:4px;padding-left:10px;border-left:2px solid var(--line)}
:root.st-esc .si-act-app>ul>li{flex-direction:row!important;justify-content:space-between;font-size:13px}
:root.st-esc .si-app-nueva.si-app-igual .si-app-c{align-items:center;text-align:center}
/* 6. Menú ⋯: sin lo que ya está en el panel izquierdo; a la derecha sin tapar la barra de la vista previa */
:root.st-esc #stMasMenu>[data-mas="btnImportar"],:root.st-esc #stMasMenu>a[href="/estudio"],:root.st-esc #stMasMenu>a[href="/studio/agencia"]{display:none!important}
/* 7. Plantillas a 1280: título de proyectos grandes en su fila; sugeridas también en dos columnas */
@media (max-width:1439px){
  :root.st-esc .st-pls #stPlantillas>.st-sug{display:grid!important;grid-column:1/-1;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}
  :root.st-esc .st-pls #stPlantillas>.st-sug>.st-cat-t{grid-column:1/-1}
}
:root.st-esc .st-pls #stPlantillas>.st-densos>.st-cat-t{grid-column:1/-1!important}
:root.st-esc .st-pls #stPlantillas>.st-densos{grid-template-columns:repeat(2,minmax(0,1fr))!important}
/* 8. Compositor con texto largo: hasta 4 líneas con desplazamiento, crece hacia arriba y muestra el principio */
:root.st-esc #stForm .st-capsula.multi textarea{max-height:96px!important}
/* 10. Pestañas fijas del Inspector con fondo opaco y borde */
:root.st-esc .st-der>.st-col-cab{background:var(--bg)!important;position:relative;z-index:4;border-bottom:1px solid var(--line)}
:root.st-esc[data-theme="dark"] .st-der>.st-col-cab{background:#121216!important}
/* 11. «+3» de «Entendí» junto al último chip */
:root.st-esc #pEntendi .st-ent-lista{align-items:center}
:root.st-esc #pEntendi .st-ent-mas{order:99}
/* 13. Puerta sin sesión e Inicio con el mismo ancho de página y margen del logo */
:root.st-esc body.st-sin-sesion{--si-col:960px}
@media (min-width:1700px){ :root.st-esc body.st-sin-sesion{--si-col:1160px} }
:root.st-esc body.st-sin-sesion header.st-top{padding-left:max(16px,calc((100vw - var(--si-col)) / 2))!important;padding-right:max(12px,calc((100vw - var(--si-col)) / 2))!important}
:root.st-esc body.st-sin-sesion .st-puerta{max-width:var(--si-col)!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}
/* 14. Texto pequeño: nada informativo bajo 12 px y contraste ≥ 4,5:1 */
:root.st-esc .st-act-d,:root.st-esc .st-lat-uso,:root.st-esc .st-lat-uso *{font-size:12px!important;color:#5F5C76!important}
:root.st-esc[data-theme="dark"] .st-act-d,:root.st-esc[data-theme="dark"] .st-lat-uso,:root.st-esc[data-theme="dark"] .st-lat-uso *{color:#A9A9B2!important}
/* 15. Oscuro: mismo peso que en claro, compensando el halo del texto claro sobre fondo oscuro */
:root.st-esc[data-theme="dark"] .st-izq,:root.st-esc[data-theme="dark"] .st-der{-webkit-font-smoothing:antialiased;font-synthesis:none}
:root.st-esc[data-theme="dark"] .st-izq .st-app .nom,:root.st-esc[data-theme="dark"] .st-izq .st-explorar,:root.st-esc[data-theme="dark"] .st-izq .st-lat-her .nom{font-weight:400!important}
:root.st-esc[data-theme="dark"] .st-der b,:root.st-esc[data-theme="dark"] .st-der .st-h3,:root.st-esc[data-theme="dark"] .st-izq b{font-weight:500!important}
:root.st-esc[data-theme="dark"] .st-der,:root.st-esc[data-theme="dark"] .st-izq{color:#E8E8ED}
/* Ronda 17 (ajustes) */
:root.st-esc #pResumen .st-rs-pc{display:none}
@media (max-width:1439px){ :root.st-esc #pResumen .st-rs-pv{display:none} :root.st-esc #pResumen .st-rs-pc{display:inline} }
:root.st-esc #stCalidad .st-veredicto .st-ver-l .st-nw+.st-nw::before{content:none}
:root.st-esc #stCalidad .st-veredicto .st-ver-l>.st-nw~.st-nw::before{content:"·";margin-right:6px}
:root.st-esc .si-act li.si-act-app{flex-direction:column!important;align-items:stretch}
:root.st-esc #stForm .st-capsula.multi textarea{max-height:52px!important;overflow-y:auto!important}

/* ================= Salto (3-nov-2026): dirección A «Lienzo protagonista» + C «Recorrido de lanzamiento» con injertos de B ================= */
/* 5. Escala: títulos en Space Grotesk (28 · 21 · 17 · 15), interfaz Inter 13,5; mono solo en enlaces y cifras; sin rótulos en mayúsculas */
:root.st-esc .st-izq .st-h3,:root.st-esc .st-izq .st-col-cab h2,:root.st-esc .st-der .st-panel>summary.st-h3,:root.st-esc .sop-ctx-t{text-transform:none!important;letter-spacing:0!important;font:600 12.5px/1.3 var(--body)!important;color:var(--muted)}
:root.st-esc .st-der .st-h3{font:600 15px/1.3 var(--display)!important;letter-spacing:-.01em}
:root.st-esc .st-der{font-size:13.5px}
/* 6. Panel izquierdo de 224 px tipo Linear: filas de 32 px, miniatura y punto de estado (lleno = publicada, hueco = borrador) */
:root.st-esc .st{--st-izq:224px!important}
:root.st-esc .st-izq .st-app{min-height:32px!important;height:32px;padding:0 8px!important;gap:8px;border-radius:8px}
:root.st-esc .st-izq #stApps .st-app[aria-current="true"]{background:var(--surface)!important;box-shadow:0 0 0 1px var(--line)!important;border:0!important}
:root.st-esc .st-izq #stApps .st-app .ic{width:22px;height:22px;min-width:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px;background:var(--st-s2);color:var(--ink)}
:root.st-esc .st-izq #stApps .st-app .ic svg{width:14px;height:14px}
:root.st-esc .st-izq #stApps .st-estado{width:8px!important;height:8px!important;min-width:8px;padding:0!important;margin-left:auto;font-size:0!important;border-radius:50%!important;border:1.5px solid var(--muted)!important;background:transparent!important;box-shadow:none!important}
:root.st-esc .st-izq #stApps .st-estado.publicada{background:var(--ok)!important;border-color:var(--ok)!important}
:root.st-esc .st-izq #stApps .st-estado.por-vencer{background:var(--warn)!important;border-color:var(--warn)!important}
:root.st-esc .st-izq #stApps .st-estado.vencida,:root.st-esc .st-izq #stApps .st-estado.retirada{background:var(--coral,#E11D48)!important;border-color:var(--coral,#E11D48)!important}
:root.st-esc .st-izq #stApps .st-estado.borrador{background:transparent!important;border-color:var(--muted)!important}
/* 5. Inspector delgado: 300 a ≤ 1365, 320, 360 desde 1700 */
:root.st-esc .st{--st-der:320px!important}
@media (max-width:1365px){ :root.st-esc .st{--st-der:300px!important} }
@media (min-width:1700px){ :root.st-esc .st{--st-der:360px!important} }
:root.st-esc .st-body .sop-panel{width:320px!important}
@media (max-width:1365px){ :root.st-esc .st-body .sop-panel{width:300px!important} }
@media (min-width:1700px){ :root.st-esc .st-body .sop-panel{width:360px!important} }
/* 1. Barra superior: selector «Celular · Escritorio · Ambos» al centro */
:root.st-esc .st-disp{position:absolute;left:50%;top:6px;transform:translateX(-50%);display:flex;gap:2px;padding:3px;border-radius:10px;background:var(--st-s2);z-index:5}
:root.st-esc[data-theme="dark"] .st-disp{background:rgba(255,255,255,.06)}
:root.st-esc .st-disp[hidden],:root.st-esc .st-disp button[hidden]{display:none!important}
:root.st-esc .st-disp button{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border:0;border-radius:8px;background:none;color:var(--muted);font:500 13px var(--body);cursor:pointer}
:root.st-esc .st-disp button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(15,14,31,.15)}
:root.st-esc .st-disp button:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
@media (max-width:1365px){ :root.st-esc .st-disp button span{display:none} :root.st-esc .st-disp button{padding:0 10px} }
:root.st-esc header.st-top{position:relative}
/* 1. Barra del lienzo mínima: los botones de vista pasan arriba; tema, recargar y abrir quedan en un riel flotante */
:root.st-esc .st-centro{position:relative}
:root.st-esc .st-centro>.st-col-cab{position:absolute!important;top:12px!important;right:12px!important;left:12px!important;height:auto!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;z-index:6;pointer-events:none;justify-content:space-between!important}
:root.st-esc .st-centro>.st-col-cab>*{pointer-events:auto}
:root.st-esc .st-centro>.st-col-cab #btnMovil,:root.st-esc .st-centro>.st-col-cab #btnEscritorio{display:none!important}
:root.st-esc .st-centro>.st-col-cab .st-herr{margin-left:auto;display:flex;flex-direction:column;gap:2px;padding:4px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 6px 18px -10px rgba(15,14,31,.35)}
:root.st-esc .st-centro>.st-col-cab .st-herr .st-ic{width:32px;height:32px;min-height:32px}
/* 1. Lienzo con ambiente: degradado radial del acento de la app con saturación y opacidad limitadas, y sombra de piso */
:root.st-esc .st-lienzo{--st-app-s:color-mix(in oklab,var(--st-app,#7C3AED) 55%,#8B8A9C);padding-top:16px!important;background:radial-gradient(58% 52% at 50% 40%,color-mix(in srgb,var(--st-app-s) 16%,transparent),transparent 72%),radial-gradient(1px 1px at 50% 50%,color-mix(in srgb,var(--ink) 9%,transparent) 1px,transparent 1.5px) 0 0/18px 18px}
:root.st-esc[data-theme="dark"] .st-lienzo{background:radial-gradient(58% 52% at 50% 40%,color-mix(in srgb,var(--st-app-s) 22%,transparent),transparent 72%),radial-gradient(1px 1px at 50% 50%,rgba(255,255,255,.07) 1px,transparent 1.5px) 0 0/18px 18px}
:root.st-esc .st-marco.movil{box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 16%,transparent),0 36px 50px -30px color-mix(in srgb,var(--st-app-s) 55%,rgba(15,14,31,.5)),0 60px 90px -50px rgba(15,14,31,.45)!important}
/* 1. «Ambos»: escritorio y celular lado a lado (desde 1700 px) */
:root.st-esc.st-ambos .st-lienzo{display:flex!important;flex-direction:row!important;align-items:flex-start!important;justify-content:center!important;gap:40px}
:root.st-esc .st-marco-esc{flex:none;position:relative;width:calc(1280px * var(--st-ke,.6));height:calc(800px * var(--st-ke,.6));margin-top:calc(var(--st-mh,700px) * .18);border-radius:12px;overflow:hidden;background:var(--surface);box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 14%,transparent),0 40px 70px -40px rgba(15,14,31,.5)}
:root.st-esc .st-marco-esc[hidden]{display:none}
:root.st-esc .st-marco-esc iframe{position:absolute;top:0;left:0;width:1280px;height:800px;border:0;transform:scale(var(--st-ke,.6));transform-origin:0 0}
:root.st-esc.st-ambos .st-marco.movil{margin:0!important}
/* 1. Barra de enlace bajo el celular */
:root.st-esc .st-enl-bar{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(var(--st-form-h,64px) + 28px);z-index:5;display:flex;align-items:center;gap:6px;max-width:calc(100% - 48px);height:40px;padding:0 6px 0 12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 8px 24px -14px rgba(15,14,31,.35);font-size:13px;white-space:nowrap}
:root.st-esc .st-enl-bar[hidden]{display:none}
:root.st-esc.st-maria .st-enl-bar,:root.st-esc.st-en-inicio .st-enl-bar{display:none}
:root.st-esc .st-enl-est{display:inline-flex;align-items:center;gap:6px;font-weight:600}
:root.st-esc .st-enl-est i{width:8px;height:8px;border-radius:50%;background:var(--muted)}
:root.st-esc .st-enl-est.vivo{color:var(--ok)}
:root.st-esc .st-enl-est.vivo i{background:var(--ok)}
:root.st-esc .st-enl-est.borr i{background:transparent;border:1.5px solid var(--muted)}
:root.st-esc .st-enl-est.venc{color:var(--coral,#E11D48)}
:root.st-esc .st-enl-est.venc i{background:var(--coral,#E11D48)}
:root.st-esc .st-enl-url{min-width:0;overflow:hidden;text-overflow:ellipsis;font:500 12.5px var(--mono);color:var(--ink);padding:0 4px}
:root.st-esc .st-enl-txt{color:var(--muted)}
:root.st-esc .st-enl-b{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--ink);font:500 13px var(--body);text-decoration:none;cursor:pointer;flex:none}
:root.st-esc .st-enl-b:hover{background:var(--st-s2)}
:root.st-esc .st-enl-pop{position:absolute;bottom:calc(100% + 8px);right:0;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 18px 40px -16px rgba(15,14,31,.45);text-align:center;white-space:normal;width:160px}
:root.st-esc .st-enl-pop[hidden]{display:none}
:root.st-esc .st-enl-pop img{display:block;margin:0 auto 6px;padding:6px;background:#fff;border-radius:8px}
:root.st-esc .st-enl-pop p{margin:0;font-size:12px;color:var(--muted)}
@media (max-width:1365px){ :root.st-esc .st-enl-b span{display:none} :root.st-esc .st-enl-b{padding:0 8px} }
/* 2. Resumen = recorrido de lanzamiento */
:root.st-esc .st-rec-cab{padding:4px 0 16px;border-bottom:1px solid var(--line)}
:root.st-esc .st-rec-t{margin:0 0 12px;font:700 21px/1.2 var(--display);letter-spacing:-.02em;color:var(--ink)}
:root.st-esc .st-rec-barra{display:flex;gap:4px}
:root.st-esc .st-rec-barra i{flex:1;height:5px;border-radius:3px;background:color-mix(in srgb,var(--ink) 12%,transparent)}
:root.st-esc .st-rec-barra i.ok{background:var(--st-pri,var(--accent))}
:root.st-esc .st-rec-barra i.ahora{background:color-mix(in srgb,var(--st-pri,var(--accent)) 35%,transparent)}
:root.st-esc .st-rec-n{display:flex;justify-content:space-between;gap:8px;margin:8px 0 0;font-size:12.5px;color:var(--muted)}
:root.st-esc .st-rec-n b{color:var(--ink);font-family:var(--mono);font-weight:500}
:root.st-esc .st-rec{list-style:none;margin:0;padding:8px 0 0;display:flex;flex-direction:column}
:root.st-esc .st-rec-p{display:grid;grid-template-columns:24px auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 0;font-size:13.5px}
:root.st-esc .st-rec-ic{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;font:600 12px var(--mono);border:1.5px solid var(--line);color:var(--muted)}
:root.st-esc .st-rec-p.ok .st-rec-ic{background:var(--st-pri,var(--accent));border-color:var(--st-pri,var(--accent));color:#fff}
:root.st-esc .st-rec-p b{font-weight:600}
:root.st-esc .st-rec-d{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 12.5px var(--mono);color:var(--muted)}
:root.st-esc .st-rec-p.fut{grid-template-columns:24px minmax(0,1fr);row-gap:2px;opacity:.75}
:root.st-esc .st-rec-p.fut b{color:var(--muted)}
:root.st-esc .st-rec-f{grid-column:2;font-size:12.5px;color:var(--muted)}
:root.st-esc .st-rec-p.ahora{grid-template-columns:24px minmax(0,1fr);align-items:start}
:root.st-esc .st-rec-p.ahora .st-rec-ic{border-color:var(--st-pri,var(--accent));color:var(--st-pri,var(--accent));margin-top:12px}
:root.st-esc .st-rec-card{padding:14px;border:1.5px solid color-mix(in srgb,var(--st-pri,var(--accent)) 45%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--st-pri,var(--accent)) 5%,var(--surface))}
:root.st-esc .st-rec-ahora{display:flex;align-items:center;gap:6px;margin:0 0 4px;font:600 12px var(--body);color:var(--st-pri,var(--accent))}
:root.st-esc[data-theme="dark"] .st-rec-ahora{color:#C4B5FD}
:root.st-esc .st-rec-ahora i{width:7px;height:7px;border-radius:50%;background:#C6FF3D;box-shadow:0 0 0 2px color-mix(in srgb,#C6FF3D 30%,transparent)}
:root.st-esc .st-rec-card h4{margin:0 0 4px;font:700 17px/1.25 var(--display);letter-spacing:-.01em}
:root.st-esc .st-rec-desc{margin:0 0 12px;font-size:13px;color:var(--muted);line-height:1.45}
:root.st-esc .st-rec-card .st-btn.primario.ancho{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:44px;text-decoration:none}
:root.st-esc .st-rec-sec{display:flex;align-items:center;gap:12px;margin-top:12px}
:root.st-esc .st-rec-qr{flex:none;padding:5px;background:#fff;border-radius:8px;border:1px solid var(--line)}
:root.st-esc .st-rec-sec .st-btn{display:inline-flex;align-items:center;gap:6px;height:36px}
:root.st-esc .st-rec-sec p{margin:6px 0 0;font-size:12px;color:var(--muted)}
:root.st-esc .st-pie-res{display:flex;align-items:center;justify-content:space-between;gap:12px}
:root.st-esc .st-pie-res .st-pie-plan{margin:0;font:400 13.5px var(--body)!important;color:var(--muted)!important}
:root.st-esc .st-pie-res .st-pie-plan b{color:var(--ink)}
:root.st-esc .st-pie-res .st-pie-d{margin:2px 0 0;font-size:12.5px;color:var(--muted)}
:root.st-esc .st-pie-res .st-btn{height:36px;text-decoration:none;display:inline-flex;align-items:center}
/* 3. Calidad: veredicto, cifras grandes, lo que puedes mejorar y grupos plegados */
:root.st-esc .st-cal-ver{padding:2px 0 12px}
:root.st-esc .st-cal-chip{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;font:600 13px var(--body);background:color-mix(in srgb,var(--ok) 14%,transparent);color:var(--ok)}
:root.st-esc .st-cal-ver.amb .st-cal-chip{background:color-mix(in srgb,var(--warn) 16%,transparent);color:var(--warn)}
:root.st-esc .st-cal-sub{margin:8px 0 0;font:700 17px/1.3 var(--display);color:var(--ink)}
:root.st-esc .st-cal-cifras{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;padding-bottom:16px;border-bottom:1px solid var(--line)}
:root.st-esc .st-cal-cifras>div{display:flex;flex-direction:column;gap:4px;padding:12px;border:1px solid var(--line);border-radius:12px}
:root.st-esc .st-cal-n{font:600 28px/1 var(--mono);letter-spacing:-.02em;color:var(--ink)}
:root.st-esc .st-cal-n small{font-size:15px;color:var(--muted)}
:root.st-esc .st-cal-cifras span{font-size:12.5px;color:var(--muted)}
:root.st-esc .st-cal-barra{display:block;height:4px;margin-top:4px;border-radius:2px;background:color-mix(in srgb,var(--ink) 10%,transparent);overflow:hidden}
:root.st-esc .st-cal-barra i{display:block;height:100%;background:var(--ok)}
:root.st-esc .st-cal-mej{padding:14px 0;border-bottom:1px solid var(--line)}
:root.st-esc .st-cal-mej ul{list-style:none;margin:10px 0;padding:0;display:flex;flex-direction:column;gap:6px}
:root.st-esc .st-cal-mej li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;font-size:13.5px}
:root.st-esc .st-cal-gr{margin:16px 0 4px!important}
:root.st-esc .st-cal-g{border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent)}
:root.st-esc .st-cal-g summary{display:grid;grid-template-columns:20px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:40px;cursor:pointer;list-style:none;font:500 14px var(--body)}
:root.st-esc .st-cal-g summary::-webkit-details-marker{display:none}
:root.st-esc .st-cal-g summary .st-num{font:500 12.5px var(--mono);color:var(--muted)}
:root.st-esc .st-cal-g .st-pruebas{margin:0 0 10px}
:root.st-esc .st-pr-ev{display:block;margin-top:2px;font:400 11.5px/1.35 var(--mono);color:var(--muted);white-space:normal}
:root.st-esc #stITabs .st-tab-n{margin-left:4px;font:500 11.5px var(--mono);color:var(--muted)}
/* 4. Inicio: «Continúa donde ibas» con una vista previa real, otras apps en filas, tabla densa con más de 3 */
:root.st-esc .si-cont{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,1fr);border:1px solid var(--line);border-radius:18px;background:var(--surface);overflow:hidden;min-height:340px}
:root.st-esc .si-cont-vista{position:relative;overflow:hidden;background:radial-gradient(70% 70% at 40% 30%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 70%),var(--st-s2,var(--bg));border-right:1px solid var(--line)}
:root.st-esc .si-cont-if{position:absolute;top:24px;left:24px;width:1280px;height:900px;border:0;border-radius:12px;transform:scale(var(--si-kc,.42));transform-origin:0 0;box-shadow:0 20px 50px -24px rgba(15,14,31,.45);pointer-events:none;background:#fff}
:root.st-esc .si-cont-vista .si-app-ic{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted)}
:root.st-esc .si-cont-ficha{display:flex;flex-direction:column;gap:10px;padding:22px 22px 20px}
:root.st-esc .si-cont-k{margin:0;font:500 12.5px var(--body);color:var(--muted)}
:root.st-esc .si-cont-ficha h3{margin:0;font:700 28px/1.1 var(--display);letter-spacing:-.02em}
:root.st-esc .si-cont-m{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0;font-size:13px;color:var(--muted)}
:root.st-esc .si-cont-url{display:block;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--bg);font:500 12.5px var(--mono);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root.st-esc .si-cont-rec p{margin:6px 0 0;font-size:13px;color:var(--muted)}
:root.st-esc .si-cont-rec b{color:var(--ink)}
:root.st-esc .si-cont-barra{display:flex;gap:4px}
:root.st-esc .si-cont-barra i{flex:1;height:5px;border-radius:3px;background:color-mix(in srgb,var(--ink) 12%,transparent)}
:root.st-esc .si-cont-barra i.ok{background:var(--accent)}
:root.st-esc .si-cont-barra i.ahora{background:color-mix(in srgb,var(--accent) 35%,transparent)}
:root.st-esc .si-cont-acc{display:flex;gap:8px;margin-top:auto}
:root.st-esc .si-cont-acc .si-btn{display:inline-flex;align-items:center;gap:6px;text-decoration:none}
:root.st-esc .si-est{display:inline-flex;align-items:center;gap:6px;font-weight:500;color:var(--ink)}
:root.st-esc .si-est i{width:8px;height:8px;border-radius:50%;border:1.5px solid var(--muted)}
:root.st-esc .si-est.publicada i{background:var(--ok);border-color:var(--ok)}
:root.st-esc .si-est.por-vencer i{background:var(--warn);border-color:var(--warn)}
:root.st-esc .si-est.vencida i,:root.st-esc .si-est.retirada i{background:var(--coral,#E11D48);border-color:var(--coral,#E11D48)}
:root.st-esc .si-otras{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface)}
:root.st-esc .si-otras li+li{border-top:1px solid var(--line)}
:root.st-esc .si-otra{display:grid;grid-template-columns:28px minmax(0,auto) auto 1fr;align-items:center;gap:12px;width:100%;min-height:48px;padding:0 14px;border:0;background:none;color:var(--ink);font:500 14px var(--body);text-align:left;cursor:pointer}
:root.st-esc .si-otra:hover,:root.st-esc .si-tr:not(.si-th):hover{background:var(--st-s2,var(--bg))}
:root.st-esc .si-otra-ic{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:8px;background:var(--st-s2,var(--bg));color:var(--ink)}
:root.st-esc .si-otra-p{justify-self:end;color:var(--muted);font-size:13px}
:root.st-esc .si-tabla{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface)}
:root.st-esc .si-tr{display:grid;grid-template-columns:minmax(0,2fr) 1.1fr .8fr .9fr .7fr .8fr;align-items:center;gap:12px;width:100%;min-height:48px;padding:0 16px;border:0;border-top:1px solid var(--line);background:none;color:var(--ink);font:400 13.5px var(--body);text-align:left;cursor:pointer}
:root.st-esc .si-tr.si-th{min-height:36px;border-top:0;font:500 12.5px var(--body);color:var(--muted);cursor:default}
:root.st-esc .si-td-app{display:flex;align-items:center;gap:10px;min-width:0}
:root.st-esc .si-td-app b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root.st-esc .si-mono{font-family:var(--mono);font-size:12.5px}
:root.st-esc .si-gratis{align-self:center;margin-right:4px;font:500 12.5px var(--body);color:var(--muted);white-space:nowrap}
/* 7. «Compartir»: como mucho la cabecera y la tarjeta «Ahora»; la barra de enlace solo copia y abre */
/* Salto (ajustes tras el repaso) */
:root.st-esc .st-itabs{gap:12px!important;padding-left:14px!important;padding-right:14px!important}
:root.st-esc .st-itabs [role="tab"]{font-size:13px!important;padding-left:0!important;padding-right:0!important;white-space:nowrap}
:root.st-esc .st-itabs .st-tab-l{white-space:nowrap}
:root.st-esc #stITabs .st-tab-n{margin-left:3px;font-size:11px}
@media (max-width:1365px){ :root.st-esc .st-itabs{gap:9px!important;padding-left:10px!important;padding-right:12px!important} :root.st-esc .st-itabs [role="tab"]{font-size:12.5px!important} :root.st-esc #stITabs .st-tab-n{display:none} }
:root.st-esc .st-pie-res{text-align:left!important;align-items:center!important;flex-direction:row!important}
:root.st-esc .st-pie-res>div{flex:1;min-width:0}
/* Frase del plan: etiqueta a la izquierda, selector a la derecha sin salirse */
:root.st-esc #stFrase{grid-template-columns:minmax(0,1fr) minmax(0,auto)!important}
:root.st-esc #stFrase .st-hueco-w{justify-self:end;max-width:100%;min-width:0;overflow:hidden}
:root.st-esc #stFrase .st-hueco{min-width:0;max-width:calc(100% - 30px)}
:root.st-esc #stFrase .st-hueco .t{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
:root.st-esc #stFrase .st-hueco-m{flex:none}
:root.st-esc .st-rec-sec .st-btn{white-space:nowrap}
@media (max-width:1365px){ :root.st-esc .st-rec-qr{display:none} :root.st-esc .st-itabs{gap:6px!important} }
:root.st-esc.st-ambos .st-lienzo{align-items:center!important}
:root.st-esc .st-marco-esc{margin-top:0!important}

/* ================= Salto 2 (ejecución): correcciones de los jueces ================= */
/* 2. Pestañas: separación ≥ 12 px; hasta 1699 px el contador sale de la pestaña y Historial va al «⋯» del Inspector */
:root.st-esc .st-der>.st-col-cab{display:flex;align-items:center}
:root.st-esc .st-itabs{gap:12px!important;padding-left:14px!important;padding-right:8px!important;flex:1 1 auto;min-width:0}
:root.st-esc .st-itabs [role="tab"]{font-size:13px!important;padding:0!important}
:root.st-esc .st-itabs-mas{position:relative;flex:none;display:none;margin-right:8px}
:root.st-esc .st-itabs-mas-b{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:0;border-radius:8px;background:none;color:var(--muted);font-size:18px;cursor:pointer}
:root.st-esc .st-itabs-mas-b:hover,:root.st-esc .st-itabs-mas.activo .st-itabs-mas-b{background:var(--st-s2);color:var(--ink)}
:root.st-esc .st-itabs-mas-m{position:absolute;top:calc(100% + 4px);right:0;z-index:40;min-width:180px;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 16px 36px -12px rgba(15,14,31,.45)}
:root.st-esc .st-itabs-mas-m[hidden]{display:none}
:root.st-esc .st-itabs-mas-m button{display:flex;align-items:center;gap:8px;width:100%;min-height:36px;padding:0 10px;border:0;border-radius:8px;background:none;color:var(--ink);font:500 14px var(--body);cursor:pointer}
:root.st-esc .st-itabs-mas-m button:hover{background:var(--st-s2)}
@media (max-width:1699px){
  :root.st-esc .st-itabs #itHistorial{display:none!important}
  :root.st-esc .st-itabs-mas{display:block}
  :root.st-esc #stITabs .st-tab-n{display:none!important}
}
@media (max-width:1365px){ :root.st-esc .st-itabs{gap:12px!important;padding-left:12px!important} :root.st-esc .st-itabs [role="tab"]{font-size:12.5px!important} }
@media (min-width:1700px){ :root.st-esc #stITabs .st-tab-n{display:inline-flex;align-items:center;height:18px;padding:0 6px;margin-left:5px;border-radius:999px;background:var(--st-s2);font:500 12px var(--mono);color:var(--ink)} }
/* 3. Cabecera estable: la página nunca se desplaza y el selector queda centrado en la cabecera */
:root.st-esc:has(body:not(.st-sin-sesion)),:root.st-esc body:not(.st-sin-sesion){overflow:hidden}
:root.st-esc .st-disp{top:50%!important;transform:translate(-50%,-50%)!important;padding:2px!important}
:root.st-esc .st-disp button{height:30px}
/* 5. «Compartir» de la cabecera secundario cuando la tarjeta «Ahora» comparte o renueva */
:root.st-esc header.st-top #stPublicar.st-pub-sec{background:transparent!important;color:var(--ink)!important;border:1px solid var(--line)!important;box-shadow:none!important}
:root.st-esc header.st-top #stPublicar.st-pub-sec:hover{background:var(--st-s2)!important}
/* 6. Sin la etiqueta de la esquina del lienzo (la barra de enlace ya dice «Borrador · sin publicar») */
:root.st-esc .st-centro #stInsignia{display:none!important}
/* 7. Riel de herramientas separado del marco: el lienzo deja 72 px a cada lado en Escritorio y «Ambos» */
:root.st-esc .st-lienzo:has(.st-marco.escritorio),:root.st-esc.st-ambos .st-lienzo{padding-left:72px!important;padding-right:72px!important}
/* 8. «Ambos» a la misma altura */
:root.st-esc.st-ambos .st-lienzo{gap:48px!important}
/* 12. Pie fijo con desvanecido y margen en el área desplazable */
:root.st-esc .st-der.st-con-pie>.st-scroll{padding-bottom:calc(var(--st-pie-h,180px) + 16px)!important}
:root.st-esc .st-pie-insp::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:28px;background:linear-gradient(to bottom,transparent,var(--bg));pointer-events:none}
:root.st-esc[data-theme="dark"] .st-pie-insp::before{background:linear-gradient(to bottom,transparent,#121216)}
/* 13. Progreso: hecho lleno, el actual con un borde de color (sin medio tono), el resto vacío */
:root.st-esc .st-rec-barra i.ahora,:root.st-esc .si-cont-barra i.ahora{background:transparent!important;box-shadow:inset 0 0 0 1.5px var(--st-pri,var(--accent))}
:root.st-esc .st-rec-barra i,:root.st-esc .si-cont-barra i{height:6px!important}
/* 14. Modal de plantillas: proyectos grandes en 2 columnas en todos los anchos, aire antes de «Vender» y nada cortado al pie */
:root.st-esc .st-pls #stPlantillas>.st-densos{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-span:all}
:root.st-esc .st-pls #stPlantillas>.st-sug{margin-bottom:24px!important}
:root.st-esc .st-pls-c{padding-bottom:96px!important}
/* 15. María abierta: la barra del enlace sigue visible; el estado del proyecto arriba en una línea */
:root.st-esc.st-maria .st-enl-bar:not([hidden]){display:flex!important}
:root.st-esc .sop-ctx{margin:12px 16px 0!important;padding:10px 12px!important}
:root.st-esc .sop-ctx-l{margin:0!important;gap:6px!important;font-size:13.5px}
:root.st-esc .sop-ctx-n{font:500 12.5px var(--mono);color:var(--muted)}
/* 16. Oscuro: resaltado violeta tenue, QR con marco oscuro de 8 px y halo más tenue */
:root.st-esc[data-theme="dark"] .st-paleta-l mark{background:rgba(167,139,250,.28)!important;color:#fff!important}
:root.st-esc[data-theme="dark"] .st-rec-qr,:root.st-esc[data-theme="dark"] .st-enl-pop img,:root.st-esc[data-theme="dark"] #stPublicacion .st-qr img{padding:6px!important;background:#fff!important;border:8px solid #232329!important;border-radius:12px!important;box-sizing:content-box}
:root.st-esc[data-theme="dark"] .st-lienzo{background:radial-gradient(58% 52% at 50% 40%,color-mix(in srgb,var(--st-app-s) 13%,transparent),transparent 72%),radial-gradient(1px 1px at 50% 50%,rgba(255,255,255,.06) 1px,transparent 1.5px) 0 0/18px 18px!important}
/* 18. Puerta: caja de idea protagonista con «Prueba con…» y menos vacío arriba */
:root.st-esc body.st-sin-sesion .st-puerta{align-items:center!important}
:root.st-esc body.st-sin-sesion .st-puerta-c{align-self:center!important;margin-top:0!important}
:root.st-esc .st-puerta-idea{padding:16px!important;border-radius:20px!important}
:root.st-esc .st-puerta-idea textarea{font-size:17px!important;min-height:88px!important}
:root.st-esc .st-pt-ejs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:14px 0 0}
:root.st-esc .st-pt-ejs>span{font-size:13px;color:var(--muted);margin-right:2px}
:root.st-esc .st-pt-ejs button{height:34px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font:500 13.5px var(--body);cursor:pointer}
:root.st-esc .st-pt-ejs button:hover{border-color:color-mix(in srgb,var(--accent) 50%,var(--line))}
/* 1. Esqueleto de carga de «Tus apps» */
:root.st-esc .si-esq{display:grid;grid-template-columns:1.35fr 1fr;gap:16px}
:root.st-esc .si-esq i{display:block;height:300px;border-radius:18px;background:linear-gradient(90deg,var(--st-s2,var(--bg)) 25%,color-mix(in srgb,var(--ink) 6%,transparent) 50%,var(--st-s2,var(--bg)) 75%) 0 0/200% 100%;animation:si-esq 1.4s ease-in-out infinite}
:root.st-esc .si-esq i:nth-child(3){display:none}
@keyframes si-esq{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){ :root.st-esc .si-esq i{animation:none} }
:root.st-esc .si-err{margin:0;color:var(--muted)}
/* Salto 2 (ajustes tras el repaso) */
:root.st-esc .st-itabs{justify-content:flex-start!important;overflow:visible}
:root.st-esc .st-der>.st-col-cab .st-itabs-mas{margin-left:auto}
:root.st-esc .st-rec-sec{flex-wrap:wrap}
:root.st-esc .st-rec-qr{width:72px!important;height:72px!important}
:root.st-esc .st-rec-sec>div{min-width:0;flex:1 1 120px}
:root.st-esc.st-ambos .st-marco.movil{align-self:center!important}
:root.st-esc.st-ambos .st-marco.movil .st-iframe{width:390px!important;height:844px!important;transform:scale(var(--st-k,.55))!important}
:root.st-esc.st-ambos .st-marco.movil{width:calc(390px * var(--st-k,.55) + 16px)!important;height:calc(844px * var(--st-k,.55) + 28px)!important}
:root.st-esc .st-itabs{flex:0 1 auto!important;overflow:hidden!important}
:root.st-esc .st-itabs [role="tab"]{flex:none}
:root.st-esc .st-der>.st-col-cab{padding-left:4px!important;padding-right:4px!important}
:root.st-esc .st-der>.st-col-cab .st-itabs{padding-left:12px!important;padding-right:4px!important}
:root.st-esc .st-der>.st-col-cab .st-itabs-mas{margin-right:4px!important}

/* ================= Salto 3 (fallos objetivos de los jueces) ================= */
/* 3. Tarjeta «Ahora»: misma disposición en claro y oscuro; el QR con su texto, también a 1280 */
:root.st-esc .st-rec-sec{display:flex!important;flex-wrap:nowrap!important;align-items:center;gap:12px;margin-top:12px}
:root.st-esc .st-rec-qrw{display:flex;align-items:center;gap:10px;min-width:0;flex:1 1 auto}
:root.st-esc .st-rec-qrw p{margin:0;font-size:12px;color:var(--muted);line-height:1.35}
:root.st-esc .st-rec-qr,:root.st-esc[data-theme="dark"] .st-rec-qr{display:block!important;flex:none;width:64px!important;height:64px!important;padding:4px!important;border:1px solid var(--line)!important;border-radius:8px!important;background:#fff!important;box-shadow:none!important;box-sizing:content-box}
:root.st-esc[data-theme="dark"] .st-rec-qr{box-shadow:0 0 0 6px #232329!important;border-color:transparent!important}
:root.st-esc .st-rec-sec>.st-btn{flex:none;white-space:nowrap}
@media (max-width:1365px){ :root.st-esc .st-rec-sec{flex-wrap:wrap!important} :root.st-esc .st-rec-qrw{flex:1 1 100%} }
/* 4. El pie nunca tapa contenido: relleno extra bajo el desvanecido */
:root.st-esc .st-der.st-con-pie>.st-scroll{padding-bottom:calc(var(--st-pie-h,180px) + 48px)!important}
:root.st-esc .st-der.st-desplazado>.st-col-cab{box-shadow:0 8px 14px -8px rgba(15,14,31,.35)!important}
/* 6. Vencida: tarjeta «Ahora» en tono de alerta y cinta sobre la vista previa */
:root.st-esc .st-rec-p.ahora.alerta .st-rec-card{border-color:color-mix(in srgb,var(--warn,#B45309) 55%,var(--line))!important;background:color-mix(in srgb,var(--warn,#B45309) 8%,var(--surface))!important}
:root.st-esc .st-rec-p.ahora.alerta .st-rec-ahora{color:var(--warn,#B45309)!important}
:root.st-esc .st-rec-p.ahora.alerta .st-rec-ahora i{background:var(--warn,#F59E0B)!important;box-shadow:none!important}
:root.st-esc .st-rec-p.ahora.alerta .st-rec-ic{border-color:var(--warn,#B45309)!important;color:var(--warn,#B45309)!important}
:root.st-esc .st-rec-p.ahora.alerta .st-btn.primario{background:#B45309!important;border-color:#B45309!important;color:#fff!important}
:root.st-esc .st-cinta-venc{position:absolute;top:16px;left:50%;transform:translateX(-50%);z-index:7;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;background:#B45309;color:#fff;font:600 13px var(--body);box-shadow:0 10px 24px -12px rgba(0,0,0,.5)}
:root.st-esc .st-cinta-venc[hidden]{display:none}
/* 7. Historial abierto desde «⋯»: encabezado con «← Volver» */
:root.st-esc .st-hist-cab{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 0 10px;margin-bottom:6px;border-bottom:1px solid var(--line)}
:root.st-esc .st-hist-cab[hidden]{display:none}
:root.st-esc .st-hist-cab b{display:inline-flex;align-items:center;gap:6px;font:600 15px var(--body)}
:root.st-esc .st-der:not([data-itab="historial"]) .st-hist-cab{display:none}
:root.st-esc .st-itabs-mas.activo .st-itabs-mas-b{box-shadow:inset 0 -2.5px 0 var(--st-pri,var(--accent));border-radius:8px 8px 0 0}
/* 8. Insignia 19/19 en oscuro con su píldora */
:root.st-esc[data-theme="dark"] #stITabs .st-tab-n{background:rgba(255,255,255,.12)!important;color:#E8E8ED!important}
/* 9. María: línea de estado con elipsis; compositor atenuado igual con María abierta */
:root.st-esc .sop-ctx-l{display:block!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root.st-esc.st-maria #stForm{opacity:.55!important}
:root.st-esc.st-maria #stForm:focus-within{opacity:1!important}
/* 10. Borrador: «+N» con el último chip y selectores del mismo ancho */
:root.st-esc #pEntendi .st-ent-lista{flex-wrap:wrap!important;align-items:center}
:root.st-esc #pEntendi .st-ent-mas{order:0!important}
:root.st-esc #stFrase .st-hueco-w{width:168px;justify-content:space-between}
:root.st-esc #stFrase .st-hueco{flex:1 1 auto;min-width:0}
/* 11. Ficha «Continúa donde ibas» sin hueco entre el progreso y los botones */
:root.st-esc .si-cont-acc{margin-top:16px!important}
:root.st-esc .si-cont-ficha{justify-content:center}
/* 12. Ritmo del recorrido: mismo alto para los pasos hechos */
:root.st-esc .st-rec-p.ok{min-height:44px;padding:6px 0!important}
/* 13. «Prueba con» de la puerta en una sola fila */
:root.st-esc .st-pt-ejs{flex-wrap:nowrap!important;overflow:hidden}
:root.st-esc .st-pt-ejs button{flex:none;height:32px!important;padding:0 12px!important;font-size:13px!important;white-space:nowrap}
/* 14. Tabla de apps: filas planas; pruebas incompletas en ámbar */
:root.st-esc .si-tabla .si-otra-ic{background:none!important;width:20px;height:20px}
:root.st-esc .si-tr{border-top-color:color-mix(in srgb,var(--line) 70%,transparent)!important}
:root.st-esc .si-mono.si-aviso{color:var(--warn,#B45309)!important;font-weight:600}
/* 15. Tarjeta de cuenta sin línea huérfana */
:root.st-esc .st-lat-uso{text-wrap:balance}
/* Salto 3 (ajustes tras el repaso) */
:root.st-esc .st-rec-sec{flex-wrap:wrap!important}
:root.st-esc .st-rec-qrw{flex:1 1 100%!important}
:root.st-esc .st-cinta-venc{top:auto!important;bottom:calc(var(--st-form-h,64px) + 84px)!important}
:root.st-esc #stFrase .st-hueco-w{width:148px!important}
:root.st-esc #stFrase>span:not(.st-hueco-w){min-width:0;overflow-wrap:anywhere}

/* ================= Ronda T1 (4-nov-2026): parciales del salto 3 y convivencia con la tipografía i1 ================= */
/* 1. Frase del plan: cada etiqueta va encima de su selector en todos los anchos (el Inspector mide 300–360 px; nada se corta) */
@media (min-width:900px){
  :root.st-esc #stFrase{grid-template-columns:minmax(0,1fr)!important;row-gap:4px!important}
  :root.st-esc #stFrase>span:not(.st-hueco-w){font-size:12.5px;color:var(--muted);margin-top:6px}
  :root.st-esc #stFrase .st-hueco-w{width:100%!important;justify-self:stretch!important;margin:0!important}
  :root.st-esc #stFrase .st-hueco{max-width:none!important}
}
/* 1. «Entendí»: fichas enteras que envuelven; el «+N» va en la línea de la última ficha visible */
:root.st-esc #pEntendi .st-ent-lista{display:flex!important;flex-wrap:wrap!important;align-items:center;gap:6px}
:root.st-esc #pEntendi .st-ent-mas{flex:none!important}
/* 2. El pie fijo nunca tapa la tabla del plan: relleno = alto del pie, sin desvanecido encima del contenido */
:root.st-esc .st-der.st-con-pie>.st-scroll{padding-bottom:calc(var(--st-pie-h,180px) + 8px)!important}
:root.st-esc .st-pie-insp::before{height:10px!important}
@media (max-width:1439px){ :root.st-esc .st-pie-insp .st-pie-nota{display:none} }
/* 3. Tarjeta de cuenta: uso en una línea y saldo en otra */
:root.st-esc .st-lat-uso{display:block}
:root.st-esc .st-lat-uso2{margin-top:2px}
/* 4. Tipografía i1 en el Studio: Jost solo ≥ 20 px; cifras y contadores en Inter tabular (la mono queda para enlaces y códigos) */
:root.st-esc .st-rec-card h4{font:var(--w-tit,600) 20px/1.2 var(--display)!important;letter-spacing:var(--ls-titulo,-.01em)}
:root.st-esc .st-cal-sub{font:600 15px/1.35 var(--body)!important;letter-spacing:0}
:root.st-esc .st-pie-g span,:root.st-esc .st-pie-g small{font-family:var(--body)!important}
:root.st-esc .st-cal-n{font-family:var(--display)!important;font-weight:var(--w-tit,600)!important;font-variant-numeric:tabular-nums}
:root.st-esc .st-rec-n b,:root.st-esc .st-rec-ic,:root.st-esc .st-rec-d,:root.st-esc #stITabs .st-tab-n,:root.st-esc .sop-ctx-n,:root.st-esc .si-mono,:root.st-esc .st-cal-g summary .st-num,:root.st-esc .st-pr-ev{font-family:var(--body)!important;font-variant-numeric:tabular-nums}
:root.st-esc .st-izq .st-h3,:root.st-esc .st-izq .st-col-cab h2,:root.st-esc .st-lat-t{font:500 13px/1.3 var(--body)!important;text-transform:none!important;letter-spacing:0!important}

/* ===== T2 (4-nov-2026): celular en proporción, barra pegada a la vista previa, pie que nunca tapa, vencida en una franja,
   tipografía estricta, enlaces de un solo estilo, plantillas en dos niveles, puerta, Inicio vacío y detalles ===== */
/* 1. Vista previa: «Ambos» con márgenes de 24 px para crecer hasta llenar el lienzo; al escribir, el compositor pasa sobre la barra */
:root.st-esc.st-ambos .st-lienzo{padding-left:24px!important;padding-right:24px!important;gap:48px!important}
:root.st-esc .st-enl-bar{z-index:4}
/* 3. Pie del Inspector: compacto (QR pequeño, pasos más juntos) o dentro del desplazamiento si aún no cabe */
:root.st-esc .st-der.st-compacto .st-rec-sec{flex-wrap:nowrap!important;margin-top:10px}
:root.st-esc .st-der.st-compacto .st-rec-qrw{flex:none!important}
:root.st-esc .st-der.st-compacto .st-rec-qrw p{display:none}
:root.st-esc .st-der.st-compacto .st-rec-qr{width:40px!important;height:40px!important}
:root.st-esc .st-der.st-compacto .st-rec-p.ok{min-height:36px;padding:2px 0!important}
:root.st-esc .st-der.st-compacto .st-rec-p.fut .st-rec-f{display:none}
:root.st-esc .st-der.st-compacto .st-rec-p.fut{min-height:36px;padding:4px 0!important}
:root.st-esc .st-der.st-pie-flujo>.st-scroll{padding-bottom:0!important}
:root.st-esc .st-der.st-pie-flujo .st-scroll>.st-pie-insp{position:static;margin:16px -16px 0;box-shadow:none!important;border-top:1px solid var(--line)}
:root.st-esc .st-der.st-pie-flujo .st-scroll>.st-pie-insp::before{display:none}
/* 4. Vencida: una sola franja en la barra del enlace; el progreso no retrocede */
:root.st-esc .st-cinta-venc{display:none!important}
:root.st-esc .st-enl-est.venc{color:#B45309}
:root.st-esc .st-enl-est.venc i{background:#F59E0B}
:root.st-esc[data-theme="dark"] .st-enl-est.venc{color:#FBBF24}
:root.st-esc .st-enl-renovar{background:#B45309!important;border-color:#B45309!important;color:#fff!important;font-weight:600!important}
:root.st-esc .st-enl-renovar:hover{background:#92400E!important}
:root.st-esc .st-rec-barra i.alerta,:root.st-esc .si-cont-barra i.alerta{background:transparent!important;box-shadow:inset 0 0 0 1.5px #D97706}
:root.st-esc .st-rec-p.ahora.alerta.st-rec-renovar .st-rec-ic{font:700 13px var(--body)!important;background:#B45309!important;border-color:#B45309!important;color:#fff!important}
/* 11. El círculo del paso actual a la altura del título de la tarjeta «Ahora» (no de su borde) */
:root.st-esc .st-rec-p.ahora .st-rec-ic{margin-top:36px!important}
/* 6. Tipografía estricta: títulos de modal y de sección en Jost 600 ≥ 20 px; enlaces y slugs en IBM Plex Mono */
:root.st-esc .st-dlg-cab h2,:root.st-esc dialog .st-dlg-cab h2{font:var(--w-tit,600) 22px/1.2 var(--display)!important;letter-spacing:var(--ls-titulo,-.01em)!important;text-transform:none!important}
:root.st-esc #colInspector .st-panel>summary,:root.st-esc #colInspector .st-h3{font:var(--w-tit,600) 20px/1.25 var(--display)!important;letter-spacing:var(--ls-titulo,-.01em)!important;text-transform:none!important;color:var(--ink)!important}
:root.st-esc .st-enl-url,:root.st-esc .si-cont-url,:root.st-esc .st-enlace-e code,:root.st-esc #colInspector code,:root.st-esc .si-tabla code{font-family:var(--f-mono)!important;font-weight:500!important;letter-spacing:0!important}
:root.st-esc .st-enl-url{font-size:12.5px!important}
/* 6. Peso del texto en oscuro: 50 menos donde la fuente es variable (Inter 400–700, Jost 500–600) */
:root.st-esc[data-theme="dark"] b,:root.st-esc[data-theme="dark"] strong,:root.st-esc[data-theme="dark"] summary,:root.st-esc[data-theme="dark"] th,:root.st-esc[data-theme="dark"] h3,:root.st-esc[data-theme="dark"] h4,:root.st-esc[data-theme="dark"] h5{font-weight:550!important}
:root.st-esc[data-theme="dark"] button,:root.st-esc[data-theme="dark"] .st-btn,:root.st-esc[data-theme="dark"] .si-btn,:root.st-esc[data-theme="dark"] a,:root.st-esc[data-theme="dark"] label,:root.st-esc[data-theme="dark"] [role="tab"],:root.st-esc[data-theme="dark"] select,:root.st-esc[data-theme="dark"] .st-enl-b{font-weight:450}
:root.st-esc[data-theme="dark"] .st-btn.primario,:root.st-esc[data-theme="dark"] .si-btn.primario,:root.st-esc[data-theme="dark"] [role="tab"][aria-selected="true"]{font-weight:550}
/* 7. Línea de estado de María: dos líneas si no cabe, sin cortar el dato */
:root.st-esc .sop-ctx-l{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:2px!important;white-space:normal!important;overflow:visible!important}
:root.st-esc .sop-ctx-u{white-space:nowrap}
/* 8. Enlaces: violeta sin subrayado (con → si navega); subrayado solo dentro de párrafos */
:root.st-esc .st-linkbtn,:root.st-esc a.st-link,:root.st-esc .si-link,:root.st-esc .st-puerta-pie .st-linkbtn,:root.st-esc .st-puerta-pie a.st-linkbtn{text-decoration:none!important;color:var(--accent)!important;font-weight:500}
:root.st-esc[data-theme="dark"] .st-linkbtn,:root.st-esc[data-theme="dark"] a.st-link,:root.st-esc[data-theme="dark"] .si-link{color:#C4B5FD!important}
:root.st-esc .st-rec-p .st-linkbtn::after,:root.st-esc .st-puerta-pie a.st-linkbtn::after{content:"\00a0→"}
:root.st-esc .st-rec-p .st-linkbtn{min-height:28px;font:500 13px var(--body)!important}
:root.st-esc .st-hist-cab{justify-content:flex-start!important}
:root.st-esc .st-hist-volver{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0;border:0;background:none;color:var(--ink);font:var(--w-tit,600) 20px/1.2 var(--display);letter-spacing:var(--ls-titulo,-.01em);cursor:pointer}
:root.st-esc .st-hist-volver span:first-child{font:500 18px var(--body);color:var(--muted)}
:root.st-esc .st-hist-volver:hover span:first-child{color:var(--accent)}
/* 9. Plantillas: dos niveles (pestañas + secciones), todas abiertas con hasta 4, en una rejilla alineada */
:root.st-esc .st-pls #stLateral{display:none!important}
:root.st-esc .st-pls #stPlantillas{display:grid!important;columns:auto!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:24px 24px!important;align-items:start!important}
@media (max-width:1439px){ :root.st-esc .st-pls #stPlantillas{grid-template-columns:repeat(2,minmax(0,1fr))!important} }
:root.st-esc .st-pls #stPlantillas>.st-densos,:root.st-esc .st-pls #stPlantillas>.st-sug,:root.st-esc .st-pls #stPlantillas>.st-vacia{grid-column:1/-1!important}
:root.st-esc .st-pls #stPlantillas>.st-sec-pl{margin:0!important;display:flex!important;flex-direction:column;gap:2px;min-width:0}
:root.st-esc .st-pls .st-sec-pl>.st-cat-t{display:flex;align-items:center;gap:8px;margin:0 0 6px!important}
:root.st-esc .st-pls .st-sec-pl>.st-cat-t .st-num{margin-left:auto;font:500 12.5px var(--body);color:var(--muted)}
:root.st-esc .st-pls .st-mas-l{align-self:flex-start;min-height:32px;margin-top:4px;padding:0 10px;border:0;background:none;color:var(--accent);font:500 13px var(--body);cursor:pointer;border-radius:8px}
:root.st-esc .st-pls .st-mas-l:hover{background:var(--accent-soft)}
:root.st-esc[data-theme="dark"] .st-pls .st-mas-l{color:#C4B5FD}
/* 10. Puerta: el bloque de texto arranca a la altura del celular; sin «Promtdea Studio» repetido */
:root.st-esc .st-puerta-k{display:none!important}
:root.st-esc body.st-sin-sesion .st-puerta{align-items:start!important}
:root.st-esc body.st-sin-sesion .st-puerta-c{align-self:start!important;margin-top:0!important}
:root.st-esc body.st-sin-sesion .st-puerta-c h1{margin-top:0!important}
/* 10. Inicio sin apps: «Así se ve tu primera app» */
:root.st-esc .si-primera .si-sec-cab{margin-bottom:16px}
:root.st-esc .si-prim{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
:root.st-esc .si-prim li[hidden]{display:none}
:root.st-esc .si-prim-b{width:100%;display:flex;align-items:stretch;gap:16px;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--ink);text-align:left;cursor:pointer;transition:border-color .15s,box-shadow .15s}
:root.st-esc .si-prim-b:hover,:root.st-esc .si-prim-b:focus-visible{border-color:var(--accent);box-shadow:0 12px 30px -18px rgba(76,29,149,.45)}
:root.st-esc .si-prim-tel{flex:none;position:relative;width:calc(390px * .34 + 12px);height:calc(844px * .34 + 12px);border:6px solid #16151f;border-radius:24px;overflow:hidden;background:var(--bg);box-sizing:border-box}
:root.st-esc[data-theme="dark"] .si-prim-tel{border-color:#050509;box-shadow:0 0 0 1px rgba(255,255,255,.22)}
:root.st-esc .si-prim-tel iframe{position:absolute;top:0;left:0;width:390px;height:844px;border:0;transform:scale(.34);transform-origin:0 0;pointer-events:none}
:root.st-esc .si-prim-c{display:flex;flex-direction:column;gap:6px;min-width:0;padding-top:4px}
:root.st-esc .si-prim-c b{font:var(--w-tit,600) 20px/1.2 var(--display);letter-spacing:var(--ls-titulo,-.01em)}
:root.st-esc .si-prim-c>span:not(.si-prim-ir){font-size:14px;color:var(--muted);line-height:1.4}
:root.st-esc .si-prim-ir{margin-top:auto;color:var(--accent);font:500 13.5px var(--body)}
:root.st-esc[data-theme="dark"] .si-prim-ir{color:#C4B5FD}
@media (max-width:1365px){ :root.st-esc .si-prim-b{flex-direction:column;align-items:center;text-align:center} :root.st-esc .si-prim-c{align-items:center} }
/* 12. Enviar del compositor: flecha (como María) */
:root.st-esc #stForm .st-enviar .ico-w{display:none!important}
:root.st-esc #stForm .st-enviar::before{content:"";width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat}
/* 13. Migas: el chevrón pegado al nombre, un solo control */
:root.st-esc .st-nombre{padding-right:2px!important;border-radius:8px 0 0 8px}
:root.st-esc .st-miga{margin-left:-6px!important}
:root.st-esc .st-miga-b{border-radius:0 8px 8px 0!important;width:24px!important}
:root.st-esc header:has(.st-miga-b:hover) .st-nombre,:root.st-esc header:has(.st-nombre:hover) .st-miga-b{background:var(--st-s2)}
:root.st-esc .sop-ctx-sig{color:var(--muted)}
/* 3. Borrador: «Tu enlace» no aplica antes de publicar; el pie en flujo va siempre al final */
:root.st-esc .st-der.st-compacto #pPublicacion:has(.st-pub-vacia),:root.st-esc .st-der.st-compacto #pEntendi{margin-bottom:0!important}
:root.st-esc .st-der.st-pie-flujo .st-scroll>.st-pie-insp{order:99}
:root.st-esc .st-der.st-borrador #pPublicacion{display:none!important}
:root.st-esc .st-der.st-compacto #pPlan{margin-top:12px!important}

/* ===== T3 (4-nov-2026): el compositor nunca tapa la barra, un llamado dominante, María sin esconder el siguiente paso, puerta
   con tira de ejemplos, tarjetas de primera app, titulares balanceados, modo oscuro, Inspector sin vacíos, un mensaje de precio,
   plantillas con un solo lenguaje y detalles ===== */
/* 1. Si el compositor crece (texto, sugerencias o menú) hasta la barra del enlace, la barra se oculta mientras tanto */
:root.st-esc .st-enl-bar.st-enl-oculta{visibility:hidden!important;opacity:0!important;pointer-events:none}
/* 2. Un llamado dominante: «Compartir» de la cabecera queda en un ícono cuando la tarjeta «Ahora» ya es Compartir */
:root.st-esc header.st-top #stPublicar.st-pub-ic{width:36px;min-width:36px;padding:0!important;justify-content:center}
:root.st-esc header.st-top #stPublicar.st-pub-ic #stPublicarT{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:root.st-esc header.st-top #stPublicar.st-pub-ic .st-pub-icw{display:inline-flex}
:root.st-esc header.st-top #stPublicar .st-pub-icw{display:none}
/* 2. Vencida: «Renovar» de la barra como enlace (el único fuerte es el de la tarjeta) y el punto de la lista en ámbar */
:root.st-esc .st-enl-renovar{background:transparent!important;border-color:transparent!important;color:#B45309!important;text-decoration:none!important;padding:0 6px!important}
:root.st-esc .st-enl-renovar::after{content:"\00a0→"}
:root.st-esc .st-enl-renovar:hover{background:color-mix(in srgb,#F59E0B 14%,transparent)!important}
:root.st-esc[data-theme="dark"] .st-enl-renovar{color:#FBBF24!important}
:root.st-esc .st-izq #stApps .st-estado.vencida,:root.st-esc .st-izq #stApps .st-estado.retirada{background:#F59E0B!important;border-color:#F59E0B!important}
:root.st-esc .si-est.vencida i,:root.st-esc .si-est.retirada i{background:#F59E0B!important;border-color:#F59E0B!important}
:root.st-esc .si-app-est.vencida{color:#B45309}
/* 3. María: desde 1700 px es una cuarta columna (el Inspector y su tarjeta «Ahora» siguen a la vista); el compositor nunca se ve apagado */
:root.st-esc.st-maria-col .st-main{padding-right:var(--st-mar,360px)}
:root.st-esc.st-maria-col .st-body .sop-panel{width:var(--st-mar,360px)!important;top:48px!important}
:root.st-esc.st-maria #stForm,:root.st-esc.st-maria-col #stForm,:root.st-esc.st-maria body:has(#sopIn:focus) #stForm{opacity:1!important;visibility:visible!important}
/* 4. Puerta: tira de 3 apps de ejemplo reales bajo el texto, cuando hay alto para ella */
:root.st-esc .st-pt-tira{display:none}
@media (min-height:1000px){
  :root.st-esc body.st-sin-sesion .st-pt-tira{display:block;margin-top:36px;padding-top:24px;border-top:1px solid var(--line)}
}
:root.st-esc .st-pt-tira-t{margin:0 0 14px;font:600 14px var(--body);color:var(--ink)}
:root.st-esc .st-pt-tira-t span{font-weight:400;color:var(--muted)}
:root.st-esc .st-pt-tira ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
:root.st-esc .st-pt-tira li{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
:root.st-esc .st-pt-tira li[hidden]{display:none}
:root.st-esc .st-pt-mini{position:relative;display:block;width:calc(390px * .25 + 10px);height:calc(844px * .25 + 10px);border:5px solid #16151f;border-radius:20px;overflow:hidden;background:var(--bg);box-sizing:border-box;box-shadow:0 18px 30px -20px rgba(15,14,31,.5)}
:root.st-esc .st-pt-mini iframe{position:absolute;top:0;left:0;width:390px;height:844px;border:0;transform:scale(.25);transform-origin:0 0;pointer-events:none}
:root.st-esc .st-pt-tira-c{display:flex;flex-direction:column;gap:2px;min-width:0}
:root.st-esc .st-pt-tira-c b{font:600 14px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root.st-esc .st-pt-tira-c span{font-size:13px;color:var(--muted);line-height:1.35}
/* 5. «Así se ve tu primera app»: la app arriba (entera), el nombre en una línea, la descripción y un botón, sin huecos */
:root.st-esc .si-prim{align-items:stretch}
:root.st-esc .si-prim-li{display:flex;flex-direction:column;gap:12px;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface);min-width:0}
:root.st-esc .si-prim-vista{display:flex;justify-content:center;padding:16px 0 0;border-radius:12px;background:color-mix(in srgb,var(--accent) 7%,var(--st-s2,var(--bg)));overflow:hidden;height:calc(844px * .3 * .82 + 16px)}
:root.st-esc .si-prim-li .si-prim-tel{width:calc(390px * .3 + 12px);height:calc(844px * .3 + 12px);border-radius:24px 24px 0 0;border-bottom:0}
:root.st-esc .si-prim-li .si-prim-tel iframe{transform:scale(.3)}
:root.st-esc .si-prim-li .si-prim-c{padding:0;gap:4px}
:root.st-esc .si-prim-li .si-prim-c b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root.st-esc .si-prim-li .si-prim-ir{align-self:flex-start;margin-top:auto;min-height:40px;padding:0 16px;font:500 14px var(--body)!important;color:var(--ink)!important}
/* 6. Titulares sin palabra sola al final */
:root.st-esc .st-rec-t,:root.st-esc .st-rec-card h4,:root.st-esc #colInspector h3,:root.st-esc #colInspector h4,:root.st-esc #colInspector .st-h3,:root.st-esc .si-cont-ficha h3,:root.st-esc .si-sec h2,:root.st-esc .si-prim-c b,:root.st-esc .st-cal-sub,:root.st-esc .st-dlg-cab h2{text-wrap:balance}
:root.st-esc .st-rec-desc,:root.st-esc .si-sub{text-wrap:pretty}
/* 7. Modo oscuro: Inter con el mismo peso visual que en claro, sin la mancha del Inicio, y el punto de «Ahora» con contraste */
:root.st-esc[data-theme="dark"] body{-webkit-text-stroke:.2px rgba(10,10,18,.55)}
:root.st-esc[data-theme="dark"] .si::before{display:none!important}
:root.st-esc .st-rec-ahora i{background:#4D7C0F!important;box-shadow:none!important}
:root.st-esc[data-theme="dark"] .st-rec-ahora i{background:#C6FF3D!important}
/* 8. Historial: la primera versión es la publicada (fecha real) */
:root.st-esc .st-hist-l{list-style:none;margin:8px 0 12px;padding:0}
:root.st-esc .st-hist-v{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;align-items:start;padding:12px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--accent) 5%,var(--surface))}
:root.st-esc .st-hist-p{width:12px;height:12px;margin-top:4px;border-radius:50%;background:var(--accent)}
:root.st-esc .st-hist-c{display:flex;flex-direction:column;gap:2px;font-size:14px}
:root.st-esc .st-hist-c small{font-size:12.5px;color:var(--muted)}
:root.st-esc .st-hist-n{margin:0 0 12px}
/* 10. Pie del Inspector: sombra ligera; al desplazar, las pestañas se separan del contenido */
:root.st-esc .st-pie-insp{box-shadow:0 -1px 0 var(--line)!important}
:root.st-esc .st-pie-insp::before{display:none!important}
:root.st-esc[data-theme="dark"] .st-pie-insp{box-shadow:0 -1px 0 rgba(255,255,255,.1)!important}
:root.st-esc #colInspector.st-desplazado #stITabs{box-shadow:0 6px 12px -10px rgba(15,14,31,.35);position:relative;z-index:4}
:root.st-esc #colInspector.st-desplazado>.st-scroll{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 18px);mask-image:linear-gradient(to bottom,transparent 0,#000 18px)}
/* 11. Plantillas para ti con el lenguaje del modal (ícono en mosaico de color) y «Sugeridas para ti» en la misma rejilla */
:root.st-esc .si-pt.si-pt-ic{display:flex!important;flex-direction:row!important;align-items:center;gap:14px;padding:14px 16px!important;min-height:76px;text-align:left}
:root.st-esc .si-pt-tile{flex:none;width:44px;height:44px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--mk) 14%,transparent);color:var(--mk)}
:root.st-esc[data-theme="dark"] .si-pt-tile{background:color-mix(in srgb,var(--mk) 24%,var(--surface));color:#ECECF0}
:root.st-esc .si-pt-ic .si-pt-c{padding:0!important}
:root.st-esc .st-pls #stPlantillas>.st-sug{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;column-gap:24px!important}
@media (max-width:1439px){ :root.st-esc .st-pls #stPlantillas>.st-sug{grid-template-columns:repeat(2,minmax(0,1fr))!important} }
/* 12. «Ambos»: el marco de escritorio recorta sus esquinas; el menú ⋯ sin velo (como los demás menús); Diseño con miniatura del héroe */
:root.st-esc .st-marco-esc{clip-path:inset(0 round 12px)}
:root.st-esc body:has(#stMasMenu:not([hidden])) #colInspector::after{display:none!important}
:root.st-esc .st-arq .sw{position:relative;display:block!important;width:100%;height:38px;border-radius:7px;overflow:hidden;border:1px solid color-mix(in srgb,var(--ink) 14%,transparent)}
:root.st-esc .st-arq .sw i{position:absolute;border:0!important;border-radius:2px}
:root.st-esc .st-arq .sw i:nth-child(1){inset:0;border-radius:0;width:auto!important;height:auto!important}
:root.st-esc .st-arq .sw i:nth-child(2){left:8px;top:9px;width:56%!important;height:6px!important}
:root.st-esc .st-arq .sw i:nth-child(3){left:8px;bottom:8px;width:30%!important;height:9px!important;border-radius:5px}
:root.st-esc .st-arq{flex-direction:column;align-items:stretch!important}
:root.st-esc .si-prim-li{text-align:left}
:root.st-esc .si-prim-li .si-prim-c{align-items:flex-start}

/* ===== T4 (4-nov-2026): precio en una frase, sin palabras solas, barra y cabecera fijas, selector sobre el lienzo, «Ambos» que
   llena el alto, puerta más compacta, Calidad legible, María secundaria, tipografía de ayuda y plantillas con su ícono ===== */
/* 1–2. Una sola frase de precio; cada tramo («vence 4 dic») nunca se parte: la línea solo corta por los «·» */
:root.st-esc .st-frase-precio{margin:0;font:400 13.5px/1.45 var(--body);color:var(--muted);text-wrap:balance}
:root.st-esc .st-frase-precio b{color:var(--ink);font-weight:600}
:root.st-esc .st-fp{white-space:nowrap}
:root.st-esc #stPlan .st-plan-l1.st-frase-precio{font-size:14px;color:var(--ink)}
:root.st-esc .st-precio-u{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px}
:root.st-esc .st-precio-u .st-fp{font:400 13.5px var(--body);color:var(--muted)}
/* 3. Titulares: el mismo peso en claro y oscuro (cortan igual en los dos temas) */
:root.st-esc[data-theme="dark"] .st-rec-t,:root.st-esc[data-theme="dark"] .st-rec-card h4,:root.st-esc[data-theme="dark"] #colInspector .st-h3,:root.st-esc[data-theme="dark"] #colInspector .st-panel>summary,:root.st-esc[data-theme="dark"] .si-cont-ficha h3,:root.st-esc[data-theme="dark"] .si-sec h2{font-weight:600!important}
/* 4. Barra del enlace igual en todas las pestañas; Publicar no repite «Copiar» */
:root.st-esc #stPublicacion .st-enlace-e [data-copiar]{display:none!important}
/* 5. «Compartir» de la cabecera: siempre ícono; apagado cuando no hay enlace en línea. «Abrir afuera» siempre presente */
:root.st-esc header.st-top #stPublicar.st-pub-ic:disabled{opacity:.45;cursor:not-allowed}
:root.st-esc #btnAbrirApp.st-apagado{opacity:.4;pointer-events:none}
/* 6. Selector de dispositivo centrado sobre el lienzo (left lo pone escritorio.js) */
:root.st-esc .st-disp{transition:left .2s ease}
/* 7. «Ambos»: la vista de escritorio con el mismo marco que el celular, más ancha y del alto disponible */
:root.st-esc.st-ambos .st-lienzo{padding-left:16px!important;padding-right:16px!important;gap:40px!important}
:root.st-esc .st-marco-esc{width:var(--st-ew,768px)!important;height:var(--st-eh,480px)!important;clip-path:none!important;border:8px solid #16151f;border-radius:20px!important;box-sizing:border-box;background:#16151f!important;box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 16%,transparent),0 36px 50px -30px color-mix(in srgb,var(--st-app-s,#7C3AED) 55%,rgba(15,14,31,.5)),0 60px 90px -50px rgba(15,14,31,.45)!important}
:root.st-esc[data-theme="dark"] .st-marco-esc{border-color:#050509;background:#050509!important;box-shadow:0 0 0 1px rgba(255,255,255,.3),0 30px 70px -24px rgba(0,0,0,.8)!important}
:root.st-esc .st-marco-esc iframe{height:var(--st-vh,800px)!important;border-radius:12px}
/* 8. Puerta a 1920: texto y celular más juntos; apps de ejemplo como tarjetas legibles, con margen abajo */
@media (min-width:1440px){ :root.st-esc body.st-sin-sesion .st-puerta{gap:64px!important} }
:root.st-esc body.st-sin-sesion .st-pt-tira{margin-bottom:32px}
:root.st-esc .st-pt-tira ul{gap:12px}
:root.st-esc .st-pt-card{padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--surface);gap:10px!important}
:root.st-esc .st-pt-card .st-pt-mini{width:100%;height:150px;border:0;border-radius:10px;box-shadow:none;background:color-mix(in srgb,var(--accent) 7%,var(--bg))}
:root.st-esc .st-pt-card .st-pt-mini iframe{left:50%;width:390px;transform:translateX(-50%) scale(.36);transform-origin:50% 0}
:root.st-esc .st-pt-tira-c b{font-size:14.5px}
/* 9. Calidad: «Ver ensayo en vivo» al final (no fijo); pruebas sangradas bajo su grupo; chevrón en el título; 19/19 siempre en la pestaña */
:root.st-esc #stCalidad .st-ensayo-b{position:static!important;box-shadow:none!important;margin-top:16px!important}
:root.st-esc .st-cal-g .st-pruebas{padding-left:30px!important}
:root.st-esc .st-cal-g summary{grid-template-columns:20px minmax(0,1fr) auto 14px!important}
:root.st-esc .st-cal-g summary::after{content:"";width:8px;height:8px;border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);transform:rotate(-45deg);justify-self:center;transition:transform .15s}
:root.st-esc .st-cal-g[open] summary::after{transform:rotate(45deg)}
:root.st-esc #stITabs .st-tab-n{display:inline-flex!important;align-items:center;height:18px;padding:0 5px;margin-left:4px;border-radius:999px;background:var(--st-s2);font:500 11px var(--body);color:var(--ink)}
@media (max-width:1439px){ :root.st-esc .st-itabs{gap:10px!important;padding-left:12px!important;padding-right:10px!important} :root.st-esc .st-itabs [role="tab"]{font-size:12.5px!important} }
/* 10. María a 1920: tarjeta flotante (sin columna alta vacía), bienvenida compacta y campo secundario que dice a quién le habla */
:root.st-esc.st-maria-col .st-body .sop-panel{top:60px!important;right:12px!important;bottom:auto!important;width:calc(var(--st-mar,360px) - 24px)!important;max-height:calc(100vh - 80px);border:1px solid var(--line)!important;border-radius:16px!important;box-shadow:0 24px 60px -24px rgba(15,14,31,.45)!important;display:flex;flex-direction:column}
:root.st-esc.st-maria-col .st-body .sop-panel .sop-bienv{padding:10px 12px!important}
:root.st-esc.st-maria-col .st-body .sop-panel .sop-bienv h3,:root.st-esc.st-maria-col .st-body .sop-panel .sop-bienv p{margin:0}
:root.st-esc.st-maria-col .st-body .sop-panel .sop-bienv [class*="ic"]{display:none}
:root.st-esc .st-body .sop-panel .sop-barra textarea{background:var(--st-s2,var(--bg))!important;border-color:transparent!important;font-size:14px}
:root.st-esc .st-body .sop-panel .sop-barra{border-radius:14px}
/* 11. Textos de ayuda del Inspector: mínimo 13 px y contraste AA (sin opacidad) */
:root.st-esc #colInspector .st-nota,:root.st-esc #colInspector .st-rec-f,:root.st-esc #colInspector .st-rec-qrw p,:root.st-esc #colInspector .st-rec-desc,:root.st-esc #colInspector small,:root.st-esc #colInspector .st-pie-nota,:root.st-esc #colInspector .st-hist-c small{font-size:13px!important}
:root.st-esc .st-rec-p.fut{opacity:1!important}
:root.st-esc .st-rec-p.fut b,:root.st-esc .st-rec-p.fut .st-rec-f{color:var(--muted)!important}
/* 11. Panel izquierdo: títulos de sección como etiquetas (más pequeños y tenues), los elementos mandan */
:root.st-esc .st-izq .st-h3,:root.st-esc .st-izq .st-col-cab h2,:root.st-esc .st-lat-t{font:500 12px/1.3 var(--body)!important;color:var(--muted)!important}
/* 11. Tabla «Tus apps»: nombre fuerte, resto normal, cifras a la derecha, chevrón y fila con hover */
:root.st-esc .si-tr{grid-template-columns:minmax(0,2fr) 1.1fr .8fr .9fr .7fr .8fr 16px!important;font-weight:400!important}
:root.st-esc .si-tr .si-td-app b{font-weight:600}
:root.st-esc .si-tr>span:not(.si-td-app){font-weight:400}
:root.st-esc .si-tr .si-est{font-weight:500}
:root.st-esc .si-td-n{text-align:right;justify-self:end;font-variant-numeric:tabular-nums}
:root.st-esc .si-td-fl{color:var(--muted);font-size:18px;justify-self:end;transition:transform .15s,color .15s}
:root.st-esc .si-tr:not(.si-th):hover .si-td-fl{color:var(--accent);transform:translateX(2px)}
:root.st-esc .si-tr:not(.si-th){cursor:pointer}
/* 12. Plantillas: «Sugeridas para ti» llena su fila; títulos más fuertes que la descripción */
:root.st-esc .st-pls #stPlantillas>.st-sug{grid-template-columns:repeat(var(--n-sug,3),minmax(0,1fr))!important}
:root.st-esc .st-pls .st-plantilla>span:last-child>span:first-child{color:var(--ink);font-weight:600}
:root.st-esc .st-pls .st-plantilla .d{color:var(--muted);font-weight:400}
/* 12. Diseño: miniatura del arquetipo con su fondo, su tipografía y su acento */
:root.st-esc .st-arq .sw.sw-h{position:relative;display:flex!important;align-items:center;gap:6px;width:100%;height:44px;padding:0 8px;box-sizing:border-box;border-radius:8px;background:var(--b);border:1px solid color-mix(in srgb,var(--ink) 14%,transparent);overflow:hidden}
:root.st-esc .st-arq .sw.sw-h b{font-size:20px;line-height:1;color:var(--t);letter-spacing:-.01em}
:root.st-esc .st-arq .sw.sw-h i{position:static!important;display:block;flex:1;height:5px!important;width:auto!important;border-radius:3px;background:color-mix(in srgb,var(--t) 30%,transparent)!important;inset:auto!important}
:root.st-esc .st-arq .sw.sw-h em{display:block;width:18px;height:12px;border-radius:6px;background:var(--a)}
/* T4 · ajustes tras revisar las capturas */
:root.st-esc.st-ambos .st-lienzo{padding-left:24px!important;padding-right:72px!important}
:root.st-esc .st-pls .st-plantilla>span:last-child>span:first-child{color:var(--ink)!important;font-weight:600!important}
:root.st-esc .st-pls .st-plantilla .d{color:var(--muted)!important;font-weight:400!important}
@media (min-width:1440px){ :root.st-esc body.st-sin-sesion .st-puerta{grid-template-columns:minmax(0,540px) auto!important} }
/* Pie del plan dimensionado: una frase («Plan Óptimo · US$ 21 / mes · hoy gratis con tu cuenta») */
:root.st-esc .st-pie-insp .st-pie-precio{display:block!important;margin:0;font:400 13.5px/1.45 var(--body);color:var(--muted);text-wrap:balance}
:root.st-esc .st-pie-insp .st-pie-precio .st-pie-plan,:root.st-esc .st-pie-insp .st-pie-precio .st-pie-g{display:inline!important;font:inherit!important;color:inherit}
:root.st-esc .st-pie-insp .st-pie-precio .st-pie-g::before{content:" · "}
:root.st-esc .st-pie-insp .st-pie-precio b{font:600 13.5px var(--body)!important;color:var(--ink)!important}
:root.st-esc .st-pie-insp .st-pie-precio .st-precio-u,:root.st-esc .st-pie-insp .st-pie-precio p{display:inline!important;margin:0}
:root.st-esc .st-pie-insp .st-pie-precio .st-info{display:none}
/* Pestañas del Inspector a 1280: caben las cinco con la cifra de Calidad */
@media (max-width:1699px){ :root.st-esc .st-itabs{gap:5px!important;padding-left:8px!important;padding-right:6px!important} :root.st-esc .st-itabs [role="tab"]{font-size:12px!important} :root.st-esc #stITabs .st-tab-n{padding:0 3px!important;margin-left:2px!important;font-size:10.5px!important;letter-spacing:-.02em} }
:root.st-esc .si-td-n{padding-right:16px}

/* ===== T5 (4-nov-2026, ronda final): pestañas con aire, precio en dos filas, «Publicar» siempre, sin vacíos, titulares,
   peso en oscuro, barra del enlace como una pastilla, «Ambos» con ventana de navegador y detalles ===== */
/* 1. Pestañas del Inspector: separación real; la cifra de Calidad es un punto discreto por debajo de 1700 px. Historial siempre en «⋯» */
:root.st-esc .st-itabs #itHistorial{display:none!important}
:root.st-esc .st-itabs-mas{display:block!important}
@media (max-width:1699px){
  :root.st-esc .st-itabs{gap:16px!important;padding-left:8px!important;padding-right:4px!important}
  :root.st-esc .st-itabs [role="tab"]{font-size:13px!important;padding-left:0!important;padding-right:0!important}
  :root.st-esc #stITabs .st-tab-n{display:inline-block!important;width:6px;height:6px;min-width:0;padding:0!important;margin:0 0 0 5px!important;border-radius:50%;background:#16A34A!important;font-size:0!important;line-height:0;vertical-align:middle;overflow:hidden;color:transparent!important}
  :root.st-esc #stITabs .st-tab-n.mal{background:#D97706!important}
}
@media (max-width:1365px){ :root.st-esc .st-itabs{gap:14px!important;padding-left:6px!important} :root.st-esc .st-itabs [role="tab"]{font-size:12px!important} }
@media (min-width:1700px){ :root.st-esc .st-itabs{gap:16px!important;padding-left:12px!important} :root.st-esc #stITabs .st-tab-n{display:inline-flex!important;height:18px;padding:0 6px!important;margin-left:6px!important;font:500 11.5px var(--body)!important;background:var(--st-s2)!important;color:var(--muted)!important} :root.st-esc #stITabs .st-tab-n.mal{color:#B45309!important} }
/* 2. Precio en dos filas: «Plan Básico» … «US$ 8» / «Gratis con tu cuenta · vence 4 dic» */
:root.st-esc .st-frase-precio{display:flex!important;flex-direction:column;gap:2px;text-wrap:wrap!important}
:root.st-esc .st-fp-r1{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
:root.st-esc .st-fp-plan{color:var(--ink);font-size:14px;white-space:nowrap}
:root.st-esc .st-fp-plan>span{color:var(--muted)}
:root.st-esc .st-fp-plan b,:root.st-esc .st-fp-pr{font:600 14px var(--body)!important;color:var(--ink)!important;white-space:nowrap;font-variant-numeric:tabular-nums}
:root.st-esc .st-fp-r2{font-size:13px;color:var(--muted)}
:root.st-esc .st-pie-insp .st-pie-precio{display:flex!important}
:root.st-esc .st-pie-insp .st-pie-precio .st-pie-g::before{content:none}
/* «Ver todos los planes» pegado a la tabla del plan, como su última fila */
:root.st-esc #stTodosPlanes{margin-top:8px!important}
:root.st-esc #stTodosPlanes>summary{display:flex;align-items:center;justify-content:space-between;min-height:40px;padding:0 12px;border:1px solid var(--line);border-radius:10px;font:500 13.5px var(--body);color:var(--accent);cursor:pointer;list-style:none}
:root.st-esc #stTodosPlanes>summary::-webkit-details-marker{display:none}
:root.st-esc #stTodosPlanes>summary::after{content:"›";font-size:18px;color:var(--muted);transition:transform .15s}
:root.st-esc #stTodosPlanes[open]>summary::after{transform:rotate(90deg)}
:root.st-esc[data-theme="dark"] #stTodosPlanes>summary{color:#C4B5FD}
/* 4. Panel izquierdo: «Siguiente paso» de cada app y «Tu cuenta» junto al contenido (no pegada al fondo) */
:root.st-esc .st-izq .st-lat-extra{flex:0 0 auto!important}
:root.st-esc .st-lat-extra .st-lat-plan{margin-top:16px!important}
:root.st-esc .st-lat-sigs{display:flex;flex-direction:column;gap:2px;margin:0 0 4px}
:root.st-esc .st-lat-sig{display:grid;grid-template-columns:10px minmax(0,1fr) 12px;align-items:center;gap:10px;width:100%;min-height:44px;padding:4px 10px;border:0;border-radius:10px;background:none;color:var(--ink);text-align:left;cursor:pointer}
:root.st-esc .st-lat-sig:hover{background:var(--st-s2)}
:root.st-esc .st-lat-sig-p{width:8px;height:8px;border-radius:50%;background:var(--muted)}
:root.st-esc .st-lat-sig-p.publicada{background:#16A34A}
:root.st-esc .st-lat-sig-p.por-vencer,:root.st-esc .st-lat-sig-p.vencida{background:#F59E0B}
:root.st-esc .st-lat-sig-c{display:flex;flex-direction:column;min-width:0}
:root.st-esc .st-lat-sig-c b{font:500 13.5px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
:root.st-esc .st-lat-sig-c span{font-size:12.5px;color:var(--muted)}
:root.st-esc .st-lat-sig .st-fl{color:var(--muted)}
/* 4. María a 1700+: la tarjeta ocupa el alto de su columna (el registro crece, el campo abajo) */
:root.st-esc.st-maria-col .st-body .sop-panel{bottom:12px!important;max-height:none!important}
:root.st-esc.st-maria-col .st-body .sop-panel .sop-log{flex:1 1 auto}
/* 4. Inicio: sin una franja muerta al pie en pantallas altas (el contenido se centra en el alto) */
@media (min-height:1000px){ :root.st-esc .si-c-esc{min-height:calc(100vh - 48px);display:flex;flex-direction:column;justify-content:center;padding-top:40px!important;padding-bottom:56px!important;box-sizing:border-box} }
/* 4. Puerta: a 1280/1440 una tira compacta de ejemplos llena el tercio inferior; a 1920, las tarjetas */
@media (max-height:999px){
  :root.st-esc body.st-sin-sesion .st-pt-tira{display:block!important;margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}
  :root.st-esc .st-pt-tira-t{margin-bottom:10px!important}
  :root.st-esc .st-pt-card{flex-direction:row!important;align-items:center;padding:8px!important}
  :root.st-esc .st-pt-card .st-pt-mini{flex:none;width:56px!important;height:56px!important;border-radius:8px}
  :root.st-esc .st-pt-card .st-pt-mini iframe{transform:translateX(-50%) scale(.16)!important}
  :root.st-esc .st-pt-tira-c b{font-size:13px!important}
  :root.st-esc .st-pt-tira-c span{font-size:12px!important}
}
:root.st-esc body.st-sin-sesion .st-puerta{align-content:center!important}
/* 5. Titulares del Inspector: en una línea si caben */
:root.st-esc .st-rec-t{font-size:20px!important;letter-spacing:-.015em!important}
/* 6. Oscuro: el mismo renderizado que el claro (un paso menos de peso en chips, celdas, menús y mono; trazo de afinado) */
:root.st-esc[data-theme="dark"] body{-webkit-font-smoothing:antialiased!important;-moz-osx-font-smoothing:grayscale!important;-webkit-text-stroke:0!important}
:root.st-esc[data-theme="dark"] .si-tr>span,:root.st-esc[data-theme="dark"] .si-tr b,:root.st-esc[data-theme="dark"] .si-tr .si-est,:root.st-esc[data-theme="dark"] .st-sug-c,:root.st-esc[data-theme="dark"] .si-ej,:root.st-esc[data-theme="dark"] .st-ent,:root.st-esc[data-theme="dark"] .st-masop-menu button,:root.st-esc[data-theme="dark"] .st-miga-menu button,:root.st-esc[data-theme="dark"] .st-itabs-mas-m button,:root.st-esc[data-theme="dark"] .st-app .nom,:root.st-esc[data-theme="dark"] .st-lat-her .nom{font-weight:400!important}
:root.st-esc[data-theme="dark"] .si-tr .si-td-app b{font-weight:500!important}
:root.st-esc[data-theme="dark"] code,:root.st-esc[data-theme="dark"] .st-enl-url,:root.st-esc[data-theme="dark"] .si-cont-url,:root.st-esc[data-theme="dark"] kbd{font-weight:400!important}
/* 7. Barra del enlace como una sola pastilla: «Copiar» es su segmento derecho (mismo alto, separador de 1 px), igual en todos los anchos */
:root.st-esc .st-enl-bar{padding:0 0 0 12px!important;overflow:hidden;gap:8px!important}
:root.st-esc .st-enl-bar .st-enl-b{align-self:stretch;height:auto!important;margin:0!important;padding:0 14px!important;border:0!important;border-left:1px solid var(--line)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
:root.st-esc .st-enl-bar .st-enl-b:hover{background:var(--st-s2)!important}
:root.st-esc .st-enl-bar .st-enl-b span{display:inline!important}
:root.st-esc .st-enl-bar .st-enl-renovar{border-left:1px solid var(--line)!important}
:root.st-esc #stPublicacion .st-enlace-e{display:none!important}
/* 8. «Ambos»: la vista de escritorio en una ventana de navegador ligera (barra con tres puntos), no un bisel de celular */
:root.st-esc .st-marco-esc{border:1px solid var(--line)!important;border-radius:12px!important;background:var(--surface)!important;padding-top:30px;overflow:hidden!important}
:root.st-esc .st-marco-esc::before{content:"";position:absolute;top:0;left:0;right:0;height:30px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 16px 15px,#F87171 4px,transparent 4.5px),radial-gradient(circle at 30px 15px,#FBBF24 4px,transparent 4.5px),radial-gradient(circle at 44px 15px,#34D399 4px,transparent 4.5px),var(--st-s2,var(--bg));z-index:2}
:root.st-esc[data-theme="dark"] .st-marco-esc{border-color:rgba(255,255,255,.18)!important;background:#121216!important}
:root.st-esc .st-marco-esc iframe{top:30px!important;width:var(--st-vw,1100px)!important;transform:scale(var(--st-ke,.6))!important;border-radius:0!important}
/* 10. Diseño: miniaturas con su radio, un botón y una tarjeta; borde visible en oscuro; «Modo consultor» sin cortarse */
:root.st-esc .st-arq .sw.sw-h{border-radius:var(--r,8px)!important;height:52px!important}
:root.st-esc .st-arq .sw.sw-h .sw-c{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
:root.st-esc .st-arq .sw.sw-h .sw-c i{display:block;height:4px!important;border-radius:2px;background:color-mix(in srgb,var(--t) 30%,transparent)!important}
:root.st-esc .st-arq .sw.sw-h .sw-c i+i{width:60%!important}
:root.st-esc .st-arq .sw.sw-h em{width:20px;height:14px;border-radius:calc(var(--r,8px) / 2)}
:root.st-esc[data-theme="dark"] .st-arq .sw.sw-h{border-color:rgba(255,255,255,.28)!important}
:root.st-esc #colInspector .st-scroll{scroll-padding-bottom:48px}
:root.st-esc #colInspector .st-panel:last-child{padding-bottom:32px}
/* 11. Modal de plantillas: miniatura visual por plantilla; títulos fuertes; el final de la lista se anuncia */
:root.st-esc .st-pls .st-plantilla>.st-pl-mk{flex:none;width:76px!important;height:44px!important;padding:0!important;background:none!important;border-radius:8px;overflow:hidden}
:root.st-esc .st-pls .st-plantilla>.st-pl-mk .si-mk{width:100%;height:100%;aspect-ratio:auto!important;padding:5px;gap:3px;border:1px solid var(--line);border-radius:8px;transform-origin:0 0}
:root.st-esc .st-pls .st-plantilla>.st-pl-mk .mk-ic{display:none}
:root.st-esc .st-pls .st-plantilla>span:last-child>span:first-child{font-size:14.5px!important}
:root.st-esc .st-pls .st-sugerido{display:none!important}
:root.st-esc .st-pls #stPlantillas{padding-bottom:56px}

/* 12. QR a 1280 con su texto; campo de María con fondo hasta el botón; tabla «Tus apps» bien repartida; 25 a 1280 con el botón a la vista */
:root.st-esc .st-der.st-compacto .st-rec-qrw p{display:block!important;font-size:12.5px!important}
:root.st-esc .st-body .sop-panel .sop-barra{background:var(--st-s2,var(--bg))!important;border-color:transparent!important}
:root.st-esc .st-body .sop-panel .sop-barra textarea{background:transparent!important}
@media (min-width:1700px){ :root.st-esc .si-tr{grid-template-columns:minmax(0,2.4fr) 1.2fr .8fr 1fr .7fr .8fr 16px!important;gap:24px!important} }
@media (max-height:850px){ :root.st-esc .si-prim-vista{height:150px!important} :root.st-esc .si-primera .si-sec-cab{margin-bottom:10px!important} }
@media (max-width:1699px){ :root.st-esc #colInspector #stITabs{padding-left:6px!important;padding-right:2px!important} }
@media (min-width:1700px){ :root.st-esc #colInspector #stITabs{padding-left:10px!important;padding-right:2px!important} }
:root.st-esc .st-frase-precio,:root.st-esc .st-fp-r1{width:100%}
@media (max-height:999px){ :root.st-esc .st-pt-tira-c b{white-space:normal!important;overflow:visible!important} }
:root.st-esc .st-arq .sw.sw-h .sw-c{flex:1 1 24px!important;min-width:20px;height:auto!important;position:static!important}
:root.st-esc .st-arq .sw.sw-h .sw-c i{position:static!important;width:100%!important;height:4px!important;flex:none!important}
:root.st-esc .st-arq .sw.sw-h .sw-c i+i{width:60%!important}
:root.st-esc .st-arq .sw.sw-h b{font-size:18px!important}

/* Errores de T5 (4-nov-2026) */
/* Calidad: el punto sigue verde (o ámbar) también en modo oscuro; la regla oscura de la cifra lo dejaba gris. */
@media (max-width:1699px){
  :root.st-esc[data-theme="dark"] #stITabs .st-tab-n{background:#22C55E!important;color:transparent!important}
  :root.st-esc[data-theme="dark"] #stITabs .st-tab-n.mal{background:#F59E0B!important}
}
/* QR de la tarjeta «Ahora»: en compacto el texto se encoge y pasa de línea, nunca se sale de la tarjeta. */
:root.st-esc .st-rec-qrw,:root.st-esc .st-der.st-compacto .st-rec-qrw{flex:1 1 auto!important;min-width:0!important}
:root.st-esc .st-rec-qrw p{flex:1 1 auto;min-width:0;white-space:normal!important;overflow-wrap:anywhere}
:root.st-esc .st-rec-qrw .st-rec-qr{flex:none}
/* Precio con la cuenta gratis: «Gratis» como cifra principal y el precio de lista tachado al lado. */
:root.st-esc .st-fp-gratis{display:inline-flex;align-items:baseline;gap:6px;white-space:nowrap}
:root.st-esc .st-fp-lista{color:var(--muted);font:400 13px var(--body);text-decoration:line-through;font-variant-numeric:tabular-nums}
/* Oscuro suave (6-nov-2026): caja de la idea y tarjeta «Ahora» sin borde violeta fuerte ni halo; el violeta queda como acento discreto. */
:root.st-esc[data-theme="dark"] .si[data-ambiente="vivo"] .si-idea{background:linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(120deg,color-mix(in srgb,var(--accent) 45%,#3F3F47),#3F3F47 60%,color-mix(in srgb,var(--accent) 30%,#3F3F47)) border-box!important}
:root.st-esc[data-theme="dark"] .st-rec-p.ahora:not(.alerta) .st-rec-card{border-color:color-mix(in srgb,var(--accent) 28%,var(--line));background:color-mix(in srgb,#fff 3%,var(--surface))}
