/* Cocuyo CSS bundle v1: generated by scripts/build-css.mjs. */
/* cocuyo-css: assets/css/estudio-compositor.css */
/* Compositores del Estudio avanzado — 5-sep-2026.
   Orden de trabajo: referencias, descripcion, ajustes y Generar.
   Usa los tokens del Estudio. Audio conserva su panel profesional propio.
   --mesa-h sigue midiendose con el ResizeObserver existente. */
#mesa:has(.compositor-visual) .mesa-in{
  width:min(960px,100%);padding:12px 16px 14px;border-radius:20px;
  background:var(--surface);border-color:var(--border2);
  -webkit-backdrop-filter:none;backdrop-filter:none;
  box-shadow:0 16px 56px color-mix(in srgb,var(--negro-abismo) 65%,transparent);
}
#mesa:has(.compositor-visual) .mesa-in::before,
#mesa:has(.compositor-visual) .mesa-in::after{display:none}
#mesa:has(.compositor-visual) .mesa-top{
  gap:8px 12px;margin:0 0 12px;padding-bottom:12px;border-bottom:1px solid var(--border);
}
#mesa:has(.compositor-visual) .modesw .inner{
  padding:3px;background:var(--bg);border:1px solid var(--border);border-radius:12px;
}
#mesa:has(.compositor-visual) .modesw button{
  min-height:38px;padding:8px 14px;gap:7px;border-radius:9px;font-weight:550;
}
#mesa:has(.compositor-visual) .modesw button.active{
  background:var(--surface3);color:var(--text);box-shadow:none;
}
#mesa:has(.compositor-visual) .modesw button.active .ic{color:var(--lima)}
#mesa:has(.compositor-visual) .appbtn{
  min-height:34px;padding:6px 10px;background:transparent;border-color:transparent;
  color:var(--muted2);font-size:12px;font-weight:450;
}
#mesa:has(.compositor-visual) .appbtn:hover{background:var(--surface2);border-color:var(--border)}

.mesa-in .compositor-visual{
  display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;
  padding:0;min-width:0;border-radius:12px;
}
.compositor-visual #refgrid,
.compositor-visual #imageRefControls{grid-column:1/-1;grid-row:1}
.compositor-visual #attrow{grid-column:1/-1;grid-row:2}
.compositor-visual #ta{grid-column:1/-1;grid-row:3}
.compositor-visual #parambar{grid-column:1;grid-row:4}
.compositor-visual #headicons{grid-column:2;grid-row:4}
.compositor-visual #refgrid{
  flex-wrap:wrap;gap:8px;margin:0 0 12px;padding:0;overflow:visible;
}
.compositor-visual .refbox{
  width:auto;min-height:42px;height:auto;flex-direction:row;gap:8px;
  padding:10px 12px;border:1px dashed var(--border2);border-radius:10px;
  background:var(--bg);color:var(--muted2);font-size:12px;font-weight:500;
}
.compositor-visual .refbox .ic{width:17px;height:17px;flex-basis:17px;color:var(--lima)}
.compositor-visual .refbox:hover{border-color:var(--lima);color:var(--text)}
.refbox .refbox-label{display:flex;flex-direction:column;gap:4px;text-align:left}
.refbox .refbox-label small{font-size:11px;font-weight:400;color:var(--muted2);line-height:1.35}
.compositor-visual .image-ref-controls{gap:8px 12px;margin:0 0 12px}
.compositor-visual .image-ref-add{
  min-height:44px;padding:10px 12px;gap:8px;background:var(--bg);border-radius:10px;
}
.compositor-visual .image-ref-add>.ic{color:var(--lima)}
.compositor-visual .image-ref-add b{
  padding:3px 7px;min-width:35px;background:var(--surface3);color:var(--muted2);
  font-size:11px;font-variant-numeric:tabular-nums;text-align:center;
}
.compositor-visual .image-ref-hint{font-size:12px;color:var(--muted);line-height:1.45}
.compositor-visual .refpop{
  border:1px solid var(--border2);border-radius:14px;background:var(--surface);
}
.compositor-visual .refpop button{
  min-height:46px;gap:10px;padding:11px 12px;border-radius:9px;font-size:13px;
}
.compositor-visual .refpop button>.ic{color:var(--lima)}
.compositor-visual .refpop p{color:var(--muted2);line-height:1.5}

/* Una tira de miniaturas, aunque el modelo admita 16. Su propio scroll
   horizontal no convierte la mesa en varias filas ni afecta al prompt. */
.compositor-visual #attrow{
  flex-wrap:nowrap!important;gap:8px!important;min-width:0;max-width:100%;
  overflow-x:auto;overflow-y:hidden;padding:2px 0 7px;margin-bottom:8px!important;
  scrollbar-width:thin;scrollbar-color:var(--border2) transparent;
}
.compositor-visual .attchip{
  flex:0 0 80px;width:80px;height:80px;border-radius:12px;border-color:var(--border2);
}
.compositor-visual .attchip .x{
  top:3px;right:3px;width:26px;height:26px;border-radius:8px;
  background:color-mix(in srgb,var(--negro-abismo) 88%,transparent);
}
.compositor-visual .attchip .x:hover{background:var(--peligro);color:var(--tinta-sobre-verde)}
.compositor-visual .attrol,.compositor-visual .attrolfijo{min-height:22px;font-size:10px;padding:4px}
.compositor-visual .attcuenta{flex:0 0 auto;white-space:nowrap;color:var(--muted2)}

/* El editor conserva contenteditable y su gestion de pegado/menciones.
   Solo su contenido crece y se desplaza; el boton queda fuera de ese scroll. */
.compositor-visual #ta{
  min-width:0;min-height:80px;max-height:min(230px,26dvh);overflow-y:auto;
  padding:10px 2px 14px;margin:0 0 10px;font-size:15px;line-height:1.6;
  overflow-wrap:anywhere;scrollbar-width:thin;border-bottom:1px solid var(--border);
}
.compositor-visual #ta:focus-visible{outline:0;border-bottom-color:var(--lima)}
.compositor-visual #ta:empty::before{color:var(--muted)}
.compositor-visual #parambar{
  min-width:0;align-items:center;align-content:end;flex-wrap:wrap;gap:6px;
  padding:0;font-size:12px;
}
.compositor-visual #parambar>.lbl{
  position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;
}
.compositor-visual .param{
  min-height:40px;max-width:100%;gap:7px;padding:9px 10px;border:1px solid var(--border);
  border-radius:10px;background:var(--surface2);font-size:12px;font-weight:500;
}
.compositor-visual .param[data-pop="model"]{background:var(--bg);border-color:var(--border2);font-weight:600}
.compositor-visual .param[data-pop="model"]>span:first-of-type{
  min-width:0;overflow:hidden;text-overflow:ellipsis;
}
.compositor-visual .param:hover,.compositor-visual .param.open{
  background:var(--surface3);border-color:var(--border2);box-shadow:none;
}
.compositor-visual .param-caption{color:var(--muted2);font-weight:450}
.compositor-visual #parambar .cost{
  min-height:40px;margin-left:auto;padding:8px 2px 8px 8px;gap:5px;
  color:var(--muted2);font-size:12px;
}
.compositor-visual .cost b{font-size:14px;font-weight:650;color:var(--text)}
.compositor-visual .cost-caption{color:var(--muted);font-size:11px}
.compositor-visual #omniLimits{padding:3px 0 0;max-width:100%;overflow-wrap:anywhere}
.compositor-visual #headicons{
  position:static;align-self:start;display:flex;align-items:center;justify-content:flex-end;gap:0;
}
.compositor-visual #headicons .roundbtn{
  width:auto;min-width:124px;min-height:42px;height:auto;padding:11px 17px;
  border-radius:11px;background:var(--lima);color:var(--tinta-sobre-verde);
  font-size:13px;font-weight:700;gap:8px;box-shadow:none;transform:none;
}
.compositor-visual #headicons .roundbtn .rlbl{display:inline}
.compositor-visual #headicons .roundbtn:hover{background:var(--lima-clara);box-shadow:none;transform:none}
.compositor-visual #headicons .roundbtn:disabled{opacity:.5;cursor:wait}
.compositor-visual :is(button,select,[tabindex]):focus-visible{
  outline:2px solid var(--lima);outline-offset:3px;
}
.compositor-visual .pop{max-width:calc(100vw - 32px)}
.compositor-visual .pop .opt{min-height:40px;font-weight:500}
.compositor-visual .pop .opt.sel{background:var(--lima-suave);color:var(--text)}

@media(max-width:640px){
  #mesa:has(.compositor-visual) .mesa-in{
    padding:10px 12px 12px;border-radius:18px;max-height:70vh;max-height:70dvh;
    overscroll-behavior-y:contain;
  }
  #mesa:has(.compositor-visual) .mesa-top{gap:7px;margin-bottom:10px;padding-bottom:10px}
  #mesa:has(.compositor-visual) .modesw button{min-height:40px;padding:8px 11px;font-size:12px}
  .mesa-in .compositor-visual{grid-template-columns:minmax(0,1fr);column-gap:0}
  .compositor-visual #parambar{grid-column:1/-1;gap:6px}
  .compositor-visual #headicons{
    grid-column:1/-1;grid-row:5;position:sticky;bottom:-12px;z-index:16;
    margin:10px -12px -12px;padding:10px 12px 12px;background:var(--surface);
    border-top:1px solid var(--border);
  }
  .compositor-visual #headicons .roundbtn{width:100%;min-height:46px;font-size:14px}
  .compositor-visual .image-ref-hint{flex-basis:auto;font-size:11px}
  .compositor-visual #refgrid{gap:6px;margin-bottom:10px}
  .compositor-visual .refbox{min-height:40px;padding:9px 10px;font-size:11px}
  .compositor-visual .attchip{flex-basis:72px;width:72px;height:72px}
  .compositor-visual #ta{min-height:68px;max-height:20dvh;font-size:14px;padding:8px 1px 12px}
  .compositor-visual .param{min-height:42px;padding:9px;font-size:12px}
  .compositor-visual .param-caption{font-size:11px}
  .compositor-visual #parambar .cost{padding-left:4px}
  .compositor-visual .pop .opt{min-height:44px}
  /* Los menus salen del scroll de la mesa: PC/galeria y duracion siguen
     siendo alcanzables aunque las referencias hayan aumentado su altura.
     La mesa opaca no necesita un filtro que capture position:fixed. */
  .compositor-visual .pop,.compositor-visual .refpop{
    position:fixed;left:16px;right:16px;top:auto;bottom:calc(80px + env(safe-area-inset-bottom));
    width:auto;min-width:0;max-width:none;max-height:55vh;max-height:55dvh;
    overflow-y:auto;overscroll-behavior-y:contain;transform:none;z-index:80;
    text-align:left;
  }
  .compositor-visual .pop .ph{font-size:11px;letter-spacing:.04em;line-height:1.5}
}
@media(max-width:380px){
  .compositor-visual .cost-caption{display:none}
  .compositor-visual .param{gap:5px}
  .compositor-visual .image-ref-hint{flex-basis:100%}
}

/* Audio avanzado: voz, guion, modelo, ajustes y precio en una columna.
   Los campos de musica conservan su logica; esta hoja no habilita modelos.
   En escritorio los resultados siguen al lado; en movil se reserva la
   altura real de la mesa para que ninguna creacion quede tapada. */
body.modo-audio{--audio-panel:clamp(350px,30vw,424px)}
body.modo-audio #mesa{width:var(--audio-panel)}
body.modo-audio #pg-home .wrap{padding-left:calc(var(--audio-panel) + 24px)}
body.modo-audio .mesa-in{
  gap:16px;padding:16px 18px 18px;background:var(--surface);border-color:var(--border2);
  -webkit-backdrop-filter:none;backdrop-filter:none;scrollbar-width:thin;overscroll-behavior-y:contain;
}
body.modo-audio .mesa-in::before,body.modo-audio .mesa-in::after{display:none}
body.modo-audio .mesa-top{padding-bottom:14px;border-bottom:1px solid var(--border);background:var(--surface)}
body.modo-audio .mesa-top .modesw .inner{background:var(--bg);border-radius:12px;border-color:var(--border)}
body.modo-audio .mesa-top .modesw button{min-height:42px;padding:9px 7px;font-size:12px;font-weight:550;gap:7px}
body.modo-audio .mesa-top .modesw button.active{background:var(--surface3);color:var(--text);box-shadow:none}
body.modo-audio .composer{gap:12px;min-width:0;flex-shrink:0}
body.modo-audio .ap-voz{
  min-height:136px;flex-shrink:0;padding:14px;border:1px solid var(--border2);border-radius:14px;
  background:linear-gradient(125deg,var(--surface2),var(--bg));
}
body.modo-audio .ap-voz::after{display:none}
body.modo-audio .ap-voztxt{gap:3px;padding-top:36px}
body.modo-audio .ap-vozlabel{font-size:10px;font-weight:550;color:var(--lima);letter-spacing:.04em}
body.modo-audio .ap-voztxt b{font-size:18px;font-weight:650;letter-spacing:-.02em;text-shadow:none}
body.modo-audio .ap-voztxt small{font-size:12px;color:var(--muted2);line-height:1.45;text-shadow:none;white-space:normal}
body.modo-audio .ap-vozplay{
  top:12px;left:12px;width:38px;height:38px;display:grid;place-items:center;
  background:var(--lima-suave);border:1px solid var(--border2);color:var(--lima);backdrop-filter:none;
}
body.modo-audio .ap-vozcambia{
  min-height:38px;top:12px;right:12px;padding:9px 12px;border-radius:10px;
  background:var(--surface2);border-color:var(--border2);font-size:12px;font-weight:500;backdrop-filter:none;
}
body.modo-audio .ap-vozcambia:hover,body.modo-audio .ap-vozplay:hover{background:var(--surface3);color:var(--text)}
body.modo-audio .ap-rot,body.modo-audio .ap-rot2{
  margin:4px 1px -4px;color:var(--muted2);font-size:12px;font-weight:600;letter-spacing:0;text-transform:none;
}
body.modo-audio #ta{
  min-height:144px;max-height:min(260px,32dvh);padding:13px 14px;line-height:1.65;
  background:var(--bg);border:1px solid var(--border2);border-radius:12px;font-size:14px;
  overflow-wrap:anywhere;scrollbar-width:thin;
}
body.modo-audio #ta:focus-visible{outline:2px solid var(--lima);outline-offset:2px}
body.modo-audio #parambar{gap:12px;min-width:0}
body.modo-audio .ap-fila,body.modo-audio .ap-idioma{
  min-height:48px;padding:12px;border-radius:11px;border-color:var(--border);background:var(--bg);
}
body.modo-audio .ap-fila>b{font-size:12px;font-weight:600}
body.modo-audio .ap-fila>span,body.modo-audio .ap-idioma>span{color:var(--muted2);font-size:12px}
body.modo-audio .ap-fila:hover{background:var(--surface2);border-color:var(--border2)}
body.modo-audio .ap-idioma select{
  min-height:36px;min-width:135px;max-width:65%;padding:7px 10px;border-radius:9px;background:var(--surface2);font-size:12px;
}
body.modo-audio .ap-nota{padding:0 2px;font-size:11px;line-height:1.6;color:var(--muted)}
body.modo-audio .ap-nota.pasa{color:var(--peligro)}
body.modo-audio .ap-campo{gap:7px}
body.modo-audio .ap-campo>span{font-size:12px;color:var(--muted2);letter-spacing:0}
body.modo-audio .ap-campo input:not([type=range]){
  min-height:46px;padding:12px;background:var(--bg);border-color:var(--border2);font-size:13px;
}
/* .sw tambien es un interruptor generico de 34x19. La fila de audio
   necesita su propia altura y solo dibuja el interruptor hijo .ap-sw. */
body.modo-audio .ap-fila.sw{width:100%;height:auto;flex:0 0 auto;margin:0;min-height:48px}
body.modo-audio .ap-fila.sw::after{display:none}
body.modo-audio .ap-fila.sw.on{background:var(--lima-suave)}
body.modo-audio .ap-avwrap{padding-top:3px;border-top:1px solid var(--border)}
body.modo-audio .ap-avwrap>.ap-fila{margin-top:8px;background:transparent;border-color:transparent}
body.modo-audio .ap-avwrap.on>.ap-fila{background:var(--surface2);border-color:var(--border)}
body.modo-audio .ap-avbody{gap:18px;padding:16px 12px 10px}
body.modo-audio .ap-av{gap:10px}
body.modo-audio .ap-av>span{font-size:12px}
body.modo-audio .ap-av>span i{color:var(--text);font-size:12px}
body.modo-audio :is(.ap-av,.ap-campo.rango) input[type=range]{height:6px;margin:8px 0;accent-color:var(--lima)}
body.modo-audio :is(.ap-av,.ap-campo.rango) input[type=range]::-webkit-slider-thumb{width:18px;height:18px}
body.modo-audio :is(.ap-av,.ap-campo.rango) input[type=range]::-moz-range-thumb{
  width:18px;height:18px;border:0;border-radius:50%;background:var(--lima);
}
body.modo-audio .ap-reset{min-height:38px;padding:9px 12px;font-size:12px}
body.modo-audio .ap-rep{padding:12px;gap:10px;border-color:var(--border2);background:var(--bg)}
body.modo-audio .ap-reptxt{min-height:76px;font-size:13px;line-height:1.6;background:var(--surface2)}
body.modo-audio :is(.ap-repoir,.ap-repx){min-width:36px;min-height:36px}
body.modo-audio .ap-repmas{min-height:42px;border-style:dashed;font-size:12px}
body.modo-audio .ap-gen{
  min-height:50px;position:sticky;bottom:0;z-index:8;gap:12px;margin-top:8px;padding:14px;
  border-radius:12px;background:var(--lima);color:var(--tinta-sobre-verde);box-shadow:none;
  font-size:14px;font-weight:700;letter-spacing:0;
}
body.modo-audio .ap-gen:hover{background:var(--lima-clara);filter:none}
body.modo-audio .ap-gen b{
  padding-left:12px;border-left:1px solid color-mix(in srgb,var(--tinta-sobre-verde) 25%,transparent);gap:5px;
}
body.modo-audio .ap-gen b>.ic{display:none}
body.modo-audio .ap-gen-unidad{font-size:12px;font-weight:500}
body.modo-audio .composer :is(button,select,input,textarea):focus-visible{outline:2px solid var(--lima);outline-offset:3px}
@media(max-width:900px){
  body.modo-audio #mesa{
    left:0;right:0;top:auto;bottom:0;width:auto;padding:0 8px calc(8px + env(safe-area-inset-bottom));
    display:flex;justify-content:center;
  }
  body.modo-audio .mesa-in{
    width:min(600px,100%);height:auto;max-height:72vh;max-height:72dvh;padding:12px 14px 14px;
    border:1px solid var(--border2);border-radius:18px;background:var(--surface);
    -webkit-backdrop-filter:none;backdrop-filter:none;
  }
  body.modo-audio #pg-home .wrap{padding:22px 16px calc(var(--mesa-h,460px) + 40px)}
  body.modo-audio .mesa-top{padding-bottom:10px}
  body.modo-audio .composer{gap:10px}
  body.modo-audio .ap-voz{min-height:130px}
  body.modo-audio #ta{min-height:106px;max-height:24dvh;font-size:14px}
  body.modo-audio .ap-gen{bottom:0;min-height:48px}
  body.modo-audio .ap-vozcambia,body.modo-audio .ap-vozplay{min-height:42px}
}
/* El Estudio no importa tokens.css; un enlace administrativo oculto
   debe seguir oculto aunque la navegación aplique display:flex. */
a[data-acceso-admin][hidden] { display: none !important; }

/* Video · Inicio / Final (5-oct-2026): dos huecos lado a lado, «Primer
   fotograma» y «Último fotograma». Vacíos reutilizan la caja de referencia
   (.ref-add-compact) con un + grande; llenos enseñan la miniatura, su nombre
   y un botón para quitarla. El marcado sale de huecosFotogramas (estudio-3.js). */
#mesa #refgrid .ref-frame-slots{display:flex;flex:1 0 100%;gap:8px;min-width:0}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #refgrid .ref-orb.ref-frame-mas{width:38px;height:38px}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #refgrid .ref-orb.ref-frame-mas svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #refgrid .refwrap-compact.ref-frame-lleno{position:relative}
#mesa #refgrid .ref-frame-ver{
  position:relative;display:flex;align-items:flex-end;justify-content:flex-start;width:100%;height:84px;margin:0;padding:0;
  border:1px solid var(--border2);border-radius:12px;overflow:hidden;background:var(--surface2);color:var(--text);
  font:500 11px/1.3 var(--font);text-align:left;cursor:zoom-in;
}
#mesa #refgrid span.ref-frame-ver{align-items:center;justify-content:center;flex-direction:column;gap:7px;font-size:13px;cursor:default}
#mesa #refgrid .ref-frame-ver img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#mesa #refgrid button.ref-frame-ver .ref-add-label{
  position:relative;z-index:1;max-width:100%;padding:4px 8px;border-radius:0 8px 0 0;
  background:color-mix(in srgb,var(--bg) 82%,transparent);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
#mesa #refgrid .ref-frame-quitar{
  position:absolute;top:5px;right:5px;z-index:2;display:grid;place-items:center;width:28px;height:28px;padding:0;
  border:0;border-radius:8px;background:color-mix(in srgb,var(--negro-abismo) 88%,transparent);color:var(--text);cursor:pointer;
}
#mesa #refgrid .ref-frame-quitar svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2}
#mesa #refgrid .ref-frame-quitar:hover{background:var(--peligro);color:var(--tinta-sobre-verde)}
#mesa #refgrid button.ref-frame-ver:hover{border-color:var(--studio-accent)}
#mesa #refgrid :is(.ref-frame-ver,.ref-frame-quitar):focus-visible{outline:2px solid var(--studio-accent);outline-offset:2px}


/* cocuyo-css: assets/css/estudio-workspace.css */
/* Estudio avanzado · 5-sep-2026. Shell, editor y resultados como un espacio
   de trabajo. Los modelos, el monedero y las generaciones siguen intactos.
   Referencias: jerarquia de Artlist y mesa de creacion de Higgsfield. */
body.studio-workbench{
  --side:196px;--studio-editor:350px;
  background:var(--bg);overflow-x:clip;
}
body.studio-workbench::after,body.studio-workbench .fx-aurora,body.studio-workbench .fx-fireflies{display:none}
body.studio-workbench .main{overflow:visible;min-width:0}
body.studio-workbench .side{
  height:100dvh;padding:27px 14px 16px;background:var(--bg);border-right:1px solid var(--border);
}
body.studio-workbench .side>.top{padding:0 6px 32px}
body.studio-workbench .brand{gap:7px;flex-wrap:wrap;letter-spacing:-.04em}
body.studio-workbench .brand .cocuyologo{display:none}
body.studio-workbench .brand .wordmark{font-size:22px;font-weight:700}
body.studio-workbench .brand .claqueta{font-size:10px;padding:3px 5px;letter-spacing:0}
.studio-nav-caption{padding:0 12px 10px;font-size:10px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted)}
body.studio-workbench .side>.navlist{gap:5px}
body.studio-workbench .navlist a{
  min-height:44px;padding:11px 12px;gap:11px;font-size:13px;font-weight:450;border-radius:10px;color:var(--muted2);
}
body.studio-workbench .navlist a.active{background:var(--surface2);color:var(--text);box-shadow:none;font-weight:600}
body.studio-workbench .navlist a.active>.ic{color:var(--lima)}
body.studio-workbench .navlist a:hover{background:var(--surface)}
body.studio-workbench #toolnav{margin-top:18px;padding-top:14px;border-top:1px solid var(--border)}
body.studio-workbench .side .grouphead{padding:26px 12px 10px;font-size:10px;color:var(--muted)}
body.studio-workbench .side .sessions .item{min-height:40px;padding:9px 10px;font-size:12px;border-radius:9px}
body.studio-workbench .side .sessions .sq{width:24px;height:24px;background:transparent;color:var(--muted)}
body.studio-workbench .side .sessions .item.on{background:var(--surface);color:var(--text)}
body.studio-workbench .side .foot{padding-top:18px;gap:12px}
body.studio-workbench .upgbtn{min-height:38px;font-size:11px;border-color:var(--border2);color:var(--muted2);background:transparent}
body.studio-workbench .acct{min-height:50px;background:var(--surface);padding:10px;border-radius:11px}
body.studio-workbench .acct .av{background:var(--surface3);color:var(--lima);font-weight:650}
body.studio-workbench .acct .cr{font-size:12px}
body.studio-workbench .acct .cr .ic{color:var(--lima);stroke:currentColor!important}

/* Cuenta e iconos: jerarquía del perfil de Higgsfield + agrupación del
   User Profile Dropdown Menu de shadcnspace (21st.dev, 24857). */
body.studio-workbench .side>.navlist a{min-height:52px;gap:12px;padding:8px 10px;font-weight:550}
body.studio-workbench .side>.navlist a>.ic{box-sizing:content-box;width:19px;height:19px;padding:8px;border-radius:10px;stroke-width:1.75;background:var(--surface);border:1px solid var(--border);color:var(--muted2);flex:none}
body.studio-workbench .side>.navlist a.active>.ic{background:color-mix(in srgb,var(--lima) 12%,var(--surface));border-color:color-mix(in srgb,var(--lima) 26%,var(--border));color:var(--lima)}
body.studio-workbench .side>.navlist a:hover>.ic{border-color:var(--border2);color:var(--text)}
body.studio-workbench .acct{width:100%;text-align:left;gap:10px;min-height:64px;border:1px solid var(--border);color:var(--text);cursor:pointer;box-shadow:none}
body.studio-workbench .acct:hover,body.studio-workbench .acct[aria-expanded=true]{background:var(--surface2);border-color:var(--border2)}
body.studio-workbench .acct .av{width:34px;height:34px;flex:none;border-radius:10px;border:1px solid var(--border2);font-size:14px}
.acct-identidad{display:grid;gap:4px;min-width:0;flex:1}
.acct-identidad strong{font-size:12px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.studio-workbench .acct .cr{margin:0;display:flex;gap:4px;align-items:center;color:var(--muted2);font-size:11px}
.acct-chevron{width:14px;height:14px;color:var(--muted);flex:none}
body.studio-workbench .accmenu{width:292px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 100px);overflow:auto;bottom:88px;border-radius:18px;background:var(--elev);border-color:var(--border2);padding:8px;box-shadow:var(--sombra-3)}
.acc-identidad{display:flex;gap:12px;align-items:center;padding:12px 10px 17px}
.acc-identidad>div{min-width:0;flex:1}.acc-identidad strong{font-size:13px;font-weight:600}
.acc-avatar{display:grid;place-items:center;flex:none;width:40px;height:40px;border:1px solid var(--border2);border-radius:12px;background:var(--surface2);color:var(--lima)}
.acc-avatar .ic{width:21px;height:21px}
body.studio-workbench .accmenu .em{padding:4px 0 0;border:0;font-size:11px;overflow-wrap:anywhere;color:var(--muted)}
body.studio-workbench .accmenu .card{margin:0 2px 12px;padding:14px 12px;background:var(--surface);border-radius:12px;gap:10px;cursor:default}
body.studio-workbench .accmenu .card>.ic{width:22px;height:22px;color:var(--lima);flex:none}
body.studio-workbench .accmenu .card b{font-size:16px;font-weight:650;letter-spacing:-.03em}
body.studio-workbench .accmenu .card small{font-size:11px;margin-top:4px}
#accRecargar{margin-left:auto;display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:10px;background:var(--lima);color:var(--tinta-sobre-verde)}
#accRecargar:hover{background:var(--lima-clara)}
body.studio-workbench .accmenu .sec{padding:7px 0}
body.studio-workbench .accmenu .mi{min-height:42px;padding:10px 12px;font-size:12px;gap:12px;border-radius:9px}
body.studio-workbench .accmenu .mi>.ic{width:18px;height:18px;color:var(--muted);stroke-width:1.75;flex:none}
body.studio-workbench .accmenu .mi:hover>.ic{color:var(--lima)}
body.studio-workbench .acct:focus-visible,body.studio-workbench .accmenu :is(a,button):focus-visible{outline:2px solid var(--lima);outline-offset:2px}
body.studio-workbench #submenu{left:314px!important;max-width:min(230px,calc(100vw - 24px))}
@media(max-width:600px){body.studio-workbench #submenu{left:24px!important;bottom:104px;width:268px;z-index:91}}

.studio-topbar{
  position:sticky;top:0;z-index:45;display:flex;align-items:center;justify-content:space-between;
  min-height:72px;padding:14px 32px;background:var(--bg);border-bottom:1px solid var(--border);
}
.studio-topbar-title{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:600}
.studio-topbar-title>span:last-child{display:flex;align-items:center;gap:10px}
.studio-topbar-title b{font-size:10px;font-weight:500;padding:4px 7px;border:1px solid var(--border2);border-radius:5px;color:var(--muted2)}
.studio-two-lights{display:flex;gap:4px}
.studio-two-lights i{width:5px;height:13px;background:var(--lima);border-radius:3px;transform:rotate(18deg)}
.studio-cine-link{display:flex;align-items:center;gap:8px;color:var(--muted2);font-size:12px;padding:9px 0}
.studio-cine-link:hover{color:var(--lima)}
body.studio-workbench #pg-home>.studio-wrap{
  padding:30px 32px 64px;max-width:1512px;margin:0 auto;
}
.studio-workhead{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}
.studio-eyebrow{color:var(--muted);font-size:10px;line-height:1.5;font-weight:550;letter-spacing:.09em;text-transform:uppercase}
body.studio-workbench #pg-home #title{
  display:block;
  margin:7px 0 7px;font-family:var(--font);font-size:clamp(24px,2.4vw,32px);line-height:1.2;font-weight:600;
  letter-spacing:-.035em;text-align:left;animation:none;
}
.studio-workhead p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}
.studio-jump{display:none;align-items:center;gap:8px;font-size:12px;white-space:nowrap}
.studio-workspace{display:grid;grid-template-columns:var(--studio-editor) minmax(0,1fr);gap:24px;align-items:start}
.studio-editor-slot{position:sticky;top:92px;min-width:0;scroll-margin-top:92px}
body.studio-workbench #mesa{
  position:static;inset:auto;display:block;width:100%;padding:0;pointer-events:auto;z-index:auto;
}
body.studio-workbench #mesa .mesa-in{
  display:block;width:100%;height:auto;max-height:calc(100dvh - 260px);overflow-y:auto;overflow-x:hidden;
  padding:18px;background:var(--surface);border:1px solid var(--border);border-radius:17px;
  box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;scrollbar-width:thin;
}
body.studio-workbench #mesa .mesa-in::before,body.studio-workbench #mesa .mesa-in::after{display:none}
.studio-editor-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}
.studio-editor-head>span:first-child{font-size:10px;letter-spacing:.09em;font-weight:650;color:var(--text)}
.studio-editor-badge{font-size:10px;font-weight:400;color:var(--muted)}
body.studio-workbench #mesa .mesa-top{display:block;margin:0 0 22px;padding:0;border:0;background:none}
body.studio-workbench #mesa .modesw{width:100%;margin:0}
body.studio-workbench #mesa .modesw .inner{
  display:flex;width:100%;padding:4px;gap:3px;background:var(--bg);border:1px solid var(--border);border-radius:11px;
}
body.studio-workbench #mesa .modesw button{
  justify-content:center;flex:1 1 0;min-width:0;min-height:39px;padding:9px 5px;gap:6px;font-size:12px;font-weight:500;
}
body.studio-workbench #mesa .modesw button .ic{width:15px;height:15px;flex-basis:15px}
body.studio-workbench #mesa .modesw button.active{background:var(--surface3);color:var(--text);box-shadow:none}
body.studio-workbench #mesa .modesw button.active .ic{color:var(--lima)}
body.studio-workbench #mesa .composer{
  display:flex;flex-direction:column;min-width:0;gap:0;padding:0;margin:0;background:none;border:0;box-shadow:none;
}
.studio-field-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px;margin-bottom:9px}
.studio-field-heading b{font-weight:600;color:var(--muted2)}
.studio-field-heading>span{color:var(--muted);font-size:10px;font-weight:400}
body.studio-workbench #mesa .studio-reference-heading{order:1}
body.studio-workbench #mesa #imageRefControls,body.studio-workbench #mesa #refgrid{order:2}
body.studio-workbench #mesa #attrow{order:3}
body.studio-workbench #mesa .studio-prompt-heading{order:4;margin-top:5px}
body.studio-workbench #mesa #ta{order:5}
body.studio-workbench #mesa #parambar{order:6}
body.studio-workbench #mesa #headicons{order:7}
body.studio-workbench #mesa .image-ref-controls{display:flex;gap:9px;margin:0 0 18px}
body.studio-workbench #mesa .image-ref-add{
  width:100%;min-height:63px;justify-content:flex-start;gap:10px;padding:14px;background:var(--bg);
  border:1px dashed var(--border2);border-radius:11px;font-size:12px;
}
body.studio-workbench #mesa .image-ref-add>.ic{width:22px;height:22px;flex-basis:22px;color:var(--muted2)}
body.studio-workbench #mesa .image-ref-add b{margin-left:auto;background:var(--surface2);color:var(--lima);font-size:11px}
body.studio-workbench #mesa .image-ref-add:hover{border-color:var(--lima);background:var(--surface2)}
body.studio-workbench #mesa .image-ref-hint{font-size:10px;color:var(--muted);flex-basis:100%;padding-left:2px}
body.studio-workbench #mesa #refgrid{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 18px;overflow:visible}
body.studio-workbench #mesa #refgrid .refwrap{flex:1 1 44%;min-width:0}
body.studio-workbench #mesa #refgrid .refbox{
  justify-content:flex-start;width:100%;min-height:46px;gap:8px;padding:11px 10px;font-size:11px;background:var(--bg);
}
body.studio-workbench #mesa #attrow{max-width:100%;padding-bottom:10px;margin-bottom:12px!important}
body.studio-workbench #mesa .attchip{flex:0 0 72px;width:72px;height:72px;border-radius:10px}
body.studio-workbench #mesa #ta{
  min-height:164px;max-height:min(320px,36dvh);padding:13px 14px;margin:0 0 21px;
  border:1px solid var(--border2);border-radius:11px;background:var(--bg);font-size:13px;line-height:1.7;
  overflow-y:auto;overflow-wrap:anywhere;scrollbar-width:thin;
}
body.studio-workbench #mesa #ta:focus-visible{outline:2px solid var(--lima);outline-offset:2px;border-color:var(--border2)}
body.studio-workbench #mesa #ta:empty:before{color:var(--muted)}
body.studio-workbench #mesa #parambar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0}
body.studio-workbench #mesa #parambar>.lbl{
  position:static;clip-path:none;width:auto;height:auto;grid-column:1/-1;padding:0 0 2px;margin:0;font-size:10px;letter-spacing:.07em;
}
body.studio-workbench #mesa .param{display:flex;justify-content:flex-start;width:100%;min-height:44px;padding:10px;gap:7px;font-size:12px;border-color:var(--border)}
body.studio-workbench #mesa .param .car{margin-left:auto;flex-shrink:0}
body.studio-workbench #mesa #parambar>.param[data-pop="model"]{grid-column:1/-1;min-height:49px;background:var(--bg);border-color:var(--border2)}
body.studio-workbench #mesa .param[data-pop="model"]>.tile{width:21px;height:21px;flex-basis:21px;margin-right:2px}
body.studio-workbench #mesa #parambar>div{min-width:0}
body.studio-workbench #mesa .param-caption{font-size:11px}
body.studio-workbench #mesa #parambar .cost{
  display:flex;justify-content:flex-end;grid-column:1/-1;min-height:34px;padding:7px 2px 0;margin:3px 0 0;gap:5px;
}
body.studio-workbench #mesa .cost-caption{display:block;margin-right:auto;color:var(--muted2);font-size:11px}
body.studio-workbench #mesa .cost b{font-size:16px;font-weight:650}
body.studio-workbench #mesa #omniLimits{grid-column:1/-1;font-size:10px!important;line-height:1.6!important;padding:2px 0 0}
body.studio-workbench #mesa #headicons{
  position:sticky;bottom:-18px;z-index:3;display:flex;justify-content:stretch;margin:9px 0 0;padding:10px 0 12px;border:0;background:var(--surface);
}
body.studio-workbench #mesa #headicons .roundbtn{
  width:100%;min-height:48px;padding:13px 16px;border-radius:11px;box-shadow:none;background:var(--lima);font-size:13px;
}
body.studio-workbench #mesa #headicons .roundbtn:before{display:none}
body.studio-workbench #mesa #headicons .roundbtn:hover{background:var(--lima-clara)}
.studio-tools{margin-top:17px;padding-top:12px;border-top:1px solid var(--border)}
.studio-tools[hidden]{display:none}
.studio-tools summary{cursor:pointer;color:var(--muted);font-size:11px;line-height:1.5;padding:4px 2px}
body.studio-workbench #mesa .studio-tools #apps{gap:6px;flex-wrap:wrap;margin:12px 0 0;justify-content:flex-start}
body.studio-workbench #mesa .studio-tools .appbtn{border:1px solid var(--border);border-radius:8px;min-height:34px;padding:8px;font-size:10px}
body.studio-workbench #mesa .studio-tools .tagapp{display:none}

/* Audio usa la misma mesa, con su ficha y sus controles reales. */
body.studio-workbench.modo-audio #mesa .composer{display:flex;gap:11px}
body.studio-workbench.modo-audio #mesa .composer>*{order:initial}
body.studio-workbench.modo-audio #mesa #ta,body.studio-workbench.modo-audio #mesa #parambar{order:initial}
body.studio-workbench.modo-audio #mesa .studio-field-heading{display:none}
body.studio-workbench.modo-audio #mesa #attrow{display:none!important}
body.studio-workbench.modo-audio #mesa #parambar{display:flex;gap:10px}
body.studio-workbench.modo-audio #mesa #ta{min-height:146px;margin:0;max-height:28dvh}
body.studio-workbench.modo-audio #mesa .ap-voz{min-height:135px;border-color:var(--border);background:var(--bg)}
body.studio-workbench.modo-audio #mesa .ap-rot{font-size:11px;margin-top:8px}
body.studio-workbench.modo-audio #mesa .ap-fila,body.studio-workbench.modo-audio #mesa .ap-idioma{background:var(--bg);min-height:46px}
body.studio-workbench.modo-audio #mesa .ap-gen{position:static;margin-top:0;min-height:48px;border-radius:11px}

.studio-results{min-width:0;scroll-margin-top:96px}
.studio-results-head{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:51px;margin-bottom:14px}
.studio-results-head h2{display:flex;align-items:center;gap:9px;font-family:var(--font);font-size:15px;letter-spacing:-.02em;font-weight:600;margin:0}
[data-studio-count]{display:inline-grid;place-items:center;min-width:22px;min-height:20px;border-radius:5px;font-size:10px;font-weight:500;color:var(--muted2);background:var(--surface2);padding:1px 5px}
.studio-results-head p{margin:5px 0 0;font-size:11px;color:var(--muted)}
.studio-library-link{display:flex;align-items:center;gap:8px;min-height:40px;padding:8px 0;font-size:11px;font-weight:500;color:var(--muted2)}
.studio-library-link:hover{color:var(--lima)}
body.studio-workbench #genwrap{margin:0!important;max-width:none!important}
body.studio-workbench #genout{display:block;margin:0!important}
body.studio-workbench .histbar{margin:0 0 18px;padding:10px 0 13px;border-bottom:1px solid var(--border);background:none}
body.studio-workbench .hist-dia{position:static;padding:9px 0 14px;background:none;font-size:12px}
body.studio-workbench .hist-dia i{font-size:10px;color:var(--muted)}
body.studio-workbench .hist-rejilla{gap:16px;margin-bottom:24px}
body.studio-workbench .jobcard.limpia{overflow:hidden;border:1px solid var(--border);border-radius:13px;background:var(--surface)}
body.studio-workbench .jobcard.limpia:hover{border-color:var(--border2)}
body.studio-workbench .jobcard .jmarco{border-radius:0}
.studio-job-caption{padding:12px 13px 14px}
.studio-job-caption>span{display:block;color:var(--muted2);font-size:10px;font-weight:550}
.studio-job-caption p{margin:6px 0 0;color:var(--muted);font-size:11px;line-height:1.5;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
body.studio-workbench .jr-reserva{margin:8px 0 0;color:var(--muted2);font-size:12px;line-height:1.5;white-space:normal;overflow-wrap:anywhere}
body.studio-workbench .fila-aud{border-radius:13px;padding:14px;flex-wrap:wrap;gap:10px}
body.studio-workbench .fa-txt{flex:1 1 140px;max-width:none}
body.studio-workbench .fa-onda{min-width:90px}
body.studio-workbench .fa-modelo{font-size:10px;margin-left:auto}
body.studio-workbench .fa-play{width:40px;height:40px;flex-basis:40px}
body.studio-workbench .fa-foto{background:var(--surface3);color:var(--lima)}
body.studio-workbench .fa-foto b{color:var(--lima)}

.studio-empty{overflow:hidden;border:1px solid var(--border);border-radius:17px;background:var(--surface)}
.studio-empty-preview{position:relative;min-height:300px;aspect-ratio:1.95;overflow:hidden;background:var(--bg)}
.studio-empty-art{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center}
.studio-empty-preview::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,color-mix(in srgb,var(--negro-abismo) 20%,transparent),transparent 30%,color-mix(in srgb,var(--negro-abismo) 78%,transparent))}
.studio-preview-label{position:absolute;top:20px;left:24px;z-index:1;color:var(--blanco-luz);font-size:10px;padding:5px 8px;border:1px solid color-mix(in srgb,var(--blanco-luz) 30%,transparent);border-radius:5px;background:color-mix(in srgb,var(--negro-abismo) 48%,transparent)}
.studio-preview-caption{position:absolute;z-index:1;left:28px;bottom:26px;color:var(--blanco-luz)}
.studio-preview-caption>span{display:block;font-size:9px;font-weight:500;letter-spacing:.14em;margin-bottom:11px}
.studio-preview-caption>b{display:block;font-family:var(--display);font-size:clamp(32px,3.5vw,54px);font-weight:500;line-height:.98;letter-spacing:-.035em}
.studio-empty-copy{padding:27px 28px 25px}
.studio-empty-copy h3{font-family:var(--font);font-size:19px;font-weight:600;line-height:1.3;letter-spacing:-.03em;margin:0 0 10px}
.studio-empty-copy p{max-width:440px;font-size:12px;line-height:1.8;color:var(--muted);margin:0 0 20px}
.studio-start{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:42px;padding:12px 15px;background:var(--lima);color:var(--tinta-sobre-verde);border-radius:9px;font-size:12px;font-weight:600}
.studio-start:hover{background:var(--lima-clara)}
.studio-workflow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:18px 24px;gap:10px;border-top:1px solid var(--border);background:var(--bg)}
.studio-workflow>span{display:flex;align-items:center;gap:8px;min-width:0}
.studio-workflow i{font-family:var(--fuente-mono);font-size:9px;font-style:normal;color:var(--lima);font-weight:500}
.studio-workflow b{color:var(--muted);font-size:10px;font-weight:450;line-height:1.5}
.studio-audio-art{position:absolute;inset:0;background:radial-gradient(ellipse at 78% 30%,var(--acento-fondo),var(--bg) 74%)}
.studio-audio-disc{position:absolute;width:210px;height:210px;right:14%;top:8%;border:1px solid var(--border2);border-radius:50%;box-shadow:0 0 0 28px color-mix(in srgb,var(--border) 30%,transparent),0 0 0 58px color-mix(in srgb,var(--border) 18%,transparent)}
.studio-audio-disc::before{content:'';position:absolute;inset:22px;border:1px solid var(--border2);border-radius:50%}
.studio-audio-disc i{position:absolute;width:9px;height:9px;left:calc(50% - 14px);top:calc(50% - 5px);background:var(--lima);border-radius:50%;box-shadow:var(--glow-suave)}
.studio-audio-disc i+i{left:calc(50% + 6px)}
.studio-audio-bars{position:absolute;right:6%;bottom:16%;display:flex;align-items:center;gap:5px;height:120px}
.studio-audio-bars i{width:4px;height:var(--bar);border-radius:4px;background:var(--lima);opacity:.65}

/* El selector permanece uno por modelo; ahora se leen nombre, proposito y
   especificaciones en ese orden, sin esconder limites largos como Omni. */
body.studio-workbench #modal{padding:40px 22px;background:color-mix(in srgb,var(--negro-abismo) 78%,transparent);backdrop-filter:blur(8px)}
body.studio-workbench #modal .mbox{width:min(800px,100%);max-height:calc(100dvh - 80px);border-radius:19px;background:var(--surface);border-color:var(--border2)}
.studio-model-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:26px 25px 15px}
.studio-model-head h2{font-family:var(--font);font-size:24px;letter-spacing:-.04em;font-weight:600;margin:5px 0 0}
.studio-model-note{font-size:10px;color:var(--muted)}
body.studio-workbench #modal .mtop{border:0;padding:0 24px 17px;gap:10px}
body.studio-workbench #modal .msearch{min-height:45px;background:var(--bg);border-radius:10px;border-color:var(--border2)}
body.studio-workbench #modal .mclose{width:42px;height:42px;border:1px solid var(--border);border-radius:10px}
body.studio-workbench #modal .mbody{padding:0 18px 22px}
body.studio-workbench #modal .mhead{padding:12px 8px;font-size:9px;letter-spacing:.08em;color:var(--muted)}
body.studio-workbench #modal .mrow{gap:14px;margin:0 0 8px;padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--bg);outline-offset:2px}
body.studio-workbench #modal .mrow:hover{border-color:var(--border2);background:var(--surface2)}
body.studio-workbench #modal .mrow.sel{border-color:color-mix(in srgb,var(--lima) 55%,var(--border));background:var(--lima-suave)}
body.studio-workbench #modal .mrow .logo{width:38px;height:38px;flex-basis:38px;background:var(--surface2)}
body.studio-workbench #modal .mrow .tile{width:25px;height:25px}
body.studio-workbench #modal .mrow .nm{font-size:14px;font-weight:600}
body.studio-workbench #modal .mrow .ds{white-space:normal;font-size:11px;line-height:1.7;margin-top:7px;overflow:visible}
.studio-model-specs{display:flex;flex-wrap:wrap;gap:5px;margin-top:11px}
body.studio-workbench #modal .spec{padding:4px 7px;font-size:10px;font-weight:450;background:var(--surface2);color:var(--muted2);white-space:normal}
body.studio-workbench #modal .bdg{font-size:9px;font-weight:550;background:var(--surface3);color:var(--muted2);padding:3px 6px}
body.studio-workbench #modal .radio{width:18px;height:18px;flex-basis:18px;margin-top:1px}
.studio-model-empty{padding:24px 10px;color:var(--muted);font-size:13px}
body.studio-workbench :is(.studio-start,.studio-jump,.studio-library-link,.studio-cine-link,.studio-tools summary,.mrow):focus-visible{outline:2px solid var(--lima);outline-offset:3px}

/* Los menus se posicionan junto a su control y usan la capa superior nativa
   si esta disponible, sin sacarlos del DOM ni perder sus manejadores. */
body.studio-workbench #mesa .studio-floating{
  position:fixed;inset:auto;margin:0;transform:none;min-width:0;overflow-y:auto;overscroll-behavior:contain;
  padding:9px;border:1px solid var(--border2);border-radius:13px;background:var(--surface);color:var(--text);
  box-shadow:0 18px 48px color-mix(in srgb,var(--negro-abismo) 65%,transparent);text-align:left;z-index:90;
}
body.studio-workbench #mesa .studio-floating .ph{font-size:10px;letter-spacing:.035em;line-height:1.5;color:var(--muted2);padding:10px}
body.studio-workbench #mesa .studio-floating .opt{min-height:42px;font-size:12px;gap:10px}
body.studio-workbench #mesa .studio-floating button{min-height:44px;font-size:12px;justify-content:flex-start}
body.studio-workbench #mesa .studio-floating .slidewrap{min-width:0;padding:8px}
body.studio-workbench #mesa .studio-floating::backdrop{background:transparent}

@media(min-width:1600px){body.studio-workbench{--studio-editor:378px}.studio-workspace{gap:30px}}
@media(min-width:1001px){
  body.studio-workbench #mesa #ta{min-height:120px;margin-bottom:14px}
  body.studio-workbench #mesa .mesa-top{margin-bottom:15px}
  body.studio-workbench #mesa #refgrid{margin-bottom:12px}
  body.studio-workbench #mesa #parambar{grid-template-columns:repeat(3,minmax(0,1fr))}
  body.studio-workbench #mesa .param{padding:9px 7px;gap:5px;font-size:11px}
  body.studio-workbench.modo-audio #mesa .ap-gen{position:sticky;bottom:-18px;z-index:3;box-shadow:0 12px 0 12px var(--surface)}
}
@media(max-width:1190px){body.studio-workbench{--side:184px;--studio-editor:314px}.studio-topbar{padding-inline:24px}body.studio-workbench #pg-home>.studio-wrap{padding-inline:24px}.studio-workspace{gap:20px}body.studio-workbench #mesa .mesa-in{padding:15px}.studio-workflow{padding:16px}.studio-workflow>span{align-items:flex-start;gap:6px}.studio-empty-copy{padding:24px}.studio-empty-preview{min-height:290px}}
@media(max-width:1000px){
  .studio-workspace{grid-template-columns:minmax(0,1fr);gap:28px}
  .studio-editor-slot{position:static;max-width:none}
  body.studio-workbench #mesa .mesa-in{max-height:none;overflow:visible;padding:20px;border-radius:16px}
  body.studio-workbench #mesa #headicons{position:static;padding:0}
  body.studio-workbench #mesa #ta{min-height:126px;max-height:240px}
  body.studio-workbench #mesa #refgrid .refwrap{flex:0 1 auto}
  body.studio-workbench #mesa #parambar{grid-template-columns:repeat(3,minmax(0,1fr))}
  body.studio-workbench #mesa #parambar>.param[data-pop="model"]{grid-column:1/-1}
  .studio-jump{display:flex}
  .studio-empty-preview{min-height:320px;aspect-ratio:1.9}
  body.studio-workbench.modo-audio #mesa .ap-voz{min-height:130px}
  body.studio-workbench.modo-audio #mesa #parambar{display:flex}
}
@media(max-width:900px){
  body.studio-workbench .side{width:196px;z-index:80}
  .studio-topbar{min-height:62px;padding:10px 20px}
  body.studio-workbench .studio-topbar .mobbtn{display:grid;position:static;width:32px;height:34px;margin-left:-5px}
  .studio-topbar-title{gap:9px}
  body.studio-workbench #pg-home>.studio-wrap{padding:25px 20px 46px}
  body.studio-workbench .studio-editor-slot,.studio-results{scroll-margin-top:78px}
}
@media(max-width:600px){
  .studio-topbar{padding:10px 16px}
  .studio-topbar-title{font-size:13px}.studio-topbar-title b{font-size:9px;padding:3px 5px}
  .studio-two-lights{display:none}.studio-cine-link{font-size:10px;gap:4px}
  body.studio-workbench #pg-home>.studio-wrap{padding:22px 14px 40px}
  .studio-workhead{align-items:flex-start;flex-direction:column;gap:13px;margin-bottom:18px}
  body.studio-workbench #pg-home #title{font-size:27px;margin-top:6px}
  .studio-workhead p{font-size:12px;max-width:290px}
  .studio-jump{align-self:flex-end;min-height:32px;font-size:11px;margin-top:-2px}
  body.studio-workbench #mesa .mesa-in{padding:17px 15px;border-radius:14px}
  .studio-editor-head{margin-bottom:12px}.studio-editor-badge{font-size:9px}
  body.studio-workbench #mesa .mesa-top{margin-bottom:19px}
  body.studio-workbench #mesa #ta{min-height:140px;max-height:260px;font-size:14px}
  body.studio-workbench #mesa #refgrid .refwrap{flex:1 1 44%}
  body.studio-workbench #mesa #parambar{grid-template-columns:repeat(2,minmax(0,1fr))}
  body.studio-workbench #mesa .param{min-height:45px}
  body.studio-workbench #mesa #headicons .roundbtn{min-height:49px;font-size:14px}
  .studio-results-head{margin-bottom:14px;gap:8px}.studio-results-head p{font-size:10px}.studio-library-link{font-size:10px;gap:5px}
  .studio-empty{border-radius:14px}.studio-empty-preview{min-height:266px;aspect-ratio:1.2}
  .studio-preview-label{top:15px;left:18px;font-size:9px}
  .studio-preview-caption{left:20px;bottom:22px}.studio-preview-caption>b{font-size:42px}
  .studio-empty-copy{padding:22px 20px}.studio-empty-copy h3{font-size:18px}.studio-empty-copy p{font-size:12px}
  .studio-workflow{padding:16px 18px;gap:12px}.studio-workflow>span{flex-direction:column;gap:6px}.studio-workflow b{font-size:10px}
  .studio-audio-disc{right:8%;width:185px;height:185px}.studio-audio-bars{right:6%;opacity:.6}
  body.studio-workbench #modal{padding:12px}
  body.studio-workbench #modal .mbox{max-height:calc(100dvh - 24px);border-radius:15px}
  .studio-model-head{padding:21px 18px 16px}.studio-model-head h2{font-size:22px}.studio-model-note{display:none}
  body.studio-workbench #modal .mtop{padding:0 15px 12px}
  body.studio-workbench #modal .mbody{padding:0 10px 15px}
  body.studio-workbench #modal .mrow{gap:10px;padding:14px 12px}body.studio-workbench #modal .mrow .logo{width:29px;height:29px;flex-basis:29px}
  body.studio-workbench #modal .mrow .nm{font-size:13px}body.studio-workbench #modal .mrow .ds{font-size:11px}
  body.studio-workbench #modal .radio{width:15px;height:15px;flex-basis:15px}
}
@media(prefers-reduced-motion:reduce){body.studio-workbench .side{transition:none}}
/* Cola de creaciones (25-sep-2026): zona «aria-live» que anuncia a los
   lectores de pantalla cuándo una creación entra en cola, pasa al proveedor
   o se cancela. Invisible en pantalla, pero la leen los lectores. */
.cola-aviso-lector{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
 clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}


/* cocuyo-css: assets/css/estudio-componentes.css */
/* 21st.dev adaptado a HTML/CSS nativos de Cocuyo, 5-sep-2026.
   Modal Pricing · kokonutd · demo623; Action Button · Codehagen · demo1051.
   Procedencia y revisión: docs/COMPONENTES_ESTUDIO_21ST_2026-09-05.md.
   No modifica tamaños/posiciones del compositor, importes ni proveedores. */
body.studio-workbench #mesa #headicons .roundbtn,
body.studio-workbench.modo-audio #mesa .ap-gen{
  border:1px solid color-mix(in srgb,var(--lima-clara) 65%,var(--lima));
  background:linear-gradient(165deg,var(--lima-clara) -75%,var(--lima) 62%);
  color:var(--tinta-sobre-verde);font-weight:650;letter-spacing:-.015em;
  transition:filter .16s ease,border-color .16s ease;
}
body.studio-workbench #mesa #headicons .roundbtn{box-shadow:inset 0 1px 0 color-mix(in srgb,var(--blanco-luz) 45%,transparent),inset 0 -2px 0 color-mix(in srgb,var(--verde-profundo) 20%,transparent)}
body.studio-workbench #mesa #headicons .roundbtn:hover:not(:disabled),
body.studio-workbench.modo-audio #mesa .ap-gen:hover:not(:disabled){filter:brightness(1.06);border-color:var(--lima-clara)}
body.studio-workbench #mesa #headicons .roundbtn:active:not(:disabled),
body.studio-workbench.modo-audio #mesa .ap-gen:active:not(:disabled){filter:brightness(.96)}
body.studio-workbench #mesa #headicons .roundbtn:disabled,
body.studio-workbench.modo-audio #mesa .ap-gen:disabled{filter:saturate(.65);cursor:wait}
body.studio-workbench .side .upgbtn{
  border:1px solid color-mix(in srgb,var(--lima) 35%,var(--border));
  background:linear-gradient(110deg,var(--acento-fondo),var(--surface));
  color:var(--lima-clara);font-weight:550;box-shadow:inset 0 1px 0 var(--border);
  transition:background .16s ease,border-color .16s ease;
}
body.studio-workbench .side .upgbtn:hover{border-color:var(--lima);background:var(--acento-fondo)}
body.studio-workbench #mesa :is(.param,.image-ref-add,.refbox){transition:background .16s ease,border-color .16s ease;box-shadow:inset 0 1px 0 color-mix(in srgb,var(--blanco-luz) 3%,transparent)}
body.studio-workbench #mesa :is(.param,.image-ref-add,.refbox):active{background:var(--surface3)}
/* Un unico chevron y marcas legibles sobre superficies oscuras. */
body.studio-workbench .param .car::before,body.studio-workbench .param .car::after{content:none}
body.studio-workbench .param .car{width:13px;height:13px;font-size:0;line-height:1;opacity:.6;display:inline-grid;place-items:center}
body.studio-workbench .param .car .glifo{display:none}
body.studio-workbench .param .car::after{content:'';width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg)}
body.studio-workbench #mesa .param{background:var(--surface2)}
body.studio-workbench #mesa .param:hover,body.studio-workbench #mesa .param.open{background:var(--surface3);border-color:var(--muted)}
body.studio-workbench #mesa .param.open .car{transform:rotate(180deg)}

body.studio-workbench #mesa .studio-generate-cost{font-size:11px;white-space:nowrap;border-left:1px solid color-mix(in srgb,currentColor 25%,transparent);padding-left:9px;margin-left:2px;font-weight:600}
body.studio-workbench #toolnav{margin:0;gap:7px}
body.studio-workbench #toolnav a{display:flex;align-items:center;gap:12px;min-height:50px;border:1px solid transparent;border-radius:12px;padding:11px 13px;font-size:14px;font-weight:500;transition:background .18s ease,border-color .18s ease,color .18s ease}
body.studio-workbench #toolnav a>.ic{width:21px;height:21px;flex:0 0 21px}
body.studio-workbench #toolnav a:hover{background:var(--surface2);border-color:var(--border2)}
body.studio-workbench #toolnav a.active{color:var(--lima-clara);background:color-mix(in srgb,var(--lima) 9%,var(--surface));border-color:color-mix(in srgb,var(--lima) 27%,var(--border));box-shadow:inset 0 1px 0 color-mix(in srgb,var(--lima) 8%,transparent)}
body.studio-workbench .studio-nav-arrow{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;margin-left:auto;opacity:0;transition:opacity .18s ease}
body.studio-workbench #toolnav a:is(.active,:hover) .studio-nav-arrow{opacity:1}
body.studio-workbench .studio-library-nav{border-top:1px solid var(--border);padding-top:17px;margin-top:18px}
body.studio-workbench #toolnav a:focus-visible{outline:2px solid var(--lima);outline-offset:3px}

body.studio-workbench #payModal{padding:24px;background:color-mix(in srgb,var(--negro-abismo) 83%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
body.studio-workbench #payModal.on{align-items:center;justify-content:center}
body.studio-workbench #payModal .pay-dialog{
  display:block;width:min(510px,100%);max-height:calc(100dvh - 48px);margin:0;
  padding:27px 29px 23px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;
  border:1px solid var(--border2);border-radius:20px;background:var(--surface);
  box-shadow:0 24px 90px color-mix(in srgb,var(--negro-abismo) 80%,transparent),inset 0 1px 0 color-mix(in srgb,var(--blanco-luz) 8%,transparent);
}
body.studio-workbench #payModal .pay-header{display:flex;align-items:center;gap:9px;margin-bottom:18px}
body.studio-workbench #payModal .pay-header>span:not(.pay-emblema){font-size:9px;font-weight:550;letter-spacing:.11em;color:var(--muted)}
body.studio-workbench #payModal .pay-emblema{display:flex;gap:4px}
body.studio-workbench #payModal .pay-emblema i{display:block;width:5px;height:5px;border-radius:50%;background:var(--lima);box-shadow:var(--glow-suave)}
body.studio-workbench #payModal #payClose{margin-left:auto;width:31px;height:31px;min-width:31px;border:1px solid var(--border);border-radius:8px;color:var(--muted2);background:var(--surface2);font-size:13px}
body.studio-workbench #payModal #payClose:hover{color:var(--text);border-color:var(--border2)}
body.studio-workbench #payTitle{font-family:var(--font);font-size:29px;font-weight:550;letter-spacing:-.045em;line-height:1.15;margin:0 0 10px;color:var(--text)}
body.studio-workbench #payDescription{font-size:12px;line-height:1.7;color:var(--muted);margin:0 0 19px}
body.studio-workbench #payModal .paysaldo{display:flex;align-items:center;justify-content:space-between;margin:0 0 23px;padding:12px 14px;background:var(--bg);border:1px solid var(--border);border-radius:10px;font-size:11px;color:var(--muted2)}
body.studio-workbench #payModal .paysaldo:empty{display:none}
body.studio-workbench #payModal .paysaldo b{font-size:15px;font-weight:600;color:var(--text)}
body.studio-workbench #payModal .paysaldo small{font-size:10px;font-weight:450;color:var(--muted)}
body.studio-workbench #payPacks{border:0;padding:0;margin:0;min-width:0}
body.studio-workbench #payPacks legend{font-size:11px;font-weight:550;color:var(--muted2);padding:0;margin-bottom:11px}
body.studio-workbench #payPacksList{display:grid;gap:9px}
body.studio-workbench #payPacksList:empty{display:none}
body.studio-workbench #payModal .paypack{
  display:flex;align-items:center;gap:14px;position:relative;margin:0;padding:16px 17px;min-height:79px;
  border:1px solid var(--border2);border-radius:12px;background:var(--bg);cursor:pointer;
  transform:none;box-shadow:inset 0 1px 0 color-mix(in srgb,var(--blanco-luz) 3%,transparent);
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease;
}
body.studio-workbench #payModal .paypack:hover{border-color:var(--muted);background:var(--surface2);transform:none}
body.studio-workbench #payModal .paypack input{
  position:absolute;opacity:0;width:1px;height:1px;padding:0;margin:0;clip-path:inset(50%);
}
body.studio-workbench #payModal .paypack:has(input:focus-visible){outline:2px solid var(--lima);outline-offset:3px}
body.studio-workbench #payModal .pay-radio{width:17px;height:17px;flex:0 0 17px;border:1px solid var(--border2);border-radius:50%;background:var(--surface2);display:grid;place-items:center}
body.studio-workbench #payModal .pay-radio:after{content:'';width:7px;height:7px;border-radius:50%;background:var(--tinta-sobre-verde);opacity:0;transform:scale(.5);transition:transform .16s ease,opacity .16s ease}
body.studio-workbench #payModal .paypack.seleccionado{border-color:var(--lima);background:color-mix(in srgb,var(--lima) 5%,var(--bg));box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--lima) 10%,transparent)}
body.studio-workbench #payModal .paypack.seleccionado .pay-radio{border-color:var(--lima);background:var(--lima)}
body.studio-workbench #payModal .paypack.seleccionado .pay-radio:after{opacity:1;transform:scale(1)}
body.studio-workbench #payModal .paypack:has(input:disabled){cursor:wait;opacity:.6}
body.studio-workbench #payModal .pay-pack-copy{display:flex;flex-direction:column;min-width:0;gap:5px}
body.studio-workbench #payModal .pay-pack-copy b{font-size:13px;font-weight:600;color:var(--text);line-height:1.25}
body.studio-workbench #payModal .ppcred{font-size:11px;font-weight:450;color:var(--muted2);margin:0}
body.studio-workbench #payModal .pp{display:flex;flex-direction:column;align-items:flex-end;gap:4px;margin-left:auto;font-size:19px;font-weight:550;letter-spacing:-.03em;color:var(--text);white-space:nowrap}
body.studio-workbench #payModal .pp small{font-size:8px;letter-spacing:.065em;color:var(--muted);font-weight:450}
body.studio-workbench #payModal .pay-resumen{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:21px 0 18px;padding:17px 0 0;border-top:1px solid var(--border)}
body.studio-workbench #payModal .pay-resumen>div{display:flex;flex-direction:column;gap:7px}
body.studio-workbench #payModal .pay-resumen>div:last-child{align-items:flex-end;text-align:right}
body.studio-workbench #payModal .pay-resumen span{font-size:10px;color:var(--muted);font-weight:400}
body.studio-workbench #payCredits{font-size:13px;color:var(--text);font-weight:550}
body.studio-workbench #payTotal{font-size:25px;font-weight:550;line-height:1;letter-spacing:-.045em;color:var(--text)}
body.studio-workbench #payMsg{display:block;font-size:11px;line-height:1.7;color:var(--muted2);padding:11px 13px;margin:0 0 14px;border:1px solid var(--border);border-radius:9px;background:var(--bg)}
body.studio-workbench #payMsg:empty{display:none}
body.studio-workbench #payMsg[data-estado="error"]{border-color:color-mix(in srgb,var(--peligro) 40%,var(--border));color:var(--peligro);background:color-mix(in srgb,var(--peligro) 4%,var(--bg))}
body.studio-workbench #payMsg[data-estado="aviso"]{color:var(--text)}
body.studio-workbench #payRetry{font-size:11px;color:var(--lima);font-weight:550;text-decoration:underline;text-underline-offset:3px;margin:-3px 0 17px;min-height:32px}
body.studio-workbench #payRetry[hidden]{display:none}
body.studio-workbench #payContinue{
  display:flex;align-items:center;justify-content:center;gap:10px;position:relative;width:100%;min-height:49px;padding:13px 20px;
  border:1px solid color-mix(in srgb,var(--lima-clara) 65%,var(--lima));border-radius:10px;
  background:linear-gradient(165deg,var(--lima-clara) -75%,var(--lima) 62%);color:var(--tinta-sobre-verde);
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--blanco-luz) 45%,transparent),inset 0 -2px 0 color-mix(in srgb,var(--verde-profundo) 20%,transparent);
  font-size:12px;font-weight:650;letter-spacing:-.01em;transition:filter .16s ease;
}
body.studio-workbench #payContinue:hover:not(:disabled){filter:brightness(1.06)}
body.studio-workbench #payContinue:active:not(:disabled){filter:brightness(.96)}
body.studio-workbench #payContinue:disabled{opacity:.45;cursor:not-allowed}
body.studio-workbench #payContinue[aria-busy="true"]{opacity:.8;cursor:wait;padding-left:42px}
body.studio-workbench #payContinue .pay-button-arrow{position:absolute;right:17px;transition:transform .16s ease}
body.studio-workbench #payContinue:hover:not(:disabled) .pay-button-arrow{transform:translateX(2px)}
body.studio-workbench #payContinue[aria-busy="true"] .pay-button-arrow{visibility:hidden}
body.studio-workbench #payContinue .pay-spinner{display:none;position:absolute;left:18px;width:16px;height:16px;border:2px solid color-mix(in srgb,var(--tinta-sobre-verde) 25%,transparent);border-top-color:var(--tinta-sobre-verde);border-radius:50%}
body.studio-workbench #payContinue[aria-busy="true"] .pay-spinner{display:block;animation:pay-cargando .8s linear infinite}
body.studio-workbench #payModal .pay-nota{display:flex;justify-content:center;align-items:center;gap:6px;font-size:12px;line-height:1.6;color:var(--muted);margin:13px 0 0}
body.studio-workbench #payModal .pay-nota svg{flex-shrink:0}
body.studio-workbench #payModal :is(button,input):focus-visible{outline:2px solid var(--lima);outline-offset:3px}
@keyframes pay-cargando{to{transform:rotate(360deg)}}
@media(max-width:600px){
  body.studio-workbench #payModal{padding:12px}
  body.studio-workbench #payModal .pay-dialog{max-height:calc(100dvh - 24px);padding:21px 21px 19px;border-radius:16px}
  body.studio-workbench #payModal .pay-header{margin-bottom:15px}
  body.studio-workbench #payTitle{font-size:27px}
  body.studio-workbench #payDescription{font-size:11px;margin-bottom:17px}
  body.studio-workbench #payModal .paysaldo{margin-bottom:19px}
  body.studio-workbench #payModal .paypack{min-height:76px;padding:14px;gap:11px}
  body.studio-workbench #payModal .pp{font-size:18px}
  body.studio-workbench #payModal .pay-resumen{margin-top:18px}
  body.studio-workbench #payContinue{min-height:48px}
}
@media(prefers-reduced-motion:reduce){
  body.studio-workbench #payModal .pay-spinner{animation:none!important}
  body.studio-workbench #payModal :is(.paypack,.pay-radio:after,.pay-button-arrow),
  body.studio-workbench #mesa :is(.roundbtn,.ap-gen,.param,.image-ref-add,.refbox){transition:none}
}

/* «Saltar al contenido» del Estudio (5-oct-2026). Mismo patrón que la clase
   homónima de tokens.css, que el Estudio no importa: fuera de la vista hasta
   recibir el foco del teclado; entonces aparece arriba a la izquierda. */
.saltar-contenido{position:absolute;left:12px;top:12px;z-index:10000;padding:8px 16px;border-radius:999px;background:var(--negro-elevado);border:1px solid var(--verde-cocuyo);color:var(--verde-cocuyo);text-decoration:none;box-shadow:var(--glow-suave);transform:translateY(-160%)}
.saltar-contenido:focus,.saltar-contenido:focus-visible{transform:none}


/* cocuyo-css: assets/css/estudio-facil.css */
/* Referencia de interacción: 21st.dev Segmented Control (23552).
   Implementación nativa, sin dependencias ni cambios en la autenticación. */
.studio-experience{display:flex;align-items:center;gap:3px;padding:4px;border:1px solid var(--border2);border-radius:12px;background:var(--surface)}
.studio-experience button{min-height:37px;padding:8px 15px;border-radius:8px;font-size:12px;color:var(--muted2);transition:background .16s,color .16s}
.studio-experience button[aria-pressed="true"]{background:var(--lima);color:var(--tinta-sobre-verde);font-weight:650}
.studio-experience button span{margin-left:5px;font-size:9px;opacity:.7}
.studio-experience button:focus-visible,.facil-panel :is(button,select,input):focus-visible,.facil-pin :is(button,input):focus-visible{outline:2px solid var(--lima);outline-offset:3px}
.facil-pin{width:min(420px,calc(100vw - 32px));padding:28px;border:1px solid var(--border2);border-radius:22px;background:var(--surface);color:var(--text);font-family:var(--font);box-shadow:0 25px 90px #0008}
.facil-pin::backdrop{background:#000a;backdrop-filter:blur(6px)}
.facil-pin h2{font-size:23px;letter-spacing:-.03em;margin:12px 0}
.facil-pin p{font-size:13px;line-height:1.6;color:var(--muted2)}
.facil-pin label{display:block;font-size:12px;color:var(--muted2);margin-top:22px}
.facil-pin input{display:block;box-sizing:border-box;width:100%;margin-top:9px;min-height:58px;background:var(--bg);border:1px solid var(--border2);border-radius:12px;color:var(--text);text-align:center;font:600 25px var(--font);letter-spacing:.5em;padding-left:.5em}
.facil-pin-actions{display:flex;gap:8px;margin-top:20px}
.facil-pin-actions button{flex:1;min-height:44px;border-radius:10px;background:var(--surface3);font-size:13px}
.facil-pin-actions button[type="submit"]{background:var(--lima);color:var(--tinta-sobre-verde);font-weight:650}
.facil-error{color:var(--peligro)!important;min-height:18px;margin:8px 0 0!important}
.facil-panel{padding:22px;margin-bottom:24px;border:1px solid var(--border2);border-radius:18px;background:var(--surface)}
.facil-panel[hidden]{display:none!important}
.facil-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
.facil-heading h2{margin:0;font-size:22px;letter-spacing:-.03em}
.facil-heading p{font-size:13px;color:var(--muted2);margin:8px 0;line-height:1.6}
.facil-heading button,.facil-settings{font-size:11px;color:var(--muted);padding:8px 0;text-decoration:underline;text-underline-offset:4px}
.facil-grid{display:grid;grid-template-columns:minmax(220px,1fr) minmax(240px,1.4fr);gap:24px;margin-top:17px}
.facil-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.facil-panel label{display:block;font-size:12px;color:var(--muted2)}
.facil-panel select,.facil-panel input{display:block;box-sizing:border-box;width:100%;min-width:0;margin-top:7px;min-height:44px;background:var(--bg);border:1px solid var(--border2);border-radius:9px;padding:10px 12px;color:var(--text);font:12px var(--font)}
.facil-hint{font-size:12px;line-height:1.6;color:var(--muted);margin:10px 0}
.facil-prepare{width:100%;min-height:43px;padding:11px 15px;margin-top:13px;border:1px solid color-mix(in srgb,var(--lima) 42%,var(--border));border-radius:10px;background:var(--acento-fondo);font-size:12px;font-weight:600;color:var(--lima)}
.facil-status{margin:10px 0 0;min-height:18px;font-size:12px;line-height:1.6;color:var(--muted2)}
body.experiencia-facil .studio-tools,body.experiencia-facil .modemore{display:none!important}
body.experiencia-facil:not(.facil-ajustes):not(.modo-audio) #mesa #parambar> :not(.cost):not([data-pop="model"]):not(#omniLimits){display:none}
body.experiencia-facil .studio-workhead{margin-bottom:17px}
body.experiencia-facil .studio-editor-badge{font-size:0}
body.experiencia-facil .studio-editor-badge:after{content:'Revisa y crea';font-size:10px}
.facil-settings{display:none}
.facil-resumen{display:none}
body.experiencia-facil .facil-resumen{display:block;order:6;margin:10px 0 0;font-size:11px;line-height:1.7;color:var(--muted2)}
body.experiencia-facil .facil-settings{display:block;margin:10px 0 0}
@media(max-width:700px){
 .studio-topbar{flex-wrap:wrap;gap:12px}
 .studio-experience{order:3;width:100%}.studio-experience button{flex:1}
 .facil-panel{padding:17px}.facil-grid{grid-template-columns:1fr;gap:12px}
 .facil-heading{align-items:flex-start}.facil-heading h2{font-size:21px}
 .facil-heading>button{max-width:88px;text-align:right;flex-shrink:0}
 .facil-fields{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.studio-experience button{transition:none}}


/* cocuyo-css: assets/css/estudio-avanzado.css */
/* Estado de cotización visible antes de generar, también al adjuntar primero. */
body.studio-workbench #mesa #refQuoteStatus{grid-column:1/-1;display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:10px 12px;border:1px solid var(--border2);border-radius:10px;font-size:12px;line-height:1.5;color:var(--muted2);background:var(--bg)}
body.studio-workbench #mesa #refQuoteStatus[hidden],body.studio-workbench #mesa #refQuoteStatus button[hidden]{display:none}
body.studio-workbench #mesa #refQuoteStatus button{min-height:40px;padding:6px 12px;border:1px solid var(--border2);border-radius:8px;background:var(--surface);color:var(--lima);font:inherit;cursor:pointer}
body.studio-workbench #mesa #refQuoteStatus button:focus-visible{outline:2px solid var(--lima);outline-offset:2px}

/* Estudio avanzado: resultados arriba y mesa ancha de imagen/video.
   Cargar despues de estudio-workspace.css. No mueve ni clona nodos.
   --mesa-h lo actualiza el ResizeObserver existente en estudio-4.js;
   la reserva inferior sigue la altura real de la mesa y sus referencias.
   Facil, Audio y pantallas de hasta 1000 px conservan su composicion. */
@media (min-width:1001px){
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]){
    --studio-dock-gap:18px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #pg-home>.studio-wrap{
    padding-top:22px;
    padding-bottom:calc(var(--mesa-h,350px) + var(--studio-dock-gap) + 32px);
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) .studio-workspace{
    display:block;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) .studio-editor-slot{
    position:static;
    min-height:0;
    scroll-margin-bottom:calc(var(--mesa-h,350px) + 32px);
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) .studio-workhead{
    margin-bottom:13px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #pg-home #title{
    font-size:25px;
    margin-block:5px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) .studio-results{
    width:100%;
    scroll-margin-bottom:calc(var(--mesa-h,350px) + 32px);
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) .studio-results-head{
    margin-bottom:12px;
  }
  /* El aviso antiguo flotaba a 96 px y podia cubrir los ajustes. */
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #genstatus{
    position:static;
    inset:auto;
    transform:none;
    max-width:none;
    margin:0 0 14px;
    box-shadow:none;
    z-index:auto;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa{
    position:fixed;
    inset:auto 0 var(--studio-dock-gap) var(--side);
    z-index:50;
    display:flex;
    justify-content:center;
    width:auto;
    padding:0 24px;
    pointer-events:none;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .mesa-in{
    display:grid;
    grid-template-rows:auto minmax(0,1fr) auto;
    gap:10px;
    width:min(1100px,100%);
    max-height:min(420px,calc(100dvh - 150px));
    padding:13px 15px 14px;
    overflow:visible;
    pointer-events:auto;
    border-color:var(--border2);
    border-radius:18px;
    background:var(--surface);
    box-shadow:0 14px 50px color-mix(in srgb,var(--negro-abismo) 60%,transparent);
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .studio-editor-head{
    display:none;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .mesa-top{
    display:none;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .modesw{
    width:fit-content;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .modesw .inner{
    width:auto;
    padding:3px;
    border-radius:9px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .modesw button{
    flex:0 0 auto;
    min-height:31px;
    padding:6px 14px;
    font-size:12px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .composer{
    display:grid;
    grid-template-columns:minmax(0,1fr) 170px;
    grid-template-areas:"refs refs" "prompt prompt" "params generate";
    gap:10px 12px;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
    scrollbar-width:thin;
  }
  /* El textbox conserva su nombre accesible. Las referencias conservan
     etiquetas, contador y limite reales sin repetir un titulo de seccion. */
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .studio-field-heading{
    display:none;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageRefControls{
    grid-area:refs;
    align-self:start;
    width:236px;
    margin:0;
    gap:5px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #addImageRefs{
    min-height:45px;
    padding:10px 11px;
    gap:8px;
    border-radius:9px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #addImageRefs>.ic{
    width:18px;
    height:18px;
    flex-basis:18px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageRefHint{
    padding:0 2px;
    line-height:1.5;
    font-size:10px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #refgrid{
    grid-area:refs;
    align-self:start;
    width:360px;
    margin:0;
    gap:6px;
    overflow:visible;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #refgrid .refwrap{
    flex:1 1 44%;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #refgrid .refbox{
    flex-direction:row;
    min-height:35px;
    height:auto;
    padding:8px 10px;
    gap:7px;
    font-size:11px;
    border-radius:9px;
    text-align:left;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #refgrid .refbox .ic{
    width:16px;
    height:16px;
    flex:0 0 16px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #attrow{
    grid-area:refs;
    align-self:center;
    min-width:0;
    max-width:none;
    margin:0 0 0 376px!important;
    padding:2px 2px 5px;
    flex-wrap:nowrap!important;
    gap:7px!important;
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:thin;
    overscroll-behavior-x:contain;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]).modo-imagen #mesa #attrow{
    margin-left:252px!important;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .attchip{
    flex:0 0 68px;
    width:68px;
    height:68px;
    border-radius:9px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .attchip .x{
    width:23px;
    height:23px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .attcuenta{
    flex:0 0 auto;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #ta{
    grid-area:prompt;
    min-height:70px;
    max-height:105px;
    margin:0;
    padding:11px 13px;
    border-radius:10px;
    font-size:14px;
    line-height:1.6;
    scroll-margin-block:12px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #parambar{
    grid-area:params;
    position:sticky;
    bottom:0;
    z-index:3;
    /* render() conserva display:grid inline; aqui solo cambia su disposicion. */
    display:flex!important;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
    min-width:0;
    padding:5px 0 0;
    background:var(--surface);
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #parambar>.lbl{
    display:none;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #parambar>.param[data-pop="model"]{
    flex:0 1 auto;
    width:auto;
    min-width:165px;
    max-width:100%;
    min-height:40px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .param{
    width:auto;
    min-height:40px;
    padding:9px 10px;
    gap:7px;
    font-size:12px;
    border-radius:9px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .param[data-pop="model"]>span:not(.car){
    overflow-wrap:anywhere;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #parambar .cost{
    display:none;
    margin:0 0 0 auto;
    padding:8px 3px;
    min-height:40px;
    gap:5px;
    white-space:nowrap;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .cost-caption{
    margin:0 2px 0 0;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .cost b{
    font-size:14px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #omniLimits{
    flex:0 0 100%;
    padding:0 0 3px;
    overflow-wrap:anywhere;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #headicons{
    grid-area:generate;
    align-self:end;
    position:sticky;
    bottom:0;
    margin:0;
    padding:5px 0 0;
    background:var(--surface);
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #headicons .roundbtn{
    min-height:45px;
    padding:12px 16px;
    border-radius:10px;
    font-size:13px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .studio-tools{
    margin:0;
    padding:6px 0 0;
    max-height:86px;
    overflow-y:auto;
    scrollbar-width:thin;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .studio-tools summary{
    padding:3px 2px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .studio-tools #apps{
    margin-top:7px;
  }
  /* Popover y su fallback fijo conservan sus reglas de estudio-workspace.
     No se aplica transform, filter, contain ni backdrop-filter a sus padres. */
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-empty{
    display:grid;grid-template-columns:minmax(200px,.8fr) 1.2fr;max-width:900px;margin:0 auto;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-empty-preview{
    min-height:150px;aspect-ratio:auto;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-preview-label{top:12px;left:16px;font-size:11px}
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-preview-caption{left:18px;bottom:18px}
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-preview-caption>span{font-size:11px;margin-bottom:8px}
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-preview-caption>b{font-size:32px}
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-empty-copy{padding:22px 26px;align-self:center}
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-empty-copy h3{font-size:18px}
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-empty-copy p{display:none}
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-empty .studio-workflow{display:none}
}

/* Una ventana de escritorio muy baja necesita flujo normal: todos los
   controles siguen al alcance, sin cubrir el lienzo con una mesa enorme. */
@media (min-width:1001px) and (max-height:640px){
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #pg-home>.studio-wrap{
    padding-bottom:32px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) .studio-workspace{
    display:flex;
    flex-direction:column-reverse;
    gap:24px;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) .studio-editor-slot{
    width:100%;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa{
    position:static;
    width:100%;
    padding:0;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .mesa-in{
    max-height:none;
  }
  body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .composer{
    overflow:visible;
  }
}

/* Móvil y tableta: el compositor va en el flujo y el botón Generar suele
   quedar abajo; el aviso flotante se muestra bajo la cabecera para no tapar
   Generar ni el coste mientras dura. */
@media (max-width:1000px){
  body.studio-workbench #genstatus{
    top:calc(76px + env(safe-area-inset-top,0px));
    bottom:auto;
  }
}


/* cocuyo-css: assets/css/estudio-herramientas.css */
/* Herramientas: acciones con icono y descripción inspiradas en Menu de
   coss.com / 21st.dev. Tokens de Cocuyo y controles nativos accesibles. */
.studio-topbar{z-index:65;gap:18px}
.studio-tools-legacy{display:none!important}
.studio-topbar-title{margin-right:auto}
.studio-tools-switch{position:static}
.studio-tools-trigger{display:flex;align-items:center;gap:9px;min-height:44px;padding:10px 15px;border:1px solid var(--border2);border-radius:12px;background:var(--surface);color:var(--text);font:600 13px var(--font);cursor:pointer;box-shadow:inset 0 1px 0 #ffffff08;transition:background .18s,border-color .18s}
.studio-tools-trigger>.ic:first-child{color:var(--lima)}
.studio-tools-trigger>.ic:last-child{width:14px;height:14px;transition:transform .18s}
.studio-tools-trigger:hover,.studio-tools-trigger[aria-expanded="true"]{background:var(--surface2);border-color:var(--lima)}
.studio-tools-trigger[aria-expanded="true"]>.ic:last-child{transform:rotate(180deg)}
.studio-tools-label{display:grid;gap:3px;min-width:0;text-align:left}
.studio-tools-label small{font-size:10px;font-weight:500;line-height:1.3;color:var(--muted)}
.studio-tools-label [hidden],.studio-tools-footer [hidden]{display:none!important}
.studio-tools-menu .studio-tools-group button[data-tool-state="proximamente"]{opacity:1;cursor:default;background:transparent;border-color:var(--border)}
.studio-tools-menu .studio-tools-group button[data-tool-state="proximamente"] b{color:var(--muted2)}
.studio-tools-menu .studio-tools-group button[data-tool-state="proximamente"] .studio-tool-arrow{display:none}
.studio-tools-menu .studio-tools-group button[data-tool-state="proximamente"] [data-tool-availability]{display:inline-flex;width:fit-content;padding:4px 8px;border:1px solid var(--border);border-radius:6px;background:var(--surface2);color:var(--muted2);font-size:11px;font-weight:500;line-height:1.3}
.studio-tools-menu{position:absolute;right:24px;top:calc(100% + 8px);width:min(650px,calc(100vw - var(--side) - 48px));max-height:calc(100dvh - 105px);overflow:auto;overscroll-behavior:contain;padding:21px;border:1px solid var(--border2);border-radius:20px;background:var(--surface);box-shadow:0 24px 80px #0009,inset 0 1px 0 #ffffff08;animation:studio-tools-in .16s ease-out;scrollbar-width:thin}
.studio-tools-menu[hidden],.studio-tool-guide[hidden]{display:none}
.studio-tools-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:15px}
.studio-tools-heading h2{font:600 21px var(--font);letter-spacing:-.03em;margin:0 0 5px}
.studio-tools-heading p{font-size:12px;color:var(--muted2);margin:0}
.studio-tools-menu [data-tools-close],.studio-tool-guide [data-tool-close]{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;border:1px solid var(--border2);border-radius:50%;background:transparent;color:var(--muted2);cursor:pointer}
.studio-tools-menu [data-tools-list]{display:grid;grid-template-columns:1fr 1fr;gap:8px 18px;align-items:start}
.studio-tools-group:nth-child(2){grid-column:2;grid-row:1/span 2}
.studio-tools-group h3{margin:12px 10px 6px;font-size:10px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.studio-tools-group button{display:flex;align-items:flex-start;width:100%;gap:11px;min-height:96px;padding:13px 9px;border:1px solid transparent;border-radius:12px;background:transparent;color:var(--text);text-align:left;font:inherit;cursor:pointer;transition:background .16s,border-color .16s}
.studio-tools-group button:hover,.studio-tools-group button:focus-visible{background:var(--surface2);border-color:var(--border2)}
.studio-tool-icon{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border:1px solid var(--border2);border-radius:10px;color:var(--lima);background:var(--bg)}
.studio-tool-icon .ic{width:19px;height:19px}
.studio-tools-group button>span:nth-child(2){min-width:0;flex:1}
.studio-tools-group button b{display:block;font-size:13px;font-weight:600;line-height:1.45}
.studio-tools-group button small{display:block;margin-top:4px;font-size:11px;line-height:1.55;color:var(--muted2)}
.studio-tools-group button em{display:block;margin-top:8px;color:var(--muted);font-size:10px;line-height:1.5;font-style:normal}
.studio-tool-arrow{flex:0 0 13px;width:13px;height:13px;margin-top:6px;color:var(--muted);transition:transform .16s,color .16s}
.studio-tools-group button:hover .studio-tool-arrow{transform:translateX(2px);color:var(--lima)}
.studio-tools-group button[aria-disabled="true"] .studio-tool-icon{color:var(--muted)}
.studio-tools-group button[aria-disabled="true"] em{color:var(--muted2)}
.studio-tools-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:15px;padding-top:15px;border-top:1px solid var(--border);font-size:11px;color:var(--muted2)}
.studio-tools-footer p{margin:0;line-height:1.5}
.studio-tools-footer button{min-height:40px;flex-shrink:0;font:500 11px var(--font);color:var(--lima);background:transparent;cursor:pointer}
.studio-tools-menu [data-tools-status]{font-size:12px;line-height:1.6;color:var(--text);margin:0}
.studio-tools-menu [data-tools-status]:not(:empty){margin-top:12px;padding:12px;border-radius:10px;background:var(--bg);border:1px solid var(--border2)}
.studio-tool-guide{margin-bottom:22px;padding:20px 22px;border:1px solid var(--border2);border-radius:17px;background:linear-gradient(115deg,var(--acento-fondo),transparent 56%),var(--surface);scroll-margin-top:100px}
.studio-tool-guide-top{display:flex;align-items:center;gap:13px}
.studio-tool-guide-top>div{flex:1;min-width:0}
.studio-tool-guide h2{font-size:18px;line-height:1.3;font-weight:600;letter-spacing:-.02em;margin:0 0 5px}
.studio-tool-guide [data-tool-meta]{font-size:11px;color:var(--muted2)}
.studio-tool-guide [data-tool-help]{font-size:13px;line-height:1.65;max-width:780px;color:var(--muted2);margin:16px 0}
.studio-tool-guide ol{display:flex;flex-wrap:wrap;gap:10px 25px;padding:0;margin:0;list-style:none}
.studio-tool-guide li{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted2)}
.studio-tool-guide li span{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1px solid var(--border2);color:var(--lima);font-size:10px}
.studio-tool-guide-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--border);padding-top:13px;margin-top:17px}
.studio-tool-guide [data-tool-status]{font-size:11px;line-height:1.5;color:var(--muted2);margin:0}
.studio-tool-guide [data-tool-write]{min-height:40px;padding:8px 13px;border:1px solid var(--border2);border-radius:9px;background:var(--surface2);color:var(--text);font:500 12px var(--font);cursor:pointer;flex-shrink:0}
.studio-tools-switch :is(button):focus-visible,.studio-tool-guide :is(button):focus-visible{outline:2px solid var(--lima);outline-offset:3px}
.studio-tool-guide:focus-visible{outline:2px solid var(--lima);outline-offset:3px}
body.experiencia-facil .studio-tools-switch,body.experiencia-facil .studio-tool-guide{display:none}
@keyframes studio-tools-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:900px){.studio-tools-menu{width:min(650px,calc(100vw - 32px));right:16px}}
@media(max-width:700px){
 .studio-topbar{display:grid;grid-template-columns:1fr auto;gap:9px 12px}
 .studio-topbar-title{grid-column:1;grid-row:1}
 .studio-tools-switch{grid-column:2;grid-row:1}
 .studio-topbar .studio-experience{grid-column:1;grid-row:2;order:initial;width:auto;justify-self:start}
 .studio-topbar .studio-experience button{padding:7px 13px;min-height:32px;font-size:11px}
 .studio-topbar .studio-cine-link{grid-column:2;grid-row:2;justify-self:end}
 .studio-tools-trigger{padding:9px 11px;font-size:12px;gap:7px}
 .studio-tools-menu{max-height:calc(100dvh - 145px);padding:17px}
 .studio-tools-menu [data-tools-list]{display:block}
 .studio-tools-group button{min-height:78px;padding:11px 8px}
 .studio-tools-group button em{margin-top:4px}
 .studio-tools-footer{align-items:flex-start;gap:10px}
 .studio-tools-footer p{max-width:170px}
 .studio-tool-guide{padding:17px;scroll-margin-top:138px}
 .studio-tool-guide h2{font-size:16px}
 .studio-tool-guide ol{gap:9px 14px}
 .studio-tool-guide-bottom{flex-wrap:wrap;gap:7px}
 body.experiencia-facil .studio-topbar .studio-cine-link{grid-row:1}
}
@media(prefers-reduced-motion:reduce){.studio-tools-menu{animation:none}.studio-tools-trigger,.studio-tools-trigger>.ic:last-child,.studio-tools-group button,.studio-tool-arrow{transition:none}}


/* cocuyo-css: assets/css/estudio-acabado.css */
/* Acabado del Estudio. Roles de color independientes del verde de marca:
   la lima sirve para botones; el acento de texto debe poder leerse en blanco.
   Selector compacto inspirado en TeamSwitcher de ruixen.ui / 21st.dev 8252.
   Biblioteca: filtros y fechas observados en Higgsfield Assets. */
.side button.brand{padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer}
.side button.brand:focus-visible{outline:2px solid var(--studio-accent);outline-offset:6px;border-radius:4px}
.accmenu button.mi{width:100%;border:0;background:transparent;font-family:inherit;text-align:left;cursor:pointer}
.studio-settings{box-sizing:border-box;width:min(480px,calc(100% - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:28px;border:1px solid var(--border2);border-radius:24px;background:var(--panel);color:var(--text);box-shadow:var(--studio-shadow);overflow:auto}
.studio-settings:not([open]){display:none}
.studio-settings::backdrop{background:var(--studio-overlay);backdrop-filter:blur(5px)}
.studio-settings-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:26px}
.studio-settings h2{margin:0;font-size:25px;line-height:1.2;letter-spacing:-.035em}
.studio-settings p{margin:7px 0 0;color:var(--muted2);font-size:13px;line-height:1.5}
.studio-settings-heading .iconbtn{flex-shrink:0;width:36px;height:36px;background:var(--surface2);border:1px solid var(--border);border-radius:50%;color:var(--text)}
.studio-settings-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;padding:22px 0;border-top:1px solid var(--border)}
.studio-settings h3{margin:0;font-size:15px;font-weight:600}
.studio-settings-row p{font-size:12px;margin-top:5px}
.studio-settings .cocuyo-idioma{min-height:44px;padding:0 12px;border-color:var(--border2);background:var(--surface);color:var(--text);font-size:13px}
.studio-settings .cocuyo-idioma select{min-height:42px;max-width:none}
.studio-settings .cocuyo-idioma option{background:var(--surface);color:var(--text)}
.studio-settings .studio-settings-note{padding-top:18px;border-top:1px solid var(--border);font-size:12px;color:var(--muted)}
@media(max-width:480px){.studio-settings{padding:22px}.studio-settings-row>[data-idioma-slot]{width:100%}.studio-settings .cocuyo-idioma{display:flex}.studio-settings .cocuyo-idioma select{flex:1;min-width:0}.studio-settings-heading{margin-bottom:20px}}
@media(prefers-reduced-motion:no-preference){.studio-settings[open]{animation:studio-settings-appear .18s ease-out}@keyframes studio-settings-appear{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}}
:root{
 --studio-accent:var(--lima);--studio-active:var(--lima-suave);
 --studio-shadow:0 16px 48px #0007,0 2px 8px #0004;
 --studio-dock-shadow:0 12px 36px #0006,0 0 0 1px #ffffff05;
 --studio-overlay:rgb(0 0 0/.65);
}

body.studio-workbench .side{background:var(--panel);padding-top:24px}
body.studio-workbench .side>.top{padding-bottom:23px}
body.studio-workbench #toolnav{gap:7px}
body.studio-workbench #toolnav a{min-height:56px;border-radius:13px;font-size:14px}
body.studio-workbench #toolnav a.active{color:var(--text);background:var(--studio-active);border-color:var(--border2);box-shadow:inset 3px 0 0 var(--studio-accent)}
body.studio-workbench .side>.navlist a.active>.ic{color:var(--studio-accent);background:var(--surface);border-color:var(--border2)}
body.studio-workbench .side>.navlist a>.ic{border-radius:10px;stroke-width:1.6}
body.studio-workbench .studio-library-nav{padding-top:13px;margin-top:20px}
body.studio-workbench .side .upgbtn{background:var(--surface);color:var(--text);border:1px solid var(--border2);box-shadow:none;filter:none}
body.studio-workbench .side .upgbtn:hover{background:var(--studio-active);border-color:var(--studio-accent);color:var(--studio-accent)}
body.studio-workbench .upgbtn::before,body.studio-workbench .upgbtn::after{display:none}
body.studio-workbench .side .foot{gap:11px;padding-top:16px}
body.studio-workbench .acct .av,body.studio-workbench .acct .cr .ic,.acc-avatar,
body.studio-workbench .accmenu .card>.ic,body.studio-workbench .accmenu .mi:hover>.ic{color:var(--studio-accent)}
body.studio-workbench .accmenu,body.studio-workbench #submenu,
body.studio-workbench #mesa .studio-floating,.studio-tools-menu{box-shadow:var(--studio-shadow)}
body.studio-workbench .studio-topbar{background:var(--panel)}
.studio-topbar-title b{display:none}
.studio-tools-trigger>.ic:first-child,.studio-tools-footer button,.studio-tool-icon,
.studio-tools-group button:hover .studio-tool-arrow,.studio-tool-guide li span,
.studio-cine-link:hover{color:var(--studio-accent)}
.studio-tools-trigger:hover,.studio-tools-trigger[aria-expanded="true"]{border-color:var(--studio-accent)}
.studio-audio-art{background:radial-gradient(ellipse at 78% 30%,#132811,#050505 74%)}
.studio-audio-disc{border-color:#ffffff29;box-shadow:0 0 0 28px #ffffff08,0 0 0 58px #ffffff04}
.studio-audio-disc::before{border-color:#ffffff29}
body.studio-workbench.modo-audio .ap-vozlabel,body.studio-workbench.modo-audio .ap-vozplay,
body.studio-workbench #mesa .modesw button.active .ic,.studio-workflow i,
body.studio-workbench .fa-foto,body.studio-workbench .fa-foto b{color:var(--studio-accent)}
body.studio-workbench #mesa .mesa-in{box-shadow:var(--studio-dock-shadow)!important;border-color:var(--border2);border-radius:20px}
body.studio-workbench #mesa #ta{background:var(--bg)!important;color:var(--text);border-color:var(--border)!important;transition:border-color .16s,box-shadow .16s}
body.studio-workbench #mesa #ta:focus{outline:none;border-color:var(--studio-accent)!important;box-shadow:0 0 0 3px var(--studio-active)}
body.studio-workbench #mesa .param{background:var(--surface2);border:1px solid var(--border2);font-weight:500;box-shadow:inset 0 1px 0 #ffffff08}
body.studio-workbench #mesa .param:hover{background:var(--surface);border-color:var(--studio-accent)}
body.studio-workbench #mesa .param[data-pop="model"]{background:var(--surface);font-weight:650}
body.studio-workbench #mesa :is(#addImageRefs,.refbox){color:var(--text);background:var(--surface2);border:1px solid var(--border2);border-radius:10px}
body.studio-workbench #mesa :is(#addImageRefs,.refbox)>.ic{color:var(--studio-accent)}
body.studio-workbench #mesa .image-ref-add b{color:var(--studio-accent);background:var(--surface)}
body.studio-workbench #mesa :is(#addImageRefs,.refbox):hover{border-color:var(--studio-accent);background:var(--studio-active)}
body.studio-workbench #mesa #refQuoteStatus button,body.studio-workbench #payRetry{color:var(--studio-accent)}
body.studio-workbench #mesa #headicons .roundbtn{background:var(--lima);border:1px solid color-mix(in srgb,var(--verde-profundo) 25%,var(--lima));color:var(--tinta-sobre-verde);font-weight:650;box-shadow:inset 0 1px 0 #ffffff70,0 2px 5px #0001}
body.studio-workbench #mesa #headicons .roundbtn:hover:not(:disabled){background:var(--lima-clara);filter:none}
body.studio-workbench #modal,body.studio-workbench #payModal{background:var(--studio-overlay);backdrop-filter:blur(6px)}
body.studio-workbench #modal .mbox,body.studio-workbench #payModal .pay-dialog{box-shadow:var(--studio-shadow)}
body.studio-workbench #modal .mrow.sel{border-color:var(--studio-accent);background:var(--studio-active)}
body.studio-workbench #payModal .paypack.seleccionado{border-color:var(--studio-accent)}
.studio-results-head h2{letter-spacing:-.035em}
.studio-empty{border-color:var(--border);box-shadow:none}
.studio-session-switch{position:relative;margin-top:14px;min-width:0}
#studioSessionToggle{display:flex;align-items:center;gap:10px;width:100%;min-height:60px;padding:10px;border:1px solid var(--border);border-radius:12px;background:var(--surface);text-align:left}
#studioSessionToggle>span{display:grid;gap:5px;min-width:0;flex:1}
#studioSessionToggle small{font-size:10px;color:var(--muted);font-weight:450}
#studioSessionToggle strong{font-size:12px;font-weight:550;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#studioSessionToggle>.ic{color:var(--studio-accent);flex:none}
#studioSessionToggle>.ic:last-child{color:var(--muted)}
#studioSessionToggle:hover,#studioSessionToggle[aria-expanded="true"]{border-color:var(--studio-accent)}
#studioSessionPanel{position:fixed;inset:auto;margin:0;z-index:95;width:340px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px);overflow:auto;padding:13px;border:1px solid var(--border2);border-radius:17px;background:var(--surface);color:var(--text);box-shadow:var(--studio-shadow)}
#studioSessionPanel::backdrop{background:transparent}
#studioSessionPanel[hidden],#studioSessionEmpty[hidden]{display:none}
.studio-session-heading{display:flex;align-items:center;justify-content:space-between;padding:0 0 10px 7px}
.studio-session-heading strong{font-size:16px;letter-spacing:-.025em}
#studioSessionClose{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--border);border-radius:10px;color:var(--muted2)}
.studio-session-search{display:flex;align-items:center;gap:9px;padding:0 12px;min-height:42px;margin-bottom:10px;border:1px solid var(--border2);border-radius:10px;background:var(--bg);color:var(--muted)}
.studio-session-search input{width:100%;min-width:0;padding:10px 0;background:transparent;color:var(--text);border:0;outline:none;font:12px var(--font)}
.studio-session-search:focus-within{outline:2px solid var(--studio-accent);outline-offset:2px}
body.studio-workbench .sessions{max-height:240px;overflow:auto;gap:4px}
body.studio-workbench .sessions .item[hidden]{display:none}
body.studio-workbench .sessions .item.ses{padding:5px;gap:3px;border:1px solid transparent;min-height:45px}
body.studio-workbench .sessions .item.ses.on{border-color:var(--border);background:var(--studio-active)}
.studio-session-pick{display:flex;align-items:center;gap:9px;flex:1;min-width:0;padding:7px 5px;text-align:left;color:var(--text);font-size:12px}
body.studio-workbench .sessions .sq{flex:none;color:var(--studio-accent)!important;background:transparent!important}
body.studio-workbench .sessions .sesx{opacity:1;flex:0 0 32px;width:32px;height:32px;border-radius:8px;color:var(--muted);border:1px solid transparent}
body.studio-workbench .sessions .sesx:hover{border-color:var(--border2);background:var(--surface2);color:var(--text)}
body.studio-workbench .sessions .sesn{color:var(--muted2);background:var(--surface);font-size:10px}
.studio-session-new{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:42px;margin-top:10px;border:1px solid var(--border2);border-radius:10px;background:var(--surface2);font-size:12px;font-weight:550}
.studio-session-new:hover{background:var(--studio-active);border-color:var(--studio-accent)}
#studioSessionEmpty{font-size:12px;line-height:1.6;padding:12px;color:var(--muted)}
/* Biblioteca: las acciones afectan a los archivos reales; ningún control decorativo. */
body.studio-workbench #pg-library{padding:26px 28px 60px;max-width:1500px;margin:auto}
body.studio-workbench #pg-library{overflow-anchor:none}
.studio-assets-heading{display:flex;align-items:center;gap:13px;margin-bottom:22px}
.studio-assets-mark{display:grid;place-items:center;flex:none;width:46px;height:46px;border:1px solid var(--border2);border-radius:14px;color:var(--studio-accent);background:var(--surface)}
.studio-assets-heading h1{margin:0 0 5px;font:600 26px var(--font);letter-spacing:-.045em}
.studio-assets-heading p{margin:0;color:var(--muted);font-size:12px;line-height:1.55}
body.studio-workbench .bv-barra{position:relative;top:auto;padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:15px;gap:10px;margin-bottom:8px}
.studio-assets-actions,.studio-assets-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;width:100%}
.studio-assets-filters{border-top:1px solid var(--border);padding-top:12px}
body.studio-workbench .bv-segs{background:var(--bg);border-color:var(--border);padding:3px}
body.studio-workbench .bv-seg{display:flex;align-items:center;gap:7px;min-height:37px;padding:7px 11px;font-size:12px;font-weight:500}
body.studio-workbench .bv-seg.on{background:var(--studio-active);color:var(--studio-accent);box-shadow:inset 0 0 0 1px var(--border2)}
.studio-assets-count{font-size:10px;min-width:18px;padding:2px 4px;background:var(--surface);border-radius:4px;text-align:center;color:var(--muted2)}
body.studio-workbench :is(.bv-accion,.bv-chip,.bv-sel,.bv-busca){min-height:40px;font:500 12px var(--font);border-color:var(--border2);border-radius:9px}
body.studio-workbench .bv-accion.viva{background:var(--lima);color:var(--tinta-sobre-verde)}
body.studio-workbench .bv-chip.on{background:var(--studio-active);color:var(--studio-accent);border-color:var(--studio-accent)}
body.studio-workbench .bv-busca{max-width:360px;margin-left:auto;background:var(--bg);font-weight:400}
body.studio-workbench .bv-cuenta{margin-left:auto;font-size:11px;color:var(--muted)}
body.studio-workbench .bv-dia{position:static;background:transparent;padding:24px 2px 13px;gap:10px}
body.studio-workbench .bv-dia span{font-size:15px;letter-spacing:-.02em}
body.studio-workbench .bv-dia i{font-size:11px;text-transform:none;letter-spacing:0}
body.studio-workbench .bv-rejilla{padding:0;gap:16px}
body.studio-workbench .bv-marco{border-radius:15px;background:var(--surface2);border-color:var(--border)}
.studio-asset-caption{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 3px;color:var(--muted2);font-size:11px}
.studio-asset-caption>span{display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.studio-asset-caption small{font-size:10px;flex:none;color:var(--muted)}
body.studio-workbench .bv-b,body.studio-workbench .bv-fav{display:grid;place-items:center;width:34px;height:34px;border:1px solid #ffffff38;background:#10150ed9;color:#fff;border-radius:10px;text-shadow:none}
body.studio-workbench .bv-fav.on{color:var(--lima)}
body.studio-workbench .bv-tar:focus-within .bv-acc{opacity:1;transform:none}
body.studio-workbench .bv-tar:focus-within .bv-fav{opacity:1}
body.studio-workbench .bv-vacio{padding:58px 24px;max-width:520px}
body.studio-workbench .bv-icono{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 20px;background:var(--studio-active);border:1px solid var(--border2);border-radius:20px;color:var(--studio-accent)}
body.studio-workbench .bv-icono .ic{width:28px;height:28px}
body.studio-workbench .bv-vacio h3{font:600 22px var(--font);letter-spacing:-.04em}
body.studio-workbench .bv-cta{border-radius:10px;min-height:43px;background:var(--lima);color:var(--tinta-sobre-verde);font-size:12px}
body.studio-workbench :is(button,a,input,select,[tabindex]):focus-visible{outline:2px solid var(--studio-accent);outline-offset:3px}

@media(hover:none){body.studio-workbench .bv-acc,body.studio-workbench .bv-fav{opacity:1;transform:none}}
@media(min-width:1001px){
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-eyebrow{display:none}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-workhead{margin-bottom:10px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-workhead p{font-size:12px}
}
@media(max-width:700px){
 body.studio-workbench #pg-library{padding:22px 14px 40px}
 .studio-assets-heading{align-items:flex-start;gap:11px}.studio-assets-heading h1{font-size:24px}
 .studio-assets-heading p{font-size:11px}.studio-assets-mark{width:41px;height:41px;border-radius:12px}
 body.studio-workbench .bv-barra{padding:11px;gap:11px}
 .studio-assets-actions{gap:7px}.studio-assets-filters{gap:7px}
 body.studio-workbench .bv-busca{flex:1 0 100%;max-width:none;margin:2px 0 0}
 body.studio-workbench .bv-segs{width:100%;justify-content:space-between}
 body.studio-workbench .bv-seg{font-size:11px;padding:7px;gap:5px}
 .studio-assets-count{font-size:9px;min-width:16px}
 body.studio-workbench .bv-seg .ic{width:14px;height:14px;flex-basis:14px}
 body.studio-workbench .bv-cuenta{font-size:10px}
 body.studio-workbench .bv-b,body.studio-workbench .bv-fav{width:36px;height:36px}
}
@media(prefers-reduced-motion:reduce){body.studio-workbench #mesa #ta{transition:none}}

/* El lienzo pertenece a las creaciones. Las herramientas viven en su menú. */
body.studio-workbench:not(.experiencia-facil) .studio-workhead{flex-direction:row;align-items:center;gap:12px;margin-bottom:16px}
body.studio-workbench:not(.experiencia-facil) .studio-workhead :is(.studio-eyebrow,#studioModeHelp){display:none}
body.studio-workbench:not(.experiencia-facil) #pg-home #title{font-size:20px;line-height:1.3;margin:0}
body.studio-workbench:not(.experiencia-facil) .studio-jump{align-self:center;margin:0}
body.studio-workbench:not(.experiencia-facil) .histbar{padding:0 0 8px;margin:0 0 6px}
body.studio-workbench:not(.experiencia-facil) .hist-dia{padding:6px 0 10px}
.studio-results-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:240px;padding:32px 20px;text-align:center;color:var(--muted2)}
.studio-results-empty .studio-results-empty-icon{width:30px;height:30px;flex:none;stroke-width:1.25;color:var(--muted);margin-bottom:15px}
.studio-results-empty h3{margin:0;font:500 15px/1.5 var(--font);letter-spacing:-.02em;color:var(--muted2)}
.studio-results-empty p{max-width:360px;margin:8px 0 12px;font:400 12px/1.65 var(--font);color:var(--muted)}
.studio-results-empty button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:8px 12px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--studio-accent);font:500 12px var(--font);cursor:pointer}
.studio-results-empty button:hover{border-color:var(--border2);background:var(--surface)}
@media(min-width:1001px){
 /* El modo ya está seleccionado en el lateral. Conservamos su h1 accesible. */
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) .studio-workhead{position:absolute;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #pg-home>.studio-wrap{padding-top:16px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio) .studio-results-empty{min-height:clamp(190px,calc(100dvh - var(--mesa-h,350px) - 225px),560px)}
}
@media(max-width:600px){
 body.studio-workbench:not(.experiencia-facil) #pg-home #title{font-size:18px}
 body.studio-workbench:not(.experiencia-facil) .studio-jump{font-size:10px;gap:6px}
 .studio-results-empty{min-height:210px;padding:28px 12px}
}

/* Lista: cada zona tiene su columna; la miniatura nunca tapa el texto. */
body.studio-workbench .jobfila{display:grid;grid-template-columns:clamp(132px,16vw,180px) minmax(0,1fr) 40px;grid-template-areas:"media cuerpo acciones";align-items:start;gap:18px;padding:16px;border-radius:14px;background:var(--surface)}
body.studio-workbench .jobfila .jr-med{grid-area:media;width:100%;min-width:0;max-width:none;aspect-ratio:16/10;border-radius:10px}
body.studio-workbench .jobfila .jr-cuerpo{grid-area:cuerpo;min-width:0;gap:10px}
body.studio-workbench .jobfila .jr-cab{gap:8px}
body.studio-workbench .jobfila .jr-modelo{max-width:100%;padding:0;background:transparent;font-size:13px;font-weight:650;line-height:1.5;color:var(--text);overflow-wrap:anywhere}
body.studio-workbench .jobfila .jr-prompt{font-size:14px;line-height:1.65;color:var(--text);overflow-wrap:anywhere}
body.studio-workbench .jobfila .jr-at{font-weight:600;color:var(--studio-accent);background:var(--studio-active)}
body.studio-workbench .jobfila .jr-err{font-size:13px;line-height:1.6;color:var(--peligro);overflow-wrap:anywhere}
body.studio-workbench .jobfila .jr-fallo{color:var(--peligro)}
body.studio-workbench .jobfila .jr-estado{font-size:12px;color:var(--muted2)}
body.studio-workbench .jobfila .jr-chips span{font-size:12px;color:var(--muted2);background:var(--surface2);padding:4px 9px}
body.studio-workbench .jobfila .jr-acc{grid-area:acciones;flex-direction:column;gap:8px;align-self:start}
body.studio-workbench .jobfila :is(.jfav,.jmas){display:grid;place-items:center;width:40px;height:40px;border-radius:10px;transform:none;color:var(--muted2);background:var(--surface2);border:1px solid var(--border)}
body.studio-workbench .jobfila .jfav.on{color:var(--studio-accent);background:var(--studio-active);border-color:var(--border2)}
body.studio-workbench .jobfila :is(.jfav,.jmas):hover{color:var(--text);border-color:var(--border2)}
@media(max-width:640px){
 body.studio-workbench .jobfila{grid-template-columns:88px minmax(0,1fr);grid-template-areas:"media cuerpo" "acciones cuerpo";grid-template-rows:auto 1fr;gap:12px;padding:12px}
 body.studio-workbench .jobfila .jr-acc{flex-direction:row;gap:6px}
 body.studio-workbench .jobfila .jr-prompt{-webkit-line-clamp:6}
}

/* Aviso flotante fuera del editor (Creaciones, Proyectos): mismo acabado que
   el aviso del compositor. Encima de la barra inferior en móvil. */
.studio-toast{position:fixed;left:16px;right:16px;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:400;width:fit-content;max-width:520px;margin-inline:auto;padding:12px 16px;border:1px solid var(--border);border-radius:12px;background:var(--surface);color:var(--text);font-size:13px;line-height:1.4;box-shadow:0 18px 40px -18px #000;text-align:center}
.studio-toast[hidden]{display:none}
@media(max-width:900px){.studio-toast{bottom:calc(var(--sm-bottom,64px) + 16px + env(safe-area-inset-bottom,0px))}}


/* cocuyo-css: assets/css/estudio-nivel.css */
/* Configuración inicial con tarjetas de elección. Referencia de jerarquía:
   Onboarding Card del catálogo 21st.dev; estilos nativos de Cocuyo. */
body.studio-workbench .side>.top{padding-bottom:16px}
body.studio-workbench .brand .wordmark{font-family:var(--font)}
body.studio-workbench .studio-library-nav a{white-space:nowrap;font-size:12px}
.studio-level-switch{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:10px 12px;margin:0 0 8px;background:var(--surface);border:1px solid var(--border2);border-radius:10px;color:var(--text);text-align:left;font:550 12px var(--font);cursor:pointer}
.studio-level-switch>.ic:first-child{width:17px;height:17px;color:var(--studio-accent)}
.studio-level-chevron{margin-left:auto;width:14px;height:14px;color:var(--muted2)}
.studio-level-switch:hover{background:var(--surface2);border-color:var(--studio-accent)}
.studio-level-switch[hidden]{display:none!important}
body.studio-workbench #toolnav{margin-top:0;padding-top:6px;border-top:0}
.side>.studio-tools-switch{margin:5px 0 4px}
.side .studio-tools-trigger{width:100%;min-height:52px;padding:8px 10px;gap:12px;border:0;border-radius:10px;background:transparent;box-shadow:none;color:var(--muted2);font-weight:550;text-align:left}
.side .studio-tools-trigger>.ic:first-child{box-sizing:content-box;flex:none;width:19px;height:19px;padding:8px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--muted2)}
.side .studio-tools-trigger>.ic:last-child{margin-left:auto}
.side .studio-tools-trigger:is(:hover,[aria-expanded="true"]){background:var(--surface);color:var(--text)}
.side .studio-tools-trigger[aria-expanded="true"]>.ic:first-child{color:var(--studio-accent);border-color:var(--studio-accent)}
body.studio-workbench>.studio-tools-menu{position:fixed;inset:24px auto auto calc(var(--side) + 12px);z-index:100;max-height:calc(100dvh - 48px);width:min(650px,calc(100vw - var(--side) - 36px))}
body.studio-workbench .studio-editor-slot{top:20px;scroll-margin-top:20px}
body.studio-workbench .studio-tool-guide{scroll-margin-top:20px}
.studio-mobile-menu{display:none!important}
.studio-level-dialog{width:min(660px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;padding:32px;margin:auto;border:1px solid var(--border2);border-radius:24px;background:radial-gradient(ellipse at top left,var(--acento-fondo),transparent 65%),var(--surface);color:var(--text);font-family:var(--font);box-shadow:var(--sombra-3)}
.studio-level-dialog::backdrop{background:#000a;backdrop-filter:blur(8px)}
.studio-level-intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}
.studio-level-intro .studio-two-lights{display:inline-flex!important;gap:6px;padding:10px 5px}
.studio-level-intro .studio-two-lights i{width:8px;height:22px}
.studio-level-intro button{display:grid;place-items:center;width:40px;height:40px;margin-left:auto;border-radius:50%;border:1px solid var(--border2);background:var(--surface);color:var(--muted2);cursor:pointer}
.studio-level-dialog h2{margin:0;font:600 clamp(26px,4vw,34px)/1.12 var(--font);letter-spacing:-.04em}
.studio-level-dialog #studioLevelTitle:focus{outline:none!important;box-shadow:none}
.studio-level-dialog #studioLevelHelp{margin:12px 0 25px;font-size:14px;line-height:1.6;color:var(--muted2)}
.studio-level-dialog fieldset{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0;padding:0;border:0;min-width:0}
.studio-level-dialog legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.studio-level-option{position:relative;display:flex;flex-direction:column;gap:10px;padding:20px;border:1px solid var(--border2);border-radius:16px;background:var(--bg);cursor:pointer;transition:border-color .15s,background .15s}
.studio-level-option input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.studio-level-option:has(input:checked){border-color:var(--studio-accent);background:var(--studio-active)}
.studio-level-option:has(input:focus-visible){outline:2px solid var(--studio-accent);outline-offset:3px}
.studio-level-option-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}
.studio-level-option-top>.ic{width:26px;height:26px;stroke-width:1.5;color:var(--studio-accent)}
.studio-level-check{width:18px;height:18px;border:1px solid var(--border2);border-radius:50%}
.studio-level-option:has(input:checked) .studio-level-check{border:5px solid var(--studio-accent);background:var(--bg)}
.studio-level-option strong{font-size:16px;font-weight:600;letter-spacing:-.025em}
.studio-level-option>span:not(.studio-level-option-top){font-size:12px;line-height:1.65;color:var(--muted2)}
.studio-level-option small{margin-top:auto;padding-top:8px;font-size:11px;font-weight:550;color:var(--studio-accent)}
.studio-level-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:24px}
.studio-level-footer p{max-width:235px;margin:0;font-size:12px;line-height:1.65;color:var(--muted2)}
.studio-level-footer button{flex-shrink:0;display:flex;align-items:center;gap:16px;min-height:46px;padding:12px 20px;border:0;border-radius:11px;background:var(--lima);color:var(--tinta-sobre-verde);font:600 13px var(--font);cursor:pointer}
.studio-level-dialog button:focus-visible{outline:2px solid var(--studio-accent);outline-offset:3px}
@media(max-width:900px){
 body.studio-workbench .studio-mobile-menu{display:grid!important;place-items:center;position:fixed;top:max(12px,env(safe-area-inset-top));left:max(14px,env(safe-area-inset-left));z-index:80;width:44px;height:44px;margin:0;background:var(--surface);border:1px solid var(--border2);border-radius:12px;color:var(--text);box-shadow:var(--sombra-1)}
 body.studio-workbench .main{padding-top:64px}
 body.studio-workbench>.studio-tools-menu{inset:64px 12px auto 12px;width:auto;max-height:calc(100dvh - 80px)}
 body.studio-workbench .studio-tool-guide{scroll-margin-top:72px}
}
@media(max-width:560px){
 .studio-level-dialog{padding:22px 18px;border-radius:20px}
 .studio-level-dialog #studioLevelHelp{margin-bottom:18px}
 .studio-level-dialog fieldset{grid-template-columns:1fr;gap:10px}
 .studio-level-option{padding:16px;gap:7px}.studio-level-option-top{margin-bottom:3px}
 .studio-level-option-top>.ic{width:22px;height:22px}
 .studio-level-option small{padding-top:1px}
 .studio-level-footer{flex-direction:column;gap:14px;align-items:stretch;margin-top:18px}
 .studio-level-footer p{max-width:none}.studio-level-footer button{justify-content:center}
}
@media(prefers-reduced-motion:no-preference){
 .studio-level-dialog[open]{animation:studio-nivel-entra .28s cubic-bezier(.2,.8,.2,1) both}
 .studio-level-dialog[open]::backdrop{animation:studio-nivel-velo .22s both}
 .studio-level-dialog[open] .studio-level-option{animation:studio-nivel-entra .34s .08s both;transition:border-color .18s,background .18s,transform .18s}
 .studio-level-dialog[open] .studio-level-option:nth-of-type(2){animation-delay:.14s}
 .studio-level-dialog[open] .studio-two-lights i{animation:studio-nivel-luz 1.4s ease-in-out 2}
 .studio-level-dialog[open] .studio-two-lights i:nth-child(2){animation-delay:.2s}
 .studio-level-option:hover{transform:translateY(-2px)}
 @keyframes studio-nivel-entra{from{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:none}}
 @keyframes studio-nivel-velo{from{opacity:0}to{opacity:1}}
 @keyframes studio-nivel-luz{50%{filter:brightness(1.2);box-shadow:0 0 15px var(--studio-accent)}}
}
@media(prefers-reduced-motion:reduce){.studio-level-option{transition:none}}


/* cocuyo-css: assets/css/estudio-movil.css */
/* Estudio móvil. Referencia observada: Higgsfield, 390 × 844, septiembre 2026.
   Conserva los nodos y los controles de generación; el escritorio no cambia. */
.sm-header,.sm-nav,.sm-hub-modes,.sm-hub-filters,.sm-panel-close,.sm-model-row{display:none}
.sm-create-dialog{box-sizing:border-box;inset:0;margin:auto;width:min(640px,100vw);max-width:100vw;height:100dvh;max-height:100dvh;padding:calc(20px + env(safe-area-inset-top,0px)) 20px calc(24px + env(safe-area-inset-bottom,0px));overflow:auto;border:0;background:var(--bg);color:var(--text);font:400 14px var(--font)}
.sm-create-dialog::backdrop{background:var(--studio-overlay)}
.sm-create-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:38px;gap:20px}
.sm-create-heading>span{font-size:11px;letter-spacing:.13em;color:var(--muted2)}
.sm-create-heading button{display:grid;place-items:center;width:44px;height:44px;flex:none;border:1px solid var(--border);border-radius:14px;background:var(--surface);color:var(--text)}
.sm-create-dialog h2{font:650 clamp(28px,7vw,36px)/1.12 var(--font);letter-spacing:-.045em;margin:0 0 14px;max-width:350px}
.sm-create-description{margin:0 0 30px;color:var(--muted2);font-size:14px;line-height:1.6}
.sm-create-choices{display:grid;gap:14px}
.sm-create-choice{display:flex;align-items:center;gap:16px;min-height:112px;width:100%;padding:14px;border:1px solid var(--border);border-radius:19px;background:var(--surface);color:var(--text);text-align:left;font-family:inherit;cursor:pointer}
.sm-create-choice>img,.sm-choice-art{width:76px;height:82px;object-fit:cover;border-radius:12px;flex:none;background:var(--surface2)}
.sm-choice-art{display:grid;place-items:center;color:var(--lima)}
.sm-choice-art>.ic{width:35px;height:35px}
.sm-create-choice>span:not(.sm-choice-art){display:grid;gap:8px;min-width:0}
.sm-create-choice b{font-size:16px;font-weight:600;line-height:1.2}
.sm-create-choice small{font-size:12px;line-height:1.5;color:var(--muted2)}
.sm-create-choice>.ic{width:17px;height:17px;margin-left:auto;flex:none;transform:rotate(-90deg);color:var(--muted)}
.sm-create-choice:hover{border-color:var(--lima)}
/* Hoja de modos: accesos de la navegación principal (Apps, útiles…). */
.sm-create-links{margin-top:28px}
.sm-create-links h3{margin:0 0 10px;color:var(--muted2);font:600 12px/1.3 var(--font);letter-spacing:.06em;text-transform:uppercase}
.sm-create-links>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.sm-create-link{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 14px;border:1px solid var(--border);border-radius:14px;background:var(--surface);color:var(--text);font:500 14px/1.2 var(--font);text-decoration:none}
.sm-create-link .ic{width:18px;height:18px;flex:none;color:var(--muted2)}
.sm-create-link:hover{border-color:var(--lima)}
.sm-create-link:focus-visible{outline:2px solid var(--lima);outline-offset:2px}
.sm-create-dialog button:focus-visible{outline:2px solid var(--lima);outline-offset:3px}
@media(max-width:360px){.sm-create-dialog{padding-inline:16px}.sm-create-choice{gap:12px;padding:12px}.sm-create-choice>img,.sm-choice-art{width:58px;height:74px}.sm-create-choice b{font-size:15px}}
@media(max-width:900px){
 body.studio-workbench{--sm-top:60px;--sm-bottom:76px;--sm-cta:82px;--sm-gap:16px;--side:0px;min-height:100dvh;overflow-x:clip}
 body.studio-workbench .app{display:block;min-height:100dvh}
 body.studio-workbench .main{width:100%;margin:0;overflow:visible;padding-top:calc(var(--sm-top) + env(safe-area-inset-top,0px));padding-bottom:calc(var(--sm-bottom) + env(safe-area-inset-bottom,0px))}
 body.studio-workbench .main>.mobbtn{display:none!important}
 body.studio-workbench .side{position:fixed!important;inset:0 0 0 auto;width:min(320px,88vw)!important;height:100dvh;padding:20px 16px max(20px,env(safe-area-inset-bottom));z-index:160;transform:translateX(105%)!important;visibility:hidden;box-shadow:none;transition:transform .2s,visibility .2s}
 body.studio-workbench .side.open{transform:translateX(0)!important;visibility:visible;box-shadow:0 0 0 100vmax var(--studio-overlay)}
 body.studio-workbench .side>.top{padding:6px 4px 20px}
 body.studio-workbench .side #toolnav{margin-top:8px}
 body.studio-workbench .side .studio-session-switch{margin-bottom:16px}
 body.studio-workbench .side .foot{margin-top:auto}
 .sm-header{position:fixed;inset:0 0 auto;z-index:70;display:flex;align-items:center;gap:10px;height:calc(var(--sm-top) + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) 16px 0;background:var(--bg);border-bottom:1px solid var(--border)}
 .sm-brand{flex:none;display:block;font-size:18px;font-weight:750;letter-spacing:-.05em}
 .sm-brand .o-viva{color:var(--lima);font-style:normal}
 .sm-header button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;border-radius:12px;font:600 12px var(--font)}
 .sm-header button.sm-brand{display:block;padding:0;font:750 18px var(--font);letter-spacing:-.05em}
 .sm-mode{min-width:0;margin-right:auto;padding:0 8px;color:var(--muted2)}
 .sm-mode span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .sm-mode .ic{width:13px;height:13px;flex:none}
 .sm-close{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;color:var(--text);background:var(--surface)}
 .sm-close .ic{width:18px;height:18px}
 .sm-nav{position:fixed;inset:auto 0 0;z-index:65;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;gap:3px;min-height:calc(var(--sm-bottom) + env(safe-area-inset-bottom,0px));padding:7px max(8px,calc((100vw - 600px)/2)) calc(7px + env(safe-area-inset-bottom,0px));background:var(--bg);border-top:1px solid var(--border)}
 .sm-nav a,.sm-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:54px;padding:3px 0;color:var(--muted);font:500 10px/1.15 var(--font);text-align:center;text-decoration:none;border-radius:12px}
 .sm-nav .ic{width:21px;height:21px;flex:none}
 .sm-nav [aria-current="page"]{color:var(--text)}
 .sm-nav [aria-current="page"]>.ic{color:var(--lima)}
 .sm-nav .sm-create{margin:0 4px;background:var(--lima);color:var(--tinta-sobre-verde);font-weight:650;border-radius:16px}
 .sm-create .ic{width:25px;height:25px}
 /* La insignia Beta del Agente va en la esquina: si cae debajo del texto,
    el botón crece a 73 px y sobresale de la barra inferior. */
 .sm-nav .sm-create{position:relative;gap:3px;min-height:48px}
 .sm-nav .sm-create .ic{width:21px;height:21px}
 .sm-nav .sm-create>.agente-beta{position:absolute;top:2px;right:2px;margin:0;padding:1px 3px;font-size:8px!important;line-height:1.1}
 /* Con Agente son seis botones: en teléfonos estrechos se compacta el texto
    para que ninguna etiqueta toque a la vecina. */
 /* A 320-370 px «Creaciones» (12 px) tocaba a «Precios»: texto algo menor. */
 @media(max-width:370px){body.studio-workbench .sm-nav span{font-size:10.5px!important}}
 @media(max-width:400px){
  html[data-agente-beta=si] .sm-nav{gap:1px;padding-inline:4px}
  html[data-agente-beta=si] .sm-nav span{font-size:10px!important}
  html[data-agente-beta=si] .sm-nav .sm-create{margin:0 2px}
 }
 @media(max-width:340px){html[data-agente-beta=si] .sm-nav span{font-size:9.5px!important}}
 body.studio-workbench:not(.experiencia-facil) #pg-home>.studio-wrap{padding:12px var(--sm-gap) 24px;max-width:640px;margin:auto}
 body.studio-workbench:not(.experiencia-facil) .studio-workhead{position:absolute;width:1px;height:1px;min-height:0;padding:0;margin:0;overflow:hidden;clip-path:inset(50%)}
 body.studio-workbench:not(.experiencia-facil) .studio-workhead button{display:none}
 body.studio-workbench:not(.experiencia-facil) #pg-home #title{font:600 18px/1.3 var(--font);letter-spacing:-.025em}
 body.studio-workbench .studio-jump{min-height:40px;padding:6px 9px;font-size:11px;border:1px solid var(--border);border-radius:10px;white-space:nowrap}
 body.studio-workbench:not(.experiencia-facil) .studio-workspace{display:block;align-items:stretch}
 body.studio-workbench:not(.experiencia-facil) .studio-editor-slot{position:static;width:100%;max-width:none;scroll-margin-top:80px}
 body.studio-workbench:not(.experiencia-facil) #mesa{position:static!important;inset:auto;width:100%;padding:0;margin:0;border:0;background:none;transform:none}
 body.studio-workbench:not(.experiencia-facil) #mesa .mesa-in{display:block;width:100%;padding:0;border:0;border-radius:0;max-height:none;overflow:visible;background:none;box-shadow:none!important;backdrop-filter:none}
 body.studio-workbench:not(.experiencia-facil) #mesa :is(.studio-editor-head,.mesa-top,.studio-field-heading){display:none}
 body.studio-workbench:not(.experiencia-facil) #mesa .composer{display:flex;flex-direction:column;gap:0;min-height:calc(100dvh - var(--sm-top) - var(--sm-bottom) - 24px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));padding:0;border:0;overflow:visible;background:none}
 body.studio-workbench:not(.experiencia-facil) #mesa #imageRefControls{order:1;gap:0;margin:0 0 16px}
 body.studio-workbench:not(.experiencia-facil) #mesa #addImageRefs{width:100%;min-height:118px;display:flex;flex-direction:column;justify-content:center;gap:12px;padding:18px 12px;background:var(--surface2);color:var(--muted2);border:1px dashed var(--border2);border-radius:17px;font-size:14px;font-weight:450}
 body.studio-workbench:not(.experiencia-facil) #mesa #addImageRefs>.ic{width:28px;height:28px;flex:none;color:var(--muted2)}
 body.studio-workbench:not(.experiencia-facil) #mesa #addImageRefs b{margin:0;font-size:11px;background:transparent;padding:0}
 body.studio-workbench:not(.experiencia-facil) #mesa .image-ref-hint{font-size:11px;margin-top:7px;line-height:1.5}
 body.studio-workbench:not(.experiencia-facil) #mesa #refgrid{order:1;gap:10px;display:flex;flex-wrap:wrap;margin:0 0 16px}
 body.studio-workbench:not(.experiencia-facil) #mesa #refgrid:empty{display:none}
 body.studio-workbench:not(.experiencia-facil) #mesa #refgrid .refwrap{flex:1 1 42%;min-width:0}
 body.studio-workbench:not(.experiencia-facil) #mesa #refgrid .refbox{width:100%;min-height:112px;display:flex;flex-direction:column;justify-content:center;gap:12px;padding:18px 10px;background:var(--surface2);border:1px dashed var(--border2);border-radius:17px;color:var(--muted2);font-size:13px;text-align:center;white-space:normal}
 body.studio-workbench:not(.experiencia-facil) #mesa #refgrid .refbox>.ic{width:26px;height:26px;flex:none;color:var(--muted2)}
 body.studio-workbench:not(.experiencia-facil) #mesa #attrow{order:2;margin:0 0 12px!important;padding:0 0 5px}
 body.studio-workbench:not(.experiencia-facil) #mesa #ta{order:3;width:100%;min-height:146px;max-height:28dvh;padding:17px 16px;margin:0;background:var(--surface2)!important;border:1px solid var(--border)!important;border-bottom:0!important;border-radius:17px 17px 0 0;font-size:16px;line-height:1.6;box-shadow:none;scroll-margin-top:80px}
 body.studio-workbench:not(.experiencia-facil) #mesa #ta:focus{box-shadow:none;outline:0}
 body.studio-workbench:not(.experiencia-facil) #mesa #ta:focus-visible{outline:2px solid var(--studio-accent);outline-offset:2px}
 body.studio-workbench:not(.experiencia-facil) #mesa #parambar{order:4;display:flex!important;flex-wrap:wrap;align-items:center;gap:8px;padding:0 0 12px;margin:0;min-width:0}
 body.studio-workbench:not(.experiencia-facil) #mesa #parambar>.lbl{display:none}
 body.studio-workbench:not(.experiencia-facil) #mesa #parambar>.param[data-pop="model"]{display:flex;flex:0 0 100%;justify-content:flex-end;gap:8px;width:100%;margin:0 0 18px;padding:12px 16px;min-height:54px;border:1px solid var(--border);border-top:0;border-radius:0 0 17px 17px;background:var(--surface2);font-size:13px;box-shadow:none}
 body.studio-workbench:not(.experiencia-facil) #mesa #parambar>.param[data-pop="model"]::before{content:attr(data-sm-label);margin-right:auto;font-size:12px;font-weight:450;color:var(--muted)}
 body.studio-workbench:not(.experiencia-facil) #mesa #parambar>.param[data-pop="model"]>.tile{width:20px;height:20px;flex:none}
 body.studio-workbench:not(.experiencia-facil) #mesa #parambar .param{min-height:44px;width:auto;max-width:100%;padding:10px 13px;border:1px solid var(--border);border-radius:24px;background:var(--surface2);font-size:13px;box-shadow:none;gap:6px}
 body.studio-workbench:not(.experiencia-facil) #mesa .param .car{margin-left:3px}
 body.studio-workbench:not(.experiencia-facil) #mesa #parambar>.cost{width:100%;padding:4px 2px;margin:0;min-height:30px;font-size:12px}
 body.studio-workbench:not(.experiencia-facil) #mesa #omniLimits{flex:0 0 100%;font-size:11px!important;line-height:1.55!important}
 body.studio-workbench:not(.experiencia-facil) #mesa #refQuoteStatus{order:5;font-size:12px;line-height:1.5;margin:6px 0 14px;overflow-wrap:anywhere}
 body.studio-workbench:not(.experiencia-facil) #mesa #headicons{order:10;position:sticky;bottom:calc(var(--sm-bottom) + env(safe-area-inset-bottom,0px));z-index:40;display:flex;width:100%;padding:12px 0;margin-top:auto;background:var(--bg)}
 body.studio-workbench:not(.experiencia-facil)[data-studio-mode="image"] #mesa #headicons{position:static;inset:auto;z-index:auto}
 body.studio-workbench:not(.experiencia-facil) #mesa #headicons .roundbtn{display:flex;width:100%;min-height:52px;height:auto;justify-content:center;gap:9px;padding:14px 18px;font-size:15px;border-radius:13px;background:var(--lima);color:var(--tinta-sobre-verde);box-shadow:none}
 body.studio-workbench #mesa .studio-floating{max-width:calc(100vw - 24px);border-radius:17px;background:var(--surface2)}
 body.studio-workbench #mesa .studio-floating .opt{min-height:48px;font-size:14px}
 body.studio-workbench #mesa .studio-floating button{min-height:48px;font-size:14px}
 body.studio-workbench:not(.experiencia-facil) .studio-results{width:100%;min-width:0;margin-top:24px;padding-top:16px;border-top:1px solid var(--border);scroll-margin-top:76px}
 body.studio-workbench .histbar{flex-wrap:wrap;gap:10px}
 body.studio-workbench .histview{min-height:44px}
 body.studio-workbench .jobgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}
 body.studio-workbench .jobcard{min-width:0;border-radius:14px}
 body.studio-workbench .jobfila{grid-template-columns:88px minmax(0,1fr);grid-template-areas:"media cuerpo" "acciones cuerpo";grid-template-rows:auto 1fr;gap:10px}
 body.studio-workbench .jobfila .jr-acc{flex-direction:row;gap:6px}
 body.studio-workbench .jobfila .jr-prompt{font-size:13px}
 body.studio-workbench #pg-library{padding:20px 16px 24px}
 body.studio-workbench .bv-rejilla{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px}
 body.studio-workbench .bv-seg{min-height:44px}
 body.studio-workbench .bv-busca{font-size:16px}
 body.studio-workbench .bv-segs{overflow-x:auto;justify-content:flex-start;scrollbar-width:none}
 body.studio-workbench .bv-seg{flex:none}
 /* Selectores y cuenta: panel inferior que cabe entre los bordes seguros. */
 body.studio-workbench #modal{align-items:flex-end;padding:0;background:var(--studio-overlay);z-index:200}
 body.studio-workbench #modal .mbox{width:100%;max-width:640px;max-height:calc(100dvh - 72px);margin:0 auto;border-radius:22px 22px 0 0;overflow:hidden;border:1px solid var(--border2);padding-bottom:env(safe-area-inset-bottom,0px)}
 body.studio-workbench #modal .studio-model-head{padding:22px 18px 16px}
 body.studio-workbench #modal .studio-model-head h2{font-size:20px}
 body.studio-workbench #modal .studio-model-head .studio-eyebrow{display:none}
 body.studio-workbench #modal .mtop{padding:0 16px 14px}
 body.studio-workbench #msearch{font-size:16px;min-height:46px}
 body.studio-workbench #modal .mbody{padding:0 10px 20px;overflow:auto}
 body.studio-workbench #modal .mrow{padding:15px 10px;min-height:72px;border:0;border-bottom:1px solid var(--border);border-radius:0;gap:12px}
 body.studio-workbench #modal .mrow .logo{width:38px;height:38px;flex:none;border-radius:11px}
 body.studio-workbench #modal .mrow .nm{font-size:14px}
 body.studio-workbench #modal .mrow .ds{font-size:12px;line-height:1.45;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
 body.studio-workbench #modal .mrow .spec{font-size:9px;padding:2px 5px;line-height:1.5}
 body.studio-workbench #modal .mrow.sel{background:var(--studio-active);border-radius:12px}
 body.studio-workbench #modal .xclose{min-width:44px;min-height:44px}
 body.studio-workbench :is(#accmenu,#submenu){position:fixed!important;left:12px!important;right:12px;bottom:calc(var(--sm-bottom) + 10px + env(safe-area-inset-bottom,0px));width:auto;max-width:none;max-height:calc(100dvh - 170px);z-index:190}
 body.studio-workbench #submenu{z-index:191}
 body.studio-workbench .accmenu :is(a,button).mi{min-height:46px;font-size:13px}
 body.studio-workbench .studio-settings{width:100%;max-width:640px;max-height:calc(100dvh - 30px);margin:auto auto 0;border-radius:22px 22px 0 0;padding-bottom:max(22px,env(safe-area-inset-bottom))}
 body.studio-workbench .studio-settings-heading .iconbtn{width:44px;height:44px}
 body.studio-workbench .studio-settings select{font-size:16px}
 body.studio-workbench #payModal{padding:0;align-items:flex-end;z-index:210}
 body.studio-workbench #payModal .pay-dialog{width:100%;max-height:calc(100dvh - 30px);border-radius:22px 22px 0 0;padding-bottom:max(20px,env(safe-area-inset-bottom))}
 body.studio-workbench :is(.bv-modal,.vz-modal,.libmodal){max-width:100vw}
 body.studio-workbench #vzModal{align-items:flex-end;padding:0}
 body.studio-workbench #vzModal .vz-caja{width:100%;max-width:640px;max-height:calc(100dvh - 72px);border-radius:22px 22px 0 0;padding-bottom:env(safe-area-inset-bottom,0px);box-shadow:none}
 body.studio-workbench #vzModal .vz-top{padding:16px}
 body.studio-workbench #vzModal .vz-top b{font:600 20px var(--font)}
 body.studio-workbench #vzModal .vz-x{width:44px;height:44px;flex:none}
 body.studio-workbench #vzModal .vz-busca{min-height:46px}
 body.studio-workbench #vzModal .vz-busca input{font-size:16px}
 body.studio-workbench #vzModal .vz-fila{min-height:64px}
 body.studio-workbench .jobfila .jr-med{width:100%}
 body.studio-workbench #bvVisor .bv-vtop .bv-b{min-width:44px;min-height:44px}
 /* El centro Crear usa los mismos flujos y la disponibilidad del servidor. */
 body.studio-workbench .studio-tools-menu{position:fixed!important;inset:0!important;z-index:180;width:100%!important;max-width:none;max-height:100dvh;padding:calc(20px + env(safe-area-inset-top,0px)) 16px calc(30px + env(safe-area-inset-bottom,0px));border:0;border-radius:0;background:var(--bg);box-shadow:none}
 .studio-tools-menu .studio-tools-heading{position:sticky;top:-20px;z-index:3;background:var(--bg);padding:4px 0 15px;margin:0}
 .studio-tools-menu .studio-tools-heading h2{font-size:25px}
 .studio-tools-menu .studio-tools-heading p{display:none}
 .sm-hub-filters{display:flex;gap:8px;overflow-x:auto;padding:0 0 20px;scrollbar-width:none}
 .sm-hub-filters button{min-height:40px;padding:10px 17px;border-radius:24px;font:500 13px var(--font);color:var(--muted2);white-space:nowrap}
 .sm-hub-filters button[aria-pressed="true"]{color:var(--bg);background:var(--text)}
 .sm-hub-modes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:22px}
 .sm-hub-card{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:0;gap:7px;text-align:left}
 .sm-hub-card[hidden]{display:none}
 .sm-hub-card>img,.sm-hub-art{width:100%;aspect-ratio:1.35;object-fit:cover;border-radius:15px;background:var(--surface2)}
 .sm-hub-card b{font-size:14px;font-weight:650;padding:3px 2px 0}
 .sm-hub-card small{font-size:12px;line-height:1.5;color:var(--muted);padding:0 2px}
 .sm-hub-art{display:grid;place-items:center;color:var(--lima);background:radial-gradient(ellipse at center,var(--studio-active),var(--surface2))}
 .sm-hub-art .ic{width:54px;height:54px}
 body.studio-workbench .studio-tools-menu [data-tools-list]{display:block}
 body.studio-workbench .studio-tools-group[hidden]{display:none}
 body.studio-workbench .studio-tools-group h3{margin:16px 0 8px}
 body.studio-workbench .studio-tools-group button{min-height:92px;padding:15px 12px;background:var(--surface);border:1px solid var(--border);border-radius:14px;margin-bottom:10px}
 body.studio-workbench .studio-tools-group button b{font-size:14px}
 body.studio-workbench .studio-tools-group button small{font-size:12px}
 body.studio-workbench .studio-tools-group button em{font-size:11px}
 .sm-panel-close{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--surface2);margin-left:auto;flex:none}
 body.studio-workbench .studio-tool-guide{margin:4px 0 20px;padding:16px;scroll-margin-top:76px}
 /* Audio conserva voz, idioma, velocidad y ajustes avanzados. */
 body.studio-workbench.modo-audio #mesa .composer{min-height:0}
 body.studio-workbench.modo-audio #mesa #ta{order:initial;border-radius:16px;border:1px solid var(--border)!important;margin:10px 0 16px;min-height:150px}
 body.studio-workbench.modo-audio #mesa #parambar{order:initial;padding:0;gap:10px}
 body.studio-workbench.modo-audio #mesa #parambar>.param[data-pop="model"]{border:1px solid var(--border);border-radius:14px;margin:0 0 12px}
 body.studio-workbench.modo-audio #mesa .ap-voz{min-height:148px;border-radius:17px;margin-bottom:14px}
 body.studio-workbench.modo-audio #mesa .ap-fila{min-height:48px;font-size:13px}
 body.studio-workbench.modo-audio #mesa .ap-gen{position:sticky;bottom:calc(var(--sm-bottom) + env(safe-area-inset-bottom,0px));z-index:40;min-height:52px;border-radius:13px;margin-top:18px;font-size:15px}
 body.studio-workbench.modo-audio #mesa .ap-idioma select{font-size:16px;max-width:100%}
 body.studio-workbench.modo-audio #mesa #headicons{display:none}
 body.studio-workbench.sm-keyboard .sm-nav{display:none}
 body.studio-workbench.sm-keyboard #mesa #headicons,body.studio-workbench.sm-keyboard #mesa .ap-gen{position:static}
 body.studio-workbench.sm-panel-open{overflow:hidden}
 @media(max-width:359px){
  body.studio-workbench{--sm-gap:12px}
  .sm-header{padding-inline:12px;gap:4px}.sm-header button.sm-brand{font-size:16px}.sm-mode{font-size:11px!important;padding-inline:5px}
  body.studio-workbench:not(.experiencia-facil) #pg-home #title{font-size:16px}
  body.studio-workbench .studio-jump{font-size:10px;padding-inline:7px}
  .sm-nav a,.sm-nav button{font-size:9px}
 }
 @media(prefers-reduced-motion:reduce){body.studio-workbench .side{transition:none}}
}

/* Con una hoja a pantalla completa abierta (modelos, visor, biblioteca,
   recarga) la burbuja de Ayuda tapaba precios y botones de esa hoja. */
body.studio-workbench:has(#bvVisor.on,.modal.on,.bibmodal.on,.vz-modal.on) #cocuyo-chat-raiz .cchat-btn{display:none}
/* Al moverse con teclado o al llevar un campo a la vista, nada queda debajo
   de la cabecera ni de la barra inferior fijas. */
@media(max-width:900px){html:has(body.studio-workbench){scroll-padding-top:76px;scroll-padding-bottom:92px}}

/* =====================================================================
   COMPOSITOR MÓVIL «ESTILO HERRAMIENTA» (octubre 2026)
   Solo en móvil (900 px o menos) y solo mientras se crea: estudio-movil.js
   pone la clase body.sm-herramienta (no en Creaciones, ni en Explorar, ni en
   la experiencia fácil). El escritorio no cambia.
   Pauta de Imagen y Video, de arriba abajo:
     1. Cabecera de 48 px: marca COCUYO, «Crear imagen ⌄» (cambia de modo y
        lleva a Apps, Útiles, Conectores, Comunidad y Precios) y una X que
        vuelve a Explorar. La barra pública de arriba se oculta.
     2. Subida de referencias grande arriba.
     3. Una tarjeta con la descripción y la fila «Modelo».
     4. Ajustes en píldoras de 44 px pegados a un Generar grande, FIJO abajo,
        con el coste dentro, justo encima de la barra inferior de siempre
        (Proyectos · Apps · Creaciones · Precios · Cuenta). El hueco que ocupan
        lo mide estudio-movil.js (--sm-navh, --sm-generar y --sm-dock) para que
        nunca tapen nada. Con el teclado abierto, o con el teléfono apaisado,
        vuelven a su sitio dentro del formulario.
   Audio: solo cambia la cabecera; su formulario queda como estaba.
   Todas las reglas llevan «#pg-home #mesa» para ganar a las hojas que se
   cargan después sin tener que editarlas. Colores: solo tokens.
   ===================================================================== */
@media(max-width:900px){
 /* --- 1. Cabecera (los tres modos) ----------------------------------- */
 html body.studio-workbench.sm-herramienta{--sm-top:48px;--st-top:calc(48px + env(safe-area-inset-top,0px))}
 html body.studio-workbench.sm-herramienta .studio-public-nav{display:none!important}
 /* Misma familia que la cabecera pública (.f-cabecera): vidrio oscuro,
    línea fina abajo y el wordmark con las dos O encendidas. Respeta la zona
    segura de los lados (iPhone apaisado con isla o muesca). */
 html body.studio-workbench.sm-herramienta .sm-header{display:flex!important;align-items:center;gap:12px;height:calc(48px + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) 0 0;padding-inline:max(16px,env(safe-area-inset-left,0px)) max(8px,env(safe-area-inset-right,0px));background:var(--f-vidrio);-webkit-backdrop-filter:var(--vidrio);backdrop-filter:var(--vidrio);border-bottom:0;box-shadow:0 1px 0 var(--f-linea)}
 /* Como Higgsfield (dueño, 6-oct-2026): en el compositor la cabecera no repite
    la marca; manda directamente la herramienta («Crear imagen ⌄», «Crear video ⌄»,
    «Crear audio ⌄»), que abre el cambio de modo. La X sigue volviendo a Explorar.
    El botón de la marca se queda en el DOM (accesibilidad y escritorio), oculto aquí. */
 html body.studio-workbench.sm-herramienta .sm-header button.sm-brand{display:none}
 html body.studio-workbench.sm-herramienta .sm-header .sm-mode{position:relative;min-width:0;min-height:44px;margin-inline-end:auto;padding:0;padding-inline:0 6px;font:650 17px/1.2 var(--fuente);letter-spacing:-.01em;color:var(--f-texto)}
 html body.studio-workbench.sm-herramienta .sm-header .sm-mode .ic{width:14px;height:14px;color:var(--f-texto-2)}
 /* La X: 44 × 44 de zona táctil (mínimo de accesibilidad). */
 html body.studio-workbench.sm-herramienta .sm-close{width:44px;height:44px;border-radius:var(--f-r-control);background:var(--f-sup-2);color:var(--f-texto)}
 html body.studio-workbench.sm-herramienta .sm-close:hover{background:var(--f-sup-3)}
 html body.studio-workbench.sm-herramienta .sm-header :is(button,a):focus-visible{outline:2px solid var(--f-lima);outline-offset:2px}
 html body.studio-workbench.sm-herramienta .main{padding-top:calc(48px + env(safe-area-inset-top,0px))}
 /* Aviso breve bajo la cabecera (borrador que no se pudo guardar). */
 html body.studio-workbench.sm-herramienta .sm-aviso:not([hidden]){position:fixed;top:calc(56px + env(safe-area-inset-top,0px));left:16px;right:16px;z-index:70;margin:0;padding:12px 14px;border:1px solid var(--f-linea-fuerte);border-radius:var(--f-r-control);background:var(--f-sup-2);color:var(--f-texto);font:500 14px/1.4 var(--fuente)}

 /* --- Imagen y Video: el resto de la pauta (Audio no cambia) ----------- */
 /* Al final de la página se reserva el alto de Generar + ajustes + barra
    inferior. En tabletas todo se centra a 640 px. */
 html body.studio-workbench.sm-herramienta:not(.modo-audio) .main{padding-bottom:0}
 html body.studio-workbench.sm-herramienta:not(.experiencia-facil):not(.modo-audio) #pg-home.page>.studio-wrap{max-width:640px;margin:0 auto;padding:16px 16px calc(var(--sm-dock,220px) + 24px)}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home .studio-workspace{display:flex!important;flex-direction:column;gap:16px}
 /* «Esperando para crear» y los resultados van debajo de la tarjeta. */
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #studioResults{order:2!important}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #studioResults:is(:has(.ej-waiting),:has(.studio-image-welcome)){margin:0;padding:0;border:0}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home .studio-results-empty.ej-waiting{min-height:clamp(120px,20dvh,200px)}

 /* Lienzo: sin la caja exterior del compositor. */
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa .mesa-in{padding:0;border:0;border-radius:0;background:none;box-shadow:none!important}
 /* El compositor (y con él Generar fijo) se pinta por encima de los
    resultados: si no, las luces de «Esperando para crear» asomaban encima. */
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa .mesa-in{position:relative;z-index:3}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa .composer{display:flex;flex-direction:column;gap:0;min-height:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none!important}

 /* --- 2. Subida grande arriba (Imagen) ------------------------------- */
 html body.studio-workbench.sm-herramienta #pg-home #mesa #imageReferenceTray{order:1;display:flex;flex-wrap:wrap;gap:8px;width:100%;margin:0 0 12px}
 html body.studio-workbench.sm-herramienta #pg-home #mesa #imageReferenceTray:not(:has(.attchip)) #imageRefControls{flex:1 1 100%;width:100%;margin:0}
 html body.studio-workbench.sm-herramienta #pg-home #mesa #imageReferenceTray:not(:has(.attchip)) #addImageRefs{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;height:auto;min-height:120px;padding:18px 12px;border:1px dashed var(--f-linea-fuerte);border-radius:var(--f-r-tarjeta);background:var(--f-sup-1);color:var(--f-texto-2);font:500 14px/1.35 var(--fuente);box-shadow:none}
 html body.studio-workbench.sm-herramienta #pg-home #mesa #imageReferenceTray:not(:has(.attchip)) #imageRefIcons{width:44px;height:44px}
 /* El texto «Añadir referencias 0/16» vuelve a verse en la caja grande. */
 html body.studio-workbench.sm-herramienta #pg-home #mesa #imageReferenceTray:not(:has(.attchip)) :is(#imageRefLabel,#imageRefCount){position:static!important;width:auto!important;height:auto!important;margin:0!important;padding:0!important;border:0!important;overflow:visible;clip-path:none;white-space:normal;background:none}
 html body.studio-workbench.sm-herramienta #pg-home #mesa #imageReferenceTray:not(:has(.attchip)) #imageRefCount{font-size:12px;font-weight:400;color:var(--f-texto-3)}
 /* Con miniaturas adjuntas, «+» pasa a ser un cuadrado más del mismo tamaño. */
 html body.studio-workbench.sm-herramienta #pg-home #mesa #imageReferenceTray:has(.attchip) #imageRefControls{flex:0 0 64px;width:64px}
 html body.studio-workbench.sm-herramienta #pg-home #mesa #imageReferenceTray:has(.attchip) #addImageRefs{width:64px;height:64px;min-height:64px;border-radius:12px}
 /* Video: fotogramas / referencias, también grandes. */
 html body.studio-workbench.sm-herramienta #pg-home #mesa #refgrid{order:1;width:100%;margin:0 0 12px}
 html body.studio-workbench.sm-herramienta #pg-home #mesa #refgrid .refbox{min-height:112px;border:1px dashed var(--f-linea-fuerte);border-radius:var(--f-r-tarjeta);background:var(--f-sup-1)}
 /* Pestañas «Inicio / Final · Referencias»: 44 px de zona táctil. */
 html body.studio-workbench.sm-herramienta #pg-home #mesa .ref-mode-switch button{min-height:44px}

 /* --- 3. Tarjeta: descripción + acciones + fila Modelo --------------- */
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #ta{order:3;width:100%;min-height:132px;max-height:32dvh;margin:0;padding:16px 16px 8px;background:var(--f-sup-2)!important;border:1px solid var(--f-linea-fuerte)!important;border-bottom:0!important;border-radius:var(--f-r-tarjeta) var(--f-r-tarjeta) 0 0;font-size:16px;line-height:1.5;box-shadow:none}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #promptLimit:not([hidden]){order:4;margin:0;padding:0 16px 6px;background:var(--f-sup-2);border-inline:1px solid var(--f-linea-fuerte)}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #studioComposerActions{order:5;margin:0;padding:0 16px;gap:0 20px;background:var(--f-sup-2);border-inline:1px solid var(--f-linea-fuerte)}
 /* «Ayuda con el prompt» y «Mis referencias»: texto sencillo, 44 px de alto
    para el dedo. */
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #studioComposerActions :is(.prompt-help-trigger,.ckit-entry){min-height:44px;padding-inline:0;background:none;border:0}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa .sm-model-row:not([hidden]){order:6;display:flex;align-items:center;gap:10px;width:100%;min-height:56px;margin:0;padding:8px 14px 8px 16px;border:1px solid var(--f-linea-fuerte);border-radius:0 0 var(--f-r-tarjeta) var(--f-r-tarjeta);background:var(--f-sup-2);box-shadow:inset 0 1px 0 var(--f-linea);color:var(--f-texto);font:500 14px/1.2 var(--fuente);text-align:left;cursor:pointer}
 html body.studio-workbench.sm-herramienta #pg-home #mesa .sm-model-label{margin-right:auto;color:var(--f-texto-3);font-size:13px}
 html body.studio-workbench.sm-herramienta #pg-home #mesa .sm-model-value{display:flex;align-items:center;gap:8px;min-width:0}
 html body.studio-workbench.sm-herramienta #pg-home #mesa .sm-model-value>span:not(.mrcbox){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 html body.studio-workbench.sm-herramienta #pg-home #mesa .sm-model-value .mrcbox{flex:none;width:22px;height:22px}
 html body.studio-workbench.sm-herramienta #pg-home #mesa .sm-model-row>.ic{flex:none;width:16px;height:16px;color:var(--f-texto-2)}
 html body.studio-workbench.sm-herramienta #pg-home #mesa .sm-model-row:focus-visible{outline:2px solid var(--f-lima);outline-offset:2px}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #refQuoteStatus{order:7;margin:10px 0 0}

 /* --- 4. Ajustes + Generar fijos abajo (Imagen y Video) -------------- */
 /* #parambar se queda solo con las píldoras: el modelo ya está en la
    tarjeta, y el coste va dentro de Generar. Generar va justo encima de la
    barra inferior (--sm-navh) y las píldoras justo encima de Generar. */
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #parambar{position:fixed;left:0;right:0;top:auto;bottom:var(--sm-generar,150px);z-index:41;order:9;display:flex!important;flex-wrap:wrap;align-items:center;gap:8px;max-height:34dvh;overflow-y:auto;margin:0;padding:12px max(16px,calc(50vw - 304px)) 0;background:linear-gradient(to bottom,transparent,var(--bg) 12px)}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #parambar>:is(.lbl,.cost,.param[data-pop="model"]){display:none!important}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #parambar>div{flex:0 0 auto;min-width:0}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #parambar>:is(span,p):not(.lbl):not(.cost){order:-1;flex:1 1 100%;margin:0;font-size:12px;line-height:1.4}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #parambar .param:not([data-pop="model"]){flex:none;width:auto;min-width:0;height:44px;min-height:44px;padding:0 14px;gap:6px;border:1px solid var(--f-linea-fuerte);border-radius:var(--f-r-pill);background:var(--f-sup-2);color:var(--f-texto);font:600 14px/1 var(--fuente);box-shadow:none}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #parambar .param:not([data-pop="model"]):is(:hover,.open){background:var(--f-sup-3)}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #parambar .param .param-caption{font-weight:450;color:var(--f-texto-2)}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #headicons{position:fixed;left:0;right:0;top:auto;bottom:var(--sm-navh,calc(var(--sm-bottom) + env(safe-area-inset-bottom,0px)));z-index:42;order:10;display:flex;width:auto;margin:0;padding:8px max(16px,calc(50vw - 304px)) 10px;border:0;background:var(--bg)}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #headicons .roundbtn{width:100%;min-height:56px;height:auto;margin:0;padding:12px 18px;gap:10px;border-radius:var(--f-r-tarjeta);background:var(--lima);color:var(--tinta-sobre-verde);font:650 16px/1.2 var(--fuente);box-shadow:none}

 /* --- Teclado abierto: Generar y ajustes vuelven al formulario -------- */
 html body.studio-workbench.sm-herramienta.sm-keyboard:not(.modo-audio) #pg-home #mesa :is(#parambar,#headicons){position:static!important;max-height:none;overflow:visible;box-shadow:none}
 html body.studio-workbench.sm-herramienta.sm-keyboard:not(.modo-audio) #pg-home #mesa #parambar{padding:12px 0 0;background:none}
 html body.studio-workbench.sm-herramienta.sm-keyboard:not(.modo-audio) #pg-home #mesa #headicons{width:100%;padding:8px 0 0;background:none}

 @media(max-width:359px){
  html body.studio-workbench.sm-herramienta .sm-header{gap:8px;padding-inline:max(12px,env(safe-area-inset-left,0px)) max(6px,env(safe-area-inset-right,0px))}
  html body.studio-workbench.sm-herramienta .sm-header .sm-mode{font-size:16px!important;padding-inline-start:0}
 }
 /* Teléfonos estrechos: las píldoras caben en una sola fila. */
 @media(max-width:370px){
  html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #parambar{gap:6px}
  html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #parambar .param:not([data-pop="model"]){padding:0 10px;gap:4px;font-size:13px}
  html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #parambar .param .param-caption{display:none}
 }
}
/* Teléfono apaisado o pantalla muy baja: no hay alto para fijar Generar y
   ajustes sin tapar el formulario. Vuelven a su sitio, como con el teclado. */
@media(max-width:900px) and (max-height:500px){
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa :is(#parambar,#headicons){position:static!important;max-height:none;overflow:visible;box-shadow:none}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #parambar{padding:12px 0 0;background:none}
 html body.studio-workbench.sm-herramienta:not(.modo-audio) #pg-home #mesa #headicons{width:100%;padding:8px 0 0;background:none}
 html body.studio-workbench.sm-herramienta:not(.modo-audio):not(.experiencia-facil) #pg-home.page>.studio-wrap{padding-bottom:calc(var(--sm-bottom) + env(safe-area-inset-bottom,0px) + 24px)}
}
/* La burbuja de Ayuda sube por encima de Generar y de los ajustes (solo
   cuando están fijos; apaisado y teclado conservan su sitio de siempre). */
@media(max-width:900px) and (min-height:501px){
 html body.studio-workbench.sm-herramienta:not(.modo-audio):not(.sm-keyboard) #cocuyo-chat-raiz .cchat-btn{bottom:calc(var(--sm-dock,220px) + 12px)}
}
/* Crear del teléfono, con el carrusel de Apps a la vista: sin la burbuja de
   Ayuda, como en Conectores y Creaciones. Con sesión tapaba la tarjeta de la
   derecha («Post de Instagram» quedaba «P… Ins» a 390 y 430, y también
   «Banner de YouTube» a 360 y 375). Vuelve si hay una respuesta nueva (su
   punto avisa), con resultados (sin carrusel, encima de los ajustes) y en
   las pantallas; la ayuda sigue en Comunidad («Chat de ayuda») y en la cuenta. */
@media(max-width:900px){
 html body.studio-workbench.hf-movil.hf-crear:not(.hf-con-resultados):not([data-hf-pantalla]) #cocuyo-chat-raiz:not(.cchat-hay-nuevo) .cchat-btn{display:none!important}
}
/* Selector de la biblioteca («Elegir de mis creaciones»), en el móvil
   (auditoría crear-08, oct-2026): el buscador a 16 px para que el iPhone no
   amplíe la página al tocarlo, y la × y las pestañas con 44 px de alto. */
@media(max-width:900px){
 body.studio-workbench .bibbusca{font-size:16px}
 body.studio-workbench .bibx{width:44px;height:44px}
 body.studio-workbench .bibpest{min-height:44px}
}

/* Hoja de modelos del móvil (dueño, 8-oct-2026): «Crear imagen ⌄» la abre.
   Medidas de la de Higgsfield: hoja desde abajo con asa, esquinas de 24 px,
   filas de 64 px, logo de 48 px (SVG, nítido a cualquier escala), nombre
   14 px/500 y descripción 14 px en gris. Letra: la nuestra (Geist). */
.sm-sheet{box-sizing:border-box;position:fixed;inset:auto 0 0;margin:0 auto;width:min(560px,100vw);max-width:100vw;height:min(92dvh,780px);max-height:92dvh;padding:0 0 env(safe-area-inset-bottom,0px);border:0;border-radius:24px 24px 0 0;background:#121212;color:#f7f7f8;font:400 14px/1.15 var(--font);flex-direction:column;overflow:hidden;-webkit-font-smoothing:antialiased}
.sm-sheet[open]{display:flex;animation:sm-sheet-sube .26s cubic-bezier(.2,.8,.2,1)}
.sm-sheet::backdrop{background:rgba(0,0,0,.6)}
@keyframes sm-sheet-sube{from{transform:translateY(48px);opacity:.5}to{transform:none;opacity:1}}
.sm-sheet__asa{flex:none;width:36px;height:4px;margin:8px auto 0;border-radius:4px;background:#ffffff33}
.sm-sheet__cab{position:relative;flex:none;display:flex;align-items:center;justify-content:center;height:48px}
.sm-sheet__cab h2{margin:0;font:600 16px/24px var(--font);letter-spacing:-.01em;color:#f7f7f8}
.sm-sheet__cerrar{position:absolute;right:12px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:12px;background:#ffffff0f;color:#f7f7f8;cursor:pointer}
.sm-sheet__cerrar .ic{width:16px;height:16px}
.sm-sheet__buscar{flex:none;display:flex;align-items:center;gap:8px;height:40px;margin:4px 16px 4px;padding:0 12px;border-radius:12px;background:#ffffff0d;color:#828282}
.sm-sheet__buscar .ic{flex:none;width:16px;height:16px}
.sm-sheet__buscar input{flex:1;min-width:0;height:100%;border:0;background:transparent;color:#fff;font:400 16px var(--font);outline:none}
.sm-sheet__buscar input::placeholder{color:#828282}
.sm-sheet__buscar input::-webkit-search-cancel-button{display:none}
.sm-sheet__lista{flex:1;overflow:auto;overscroll-behavior:contain;padding:0 8px 16px}
.sm-sheet__grupo h3{display:flex;align-items:center;gap:8px;margin:16px 8px 4px;font:600 14px/20px var(--font);color:#f7f7f8}
.sm-sheet__grupo h3 .ic{width:16px;height:16px;color:#a3a3a3}
.sm-sheet ul{display:grid;gap:2px;margin:0;padding:0;list-style:none}
.sm-sheet__fila{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;padding:8px 16px 8px 8px;border:0;border-radius:16px;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.sm-sheet__fila:hover{background:#ffffff0a}
.sm-sheet__fila.is-sel{background:#ffffff12}
.sm-sheet__fila:focus-visible,.sm-sheet__cerrar:focus-visible{outline:2px solid var(--lima);outline-offset:-2px}
.sm-sheet__logo{flex:none;display:grid}
.sm-sheet__logo .mrcbox{display:grid;place-items:center;width:48px;height:48px;flex:0 0 48px;border-radius:12px}
.sm-sheet__logo .mrc{width:24px;height:24px}
.sm-sheet__txt{flex:1;display:grid;gap:4px;min-width:0}
.sm-sheet__nom{display:flex;align-items:center;gap:6px;min-width:0}
.sm-sheet__nom b{overflow:hidden;font-size:14px;font-weight:500;line-height:16px;color:#fff;white-space:nowrap;text-overflow:ellipsis}
.sm-sheet__chip{flex:none;padding:1px 5px;border-radius:5px;background:var(--lima);color:#111;font:700 9.5px/14px var(--font);letter-spacing:.02em;text-transform:uppercase}
.sm-sheet__chip[data-tipo="top"]{background:#2f6fed;color:#fff}
.sm-sheet__txt small{overflow:hidden;font-size:14px;line-height:16px;color:#828282;white-space:nowrap;text-overflow:ellipsis}
.sm-sheet__ok{flex:none;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--lima);color:#111}
.sm-sheet__ok svg{width:12px;height:12px}
.sm-sheet__vacio{margin:4px 8px 8px;color:#828282;font-size:13px;line-height:1.4}
@media(prefers-reduced-motion:reduce){.sm-sheet[open]{animation:none}}

/* ============ Estudio móvil estilo Higgsfield (dueño, 8-oct-2026) ============
   Clon fiel de la app nueva de Higgsfield; medidas tomadas de su web móvil.
   El módulo es assets/js/estudio-movil-hf.js. hf-movil = teléfono;
   hf-crear = cuadro de crear (imagen y video). */
.hf-menu,.hf-mejorar,.hf-hero,.hf-fila-cuadro,.hf-debajo,.hf-carrusel,.hf-minis{display:none}
@media(max-width:900px){
 html body.studio-workbench.hf-movil{--hf-lima:#d1fe17;--hf-brillo:#ffff14;--hf-labio:#829b19;--hf-gris:#898a8b;--hf-tarjeta:#1c1e21;--hf-lienzo:#0b0b0b;--st-top:calc(56px + env(safe-area-inset-top,0px))!important;--sm-top:var(--st-top)!important;--sm-navh:0px!important;--sm-dock:0px!important;--sm-generar:0px!important;background:#0b0b0b}
 /* Peso extra (:not(#hf)) frente a las reglas antiguas del compositor móvil. */
 /* Cabecera: ☰ a la izquierda y «Mejorar» a la derecha; nada más. */
 html body.studio-workbench.hf-movil .sm-header{display:flex!important;align-items:center;justify-content:space-between;gap:12px;height:var(--st-top);padding:env(safe-area-inset-top,0px) 9px 0 10px!important;border:0!important;background:#0b0b0b!important;box-shadow:none!important}
 html body.studio-workbench.hf-movil .sm-header>:not(.hf-menu):not(.hf-mejorar){display:none!important}
 html body.studio-workbench.hf-movil .hf-menu{display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:8px;background:transparent;color:#828282;cursor:pointer}
 html body.studio-workbench.hf-movil .hf-menu .ic{width:20px;height:20px}
 html body.studio-workbench.hf-movil .hf-mejorar{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 12px;border-radius:999px;background:var(--hf-lima);color:#1a1a1a;font:500 12px/16px var(--font);text-decoration:none;white-space:nowrap}
 .hf-mejorar .ic{width:14px;height:14px}
 :is(.hf-menu,.hf-mejorar):focus-visible{outline:2px solid var(--hf-lima);outline-offset:2px}
 /* Sin barra de abajo en el Estudio: se navega con el menú lateral. */
 html body.studio-workbench.hf-movil .cy-barra{display:none!important}

 /* ---- Crear: logo, título y un solo cuadro, centrados; Apps abajo ---- */
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa{display:flex;flex-direction:column;min-height:calc(100dvh - var(--st-top));margin:0!important;padding:0!important;background:transparent!important}
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa .mesa-in{flex:1;display:flex;flex-direction:column;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa .mesa-in::before,html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa .mesa-in::after{display:none!important}
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa :is(#parambar,#headicons,.sm-model-row,#refQuoteStatus){display:none!important}
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa :is(#imageReferenceTray,#studioComposerActions){display:none!important}
 html body.studio-workbench.hf-crear:not(.hf-con-resultados) #studioResults{display:none!important}
 html body.studio-workbench.hf-crear .hf-hero{display:flex;flex-direction:column;align-items:center;gap:16px;margin:auto 16px 24px;text-align:center}
 /* h2 (el h1 es el de la cabecera): con el peso y el espaciado que tenía de h1, por encima de la regla general de h2 del Estudio */
 html body.studio-workbench.hf-crear:not(#hf) .hf-hero h2{margin:0;font:500 20px/24px var(--font);letter-spacing:-.025em;color:#fff}
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa .composer{position:relative;display:flex!important;flex-direction:column;gap:0!important;min-height:100px;margin:0 16px!important;padding:12px 0 0!important;border:0!important;border-radius:24px!important;background:rgba(255,255,255,.1)!important;box-shadow:0 2px 8px rgba(0,0,0,.16)!important}
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa #ta{order:1!important;min-height:24px!important;max-height:40dvh;overflow:auto;margin:0!important;padding:0 12px!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:#fff!important;font:400 16px/24px var(--font)!important}
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa .hf-fila-cuadro{order:2!important;display:flex;align-items:center;gap:4px;padding:8px}
 .hf-redondo{position:relative;display:grid;place-items:center;flex:none;width:36px;height:36px;padding:0;border:0;border-radius:999px;background:rgba(255,255,255,.05);color:#fff;cursor:pointer}
 .hf-redondo .ic{width:18px;height:18px}
 .hf-cuenta-refs{position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--hf-lima);color:#111;font:600 10px/16px var(--font)}
 .hf-cuenta-refs[hidden]{display:none}
 .hf-chip-modelo{display:inline-flex;align-items:center;gap:6px;min-width:0;height:36px;padding:6px 8px 6px 12px;border:0;border-radius:999px;background:rgba(255,255,255,.05);color:#fff;font:500 14px/16px var(--font);cursor:pointer}
 .hf-chip-modelo__logo{display:grid;place-items:center;flex:none}
 .hf-chip-modelo__logo :is(.mrcbox,.tile){display:grid;place-items:center;width:16px!important;height:16px!important;flex:0 0 16px!important;padding:0!important;border:0!important;border-radius:4px!important;background:none!important;box-shadow:none!important}
 .hf-chip-modelo__logo .mrc{width:16px!important;height:16px!important}
 .hf-chip-modelo__txt{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
 .hf-generar{display:inline-flex;align-items:center;gap:4px;flex:none;height:36px;margin-left:auto;padding:0 12px 0 10px;border:0;border-radius:999px;background:var(--hf-lima);color:#000;font:500 16px/24px var(--font);cursor:pointer}
 .hf-generar .ic{width:16px;height:16px}
 .hf-generar:disabled{opacity:.45;cursor:default}
 .hf-generar.is-ocupado .ic{animation:hf-gira 1s linear infinite}
 @keyframes hf-gira{to{transform:rotate(360deg)}}
 :is(.hf-redondo,.hf-chip-modelo,.hf-generar,.hf-pildora,.hf-tarjeta):focus-visible{outline:2px solid var(--hf-lima);outline-offset:2px}
 html body.studio-workbench.hf-crear .hf-debajo{display:flex;justify-content:center;margin:32px 16px auto}
 .hf-pildora{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 12px 0 14px;border:1px solid rgba(255,255,255,.05);border-radius:999px;background:rgba(35,35,35,.6);color:#fff;font:500 14px/18px var(--font);text-decoration:none}
 .hf-pildora .ic{width:16px;height:16px;color:#a3a3a3}
 .hf-pildora b{font-weight:500;color:var(--hf-lima)}
 /* Carrusel de Crear (como el de Higgsfield): 144×144 las dos Apps y 112×144
    los accesos (.hf-tarjeta--alta), encajando tarjeta a tarjeta; el nombre
    debajo, fuera de la imagen, y una etiqueta inclinada solo si hay dato.
    Llega a los bordes de la pantalla también en tableta (hasta 900 px, con la
    columna de 640 del Estudio y su margen de 16): --hf-sangria es lo que hay
    del borde de la columna al de la pantalla (16 en el teléfono), así la 1.ª
    tarjeta sigue alineada con la columna y la última no se corta en seco a
    media pantalla. */
 html body.studio-workbench.hf-crear .hf-carrusel{--hf-sangria:calc(16px + max(0px,(100vw - 640px) / 2));display:flex;align-items:flex-start;gap:10px;margin-inline:calc(var(--hf-sangria) * -1);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--hf-sangria) 16px;padding:24px 16px calc(20px + env(safe-area-inset-bottom,0px));padding-inline-start:var(--hf-sangria);scrollbar-width:none}
 .hf-carrusel::-webkit-scrollbar{display:none}
 /* Con una pantalla encima (Explorar, Apps…), el carrusel no se ve: sus vídeos se paran. */
 html body.studio-workbench.hf-movil[data-hf-pantalla] .hf-carrusel{display:none!important}
 .hf-tarjeta{flex:0 0 144px;display:grid;align-content:start;gap:12px;min-width:0;padding:0;border:0;background:none;color:#fff;text-align:start;font:400 14px/18px var(--font);scroll-snap-align:start;cursor:pointer;-webkit-tap-highlight-color:transparent}
 .hf-tarjeta--alta{flex-basis:112px}
 .hf-tarjeta__img{position:relative;display:block;box-sizing:border-box;aspect-ratio:1;overflow:hidden;border:1px solid rgb(255 255 255/.05);border-radius:12px;background:var(--hf-tarjeta);transition:transform .2s cubic-bezier(.4,0,.2,1)}
 .hf-tarjeta--alta .hf-tarjeta__img{aspect-ratio:112/144}
 .hf-tarjeta:active .hf-tarjeta__img{transform:scale(.97)}
 .hf-tarjeta__img>:is(img,video){display:block;width:100%;height:100%;object-fit:cover}
 /* Etiqueta: TENDENCIA (lima), NUEVO (azul) o CONECTOR (rosa), inclinada como las de Higgsfield. */
 .hf-etiqueta{position:absolute;top:10px;inset-inline-start:7px;z-index:2;box-sizing:border-box;max-width:calc(100% - 14px);height:15px;padding:0 6px;overflow-x:clip;border-radius:2px;color:#fff;font:italic 800 11px/15px var(--font);letter-spacing:.01em;text-transform:uppercase;text-overflow:ellipsis;white-space:nowrap;transform:skewX(-10.7deg)}
 [dir="rtl"] .hf-etiqueta{transform:skewX(10.7deg)}
 /* Vietnamita: Geist junta el circunflejo y el agudo de Ế/Ố en una sola rayita
    (en cualquier grosor, recta o no): letra del sistema, que los apila bien,
    recta (la etiqueta ya va inclinada) y con sitio arriba para los dos acentos. */
 :lang(vi) .hf-etiqueta{height:auto;font:normal 700 11px/18px system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",Arial,sans-serif}
 /* Tailandés, hindi y bengalí: sus signos de arriba (y abajo) no caben en 15 px. */
 :is(:lang(th),:lang(hi),:lang(bn)) .hf-etiqueta{height:auto;line-height:20px}
 .hf-etiqueta--tendencia{background:var(--hf-lima);color:#1a1a1a}
 .hf-etiqueta--nuevo{background:radial-gradient(39% 137% at 52% 117%,rgb(79 201 220) 0%,rgb(50 96 240) 100%)}
 .hf-etiqueta--conector{background:radial-gradient(39% 137% at 52% 117%,rgb(238 69 150) 0%,rgb(214 24 110) 100%)}
 /* En ChatGPT y Claude: cielo negro con unas estrellas y los dos logos reales (Conectores) en blanco. */
 .hf-tarjeta__img--conectores{border-color:rgb(255 255 255/.15);background:radial-gradient(1px 1px at 18% 30%,rgb(255 255 255/.55),transparent),radial-gradient(1px 1px at 72% 18%,rgb(255 255 255/.4),transparent),radial-gradient(1px 1px at 38% 78%,rgb(255 255 255/.35),transparent),radial-gradient(1px 1px at 86% 62%,rgb(255 255 255/.45),transparent),radial-gradient(1px 1px at 12% 88%,rgb(255 255 255/.3),transparent),radial-gradient(1px 1px at 60% 92%,rgb(255 255 255/.35),transparent),#050505}
 .hf-tarjeta__logos{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px}
 .hf-tarjeta__logo{display:block;flex:none;width:28px;height:28px;background:#fff;-webkit-mask:var(--hf-logo) center/contain no-repeat;mask:var(--hf-logo) center/contain no-repeat}
 .hf-tarjeta__logo[data-c="openai"]{--hf-logo:url('../brand/conectores/openai.svg')}
 .hf-tarjeta__logo[data-c="claude"]{--hf-logo:url('../brand/conectores/claude.svg')}
 /* Explorar: tres momentos de las películas de Cocuyo apilados; el de delante se mueve. */
 .hf-pila{position:absolute;inset:0}
 .hf-pila>:is(img,video){position:absolute;left:50%;display:block;object-fit:cover;border-radius:8px;transform:translateX(-50%)}
 .hf-pila__a{top:12px;width:56px;height:80px;opacity:.4}
 .hf-pila__b{top:20px;width:76px;height:100px;box-shadow:0 10px 24px rgb(0 0 0/.6)}
 .hf-pila>.hf-pila__c{top:28px;width:88px;height:128px;border-radius:8px 8px 0 0;box-shadow:0 10px 24px rgb(0 0 0/.6)}
 .hf-pila::after{content:"";position:absolute;inset:auto 0 0;z-index:1;height:48px;background:linear-gradient(transparent,var(--hf-lienzo))}
 /* Todas las Apps: cuatro portadas 1:1 en un mosaico 2×2. */
 .hf-mosaico{position:absolute;inset:0;display:grid;grid-template:1fr 1fr/1fr 1fr;gap:4px;padding:8px}
 .hf-mosaico img{display:block;width:100%;height:100%;min-height:0;object-fit:cover;border-radius:6px}
 .hf-tarjeta__txt{display:-webkit-box;overflow:hidden;padding-inline:2px;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
 /* Con resultados: el cuadro arriba y los resultados debajo, sin portada. */
 html body.studio-workbench.hf-crear.hf-con-resultados :is(.hf-hero,.hf-debajo,.hf-carrusel){display:none!important}
 html body.studio-workbench.hf-crear.hf-con-resultados:not(#hf):not(#hf) #mesa{min-height:0;padding-top:12px!important}
 /* Avisos y progreso del Estudio (#genstatus): un bloque bajo el cuadro, no un
    globo flotante que lo tape. Sin el relleno «Esperando para crear». */
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #genstatus{position:static!important;inset:auto!important;transform:none!important;width:auto!important;max-width:none!important;margin:12px 16px 0!important;padding:12px 14px!important;border:1px solid rgba(255,255,255,.06)!important;border-radius:16px!important;background:rgba(255,255,255,.06)!important;box-shadow:none!important;color:#f7f7f8!important;font:400 14px/20px var(--font)!important}
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #genout .studio-results-empty{display:none!important}

 /* ---- Menú lateral ---- */
 .hf-cajon{position:fixed;inset:0;width:100%;max-width:100%;height:100%;max-height:100%;margin:0;padding:0;border:0;background:transparent;color:#fff;overflow:hidden}
 .hf-cajon::backdrop{background:rgba(0,0,0,.5)}
 .hf-cajon__panel{display:flex;flex-direction:column;width:min(327px,87vw);height:100%;padding:env(safe-area-inset-top,0px) 0 calc(16px + env(safe-area-inset-bottom,0px));border-right:1px solid rgba(255,255,255,.06);background:#0b0b0b;animation:hf-entra .24s cubic-bezier(.2,.8,.2,1)}
 @keyframes hf-entra{from{transform:translateX(-100%)}to{transform:none}}
 .hf-cajon__cab{flex:none;display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 10px 0 16px}
 /* La marca escrita se deletrea siempre de izquierda a derecha, también en árabe y urdu. */
 .hf-cajon__marca{display:inline-flex;align-items:center;direction:ltr;unicode-bidi:isolate;color:#fff;font:750 18px/22px var(--font);letter-spacing:-.05em;text-transform:uppercase;text-decoration:none}
 .hf-cajon__cerrar{display:grid;place-items:center;width:32px;height:32px;padding:0;border:0;border-radius:8px;background:transparent;color:#828282;cursor:pointer}
 .hf-cajon__cerrar .ic{width:20px;height:20px}
 .hf-cajon__lista{flex:1;display:grid;align-content:start;padding:6px 16px 0;overflow:auto}
 .hf-fila{display:flex;align-items:center;gap:10px;min-height:52px;padding:6px 10px 6px 4px;border-radius:10px;color:#fff;font:500 16px/20px var(--font);text-decoration:none}
 .hf-fila .ic{flex:none;width:24px;height:24px}
 .hf-fila:hover{background:rgba(255,255,255,.05)}
 .hf-fila.is-actual{min-height:44px;padding:8px 10px 8px 8px;background:rgba(209,254,23,.08);box-shadow:inset 0 0 0 1px rgba(209,254,23,.12);color:var(--hf-lima);font-weight:600}
 .hf-fila.is-actual .ic{width:20px;height:20px}
 .hf-fila:focus-visible,.hf-cajon__cerrar:focus-visible{outline:2px solid var(--hf-lima);outline-offset:-2px}
 .hf-fila__txt{flex:1;min-width:0}
 .hf-chip-lima{display:inline-flex;align-items:center;height:28px;padding:0 14px;border-radius:999px;background:var(--hf-lima);color:#1a1a1a;font:500 12px/16px var(--font)}
 .hf-fila__valor{color:#828282;font-size:14px}
 .hf-cajon__pie{flex:none;padding:16px 16px 0;border-top:1px solid rgba(255,255,255,.06)}
 .hf-pie__t{margin:0;font:500 14px/18px var(--font);color:#fff}
 .hf-pie__s{margin:4px 0 20px;font:400 14px/18px var(--font);color:#828282}
 .hf-entrar{width:100%;height:48px;border:1px solid rgba(0,0,0,.2);border-radius:999px;background:#fff;color:#1a1a1a;font:500 16px/18px var(--font);cursor:pointer}
 .hf-pie-cuenta{display:flex;align-items:center;gap:12px;width:100%;padding:8px;border:0;border-radius:12px;background:rgba(255,255,255,.05);color:#fff;text-align:left;font:inherit;cursor:pointer}
 .hf-pie-cuenta[hidden],.hf-pie-visitante[hidden]{display:none}
 .hf-pie-cuenta__avatar{display:grid;place-items:center;grid-auto-flow:column;gap:3px;width:36px;height:36px;border-radius:50%;background:#1d1d1d}
 .hf-pie-cuenta__avatar i{width:6px;height:6px;border-radius:50%;background:var(--hf-lima);box-shadow:0 0 6px var(--hf-lima)}
 .hf-pie-cuenta__txt{flex:1;display:grid;min-width:0}
 .hf-pie-cuenta__txt b{overflow:hidden;font:500 14px/18px var(--font);white-space:nowrap;text-overflow:ellipsis}
 .hf-pie-cuenta__txt small{font:400 12px/16px var(--font);color:#828282}
 .hf-pie-cuenta .ic{width:16px;height:16px;color:#828282}

 /* ---- Hojas desde abajo: Ajustes y Referencias ---- */
 .hf-hoja{box-sizing:border-box;position:fixed;inset:auto 0 0;width:min(560px,100vw);max-width:100vw;max-height:88dvh;margin:0 auto;padding:0 16px calc(16px + env(safe-area-inset-bottom,0px));border:0;border-radius:24px 24px 0 0;background:#121212;color:#f7f7f8;font:400 14px/1.2 var(--font);flex-direction:column;overflow:hidden}
 .hf-hoja[open]{display:flex;animation:sm-sheet-sube .26s cubic-bezier(.2,.8,.2,1)}
 .hf-hoja::backdrop{background:rgba(0,0,0,.6)}
 .hf-hoja__asa{flex:none;width:36px;height:4px;margin:8px auto 0;border-radius:4px;background:#ffffff33}
 .hf-hoja__cab{position:relative;flex:none;display:flex;align-items:center;justify-content:center;height:48px}
 .hf-hoja__cab h2{margin:0;font:600 16px/24px var(--font)}
 .hf-hoja__cerrar{position:absolute;right:-4px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:12px;background:#ffffff0f;color:#f7f7f8;cursor:pointer}
 .hf-hoja__cerrar .ic{width:16px;height:16px}
 .hf-hoja__sub{margin:-6px 0 12px;color:#828282;font-size:13px;text-align:center}
 .hf-ajustes{flex:1;overflow:auto;overscroll-behavior:contain}
 .hf-ajuste{position:relative;display:flex;align-items:center;gap:10px;min-height:48px;color:#fff;cursor:pointer}
 .hf-ajuste__ic{display:grid;place-items:center;color:#a3a3a3}
 .hf-ajuste__ic .ic{width:16px;height:16px}
 .hf-ajuste__nombre{flex:1;font:600 14px/16px var(--font)}
 .hf-ajuste__valor{font:500 14px/16px var(--font)}
 .hf-ajuste__flecha{display:grid;place-items:center;width:24px;height:24px;border-radius:999px;background:#ffffff0f;color:#a3a3a3}
 .hf-ajuste__flecha .ic{width:14px;height:14px}
 .hf-ajuste select{position:absolute;inset:0;width:100%;height:100%;opacity:0;font-size:16px;cursor:pointer}
 .hf-hoja__vacio{margin:12px 0;color:#828282}
 .hf-hoja__pie{flex:none;padding-top:16px}
 .hf-aplicar{width:100%;height:40px;border:0;border-radius:999px;background:var(--hf-lima);color:#1a1a1a;font:500 14px/16px var(--font);cursor:pointer}
 .hf-aplicar:focus-visible,.hf-hoja__cerrar:focus-visible{outline:2px solid #fff;outline-offset:2px}
 @media(prefers-reduced-motion:reduce){.hf-cajon__panel,.hf-hoja[open]{animation:none}.hf-generar.is-ocupado .ic{animation:none}}
 .hf-cuenta-refs.is-exceso{background:#ff5a52;color:#fff;font-weight:700}
 .hf-generar.is-aviso .hf-generar__coste{min-width:10px;font-weight:700;text-align:center}

 /* ---- Miniaturas en el cuadro de crear (estudio-movil-referencias.js) ----
    Encima del texto: 56 px, desplazables, X de 24 px y toque = vista previa. */
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa .hf-minis{order:0!important;display:flex;gap:18px;margin:0;padding:22px 12px 10px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa .hf-minis[hidden]{display:none!important}
 .hf-minis::-webkit-scrollbar{display:none}
 .hf-mini{position:relative;flex:none;width:56px;height:56px}
 .hf-mini__ver{position:relative;display:grid;place-items:center;width:56px;height:56px;padding:0;border:0;border-radius:16px;overflow:hidden;background:#262626;color:#fff;cursor:pointer}
 .hf-mini__ver :is(img,video){display:block;width:100%;height:100%;object-fit:cover}
 /* 9-oct-2026: X con 36×36 de toque hacia fuera de la miniatura (solo pisa la
    esquina redondeada) y círculo de 22 centrado en la esquina; quitar trae «Deshacer». */
 .hf-mini__x{position:absolute;top:-22px;right:-22px;z-index:1;width:36px;height:36px;padding:0;border:0;border-radius:0;background:transparent;color:#fff;cursor:pointer}
 .hf-mini__x::before{content:"";position:absolute;left:3px;bottom:3px;width:22px;height:22px;box-sizing:border-box;border:1px solid rgb(255 255 255/.14);border-radius:50%;background:rgb(18 18 18/.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
 .hf-mini__x .ic{position:absolute;left:8px;bottom:8px;width:12px;height:12px}
 .hf-mini__play{position:absolute;right:4px;bottom:4px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:rgb(0 0 0/.55);pointer-events:none}
 .hf-mini__play .ic{width:9px;height:9px;margin-left:1px}
 .hf-mini__audio{display:grid;place-items:center;color:#a3a3a3}
 .hf-mini__audio .ic{width:20px;height:20px}
 .hf-mini__ver::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none}
 .hf-mini.is-conflicto .hf-mini__ver::after{box-shadow:inset 0 0 0 2px #ff5a52}
 .hf-mini.is-subiendo .hf-mini__ver{cursor:default}
 .hf-mini__pct{font:600 12px/16px var(--font);color:#fff}
 .hf-mini__ver:focus-visible{outline:2px solid var(--hf-lima);outline-offset:2px}
 .hf-mini__x:focus-visible{outline:none}.hf-mini__x:focus-visible::before{outline:2px solid var(--hf-lima);outline-offset:2px}
 /* «Ayuda con el prompt» vive en el cuadro (no en la hoja de referencias);
    «Mis referencias» es un chip de la hoja. */
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa #studioComposerActions:not([hidden]){order:1!important;display:flex!important;align-items:center;gap:8px;margin:2px 0 0!important;padding:0 12px!important;min-height:0;border:0!important;background:none!important}
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa #studioComposerActions .ckit-entry{display:none!important}
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa #studioComposerActions .prompt-help-trigger{min-height:32px;padding:4px 0;border:0;background:none;color:#8a8a8a;font:500 13px/16px var(--font)}

 /* ---- Hoja «Referencias» (estudio-movil-referencias.js), como la hoja «Assets»
    de Higgsfield: 85dvh, esquinas de 32, asa de 28×4, cabecera de 40, chips de 32,
    rejilla de 3 columnas (hueco de 8, fichas de radio 20) y «Aplicar» de 44. */
 .hf-hoja.hfr{height:85dvh;max-height:85dvh;padding:0;border-radius:32px 32px 0 0;background:#1b1b1c;transition:transform .2s cubic-bezier(.2,.8,.2,1);overscroll-behavior:contain}
 .hf-hoja.hfr.is-arrastrando{transition:none}
 .hfr-arrastre{flex:none;padding:0 16px;touch-action:none;cursor:grab}
 .hfr .hf-hoja__asa{width:28px;height:4px;margin:8px auto 0;border-radius:4px;background:rgb(255 255 255/.22)}
 .hfr-cab.hf-hoja__cab{height:40px;margin-top:2px}
 .hfr-cab h2{font:600 16px/24px var(--font)}
 .hfr .hfr-cerrar{right:0;width:44px;height:44px;border-radius:50%;background:transparent}
 .hfr .hfr-cerrar::before{content:"";position:absolute;inset:6px;border-radius:50%;background:rgb(255 255 255/.06)}
 .hfr .hfr-cerrar .ic{position:relative;width:16px;height:16px}
 .hfr-estado{flex:none;display:grid;justify-items:center;gap:4px;min-height:20px;margin:2px 16px 10px;text-align:center}
 .hfr-estado__cuenta{color:#f7f7f8;font:500 14px/20px var(--font)}
 .hfr-estado__aviso{display:block;max-width:100%;color:#ff8a80;font:500 13px/18px var(--font);opacity:1;overflow-wrap:anywhere}
 .hfr-estado__aviso[hidden]{display:none}
 .hfr-estado__aviso.is-nota{color:#d4d4d4}
 .hfr-estado__acciones{flex:none;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:-4px 16px 12px}
 .hfr-estado__acciones[hidden]{display:none}
 .hfr-accion{min-height:44px;padding:0 16px;border:1px solid rgb(255 255 255/.14);border-radius:999px;background:rgb(255 255 255/.06);color:#fff;font:500 13px/16px var(--font);cursor:pointer}
 .hfr-subir__input{display:none!important}
 .hfr-sr{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important;opacity:0}
 .hfr-cuerpo{position:relative;flex:1;min-height:0;padding:0 16px 16px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}
 /* Fotogramas | Referencias y los huecos Primer/Último (1:1, nunca más de 180 px). */
 .hfr-seg{position:relative;display:flex;width:max-content;max-width:100%;margin:0 auto 4px;padding:0 3px;border-radius:999px;isolation:isolate}
 .hfr-seg::before{content:"";position:absolute;inset:4px 0;z-index:-1;border-radius:999px;background:rgb(255 255 255/.06)}
 .hfr-seg[hidden],.hfr-huecos[hidden],.hfr-elegidas[hidden],.hfr-orden[hidden],.hfr-vacio[hidden]{display:none}
 .hfr-seg button{position:relative;height:44px;padding:0 14px;border:0;border-radius:999px;background:transparent;color:#a3a3a3;font:500 13px/16px var(--font);cursor:pointer;isolation:isolate}
 .hfr-seg button[aria-pressed="true"]{color:#111}
 .hfr-seg button[aria-pressed="true"]::before{content:"";position:absolute;inset:7px 0;z-index:-1;border-radius:999px;background:#fff}
 .hfr-huecos{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 0 10px}
 .hfr-huecos:has(.hfr-hueco__x){margin-top:22px}
 .hfr-hueco{position:relative;flex:0 1 88px;min-width:0;max-width:88px;aspect-ratio:1}
 .hfr-hueco__btn{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:5px;width:100%;height:100%;padding:12px 6px 0;box-sizing:border-box;border:1.5px dashed rgb(255 255 255/.2);border-radius:20px;overflow:hidden;background:#232324;color:#a3a3a3;cursor:pointer}
 .hfr-hueco__btn img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
 .hfr-hueco__mas{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:rgb(255 255 255/.08);color:#fff}
 .hfr-hueco__mas .ic{width:18px;height:18px}
 /* 9-oct-2026: vacío, el texto va bajo el «+» (nunca encima), igual en los dos
    huecos; lleno, sobre la imagen con degradado. */
 .hfr-hueco__txt{position:static;max-width:100%;color:#d4d4d4;font:500 11px/12px var(--font);text-align:center;overflow-wrap:anywhere}
 .hfr-hueco.is-lleno .hfr-hueco__btn{border:0}
 .hfr-hueco.is-lleno .hfr-hueco__txt{position:absolute;left:0;right:0;bottom:0;padding:14px 4px 5px;background:linear-gradient(transparent,rgb(0 0 0/.7));color:#fff}
 .hfr-hueco.is-activo .hfr-hueco__btn{border:2px solid var(--hf-lima)}
 .hfr-hueco__btn::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none}
 .hfr-hueco.is-conflicto .hfr-hueco__btn::after{box-shadow:inset 0 0 0 2px #ff5a52}
 /* 9-oct-2026: 44×44 de toque hacia fuera (solo pisa la esquina redondeada de
    la imagen, 8×8) y el círculo de 22 centrado en la esquina; el círculo no
    recibe toques: lo que cae sobre la imagen es de la imagen. */
 .hfr-hueco__x,.hfr-mini__x{position:absolute;top:-36px;right:-36px;z-index:1;width:44px;height:44px;padding:0;border:0;background:transparent;color:#fff;cursor:pointer}
 .hfr-hueco__x{top:-30px;right:-30px}
 .hfr-hueco__x i,.hfr-mini__x i{position:absolute;left:-3px;bottom:-3px;display:grid;place-items:center;width:22px;height:22px;box-sizing:border-box;border:1px solid rgb(255 255 255/.16);border-radius:50%;background:rgb(18 18 18/.7);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none}
 .hfr-hueco__x i{left:3px;bottom:3px}
 .hfr-hueco__x .ic,.hfr-mini__x .ic{width:10px;height:10px}
 .hfr-intercambiar,.hfr-pasar{flex:none;display:grid;place-items:center;height:44px;padding:0;border:0;border-radius:999px;background:rgb(255 255 255/.08);color:#fff;cursor:pointer}
 .hfr-intercambiar{position:relative;width:44px;background:transparent}
 .hfr-intercambiar::before{content:"";position:absolute;inset:4px;border-radius:50%;background:rgb(255 255 255/.08)}
 .hfr-intercambiar .ic{position:relative}
 .hfr-intercambiar .ic{width:18px;height:18px}
 .hfr-intercambiar:disabled{opacity:.35;cursor:default}
 .hfr-pasar{max-width:96px;height:auto;min-height:44px;padding:6px 10px;font:500 12px/15px var(--font);text-align:center}
 /* Elegidas: 56×56, radio 16, número y X (círculo de 20, toque de 44) sin tapar la imagen. */
 .hfr-elegidas{display:flex;gap:20px;margin:0 -16px 10px;padding:36px 16px 6px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
 .hfr-elegidas::-webkit-scrollbar{display:none}
 .hfr-mini{position:relative;flex:none;width:56px;height:56px;transition:transform .15s}
 .hfr-mini__ver{position:relative;display:grid;place-items:center;width:56px;height:56px;padding:0;border:0;border-radius:16px;overflow:hidden;background:#262626;color:#fff;cursor:pointer;-webkit-touch-callout:none}
 .hfr-mini__ver :is(img,video){display:block;width:100%;height:100%;object-fit:cover;-webkit-user-drag:none}
 .hfr-mini__num{position:absolute;top:4px;left:4px;min-width:18px;height:18px;padding:0 4px;box-sizing:border-box;border-radius:999px;background:rgb(0 0 0/.62);color:#fff;font:600 11px/18px var(--font);text-align:center;pointer-events:none}
 .hfr-mini__rol{position:absolute;left:4px;right:4px;bottom:4px;padding:1px 0;border-radius:6px;background:rgb(0 0 0/.62);color:#fff;font:600 10px/13px var(--font);text-align:center;pointer-events:none}
 .hfr-mini__play{position:absolute;right:4px;bottom:4px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:rgb(0 0 0/.55);pointer-events:none}
 .hfr-mini__play .ic{width:9px;height:9px;margin-left:1px}
 .hfr-mini__audio{display:grid;place-items:center;color:#a3a3a3}
 .hfr-mini__audio .ic{width:20px;height:20px}
 .hfr-mini__ver::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none}
 .hfr-mini.is-conflicto .hfr-mini__ver::after{box-shadow:inset 0 0 0 2px #ff5a52}
 .hfr-mini.is-orden .hfr-mini__ver::after{box-shadow:inset 0 0 0 2px var(--hf-lima)}
 .hfr-mini.is-levantada{z-index:2;transition:none;opacity:.92}
 .hfr-mini.is-levantada .hfr-mini__ver{box-shadow:0 8px 20px rgb(0 0 0/.5)}
 .hfr-mini.is-levantada .hfr-mini__ver::after{box-shadow:inset 0 0 0 2px #fff}
 .hfr-mini.is-destino .hfr-mini__ver::after{box-shadow:inset 0 0 0 2px var(--hf-lima)}
 .hfr-anillo{position:absolute;top:8px;left:8px;width:40px;height:40px;transform:rotate(-90deg)}
 .hfr-anillo circle{fill:none;stroke-width:3}
 .hfr-anillo__pista{stroke:rgb(255 255 255/.15)}
 .hfr-anillo__avance{stroke:var(--hf-lima);stroke-linecap:round}
 .hfr-mini__pct{position:relative;font:600 11px/14px var(--font);color:#fff}
 /* ← Antes · Después → · Ver · Listo bajo la fila (estudio-referencias-orden.js). */
 .hfr-orden{margin:-2px 0 12px}
 .hfr-orden .ref-orden-acciones{display:flex;flex-wrap:wrap;align-items:center;gap:8px;color:#a3a3a3;font:500 12px/16px var(--font)}
 .hfr-orden .ref-orden-acciones span{flex:0 0 100%}
 .hfr-orden .ref-orden-acciones button{min-height:44px;padding:0 14px;border:0;border-radius:999px;background:rgb(255 255 255/.08);color:#fff;font:500 13px/16px var(--font);cursor:pointer}
 .hfr-orden .ref-orden-acciones button:disabled{opacity:.35;cursor:default}
 .hfr-orden .ref-orden-acciones [data-ref-orden-listo]{margin-left:auto;background:#fff;color:#111}
 /* Chips de origen (desplazables). */
 /* Fijos arriba al bajar por la rejilla, para cambiar de origen sin volver. */
 .hfr-chips{position:sticky;top:0;z-index:2;display:flex;flex-wrap:wrap;gap:0 4px;margin:0 -16px;padding:0 16px 4px;background:#1b1b1c;overflow:visible}
 .hfr-chips::-webkit-scrollbar{display:none}
 .hfr-chip{position:relative;flex:none;height:44px;padding:0 13px;border:0;border-radius:999px;background:transparent;color:#8a8a8a;font:500 14px/44px var(--font);white-space:nowrap;cursor:pointer;isolation:isolate}
 .hfr-chip::before{content:"";position:absolute;inset:6px 0;z-index:-1;border-radius:999px}
 .hfr-chip[aria-selected="true"]{color:var(--hf-lima)}
 .hfr-chip[aria-selected="true"]::before{background:rgb(209 254 23/.14)}
 /* Rejilla: «Subir» primero y las fichas de la Bóveda. */
 .hfr-rejilla{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
 .hfr-celda{position:relative;min-width:0;aspect-ratio:1;border-radius:20px;overflow:hidden;background:#262626}
 .hfr-celda::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgb(255 255 255/.05);pointer-events:none}
 .hfr-celda.is-elegida::after{box-shadow:inset 0 0 0 2px #fff}
 .hfr-ficha{position:absolute;inset:0;display:block;width:100%;height:100%;padding:0;border:0;background:transparent;color:#fff;cursor:pointer}
 .hfr-ficha :is(img,video){display:block;width:100%;height:100%;object-fit:cover}
 .hfr-celda.is-no .hfr-ficha :is(img,video,.hfr-ficha__audio){opacity:.35;filter:grayscale(.6)}
 .hfr-celda.is-no .hfr-ficha{cursor:not-allowed}
 .hfr-ficha__play{position:absolute;left:6px;bottom:6px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:rgb(0 0 0/.5);pointer-events:none}
 .hfr-ficha__play .ic{width:11px;height:11px;margin-left:1px}
 .hfr-ficha__dur{position:absolute;right:6px;bottom:6px;padding:2px 6px;border-radius:8px;background:rgb(0 0 0/.55);color:#fff;font:500 12px/16px var(--font);pointer-events:none}
 .hfr-ficha__dur:empty{display:none}
 .hfr-celda.is-no :is(.hfr-ficha__play,.hfr-ficha__dur){display:none}
 .hfr-ficha__audio{display:grid;place-items:center;align-content:center;gap:6px;width:100%;height:100%;padding:8px;box-sizing:border-box;color:#a3a3a3;font:500 11px/14px var(--font);text-align:center}
 .hfr-ficha__audio .ic{width:22px;height:22px}
 .hfr-ficha__audio span{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere}
 .hfr-ficha__motivo{position:absolute;left:4px;right:4px;bottom:4px;display:-webkit-box;padding:3px 5px;border-radius:8px;background:rgb(0 0 0/.72);color:#fff;font:600 11px/14px var(--font);text-align:center;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow-wrap:anywhere;pointer-events:none}
 .hfr-ficha__motivo[hidden]{display:none}
 .hfr-ficha__casilla{position:absolute;top:2px;right:2px;display:grid;place-items:center;width:32px;height:32px;cursor:pointer}
 .hfr-ficha__casilla::before{content:"";position:absolute;width:20px;height:20px;box-sizing:border-box;border:1.5px solid rgb(255 255 255/.9);border-radius:6px;background:rgb(0 0 0/.18)}
 .hfr-celda.is-elegida .hfr-ficha__casilla::before{border-color:#fff;background:#fff}
 .hfr-celda.is-no .hfr-ficha__casilla{opacity:.35;cursor:not-allowed}
 .hfr-ficha__num{position:relative;color:#111;font:700 12px/20px var(--font)}
 .hfr-subir{display:grid;place-items:center;align-content:center;gap:10px;width:100%;padding:0;border:0;background:#262626;color:#fff;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
 .hfr-subir__ic{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:rgb(255 255 255/.1)}
 .hfr-subir__ic .ic{width:20px;height:20px}
 .hfr-subir__txt{font:500 14px/18px var(--font)}
 .hfr-subir:focus-visible{outline:2px solid #fff;outline-offset:-3px}
 .hfr-vacio{margin:20px 8px 8px;color:#8a8a8a;font:400 14px/20px var(--font);text-align:center}
 .hfr-reintentar{display:inline-flex;align-items:center;min-height:44px;margin:6px 0 0 4px;padding:0 16px;border:1px solid rgb(209 254 23/.4);border-radius:999px;background:transparent;color:var(--hf-lima);font:500 14px/18px var(--font);cursor:pointer}
 .hfr-centinela{height:1px}
 /* Mis referencias: kits con sus miniaturas; el diálogo del kit se abre encima. */
 .hfr-rejilla--kits{display:block}
 .hfr-kits{display:grid;gap:8px}
 .hfr-kits__nota{margin:8px 4px;color:#8a8a8a;font:400 14px/20px var(--font)}
 .hfr-kits__nota.is-error{color:#ff8a80}
 .hfr-kits__reintentar{justify-self:start;margin:-4px 0 4px 4px}
 .hfr-kit{display:flex;align-items:center;gap:12px;width:100%;min-height:72px;padding:8px;border:0;border-radius:20px;background:#232324;color:#fff;text-align:left;font:inherit;cursor:pointer}
 .hfr-kit__minis{flex:none;display:grid;grid-template-columns:repeat(2,1fr);gap:2px;width:56px;height:56px;overflow:hidden;border-radius:14px;background:#2c2c2d}
 .hfr-kit__minis :is(img,video){display:block;width:100%;height:100%;min-height:0;object-fit:cover}
 .hfr-kit__minis i{display:grid;place-items:center;grid-column:1/-1;grid-row:1/-1;color:#a3a3a3}
 .hfr-kit__minis i .ic{width:22px;height:22px}
 .hfr-kit__txt{display:grid;gap:4px;min-width:0}
 .hfr-kit__txt b{overflow:hidden;font:500 14px/18px var(--font);white-space:nowrap;text-overflow:ellipsis}
 .hfr-kit__txt small{color:#8a8a8a;font:400 13px/16px var(--font)}
 /* Pie fijo: «Aplicar», gris y desactivado sin cambios; lima con cambios. */
 .hfr .hf-hoja__pie{padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));border-top:1px solid rgb(255 255 255/.06)}
 .hfr .hf-aplicar{height:44px;font:500 15px/18px var(--font)}
 .hfr .hf-aplicar:disabled{background:rgb(41,43,44);color:#7b7d7e;cursor:default}
 :is(.hfr-ficha,.hfr-mini__ver,.hfr-hueco__btn,.hfr-pasar,.hfr-kit,.hfr-accion,.hfr-orden button,.hfr-reintentar):focus-visible{outline:2px solid #fff;outline-offset:2px}
 :is(.hfr-chip,.hfr-seg button,.hfr-intercambiar,.hfr-cerrar):focus-visible{outline:none}
 :is(.hfr-chip,.hfr-seg button,.hfr-intercambiar,.hfr-cerrar):focus-visible::before{outline:2px solid #fff;outline-offset:2px}
 :is(.hfr-mini__x,.hfr-hueco__x):focus-visible{outline:none}
 :is(.hfr-mini__x,.hfr-hueco__x):focus-visible i{outline:2px solid #fff;outline-offset:2px}
 .hfr-ficha:focus-visible{outline-offset:-3px}
 /* Mientras llega la primera página: fichas de esqueleto (9-oct-2026). */
 .hfr-esqueleto{background:linear-gradient(100deg,#262626 30%,#323233 50%,#262626 70%);background-size:220% 100%;animation:hfr-brillo 1.3s linear infinite}
 @keyframes hfr-brillo{from{background-position:120% 0}to{background-position:-100% 0}}
 /* «+» del cuadro: 44×44 de toque con el círculo de 36 de siempre. */
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #mesa .hf-fila-cuadro [data-hf-refs]{width:44px;height:44px;margin:-4px;background:radial-gradient(circle,rgba(255,255,255,.05) 17.5px,transparent 18px)}
 /* Avisos de error de referencias bajo el cuadro: en rojo, como en la hoja. */
 html body.studio-workbench.hf-crear:not(#hf):not(#hf) #genstatus:is([data-aviso-refs="rechazo"],[data-aviso-refs="validacion"]){border-color:rgb(255 90 82/.35)!important;background:rgb(255 90 82/.1)!important;color:#ffc9c4!important}
 /* «Guardar o gestionar kits» desde la hoja: el diálogo de kits como hoja
    inferior del mismo estilo (esquinas de 32, lima, botones redondos). */
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits.ckit-dialog{position:fixed;inset:auto 0 0 0;width:100%;max-width:none;max-height:85dvh;margin:0;padding:0 16px calc(16px + env(safe-area-inset-bottom,0px));box-sizing:border-box;border:0;border-radius:32px 32px 0 0;background:#1b1b1c;color:#f7f7f8;font:400 14px/20px var(--font)}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits.ckit-dialog::backdrop{background:rgb(0 0 0/.6);-webkit-backdrop-filter:none;backdrop-filter:none}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits>header{position:relative;justify-content:center;height:52px;padding:0;border:0}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits>header::before{content:"";position:absolute;top:8px;left:50%;width:28px;height:4px;margin-left:-14px;border-radius:999px;background:rgb(255 255 255/.2)}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits h2{margin-top:8px;font:600 16px/24px var(--font);letter-spacing:0}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits>header button{position:absolute;right:-6px;top:8px;width:44px;height:44px;min-width:0;padding:0;border:0;border-radius:50%;background:radial-gradient(circle,rgb(255 255 255/.06) 15.5px,transparent 16px);font-size:20px;line-height:44px}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits button{border-color:transparent;border-radius:999px;background:#232324}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits .ckit-list>button{border-radius:20px;padding:12px}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits .ckit-primary{width:100%;min-height:44px;border-radius:999px;background:var(--hf-lima,#d1fe17);color:#1a1a1a;font:500 15px/18px var(--font)}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits :is(input:not([type=radio]),select){border-radius:14px;border-color:rgb(255 255 255/.08);background:#232324}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits fieldset{border-color:rgb(255 255 255/.08);border-radius:16px}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits :is(.ckit-content>p,.ckit-dialog form>p,.ckit-list>button span,.ckit-pista){color:#a3a3a3}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits input[type=radio]{accent-color:var(--hf-lima,#d1fe17)}
 html body.hf-movil:not(#hf):not(#hf) #cocuyoKits :is(button,input,select):focus-visible{outline-color:#fff}
 @media(prefers-reduced-motion:reduce){.hf-hoja.hfr,.hfr-mini{transition:none}.hfr-esqueleto{animation:none}}
}

/* ============ Explorar del Estudio móvil (Higgsfield «Explore», 8-oct-2026) ============
   Módulo: assets/js/estudio-movil-explorar.js, registrado como pantalla 'explorar'
   (estudio-movil-pantallas.js): body[data-hf-pantalla="explorar"] y body.hf-en-explorar.
   Medidas de su web móvil: píldoras de 33 px, tarjetas 16:9 con esquinas de 16 px,
   filas con miniatura de 77 × 58, insignias en Space Grotesk y Buscar flotando abajo. */
.hf-titulo,.hf-explorar{display:none}
@media(max-width:900px){
 html body.studio-workbench.hf-movil.hf-en-explorar{overflow:hidden}
 .hf-movil .hf-explorar:not([hidden]){display:block;position:fixed;inset:var(--st-top) 0 0 0;z-index:60;overflow-y:auto;overscroll-behavior:contain;background:#0b0b0b;color:#fff;font-family:var(--font);padding-bottom:96px;-webkit-overflow-scrolling:touch}
 .hf-explorar .ic{width:16px;height:16px}
 /* Píldoras fijas arriba al desplazarse. */
 .hfx-chips{position:sticky;top:0;z-index:3;display:flex;gap:8px;overflow-x:auto;padding:6px 12px 10px;background:#0b0b0b;scrollbar-width:none}
 .hfx-chips::-webkit-scrollbar{display:none}
 .hfx-chip{flex:none;height:33px;padding:0 14px;border:0;border-radius:17px;background:rgb(255 255 255/.05);color:#fff;font:500 12px/15px var(--font);cursor:pointer}
 .hfx-chip.is-on{background:#fff;color:#131517}
 /* Carrusel. */
 .hfx-carrusel{margin:6px 0 0}
 .hfx-carrusel__pista{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 12px;scroll-padding-inline:12px;scrollbar-width:none}
 .hfx-carrusel__pista::-webkit-scrollbar{display:none}
 .hfx-tarjeta{position:relative;flex:0 0 100%;aspect-ratio:16/9;scroll-snap-align:start;overflow:hidden;border:0;border-radius:16px;padding:0;background:#161616;color:#fff;text-align:left;cursor:pointer;box-shadow:inset 0 0 0 1px rgb(255 255 255/.06)}
 .hfx-tarjeta video,.hfx-pieza video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
 .hfx-tarjeta::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 38%,rgb(0 0 0/.72) 100%);pointer-events:none}
 .hfx-tarjeta__txt{position:absolute;left:16px;right:16px;bottom:14px;z-index:1;display:grid;gap:4px}
 .hfx-tarjeta__txt b{font:800 21px/1.05 var(--font);letter-spacing:-.01em;text-transform:uppercase}
 .hfx-tarjeta__txt small{font:400 12px/18px var(--font);color:rgb(255 255 255/.8)}
 .hfx-tarjeta--promo::after{background:linear-gradient(90deg,rgb(0 0 0/.82) 0%,rgb(0 0 0/.55) 55%,rgb(0 0 0/.2) 100%)}
 .hfx-tarjeta--promo .hfx-tarjeta__txt{top:14px;bottom:auto;gap:8px}
 .hfx-promo__t{margin:0;font:800 20px/1.05 var(--font);text-transform:uppercase}
 .hfx-promo__t em{font-style:normal;color:var(--hf-lima)}
 .hfx-tarjeta--promo ul{list-style:none;margin:0;padding:0;display:grid;gap:3px;font:400 12px/17px var(--font);color:rgb(255 255 255/.86)}
 .hfx-tarjeta--promo li{display:flex;align-items:center;gap:6px}
 .hfx-tarjeta--promo li .ic{width:13px;height:13px}
 .hfx-lima{justify-self:start;height:36px;padding:0 22px 2px;margin-top:4px;border:0;border-radius:10px;background-color:var(--hf-lima);background-image:linear-gradient(180deg,rgb(255 255 20/0),var(--hf-brillo));color:#131517;font:600 13px/1 var(--font);box-shadow:inset 0 -3px 0 var(--hf-labio),0 6px 4px rgb(0 0 0/.25),0 32px 24px rgb(0 0 0/.15);cursor:pointer}
 .hfx-puntos{display:flex;justify-content:center;gap:6px;margin:12px 0 4px}
 .hfx-puntos i{width:5px;height:5px;border-radius:50%;background:rgb(255 255 255/.25)}
 .hfx-puntos i.is-on{background:#fff}
 /* Cuatro accesos con el destello lima detrás. */
 .hfx-accesos{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:18px 16px 6px}
 .hfx-acceso{display:grid;justify-items:center;gap:8px;padding:0;border:0;background:none;color:#fff;font:600 11px/14px var(--font);cursor:pointer}
 .hfx-acceso__img{position:relative;width:100%;aspect-ratio:1;border-radius:14px;background:var(--hf-lima)}
 .hfx-acceso__img img{position:absolute;inset:3px;width:calc(100% - 6px);height:calc(100% - 6px);object-fit:cover;border-radius:12px;transform:rotate(-7deg) scale(.86);box-shadow:0 4px 14px rgb(0 0 0/.45)}
 /* Secciones en filas. */
 .hfx-sec{padding:26px 0 0}
 .hfx-cabeza{padding:0 16px 10px}
 .hfx-cabeza h2{margin:0;font:600 18px/24px var(--font);color:#fff}
 .hfx-cabeza h2 button{display:inline-flex;align-items:center;gap:4px;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer}
 .hfx-cabeza h2 .ic{width:16px;height:16px;color:#828282}
 .hfx-cabeza p{margin:2px 0 0;font:400 12px/18px var(--font);color:#828282}
 .hfx-filas{list-style:none;margin:0;padding:0 16px;display:grid;gap:6px}
 .hfx-fila{display:flex;align-items:center;gap:12px;width:100%;min-height:68px;padding:5px 0;border:0;background:none;color:#fff;text-align:left;cursor:pointer}
 .hfx-fila__img{flex:none;display:grid;place-items:center;width:77px;height:58px;overflow:hidden;border-radius:8px;background:#1c1c1c;color:var(--hf-lima)}
 .hfx-fila__img img{width:100%;height:100%;object-fit:cover}
 .hfx-fila__img img[src*="/utiles/iconos/"]{object-fit:contain;background:#0b0b0b}
 .hfx-fila__img .ic{width:22px;height:22px}
 .hfx-fila__txt{flex:1;min-width:0;display:grid;gap:3px}
 .hfx-fila__nom{display:flex;align-items:center;gap:8px;min-width:0}
 .hfx-fila__nom b{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:500 14px/20px var(--font);letter-spacing:.1px}
 .hfx-fila__txt small{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:400 12px/18px var(--font);color:rgb(255 255 255/.5)}
 .hfx-fila>.ic{flex:none;width:16px;height:16px;color:#5c5c5c}
 .hfx-ins{flex:none;padding:0 6px;border-radius:4px;font:italic 700 12px/18px "Space Grotesk",var(--font);text-transform:uppercase;background:var(--hf-lima);color:#131517}
 .hfx-ins[data-tipo="top"]{background:#7b3cf6;color:#fff}
 .hfx-ins[data-tipo="base"]{background:#2f6bff;color:#fff}
 .hfx-ins[data-tipo="gratis"]{background:#177a41;color:#fff}
 .hfx-ins[data-tipo="app"]{background:rgb(255 255 255/.12);color:#fff}
 /* Conectores (su bloque de MCP): rejilla en perspectiva. */
 .hfx-conectores{position:relative;overflow:hidden;margin:26px 12px 0;padding:22px 18px 20px;border-radius:16px;background:radial-gradient(120% 90% at 50% 0%,#1d2412 0%,#0f0f0f 60%);box-shadow:inset 0 0 0 1px rgb(255 255 255/.06);text-align:center}
 .hfx-conectores__rejilla{position:absolute;inset:auto -40% -30% -40%;height:70%;background-image:linear-gradient(rgb(209 254 23/.14) 1px,transparent 1px),linear-gradient(90deg,rgb(209 254 23/.14) 1px,transparent 1px);background-size:28px 28px;transform:perspective(260px) rotateX(58deg);transform-origin:top;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000,transparent);mask-image:linear-gradient(180deg,#000,transparent)}
 .hfx-conectores>*{position:relative}
 .hfx-conectores__eyebrow{margin:0 0 6px;font:600 11px/14px var(--font);letter-spacing:.14em;text-transform:uppercase;color:var(--hf-lima)}
 .hfx-conectores h2{margin:0 0 8px;font:700 20px/1.15 var(--font);color:#fff}
 .hfx-conectores p{margin:0 auto;max-width:30ch;font:400 13px/19px var(--font);color:rgb(255 255 255/.7)}
 .hfx-conectores__botones{display:flex;justify-content:center;gap:8px;margin-top:16px}
 .hfx-blanco{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 18px;border:0;border-radius:12px;background:#fff;color:#131517;font:600 14px/1 var(--font);cursor:pointer}
 /* Mosaicos con vídeo: dos columnas, alturas alternas y un botón sobre el degradado. */
 .hfx-sec--mosaico{position:relative}
 .hfx-mosaico{columns:2;column-gap:8px;padding:0 16px}
 .hfx-pieza{position:relative;display:block;width:100%;margin:0 0 8px;padding:0;overflow:hidden;border:0;border-radius:12px;background:#161616;break-inside:avoid;aspect-ratio:3/4;cursor:pointer}
 .hfx-pieza:nth-child(4n+2),.hfx-pieza:nth-child(4n+3){aspect-ratio:4/5}
 .hfx-pieza__et{position:absolute;left:8px;bottom:8px;max-width:calc(100% - 16px);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:3px 8px;border-radius:8px;background:rgb(0 0 0/.55);color:#fff;font:500 11px/16px var(--font);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
 .hfx-mosaico__pie{position:relative;margin-top:-110px;padding:70px 16px 0;display:flex;justify-content:center;background:linear-gradient(180deg,transparent,#0b0b0b 62%)}
 .hfx-lima-suave{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 16px;border:0;border-radius:12px;background:color-mix(in srgb,var(--hf-lima) 24%,#121212);color:var(--hf-lima);font:600 14px/1 var(--font);cursor:pointer}
 .hfx-lima-suave .ic{width:14px;height:14px}
 /* Buscar, flotando abajo. */
 .hfx-buscar{position:fixed;left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:61;display:flex;align-items:center;height:48px;margin:0;padding:0 8px 0 16px;border-radius:24px;background:rgb(30 30 30/.86);box-shadow:0 8px 24px rgb(0 0 0/.5),inset 0 0 0 1px rgb(255 255 255/.06);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
 .hfx-buscar label{flex:1;display:flex;align-items:center;gap:10px;color:#828282}
 .hfx-buscar .ic{width:18px;height:18px}
 .hfx-buscar input{flex:1;min-width:0;height:44px;border:0;background:none;color:#fff;font:400 16px/20px var(--font);outline:0}
 .hfx-buscar input::placeholder{color:#828282}
 .hfx-buscar input::-webkit-search-cancel-button{display:none}
 .hfx-buscar__x{display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:50%;background:rgb(255 255 255/.08);color:#fff}
 .hfx-resultados{padding:8px 0 0}
 .hfx-vacio{padding:24px 16px;color:#828282;font:400 14px/20px var(--font);text-align:center}
 .hf-explorar :is(button):focus-visible{outline:2px solid var(--hf-lima);outline-offset:2px}
 .hfx-buscar:focus-within{box-shadow:0 8px 24px rgb(0 0 0/.5),inset 0 0 0 1px rgb(209 254 23/.45)}
 .hf-explorar [hidden]{display:none!important}
 .hf-explorar .hfx-buscar input:is(:focus,:focus-visible){outline:0!important;box-shadow:none!important;border:0!important}
}

/* ============ Pantallas del Estudio móvil (común, 8-oct-2026) ============
   Registro: assets/js/estudio-movil-pantallas.js (window.CocuyoHfPantallas).
   Cada pantalla es un div.hf-pantalla (Explorar conserva .hf-explorar), fijo
   bajo la cabecera ☰ · título · Mejorar y con scroll propio. Estado en
   body[data-hf-pantalla=<id>]: un atributo, nunca una clase de pantalla en
   el body. Medidas y colores de la app de Higgsfield (capturas/hf-ref):
   lienzo de cada pantalla, botones 3D con brillo y labio, héroe en
   MAYÚSCULAS (Geist 800 con letra apretada: Space Grotesk no está cargada),
   pestañas, buscador en línea, carril de tarjetas, sellos inclinados, hoja
   alta y avisos. Solo en el teléfono: el escritorio no cambia. */
.hf-pantalla,.hfx-aviso{display:none}
@media(max-width:900px){
 /* Lienzo de cada pantalla, también en la cabecera (el resto, #0b0b0b). */
 html body.studio-workbench.hf-movil[data-hf-pantalla="conectores"]{--hf-lienzo:#080809}
 html body.studio-workbench.hf-movil[data-hf-pantalla="apps"]{--hf-lienzo:#131517}
 html body.studio-workbench.hf-movil[data-hf-pantalla="comunidad"]{--hf-lienzo:#020202}
 html body.studio-workbench.hf-movil[data-hf-pantalla]{overflow:hidden}
 /* Arranque directo (?conectores=…): el lienzo de Conectores, sin un fotograma del
    compositor, hasta que la pantalla se abre (estudio-ruta.js pone el atributo;
    estudio-movil-pantallas.js lo quita y, como tarde, se va a los 6 s). */
 html[data-hf-arranque="conectores"],html[data-hf-arranque="conectores"] body{background:#080809!important}
 html[data-hf-arranque="conectores"] body>:not(#hfConectores){visibility:hidden!important}
 /* Si tarda (red lenta), un indicador de carga en el centro, a partir de 0,6 s. */
 html[data-hf-arranque="conectores"]::after{content:"";position:fixed;left:50%;top:50%;z-index:1;box-sizing:border-box;width:28px;height:28px;margin:-14px 0 0 -14px;border:2px solid rgb(255 255 255/.12);border-top-color:#d1fe17;border-radius:50%;opacity:0;animation:hf-arranque-sale .2s .6s forwards,hf-gira .8s linear infinite}
 @keyframes hf-arranque-sale{to{opacity:1}}
 @media(prefers-reduced-motion:reduce){html[data-hf-arranque="conectores"]::after{animation:hf-arranque-sale .2s .6s forwards}}
 html body.studio-workbench.hf-movil[data-hf-pantalla]:not(#hf) .sm-header{background:var(--hf-lienzo)!important}
 /* Título (texto 16/20) o logo (favicon de 22 + «Cocuyo» 18 w600), centrado.
    También en Creaciones con cuenta (la biblioteca, body.hf-en-creaciones).
    La cabecera pasa a una rejilla «1fr auto 1fr» (☰ · título · Mejorar): el
    título va en la columna del centro y nunca pisa ☰ ni Mejorar. Si cabe,
    queda centrado en la pantalla (las columnas de los lados miden lo mismo);
    si Mejorar es largo (it «Passa a un piano superiore», 196 px), se aparta
    hacia ☰ y se corta con «…». En rtl, la rejilla se invierte sola. */
 html body.studio-workbench.hf-movil:is([data-hf-pantalla],.hf-en-creaciones):not(#hf) .sm-header{display:grid!important;grid-template-columns:1fr auto 1fr;justify-content:normal}
 html body.studio-workbench.hf-movil:is([data-hf-pantalla],.hf-en-creaciones):not(#hf) .sm-header>.hf-menu{grid-area:1/1;justify-self:start}
 html body.studio-workbench.hf-movil:is([data-hf-pantalla],.hf-en-creaciones):not(#hf) .sm-header>.hf-mejorar{grid-area:1/3;justify-self:end}
 html body.studio-workbench.hf-movil:is([data-hf-pantalla],.hf-en-creaciones):not(#hf) .sm-header>.hf-titulo{display:flex!important;grid-area:1/2;align-items:center;gap:8px;min-width:0;color:#fff;font:500 16px/20px var(--font);white-space:nowrap;pointer-events:none}
 .hf-titulo__logo{display:none;flex:none;font:750 18px/22px var(--font);letter-spacing:-.05em;text-transform:uppercase;color:#fff}
 .hf-titulo__logo .o-viva,.hf-cajon__marca .o-viva{color:var(--lima);font-style:normal}
 .hf-titulo__txt{overflow:hidden;text-overflow:ellipsis}
 .hf-titulo[data-forma="logo"] .hf-titulo__logo{display:block}
 .hf-titulo[data-forma="logo"] .hf-titulo__txt{font:600 18px/22px var(--font);letter-spacing:-.01em}
 /* Conectores y Apps: la marca COCUYO escrita, sin icono (el logo está por
    rediseñar). Alto fijo de 22: nada se sale de la cabecera. */
 .hf-titulo[data-forma="logo"]{flex-wrap:wrap;justify-content:center;height:22px;overflow:hidden}
 .hf-titulo[data-forma="logo"] .hf-titulo__txt{flex:none}
 /* La pantalla: fija bajo la cabecera, con scroll propio (z 60; su barra fija, 61). */
 .hf-movil .hf-pantalla:not([hidden]){display:block;position:fixed;inset:var(--st-top) 0 0 0;z-index:60;box-sizing:border-box;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;background:var(--hf-lienzo);color:#fff;font-family:var(--font);padding-bottom:calc(32px + env(safe-area-inset-bottom,0px));-webkit-overflow-scrolling:touch}
 .hf-movil .hf-pantalla.hf-pantalla--con-pie:not([hidden]){padding-bottom:calc(160px + env(safe-area-inset-bottom,0px))}
 .hf-pantalla [hidden]{display:none!important}
 .hf-pantalla .ic{width:16px;height:16px}
 .hf-pantalla :is(button,a,[tabindex]):focus-visible{outline:2px solid var(--hf-lima);outline-offset:2px}

 /* ---- Botones ---- */
 /* Lima 3D («Get Pro Annual»): 48 de alto, radio 10, brillo #FFFF14 abajo y labio #829B19. */
 .hfx-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;min-height:48px;padding:8px 12px 10px;border:0;border-radius:10px;background-color:var(--hf-lima);background-image:linear-gradient(180deg,rgb(255 255 20/0),var(--hf-brillo));color:#131517;font:600 14px/16px var(--font);text-decoration:none;box-shadow:inset 0 -3px 0 var(--hf-labio),0 6px 4px rgb(0 0 0/.25),0 32px 24px rgb(0 0 0/.15);cursor:pointer;transition:filter .2s cubic-bezier(.4,0,.2,1),transform .2s cubic-bezier(.4,0,.2,1)}
 .hfx-cta .ic{width:20px;height:20px}
 /* Blanca («Connect to Claude»): píldora de 48, 16/18 w600 y el mismo labio, en negro. */
 .hfx-cta--blanco{padding:8px 16px 10px;border-radius:999px;background-color:#fff;background-image:none;color:#1a1a1a;font:600 16px/18px var(--font);box-shadow:inset 0 -3px 0 rgb(0 0 0/.32),0 6px 4px rgb(0 0 0/.25),0 32px 24px rgb(0 0 0/.15)}
 /* Oscura («✦ Generate» de los vacíos): 40 de alto y sin relieve. */
 .hfx-cta--oscuro{min-height:40px;padding:0 12px;border-radius:10px;background-color:#23262a;background-image:none;color:#fff;font:600 14px/20px var(--font);box-shadow:none}
 .hfx-cta--ancho{display:flex;width:100%}
 @media(hover:hover){:is(.hfx-cta,.hfx-lima):hover{filter:brightness(1.1)}}
 :is(.hfx-cta,.hfx-lima):active{transform:scale(.98);filter:brightness(.95)}
 :is(.hfx-cta,.hfx-lima):disabled{opacity:.5;cursor:default;transform:none;filter:none}
 /* Barra fija abajo (152 de alto) con degradado al lienzo; la pantalla lleva .hf-pantalla--con-pie. */
 .hfx-pie-fijo{position:fixed;left:0;right:0;bottom:0;z-index:61;display:grid;gap:8px;box-sizing:border-box;padding:32px 16px calc(16px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,transparent,var(--hf-lienzo) 26%)}

 /* ---- Héroe y cabeceras ----
    Peso extra (:not(#hf)) frente a body.studio-workbench:not(#f) :is(h1,h2,h3), que fija peso y letra. */
 .hfx-heroe{padding:24px 16px 0}
 .hfx-heroe--centro{padding:32px 16px 0;text-align:center}
 html body.hf-movil:not(#hf):not(#hf) .hfx-h1{margin:0;color:#fff;font:800 40px/40px var(--font);letter-spacing:-.02em;text-transform:uppercase;overflow-wrap:anywhere}
 .hfx-h1 em{font-style:normal;color:var(--hf-lima)}
 html body.hf-movil:not(#hf):not(#hf) .hfx-heroe--centro .hfx-h1{font-size:27px;line-height:36px;letter-spacing:-.8px}
 .hfx-heroe__sub{margin:12px 0 0;color:var(--hf-gris);font:400 14px/20px var(--font)}
 .hfx-cabeza--grande{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding:0 16px 16px}
 .hfx-cabeza__txt{min-width:0}
 html body.hf-movil:not(#hf):not(#hf) .hfx-cabeza--grande h2{margin:0;color:#fff;font:800 28px/36px var(--font);letter-spacing:.02em;text-transform:uppercase;overflow-wrap:anywhere}
 .hfx-cabeza--grande p{margin:2px 0 0;color:rgb(255 255 255/.6);font:400 14px/20px var(--font)}
 .hfx-ver-todo{flex:none;display:inline-flex;align-items:center;gap:4px;padding:10px 0 10px 10px;border:0;background:none;color:#fff;font:600 14px/20px var(--font);white-space:nowrap;cursor:pointer}
 .hfx-ver-todo .ic{width:12px;height:12px}
 /* En árabe y urdu, el › de las filas y de «Ver todo» apunta hacia delante (la izquierda). */
 html[dir="rtl"] :is(.hfx-fila,.hfx-ver-todo,.hfx-cabeza h2>button)>.ic{transform:scaleX(-1)}

 /* ---- Pestañas (barra de 44, radio 12, blanco 8 %; la activa #2E3031) ---- */
 .hfx-pestanas-caja{position:sticky;top:0;z-index:3;padding:8px 16px;background:var(--hf-lienzo)}
 .hfx-pestanas{display:flex;gap:4px;box-sizing:border-box;height:44px;padding:4px;overflow-x:auto;border-radius:12px;background:rgb(255 255 255/.08);scrollbar-width:none}
 .hfx-pestanas::-webkit-scrollbar{display:none}
 .hfx-pestanas-caja::after{content:"";position:absolute;top:8px;right:16px;bottom:8px;width:48px;border-radius:0 12px 12px 0;background:linear-gradient(270deg,color-mix(in srgb,#fff 8%,var(--hf-lienzo)),transparent);pointer-events:none;transition:opacity .2s}
 .hfx-pestanas-caja.is-final::after{opacity:0}
 /* En árabe y urdu la barra se desliza hacia la izquierda: el «hay más» va allí. */
 html[dir="rtl"] .hfx-pestanas-caja::after{right:auto;left:16px;border-radius:12px 0 0 12px;background:linear-gradient(90deg,color-mix(in srgb,#fff 8%,var(--hf-lienzo)),transparent)}
 .hfx-pestana{flex:none;height:36px;padding:0 16px;border:0;border-radius:10px;background:none;color:rgb(255 255 255/.6);font:500 14px/20px var(--font);white-space:nowrap;cursor:pointer}
 .hfx-pestana[aria-selected="true"]{background:#2e3031;color:#f7f7f8}
 .hfx-pestana:focus-visible{outline:2px solid var(--hf-lima);outline-offset:-2px}
 /* Pestañas subrayadas (dentro de las hojas): la activa blanca con raya de 2px.
    Las demás en el gris de texto (#898A8B, 5,4:1 sobre #131313): el #626262 de Higgsfield da 3:1 y no llega al 4,5:1 de WCAG AA. */
 .hfx-subrayado{display:flex;gap:20px;margin:0 -16px;padding:0 16px;overflow-x:auto;border-bottom:1px solid rgb(255 255 255/.08);scrollbar-width:none}
 .hfx-subrayado::-webkit-scrollbar{display:none}
 .hfx-subrayado>button{flex:none;position:relative;padding:10px 0 12px;border:0;background:none;color:var(--hf-gris,#898a8b);font:500 14px/18px var(--font);white-space:nowrap;cursor:pointer}
 .hfx-subrayado>button[aria-selected="true"]{color:#fff}
 .hfx-subrayado>button[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;border-radius:2px;background:#fff}

 /* ---- Buscador en línea: 44 de alto, radio 12, blanco 4 % y letra de 16 (sin zoom en iOS) ---- */
 .hfx-buscar-linea{display:flex;align-items:center;gap:8px;box-sizing:border-box;height:44px;margin:32px 16px 20px;padding:0 6px 0 12px;border:1px solid transparent;border-radius:12px;background:rgb(255 255 255/.04);box-shadow:0 4px 12px rgb(0 0 0/.12)}
 .hfx-buscar-linea label{flex:1;display:flex;align-items:center;gap:10px;min-width:0;color:var(--hf-gris)}
 .hfx-buscar-linea .ic{width:20px;height:20px}
 .hfx-buscar-linea input{flex:1;min-width:0;height:40px;padding:0;border:0;background:none;color:#fff;font:400 16px/20px var(--font);outline:0}
 .hfx-buscar-linea input::placeholder{color:var(--hf-gris)}
 .hfx-buscar-linea input::-webkit-search-cancel-button{display:none}
 .hfx-buscar-linea input:is(:focus,:focus-visible){outline:0!important;box-shadow:none!important;border:0!important}
 .hfx-buscar-linea:focus-within{border-color:rgb(209 254 23/.45)}
 .hfx-buscar-linea__x{display:grid;place-items:center;flex:none;width:32px;height:32px;padding:0;border:0;border-radius:50%;background:rgb(255 255 255/.08);color:#fff;cursor:pointer}

 /* ---- Carril de tarjetas (Apps): 248 de ancho, radio 16, gap 16; la siguiente asoma ---- */
 .hfx-carril{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;padding:0 16px 4px;scrollbar-width:none}
 .hfx-carril::-webkit-scrollbar{display:none}
 .hfx-app{flex:0 0 248px;display:grid;align-content:start;gap:12px;box-sizing:border-box;padding:16px;border:1px solid rgb(255 255 255/.04);border-radius:16px;background:#131517;color:#fff;font:inherit;text-align:left;scroll-snap-align:start;box-shadow:inset 2px 2px 2px rgb(255 255 255/.02);cursor:pointer}
 .hfx-app__medio{position:relative;display:block;aspect-ratio:214/207;overflow:hidden;border-radius:12px;background:var(--hf-tarjeta)}
 .hfx-app__medio :is(img,video){position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
 .hfx-app__nom{display:block;overflow:hidden;font:600 16px/24px var(--font);white-space:nowrap;text-overflow:ellipsis}
 .hfx-app__txt{display:-webkit-box;overflow:hidden;color:rgb(255 255 255/.6);font:400 14px/20px var(--font);-webkit-line-clamp:2;-webkit-box-orient:vertical}
 /* Sellos inclinados: NUEVO (lima), BETA, GRATIS, PRONTO y OFF. Texto de
    12/800, que no cuenta como grande: todos con 4,5:1 o más (WCAG AA).
    GRATIS 5,4:1 (el #1f8f4e de antes daba 4,1) y NO DISPONIBLE 6,4:1 (el
    gris #898A8B daba 3,2). Lo mismo en la insignia GRATIS de las filas. */
 .hfx-sello{display:inline-flex;align-items:center;height:18px;padding:0 6px;border-radius:4px;background:var(--hf-lima);color:#000;font:800 12px/18px var(--font);text-transform:uppercase;white-space:nowrap;transform:skewX(-10deg)}
 .hfx-app__medio .hfx-sello{position:absolute;left:8px;bottom:8px;z-index:1}
 .hfx-sello[data-tipo="beta"]{background:#9d4edd;color:#fff}
 .hfx-sello[data-tipo="gratis"]{background:#177a41;color:#fff}
 .hfx-sello[data-tipo="pronto"]{background:rgb(255 255 255/.12);color:#fff}
 .hfx-sello[data-tipo="off"]{background:#3a3c3f;color:#c4c5c6}
 /* Chip de comando («/ cocuyo_cotizar»): cuadrito lima de 20 con una «/». */
 .hfx-chip-cmd{display:inline-grid;place-items:center;flex:none;width:20px;height:20px;border-radius:5px;background:linear-gradient(120deg,#d1fe17,#fff599);box-shadow:inset 0 1px 2px rgb(255 255 255/.5);color:#080809;font:700 14px/1 var(--font)}
 .hfx-chip-cmd::before{content:"/"}

 /* ---- Vacío grande: carpeta de 60×48, título 16/24, texto gris y botón oscuro ---- */
 .hfx-vacio-grande{display:grid;justify-items:center;gap:8px;max-width:260px;margin:0 auto;padding:48px 16px;text-align:center}
 .hfx-vacio-grande__ic{width:60px;height:48px;margin-bottom:8px;color:var(--hf-lima)}
 html body.hf-movil:not(#hf):not(#hf) .hfx-vacio-grande h2{margin:0;color:#fff;font:600 16px/24px var(--font);letter-spacing:.01em}
 .hfx-vacio-grande p{margin:0 0 12px;color:var(--hf-gris);font:600 16px/24px var(--font)}
 /* Pie de rejilla que se funde, con «Ver todo ›» translúcido (blanco 10 %, blur 40). */
 .hfx-fundido{position:relative;display:flex;justify-content:center;margin-top:-120px;padding:72px 16px 16px;background:linear-gradient(180deg,transparent,var(--hf-lienzo) 62%)}
 .hfx-fundido>button{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 16px;border:0;border-radius:10px;background:rgb(255 255 255/.1);color:#fff;font:500 14px/16px var(--font);-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);cursor:pointer}

 /* ---- Hoja alta (784 de alto, radio 16 16 0 0, #131313) ---- */
 .hf-hoja.hf-hoja--alta{height:min(784px,calc(100dvh - 24px));max-height:calc(100dvh - 24px);padding:0 16px calc(16px + env(safe-area-inset-bottom,0px));border-radius:16px 16px 0 0;background:#131313}
 .hf-hoja--alta .hf-hoja__cab{justify-content:flex-start;height:56px}
 html body.hf-movil:not(#hf):not(#hf) .hf-hoja--alta .hf-hoja__cab h2{font:500 18px/24px var(--font)}
 /* Botón de 44×44 (zona de toque entera) con el círculo de 32 que se ve, pintado dentro. */
 .hf-hoja--alta .hf-hoja__cerrar{right:-6px;width:44px;height:44px;border-radius:999px;background:radial-gradient(circle,rgb(255 255 255/.05) 15.5px,transparent 16px)}
 .hf-hoja__cuerpo{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}

 /* ---- Aviso breve bajo la cabecera (role=status; capa superior, encima de las hojas) ---- */
 .hfx-aviso{position:fixed;inset:calc(var(--st-top) + 8px) 16px auto;z-index:75;box-sizing:border-box;width:auto;max-width:420px;margin:0 auto;padding:12px 16px;border:0;border-radius:12px;background:var(--hf-tarjeta);color:#fff;font:500 14px/20px var(--font);text-align:center;box-shadow:0 8px 24px rgb(0 0 0/.45),inset 0 0 0 1px rgb(255 255 255/.08);pointer-events:none}
 /* Con una hoja abierta: encima de su pie (ui.aviso calcula --hfx-aviso-abajo), no sobre su título ni su X. */
 .hfx-aviso.is-sobre-hoja{top:auto;bottom:var(--hfx-aviso-abajo,calc(16px + env(safe-area-inset-bottom,0px)))}
 /* Siempre pintado (la región role=status ya está en el árbol accesible antes del
    primer aviso); vacío, visualmente oculto. Lo mismo la región de cada hoja (.hfx-voz). */
 .hf-movil .hfx-aviso{display:block}
 .hf-movil .hfx-aviso:empty,.hfx-voz{width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;background:none;box-shadow:none}
 .hfx-voz{position:absolute}
 @media(prefers-reduced-motion:reduce){.hfx-cta,.hfx-pestanas-caja::after{transition:none}}
}

/* ============ Conectores del Estudio móvil (Higgsfield «/mcp», 8-oct-2026) ============
   Módulo: assets/js/estudio-movil-conectores.js (pantalla 'conectores' del
   registro común), datos en conectores-datos.js. Lienzo #080809 (bloque
   común). Medidas de su web móvil (capturas/hf-ref/conectores-*): héroe
   centrado de 27/36 con las insignias de 30 dentro del título, botones
   blancos 3D y la hoja «Cómo conectar» de 784. Optimizado (revisión del
   8-oct): barra fija en una fila de 80, «Dónde funciona» en una fila de 5
   asistentes, ideas compactas con la petición entera, el control y las
   herramientas en una sola sección y modelos 16:9. Los iconos de los
   clientes son los SVG locales de assets/brand/conectores (máscara en
   currentColor). Solo en el teléfono: el escritorio no cambia. */
@media(max-width:900px){
 /* Sin la burbuja de ayuda en Conectores: con sesión tapaba el extremo derecho de «Conectar con ChatGPT»
    en la barra fija y el toque abría la ayuda. La ayuda sigue al final de la pantalla («Ayuda de Cocuyo»,
    [data-cocuyo-ayuda]), en Comunidad y en la cuenta. */
 html body.studio-workbench.hf-movil[data-hf-pantalla="conectores"] #cocuyo-chat-raiz .cchat-btn{display:none!important}
 .hfcn .ic{width:16px;height:16px}
 .hfcn-ic{display:inline-block;flex:none;width:20px;height:20px;background:currentColor;-webkit-mask:var(--hfcn-ic) center/contain no-repeat;mask:var(--hfcn-ic) center/contain no-repeat}
 /* Los 4 logos (assets/brand/conectores/*.svg, 5,9 KB) van aquí en data: URI: así el
    héroe, la barra y la hoja nunca salen un fotograma sin ellos (un archivo aparte
    llega después del primer pintado). Si cambia un .svg, cambia también su copia. */
 .hfcn-ic[data-c="claude"]{--hfcn-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='m5.93 15.3 5.94-.21 2.07 1.81 1.94 1.89h-.19l-.66-.04-2.25-.06-1.95-.08-1.89-.1-.48-.1L2.01 11.82l.05-.29.4-.27.57.05 1.26.09 1.9.13 1.38.08 2.04.21h.32l.05-.13-.11-.08-.09-.08-1.96-1.33-2.12-1.41-1.11-.81-.6-.41-.3-.38-.13-.84.55-.6.73.05.19.05.74.57 1.59 1.23L9.41 9.17l.3.25.12-.09.02-.06-.14-.23-1.13-2.04-1.2-2.07-.54-.86-.14-.52c-.05-.21-.09-.39-.09-.61l.62-.84L7.58 2 8.41 2.11l.35.3.52 1.18.83 1.86 1.3 2.52.38.75.2.69.08.21h.13v-.12l.11-1.42.2-1.75.19-2.25.07-.63.31-.76.62-.41.49.23.4.57-.06.37-.24 1.54-.47 2.42-.3 1.62h.18l.2-.2.82-1.09 1.38-1.72.61-.68.71-.75.46-.36h.86l.63.94-.28.97-.89 1.12-.73.95-1.05 1.42-.66 1.13.06.09.16-.02 2.38-.51 1.29-.23 1.53-.26.69.32.08.33-.27.67-1.64.4-1.92.38-2.86.68-.04.03.04.05 1.29.12.55.03h1.35l2.51.19.66.44.39.53-.07.4-1.01.52-1.37-.32-3.19-.76-1.09-.27h-.15v.09l.91.89 1.67 1.51 2.09 1.94.11.48-.27.38-.28-.04-1.84-1.38-.71-.62-1.6-1.35h-.11v.14l.37.54 1.95 2.93.1.9-.14.29-.51.18-.56-.1-1.14-1.6-1.18-1.81-.95-1.62-.12.07-.56 6.05-.26.31-.61.23-.51-.38-.27-.62.27-1.23.32-1.6.26-1.28.24-1.58.14-.53-.01-.04-.12.02-1.19 1.64-1.82 2.45-1.44 1.54-.34.14-.6-.31.06-.55.33-.49 1.99-2.53 1.2-1.57.77-.91-.01-.13h-.05L5.45 17.47l-.94.12-.4-.38.05-.62.19-.2 1.59-1.09 0 .01Z'/%3E%3C/svg%3E")}
 .hfcn-ic:is([data-c="chatgpt"],[data-c="codex"]){--hfcn-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M20.57 10.18a4.99 4.99 0 0 0-.43-4.09C19.05 4.19 16.86 3.21 14.71 3.67A5.06 5.06 0 0 0 6.15 5.48a4.99 4.99 0 0 0-3.33 2.42c-1.1 1.9-.85 4.29.62 5.91a4.98 4.98 0 0 0 .43 4.09c1.09 1.9 3.29 2.88 5.43 2.42a4.99 4.99 0 0 0 3.76 1.68c2.2 0 4.14-1.42 4.81-3.51a4.99 4.99 0 0 0 3.33-2.42c1.09-1.89.84-4.27-.62-5.89Zm-7.52 10.51a3.73 3.73 0 0 1-2.4-.87l.12-.07 3.98-2.3a.66.66 0 0 0 .33-.57v-5.61l1.68.97c.02.01.03.02.03.04v4.65c0 2.07-1.68 3.74-3.75 3.75Zm-8.05-3.44a3.73 3.73 0 0 1-.45-2.51l.12.07 3.99 2.3a.64.64 0 0 0 .65 0l4.87-2.81v1.94a.07.07 0 0 1-.03.05l-4.03 2.33c-1.79 1.03-4.08.42-5.12-1.37ZM3.95 8.58a3.74 3.74 0 0 1 1.97-1.64v4.73a.64.64 0 0 0 .32.56l4.85 2.8-1.68.97a.06.06 0 0 1-.06 0L5.32 13.68c-1.79-1.04-2.4-3.33-1.37-5.12v.02Zm13.83 3.21-4.86-2.82L14.6 8a.06.06 0 0 1 .06 0l4.03 2.33a3.75 3.75 0 0 1-.56 6.75v-4.73a.66.66 0 0 0-.34-.56Zm1.68-2.52-.12-.07-3.98-2.32a.65.65 0 0 0-.65 0L9.84 9.69V7.75a.06.06 0 0 1 .02-.05l4.03-2.32a3.75 3.75 0 0 1 5.57 3.88v.02ZM8.92 12.72l-1.68-.97a.07.07 0 0 1-.03-.05V7.06a3.75 3.75 0 0 1 6.15-2.88l-.12.07-3.98 2.3a.66.66 0 0 0-.33.57l0 5.6Zm.91-1.97 2.17-1.25 2.17 1.25v2.5l-2.16 1.25-2.17-1.25 0-2.5Z'/%3E%3C/svg%3E")}
 .hfcn-ic[data-c="cli"]{--hfcn-ic:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 6-5 6 5 6M17 6l5 6-5 6M14 3l-4 18'/%3E%3C/svg%3E")}
 .hfcn-ic[data-c="cursor"]{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='395 390 176 202'%3E%3Cpath fill='%2372716D' d='M483.395 490.5L566 538.297C565.493 539.178 564.757 539.93 563.845 540.456L486.636 585.13C484.632 586.29 482.159 586.29 480.154 585.13L402.945 540.456C402.034 539.93 401.297 539.178 400.79 538.297L483.395 490.5Z'/%3E%3Cpath fill='%2355544F' d='M483.395 395V490.5L400.79 538.297C400.282 537.416 400 536.398 400 535.346V445.654C400 443.545 401.122 441.6 402.945 440.544L480.15 395.87C481.154 395.29 482.273 395 483.391 395H483.395Z'/%3E%3Cpath fill='%2343413C' d='M565.996 442.703C565.489 441.822 564.752 441.07 563.841 440.544L486.632 395.87C485.632 395.29 484.513 395 483.395 395V490.5L566 538.297C566.507 537.416 566.789 536.398 566.789 535.346V445.654C566.789 444.598 566.511 443.588 566 442.703H565.996Z'/%3E%3Cpath fill='%23D6D5D2' d='M560.218 446.049C560.686 446.858 560.751 447.896 560.218 448.82L485.235 578.974C484.732 579.855 483.392 579.493 483.392 578.479V492.713C483.392 492.029 483.209 491.37 482.877 490.794L560.215 446.045H560.218V446.049Z'/%3E%3Cpath fill='white' d='M560.218 446.049L482.88 490.797C482.552 490.224 482.073 489.737 481.48 489.394L407.369 446.511C406.49 446.006 406.851 444.663 407.862 444.663H557.824C558.889 444.663 559.754 445.239 560.218 446.049Z'/%3E%3C/svg%3E") center/contain no-repeat;-webkit-mask:none;mask:none}
 /* Rejilla lima en perspectiva (la de .hfx-conectores de Explorar). */
 .hfcn-rejilla{position:absolute;inset:auto -40% -34% -40%;height:78%;background-image:linear-gradient(rgb(209 254 23/.16) 1px,transparent 1px),linear-gradient(90deg,rgb(209 254 23/.16) 1px,transparent 1px);background-size:28px 28px;transform:perspective(260px) rotateX(58deg);transform-origin:top;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000,transparent 92%);mask-image:linear-gradient(180deg,#000,transparent 92%)}
 /* La pantalla deja sitio a la barra de una fila (80) y el foco con teclado no queda debajo. */
 .hf-movil .hf-pantalla.hfcn:not([hidden]){padding-bottom:calc(88px + env(safe-area-inset-bottom,0px));scroll-padding-bottom:calc(96px + env(safe-area-inset-bottom,0px));scroll-padding-top:8px}

 /* ---- 1. Héroe ---- */
 /* Abajo 32 (como arriba): sin la línea de conexiones mide ≤ 235 también a 390-414. */
 .hfcn-heroe{position:relative;overflow:hidden;padding:32px 16px;isolation:isolate}
 .hfcn-heroe>.hfcn-rejilla{z-index:-1;inset:auto -60% 0 -60%;height:62%;opacity:.8;-webkit-mask-image:linear-gradient(180deg,transparent,#000 30%,#000 55%,transparent 95%);mask-image:linear-gradient(180deg,transparent,#000 30%,#000 55%,transparent 95%)}
 /* Brillo lima: entero dentro del héroe (el óvalo acaba justo en su borde de abajo), sin corte recto. */
 .hfcn-heroe::before{content:"";position:absolute;z-index:-1;left:50%;bottom:0;width:420px;height:180px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgb(209 254 23/.12),transparent);pointer-events:none}
 /* Dos líneas, como en Higgsfield: la letra baja con el ancho (Geist es más ancha que Space Grotesk). */
 html body.hf-movil:not(#hf):not(#hf) .hfcn-heroe .hfx-h1.hfcn-h1{max-width:358px;margin:0 auto;font-size:clamp(20px,calc((100vw - 32px) / 14.6),27px);line-height:1.36}
 .hfcn-h1__l1,.hfcn-h1__l2{display:block}
 .hfcn-insignias{display:inline-flex;vertical-align:-5px;margin:0 2px}
 .hfcn-insignia{display:inline-grid;place-items:center;box-sizing:border-box;width:30px;height:30px;padding:2px;border:1px solid rgb(255 255 255/.2);border-radius:7px;color:#fff;box-shadow:0 4px 4px rgb(0 0 0/.08),inset 0 2px 4px rgb(255 255 255/.24)}
 .hfcn-insignia[data-c="chatgpt"]{background:#222}
 .hfcn-insignia[data-c="claude"]{margin-left:-3px;background:#d97757}
 .hfcn-insignia .hfcn-ic{width:18px;height:18px}
 .hfcn-heroe .hfx-heroe__sub{margin-top:8px}
 /* Dirección con copiar; también en el paso 2 de la hoja. */
 .hfcn-url{display:flex;align-items:center;gap:8px;box-sizing:border-box;max-width:358px;height:52px;margin:16px auto 0;padding:4px 4px 4px 14px;border:1px solid rgb(255 255 255/.06);border-radius:12px;background:rgb(255 255 255/.05);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
 /* La dirección no se corta nunca: el que cede es el botón (y, si su texto no cabe entero, se queda en el icono: .is-icono). */
 .hfcn-url code{flex:1 0 auto;color:#fff;font:500 14px/20px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-align:left;white-space:nowrap}
 .hfcn-url__copiar{flex:0 1 auto;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:44px;height:44px;padding:0 12px;overflow:hidden;border:0;border-radius:9px;background:#23262a;color:#fff;font:600 13px/16px var(--font);cursor:pointer}
 .hfcn-url__copiar .ic{flex:none}
 .hfcn-url__copiar span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
 .hfcn-url__copiar.is-icono{flex:none;width:44px;padding:0}
 .hfcn-url__copiar.is-icono span{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
 /* «N conexiones activas · Gestionar» (con sesión): lleva a Mis conexiones. */
 .hfcn-activas{display:inline-flex;align-items:center;gap:8px;box-sizing:border-box;min-height:44px;margin:12px auto 0;padding:0 16px 0 12px;border:1px solid rgb(255 255 255/.08);border-radius:999px;background:rgb(255 255 255/.04);color:#fff;font:500 14px/20px var(--font);cursor:pointer}
 .hfcn-activas__logos{display:inline-flex;align-items:center;gap:4px}
 .hfcn-activas .hfcn-ic{width:20px;height:20px}
 .hfcn-activas .hfcn-ic[data-c="claude"]{color:#d97757}
 /* Mientras llega cuenta.php (con sesión): el mismo sitio, sin botón, para que nada salte. */
 .hfcn-activas.is-cargando{display:flex;width:max-content;max-width:100%;color:#898a8b;cursor:default}
 .hfcn-activas.is-cargando>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}

 /* ---- Secciones ---- */
 .hfcn-sec{padding-top:40px}
 .hfcn-sec .hfx-cabeza--grande{padding-bottom:16px}
 html body.hf-movil:not(#hf):not(#hf) .hfcn-sec .hfx-cabeza--grande h2{font-size:24px;line-height:30px;letter-spacing:-.01em}
 .hfcn-sec .hfx-cabeza--grande p{margin-top:4px}
 /* «Actualizar» centrado con su título, como «Ver todo» en Apps. */
 .hfcn-sec .hfx-cabeza--grande{align-items:center}
 .hfcn-sec .hfx-cabeza--grande .hfx-cabeza__txt{flex:1}

 /* ---- 2. Dónde funciona: los 5 asistentes en una fila (azulejos de 56, radio 16) ---- */
 .hfcn-asistentes{display:grid;grid-template-columns:repeat(5,56px);justify-content:space-between;padding:0 16px}
 .hfcn-asistente{display:grid;justify-items:center;gap:4px;width:56px;padding:0;border:0;background:none;color:#fff;font:inherit;cursor:pointer}
 .hfcn-asistente__nom{max-width:64px;overflow:hidden;color:rgb(255 255 255/.8);font:500 12px/16px var(--font);white-space:nowrap;text-overflow:ellipsis}
 .hfcn-azulejo{position:relative;display:grid;place-items:center;flex:none;width:64px;height:64px;border:1px solid rgb(255 255 255/.18);border-radius:16px;background:#222;color:#fff;box-shadow:0 10px 24px rgb(0 0 0/.45),inset 0 2px 6px rgb(255 255 255/.18)}
 .hfcn-asistente .hfcn-azulejo{box-sizing:border-box;width:56px;height:56px;box-shadow:0 8px 16px rgb(0 0 0/.4),inset 0 2px 6px rgb(255 255 255/.18)}
 .hfcn-azulejo .hfcn-ic{width:34px;height:34px}
 .hfcn-asistente .hfcn-azulejo .hfcn-ic{width:28px;height:28px}
 .hfcn-azulejo[data-c="claude"]{background:#d97757}
 .hfcn-azulejo[data-c="cursor"]{background:#14120b}
 .hfcn-azulejo[data-c="cli"]{background:#1c1e21;color:var(--hf-lima)}

 /* Fichas con icono gris (herramientas del conector). */
 .hfcn-chips{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;padding:0}
 .hfcn-ficha{display:inline-flex;align-items:center;gap:6px;box-sizing:border-box;height:28px;padding:6px 10px 6px 6px;border-radius:8px;background:rgb(255 255 255/.05);color:#fff;font:500 12px/16px var(--font);white-space:nowrap}
 .hfcn-ficha :is(.ic,.hfcn-ic){width:16px;height:16px;color:#898a8b}

 /* ---- 3. Ideas: tarjeta con la petición entera y «Copiar idea» a todo el ancho ---- */
 .hfcn-ideas{list-style:none;display:grid;gap:12px;margin:0;padding:0 16px}
 .hfcn-idea{display:grid;gap:8px;padding:16px;border:1px solid rgb(255 255 255/.04);border-radius:16px;background:#131517;box-shadow:inset 2px 2px 2px rgb(255 255 255/.02);cursor:pointer}
 .hfcn-idea__cab{display:flex;align-items:center;gap:8px}
 .hfcn-idea__cab>.ic{flex:none;width:20px;height:20px;color:var(--hf-lima)}
 html body.hf-movil:not(#hf):not(#hf) .hfcn-idea__t{margin:0;color:#fff;font:500 18px/24px var(--font);letter-spacing:0}
 .hfcn-idea__txt{margin:0;color:rgb(255 255 255/.6);font:400 15px/22px var(--font)}
 .hfcn-idea__copiar{display:flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;width:100%;min-height:44px;margin-top:4px;padding:0 14px;border:0;border-radius:12px;background:#23262a;color:#fff;font:500 14px/16px var(--font);cursor:pointer}

 /* ---- 4. Ves el coste (control, icono lima de 20 sin baldosa) y lo que puede hacer (fichas por permiso) ---- */
 .hfcn-control{list-style:none;display:grid;gap:4px;margin:0;padding:0 16px}
 .hfcn-control li{display:flex;align-items:flex-start;gap:12px;padding:8px 0}
 .hfcn-control li>.ic{flex:none;width:20px;height:20px;color:var(--hf-lima)}
 .hfcn-control li>span{flex:1;min-width:0;display:grid;gap:2px}
 .hfcn-control b{color:#fff;font:500 15px/20px var(--font)}
 .hfcn-control small{color:rgb(255 255 255/.5);font:400 13px/18px var(--font)}
 .hfcn-puede{display:grid;gap:8px;margin:16px 16px 0;padding-top:16px;border-top:1px solid rgb(255 255 255/.06)}
 /* Los dos grupos se separan por el espacio (16, el doble que entre filas) y empiezan por
    su título: icono y texto en negrita, sin fondo de ficha (no parece otra herramienta). */
 .hfcn-puede__fila+.hfcn-puede__fila{margin-top:8px}
 .hfcn-estado.hfcn-puede__et{gap:6px;min-height:28px;padding:0 4px 0 0;background:none!important;font-weight:600}
 .hfcn-puede__et .ic{width:16px;height:16px}
 html body.hf-movil:not(#hf):not(#hf) .hfcn-puede h3{margin:0 0 4px;color:#fff;font:500 16px/24px var(--font);letter-spacing:0}

 /* ---- 6. Modelos: fotos 16:9 en 2 columnas (solo informan: sin aspecto de botón) ---- */
 .hfcn-modelos{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0;padding:0 16px}
 .hfcn-modelo{position:relative;display:flex;flex-direction:column;overflow:hidden;border-radius:16px;background:#1c1e21}
 /* La foto se funde del todo antes del nombre (que empieza al 72-74 % de su alto): el
    nombre va entero sobre la banda sólida, como en Higgsfield, también con fotos claras. */
 .hfcn-modelo img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;-webkit-mask-image:linear-gradient(180deg,#000 40%,transparent 70%);mask-image:linear-gradient(180deg,#000 40%,transparent 70%)}
 .hfcn-modelo__banda{display:grid;justify-items:center;gap:2px;margin-top:-26px;padding:0 8px 12px;text-align:center}
 .hfcn-modelo__banda b{max-width:100%;overflow:hidden;color:#fff;font:600 15px/20px var(--font);white-space:nowrap;text-overflow:ellipsis}
 .hfcn-modelo__banda small{display:inline-flex;align-items:center;gap:4px;color:#898a8b;font:500 12px/16px var(--font)}
 .hfcn-modelo__banda small .ic{width:13px;height:13px}
 .hfcn-nota{margin:14px 16px 0;color:#898a8b;font:400 13px/19px var(--font)}

 /* ---- 5. Mis conexiones ---- */
 .hfcn-actualizar{gap:6px!important;min-height:44px;padding-block:0!important}
 .hfcn-actualizar .ic{width:16px!important;height:16px!important}
 .hfcn-actualizar:disabled{opacity:.5;cursor:default}
 .hfcn-cuenta{margin:0 16px;padding:16px;border:1px solid rgb(255 255 255/.04);border-radius:16px;background:#131517;box-shadow:inset 2px 2px 2px rgb(255 255 255/.02)}
 .hfcn-cuenta__estado{margin:0 0 4px;color:#898a8b;font:400 14px/20px var(--font)}
 /* Siempre pintada (role=status ya en el árbol accesible); vacía no ocupa sitio. */
 .hfcn-cuenta__estado:empty{margin:0}
 .hfcn-cuenta__estado.is-error{color:#ff7a6b}
 .hfcn-cuenta__entrar p{margin:0 0 16px;color:#d6d7d8;font:400 14px/20px var(--font)}
 .hfcn-cuenta__id{margin:0 0 8px;overflow:hidden;color:#898a8b;font:500 13px/18px var(--font);white-space:nowrap;text-overflow:ellipsis}
 .hfcn-conexiones{list-style:none;display:grid;margin:0;padding:0}
 .hfcn-conexion{display:flex;align-items:flex-start;gap:12px;padding:14px 0;border-top:1px solid rgb(255 255 255/.06)}
 .hfcn-conexion__cab{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-width:0;min-height:44px}
 .hfcn-conexion:first-child{border-top:0}
 .hfcn-azulejo--chico{width:40px;height:40px;border-radius:10px;box-shadow:none}
 .hfcn-azulejo--chico .hfcn-ic,.hfcn-azulejo--chico .ic{width:20px;height:20px}
 .hfcn-conexion__txt{flex:1;min-width:0;display:grid;justify-items:start;gap:4px}
 .hfcn-conexion__txt b{flex:1;min-width:0;max-width:100%;overflow:hidden;color:#fff;font:600 15px/20px var(--font);white-space:nowrap;text-overflow:ellipsis}
 .hfcn-conexion__txt small{color:#898a8b;font:400 12px/16px var(--font)}
 .hfcn-estado{display:inline-flex;align-items:center;min-height:22px;padding:2px 8px;border-radius:6px;background:rgb(255 255 255/.08);color:#d6d7d8;font:500 12px/16px var(--font)}
 .hfcn-estado[data-tipo="crear"]{background:rgb(209 254 23/.14);color:var(--hf-lima)}
 .hfcn-estado[data-tipo="revocada"]{background:none;padding-left:0;color:#898a8b;text-decoration:line-through}
 .hfcn-conexion[data-tipo="revocada"] :is(.hfcn-azulejo,b){opacity:.5}
 .hfcn-conexion[data-tipo="revocada"] .hfcn-conexion__cab{min-height:20px}
 .hfcn-revocar{flex:none;height:44px;padding:0 12px;border:1px solid rgb(255 255 255/.1);border-radius:10px;background:#23262a;color:#fff;font:600 13px/16px var(--font);cursor:pointer}
 .hfcn-revocar.is-confirmar{border-color:rgb(255 122 107/.5);background:rgb(255 90 70/.14);color:#ff8f82}
 .hfcn-revocar:disabled{opacity:.5;cursor:default}
 .hfcn-vacio{padding:4px 0 8px;color:#d6d7d8;font:400 14px/20px var(--font)}
 .hfcn-enlace{display:flex;align-items:center;gap:10px;min-height:48px;margin-top:8px;padding:0 4px 0 0;border-top:1px solid rgb(255 255 255/.06);color:#fff;font:500 14px/20px var(--font);text-decoration:none}
 .hfcn-enlace span{flex:1;min-width:0}
 .hfcn-enlace .ic{color:#898a8b}
 .hfcn-enlace>.ic:last-child{width:16px;height:16px;color:#5c5c5c}
 .hfcn-mas{display:grid;gap:8px;padding:24px 16px 8px}
 .hfcn-mas .hfcn-enlace{margin:0;padding:0 14px;border:1px solid rgb(255 255 255/.04);border-radius:12px;background:#131517}
 /* «Ayuda de Cocuyo» (con sesión): con ella a la vista, chat.js quita su burbuja flotante. */
 button.hfcn-enlace{box-sizing:border-box;width:100%;text-align:left;cursor:pointer;-webkit-appearance:none;appearance:none}
 .hfcn-cargando{padding:48px 16px;color:#898a8b;font:400 14px/20px var(--font);text-align:center}
 /* Sin los datos: «Reintentar» (blanco) y el enlace a la página de Conectores, los dos de 48. */
 .hfcn-fallo{gap:12px;max-width:300px}
 .hfcn-fallo .hfx-cta{width:100%;min-height:48px}

 /* ---- Barra fija: «Claude» y «ChatGPT» en una fila (80 de alto: 16 + 48 + 16) ---- */
 .hfcn-pie{grid-template-columns:1fr 1fr;gap:8px;padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,transparent,var(--hf-lienzo) 16px)}
 .hfcn-pie .hfx-cta{min-width:0;padding-inline:12px}
 .hfcn-pie .hfx-cta>span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
 .hfcn-pie .hfcn-ic{width:20px;height:20px}
 .hfcn-pie .hfcn-ic[data-c="claude"]{color:#d97757}
 .hfcn-pie .hfcn-ic[data-c="chatgpt"]{color:#1a1a1a}
 @media(max-height:500px){.hfcn-pie{padding-top:12px}}
 /* Respaldo: si la burbuja de ayuda (.cchat-btn) llegara a verse, por encima de la barra. Con
    sesión no se ve: «Ayuda de Cocuyo» va dentro de la pantalla (chat.js la quita). */
 html body.studio-workbench.hf-movil[data-hf-pantalla="conectores"]:not(#hf) #cocuyo-chat-raiz .cchat-btn{bottom:calc(88px + env(safe-area-inset-bottom,0px))}

 /* ---- Hoja «Cómo conectar» ---- */
 /* El cuerpo ocupa todo el ancho de la hoja: así la barra de pestañas (margen −16) no lo desborda. */
 .hfcn-hoja .hf-hoja__cuerpo{margin:0 -16px;padding:0 16px 16px;overflow-x:hidden}
 /* Pestañas pegadas arriba; asoma la siguiente y un degradado marca el borde mientras quedan más. */
 .hfcn-pestanas-caja{position:sticky;top:0;z-index:1;margin:0 -16px;background:#131313}
 .hfcn-pestanas-caja::after{content:"";position:absolute;top:0;right:0;bottom:1px;width:40px;background:linear-gradient(270deg,#131313,rgb(19 19 19/0));pointer-events:none;transition:opacity .2s}
 .hfcn-pestanas-caja.is-final::after{opacity:0}
 .hfcn-pestanas.hfx-subrayado{gap:16px;margin:0}
 /* Las no activas en el gris de texto de .hfx-subrayado (#898A8B, 5,4:1 sobre #131313). */
 .hfcn-pestanas>button{display:inline-flex;align-items:center;gap:8px;padding:12px 0 14px;color:var(--hf-gris,#898a8b)}
 .hfcn-pestanas>button[aria-selected="true"]{color:#fff}
 .hfcn-pestanas .hfcn-ic{width:16px;height:16px}
 .hfcn-pestanas .hfcn-ic[data-c="claude"]{color:#d97757}
 .hfcn-pestanas>button:focus-visible{outline:2px solid var(--hf-lima);outline-offset:-2px}
 .hfcn-hoja__panel{padding-top:12px}
 .hfcn-dispositivo{display:flex;box-sizing:border-box;height:44px;margin:0 0 8px;padding:0 2px;border-radius:12px;background:rgb(255 255 255/.08)}
 .hfcn-dispositivo>button{position:relative;flex:1;height:44px;padding:0 14px;border:0;border-radius:12px;background:none;color:rgb(255 255 255/.6);font:500 14px/20px var(--font);cursor:pointer;isolation:isolate}
 .hfcn-dispositivo>button::before{content:"";position:absolute;inset:4px 2px;z-index:-1;border-radius:10px}
 .hfcn-dispositivo>button[aria-pressed="true"]{color:#f7f7f8}
 .hfcn-dispositivo>button[aria-pressed="true"]::before{background:#2e3031}
 .hfcn-pasos{list-style:none;display:grid;gap:8px;margin:0;padding:0}
 .hfcn-paso{display:flex;align-items:flex-start;gap:12px;padding:12px;border-radius:16px;background:rgb(255 255 255/.05)}
 .hfcn-paso__n{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:rgb(255 255 255/.1);color:#fff;font:500 14px/20px var(--font)}
 .hfcn-paso__txt{flex:1;min-width:0}
 html body.hf-movil:not(#hf):not(#hf) .hfcn-paso h3{margin:2px 0 4px;color:#fff;font:500 16px/24px var(--font);letter-spacing:0}
 .hfcn-paso p{margin:0;color:#898a8b;font:400 14px/20px var(--font)}
 .hfcn-url--hoja{max-width:none;margin:8px 0 0;-webkit-backdrop-filter:none;backdrop-filter:none}
 /* En la hoja, copiar con solo el icono: así la dirección se lee entera también a 360. */
 .hfcn-url--hoja .hfcn-url__copiar{justify-content:center;width:44px;padding:0}
 .hfcn-oculto{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
 .hfcn-codigo{position:relative;margin-top:12px}
 .hfcn-codigo pre{box-sizing:border-box;max-width:100%;margin:0;padding:12px 12px 60px;overflow-x:auto;border:1px solid rgb(255 255 255/.06);border-radius:10px;background:#0b0b0b;color:#e8e8e8;font:400 12.5px/19px ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}
 .hfcn-codigo--solo pre{padding-bottom:12px}
 .hfcn-flecha{display:inline-grid;place-items:center;margin-left:2px}
 .hfcn-flecha .ic{width:16px!important;height:16px!important}
 .hfcn-codigo__copiar{position:absolute;right:8px;bottom:8px;display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 12px;border:0;border-radius:8px;background:#23262a;color:#fff;font:600 13px/16px var(--font);cursor:pointer}
 .hfcn-hoja__lead{margin:0;color:#d6d7d8;font:400 14px/20px var(--font)}
 .hfcn-hoja__nota{margin:16px 0 0;color:#898a8b;font:400 13px/19px var(--font)}
 .hfcn-guia{display:inline-flex;align-items:center;min-height:44px;color:var(--hf-lima);font:500 14px/20px var(--font);text-decoration:none}
 .hfcn-hoja__pie{flex:none;display:grid;gap:8px;padding-top:12px}
 .hfcn-hoja__pie .hfcn-ic{width:20px;height:20px}
 .hfcn-hoja__pie .hfcn-ic[data-c="claude"]{color:#d97757}
 .hfcn-hoja__pie .hfcn-ic:is([data-c="chatgpt"],[data-c="codex"],[data-c="cli"]){color:#1a1a1a}
 .hfcn-descargar{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:44px;color:#fff;font:500 14px/16px var(--font);text-decoration:none}
 .hfcn :is(.hfcn-asistente,.hfcn-idea__copiar,.hfcn-url__copiar,.hfcn-activas,.hfcn-revocar,.hfcn-enlace):focus-visible,.hfcn-hoja :is(a,button):focus-visible{outline:2px solid var(--hf-lima);outline-offset:2px}
 @media(prefers-reduced-motion:reduce){.hfcn-pestanas-caja::after{transition:none}}
}

/* ============ Apps del Estudio móvil (Higgsfield «/apps», 8-oct-2026) ============
   Módulo: assets/js/estudio-movil-apps.js (pantalla 'apps' del registro común,
   cargada en diferido; datos de estudio-apps.js en solo lectura). Medidas de
   la app de Higgsfield (capturas/hf-ref/apps-1…4): lienzo #131517, héroe a la
   izquierda, buscador, pestañas pegadas arriba, secciones con título de 28 en
   MAYÚSCULAS y «Ver todo ›», carril de tarjetas de 248 (la primera sección con
   el medio a sangre y «▶ Usar») y, por categoría, rejillas de 2 columnas.
   El diálogo de escritorio (estudio-apps.css) no cambia. */
@media(max-width:900px){
 .hfa .hfa-heroe .hfx-heroe{padding:24px 16px 0}
 /* «APPS DE COCUYO» en una línea también a 360 (40 px a 390, como Higgsfield). */
 html body.hf-movil:not(#hf):not(#hf) .hfa .hfx-h1{font-size:min(40px,calc((100vw - 32px) / 8.75));line-height:1}
 .hfa .hfx-buscar-linea{margin:32px 16px 16px}
 .hfa-cuerpo{padding:40px 0 0}
 .hfa-sec{margin:0 0 48px}
 .hfa .hfx-cabeza--grande{align-items:center}
 .hfa .hfx-cabeza--grande .hfx-cabeza__txt{flex:1}
 /* Tarjetas del carril (.hfx-app): todas del mismo alto; nombre y texto abajo del medio. */
 .hfa-carril{align-items:stretch;padding-bottom:2px}
 .hfa-app{display:flex;flex-direction:column;gap:12px;width:248px;min-width:0;text-decoration:none}
 .hfa-app .hfx-app__medio{flex:none}
 .hfa-app__cuerpo{display:flex;flex-direction:column;gap:4px;min-width:0}
 .hfa-app .hfx-app__nom{line-height:24px}
 /* Nombre entero: hasta dos líneas en el carril y tres en la rejilla de 2
    columnas, donde caben ~20 letras por línea a 360 («Tarjeta de presentación
    de taller o concesionario»). En una sola línea se cortaban «Felicitación del
    Día de la Madre» y «…del Padre» en el mismo «Felicitación del Día de…». */
 .hfa :is(.hfa-app,.hfa-ficha) .hfx-app__nom{display:-webkit-box;white-space:normal;overflow-wrap:break-word;-webkit-line-clamp:2;-webkit-box-orient:vertical}
 .hfa .hfa-ficha .hfx-app__nom{-webkit-line-clamp:3}
 /* Primera sección: medio a sangre (246×238), cuerpo 12 16 y «▶ Usar» blanco de 32. */
 .hfa-app--grande{padding:0;gap:0;overflow:hidden}
 .hfa-app--grande .hfx-app__medio{aspect-ratio:246/238;border-radius:12px 12px 0 0}
 .hfa-app--grande .hfa-app__cuerpo{flex:1;padding:12px 16px}
 .hfa-usar{display:flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;height:32px;margin-top:auto;padding:4px 8px;border:1px solid rgb(0 0 0/.06);border-radius:8px;background:#fff;color:#131517;font:600 14px/20px var(--font);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
 .hfa-app--grande .hfx-app__txt{margin-bottom:20px}
 .hfa-usar .ic{width:12px;height:12px;fill:currentColor;stroke:none}
 @media(hover:hover){.hfa-app:hover{background:#1c1e21}.hfa-ficha:hover .hfx-app__medio{filter:brightness(1.08)}}
 .hfa-app:active,.hfa-ficha:active{transform:scale(.985)}
 /* Medio: póster (perezoso) y el vídeo encima cuando ya se ve; portada; icono de Útiles; o icono sobre fondo. */
 .hfa-medio>:is(img,video,.hfa-arte){position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
 .hfa-medio>video{opacity:0;transition:opacity .25s}
 .hfa-medio>video.is-listo{opacity:1}
 .hfa-medio>.hfx-sello{z-index:2}
 .hfa-arte{display:grid;place-items:center;box-sizing:border-box;background:radial-gradient(70% 70% at 50% 42%,rgb(209 254 23/.16),transparent 70%),var(--hf-tarjeta);color:var(--hf-lima)}
 .hfa-medio>.hfa-arte .ic{width:30%;height:30%;max-width:64px;max-height:64px;stroke-width:1.2}
 .hfa-medio>img.hfa-icono-util{background:#000}
 /* No disponible ahora: la tarjeta, atenuada (el sello se lee entero). */
 .hfa .is-off .hfa-medio>:not(.hfx-sello){opacity:.4}
 .hfa .is-off :is(.hfx-app__nom,.hfx-app__txt){color:rgb(255 255 255/.45)}
 .hfa .is-off .hfa-usar{opacity:.5}
 /* Rejillas de una categoría: 2 columnas de 173, medio 1:1, nombre 14/20 y texto en una línea. */
 .hfa-sec.hfa-sec--cat{margin-bottom:0}
 .hfa-sec--cat .hfx-cabeza--grande{padding-bottom:24px}
 .hfa-bloque{margin:0 0 32px;padding:0 16px}
 html body.hf-movil:not(#hf):not(#hf) .hfa-bloque__t{margin:0 0 12px;color:#fff;font:600 18px/24px var(--font);letter-spacing:0}
 .hfa-rejilla{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}
 .hfa-ficha{display:grid;align-content:start;gap:8px;min-width:0;padding:0;border:0;background:none;color:#fff;font:inherit;text-align:left;text-decoration:none;cursor:pointer}
 .hfa-ficha .hfx-app__medio{aspect-ratio:1}
 .hfa-ficha .hfa-app__cuerpo{gap:0}
 .hfa-ficha .hfx-app__nom{font:600 14px/20px var(--font)}
 .hfa-ficha .hfx-app__txt{display:block;overflow:hidden;font:400 13px/18px var(--font);white-space:nowrap;text-overflow:ellipsis}
 .hfa-ficha .hfx-sello{transform:skewX(-10deg) scale(.92);transform-origin:left bottom}
 .hfa-vacio{padding:32px 16px}
 /* Agente (beta, solo con acceso): una fila al principio de «Todas». */
 .hfa-agente{display:flex;align-items:center;gap:12px;box-sizing:border-box;width:calc(100% - 32px);margin:0 16px 40px;padding:12px;border:1px solid rgb(255 255 255/.06);border-radius:16px;background:var(--hf-tarjeta);color:#fff;font:inherit;text-align:left;cursor:pointer}
 .hfa-agente>.hfa-arte{flex:none;width:48px;height:48px;border-radius:12px}
 .hfa-agente>.hfa-arte .ic{width:24px;height:24px}
 .hfa-agente__txt{flex:1;min-width:0;display:grid;gap:2px}
 .hfa-agente__txt b{display:flex;align-items:center;gap:8px;font:600 16px/24px var(--font)}
 .hfa-agente__txt small{color:rgb(255 255 255/.6);font:400 14px/20px var(--font)}
 .hfa-agente>.ic{flex:none;width:16px;height:16px;color:#5c5c5c}
 /* «Muy pronto»: filas discretas, sin acción. */
 .hfa-pronto-sec{padding:0 16px}
 html body.hf-movil:not(#hf):not(#hf) .hfa-pronto-t{margin:0 0 8px;color:rgb(255 255 255/.85);font:600 18px/24px var(--font);letter-spacing:0}
 .hfa-pronto-lista{display:grid;gap:4px;margin:0;padding:0;list-style:none}
 .hfa-pronto{display:flex;align-items:center;gap:12px;min-height:56px;color:rgb(255 255 255/.7)}
 .hfa-pronto>.hfa-arte{flex:none;width:44px;height:44px;border-radius:10px;opacity:.7}
 .hfa-pronto>.hfa-arte .ic{width:20px;height:20px}
 .hfa-pronto__txt{flex:1;min-width:0;display:grid}
 .hfa-pronto__txt b{display:-webkit-box;overflow:hidden;font:500 14px/20px var(--font);overflow-wrap:break-word;-webkit-line-clamp:2;-webkit-box-orient:vertical}
 .hfa-pronto__txt small{overflow:hidden;color:var(--hf-gris);font:400 12px/16px var(--font);white-space:nowrap;text-overflow:ellipsis}
 .hfa-pronto>.hfx-sello{flex:none}
 @media(prefers-reduced-motion:reduce){.hfa-medio>video{transition:none}.hfa-app:active,.hfa-ficha:active{transform:none}}
}

/* ============ Útiles del Estudio móvil (Higgsfield «/apps» con las filas de «Explore», 8-oct-2026) ============
   Módulo: assets/js/estudio-movil-utiles.js (pantalla 'utiles' del registro
   común, cargada en diferido; datos de utiles-catalogo.js en solo lectura).
   El mismo héroe, buscador y pestañas que Apps (capturas/hf-ref/apps-1/2) y
   las filas .hfx-fila de Explorar (icono de 77×58, nombre, GRATIS y una línea
   gris). Lienzo #0b0b0b. utiles.html y /es/utiles/ no cambian. */
@media(max-width:900px){
 /* Abajo, sitio para que la última fila no quede bajo el botón de ayuda (.cchat-btn, con sesión).
    Arriba (scroll-padding-top), el alto de las pestañas pegadas (60) y 8 de aire:
    al subir con Mayús+Tab, la fila enfocada no queda debajo de ellas. */
 .hf-movil .hf-pantalla.hfu:not([hidden]){padding-bottom:calc(88px + env(safe-area-inset-bottom,0px));scroll-padding-top:68px}
 .hfu .hfu-heroe .hfx-heroe{padding:24px 16px 0}
 /* Dato contado del catálogo: «160 útiles gratis», con el número en lima. */
 .hfu-dato{display:inline-flex;align-items:center;gap:8px;margin:16px 0 0;padding:6px 12px 6px 10px;border-radius:999px;background:rgb(255 255 255/.06);color:rgb(255 255 255/.8);font:500 13px/18px var(--font)}
 .hfu-dato b{color:var(--hf-lima);font-weight:700}
 .hfu .hfu-dato .ic{width:16px;height:16px;color:var(--hf-lima)}
 .hfu .hfx-buscar-linea{margin:32px 16px 16px}
 .hfu-cuerpo{padding:32px 0 0}
 .hfu-sec{margin:0 0 40px}
 .hfu .hfx-cabeza--grande{align-items:center;padding-bottom:12px}
 .hfu .hfx-cabeza--grande .hfx-cabeza__txt{flex:1}
 .hfu-sec--cat .hfx-cabeza--grande{padding-bottom:16px}
 .hfu-sec--busqueda{margin-top:-16px}
 /* Filas: enlaces reales. Un nombre largo pasa a dos líneas antes que cortarse,
    con GRATIS detrás de la última palabra; la línea gris, en una. El recorte
    es de 3 líneas: si el nombre llena dos (de, it, ru, tr a 360; fr y pt a
    320), GRATIS baja a la tercera en vez de perderse. */
 .hfu .hfx-fila{box-sizing:border-box;color:#fff;text-decoration:none;-webkit-tap-highlight-color:transparent}
 .hfu .hfx-fila__nom{display:-webkit-box;overflow:hidden;-webkit-line-clamp:3;-webkit-box-orient:vertical;font:500 14px/20px var(--font)}
 /* El hueco va al final del nombre (también en rtl): si GRATIS baja de línea, empieza sin sangría. */
 .hfu .hfx-fila__nom b{display:inline;overflow:visible;margin-inline-end:8px;white-space:normal}
 .hfu .hfx-fila__nom .hfx-ins{display:inline-block;vertical-align:1px;line-height:18px}
 .hfu .hfx-fila__img .ic{width:24px;height:24px}
 .hfu .hfx-fila>.ic{flex:none;width:16px;height:16px;color:#5c5c5c}
 @media(hover:hover){.hfu .hfx-fila:hover .hfx-fila__nom b{color:var(--hf-lima)}}
 .hfu .hfx-fila:active{opacity:.75}
 .hfu-vacio{padding:32px 16px}
}

/* ============ Creaciones del Estudio móvil (Higgsfield «Assets», 8-oct-2026) ============
   La biblioteca real (#pg-library, la Bóveda de estudio-4.js) con el aspecto
   de «Assets» de Higgsfield (capturas/hf-ref/creaciones-1 y comunidad-shots-1).
   Módulo: assets/js/estudio-movil-creaciones.js (pone body.hf-en-creaciones,
   el título, los botones redondos de la barra, las hojas «Ver y ordenar» y
   de acciones del ⋯, y la pantalla 'creaciones' del visitante). El HTML de
   estudio-4.js no cambia. Peso: estudio-assets.css va suelto DESPUÉS del
   bundle con «body.studio-workbench:not(#f) #pg-library», así que aquí todo
   va con «html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on».
   Solo en el teléfono: el escritorio no cambia. */
.hfc-botones,.hfc-barra-sola{display:none}
@media(max-width:900px){
 /* Sin la burbuja de ayuda en Creaciones: tapaba la rejilla (la ayuda sigue en Comunidad y en la cuenta). */
 html body.studio-workbench.hf-movil:is(.hf-en-creaciones,[data-hf-pantalla="creaciones"]) #cocuyo-chat-raiz .cchat-btn{display:none!important}
 /* La cabecera de 56, como en Crear y en las pantallas (fuera del cuadro la común medía 64). */
 html body.studio-workbench.hf-movil.hf-en-creaciones:not(#hf):not(#hf) .sm-header{height:var(--st-top)}
 /* Y en rejilla ☰ · título · Mejorar (bloque común): fuera del cuadro de Crear
    (sin .sm-herramienta), barra-inferior.css, que carga después, la ponía en
    flex con el mismo peso y el título y Mejorar se quedaban pegados a ☰. */
 html body.studio-workbench.hf-movil:is(.hf-en-creaciones,[data-hf-pantalla]):not(#hf):not(#hf) .sm-header{display:grid!important}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on{background:#0b0b0b}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva{display:block;min-height:calc(100dvh - var(--st-top));color:#fff;font-family:var(--font)}

 /* ---- Píldoras pegadas arriba: el proyecto y las carpetas reales (33 de alto; el toque, 44) ---- */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-lateral{position:sticky;top:var(--st-top);z-index:20;display:flex;flex-direction:row;align-items:center;gap:8px;height:auto;margin:0;padding:0 12px 5px;overflow-x:auto;overflow-y:hidden;border:0;background:#0b0b0b;scrollbar-width:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-lateral::-webkit-scrollbar{display:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-carpetas{display:flex;flex:none;flex-direction:row;gap:8px;margin:0;padding:0;border:0}
 /* La lista de proyectos y el rótulo «Biblioteca», fuera: el proyecto va en la primera píldora. */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on :is(.bva-proyectos,.bva-carpetas>.bva-grupo){display:none!important}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-carpeta{position:relative;isolation:isolate;flex:none;display:inline-flex;align-items:center;gap:6px;width:auto;height:44px;min-height:0;margin:0;padding:0 14px;border:0;border-radius:17px;background:transparent;color:#fff;font:500 12px/15px var(--font);letter-spacing:0;white-space:nowrap;-webkit-tap-highlight-color:transparent}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-carpeta::before{content:"";position:absolute;inset:5.5px 0;z-index:-1;border-radius:17px;background:rgb(255 255 255/.05);transition:background .15s}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-carpeta[aria-current="true"]{background:transparent;color:#131517}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-carpeta[aria-current="true"]::before{background:#fff}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-carpeta:active::before{background:rgb(255 255 255/.12)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-carpeta[aria-current="true"]:active::before{background:#e8e8e8}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-carpeta>:is(span,svg){display:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-carpeta b{max-width:150px;overflow:hidden;font-weight:inherit;text-overflow:ellipsis}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-carpeta:focus-visible{outline:0}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-carpeta:focus-visible::before{box-shadow:0 0 0 2px var(--hf-lima)}
 /* El proyecto: su carpeta (lima si hay uno seleccionado) y una raya fina antes de las carpetas
    (lógicas, inline-start: en árabe y urdu la raya va a la derecha de las carpetas). */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-ir-proyectos>svg{display:block;width:14px;height:14px;color:rgb(255 255 255/.6)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-ir-proyectos.bva-con-proyecto>svg{color:var(--hf-lima)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-ir-proyectos+.bva-carpetas{position:relative;margin:0;margin-inline-start:9px;padding:0;border:0}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-ir-proyectos+.bva-carpetas::before{content:"";position:absolute;inset-inline-start:-9px;top:14px;bottom:14px;width:1px;background:rgb(255 255 255/.12)}

 /* ---- Conmutador «Este proyecto (n) | Todas mis creaciones» (el real), en dos píldoras ---- */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bv-ambito{display:flex;gap:8px;width:auto;max-width:none;margin:0;padding:0 12px;overflow-x:auto;border:0;border-radius:0;background:none;scrollbar-width:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bv-ambito button{position:relative;isolation:isolate;flex:none;display:inline-flex;align-items:center;gap:6px;min-width:0;height:44px;min-height:0;padding:0 14px;border:0;border-radius:17px;background:transparent;color:#fff;font:500 12px/15px var(--font);white-space:nowrap}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bv-ambito button::before{content:"";position:absolute;inset:5.5px 0;z-index:-1;border-radius:17px;background:rgb(255 255 255/.05)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bv-ambito button[aria-pressed="true"]{background:transparent;color:#131517}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bv-ambito button[aria-pressed="true"]::before{background:#fff}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bv-ambito button span{color:inherit;opacity:.6;font-weight:500}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bv-ambito .ic{width:14px;height:14px}

 /* ---- Barra: el buscador real (#bvBusca) y dos botones redondos (Ver y ordenar · Subir) ---- */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-main{min-width:0;padding:0 0 calc(40px + env(safe-area-inset-bottom,0px))}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-cabecera{display:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-barra{position:static;display:flex;flex-wrap:nowrap;align-items:center;gap:8px;margin:0;padding:8px 16px 4px;border:0;border-radius:0;background:none;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
 /* Filtros, orden, mes, vista, seleccionar y tamaño pasan a la hoja «Ver y ordenar». */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-barra>:not(.bva-busca):not(.hfc-botones){display:none!important}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-busca{position:relative;flex:1 1 auto;min-width:0;max-width:none;margin:0}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-busca>svg{left:12px;width:20px;height:20px;color:var(--hf-gris);stroke-width:1.6}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-busca input{box-sizing:border-box;width:100%;height:44px;min-height:44px;margin:0;padding:0 12px 0 42px;border:1px solid transparent;border-radius:12px;background:rgb(255 255 255/.04);box-shadow:0 4px 12px rgb(0 0 0/.12);color:#fff;font:400 16px/20px var(--font);text-overflow:ellipsis;outline:0}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-busca input::placeholder{color:var(--hf-gris)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-busca input:focus{border-color:rgb(209 254 23/.45);outline:0;box-shadow:0 4px 12px rgb(0 0 0/.12)}
 html body.studio-workbench.hf-movil #pg-library.on .hfc-botones{display:flex;flex:none;gap:8px}
 .hfc-redondo{position:relative;display:grid;place-items:center;flex:none;width:40px;height:40px;padding:0;border:0;border-radius:999px;background:rgb(255 255 255/.05);color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent}
 .hfc-redondo::after{content:"";position:absolute;inset:-2px}
 .hfc-redondo .ic{width:18px;height:18px}
 .hfc-redondo:active{background:rgb(255 255 255/.12)}
 .hfc-redondo:focus-visible{outline:2px solid var(--hf-lima);outline-offset:2px}
 .hfc-punto{position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;padding:0 4px;box-sizing:border-box;border-radius:999px;background:var(--hf-lima);color:#131517;font:600 10px/16px var(--font);font-style:normal;text-align:center}
 .hfc-punto[hidden]{display:none}
 /* Sin barra (proyecto vacío, error): Subir sigue a mano. */
 html body.studio-workbench.hf-movil #pg-library.on .hfc-barra-sola{display:flex;padding:8px 16px 0}
 .hfc-subir .ic{width:18px;height:18px}
 /* Filtros activos y «Elige lo que quieres añadir…». */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-chips{gap:8px;padding:8px 16px 0}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-chip{height:33px;min-height:0;padding:0 10px 0 14px;border-radius:17px;background:rgb(255 255 255/.08);color:#fff;font:500 12px/15px var(--font)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bv-anadir{margin:8px 16px 0;border-radius:12px}

 /* ---- Cajón de filtros (el real), con el aspecto de las hojas ---- */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-filtros{gap:16px;padding:8px 16px calc(16px + env(safe-area-inset-bottom,0px));border:0;border-radius:16px 16px 0 0;background:#131313;box-shadow:0 -12px 40px rgb(0 0 0/.5)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-filtros-cab{height:48px;font:600 16px/24px var(--font)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-filtros-cab .bva-boton{width:32px;height:32px;min-height:0;padding:0;border:0;border-radius:999px;background:rgb(255 255 255/.05)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-filtros .bva-etiqueta{color:var(--hf-gris);font:500 12px/16px var(--font);letter-spacing:0;text-transform:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-filtros .bva-segs{gap:4px;padding:4px;border:0;border-radius:12px;background:rgb(255 255 255/.08)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-filtros .bva-seg{min-height:36px;border-radius:10px;color:rgb(255 255 255/.6);font:500 14px/20px var(--font)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-filtros .bva-seg[aria-pressed="true"]{background:#2e3031;color:#f7f7f8}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-filtros .bva-select{height:44px;min-height:44px;border:0;border-radius:12px;background-color:rgb(255 255 255/.04);color:#fff;font:400 16px/20px var(--font)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-filtros .bva-limpiar{min-height:44px;border:0;border-radius:12px;background:rgb(255 255 255/.08);color:#fff;font:600 14px/16px var(--font)}

 /* ---- Galería: cabeceras de periodo y rejilla de 3 columnas casi a sangre ---- */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-galeria{padding:0 4px}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-dia{position:relative;display:flex;align-items:baseline;gap:8px;margin:0;padding:20px 12px 8px;background:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-dia span:not(.fsel-dia){color:#fff;font:600 14px/18px var(--font);letter-spacing:0}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-dia i{color:var(--hf-gris);font:400 12px/18px var(--font)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva:not([data-vista="lista"]) .bv-rejilla{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:4px}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-marco{border-radius:8px;background:var(--hf-tarjeta);transition:transform .15s}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-med{object-fit:cover;background:var(--hf-tarjeta)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-tile:hover .bva-med{transform:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva:not([data-vista="lista"]) .bva-tile:active .bva-marco{transform:scale(.96)}
 /* Sin pie, sin estrella ni acciones flotantes (en táctil se quedaban «pegadas»). */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-fav{display:none!important}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva:not([data-vista="lista"]) .bva-pie{display:none}
 /* Vídeo: la duración abajo a la izquierda (nada más). */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva:not([data-vista="lista"]) .bva-info{left:6px;right:auto;bottom:6px;padding:0;background:none;opacity:1;pointer-events:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-info>:not(.bva-dur),html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-dur:empty{display:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-dur{padding:2px 6px;border-radius:6px;background:rgb(0 0 0/.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;font:500 11px/14px var(--font);font-variant-numeric:tabular-nums}
 /* Solo el ⋯: redondo de 28 con blur, arriba a la derecha (el toque, 44). */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva:not([data-vista="lista"]) .bva-acciones{top:4px;right:4px;bottom:auto;gap:0;opacity:1;transform:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-acciones>:not([data-bva-mas]){display:none!important}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on [data-bva-mas]{position:relative;width:28px;height:28px;min-width:0;min-height:0;padding:0;border:1px solid rgb(255 255 255/.1);border-radius:999px;background:rgb(0 0 0/.32);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on [data-bva-mas]::after{content:"";position:absolute;inset:-8px}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on [data-bva-mas] .ic{width:16px;height:16px}
 /* La casilla de la selección por lotes (solo en modo selección), arriba a la izquierda. */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .fsel{top:6px;left:6px;width:24px;height:24px;border-radius:7px;opacity:0}
 html body.studio-workbench.hf-movil.fselmodo:not(#hf):not(#hf) #pg-library.on .bva .fsel,html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .fsel:is([data-on="1"],:focus-visible){opacity:1}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-tar.fsel-on .bva-marco{box-shadow:0 0 0 2px var(--hf-lima)}
 /* Audio: su onda, más pequeña. */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-reproducir{width:36px;height:36px}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva-reproducir .ic{width:16px;height:16px}
 /* Lista: filas a 12 del borde. */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva[data-vista="lista"] .bva-galeria{padding:0 12px}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva[data-vista="lista"] .bv-dia{padding-inline:4px}
 /* Cargando: el esqueleto en la misma rejilla. */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-cargando{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:44px 4px 0}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-esq{border-radius:8px}

 /* ---- Vacíos (vacio() y proyectoVacio() reales): carpeta lima, título 16/24 y botón oscuro ---- */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-vacio{display:flex;flex-direction:column;align-items:center;max-width:300px;margin:0 auto;padding:16vh 16px 32px;text-align:center}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-icono{width:60px;height:48px;margin:0 0 16px;border:0;border-radius:0;box-shadow:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 48'%3E%3Cdefs%3E%3ClinearGradient id='a' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23d1fe17'/%3E%3Cstop offset='1' stop-color='%23ecff9e'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M5 1.5h15.2c1.3 0 2.5.6 3.3 1.6L26.6 7H55a5 5 0 0 1 5 5v6H0V6.5a5 5 0 0 1 5-5z' fill='%23829b19'/%3E%3Crect y='9' width='60' height='39' rx='5' fill='url(%23a)'/%3E%3Crect x='1' y='10' width='58' height='2' rx='1' fill='%23fff' opacity='.35'/%3E%3C/svg%3E") center/contain no-repeat}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-icono>svg{display:none}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-vacio h3{margin:0;color:#fff;font:600 16px/24px var(--font);letter-spacing:.01em}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-vacio p{margin:4px 0 0;color:var(--hf-gris);font:500 14px/20px var(--font)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-vacio-acciones{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:24px}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva :is(.bv-cta,.bv-cta2){display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;margin-top:24px;padding:0 12px;border:0;border-radius:10px;box-shadow:none;font:600 14px/20px var(--font);white-space:nowrap}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-cta{background:#23262a;color:#fff}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-cta2{background:rgb(255 255 255/.08);color:#fff}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-vacio-acciones :is(.bv-cta,.bv-cta2){margin-top:0}
 /* El destello de Higgsfield («✦ Generate») en los botones que llevan a crear. */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-cta:is([data-ir],[data-bva-crear-modo],[data-bv-crear-aqui])::before{content:"";flex:none;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'%3E%3Cpath d='M10 3.5c.4 3.6 2.4 5.6 6 6-3.6.4-5.6 2.4-6 6-.4-3.6-2.4-5.6-6-6 3.6-.4 5.6-2.4 6-6zM18 13.5c.2 1.8 1.2 2.8 3 3-1.8.2-2.8 1.2-3 3-.2-1.8-1.2-2.8-3-3 1.8-.2 2.8-1.2 3-3z'/%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'%3E%3Cpath d='M10 3.5c.4 3.6 2.4 5.6 6 6-3.6.4-5.6 2.4-6 6-.4-3.6-2.4-5.6-6-6 3.6-.4 5.6-2.4 6-6zM18 13.5c.2 1.8 1.2 2.8 3 3-1.8.2-2.8 1.2-3 3-.2-1.8-1.2-2.8-3-3 1.8-.2 2.8-1.2 3-3z'/%3E%3C/svg%3E") center/contain no-repeat}
 /* «Ver más» y «Ver <mes>»: el botón translúcido del pie de las rejillas. */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-mas{display:flex;flex-direction:column;align-items:center;gap:8px;margin:24px 16px 8px;color:var(--hf-gris);font:400 14px/20px var(--font);text-align:center}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-mas p{margin:0}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-mas :is(.bv-cta,.bv-cta2){margin:0;padding:0 16px;background:rgb(255 255 255/.1);color:#fff;font:500 14px/16px var(--font);-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px)}

 /* ---- Hojas «Ver y ordenar» y de acciones del ⋯ ---- */
 .hfc-hoja__cuerpo{flex:1;min-height:0;display:grid;align-content:start;gap:2px;overflow:auto;overscroll-behavior:contain}
 button.hfc-ajuste{width:100%;padding:0;border:0;background:none;font:inherit;text-align:left}
 .hfc-ajuste{border-radius:12px;-webkit-tap-highlight-color:transparent}
 .hfc-ajuste .hf-ajuste__nombre{min-width:0}
 .hfc-ajuste .hf-ajuste__valor{max-width:52%;overflow:hidden;color:rgb(255 255 255/.7);white-space:nowrap;text-overflow:ellipsis}
 .hfc-ajuste:focus-within,.hfc-ajuste:focus-visible{outline:2px solid var(--hf-lima);outline-offset:-2px}
 .hfc-insignia{min-width:20px;height:20px;padding:0 6px;box-sizing:border-box;border-radius:999px;background:var(--hf-lima);color:#131517!important;font:600 12px/20px var(--font)!important;text-align:center}
 .hfc-accion{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:0 4px;border:0;border-radius:12px;background:none;color:#fff;font:500 16px/20px var(--font);text-align:left;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
 .hfc-accion+.hfc-accion{border-top:1px solid rgb(255 255 255/.05);border-radius:0}
 .hfc-accion .ic{flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;color:#a3a3a3}
 .hfc-accion span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
 .hfc-accion:active{background:rgb(255 255 255/.06)}
 .hfc-accion:focus-visible{outline:2px solid var(--hf-lima);outline-offset:-2px}
 .hfc-accion.is-peligro,.hfc-accion.is-peligro .ic{color:#ff6b6b}
 .hfc-hoja .hf-hoja__cab h2{max-width:calc(100% - 88px);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}

 /* ---- Ficha (#bvVisor), a pantalla completa como hoy: botones de 44 con radio 12 y «Descargar» en el lima 3D ---- */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor.bv-visor{background:#0b0b0b}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bv-vinfo{gap:16px;border:0;border-radius:16px 16px 0 0;background:#131313}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bva-ficha-titulo b{font:600 16px/24px var(--font)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bva-ficha-titulo small{color:var(--hf-gris);font:400 12px/16px var(--font)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bv-vtop .bv-b[data-cerrar]{width:40px;height:40px;min-width:40px;min-height:40px;border:1px solid rgb(255 255 255/.1);border-radius:999px;background:rgb(0 0 0/.4);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bva-nav{width:40px;height:40px;border:1px solid rgb(255 255 255/.1);background:rgb(0 0 0/.4);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bv-vprompt{border-radius:12px;background:rgb(255 255 255/.04);font:400 14px/20px var(--font)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bva-mini{min-height:32px;border:0;border-radius:999px;background:rgb(255 255 255/.08);color:#fff}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bv-vdl>div{border-top-color:rgb(255 255 255/.06)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bv-vacts :is(.bv-cta,.bv-cta2){min-height:44px;border:0;border-radius:12px;background:rgb(255 255 255/.08);color:#fff;font:600 14px/16px var(--font)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bva-vmini{display:flex;flex-wrap:wrap;gap:8px}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bva-icono-accion{flex:1 1 0;flex-direction:row;gap:6px;min-width:0;min-height:44px;padding:0 8px;border:0;border-radius:12px;background:rgb(255 255 255/.08);color:#fff;font:600 13px/16px var(--font);white-space:nowrap}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bva-icono-accion.bva-peligro{color:#ff6b6b}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bva-vmini>a.bva-icono-accion:first-child{flex-basis:100%;min-height:48px;padding:8px 12px 10px;background-color:var(--hf-lima);background-image:linear-gradient(180deg,rgb(255 255 20/0),var(--hf-brillo));color:#131517;font:600 14px/16px var(--font);box-shadow:inset 0 -3px 0 var(--hf-labio),0 6px 4px rgb(0 0 0/.25),0 32px 24px rgb(0 0 0/.15)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #bvVisor .bva-vmini>a.bva-icono-accion:first-child:active{transform:scale(.98);filter:brightness(.95)}

 /* ---- Visitante: pantalla 'creaciones' (las carpetas y el vacío de Higgsfield, centrado) ---- */
 .hf-movil .hf-pantalla.hfc:not([hidden]){display:flex;flex-direction:column}
 .hfc .hfc-pildoras{flex:none;padding:4px 12px 12px}
 .hfc-vacio{flex:1;display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:0 16px 49px}
 .hfc .hfx-vacio-grande{max-width:300px;padding:0;gap:0}
 .hfc .hfx-vacio-grande__ic{margin:0 0 16px}
 html body.hf-movil:not(#hf):not(#hf) .hfc .hfx-vacio-grande h2{max-width:260px}
 .hfc .hfx-vacio-grande p{max-width:260px;margin:4px 0 0;font:500 14px/20px var(--font)}
 .hfc-vacio__botones{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:24px}
 .hfc-vacio__botones .hfx-cta{min-height:40px}
 .hfc-vacio__botones .hfx-cta--blanco{padding:0 20px 2px;font:600 14px/20px var(--font)}
 .hfc-vacio__botones .hfx-cta--oscuro .ic{width:20px;height:20px}
}

/* ============ Comunidad del Estudio móvil (Higgsfield «/community», 8-oct-2026) ============
   Módulo: assets/js/estudio-movil-comunidad.js (pantalla 'comunidad' del
   registro común, cargada en diferido). Lienzo #020202 (bloque común).
   Medidas de su web móvil (capturas/hf-ref/comunidad-*): píldoras de 33
   pegadas arriba, héroe a sangre de 390×302 con el texto debajo y barra de
   progreso de 2px, cabeceras 18/20 con «Ver todo ›», portadas 16:9 de 173×97
   con radio 12 y borde blanco 10 %, mosaico de 3 columnas casi a sangre
   (márgenes 4, gap 6, radio 8) y el pie que se funde. Solo lo que existe en
   Cocuyo: series, momentos de nuestras películas, Aparece, ayuda y redes
   (nada de feed, autores ni contadores). comunidad.html no cambia. */
.hfco-visor{display:none}
@media(max-width:900px){
 /* Abajo, sitio para que la última fila no quede bajo el botón de ayuda (.cchat-btn, con sesión). */
 .hf-movil .hf-pantalla.hfco:not([hidden]){padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
 /* Píldoras (las de Explorar) sobre el lienzo, con el relleno de Higgsfield (4 12 12). */
 .hfco .hfx-chips{padding:4px 12px 12px;background:var(--hf-lienzo)}
 .hfco .hfx-chip{-webkit-tap-highlight-color:transparent}

 /* ---- Héroe: 2 historias apiladas; la actual se ve y la barra se llena ---- */
 .hfco-heroe{position:relative}
 .hfco-heroe__pista{display:grid;touch-action:pan-y}
 /* Cada historia en columna con sus acciones abajo: las dos comparten celda (mide lo
    que la más alta) y, si el texto de una es más corto, el aire queda entre su texto y
    su botón, no entre el botón y la barra de progreso (106 px en alemán a 360). */
 .hfco-historia{grid-area:1/1;display:flex;flex-direction:column;min-width:0;opacity:0;visibility:hidden;transition:opacity .5s ease,visibility 0s linear .5s}
 .hfco-historia.is-on{opacity:1;visibility:visible;transition:opacity .5s ease}
 .hfco-historia__medio{position:relative;display:block;flex:none;aspect-ratio:390/302;overflow:hidden;background:var(--hf-tarjeta)}
 .hfco-historia__medio :is(img,video){position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
 .hfco-historia__medio::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgb(2 2 2/0) 52%,var(--hf-lienzo) 100%);pointer-events:none}
 .hfco-historia.is-on .hfco-historia__medio img{animation:hfco-zoom 14s ease-out both}
 @keyframes hfco-zoom{from{transform:scale(1)}to{transform:scale(1.08)}}
 /* En columna el margen −4 del título ya no se funde con el del bloque: −10 + −4 = el −14 de antes. */
 .hfco-historia__txt{position:relative;flex:1;display:flex;flex-direction:column;margin-top:-10px;padding:0 16px}
 /* Título 32/36 en MAYÚSCULAS con el degradado de blanco a blanco 70 %. El relleno de 4
    (compensado con el margen) deja dentro del fondo las tildes de las mayúsculas. */
 html body.hf-movil:not(#hf):not(#hf) .hfco-h1{margin:-4px 0;padding:4px 0;color:#fff;font:800 32px/36px var(--font);letter-spacing:-.03em;text-transform:uppercase;overflow-wrap:anywhere;background:linear-gradient(180deg,#fff,rgb(255 255 255/.7));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
 .hfco-historia__txt p{margin:12px 0 0;color:var(--hf-gris);font:400 14px/20px var(--font)}
 .hfco-historia__acc{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:auto;padding-top:24px}
 /* Botón del héroe: el lima 3D en 40 de alto y radio 12 («Watch the projects»). */
 .hfco .hfco-cta-heroe{min-height:40px;padding:0 16px 3px;border-radius:12px;letter-spacing:-.4px}
 .hfco .hfco-cta-heroe .ic{width:16px;height:16px}
 .hfco-progreso{display:flex;align-items:center;gap:8px;padding:12px 16px 0}
 .hfco-seg{position:relative;flex:1;height:24px;padding:0;border:0;background:none;cursor:pointer}
 .hfco-seg::before,.hfco-seg i{content:"";position:absolute;left:0;top:11px;height:2px;border-radius:999px}
 .hfco-seg::before{right:0;background:rgb(255 255 255/.2)}
 .hfco-seg i{width:0;background:linear-gradient(90deg,rgb(255 255 255/.1),rgb(255 255 255/.8))}
 .hfco-seg.is-hecho i{width:100%}
 .hfco-seg.is-on i{animation:hfco-llena var(--hfco-dur,7s) linear forwards}
 .hfco-heroe.is-pausa .hfco-seg.is-on i{animation-play-state:paused}
 @keyframes hfco-llena{from{width:0}to{width:100%}}
 .hfco .hfco-progreso .hfco-seg:focus-visible{outline-offset:-2px;border-radius:6px}
 /* Pausar/Reanudar (WCAG 2.2.2), a la derecha de los segmentos: 24×24, icono de 14. */
 .hfco-pausa{flex:none;display:grid;place-items:center;width:24px;height:24px;margin-inline-end:-4px;padding:0;border:0;border-radius:999px;background:none;color:rgb(255 255 255/.8);cursor:pointer;-webkit-tap-highlight-color:transparent}
 .hfco .hfco-pausa .ic{width:14px;height:14px}
 .hfco-pausa .hfco-ic-reanudar,.hfco-pausa[data-parado] .hfco-ic-pausa{display:none}
 .hfco-pausa[data-parado] .hfco-ic-reanudar{display:block}

 /* ---- Secciones: h2 18/20 y «Ver todo ›» a la derecha ---- */
 .hfco-sec{padding:48px 0 0}
 .hfco-cuerpo>.hfco-sec:first-child{padding-top:8px}
 .hfco-cab{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:0 16px 16px}
 .hfco-cab__txt{min-width:0}
 html body.hf-movil:not(#hf):not(#hf) .hfco-cab h2{margin:0;color:#fff;font:600 18px/20px var(--font);letter-spacing:-.4px}
 .hfco-cab p{margin:6px 0 0;color:var(--hf-gris);font:400 14px/20px var(--font)}
 .hfco-todo{flex:none;display:inline-flex;align-items:center;gap:4px;height:32px;margin:-6px 0;padding:6px 4px 6px 8px;border:0;border-radius:8px;background:none;color:#fff;font:500 14px/16px var(--font);white-space:nowrap;cursor:pointer}
 .hfco .hfco-todo .ic{width:16px;height:16px}
 .hfco-sub{margin:24px 16px 8px;color:var(--hf-gris);font:500 12px/16px var(--font);letter-spacing:.06em;text-transform:uppercase}

 /* ---- Series: rejilla de 2 de portadas 16:9 (173×97, radio 12, borde blanco 10 %) ---- */
 .hfco-series{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px;margin:0;padding:0 16px;list-style:none}
 .hfco-serie{display:grid;gap:8px;color:#fff;text-decoration:none;-webkit-tap-highlight-color:transparent;transition:transform .2s cubic-bezier(.4,0,.2,1)}
 .hfco-serie:active{transform:scale(.96)}
 .hfco-serie__medio{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;border-radius:12px;background:var(--hf-tarjeta)}
 .hfco-serie__medio img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s}
 .hfco-serie__medio::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgb(255 255 255/.1);pointer-events:none}
 @media(hover:hover){.hfco-serie:hover .hfco-serie__medio img{transform:scale(1.02)}}
 .hfco-serie__nom{display:grid;gap:2px;min-width:0}
 .hfco-serie__nom b{overflow:hidden;font:500 14px/16px var(--font);white-space:nowrap;text-overflow:ellipsis}
 .hfco-serie__nom small{display:-webkit-box;overflow:hidden;color:var(--hf-gris);font:400 12px/16px var(--font);-webkit-line-clamp:2;-webkit-box-orient:vertical}

 /* ---- Hecho con Cocuyo: mosaico de 3 columnas casi a sangre (márgenes 4, gap 6, radio 8) ---- */
 .hfco-mosaico{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:6px;padding:0 4px}
 .hfco-col{display:grid;gap:6px;min-width:0}
 /* La proporción de cada pieza la pone el módulo (style), por columna. */
 .hfco .hfco-mosaico .hfx-pieza{margin:0;border-radius:8px;background:var(--hf-tarjeta);transition:transform .2s cubic-bezier(.4,0,.2,1);-webkit-tap-highlight-color:transparent}
 .hfco .hfco-mosaico .hfx-pieza:active{transform:scale(.96)}
 .hfco .hfx-fundido{margin-top:-128px;pointer-events:none}
 .hfco .hfx-fundido>button{pointer-events:auto}
 .hfco-acciones{display:grid;gap:8px;padding:16px 16px 0}
 .hfco-acciones--centro{justify-items:center}
 .hfco-nota{margin:0;color:var(--hf-gris);font:400 12px/16px var(--font);text-align:center}
 /* Botón translúcido (blanco 10 %, blur 40), como «Explore all …». */
 .hfco-boton{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 16px;border-radius:10px;background:rgb(255 255 255/.1);color:#fff;font:500 14px/16px var(--font);text-decoration:none;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px)}
 .hfco .hfco-boton .ic,.hfco .hfx-cta .ic{width:16px;height:16px}

 /* ---- Aparece en Cocuyo: tarjeta con el teaser arriba, 4 pasos y el lima ---- */
 .hfco-aparece{margin:0 16px;overflow:hidden;border:1px solid rgb(255 255 255/.06);border-radius:16px;background:#131517}
 .hfco-aparece__medio{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--hf-tarjeta)}
 .hfco-aparece__medio video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
 .hfco-aparece__medio::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgb(19 21 23/0) 55%,#131517 100%);pointer-events:none}
 .hfco-aparece__medio .hfx-sello{position:absolute;left:12px;top:12px;z-index:1}
 .hfco-aparece__txt{position:relative;margin-top:-20px;padding:0 16px 16px}
 html body.hf-movil:not(#hf):not(#hf) .hfco-aparece h3{margin:0;color:#fff;font:800 22px/26px var(--font);letter-spacing:-.02em;text-transform:uppercase;overflow-wrap:anywhere}
 .hfco-aparece__txt>p{margin:8px 0 0;color:var(--hf-gris);font:400 14px/20px var(--font)}
 .hfco-pasos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0;padding:0;list-style:none}
 .hfco-pasos li{display:grid;align-content:start;gap:4px;min-width:0;padding:12px;border-radius:12px;background:rgb(255 255 255/.04)}
 .hfco-pasos i{color:var(--hf-lima);font:italic 700 12px/16px var(--font)}
 .hfco-pasos b{font:600 14px/18px var(--font)}
 .hfco-pasos span{color:var(--hf-gris);font:400 12px/16px var(--font)}

 /* ---- Listas (ayuda, redes y correo): filas de 64 en una tarjeta ---- */
 .hfco-lista{margin:0 16px;padding:0;list-style:none;overflow:hidden;border-radius:16px;background:rgb(255 255 255/.04)}
 .hfco-lista>li+li{border-top:1px solid rgb(255 255 255/.06)}
 /* La lista recorta (overflow:hidden y radio 16): el foco va por dentro de la fila y la
    primera y la última llevan las esquinas de la tarjeta (antes no se veía en el chat ni
    en el correo, solos en su lista, y de las redes solo asomaba una raya). */
 .hfco-lista>li:first-child>.hfco-fila{border-top-left-radius:16px;border-top-right-radius:16px}
 .hfco-lista>li:last-child>.hfco-fila{border-bottom-left-radius:16px;border-bottom-right-radius:16px}
 .hfco .hfco-lista .hfco-fila:focus-visible{outline:2px solid var(--hf-lima);outline-offset:-2px}
 .hfco-lista--correo{margin-top:24px}
 .hfco-fila{display:flex;align-items:center;gap:12px;box-sizing:border-box;width:100%;min-height:64px;margin:0;padding:12px 14px 12px 12px;border:0;background:none;color:#fff;text-align:left;text-decoration:none;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
 .hfco-fila--dato{cursor:default}
 a.hfco-fila:active,button.hfco-fila:active{background:rgb(255 255 255/.04)}
 .hfco-fila__ic{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:var(--hf-tarjeta);color:#fff}
 .hfco .hfco-fila__ic .ic{width:20px;height:20px}
 .hfco-fila--ayuda .hfco-fila__ic{background-color:var(--hf-lima);background-image:linear-gradient(180deg,rgb(255 255 20/0),var(--hf-brillo));color:#131517;box-shadow:inset 0 -2px 0 var(--hf-labio)}
 .hfco-fila__txt{flex:1;min-width:0;display:grid;gap:2px}
 .hfco-fila__txt b{overflow:hidden;font:500 14px/20px var(--font);white-space:nowrap;text-overflow:ellipsis}
 .hfco-fila__txt small{color:var(--hf-gris);font:400 12px/16px var(--font);overflow-wrap:anywhere}
 .hfco .hfco-fila>.ic{flex:none;width:16px;height:16px;color:#5c5c5c}

 /* ---- Visor de un momento: a pantalla completa, con «Ver las series en YouTube» ---- */
 .hfco-visor{position:fixed;inset:0;box-sizing:border-box;width:100%;max-width:100%;height:100%;max-height:100%;margin:0;padding:0;border:0;background:#000;color:#fff;font-family:var(--font);overflow:hidden}
 .hfco-visor[open]{display:flex;flex-direction:column;animation:hfco-aparece .2s ease-out}
 @keyframes hfco-aparece{from{opacity:0}to{opacity:1}}
 .hfco-visor::backdrop{background:#000}
 .hfco-visor .ic{width:20px;height:20px}
 .hfco-visor__cab{flex:none;display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;height:calc(56px + env(safe-area-inset-top,0px));padding:env(safe-area-inset-top,0px) 10px 0 16px}
 .hfco-visor__n{color:var(--hf-gris);font:500 14px/20px var(--font);font-variant-numeric:tabular-nums}
 .hfco-visor__x{display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:999px;background:rgb(255 255 255/.08);color:#fff;cursor:pointer}
 .hfco-visor__medio{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:0 16px;touch-action:pan-y}
 .hfco-visor__medio video{display:block;max-width:100%;max-height:100%;aspect-ratio:3/4;border-radius:12px;background:#111;object-fit:cover}
 .hfco-visor__paso{position:absolute;top:50%;display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:999px;background:rgb(0 0 0/.45);color:#fff;transform:translateY(-50%);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);cursor:pointer}
 .hfco-visor__paso[data-hfco-paso="-1"]{left:24px}
 .hfco-visor__paso[data-hfco-paso="1"]{right:24px}
 .hfco-visor__pie{flex:none;display:grid;gap:4px;padding:16px 16px calc(16px + env(safe-area-inset-bottom,0px))}
 .hfco-visor__t{margin:0;font:600 16px/20px var(--font)}
 .hfco-visor__s{margin:0 0 12px;color:var(--hf-gris);font:400 14px/20px var(--font)}
 .hfco-visor :is(button,a):focus-visible{outline:2px solid var(--hf-lima);outline-offset:2px}
 @media(prefers-reduced-motion:reduce){
  .hfco-historia,.hfco-historia.is-on{transition:none}
  .hfco-historia.is-on .hfco-historia__medio img,.hfco-visor[open]{animation:none}
  .hfco-seg.is-on i{animation:none;width:100%}
  .hfco-pausa{display:none}
  .hfco-serie,.hfco .hfco-mosaico .hfx-pieza{transition:none}
 }
}

/* ============ Iconos 3D del Estudio móvil (9-oct-2026) ============
   assets/media/iconos/<id>.webp: 192×192, ≤ 5 KB, con su fondo #0b0b0b ya
   puesto. Se pintan como azulejos redondeados y son decorativos (alt vacío:
   el texto de al lado lo dice todo). Si uno no carga, el JS lo quita
   (estudio-movil-pantallas.js) y, donde había un icono de trazo, vuelve ese.
   Útiles y Apps: cabeceras de categoría y títulos de sección; Comunidad:
   filas del canal, ayuda, correo y pasos; Conectores: ideas, control y el
   vacío de Mis conexiones; Precios: cada plan; vacíos de búsqueda y de la
   Bóveda (Favoritos, Subidos y filtros). Las pestañas, el menú ☰, las
   portadas de Apps y el carrusel de Crear no cambian. */
@media(max-width:900px){
 /* El azulejo es el fondo del propio webp (casi #0b0b0b): sobre los lienzos
    #0b0b0b (Útiles, ayuda de Comunidad) o #080809 (Conectores) no se veía y
    quedaba el dibujo suelto; en Apps (#131517) sí. Un filo claro de 1 px,
    por dentro (outline sigue el redondeo y no lo recorta el contenedor), lo
    marca igual en todas las pantallas. */
 .hfx-ic3d{display:block;flex:none;box-sizing:border-box;object-fit:cover;border-radius:22%;background:#0b0b0b;outline:1px solid rgb(255 255 255/.09);outline-offset:-1px}
 /* Cabecera grande con icono: el icono encima del título (el título no pierde
    ancho) y «Ver todo» a la altura de la última línea del título. */
 .hfx-cabeza--grande.hfx-cabeza--ic{align-items:flex-end}
 .hfx-cabeza--ic .hfx-cabeza__txt{flex:1}
 .hfx-cabeza__txt>.hfx-ic3d{width:44px;height:44px;margin:0 0 12px}
 .hfx-cabeza--ic:has(.hfx-cabeza__txt>p)>.hfx-ver-todo{margin-bottom:20px}
 /* Útiles: el dato contado lleva el maletín de Útiles. */
 .hfu .hfu-dato{padding-inline-start:6px}
 .hfu-dato>.hfx-ic3d{width:28px;height:28px;margin:-4px 0;border-radius:8px}
 /* Apps: título de sector u ocasión con su icono de 32. */
 html body.hf-movil:not(#hf):not(#hf) .hfa-bloque__t{display:flex;align-items:center;gap:10px}
 .hfa-bloque__t>.hfx-ic3d{width:32px;height:32px;border-radius:8px}
 /* Agente y «Muy pronto»: el icono 3D tapa el de trazo (que queda de respaldo). */
 .hfa-arte--3d{position:relative;overflow:hidden}
 .hfa-arte--3d>.hfx-ic3d{position:absolute;inset:0;width:100%;height:100%;border-radius:inherit}
 .hfa-pronto>.hfa-arte--3d{opacity:.85}
 /* Vacíos de búsqueda (Útiles y Apps): el icono encima de la frase. */
 .hfx-vacio>.hfx-vacio__ic{width:72px;height:72px;margin:0 auto 12px;border-radius:18px}
 /* Comunidad: el icono 3D llena el azulejo de 40 (el de trazo queda debajo, de respaldo). */
 .hfco-fila__ic--3d{position:relative;overflow:hidden}
 .hfco-fila__ic--3d>.hfx-ic3d{position:absolute;inset:0;width:100%;height:100%;border-radius:inherit}
 .hfco-fila__ic--3d:has(>.hfx-ic3d){background:#0b0b0b}
 .hfco-fila--ayuda .hfco-fila__ic--3d:has(>.hfx-ic3d){background-image:none;box-shadow:none}
 /* Pasos de «Aparece»: número a un lado, icono al otro. */
 .hfco-paso__cab{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:36px;margin-bottom:4px}
 .hfco-paso__cab>.hfx-ic3d{width:36px;height:36px;border-radius:9px}
 /* Conectores: ideas (32) y control (40); el vacío de Mis conexiones, por CSS. */
 .hfcn-idea__cab>.hfx-ic3d{width:32px;height:32px;border-radius:8px}
 .hfcn-control li{align-items:center}
 .hfcn-control li>.hfx-ic3d{width:40px;height:40px;border-radius:10px}
 .hfcn-vacio::before{content:"";display:block;width:56px;height:56px;margin:4px 0 12px;border-radius:14px;background:#0b0b0b url("/assets/media/iconos/conector-vacio-conexiones.webp") center/cover no-repeat;box-shadow:inset 0 0 0 1px rgb(255 255 255/.09)}
 /* Bóveda con cuenta: los vacíos de Favoritos (estrella), Subidos (subir) y
    «Nada por aquí» (lupa) llevan su icono 3D en lugar de la carpeta; se
    reconocen por el icono que elige estudio-4.js (assetIcon fav, upload y
    search, ocultos en el teléfono). Los demás siguen con la carpeta de Higgsfield. */
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-icono:is(:has(path[d^="m12 3 2.8"]),:has(path[d^="M12 16V3"]),:has(circle[cx="11"][cy="11"][r="7"])){width:72px;height:72px;border-radius:18px;background-color:#0b0b0b;background-position:center;background-size:cover;background-repeat:no-repeat;box-shadow:inset 0 0 0 1px rgb(255 255 255/.09)}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-icono:has(path[d^="m12 3 2.8"]){background-image:url("/assets/media/iconos/vacio-favoritos.webp")}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-icono:has(path[d^="M12 16V3"]){background-image:url("/assets/media/iconos/vacio-subidos.webp")}
 html body.studio-workbench.hf-movil:not(#hf):not(#hf) #pg-library.on .bva .bv-icono:has(circle[cx="11"][cy="11"][r="7"]){background-image:url("/assets/media/iconos/vacio-busqueda.webp")}
}


/* cocuyo-css: assets/css/recarga-tarjetas.css */
/* 21st.dev Pricing Card (0xUrvish, 10471): selección con expansión y transición.
   Identidad Cocuyo; sin librerías de animación ni tarifas del ejemplo. */
body.page-perfil #modal-recarga,body.studio-workbench #payModal{padding:20px;align-items:center;background:color-mix(in srgb,var(--negro-abismo) 73%,transparent);backdrop-filter:blur(10px)}
body.page-perfil #modal-recarga .rc-dialog,body.studio-workbench #payModal .rc-dialog{box-sizing:border-box;width:min(980px,100%);max-width:980px;max-height:calc(100dvh - 40px);overflow:auto;overscroll-behavior:contain;padding:28px;border:1px solid var(--negro-borde);border-radius:24px;background:var(--negro-abismo);box-shadow:0 30px 100px color-mix(in srgb,var(--negro-abismo) 60%,transparent);animation:rc-entrada .32s cubic-bezier(.2,.8,.2,1)}
.recarga-experiencia .rc-header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}
.recarga-experiencia .rc-header>span{font-size:10px;letter-spacing:.12em;color:var(--gris-humo)}
.recarga-experiencia .rc-close{position:static;display:grid;place-items:center;flex:none;width:44px;height:44px;margin:0;padding:0;border:1px solid var(--negro-borde);border-radius:50%;background:var(--negro-elevado);color:var(--blanco-luz);font-size:22px;cursor:pointer}
.recarga-experiencia .rc-title{font:600 clamp(28px,4vw,40px)/1.1 var(--fuente);letter-spacing:-.05em;margin:0 0 10px;color:var(--blanco-luz)}
.recarga-experiencia .rc-description{font:400 13px/1.5 var(--fuente);color:var(--gris-humo);margin:0 0 22px}
.recarga-experiencia .rc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.recarga-experiencia .rc-card{box-sizing:border-box;position:relative;display:grid;grid-template-columns:1fr;gap:15px;min-width:0;margin:0;padding:24px;text-align:left;align-content:start;border:1px solid var(--negro-borde);border-radius:18px;background:linear-gradient(150deg,color-mix(in srgb,var(--verde-cocuyo) 5%,var(--negro-elevado)),var(--negro-elevado) 65%);color:var(--blanco-luz);cursor:pointer;overflow:hidden;transition:border-color .2s,box-shadow .25s,background .25s,transform .25s}
.recarga-experiencia .rc-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--verde-cocuyo) 50%,var(--negro-borde))}
.recarga-experiencia .rc-card.seleccionado{border-color:var(--verde-cocuyo);background:linear-gradient(150deg,color-mix(in srgb,var(--verde-cocuyo) 12%,var(--negro-elevado)),var(--negro-elevado) 75%);box-shadow:inset 0 0 0 1px var(--verde-cocuyo),0 8px 32px color-mix(in srgb,var(--verde-cocuyo) 5%,transparent)}
.recarga-experiencia .rc-card>input{position:absolute;inset:0;z-index:1;opacity:0;width:100%;height:100%;margin:0;cursor:inherit}
.recarga-experiencia .rc-card:has(input:focus-visible){outline:2px solid var(--verde-cocuyo);outline-offset:3px}
.recarga-experiencia .rc-card:has(input:disabled){opacity:.6;cursor:wait;transform:none}
.recarga-experiencia .rc-icon{display:grid;place-items:center;width:72px;height:72px;border-radius:20px;color:var(--verde-cocuyo);background:radial-gradient(circle,color-mix(in srgb,var(--verde-cocuyo) 15%,transparent),transparent 72%)}
.recarga-experiencia .rc-icon svg{width:54px;height:54px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 9px color-mix(in srgb,var(--verde-cocuyo) 25%,transparent));transition:transform .35s}
.recarga-experiencia .seleccionado .rc-icon svg{transform:scale(1.1)}
.recarga-experiencia .rc-icon-orbit{stroke-dasharray:3 5;stroke-width:1;opacity:.45;transform-origin:20px 20px}
.recarga-experiencia .seleccionado .rc-icon-orbit{animation:rc-orbita 18s linear infinite}
.recarga-experiencia .rc-copy{display:grid;gap:10px;min-width:0}
.recarga-experiencia .rc-name{font-size:14px;font-weight:600}
.recarga-experiencia .rc-amount{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;font-size:35px;line-height:1.1;font-weight:600;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.recarga-experiencia .rc-amount small{font-size:11px;font-weight:400;letter-spacing:0;color:var(--gris-humo)}
.recarga-experiencia .rc-price{display:grid;gap:5px;font-size:26px;line-height:1.1;font-weight:600;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.recarga-experiencia .rc-price small{font-size:10px;font-weight:400;letter-spacing:0;color:var(--gris-humo)}
.recarga-experiencia .rc-check{position:absolute;top:20px;right:18px;display:grid;place-items:center;width:20px;height:20px;border:1px solid var(--pizarra);border-radius:50%;color:var(--negro-abismo);transition:background .2s,border-color .2s}
.recarga-experiencia .rc-check svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;opacity:0;transform:scale(.4);transition:opacity .2s,transform .25s}
.recarga-experiencia .seleccionado .rc-check{background:var(--verde-cocuyo);border-color:var(--verde-cocuyo)}
.recarga-experiencia .seleccionado .rc-check svg{opacity:1;transform:scale(1)}
.recarga-experiencia .rc-detail{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .25s,opacity .25s;min-height:0;font-size:11px;color:var(--gris-niebla);line-height:1.5}
.recarga-experiencia .rc-detail>span{overflow:hidden;min-height:0}
.recarga-experiencia .seleccionado .rc-detail{grid-template-rows:1fr;opacity:1}
.recarga-experiencia .rc-summary{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:20px 0 14px;padding:16px 0;border-top:1px solid var(--negro-borde)}
.recarga-experiencia .rc-summary>div{display:grid;gap:6px;min-width:0}
.recarga-experiencia .rc-summary>div:last-child{text-align:right}
.recarga-experiencia .rc-summary span{font-size:11px;color:var(--gris-humo)}
.recarga-experiencia .rc-summary b{font-size:17px;color:var(--blanco-luz);font-weight:600}
.recarga-experiencia .rc-continue{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:50px;border:1px solid var(--verde-cocuyo);border-radius:12px;background:var(--verde-cocuyo);color:var(--negro-abismo);font:600 14px/1.3 var(--fuente);cursor:pointer;transition:filter .2s,transform .2s}
.recarga-experiencia .rc-continue:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-1px)}
.recarga-experiencia .rc-continue:disabled{opacity:.45;cursor:default}
.recarga-experiencia .rc-continue:focus-visible,.recarga-experiencia .rc-close:focus-visible{outline:2px solid var(--verde-cocuyo);outline-offset:4px}
.recarga-experiencia .rc-form fieldset{border:0;padding:0;margin:0;min-width:0}
.recarga-experiencia .rc-form legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.recarga-experiencia .rc-note{margin:12px 0 0;text-align:center;color:var(--gris-humo);font:400 10px/1.5 var(--fuente)}
body.rc-abierto,body.studio-workbench:has(#payModal.on){overflow:hidden}
body.studio-workbench #payModal #payClose.rc-close{width:44px;height:44px;min-width:44px;font-size:22px;border-radius:50%}
/* La ✕ de Recargar en su esquina también en árabe y urdu (10-oct-2026): el «margin-left:auto»
   del Estudio la empujaba en RTL hasta pegarla a «أرصدة الاستوديو», a media cabecera. */
body.studio-workbench #payModal #payClose.rc-close{margin-left:0;margin-inline-start:auto}
body.studio-workbench #payTitle.rc-title{font-size:clamp(28px,4vw,40px)}
body.studio-workbench #payPacksList.rc-grid{gap:14px}
@keyframes rc-entrada{from{opacity:0;transform:translateY(22px) scale(.97)}to{opacity:1;transform:none}}
@keyframes rc-orbita{to{transform:rotate(360deg)}}
@media(max-width:720px){
 body.page-perfil #modal-recarga,body.studio-workbench #payModal{padding:12px;align-items:center}
 body.page-perfil #modal-recarga .rc-dialog,body.studio-workbench #payModal .rc-dialog{padding:18px;max-height:calc(100dvh - 24px);border-radius:22px}
 .recarga-experiencia .rc-header{margin-bottom:12px}.recarga-experiencia .rc-description{margin-bottom:18px}.recarga-experiencia .rc-grid{grid-template-columns:1fr;gap:10px}
 body.studio-workbench #payPacksList.rc-grid{gap:10px}
 .recarga-experiencia .rc-card{grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:8px 12px;padding:15px 12px}
 .recarga-experiencia .rc-icon{width:44px;height:50px;border-radius:12px}.recarga-experiencia .rc-icon svg{width:38px;height:38px}
 .recarga-experiencia .rc-copy{gap:7px}.recarga-experiencia .rc-name{font-size:12px}.recarga-experiencia .rc-amount{font-size:24px;gap:4px}.recarga-experiencia .rc-amount small{font-size:9px}
 .recarga-experiencia .rc-price{font-size:22px;text-align:right}.recarga-experiencia .rc-price small{font-size:8px}.recarga-experiencia .rc-check{display:none}
 .recarga-experiencia .rc-detail{grid-column:1/-1;padding-left:56px;font-size:10px}
 .recarga-experiencia .rc-summary{margin:16px 0 10px;padding:12px 0}.recarga-experiencia .rc-summary b{font-size:15px}
}
@media(max-width:360px){.recarga-experiencia .rc-card{grid-template-columns:32px minmax(0,1fr) auto;gap:8px;padding:13px 10px}.recarga-experiencia .rc-icon{width:32px;height:42px}.recarga-experiencia .rc-icon svg{width:32px;height:32px}.recarga-experiencia .rc-price{font-size:19px}.recarga-experiencia .rc-amount{font-size:21px}.recarga-experiencia .rc-detail{padding-left:40px}.recarga-experiencia .rc-title{font-size:26px}}
/* Segunda revisión: jerarquía de saldo/precio, selección sin saltos en móvil
   y pago siempre visible, con desplazamiento únicamente de las tarjetas. */
body.page-perfil #modal-recarga .rc-dialog,body.studio-workbench #payModal .rc-dialog{display:flex;flex-direction:column;overflow:hidden;padding:30px;background:radial-gradient(ellipse at 50% 0,color-mix(in srgb,var(--verde-cocuyo) 7%,transparent),transparent 45%),var(--negro-abismo);border-color:color-mix(in srgb,var(--blanco-luz) 14%,var(--negro-borde));box-shadow:0 24px 100px color-mix(in srgb,var(--negro-abismo) 85%,transparent)}
.recarga-experiencia :is(.rc-header,.rc-title,.rc-description,.paysaldo){flex:none}
.recarga-experiencia .rc-header{margin-bottom:16px}
.recarga-experiencia .rc-header>span{display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:.14em}
.recarga-experiencia .rc-header>span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--verde-cocuyo);box-shadow:7px 0 var(--verde-cocuyo);margin-right:7px}
.recarga-experiencia .rc-title{font-weight:550;letter-spacing:-.045em}
.recarga-experiencia .rc-form{display:flex;flex-direction:column;min-height:0;margin:0}
.recarga-experiencia .rc-options{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--negro-borde) transparent;padding:4px;scroll-padding:4px;min-height:0}
.recarga-experiencia .rc-checkout{position:relative;z-index:2;flex:none;padding-top:12px;background:var(--negro-abismo)}
.recarga-experiencia .rc-card{padding:25px;gap:20px;border-radius:22px;background:linear-gradient(155deg,color-mix(in srgb,var(--blanco-luz) 4%,var(--negro-elevado)),var(--negro-elevado) 70%)}
.recarga-experiencia .rc-card.seleccionado{background:radial-gradient(ellipse at 0 0,color-mix(in srgb,var(--verde-cocuyo) 13%,transparent),transparent 75%),var(--negro-elevado);box-shadow:inset 0 0 0 1px var(--verde-cocuyo)}
.recarga-experiencia .rc-icon{border:1px solid color-mix(in srgb,var(--verde-cocuyo) 14%,transparent);border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--verde-cocuyo) 12%,transparent),transparent 72%)}
.recarga-experiencia .rc-icon svg{width:44px;height:44px;filter:none}
.recarga-experiencia .seleccionado .rc-icon{box-shadow:0 0 26px color-mix(in srgb,var(--verde-cocuyo) 12%,transparent)}
.recarga-experiencia .rc-name{font-size:12px;font-weight:500;color:var(--gris-niebla);letter-spacing:.015em}
.recarga-experiencia .rc-amount{display:grid;gap:5px;font-size:42px;font-weight:600;letter-spacing:-.045em}
.recarga-experiencia .rc-amount small{font-size:12px}
.recarga-experiencia .rc-price{padding-top:15px;border-top:1px solid var(--negro-borde);font-size:26px}
.recarga-experiencia .rc-price small{font-size:10px}
.recarga-experiencia .rc-detail{min-height:16px;grid-template-rows:1fr;font-size:10px}
.recarga-experiencia .rc-checkout .rc-summary{margin:0 0 12px;padding:14px 0 0;border-top:1px solid var(--negro-borde)}
.recarga-experiencia .rc-summary :is(b,strong){font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.recarga-experiencia .rc-checkout .rc-continue{min-height:50px;font-size:14px;border-radius:13px}
.recarga-experiencia .rc-note,.recarga-experiencia .pay-nota{font-size:10px;margin:10px 0 0;line-height:1.5}
body.studio-workbench #payModal .paysaldo{padding:0;border:0;background:none;margin:0 0 14px;font-size:11px}
body.studio-workbench #payModal .paysaldo b{font-size:15px}
body.studio-workbench #payModal .pay-mensaje:has(#payMsg:empty):not(:has(#payRetry:not([hidden]))){display:none}
@media(max-width:720px){
 body.page-perfil #modal-recarga .rc-dialog,body.studio-workbench #payModal .rc-dialog{padding:20px;max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));border-radius:26px}
 .recarga-experiencia .rc-header{margin-bottom:10px}.recarga-experiencia .rc-description{font-size:12px;margin-bottom:16px}
 .recarga-experiencia .rc-card{grid-template-columns:42px minmax(0,1fr) auto;min-height:104px;gap:12px;padding:17px 14px;border-radius:18px}
 .recarga-experiencia .rc-card:hover{transform:none}
 .recarga-experiencia .rc-icon{box-sizing:border-box;width:42px;height:42px}.recarga-experiencia .rc-icon svg{width:30px;height:30px}
 .recarga-experiencia .rc-copy{gap:5px}.recarga-experiencia .rc-name{font-size:11px}.recarga-experiencia .rc-amount{font-size:30px;gap:3px}.recarga-experiencia .rc-amount small{font-size:10px}
 .recarga-experiencia .rc-price{border:0;padding:0;font-size:24px;gap:5px}.recarga-experiencia .rc-price small{font-size:8px}
 .recarga-experiencia .rc-detail{display:none}
 .recarga-experiencia .rc-check{display:grid;top:auto;right:auto;left:43px;bottom:23px;width:14px;height:14px;opacity:0;background:var(--negro-elevado)}
 .recarga-experiencia .seleccionado .rc-check{opacity:1}.recarga-experiencia .rc-check svg{width:11px;height:11px}
 .recarga-experiencia .rc-checkout .rc-summary{padding-top:12px;margin-bottom:12px}.recarga-experiencia .rc-summary :is(b,strong){font-size:18px}
}
@media(max-width:360px){
 body.page-perfil #modal-recarga .rc-dialog,body.studio-workbench #payModal .rc-dialog{padding:16px}
 .recarga-experiencia .rc-card{grid-template-columns:34px minmax(0,1fr) auto;padding:15px 11px;gap:9px;min-height:100px}
 .recarga-experiencia .rc-icon{width:34px;height:34px}.recarga-experiencia .rc-icon svg{width:27px;height:27px}
 .recarga-experiencia .rc-amount{font-size:27px}.recarga-experiencia .rc-price{font-size:22px}.recarga-experiencia .rc-check{left:34px;bottom:22px}
}
/* Paquetes y pago completos: sin un panel interior que haya que desplazar. */
body.page-perfil #modal-recarga,body.studio-workbench #payModal{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}
body.page-perfil #modal-recarga::-webkit-scrollbar,body.studio-workbench #payModal::-webkit-scrollbar{display:none}
body.page-perfil #modal-recarga .rc-dialog,body.studio-workbench #payModal .rc-dialog{flex:none;max-height:none;overflow:visible;padding:24px}
.recarga-experiencia .rc-options{overflow:visible;min-height:auto}
.recarga-experiencia .rc-header{margin-bottom:8px}
.recarga-experiencia .rc-description{margin-bottom:14px}
.recarga-experiencia .rc-card{padding:18px;gap:12px;border-radius:18px}
.recarga-experiencia .rc-icon{width:48px;height:48px}.recarga-experiencia .rc-icon svg{width:34px;height:34px}
.recarga-experiencia .rc-amount{font-size:32px}.recarga-experiencia .rc-price{font-size:23px;padding-top:12px}
.recarga-experiencia .rc-detail{display:none}
body.studio-workbench #payModal .rc-summary{margin:0 0 12px;padding:12px 0 0}
body.studio-workbench #payModal .pay-nota{margin:9px 0 0}
@media(min-width:901px){
 .recarga-experiencia .rc-form{display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:22px;align-items:start}
 .recarga-experiencia .rc-checkout{padding:0 0 0 20px;border-left:1px solid var(--negro-borde);align-self:stretch;display:flex;flex-direction:column;justify-content:center}
 .recarga-experiencia .rc-checkout .rc-summary,body.studio-workbench #payModal .rc-summary{border-top:0;padding-top:0;display:grid;gap:18px;margin-bottom:20px}
 .recarga-experiencia .rc-summary>div:last-child,body.studio-workbench #payModal .rc-summary>div:last-child{align-items:flex-start;text-align:left}
 .recarga-experiencia .rc-summary strong{font-size:27px}
 .recarga-experiencia .rc-card .rc-check{right:13px;top:13px}
}
@media(max-width:900px) and (min-width:721px){
 .recarga-experiencia .rc-card{grid-template-columns:40px 1fr;gap:12px}
 .recarga-experiencia .rc-icon{width:38px;height:38px}.recarga-experiencia .rc-icon svg{width:28px;height:28px}
 .recarga-experiencia .rc-amount{font-size:27px}.recarga-experiencia .rc-price{grid-column:1/-1}
}
@media(max-width:720px){
 body.page-perfil #modal-recarga .rc-dialog,body.studio-workbench #payModal .rc-dialog{padding:18px}
 body.studio-workbench #payTitle.rc-title,.recarga-experiencia .rc-title{font-size:27px}
 .recarga-experiencia .rc-card{min-height:78px;padding:12px;gap:10px;grid-template-columns:34px minmax(0,1fr) auto}
 .recarga-experiencia .rc-icon{width:34px;height:34px}.recarga-experiencia .rc-icon svg{width:26px;height:26px}
 .recarga-experiencia .rc-amount{font-size:26px}.recarga-experiencia .rc-price{padding:0;font-size:22px}
 .recarga-experiencia .rc-check{left:35px;bottom:13px}
 .recarga-experiencia .rc-description{margin-bottom:10px}
 .recarga-experiencia .rc-checkout{padding-top:8px}
 .recarga-experiencia .rc-checkout .rc-summary{padding-top:10px;margin-bottom:10px}
}
@media(max-height:650px) and (max-width:720px){
 body.page-perfil #modal-recarga,body.studio-workbench #payModal{padding:8px}
 body.page-perfil #modal-recarga .rc-dialog,body.studio-workbench #payModal .rc-dialog{padding:14px}
 .recarga-experiencia .rc-header{margin-bottom:4px}
 body.studio-workbench #payModal #payClose.rc-close,.recarga-experiencia .rc-close{width:36px;height:36px;min-width:36px}
 body.studio-workbench #payTitle.rc-title,.recarga-experiencia .rc-title{font-size:24px;margin-bottom:8px}
 .recarga-experiencia .rc-description{display:none}
 .recarga-experiencia .rc-card{min-height:70px;padding:10px;gap:8px}
 .recarga-experiencia .rc-copy{gap:4px;line-height:1.2}
 .recarga-experiencia .rc-grid,body.studio-workbench #payPacksList.rc-grid{gap:7px}
 .recarga-experiencia .rc-amount{display:flex;font-size:23px;gap:4px}.recarga-experiencia .rc-price{font-size:20px}
 .recarga-experiencia .rc-checkout .rc-continue{min-height:44px}
}
/* Zoom alto, teclado o paisaje muy bajo: puede desplazarse el conjunto,
   nunca queda una opción o acción recortada dentro de las tarjetas. */
@media(max-height:540px){body.page-perfil #modal-recarga,body.studio-workbench #payModal{align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.recarga-experiencia *{animation:none!important;transition:none!important}}

/* Beneficio aplicado al paquete: créditos intactos, precio anterior y actual legibles. */
.recarga-experiencia .rc-prices{display:flex;align-items:baseline;flex-wrap:wrap;gap:5px 9px;min-width:0}
.recarga-experiencia .rc-prices s{color:var(--gris-humo);font:400 13px/1.3 var(--fuente);letter-spacing:0;text-decoration-thickness:1px}
.recarga-experiencia .rc-price .rc-benefit{color:var(--verde-cocuyo);font-size:10px;font-weight:500;line-height:1.45;letter-spacing:0;max-width:100%;text-wrap:balance}
@media(max-width:720px){
 .recarga-experiencia .rc-prices{justify-content:flex-end;gap:3px 7px}
 .recarga-experiencia .rc-prices s{font-size:11px}
 .recarga-experiencia .rc-price:has(.rc-benefit){max-width:140px;text-align:right}
 .recarga-experiencia .rc-price .rc-benefit{font-size:9px}
}
@media(max-width:360px){.recarga-experiencia .rc-price:has(.rc-benefit){max-width:112px}.recarga-experiencia .rc-prices{gap:3px 5px}}
/* Recarga libre (5-oct-2026): importe escrito por la persona, desde US$1. */
.recarga-experiencia .rc-grid:has(.rc-libre){grid-template-columns:1fr}
.recarga-experiencia .rc-card.rc-libre{cursor:default;gap:16px}
.recarga-experiencia .rc-card.rc-libre:hover{transform:none}
.recarga-experiencia .rc-libre-campo{display:grid;gap:10px;font:500 13px/1.4 var(--fuente);color:var(--gris-humo)}
.recarga-experiencia .rc-libre-input{display:flex;align-items:center;gap:10px;padding:10px 18px;border:1px solid var(--negro-borde);border-radius:16px;background:var(--negro-abismo);transition:border-color .2s,box-shadow .2s}
.recarga-experiencia .rc-libre-input:focus-within{border-color:var(--verde-cocuyo);box-shadow:0 0 0 4px color-mix(in srgb,var(--verde-cocuyo) 18%,transparent)}
.recarga-experiencia .rc-libre-input b{font:600 clamp(30px,6vw,44px)/1 var(--fuente);color:var(--verde-cocuyo)}
.recarga-experiencia .rc-libre-input input{flex:1;min-width:0;width:100%;border:0;outline:0;background:transparent;color:var(--blanco-luz);font:600 clamp(30px,6vw,44px)/1.1 var(--fuente);letter-spacing:-.04em;-moz-appearance:textfield;appearance:textfield}
.recarga-experiencia .rc-libre-input input::-webkit-outer-spin-button,.recarga-experiencia .rc-libre-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.recarga-experiencia .rc-libre-input small{font-size:12px;color:var(--gris-humo)}
.recarga-experiencia .rc-chips{display:flex;flex-wrap:wrap;gap:8px}
/* Táctil: los importes rápidos miden al menos 44 px de alto. */
.recarga-experiencia .rc-chip{min-height:44px;padding:0 16px;border:1px solid var(--negro-borde);border-radius:999px;background:var(--negro-elevado);color:var(--blanco-luz);font:600 14px/1 var(--fuente);cursor:pointer;transition:background .2s,border-color .2s,color .2s,transform .2s}
.recarga-experiencia .rc-chip:hover{transform:translateY(-1px);border-color:var(--verde-cocuyo)}
.recarga-experiencia .rc-chip.activo{background:var(--verde-cocuyo);border-color:var(--verde-cocuyo);color:var(--tinta-sobre-verde)}
.recarga-experiencia .rc-libre-ayuda{margin:0;font:400 13px/1.5 var(--fuente);color:var(--gris-humo)}
.recarga-experiencia .rc-libre-ayuda .rc-benefit{color:var(--verde-cocuyo)}
@media (prefers-reduced-motion:reduce){.recarga-experiencia .rc-chip{transition:none}.recarga-experiencia .rc-chip:hover{transform:none}}

/* Móvil (auditoría cuenta-10, oct-2026): letra mínima de 12 px en la
   ventana Recargar SIN que deje de caber entera en la pantalla (sin
   desplazamiento interior: «Recarga tu creatividad» se ve completa).
   1) Letra: rótulo, frase, saldo, «Recibirás», «Pago único · USD», nombre
      del paquete, «créditos», «USD · Pago único», descuento y la nota de
      Stripe pasan a 12 px como mínimo. Van con «html body … #payModal» (o
      #modal-recarga en Mi cuenta) porque las reglas que sustituyen llevan
      un id (estudio-componentes.css) y ganarían a un selector más simple.
   2) Sitio: para recuperar la altura que suma la letra, menos aire bajo la
      frase, bajo «Comparar planes mensuales» y bajo el saldo, 2 px menos de
      relleno arriba y abajo en cada tarjeta y la nota de Stripe con
      interlineado más justo. */
@media(max-width:720px){
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .rc-header>span,
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .rc-description,
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .paysaldo,
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .paysaldo small,
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .rc-summary span,
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .rc-name,
 html body .recarga-experiencia:is(#payModal,#modal-recarga) :is(.rc-amount,.rc-price) small,
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .rc-prices s,
 html body .recarga-experiencia:is(#payModal,#modal-recarga) :is(.rc-note,.pay-nota){font-size:12px}
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .rc-description{line-height:1.4}
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .rc-copy{gap:4px}
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .rc-description{margin-bottom:12px}
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .cplanes-compare-link{margin-bottom:10px}
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .paysaldo{margin-bottom:10px}
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .rc-card{padding-block:10px}
 html body .recarga-experiencia:is(#payModal,#modal-recarga) :is(.rc-note,.pay-nota){margin-top:8px;line-height:1.35}
}
/* Pantallas bajas (iPhone SE y similares): la ventana no cabía ni antes ni
   ahora, y se desplaza entera (nunca un panel interior). Centrada, la parte
   que sobraba se cortaba POR ARRIBA (cabecera y X fuera de alcance). Con
   «safe center» sigue centrada cuando cabe y empieza arriba cuando no; los
   navegadores que no lo conocen se quedan con «flex-start» (arriba), que en
   el móvil apenas se nota porque la ventana ocupa casi toda la pantalla.
   Por debajo de 650 px de alto, además, las tres tarjetas miden lo mismo
   aunque en alguna «créditos» tenga que bajar de línea. */
@media(max-width:720px){
 html body.studio-workbench #payModal.on,html body.page-perfil #modal-recarga{align-items:flex-start;align-items:safe center}
}
@media(max-width:720px) and (max-height:650px){
 html body .recarga-experiencia:is(#payModal,#modal-recarga) .rc-grid{grid-auto-rows:1fr}
}
/* Recarga libre en el teléfono y la tableta (10-oct-2026): la tarjeta del importe es una
   sola columna. Las reglas de los paquetes antiguos (hasta 900 px) le daban 2 o 3
   columnas y montaban los importes rápidos sobre «¿Cuánto quieres recargar?», el campo
   y la frase (se veía al pulsar «Recargar créditos» desde Crear sin créditos). */
@media(max-width:900px){.recarga-experiencia .rc-card.rc-libre{grid-template-columns:minmax(0,1fr)}}


/* cocuyo-css: assets/css/estudio-escritorio.css */
/* Escritorio: jerarquía y controles del Estudio avanzado.
   Referencias: Higgsfield; Input Bar (serafimcloud) y Dashboard Sidebar
   (arunjdass) de 21st.dev. Adaptación nativa, sin dependencias ni datos ficticios.
   Los estilos móviles y la geometría de los popovers conservan su contrato. */
@media (min-width:1001px){
 body.studio-workbench:not(.experiencia-facil){--side:216px;--studio-editor:378px;font-size:15px}
 body.studio-workbench:not(.experiencia-facil) .side{padding:26px 16px 16px;background:var(--panel)}
 body.studio-workbench:not(.experiencia-facil) .side>.top{padding:0 10px 24px}
 body.studio-workbench:not(.experiencia-facil) .brand .wordmark{font-size:24px;letter-spacing:-.04em}
 body.studio-workbench:not(.experiencia-facil) #toolnav{margin-top:14px;padding-top:8px;border-top:0;gap:5px}
 body.studio-workbench:not(.experiencia-facil) .side>.navlist a{min-height:48px;padding:11px 12px;gap:12px;border:1px solid transparent;border-radius:11px;font-size:14px;font-weight:500;line-height:1.4}
 body.studio-workbench:not(.experiencia-facil) .side>.navlist a>.ic{box-sizing:border-box;width:21px;height:21px;padding:0;border:0;border-radius:0;background:transparent;stroke-width:1.65;color:var(--muted2)}
 body.studio-workbench:not(.experiencia-facil) #toolnav a.active{background:var(--studio-active);border-color:color-mix(in srgb,var(--studio-accent) 22%,transparent);box-shadow:none;font-weight:650}
 body.studio-workbench:not(.experiencia-facil) .side>.navlist a.active>.ic{background:transparent;border:0;color:var(--studio-accent)}
 body.studio-workbench:not(.experiencia-facil) .side .studio-tools-trigger{min-height:48px;padding:11px 12px;gap:12px;border-radius:11px;font-size:14px;font-weight:500}
 body.studio-workbench:not(.experiencia-facil) .side .studio-tools-trigger>.ic:first-child{box-sizing:border-box;width:21px;height:21px;padding:0;border:0;background:transparent;color:var(--muted2)}
 body.studio-workbench:not(.experiencia-facil) .studio-library-nav{margin-top:24px;padding-top:16px}
 body.studio-workbench:not(.experiencia-facil) #studioSessionToggle{min-height:54px;padding:10px 12px;gap:10px;background:transparent;border-radius:11px}
 body.studio-workbench:not(.experiencia-facil) #studioSessionToggle>span{gap:3px}
 body.studio-workbench:not(.experiencia-facil) #studioSessionToggle small{font-size:11px}
 body.studio-workbench:not(.experiencia-facil) #studioSessionToggle strong{font-size:13px;font-weight:550}
 body.studio-workbench:not(.experiencia-facil) .side .foot{gap:10px}
 body.studio-workbench:not(.experiencia-facil) .side .upgbtn{min-height:40px;font-size:12px;font-weight:550;border-radius:10px}
 body.studio-workbench:not(.experiencia-facil) .acct{min-height:66px;padding:11px;border-radius:13px}
 body.studio-workbench:not(.experiencia-facil) .acct-identidad strong{font-size:13px}
 body.studio-workbench:not(.experiencia-facil) .acct .cr{font-size:12px;font-variant-numeric:tabular-nums}
 body.studio-workbench:not(.experiencia-facil) .accmenu .mi{font-size:13px;min-height:44px}
 body.studio-workbench:not(.experiencia-facil) .studio-session-pick{font-size:13px;min-height:42px}

 /* Una mesa, con una zona de escritura abierta y una fila de ajustes clara. */
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]){--studio-dock-gap:24px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa{padding-inline:32px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .mesa-in{width:min(1120px,100%);max-height:min(460px,calc(100dvh - 150px));padding:18px 20px 16px;gap:0;border-radius:24px;border-color:var(--border2);background:var(--surface)}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .composer{grid-template-columns:minmax(0,1fr) 188px;grid-template-areas:"refs refs" "attachments attachments" "prompt prompt" "params generate";gap:12px 16px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #ta{min-height:106px;max-height:160px;padding:10px 4px 16px;border:1px solid transparent!important;border-radius:10px;background:transparent!important;font-size:17px;line-height:1.65;letter-spacing:-.012em;box-shadow:none}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #ta:focus{border-color:transparent!important;box-shadow:none}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .mesa-in:has(#ta:focus){border-color:color-mix(in srgb,var(--studio-accent) 65%,var(--border2))}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #ta:empty::before{color:var(--muted);opacity:1}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #parambar{gap:8px;padding-top:12px;border-top:1px solid var(--border)}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #headicons{padding-top:12px;border-top:1px solid var(--border)}
 body.studio-workbench:not(.experiencia-facil) #mesa .param{min-height:44px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface2);font-size:13px;font-weight:500;box-shadow:none;gap:8px;line-height:1.4}
 body.studio-workbench:not(.experiencia-facil) #mesa .param[data-pop="model"]{background:var(--surface2);font-weight:600}
 body.studio-workbench:not(.experiencia-facil) #mesa .param:hover,body.studio-workbench:not(.experiencia-facil) #mesa .param[aria-expanded="true"]{background:var(--surface3);border-color:var(--border2)}
 body.studio-workbench:not(.experiencia-facil) #mesa .param .ic{width:17px;height:17px;flex-basis:17px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #parambar .param{min-height:44px;padding:10px 12px;font-size:13px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #headicons .roundbtn{min-height:48px;padding:12px 16px;border-radius:12px;font-size:14px;letter-spacing:-.015em}
 body.studio-workbench:not(.experiencia-facil) #mesa .studio-generate-cost{font-size:12px;font-variant-numeric:tabular-nums}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #refgrid{width:100%;gap:8px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #refgrid .refwrap{flex:0 1 auto;min-width:160px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #refgrid .refbox{min-height:42px;padding:10px 12px;font-size:13px;border-radius:10px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #attrow{grid-area:attachments;margin:0!important;padding:0 2px 4px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]).modo-imagen #mesa #attrow{margin-left:0!important}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #addImageRefs{min-height:44px;padding:10px 12px;font-size:13px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageRefHint{font-size:11px;line-height:1.5}
 body.studio-workbench:not(.experiencia-facil) #mesa :is(#addImageRefs,.refbox){background:var(--surface2);border-color:var(--border)}
 body.studio-workbench:not(.experiencia-facil) #mesa :is(#addImageRefs,.refbox):hover{background:var(--studio-active);border-color:var(--studio-accent)}
 body.studio-workbench:not(.experiencia-facil) #mesa :is(button,[role="button"]):focus-visible{outline:2px solid var(--studio-accent);outline-offset:3px}

 /* Lienzo libre y obras reales: sin repetir cabeceras ni añadir promociones. */
 body.studio-workbench:not(.experiencia-facil) .studio-results-empty h3{font-size:22px;font-weight:550;line-height:1.35;letter-spacing:-.03em;color:var(--text)}
 body.studio-workbench:not(.experiencia-facil) .studio-results-empty p{font-size:14px;line-height:1.65;margin-top:10px}
 body.studio-workbench:not(.experiencia-facil) .studio-results-empty .studio-results-empty-icon{box-sizing:content-box;width:27px;height:27px;padding:17px;margin-bottom:20px;border:1px solid var(--border);border-radius:18px;background:var(--surface);color:var(--muted2)}
 body.studio-workbench:not(.experiencia-facil) .studio-results-empty button{font-size:13px;min-height:42px;padding:10px 14px}
 body.studio-workbench:not(.experiencia-facil) .histbar{padding:8px 0 14px;margin-bottom:8px;gap:12px}
 body.studio-workbench:not(.experiencia-facil) .hist-dia{padding:12px 0 16px}
 body.studio-workbench:not(.experiencia-facil) .hist-dia span{font-size:16px;font-weight:600;letter-spacing:-.02em}
 body.studio-workbench:not(.experiencia-facil) .hist-dia i{font-size:12px}
 body.studio-workbench:not(.experiencia-facil) .jobcard{border:1px solid var(--border);border-radius:16px;background:var(--surface);box-shadow:none;overflow:hidden}
 body.studio-workbench:not(.experiencia-facil) .jobcard:hover,body.studio-workbench:not(.experiencia-facil) .jobcard:focus-within{border-color:var(--border2)}
 body.studio-workbench:not(.experiencia-facil) .studio-job-caption{padding:14px 16px 16px}
 body.studio-workbench:not(.experiencia-facil) .studio-job-caption>span{font-size:12px;font-weight:600;color:var(--text)}
 body.studio-workbench:not(.experiencia-facil) .studio-job-caption p{font-size:13px;line-height:1.55;color:var(--muted2);margin-top:7px}
 body.studio-workbench:not(.experiencia-facil) .jobfila{border-radius:14px;padding:12px;gap:16px}
 body.studio-workbench:not(.experiencia-facil) :is(.jbtn,.bv-accion,.bv-chip,.bv-sel,.bv-busca,.bv-seg){font-size:13px;min-height:42px}
 body.studio-workbench:not(.experiencia-facil) .studio-assets-heading h1{font-size:30px;letter-spacing:-.035em}
 body.studio-workbench:not(.experiencia-facil) .studio-assets-heading p{font-size:14px}
 body.studio-workbench:not(.experiencia-facil) .bv-barra{padding:18px;border-radius:18px}
 body.studio-workbench:not(.experiencia-facil) .studio-asset-caption{font-size:13px;line-height:1.5;padding:12px 4px}
 body.studio-workbench:not(.experiencia-facil) .studio-asset-caption small{font-size:11px}
 body.studio-workbench:not(.experiencia-facil) :is(.bv-cuenta,.bv-dia i){font-size:12px}

 /* Selección de modelo y menús con la misma escala tipográfica. */
 body.studio-workbench:not(.experiencia-facil) #modal .mbox{width:min(840px,100%);border-radius:24px}
 body.studio-workbench:not(.experiencia-facil) #modal .msearch{min-height:48px;border-color:var(--border);border-radius:12px}
 body.studio-workbench:not(.experiencia-facil) #modal .msearch input{font-size:14px}
 body.studio-workbench:not(.experiencia-facil) #modal .mrow{padding:16px;gap:16px;border-radius:14px}
 body.studio-workbench:not(.experiencia-facil) #modal .mrow .nm{font-size:16px;letter-spacing:-.02em}
 body.studio-workbench:not(.experiencia-facil) #modal .mrow .ds{font-size:13px;line-height:1.55;color:var(--muted2)}
 body.studio-workbench:not(.experiencia-facil) #modal .mrow .spec{font-size:11px;line-height:1.5;padding:4px 8px}
 body.studio-workbench:not(.experiencia-facil) #modal .bdg{font-size:10px}
 body.studio-workbench:not(.experiencia-facil) #modal .mhead{font-size:11px;letter-spacing:.03em}
 body.studio-workbench:not(.experiencia-facil) .studio-model-note{font-size:11px}
 body.studio-workbench:not(.experiencia-facil) #modal .mrow .logo{width:42px;height:42px;flex-basis:42px;border-radius:12px}
 body.studio-workbench:not(.experiencia-facil) .studio-tools-heading p{font-size:13px}
 body.studio-workbench:not(.experiencia-facil) .studio-tools-group button b{font-size:14px}
 body.studio-workbench:not(.experiencia-facil) .studio-tools-group button small{font-size:12px}
 body.studio-workbench:not(.experiencia-facil) .studio-tools-group button em{font-size:11px}
 body.studio-workbench:not(.experiencia-facil) .studio-floating{border-radius:14px}
 body.studio-workbench:not(.experiencia-facil) .studio-floating button{font-size:13px;min-height:40px}
 body.studio-workbench.modo-audio:not(.experiencia-facil) #mesa #ta{font-size:15px;line-height:1.65;min-height:150px;max-height:220px}
 body.studio-workbench.modo-audio:not(.experiencia-facil) #mesa .mesa-in{max-height:calc(100dvh - 112px);border-radius:22px;padding:20px}
 body.studio-workbench.modo-audio:not(.experiencia-facil) #mesa :is(.studio-editor-head,.mesa-top){display:none}
 body.studio-workbench.modo-audio:not(.experiencia-facil) #mesa .modesw button{font-size:13px;min-height:42px}
 body.studio-workbench.modo-audio:not(.experiencia-facil) #mesa .studio-field-heading{font-size:12px}
}
@media (min-width:1001px) and (max-width:1190px){
 body.studio-workbench:not(.experiencia-facil){--side:196px;--studio-editor:350px}
 body.studio-workbench:not(.experiencia-facil) .side{padding-inline:12px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa{padding-inline:22px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .mesa-in{padding:16px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .composer{grid-template-columns:minmax(0,1fr) 170px;gap:10px 12px}
}
@media (min-width:1001px) and (max-height:740px){
 body.studio-workbench:not(.experiencia-facil) .side{padding-top:18px}
 body.studio-workbench:not(.experiencia-facil) .side>.top{padding-bottom:12px}
 body.studio-workbench:not(.experiencia-facil) .studio-library-nav{margin-top:12px;padding-top:10px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #ta{min-height:80px;max-height:124px}
}
@media (min-width:1001px) and (max-height:640px){
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa{padding:0}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa .mesa-in{max-height:none}
}
@media (min-width:1001px) and (prefers-reduced-motion:no-preference){
 body.studio-workbench:not(.experiencia-facil) :is(.side a,.studio-tools-trigger,.jobcard,#studioSessionToggle,#mesa .mesa-in){transition:background-color .16s,border-color .16s,box-shadow .16s}
}

/* Pulido común: botones táctiles, lectura estable y relieve discreto.
   Referencia: Great UI Minimal Buttons · 21st.dev · Saurabh Sharma (MIT). */
body.studio-workbench{color-scheme:dark}
body.studio-workbench :is(.param,.refbox,.upgbtn,.jbtn,.bv-accion,.bv-chip,.bv-sel,.bv-seg,.studio-session-toggle){font-family:var(--font);font-weight:550;line-height:1.4;letter-spacing:-.01em}
body.studio-workbench :is(.param,.refbox,.upgbtn,.jbtn,.bv-accion){box-shadow:inset 0 1px 0 rgb(255 255 255/.045)}
body.studio-workbench #mesa .roundbtn{box-shadow:inset 0 1px 0 rgb(255 255 255/.4),0 2px 6px #0004;font-weight:650}
body.studio-workbench #mesa .roundbtn:disabled{box-shadow:none}
body.studio-workbench #acct{border-color:var(--border2);border-radius:14px;box-shadow:inset 0 1px 0 #ffffff06}
body.studio-workbench #acct .cr{font-variant-numeric:tabular-nums}
body.studio-workbench :is(.accmenu,.mbox,.pop){box-shadow:0 20px 60px #0008,inset 0 1px 0 #ffffff08}
body.studio-workbench .accmenu .mi{min-height:44px;font-size:13px;line-height:1.45;gap:10px;border-radius:9px}
body.studio-workbench .accmenu .mi .val{font-size:12px;color:var(--muted2)}
body.studio-workbench .accmenu .mi:focus-visible{outline:2px solid var(--studio-accent);outline-offset:-2px;background:var(--surface2)}
body.studio-workbench .studio-settings-heading .iconbtn{width:40px;height:40px}
body.studio-workbench .studio-settings-row p,body.studio-workbench .studio-settings-note{font-size:13px;line-height:1.6}
body.studio-workbench .studio-session-heading{font-size:12px}
body.studio-workbench :is(.jerr,.jr-err){line-height:1.65;overflow-wrap:anywhere}
body.studio-workbench .bv-busca::placeholder{color:var(--muted);opacity:1}
body.studio-workbench :is(button,[role="button"]):disabled{cursor:not-allowed}
@media(min-width:1001px){
 body.studio-workbench #btnmascreditos{min-height:42px;font-size:13px}
 body.studio-workbench .accmenu{padding:10px;border-radius:18px}
 body.studio-workbench #modal .mrow .ds{max-width:62ch}
 body.studio-workbench #modal .mrow .spec{font-size:12px}
 body.studio-workbench #modal .mrow.sel{box-shadow:inset 3px 0 0 var(--studio-accent);border-color:var(--border2)}
}
@media(hover:hover){
 body.studio-workbench :is(.upgbtn,.jbtn,.bv-accion):not(:disabled):hover{background:var(--surface3);border-color:var(--border2);color:var(--text)}
 body.studio-workbench .bv-accion.viva:not(:disabled):hover{background:var(--lima-clara);color:var(--tinta-sobre-verde)}
}

/* Marcas: mismo verde, proporción y soporte; sin fondos multicolor. */
body.studio-workbench .mrcbox{width:30px;height:30px;flex:0 0 30px;border-radius:9px;background:var(--surface2);border:1px solid var(--border2);color:var(--verde-cocuyo);box-shadow:inset 0 1px 0 #ffffff07}
body.studio-workbench .mrcbox .mrc{width:20px;height:20px;display:block}
body.studio-workbench.modo-audio .ap-fila>.mrcbox{color:var(--verde-cocuyo)}
body.studio-workbench .mrow .mrcbox{width:42px;height:42px;flex-basis:42px;border-radius:12px}
body.studio-workbench .mrow .mrcbox .mrc{width:27px;height:27px}
body.studio-workbench .mrow.sel .mrcbox{background:var(--studio-active);border-color:color-mix(in srgb,var(--verde-cocuyo) 35%,var(--border))}
body.studio-workbench #mesa .param .mrcbox{width:24px;height:24px;flex-basis:24px;background:transparent;border:0;box-shadow:none}
body.studio-workbench #mesa .param .mrcbox .mrc{width:21px;height:21px}
body.studio-workbench .pill .mrcbox{width:22px;height:22px;flex-basis:22px}
.studio-model-note{margin:0 0 16px;color:var(--muted);font-size:12px;line-height:1.5;max-width:58ch}
.studio-model-price{margin-top:9px;color:var(--text);font-size:12px;font-weight:650;font-variant-numeric:tabular-nums}
.studio-model-pending{margin-top:18px;border-top:1px solid var(--border);padding-top:14px}
.studio-model-pending>summary{display:flex;align-items:center;gap:10px;padding:10px 2px;color:var(--muted);font-size:13px;cursor:pointer;list-style:none}
.studio-model-pending>summary::after{content:'+';margin-left:auto;font-size:19px}
.studio-model-pending[open]>summary::after{content:'−'}
.studio-model-pending>summary span{font-size:11px;border:1px solid var(--border);border-radius:6px;padding:2px 6px}
.studio-model-pending>summary:focus-visible{outline:2px solid var(--studio-accent,#afff2b);outline-offset:3px;border-radius:8px}
.studio-model-pending .mrow.locked{opacity:1}
.studio-model-pending .mrow .logo,.studio-model-pending .mrow .radio{opacity:.5}
.studio-model-pending .mrow .nm{color:var(--muted)}


/* cocuyo-css: assets/css/referencias-iconos.css */
/* Símbolos propios de Cocuyo: encuadre, claqueta y onda con dos luces.
   El modelo decide qué iconos y formatos admite; conserva el selector real. */
body.studio-workbench #mesa .ref-orbits{display:inline-flex;align-items:center;justify-content:center;isolation:isolate;flex:none;padding:4px 7px}
body.studio-workbench #mesa .ref-orb{box-sizing:border-box;display:grid;place-items:center;width:52px;height:52px;border:1px solid var(--border2);border-radius:50%;background:radial-gradient(circle at 30% 10%,var(--surface3),var(--surface2) 65%);box-shadow:inset 0 1px 2px color-mix(in srgb,var(--text) 10%,transparent),0 5px 12px color-mix(in srgb,var(--bg) 45%,transparent);color:var(--muted2);transition:transform .3s cubic-bezier(.2,.8,.2,1),color .2s,border-color .2s}
body.studio-workbench #mesa .ref-orb+.ref-orb{margin-left:-12px}
body.studio-workbench #mesa .ref-orb:nth-child(2){z-index:1;transform:translateY(-3px)}
body.studio-workbench #mesa .ref-orb svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}
body.studio-workbench #mesa .ref-luz{fill:var(--studio-accent,var(--verde-cocuyo));stroke:none}
body.studio-workbench #mesa :is(.ref-hub,#addImageRefs):is(:hover,:focus-visible) .ref-orb{color:var(--text);border-color:var(--studio-accent,var(--verde-cocuyo));transform:translateY(-4px)}
body.studio-workbench #mesa :is(.ref-hub,#addImageRefs):is(:hover,:focus-visible) .ref-orb:nth-child(2){transform:translateY(-7px)}
body.studio-workbench #mesa #refgrid .refwrap-media{flex:1 1 100%;min-width:0}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio) #mesa #refgrid .ref-hub,
body.studio-workbench:not(.experiencia-facil):not(.modo-audio) #mesa #addImageRefs{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;width:100%;min-height:146px;padding:18px 16px;border:1px solid var(--border);border-radius:18px;background:var(--surface2);color:var(--text);font-size:14px;font-weight:500;text-align:center}
body.studio-workbench #mesa #refgrid .ref-hub .refbox-label{align-items:center;text-align:center;gap:6px}
body.studio-workbench #mesa #refgrid .ref-hub .refbox-label small{color:var(--muted2);font-size:12px}
body.studio-workbench #mesa #addImageRefs #imageRefCount{position:absolute;right:12px;top:12px;font-size:10px;font-weight:400;color:var(--muted2);padding:4px 7px;border:1px solid var(--border);border-radius:8px;min-width:0}
body.studio-workbench #mesa #imageRefHint{width:100%;text-align:center;margin:7px 0 0;font-size:11px}
@media(min-width:901px){body.studio-workbench:not(.experiencia-facil):not(.modo-audio) #mesa #refgrid .ref-hub,body.studio-workbench:not(.experiencia-facil):not(.modo-audio) #mesa #addImageRefs{min-height:138px}}
@media(prefers-reduced-motion:reduce){body.studio-workbench #mesa .ref-orb{transition:none!important;transform:none!important}}

/* Límites por tipo: se leen de un vistazo, sin una frase que se corta. */
.refpop .ref-pop-title{display:block;padding:4px 4px 12px;font-size:14px;font-weight:600;color:var(--text)}
.refpop .ref-limits{display:grid;gap:6px;margin-bottom:12px}
.refpop .ref-limit{display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--border);border-radius:10px;background:var(--surface2);font-size:13px;color:var(--muted2)}
.refpop .ref-limit strong{font-weight:550;font-size:12px;color:var(--studio-accent);white-space:nowrap;font-variant-numeric:tabular-nums}
.refpop .ref-limit .ref-orbits{display:flex;padding:0}
.refpop .ref-limit .ref-orb{display:flex;align-items:center;justify-content:center;width:28px;height:28px;color:var(--studio-accent)}
.refpop .ref-limit svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.refpop .ref-limit .ref-luz{fill:currentColor;stroke:none}
.refpop .ref-pop-hint{font-size:12px;line-height:1.6;margin:8px 4px 12px;color:var(--muted2)}
.refpop :is([data-uploadkind],[data-openlib]){display:flex;align-items:center;gap:9px;min-height:44px;padding:11px 10px;font-size:13px;line-height:1.4;border-radius:9px;text-align:left;white-space:normal}
.refpop :is([data-uploadkind],[data-openlib]) .ic{flex:none}
.refpop [data-uploadkind]{background:var(--studio-active);color:var(--studio-accent)}
body.studio-workbench #mesa .refpop .ref-orbits{padding:0}
body.studio-workbench #mesa .refpop .ref-orb{width:26px;height:26px;border:0;border-radius:0;background:none;box-shadow:none;transform:none;color:var(--studio-accent)}
body.studio-workbench #mesa .refpop .ref-orb svg{width:22px;height:22px}


/* cocuyo-css: assets/css/estudio-referencias.css */
/* Referencias compactas: Higgsfield y Audio Upload Card de isaiahbjork (21st.dev).
   Miniaturas reales, acceso por tipo y vista previa con controles nativos. */
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #imageReferenceTray{display:flex;grid-area:refs;align-items:center;flex-wrap:wrap;gap:10px;min-width:0;width:100%;position:relative}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #attrow{flex:0 1 auto;order:0;align-items:center;flex-wrap:wrap!important;max-width:100%;gap:8px!important;margin:0!important;padding:0!important;overflow:visible}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #refgrid{flex:0 0 auto;order:1;align-self:center;width:auto;max-width:100%;margin:0;gap:6px;position:static}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #refgrid .refwrap-compact{flex:0 0 auto;min-width:0;position:static}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #refgrid .ref-add-compact{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:7px;min-width:0;width:auto;min-height:44px;height:44px;padding:10px 12px;border:1px solid var(--border2);border-radius:11px;background:var(--surface2);color:var(--muted2);font:500 12px/1.2 var(--font);box-shadow:none}
body.studio-workbench #mesa .ref-add-compact .ref-orbits{padding:0}
body.studio-workbench #mesa .ref-add-compact .ref-orb{width:19px;height:19px;border:0;border-radius:0;background:none;box-shadow:none;transform:none;color:inherit}
body.studio-workbench #mesa .ref-add-compact .ref-orb svg{width:19px;height:19px;stroke-width:1.6}
body.studio-workbench #mesa .ref-add-count{font:500 11px/1 var(--font);color:var(--studio-accent);font-variant-numeric:tabular-nums}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #refgrid .ref-add-compact:is(:hover,:focus-visible,[aria-expanded="true"]){border-color:var(--studio-accent);color:var(--text);background:var(--studio-active)}
body.studio-workbench #mesa :is(.ref-add-compact,.attver,.attrol,.attchip .x):focus-visible{outline:2px solid var(--studio-accent);outline-offset:2px}
body.studio-workbench #mesa .refwrap-compact .refpop:not(.studio-floating){position:absolute;left:0;bottom:calc(100% + 12px);transform:none;width:min(320px,100%);box-sizing:border-box;text-align:left}
body.studio-workbench #mesa .refwrap-compact .ref-pop-title{display:flex;justify-content:space-between;gap:12px}
body.studio-workbench #mesa .refwrap-compact .ref-pop-title b{font-size:12px;color:var(--studio-accent);font-variant-numeric:tabular-nums}
body.studio-workbench #mesa .refpop button:disabled{opacity:.45;cursor:default}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .attchip{position:relative;box-sizing:border-box;flex:0 0 74px;width:74px;height:80px;border:1px solid var(--border2);border-radius:11px;background:var(--surface2);overflow:hidden;box-shadow:none}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .attchip :is(img,video){display:block;width:100%;height:100%;object-fit:cover}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .attchip .x{position:absolute;top:3px;right:3px;width:24px;height:24px;padding:4px;z-index:4;border:1px solid var(--border2);border-radius:50%;background:var(--bg);color:var(--text)}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .attchip .attver{position:absolute;inset:0;display:grid;place-items:center;width:100%;height:100%;padding:0;border:0;border-radius:0;background:color-mix(in srgb,var(--bg) 18%,transparent);color:var(--text);opacity:1;cursor:pointer}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .attchip .attver svg{width:21px;height:21px;filter:drop-shadow(0 1px 3px var(--bg))}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .attchip .attrol{position:absolute;inset:auto 0 0;width:100%;height:24px;min-height:24px;z-index:3;margin:0;padding:2px 5px;border:0;border-top:1px solid var(--border2);border-radius:0;background:var(--bg);color:var(--text);font:500 10px/1.2 var(--font)}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa :is(.attcuenta,.attrolfijo){display:none}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .attchip[data-kind="audio"]{flex-basis:162px;width:162px;padding:12px 34px 9px 12px}
body.studio-workbench #mesa .attchip[data-kind="audio"] .attico{display:flex;align-items:center;width:25px;height:25px;color:var(--studio-accent)}
body.studio-workbench #mesa .att-media-name{display:block;margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 11px/1.2 var(--font);color:var(--text)}
body.studio-workbench #mesa .att-duration{position:absolute;bottom:5px;right:5px;padding:3px 4px;border-radius:4px;background:var(--bg);color:var(--muted2);font:500 10px/1 var(--font);font-variant-numeric:tabular-nums}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .attchip[data-kind="audio"] .attver{inset:8px 36px auto auto;width:28px;height:28px;background:var(--surface3);border-radius:50%}
dialog.att-preview{box-sizing:border-box;position:fixed;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:18px;width:min(1000px,94vw);max-width:94vw;height:auto;max-height:90dvh;margin:auto;padding:44px 24px 24px;border:1px solid var(--border2);border-radius:18px;background:var(--surface);color:var(--text);box-shadow:0 24px 80px var(--bg)}
dialog.att-preview[open]{display:flex}
dialog.att-preview::backdrop{background:color-mix(in srgb,var(--bg) 85%,transparent);backdrop-filter:blur(8px)}
dialog.att-preview :is(img,video){display:block;max-width:100%;max-height:70dvh;object-fit:contain;border-radius:9px}
dialog.att-preview audio{width:min(540px,100%)}
dialog.att-preview p{margin:0;max-width:100%;overflow-wrap:anywhere;font-size:14px;color:var(--muted2)}
dialog.att-preview .attlupax{position:absolute;top:8px;right:8px;display:grid;place-items:center;width:36px;height:36px;padding:8px;border:1px solid var(--border2);border-radius:50%;background:var(--surface2);color:var(--text)}
@media(min-width:1001px){
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .mesa-in{width:100%;max-height:calc(100dvh - 145px);padding:14px 18px 16px;border-radius:20px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .composer{gap:8px 14px;overflow:visible}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #ta{min-height:48px;max-height:120px;padding:6px 0 10px;font-size:15px;line-height:1.6}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #attrow{max-height:170px;overflow-y:auto;max-width:100%}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #parambar{gap:6px;padding-top:6px;border-top:0}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #parambar .param{min-height:40px;padding:9px 11px;font-size:12px}
}
@media(max-width:1000px){
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #imageReferenceTray{margin-bottom:12px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa #refgrid .ref-add-compact{gap:4px;padding:8px 6px;font-size:11px}
 body.studio-workbench #mesa .ref-add-compact :is(.ref-orb,.ref-orb svg){width:16px;height:16px}
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .refwrap-compact .refpop:not(.studio-floating){position:fixed;left:12px;right:12px;bottom:calc(80px + env(safe-area-inset-bottom,0px));width:auto;max-height:70dvh;overflow:auto;z-index:200}
}
@media(prefers-reduced-motion:no-preference){body.studio-workbench #mesa .ref-add-compact{transition:background .16s,border-color .16s,color .16s}}



/* cocuyo-css: assets/css/estudio-imagen.css */
/* Imagen: bienvenida provisional y un solo compositor compacto.
   Referencias: Higgsfield + File Attachment de serafimcloud (21st.dev).
   Los controles y las miniaturas conservan sus eventos y límites originales. */
#imageReferenceTray{display:contents}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageReferenceTray{display:flex;grid-area:refs;grid-column:1/-1;grid-row:1;align-items:center;gap:8px;min-width:0;max-width:100%;order:1}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageRefControls{display:flex;position:relative;align-self:center;flex:0 0 56px;width:56px;gap:0;margin:0;padding:0;order:2}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageRefControls[hidden]{display:none}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio) #mesa #addImageRefs{box-sizing:border-box;display:grid;place-items:center;width:56px;height:56px;min-height:56px;padding:0;gap:0;border:1px solid var(--border2);border-radius:12px;background:var(--surface2);color:var(--muted2);box-shadow:none}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #addImageRefs:is(:hover,:focus-visible):not(:disabled){color:var(--studio-accent);border-color:var(--studio-accent);background:var(--studio-active)}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageRefIcons{display:grid;place-items:center}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageRefIcons .ic{width:22px;height:22px;stroke-width:1.6}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa :is(#imageRefLabel,#imageRefCount){position:absolute!important;width:1px!important;height:1px!important;min-width:0!important;padding:0!important;margin:-1px!important;border:0!important;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageRefHint{width:auto;margin:0 4px 12px;text-align:left;font-size:12px;line-height:1.6}
body.studio-workbench.modo-imagen:not(.experiencia-facil)[data-studio-mode="image"] #mesa #attrow{flex:0 1 auto;order:1;min-width:0;max-width:calc(100% - 64px);gap:8px!important;margin:0!important;padding:4px 0!important;overflow-x:auto;scrollbar-width:thin}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .attchip{box-sizing:border-box;flex:0 0 56px;width:56px;height:56px;border:1px solid var(--border2);border-radius:10px;overflow:hidden}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .attchip img{width:100%;height:100%;object-fit:cover}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .attchip .x{top:2px;right:2px;width:24px;height:24px;padding:0;border:1px solid #ffffff26;border-radius:50%;background:#141414e6;color:#fff;z-index:3}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .attchip .attver{inset:0;display:grid;place-items:center;width:100%;height:100%;opacity:0;background:#0005;border-radius:0}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .attchip:hover .attver{opacity:1}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa :is(.attrolfijo,.attcuenta){display:none}
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .attchip.up{background:var(--surface2)}
@media(hover:hover) and (pointer:fine){
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .attchip .x{opacity:0;transition:opacity .15s}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .attchip:is(:hover,:focus-within) .x{opacity:1}
}

/* Galería editorial amplia. Las escenas inspiran; no son referencias adjuntas.
   El movimiento de las imágenes sigue el control de estudio-video.js. */
body.studio-workbench .studio-image-welcome{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;width:100%;min-width:0;min-height:360px;padding:24px 20px;text-align:left;overflow:hidden;box-sizing:border-box}
body.studio-workbench .studio-image-gallery{position:relative;width:min(100%,1120px);min-width:0}
body.studio-workbench .studio-image-mood{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:100%;height:auto;margin:0;isolation:isolate}
body.studio-workbench .studio-image-mood>span{position:relative;display:block;min-width:0;min-height:0;aspect-ratio:4/3;margin:0;overflow:hidden;border:1px solid var(--border2);border-radius:16px;background:var(--surface2)}
body.studio-workbench .studio-image-mood img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.85)}
body.studio-workbench .studio-image-mood>span:nth-child(1) img{object-position:50% 42%}
body.studio-workbench .studio-image-mood>span::after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,color-mix(in srgb,var(--bg) 84%,transparent));pointer-events:none}
body.studio-workbench .studio-image-mood small{position:absolute;bottom:16px;left:17px;right:12px;z-index:1;color:var(--text);font:550 12px/1.3 var(--font);text-shadow:0 1px 8px var(--bg)}
body.studio-workbench .studio-image-welcome[data-empty-mode="image"] .studio-video-motion{top:12px;right:12px;bottom:auto;width:40px;min-height:40px;padding:10px;background:color-mix(in srgb,var(--bg) 78%,transparent);color:var(--text);border:1px solid var(--border2);backdrop-filter:blur(8px)}
body.studio-workbench .studio-welcome-summary{display:flex;flex-direction:column;align-items:center;gap:8px;width:min(100%,1120px);max-width:1120px;text-align:center}
body.studio-workbench:not(.experiencia-facil) .studio-image-welcome h3{margin:0;font:600 clamp(24px,2.4vw,32px)/1.2 var(--font);letter-spacing:-.03em;color:var(--text)}
body.studio-workbench:not(.experiencia-facil) .studio-image-welcome p{max-width:360px;margin:0;font-size:13px;line-height:1.65;color:var(--muted2);text-wrap:pretty}

@media(min-width:1001px){
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa{padding-inline:24px}
 /* Un mismo margen para adjuntos, texto y ajustes. Inspiración de AI Prompt
    Box (johuniq / 21st.dev); conservamos el compositor y eventos de Cocuyo. */
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .mesa-in{width:100%;max-height:calc(100dvh - 145px);padding:12px 16px;border:1px solid var(--border2);border-radius:18px;background:var(--surface);box-shadow:0 12px 40px color-mix(in srgb,var(--bg) 55%,transparent)}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .mesa-in:focus-within{border-color:color-mix(in srgb,var(--text) 22%,transparent)}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .composer{grid-template-columns:44px minmax(0,1fr) 168px;grid-template-areas:"refs prompt prompt" "limit limit limit" "params params generate";gap:5px 12px}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageReferenceTray{--ref-size:56px;grid-area:refs;align-self:start;gap:6px}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageRefControls{flex:0 0 44px;width:44px}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageRefControls #addImageRefs{width:44px;height:44px;min-height:44px;border:1px solid var(--border2);border-radius:10px;background:var(--surface2)}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageRefIcons .ic{width:18px;height:18px}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .composer:has(.attchip){grid-template-areas:"refs refs refs" "prompt prompt prompt" "limit limit limit" "params params generate"}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageReferenceTray #attrow{max-width:calc(100% - 64px);padding:0!important}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .attchip{width:56px;height:56px;flex-basis:56px;border-radius:10px}
 /* 9-oct-2026: con miniaturas, el botón de añadir mide lo mismo que ellas (56 px). */
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .composer:has(.attchip) #imageRefControls{flex:0 0 56px;width:56px}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .composer:has(.attchip) #imageRefControls #addImageRefs{width:56px;height:56px;min-height:56px;border-radius:10px}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #ta{min-height:44px;max-height:120px;padding:10px 0 6px;margin:0;font-size:15px;line-height:1.55;border-radius:0;color:var(--text);caret-color:var(--studio-accent)}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa :is(#headicons,#parambar){position:static;inset:auto;padding-top:4px;border:0;background:none}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #parambar{gap:8px;align-items:center;background:none}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #parambar .param{min-height:40px;height:auto;padding:8px 12px;gap:8px;border:1px solid var(--border);border-radius:10px;background:var(--surface2);color:var(--text);font:550 13px/1.35 var(--font);box-shadow:none}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #parambar .param[data-pop="model"]{background:#ffffff0b;border-color:#ffffff1b;color:#fff}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #parambar .param:is(:hover,:focus-visible,.open){background:#ffffff10;border-color:#ffffff35;color:#fff}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #parambar .param:focus-visible{outline:2px solid var(--studio-accent);outline-offset:3px}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #parambar .param :is(.ic,.mrc){width:17px;height:17px;flex-shrink:0}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #parambar .param .car{color:#9e9e9e;font-size:14px}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #promptLimit{padding:0;font-size:10px;line-height:1.3;color:var(--muted2)}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #headicons .roundbtn{min-height:44px;padding:10px 14px;border-radius:10px;font-size:13px;font-weight:650;box-shadow:none}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio) .studio-image-welcome{min-height:clamp(300px,calc(100dvh - var(--mesa-h,210px) - 112px),900px);padding-block:18px}
}
@media(max-width:1000px){
 body.studio-workbench .studio-image-mood{grid-template-columns:repeat(2,minmax(0,1fr));height:auto;gap:8px}
 body.studio-workbench .studio-image-welcome{min-height:0;gap:22px;padding:18px 8px}
}
@media(max-width:900px){
 body.studio-workbench.modo-imagen:not(.experiencia-facil) .studio-workspace:has(.studio-image-welcome){display:flex;flex-direction:column}
 body.studio-workbench.modo-imagen:not(.experiencia-facil) .studio-results:has(.studio-image-welcome){order:-1;margin:0 0 20px;padding:0;border:0}
 body.studio-workbench.modo-imagen:not(.experiencia-facil) .studio-image-welcome{min-height:0;padding:8px 0;gap:20px}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .composer{min-height:0;gap:0}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageReferenceTray{margin-bottom:10px}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #ta{min-height:106px}
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #headicons{margin-top:0}
}
@media(max-width:600px){
 body.studio-workbench .studio-image-mood{gap:6px}
 body.studio-workbench .studio-image-mood>span{border-radius:11px}
 body.studio-workbench .studio-image-mood small{font-size:10px;bottom:10px;left:11px}
 body.studio-workbench:not(.experiencia-facil) .studio-image-welcome h3{font-size:24px}
 body.studio-workbench:not(.experiencia-facil) .studio-image-welcome p{font-size:12px;max-width:310px;margin:0}
}
@media(min-width:1001px) and (max-height:740px){
 body.studio-workbench .studio-image-welcome{gap:18px}
}

/* Un compositor táctil compacto, conservando los campos y eventos originales. */
@media(max-width:900px){
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa .composer{padding:12px;border:1px solid var(--border2);border-radius:18px;background:var(--surface);box-shadow:none!important}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageReferenceTray{margin:0 0 8px;gap:8px}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageRefControls{width:auto;flex:0 0 auto}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #addImageRefs{width:44px;height:44px;min-height:44px;border-radius:11px}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #ta{min-height:80px;max-height:28dvh;padding:10px 2px;font-size:16px;line-height:1.5;background:transparent!important;border:0!important;border-radius:8px}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #promptLimit{margin:4px 0 0;padding:0;font-size:10px;line-height:14px;min-height:0;background:transparent}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #parambar{gap:7px;padding:8px 0 0}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #parambar>.param[data-pop="model"]{min-height:44px;padding:10px 12px;margin:0;border:1px solid var(--border);border-radius:10px;background:var(--surface2)}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #parambar .param:not([data-pop="model"]){flex:1;justify-content:center;min-width:0;min-height:44px;padding:8px 6px;font-size:12px;border-radius:10px}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #parambar>.cost{min-height:0;padding:0;font-size:11px}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #headicons{padding:8px 0 0}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #headicons .roundbtn{min-height:48px;padding:12px;font-size:14px}
}


/* cocuyo-css: assets/css/estudio-video.css */
/* Bienvenida de Video: estructura Empty State de serafimcloud (21st.dev),
   llevada al lenguaje de Imagen con material de Cocuyo y movimiento controlable. */
body.studio-workbench .studio-video-welcome{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;position:relative;isolation:isolate;min-height:400px;padding:26px 12px 30px;text-align:center;overflow:hidden}
body.studio-workbench .studio-video-welcome::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 32%,#aff33e09,transparent 62%);pointer-events:none}
.studio-video-mood{position:relative;width:min(640px,96%);height:206px;display:flex;align-items:center;justify-content:center;isolation:isolate}
.studio-video-still{position:absolute;top:25px;width:30%;height:160px;object-fit:cover;border:2px solid var(--border2);border-radius:13px;filter:saturate(.4) brightness(.7)}
.studio-video-still:first-child{left:2%;transform:rotate(-10deg)}
.studio-video-still:nth-child(2){right:2%;transform:rotate(10deg)}
.studio-video-frame{position:relative;z-index:1;width:68%;aspect-ratio:16/9;max-height:206px;overflow:hidden;border:2px solid #3b4038;border-radius:16px;box-shadow:0 16px 40px #0009;background:var(--surface)}
.studio-video-frame video{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.8)}
.studio-video-frame::after{content:"";position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#0009);pointer-events:none}
.studio-video-frame>span{position:absolute;left:14px;bottom:14px;z-index:1;color:#fff;font:550 11px/1.2 var(--font);letter-spacing:.13em}
body.studio-workbench .studio-video-welcome .studio-video-motion{position:absolute;right:10px;bottom:8px;z-index:2;display:grid;place-items:center;width:38px;min-height:38px;padding:9px;margin:0;border:1px solid #fff4;border-radius:50%;background:#070a07c9;color:#fff;backdrop-filter:blur(8px)}
.studio-video-motion svg{width:17px;height:17px}
.studio-video-motion[data-playing="true"] .welcome-play,.studio-video-motion:not([data-playing="true"]) .welcome-pause{display:none}
.studio-video-welcome-copy{max-width:540px}
.studio-video-eyebrow{display:block;margin-bottom:10px;color:var(--muted2);font:550 10px/1.4 var(--font);letter-spacing:.16em}
body.studio-workbench:not(.experiencia-facil) .studio-video-welcome h3{margin:0;font:650 clamp(30px,3.3vw,42px)/1.08 var(--font);letter-spacing:-.045em;color:var(--text)}
.studio-video-welcome h3 em{font-style:normal;color:var(--studio-accent)}
body.studio-workbench:not(.experiencia-facil) .studio-video-welcome p{max-width:390px;margin:13px auto 0;font-size:13px;line-height:1.65;color:var(--muted2);text-wrap:balance}
body.studio-workbench .studio-video-welcome [data-studio-focus]{display:inline-flex;align-items:center;gap:8px;min-height:40px;margin:18px 0 0;padding:9px 14px;border:1px solid var(--border2);border-radius:10px;background:var(--surface);color:var(--text);font:500 12px/1.4 var(--font)}
body.studio-workbench .studio-video-welcome button:is(:hover,:focus-visible){border-color:var(--studio-accent);color:var(--studio-accent)}
body.studio-workbench .studio-video-welcome button:focus-visible{outline:2px solid var(--studio-accent);outline-offset:3px}
@media(min-width:1001px){body.studio-workbench .studio-video-welcome{min-height:clamp(360px,calc(100dvh - var(--mesa-h,220px) - 98px),740px)}}
@media(min-width:1001px) and (max-height:760px){body.studio-workbench .studio-video-welcome{gap:14px;padding-block:14px}.studio-video-mood{height:146px;width:470px}.studio-video-frame{max-height:146px}.studio-video-still{height:118px;top:14px}body.studio-workbench:not(.experiencia-facil) .studio-video-welcome h3{font-size:32px}.studio-video-eyebrow{margin-bottom:7px}body.studio-workbench .studio-video-welcome [data-studio-focus]{margin-top:12px}}
@media(max-width:1000px){body.studio-workbench .studio-video-welcome{min-height:300px;padding:18px 4px;gap:18px}.studio-video-mood{width:min(500px,96%);height:166px}.studio-video-frame{max-height:166px}.studio-video-still{height:132px;top:18px}}
@media(max-width:900px){body.studio-workbench:not(.experiencia-facil)[data-studio-mode="video"] .studio-workspace:has(.studio-video-welcome){display:flex;flex-direction:column}body.studio-workbench:not(.experiencia-facil) .studio-results:has(.studio-video-welcome){order:-1;margin:0 0 20px;padding:0;border:0}body.studio-workbench .studio-video-welcome{min-height:0;padding:12px 0 8px;gap:14px}.studio-video-mood{height:122px;width:min(350px,96%)}.studio-video-frame{width:73%;max-height:122px;border-radius:12px}.studio-video-still{height:94px;top:15px;border-radius:10px}.studio-video-frame>span{font-size:11px;left:9px;bottom:12px}.studio-video-eyebrow{font-size:11px;margin-bottom:7px}body.studio-workbench:not(.experiencia-facil) .studio-video-welcome h3{font-size:28px}body.studio-workbench:not(.experiencia-facil) .studio-video-welcome p{font-size:12px;margin-top:10px;max-width:280px}body.studio-workbench .studio-video-welcome [data-studio-focus]{margin-top:12px;min-height:44px}}
@media(prefers-reduced-motion:no-preference){.studio-video-mood{animation:studio-video-arrive .6s both cubic-bezier(.2,.65,.3,1)}@keyframes studio-video-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}}

/* Video ocupa el lienzo con una sola escena en movimiento y referencias propias.
   La variante de Audio conserva su composición y su controlador existentes. */
body.studio-workbench .studio-video-welcome[data-empty-mode="video"]{width:100%;min-width:0;min-height:0;padding:18px 0 24px;gap:26px;text-align:left;box-sizing:border-box}
body.studio-workbench .studio-video-welcome[data-empty-mode="video"]::before{display:none}
.studio-video-welcome[data-empty-mode="video"] .studio-video-mood{display:grid;grid-template-columns:minmax(0,2.15fr) minmax(0,.85fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:10px;width:min(100%,1120px);height:clamp(230px,39dvh,430px);margin:0;animation:none}
.studio-video-welcome[data-empty-mode="video"] .studio-video-frame{grid-column:1;grid-row:1/3;width:100%;height:100%;max-height:none;aspect-ratio:auto;border:1px solid var(--border2);border-radius:16px;box-shadow:none;background:var(--surface2)}
.studio-video-welcome[data-empty-mode="video"] .studio-video-frame video{filter:saturate(.85)}
.studio-video-welcome[data-empty-mode="video"] .studio-video-frame::after{background:linear-gradient(transparent,color-mix(in srgb,var(--bg) 80%,transparent))}
.studio-video-welcome[data-empty-mode="video"] .studio-video-frame>span{left:18px;bottom:19px;right:64px;color:var(--text);font-size:11px;line-height:1.5}
.studio-video-welcome[data-empty-mode="video"] .studio-video-reference{position:relative;grid-column:2;min-width:0;min-height:0;margin:0;border:1px solid var(--border2);border-radius:14px;overflow:hidden;background:var(--surface2)}
.studio-video-welcome[data-empty-mode="video"] .studio-video-reference img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.7)}
.studio-video-welcome[data-empty-mode="video"] .studio-video-reference::after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,color-mix(in srgb,var(--bg) 88%,transparent));pointer-events:none}
.studio-video-welcome[data-empty-mode="video"] .studio-video-reference figcaption{position:absolute;z-index:1;bottom:13px;left:13px;right:10px;color:var(--text);font:550 11px/1.4 var(--font);text-shadow:0 1px 8px var(--bg)}
body.studio-workbench .studio-video-welcome[data-empty-mode="video"] .studio-video-motion{right:12px;bottom:12px;width:40px;min-height:40px;padding:10px;border-color:var(--border2);background:color-mix(in srgb,var(--bg) 78%,transparent);color:var(--text)}
body.studio-workbench:not(.experiencia-facil) .studio-video-welcome[data-empty-mode="video"] h3{font-size:clamp(24px,2.4vw,32px);font-weight:600;line-height:1.2;letter-spacing:-.03em}
body.studio-workbench:not(.experiencia-facil) .studio-video-welcome[data-empty-mode="video"] p{max-width:340px;margin:0;font-size:13px;line-height:1.65;text-wrap:pretty}
@media(min-width:1001px){
 body.studio-workbench .studio-video-welcome[data-empty-mode="video"]{min-height:calc(100dvh - var(--st-top,64px) - 48px);padding:24px 0}
}
@media(min-width:1001px) and (max-width:1199px){
 .studio-video-welcome[data-empty-mode="video"] .studio-video-mood{grid-template-columns:minmax(0,1.8fr) minmax(0,.8fr);height:clamp(240px,38dvh,360px)}
}
@media(max-width:1000px){
 body.studio-workbench .studio-video-welcome[data-empty-mode="video"]{min-height:0;padding:8px 0;gap:22px}
 .studio-video-welcome[data-empty-mode="video"] .studio-video-mood{height:clamp(230px,36vw,350px)}
}
@media(max-width:600px){
 .studio-video-welcome[data-empty-mode="video"] .studio-video-mood{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,2fr) minmax(0,1fr);height:clamp(250px,76vw,360px);gap:6px}
 .studio-video-welcome[data-empty-mode="video"] .studio-video-frame{grid-column:1/3;grid-row:1;border-radius:12px}
 .studio-video-welcome[data-empty-mode="video"] .studio-video-reference{grid-column:auto;grid-row:2;border-radius:10px}
 .studio-video-welcome[data-empty-mode="video"] .studio-video-reference figcaption{font-size:10px;bottom:9px;left:10px}
 .studio-video-welcome[data-empty-mode="video"] .studio-video-frame>span{font-size:11px;left:13px;bottom:18px}
 body.studio-workbench:not(.experiencia-facil) .studio-video-welcome[data-empty-mode="video"] h3{font-size:24px}
 body.studio-workbench:not(.experiencia-facil) .studio-video-welcome[data-empty-mode="video"] p{font-size:12px;max-width:310px}
}

/* Inspiración móvil compacta: vídeo reproducible y dos ejemplos junto al editor. */
@media(max-width:900px){
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"]{padding:4px 0;gap:12px}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .ej-heading{padding:0}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .ej-heading h3{max-width:none;font-size:22px;line-height:1.2}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .ej-heading p{max-width:none;margin-top:6px;font-size:12px;line-height:1.45}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .studio-video-mood{width:100%;height:clamp(135px,37vw,150px);grid-template-columns:minmax(0,2.3fr) minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:6px}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .studio-video-frame{grid-column:1;grid-row:1/3;min-width:0;min-height:0;border-radius:12px}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .studio-video-reference{grid-column:2;grid-row:auto;border-radius:10px}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .studio-video-reference figcaption{left:7px;right:6px;bottom:6px}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .studio-video-reference figcaption b{margin-bottom:2px;font-size:10px;line-height:1.2}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .studio-video-reference figcaption span{font-size:11px;line-height:1.3}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .studio-video-frame>.ej-model{top:8px;left:8px;max-width:calc(100% - 16px);padding:4px 5px;font-size:11px}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .ej-video-title{left:10px;right:56px;bottom:10px}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .ej-video-title b{font-size:16px;line-height:1.15}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .ej-video-title small{margin-top:4px;font-size:11px}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .studio-video-motion{width:44px;height:44px;min-height:44px;right:7px;bottom:7px;padding:11px}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .ej-video-footer{display:grid;grid-template-columns:minmax(0,1fr) minmax(120px,145px);align-items:center;gap:10px}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .ej-video-footer p{max-width:none;margin:0;font-size:11px;line-height:1.4}
 body.studio-workbench.studio-simple .studio-video-welcome[data-empty-mode="video"] .ej-video-footer .ej-action{min-width:0;min-height:44px;padding:8px 10px;gap:7px;font-size:11px;line-height:1.35;white-space:normal}
 body.studio-workbench.studio-simple[data-studio-mode="video"] .studio-results:has(.studio-video-welcome[data-empty-mode="video"]){margin-bottom:0}
 body.studio-workbench.studio-simple[data-studio-mode="video"] .studio-workspace:has(.studio-video-welcome[data-empty-mode="video"]){gap:14px}
}


/* cocuyo-css: assets/css/inspiracion.css */
/* Movimiento discreto: las escenas nunca sustituyen resultados del usuario. */
body.studio-workbench .studio-audio-welcome .studio-video-frame{width:90%;max-width:366px}
body.studio-workbench .studio-audio-welcome .studio-video-mood{width:min(430px,96%)}
.studio-audio-actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px;margin-top:18px}
.studio-audio-welcome .studio-video-welcome-copy{width:min(100%,460px)}
body.studio-workbench .studio-audio-welcome .studio-audio-actions button{flex:0 0 auto;white-space:nowrap}
body.studio-workbench .studio-audio-actions [data-studio-focus]{margin:0}
body.studio-workbench .studio-audio-welcome .studio-audio-sample{display:inline-flex;width:auto;height:auto;min-height:40px;gap:8px;margin:0;padding:9px 13px;border:1px solid var(--border2);border-radius:10px;background:transparent;color:var(--muted2);font:500 12px/1.4 var(--font)}
body.studio-workbench .studio-audio-welcome .studio-audio-sample[hidden]{display:none}
.studio-audio-sample .vz-p{display:none}
.studio-audio-sample.on .vz-t{display:none}
.studio-audio-sample.on .vz-p{display:block}
body.studio-workbench .studio-audio-welcome .studio-audio-sample.on{color:var(--studio-accent);border-color:var(--studio-accent)}
body.studio-workbench .studio-image-welcome .studio-video-motion{position:absolute;right:max(16px,calc(50% - 280px));top:22px;display:grid;place-items:center;width:38px;min-height:38px;margin:0;padding:9px;border:1px solid var(--border2);border-radius:50%;background:var(--surface);color:var(--muted2);z-index:5}
body.studio-workbench .studio-image-welcome .studio-video-motion:is(:hover,:focus-visible){color:var(--studio-accent);border-color:var(--studio-accent)}
body.studio-workbench .studio-image-welcome .studio-video-motion:focus-visible{outline:2px solid var(--studio-accent);outline-offset:3px}
.studio-image-mood img{animation:inspiration-pan 12s ease-in-out infinite alternate;animation-play-state:paused;transform:scale(1.025)}
.studio-image-mood>span:nth-child(even) img{animation-direction:alternate-reverse;animation-delay:-4s}
.studio-image-welcome.inspiration-moving .studio-image-mood img{animation-play-state:running}
@keyframes inspiration-pan{from{transform:scale(1.025) translateY(1%)}to{transform:scale(1.15) translateY(-2%)}}
@media(max-width:900px){
 body.studio-workbench:not(.experiencia-facil)[data-studio-mode="audio"] .studio-workspace:has(.studio-audio-welcome){display:flex;flex-direction:column}
 body.studio-workbench:not(.experiencia-facil)[data-studio-mode="audio"] .studio-results:has(.studio-audio-welcome){order:-1;margin:0 0 20px;padding:0;border:0}
 body.studio-workbench .studio-image-welcome .studio-video-motion{width:32px;min-height:32px;padding:7px;top:0;right:4px}
 body.studio-workbench .studio-audio-actions{margin-top:12px}
 body.studio-workbench .studio-audio-welcome .studio-audio-sample{min-height:44px}
}


/* cocuyo-css: assets/css/estudio-audio.css */
/* Referencia observada: Higgsfield Audio, escritorio y 390 px (12-sep-2026).
   Tarjetas, panel fijo y espacios; identidad Cocuyo. */
body.studio-workbench.audio-redesign:not(.experiencia-facil){--studio-editor:340px}
body.studio-workbench.audio-redesign:not(.experiencia-facil) #pg-home>.studio-wrap{max-width:none;padding:20px 24px 36px}
body.studio-workbench.audio-redesign:not(.experiencia-facil) .studio-workspace{display:grid;grid-template-columns:var(--studio-editor) minmax(0,1fr);gap:28px}
body.studio-workbench.audio-redesign .studio-editor-slot{top:18px}
body.studio-workbench.audio-redesign #pg-home :is(.studio-editor-head,.mesa-top){display:none}
/* La cabecera no se ve, pero su h1 («Estudio de audio») sigue para lectores de pantalla. */
body.studio-workbench.audio-redesign #pg-home .studio-workhead{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
body.studio-workbench.audio-redesign #pg-home .studio-workhead button{display:none}
body.studio-workbench.audio-redesign:not(.experiencia-facil) #mesa .mesa-in{max-height:calc(100dvh - 38px);padding:16px;border-radius:18px;border:1px solid #292a28;background:#121311;scrollbar-width:thin;scrollbar-color:#3c3f37 transparent}
body.studio-workbench.audio-redesign #mesa .composer{display:flex;flex-direction:column;gap:12px}
body.studio-workbench.audio-redesign #mesa .audio-type-tabs{display:grid;grid-template-columns:1.1fr 1fr .85fr;gap:4px;margin:0 0 2px;border-bottom:1px solid #30312e;order:-2}
.audio-type-tabs button{position:relative;background:none;border:0;border-radius:0;padding:9px 0 13px;color:#989d94;font:500 12px/1.3 var(--font);min-height:52px;white-space:nowrap}
.audio-type-tabs button.active{color:#fafcf7;border-bottom:2px solid var(--lima)}
/* Pestañas «Próximamente»: claramente inactivas (atenuadas, sin cursor de mano ni hover). */
.audio-type-tabs button:disabled{color:var(--gris-humo);cursor:not-allowed;opacity:.5;background:none}
.audio-type-tabs button:disabled:hover{color:var(--gris-humo);background:none}
.audio-type-tabs small{display:block;font-size:11px;letter-spacing:.02em;margin-top:4px;color:#7f8775}
body.studio-workbench.audio-redesign #mesa .ap-voz{isolation:isolate;position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);align-content:end;gap:0 12px;min-height:174px;padding:20px 17px;border:1px solid hsla(var(--h),28%,63%,.3);border-radius:14px;overflow:hidden;background:radial-gradient(ellipse at 25% 15%,hsl(var(--h) 40% 48% / .52),transparent 75%),linear-gradient(135deg,hsl(var(--h) 23% 25%),#151810 85%)}
body.studio-workbench.audio-redesign #mesa .ap-voz::before{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse at 80% -10%,hsl(var(--h) 55% 76% / .3),transparent 70%);pointer-events:none}
body.studio-workbench.audio-redesign #mesa .ap-vozcambia{position:absolute;right:12px;top:12px;min-height:34px;padding:7px 12px;background:#0a10093d;border:1px solid #ffffff35;border-radius:8px;color:#fff;font:500 11px var(--font);backdrop-filter:blur(8px)}
body.studio-workbench.audio-redesign #mesa .ap-vozplay{position:static;grid-column:1;grid-row:1;align-self:center;width:44px;height:44px;border-radius:50%;color:#fff;background:#ffffff15;border:1px solid #ffffff5c}
body.studio-workbench.audio-redesign #mesa .ap-vozplay.on{color:var(--lima);border-color:var(--lima)}
body.studio-workbench.audio-redesign #mesa .ap-voztxt{grid-column:2;grid-row:1;min-width:0;padding:0;gap:3px}
body.studio-workbench.audio-redesign #mesa .ap-vozlabel{display:none}
body.studio-workbench.audio-redesign #mesa .ap-voztxt b{display:block;font-size:20px;line-height:1.25;font-weight:600;letter-spacing:-.025em;color:#fff;overflow:hidden;text-overflow:ellipsis}
body.studio-workbench.audio-redesign #mesa .ap-voztxt small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:5px;font-size:11px;line-height:1.5;color:#e1e6dd}
body.studio-workbench.audio-redesign #mesa .ap-rot{margin:3px 0 -5px;font-size:12px;font-weight:550;color:#e4e7df}
body.studio-workbench.audio-redesign:not(.experiencia-facil) #mesa #ta{min-height:144px;max-height:230px;margin:0;padding:14px;border:1px solid #35372f!important;border-radius:12px;background:#1c1e19!important;box-shadow:none;font-size:14px;line-height:1.6;letter-spacing:0}
body.studio-workbench.audio-redesign #mesa #ta:focus{outline:0;border-color:#9ba77d!important}
body.studio-workbench.audio-redesign #mesa .ap-nota{margin:-6px 0 0;padding:0 2px;border:0;text-align:right;font-size:10px;line-height:1.5;color:#a3a99a}
body.studio-workbench.audio-redesign #mesa .ap-nota.pasa{color:#ff9e99}
body.studio-workbench.audio-redesign #mesa .ap-reserva-nota{margin:0;padding:0 2px;font-size:11px;line-height:1.5;color:#a3a99a}
body.studio-workbench.audio-redesign #mesa #parambar{gap:10px;margin:0;padding:0;border:0}
body.studio-workbench.audio-redesign #mesa :is(.ap-fila,.ap-idioma){min-height:50px;padding:11px 12px;border-radius:11px;border:1px solid #30332b;background:#1a1c17;gap:10px;font-size:11px}
body.studio-workbench.audio-redesign #mesa .ap-fila[data-pop="model"]{display:grid;grid-template-columns:30px minmax(0,1fr) 16px;grid-template-rows:auto auto;gap:3px 10px;text-align:left}
body.studio-workbench.audio-redesign #mesa .ap-fila[data-pop="model"]>.mrcbox{grid-row:1/3;width:30px;height:30px;border:0;border-radius:8px;background:#ffffff09}
body.studio-workbench.audio-redesign #mesa .ap-fila[data-pop="model"]>span:not(.mrcbox){grid-column:2;font-size:10px;color:#a7ac9f}
body.studio-workbench.audio-redesign #mesa .ap-fila[data-pop="model"]>b{grid-column:2;grid-row:2;margin:0;max-width:none;font-size:12px;font-weight:550;white-space:normal;color:#f4f6ef}
body.studio-workbench.audio-redesign #mesa .ap-fila[data-pop="model"]>.ap-car{grid-column:3;grid-row:1/3;align-self:center}
body.studio-workbench.audio-redesign #mesa .ap-idioma{order:initial;background:transparent;min-height:38px;padding:4px 2px;border:0}
body.studio-workbench.audio-redesign #mesa .ap-idioma select{max-width:65%;min-height:34px;background:#20221c;color:#e8eadf;border:1px solid #34382d;border-radius:7px;padding:5px 8px;font-size:11px}
body.studio-workbench.audio-redesign #mesa .ap-avwrap{margin:0;border:0;padding:0}
body.studio-workbench.audio-redesign #mesa .ap-avwrap>.ap-fila{border:0;border-radius:0;background:transparent;min-height:42px;padding:8px 2px;color:#d5d9ce}
body.studio-workbench.audio-redesign #mesa .ap-avbody{padding:8px 2px 12px}
body.studio-workbench.audio-redesign #mesa .ap-av span{font-size:11px}
body.studio-workbench.audio-redesign #mesa .ap-reset{font-size:11px;min-height:34px}
body.studio-workbench.audio-redesign .ap-output{display:flex;justify-content:space-between;gap:10px;padding:8px 0 12px;color:#a9b19d;font-size:11px}
body.studio-workbench.audio-redesign .ap-output b{color:#e3e8d9;font-weight:500}
body.studio-workbench.audio-redesign #mesa .ap-gen{position:sticky;bottom:-16px;z-index:4;flex:none;min-height:48px;margin:4px 0 0;border-radius:10px;border:0;background:var(--lima);color:#162006;box-shadow:0 12px 0 12px #121311;font-size:14px;font-weight:650}
body.studio-workbench.audio-redesign #mesa .ap-gen:disabled{background:#343b27;color:#aeb69f;cursor:default;filter:none;transform:none}
body.studio-workbench.audio-redesign #mesa .ap-gen b{padding-left:10px;border-left:1px solid currentColor;font-size:12px;gap:4px}
body.studio-workbench.audio-redesign #mesa .ap-gen b[hidden]{display:none!important}
body.studio-workbench.audio-redesign :is(button,input,select):focus-visible{outline:2px solid var(--lima);outline-offset:3px}
.audio-form-heading{display:none}
.audio-feed-toolbar{display:flex;align-items:center;gap:16px;padding:0 0 20px;border-bottom:1px solid #22251f}
.audio-feed-toolbar [role="tablist"]{display:flex;gap:4px;padding:4px;background:#171914;border:1px solid #2c3027;border-radius:10px}
.audio-feed-toolbar [role="tab"]{padding:8px 13px;min-height:36px;background:transparent;border:0;border-radius:6px;color:#9ea594;font-size:12px;font-weight:500}
.audio-feed-toolbar [role="tab"][aria-selected="true"]{background:#2e3327;color:#f5f7ee}
.audio-back-create{display:none}
body.studio-workbench.audio-redesign #genout[hidden]{display:none!important}
body.studio-workbench.audio-redesign #genwrap{max-width:none!important;width:100%;margin:0!important}
body.studio-workbench.audio-redesign .studio-results{padding:0;min-width:0}
body.studio-workbench.audio-redesign #genwrap .histbar{display:none}
body.studio-workbench.audio-redesign .hist-dia{font-family:var(--font);font-weight:550}
body.studio-workbench.audio-redesign .hist-dia>span{font-family:var(--font)}
body.studio-workbench.audio-redesign .fila-aud{border-radius:14px;background:#161913;border-color:#30362a}
body.studio-workbench.audio-redesign .fila-aud .fa-foto{border-radius:50%;background:radial-gradient(circle at 30% 20%,hsl(var(--h) 45% 66%),hsl(var(--h) 26% 29%) 60%,#151a11)}
body.studio-workbench.audio-redesign .fila-aud .fa-foto b{display:none}
body.studio-workbench.audio-redesign .audio-guide{display:block;padding:44px 0 24px;max-width:100%;min-height:0;text-align:left}
.audio-guide-heading{margin:0 0 30px}
.audio-guide-heading>span{font-size:10px;letter-spacing:.12em;color:#a4ae95}
body.studio-workbench.audio-redesign .audio-guide h3{font-size:clamp(24px,2.4vw,36px);line-height:1.2;font-weight:600;letter-spacing:-.035em;margin:10px 0;color:#f5f7f0}
body.studio-workbench.audio-redesign .audio-guide-heading p{font-size:13px;line-height:1.6;color:#a3aa9a;margin:0;max-width:none}
.audio-guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.audio-guide-card{min-width:0;display:flex;flex-direction:column;background:#131510;border:1px solid #2d3226;border-radius:16px;overflow:hidden}
.audio-guide-copy{padding:22px 20px 0}
.audio-guide-copy>span{font-size:10px;letter-spacing:.05em;color:#8b967c}
.audio-guide-copy h4{margin:10px 0 8px;font-size:18px;font-weight:550;letter-spacing:-.02em;color:#f2f5ed}
body.studio-workbench.audio-redesign .audio-guide-copy p{font-size:12px;line-height:1.6;color:#a3aa9a;margin:0}
.audio-guide-voices{display:flex;flex-direction:column;gap:8px;padding:22px 16px}
body.studio-workbench.audio-redesign .audio-guide-voice{display:flex;gap:10px;align-items:center;width:100%;padding:10px;background:#1e211a;border:1px solid #363c2c;border-radius:10px;margin:0;text-align:left}
.audio-guide-voice>i{flex:none;width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 30% 20%,hsl(var(--voice-h) 58% 76%),hsl(var(--voice-h) 32% 36%) 55%,#13150e)}
.audio-guide-voice>span{min-width:0;flex:1}.audio-guide-voice b{display:block;font-size:12px;font-weight:550;color:#f2f5eb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.audio-guide-voice small{display:block;font-size:10px;color:#a5ad9a;max-width:100%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin-top:3px}
.audio-guide-voice .ic{flex:none;width:13px;color:#d0d8bf}
.audio-guide-voice.on .vz-t{display:none}.audio-guide-voice.on .vz-p{display:block!important}
body.studio-workbench.audio-redesign .audio-guide-voice.on{border-color:var(--lima)}
body.studio-workbench.audio-redesign .audio-guide .studio-video-mood{width:100%;height:auto;min-height:0;margin:22px 0;aspect-ratio:1.75;display:block;padding:0}
body.studio-workbench.audio-redesign .audio-guide .studio-video-frame{position:relative;inset:auto;transform:none;width:100%;max-width:none;height:100%;aspect-ratio:1.75;margin:0;border:0;border-radius:0;box-shadow:none}
body.studio-workbench.audio-redesign .audio-guide .studio-video-frame video{width:100%;height:100%;object-fit:cover}
body.studio-workbench.audio-redesign .audio-guide .studio-video-motion{width:36px;height:36px;min-height:36px;margin:0;padding:8px;right:12px;bottom:12px}
body.studio-workbench.audio-redesign .audio-guide-action{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:auto 0 0;padding:14px 20px;min-height:48px;border:0;border-top:1px solid #2c3223;border-radius:0;background:transparent;color:#dce5c9;font-size:12px;font-weight:500}
body.studio-workbench.audio-redesign .audio-guide-action:hover{background:#23291b;color:var(--lima)}
/* Catálogo real de voces: tarjetas con una selección y una escucha separadas. */
.audio-redesign .vz-caja{width:min(760px,100%);max-height:min(85dvh,780px);border-radius:20px;background:#131511;border-color:#33392b}
.audio-redesign .vz-top{padding:24px 24px 10px;gap:10px}
.audio-redesign #vzTitulo{font-family:var(--font);font-size:24px;font-weight:550;letter-spacing:-.035em}
.audio-redesign .vz-subtitle{margin:0 24px 20px;color:#a3ac96;font-size:13px;line-height:1.6}
.audio-redesign .vz-busca{margin:0 24px 18px;padding:12px;background:#1e2219;border:1px solid #333b28;border-radius:10px}
.audio-redesign .vz-busca input{font-size:13px}
.audio-redesign .vz-lista{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0 24px 24px;overflow:auto}
.audio-redesign .vz-fila{position:relative;display:grid;grid-template-columns:38px minmax(0,1fr);grid-template-rows:1fr auto;gap:12px 10px;align-items:center;padding:14px 12px;border:1px solid #343b2b;border-radius:12px;background:#1d2217;min-height:124px}
.audio-redesign .vz-fila:hover{background:#272e1f;border-color:#5f6e48}
.audio-redesign .vz-fila.on{border-color:var(--lima);background:#29341d}
.audio-redesign .vz-fila .vz-foto{width:38px;height:38px;box-shadow:inset -6px -8px 14px #0005;border:1px solid #ffffff30;border-radius:50%;background:radial-gradient(circle at 30% 20%,hsl(var(--h) 55% 79%),hsl(var(--h) 35% 43%) 60%,#15190f)}
.audio-redesign .vz-foto b{display:none}
.audio-redesign .vz-fila .vz-txt{min-width:0}.audio-redesign .vz-txt b{font-size:12px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.audio-redesign .vz-txt small{font-size:10px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#aeb69f}
.audio-redesign .vz-fila .vz-play{grid-column:1/-1;justify-self:start;display:flex;align-items:center;justify-content:flex-start;gap:10px;width:100%;height:32px;padding:0;border:0;border-radius:0;background:none;margin:0;color:#c4d1b0}
.audio-redesign .vz-play .vz-wave{flex:1;height:22px;opacity:.55}.audio-redesign .vz-play.on .vz-wave{color:var(--lima);opacity:1}
.audio-redesign .vz-nada{grid-column:1/-1;padding:32px;text-align:center}
@media(min-width:1500px){body.studio-workbench.audio-redesign:not(.experiencia-facil){--studio-editor:364px}.audio-guide-grid{gap:22px}.audio-guide-card{min-height:350px}}
@media(min-width:901px) and (max-width:1190px){body.studio-workbench.audio-redesign:not(.experiencia-facil){--studio-editor:310px}body.studio-workbench.audio-redesign:not(.experiencia-facil) #pg-home>.studio-wrap{padding:16px}.audio-guide-grid{grid-template-columns:1fr}.audio-guide-card{max-width:500px}}
@media(max-width:900px){
 body.studio-workbench.audio-redesign:not(.experiencia-facil) #pg-home>.studio-wrap{padding:10px 14px 30px}
 body.studio-workbench.audio-redesign:not(.experiencia-facil) .studio-workspace{display:block}
 body.studio-workbench.audio-redesign:not(.experiencia-facil) #mesa .mesa-in{max-height:none;overflow:visible;padding:14px;border-radius:16px}
 body.studio-workbench.audio-redesign .studio-editor-slot{max-width:580px;margin:auto}
 body.studio-workbench.audio-redesign #mesa .audio-form-heading{display:flex;align-items:center;justify-content:space-between;order:-3;gap:10px;padding:0 0 2px}
 .audio-form-heading>span{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:550}.audio-form-heading button{background:transparent;border:0;color:#c6d3ae;min-height:34px;font-size:12px}
 body.studio-workbench.audio-redesign #mesa .ap-voz{min-height:175px}
 body.studio-workbench.audio-redesign #mesa .ap-gen{bottom:calc(var(--sm-bottom,76px) + env(safe-area-inset-bottom,0px));box-shadow:0 7px 0 7px #121311}
 body.studio-workbench.audio-redesign .studio-results{margin:0!important;order:initial!important;border:0!important;padding:0!important}
 body.studio-workbench.audio-redesign[data-audio-mobile="create"] .studio-results{display:none}
 body.studio-workbench.audio-redesign[data-audio-mobile="history"] .studio-editor-slot{display:none}
 .audio-back-create{display:block;background:transparent;border:0;color:#d9e2ca;font-size:12px;min-height:40px}
 .audio-feed-toolbar{flex-wrap:wrap;justify-content:space-between;gap:10px;padding:0 0 12px}
 body.studio-workbench.audio-redesign .audio-guide{padding:26px 0}
 .audio-guide-grid{grid-template-columns:1fr}.audio-guide-heading{margin-bottom:22px}
 .audio-guide-card{max-width:580px}.audio-guide-voices{padding-block:18px}.audio-guide .studio-video-mood{max-height:220px}
 .audio-redesign .vz-modal{padding:12px}.audio-redesign .vz-caja{max-height:90dvh;border-radius:18px}
 .audio-redesign .vz-lista{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 14px 18px;gap:9px}
 .audio-redesign .vz-top{padding:20px 16px 8px}.audio-redesign #vzTitulo{font-size:22px}
 .audio-redesign .vz-subtitle{margin:0 16px 16px;font-size:12px}.audio-redesign .vz-busca{margin:0 14px 15px}
 .audio-redesign .vz-fila{grid-template-columns:30px minmax(0,1fr);padding:11px 9px;gap:10px 7px}.audio-redesign .vz-fila .vz-foto{width:30px;height:30px}
}
@media(max-width:360px){body.studio-workbench.audio-redesign:not(.experiencia-facil) #pg-home>.studio-wrap{padding-inline:8px}body.studio-workbench.audio-redesign:not(.experiencia-facil) #mesa .mesa-in{padding:12px}.audio-type-tabs button{font-size:11px}.audio-redesign .vz-lista{grid-template-columns:1fr}.audio-redesign .vz-fila{min-height:105px}}

/* Pantallas táctiles: Cambiar voz, Idioma e Historial con objetivo de 44 px
   (antes 34). En escritorio con ratón no cambia nada. */
@media(pointer:coarse){
 body.studio-workbench.audio-redesign #mesa :is(.ap-vozcambia,.ap-idioma select),
 body.studio-workbench #mesa .audio-form-heading [data-audio-history]{min-height:44px}
}


/* cocuyo-css: assets/css/estudio-prompt.css */
#promptLimit{grid-area:limit;order:5;max-width:100%;padding:0 2px;margin:0 0 8px;font:500 11px/1.5 var(--font);text-align:left;overflow-wrap:anywhere}
#promptLimit[hidden]{display:none!important}
#promptLimit.exceso{color:#ff9c9c;text-align:left}
@media(min-width:1001px){body.studio-workbench:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="video"] #mesa .composer:has(#promptLimit:not([hidden])){grid-template-areas:"refs refs" "attachments attachments" "prompt prompt" "limit limit" "params generate"}#promptLimit{margin:-5px 0 0}}
@media(max-width:900px){body.studio-workbench:not(.experiencia-facil) #mesa #promptLimit{order:3;margin:0;padding:6px 16px;background:var(--surface2);border-inline:1px solid var(--border)}}


/* cocuyo-css: assets/css/estudio-creditos.css */
/* Saldo personal: cantidad legible y un único icono, sin barra ni leyendas. */
body.studio-workbench #btnmascreditos,
body.studio-workbench.studio-simple .studio-public-nav #btnmascreditos{
 display:inline-flex;flex-direction:row;align-items:center;justify-content:center;
 gap:8px;width:auto;min-width:0;height:40px;min-height:40px;padding:0 12px;
 border:1px solid var(--border);border-radius:12px;background:var(--surface);
 color:var(--text);box-shadow:none;white-space:nowrap;cursor:pointer;
 transition:background .16s ease,border-color .16s ease;
}
body.studio-workbench #btnmascreditos[hidden]{display:none!important}
body.studio-workbench #btnmascreditos:hover{background:var(--surface2);border-color:var(--border2);transform:none}
body.studio-workbench #btnmascreditos:focus-visible{outline:2px solid var(--lima);outline-offset:3px}
body.studio-workbench #btnmascreditos .credit-wallet-icon{display:block;width:19px;height:19px;flex:0 0 19px;color:var(--lima);fill:none}
body.studio-workbench #btnmascreditos [data-credit-value],
body.studio-workbench.studio-simple .studio-public-nav #btnmascreditos [data-credit-value]{
 margin:0;font-family:inherit;font-size:15px;font-weight:650;line-height:1;
 letter-spacing:.01em;font-variant-numeric:tabular-nums;color:inherit;white-space:nowrap;
}
body.studio-workbench #btnmascreditos:is([data-credit-state=low],[data-credit-state=empty]),
body.studio-workbench.studio-simple .studio-public-nav #btnmascreditos:is([data-credit-state=low],[data-credit-state=empty]),
body.studio-workbench #btnmascreditos:is([data-credit-state=low],[data-credit-state=empty]) .credit-wallet-icon{color:#ff818a}
body.studio-workbench #btnmascreditos[data-credit-state=unavailable] .credit-wallet-icon{color:var(--muted)}
body.studio-workbench #btnmascreditos :is(.credit-meter,.credit-wallet-caption,[data-credit-label],[data-credit-alert]){display:none}
body.studio-workbench .acct .cr{display:none!important}
@media(prefers-reduced-motion:reduce){body.studio-workbench #btnmascreditos{transition:none}}


/* cocuyo-css: assets/css/estudio-explorar.css */
/* Navegación Cocuyo: patrones de interacción de 21st.dev, diseño propio. */
body.studio-workbench{--st-top:72px}
body.studio-workbench .studio-public-nav{position:fixed;inset:0 0 auto;z-index:105;display:flex!important;align-items:center;gap:28px;height:var(--st-top);min-height:0;padding:0 28px;border-bottom:1px solid var(--border);background:#101110;color:var(--text);backdrop-filter:blur(18px)}
.studio-public-nav [hidden],.studio-join:not([open]){display:none!important}
.studio-public-nav button,.studio-public-nav a{font-family:inherit;color:inherit;cursor:pointer;text-decoration:none}
.studio-public-nav button{background:none;border:0}
.st-brand-slot{flex:none}.studio-public-nav .brand{display:flex;align-items:center;gap:10px;padding:0;border:0;background:none;color:var(--text)}
.studio-public-nav .brand .wordmark{font-size:24px;font-weight:750;letter-spacing:-1.1px}.studio-public-nav .cocuyologo{width:27px;height:27px}
.st-nav{display:flex;align-items:stretch;gap:24px;height:100%;white-space:nowrap}.st-nav>a,.st-nav-group{display:flex;align-items:center;position:relative}
.st-nav a{font-size:14px;font-weight:550;padding:12px 0;color:#b9bcb7}.st-nav a:hover,.st-nav a[aria-current=page]{color:#f5f7f2}
.st-nav a::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--studio-accent);transform:scaleX(0);transform-origin:center;transition:transform .18s ease}
.st-nav a:hover::after,.st-nav a[aria-current=page]::after{transform:scaleX(1)}
.st-nav-group>button{display:grid;place-items:center;width:28px;height:42px;padding:5px;color:#92978f}.st-nav-group>button .ic{width:13px;height:13px;transition:transform .18s}.st-nav-group>button[aria-expanded=true] .ic{transform:rotate(180deg);color:var(--studio-accent)}
.st-actions{display:flex;align-items:center;gap:15px;margin-left:auto;white-space:nowrap}.st-prices{font-size:13px;font-weight:550}.st-guest{display:flex;align-items:center;gap:15px;font-size:13px;font-weight:550}/* «Empieza a crear»: el mismo botón lima de la portada (.cn-start). */.studio-public-nav .st-guest>a.st-start{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;height:40px;min-height:40px;padding:0 18px!important;border:1px solid var(--verde-cocuyo);border-radius:var(--radio-pill,999px);background:var(--verde-cocuyo);color:var(--tinta-sobre-verde)!important;font:600 13px/1 var(--fuente);font-size:13px!important;font-weight:600!important;letter-spacing:0;white-space:nowrap;text-decoration:none;transition:background var(--trans-rapida,150ms ease),border-color var(--trans-rapida,150ms ease)}.studio-public-nav .st-guest>a.st-start:hover{background:var(--lima-clara);border-color:var(--lima-clara)}.studio-public-nav .st-guest>a.st-start:focus-visible{outline:2px solid var(--verde-cocuyo);outline-offset:3px}@media(prefers-reduced-motion:reduce){.studio-public-nav .st-guest>a.st-start{transition:none}}
.st-account{display:flex;align-items:center;gap:8px;font-size:13px}.st-account .ic{width:18px;height:18px}.st-mobile-more{display:none}
.st-language{display:flex;align-items:center;flex:none;min-width:0}
.studio-public-nav :is(a,button):focus-visible,.studio-join :is(a,button):focus-visible,#pg-explore :is(a,button):focus-visible{outline:2px solid var(--studio-accent);outline-offset:4px;border-radius:5px}
body.studio-workbench .main{padding-top:var(--st-top)}
body.studio-workbench .side #toolnav{display:none}body.studio-workbench .side>.top{display:none}
@media(min-width:901px){body.studio-workbench .side{top:var(--st-top);height:calc(100dvh - var(--st-top));padding-top:22px!important}body.studio-workbench .side .studio-library-nav{margin-top:4px;padding-top:8px}body.studio-workbench .audio-redesign #mesa{top:calc(var(--st-top) + 16px)}body.studio-workbench #accmenu{top:auto;bottom:86px}}
html:not([data-estudio-identidad=cuenta]) .side :is(.upg,.acct,.studio-session-switch){display:none!important}
.st-side-join{width:100%;padding:13px 9px;border:1px solid var(--border2);border-radius:10px;background:var(--surface);color:var(--text);font:550 12px var(--font);cursor:pointer}.st-side-join:hover{border-color:var(--studio-accent)}html[data-estudio-identidad=cuenta] .st-side-join{display:none}
.st-model-panel{position:absolute;top:100%;left:0;right:0;display:grid;grid-template-columns:230px minmax(0,1fr);gap:32px;padding:30px max(28px,calc((100vw - 1360px)/2));background:#151714;border-bottom:1px solid #343930;box-shadow:0 28px 60px #0008;max-height:calc(100dvh - var(--st-top) - 24px);overflow:auto;overscroll-behavior:contain}
.st-model-intro{padding:8px 16px 8px 0}.st-model-intro h2{font-size:25px;font-weight:550;line-height:1.2;letter-spacing:-1px;margin:20px 0 13px}.st-model-intro p{font-size:12px;line-height:1.7;color:#a5aca0}.st-model-intro button{margin-top:22px;font-size:12px;color:var(--studio-accent);display:flex;gap:8px;align-items:center}
.st-model-heading{display:flex;justify-content:space-between;align-items:center;color:#a5aca0;font-size:11px;letter-spacing:.04em;margin-bottom:14px}.st-model-heading button{font-size:25px;width:36px;height:36px}
.st-model-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.st-model-grid button{display:flex;align-items:center;gap:11px;padding:13px 10px;min-height:72px;text-align:left;border:1px solid transparent;border-radius:11px}.st-model-grid button:hover{border-color:#394131;background:#20271b}.st-model-grid .tile{width:32px;height:32px;flex:none}.st-model-grid button>span:not(.tile){min-width:0;display:grid;gap:5px}.st-model-grid b{font-size:13px;font-weight:550;line-height:1.35}.st-model-grid small{font-size:11px;line-height:1.45;color:#a5aca0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.st-model-grid button>.ic{width:14px;height:14px;flex:none;margin-left:auto;color:#8d9884}.st-model-list details{margin-top:18px;padding-top:14px;border-top:1px solid #30362c}.st-model-list summary{font-size:12px;color:#a5aca0;cursor:pointer}.st-model-grid button:disabled{opacity:.6;cursor:default}
.explore-wrap{max-width:1500px;margin:auto;padding:40px 42px 60px}.explore-hero{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;align-items:center;min-height:490px}.explore-lights{display:inline-flex;gap:6px;align-items:center;height:26px}.explore-lights i{display:block;width:8px;height:22px;transform:rotate(18deg);border-radius:8px;background:var(--studio-accent);box-shadow:0 0 18px #aff33e38}.explore-kicker{display:flex;gap:12px;align-items:center;margin-bottom:26px;font-size:10px;font-weight:600;letter-spacing:.14em;color:#bbc3b3}.explore-copy h1{font-size:clamp(38px,4vw,65px);line-height:1.06;letter-spacing:-.055em;font-weight:600;margin:0 0 22px}.explore-copy h1 em{font-style:normal;color:var(--studio-accent)}.explore-copy>p{max-width:420px;font-size:16px;line-height:1.75;color:#b2b9ab;margin:0 0 25px}
.explore-primary{display:inline-flex;align-items:center;gap:24px;background:var(--studio-accent);color:#17200e;border:0;border-radius:10px;padding:15px 19px;font:600 13px var(--font);cursor:pointer}.explore-primary:hover{filter:brightness(1.08)}.explore-footnote{display:block;margin-top:16px;max-width:390px;color:#969e90;font-size:11px;line-height:1.65}
.explore-film{position:relative;height:450px;border-radius:25px;overflow:hidden;background:#1c241a;border:1px solid #343d2c}.explore-film video{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.55)}.explore-film::after{content:'';position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#050704cf);pointer-events:none}.explore-film-caption{position:absolute;bottom:24px;left:25px;z-index:1;display:grid;gap:8px}.explore-film-caption span{font-size:10px;letter-spacing:.12em;color:#d5dcca}.explore-film-caption b{font-size:14px;font-weight:550}.explore-motion{position:absolute;bottom:24px;right:24px;z-index:2;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid #ffffff4a;background:#0c120fb0;color:white;cursor:pointer}.explore-motion .ic{width:17px;height:17px}
.explore-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin:45px 0 19px}.explore-section-head h2{font-size:24px;font-weight:550;letter-spacing:-.035em;margin:0}.explore-section-head>span{font-size:12px;color:#a5ada0}.explore-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.explore-card{position:relative;height:240px;overflow:hidden;padding:22px;border-radius:17px;border:1px solid #343b2f;background:#182013;color:white;text-align:left;cursor:pointer}.explore-card>img{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;filter:brightness(.6) saturate(.55);transition:transform .35s,filter .35s}.explore-card::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent,#050803ee)}.explore-card:hover>img{transform:scale(1.045);filter:brightness(.85) saturate(.8)}.explore-card-copy{position:absolute;inset:auto 42px 22px 22px;display:grid;gap:8px;z-index:1}.explore-card-copy small{font:600 9px var(--font);letter-spacing:.13em;color:var(--studio-accent)}.explore-card-copy strong{font:550 21px/1.1 var(--font);letter-spacing:-.035em}.explore-card-copy>span{font:400 11px/1.6 var(--font);color:#c3c9bd}.explore-card>.ic{position:absolute;bottom:23px;right:19px;z-index:1;width:19px;height:19px}
.explore-cine{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding-top:52px;margin-top:40px;border-top:1px solid var(--border)}.explore-cine h2{font-size:30px;line-height:1.17;letter-spacing:-.04em;font-weight:550;max-width:400px;margin:18px 0}.explore-cine p{font-size:13px;line-height:1.8;max-width:390px;color:#aeb6a6}.explore-cine a{display:inline-flex;align-items:center;gap:12px;margin-top:20px;font-size:13px;text-decoration:none;color:var(--studio-accent)}.explore-cine>img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:17px}
.studio-join{box-sizing:border-box;width:min(480px,calc(100vw - 32px));margin:auto;padding:44px 36px 30px;max-height:calc(100dvh - 32px);overflow:auto;background:#171b14;border:1px solid #3a462e;border-radius:25px;color:#f4f8ee;text-align:center;font-family:var(--font);box-shadow:0 30px 100px #0009}.studio-join::backdrop{background:#060906ba;backdrop-filter:blur(8px)}.studio-join-close{position:absolute;right:13px;top:9px;width:40px;height:40px;background:none;border:0;color:#b3bfaa;font-size:25px;cursor:pointer}.studio-join-kicker{font-size:10px;letter-spacing:.2em;color:#b5c4a7;margin:16px 0!important}.studio-join h2{font-size:30px;line-height:1.16;letter-spacing:-.04em;margin:0 0 16px;font-weight:550}.studio-join p{font-size:13px;line-height:1.7;color:#b5bfac;margin:0 0 25px}.studio-join a{display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;font-size:14px;font-weight:550;border-radius:10px;padding:14px;margin:10px 0}.studio-join-primary{background:var(--studio-accent);color:#17200e}.studio-join-secondary{border:1px solid #4c5940;color:#f4f8ee}.studio-join-back{display:block;margin:16px auto 20px;background:none;border:0;color:#c2cbb9;font:400 12px var(--font);cursor:pointer}.studio-join small{font-size:10px;line-height:1.6;color:#9ba88e;display:block}
@media(max-width:1180px){body.studio-workbench .studio-public-nav{gap:18px;padding-inline:20px}.st-nav{gap:16px}.st-actions{gap:9px}.st-guest{gap:9px}.explore-wrap{padding:26px 26px 40px}.explore-hero{gap:24px;min-height:440px}.explore-film{height:390px}.st-model-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.explore-card-copy strong{font-size:19px}}
@media(max-width:900px){body.studio-workbench{--st-top:116px;--sm-top:116px}body.studio-workbench .studio-public-nav{height:var(--st-top);padding:0 16px;display:grid!important;grid-template-columns:auto 1fr;grid-template-rows:64px 52px;gap:0 8px}.studio-public-nav .brand .wordmark{font-size:22px}.studio-public-nav .cocuyologo{width:23px;height:23px}.st-actions{grid-column:2;grid-row:1;gap:12px}.st-nav{grid-column:1/-1;grid-row:2;justify-content:space-between;gap:10px}.st-nav>a,.st-nav-group{flex:1;justify-content:center}.st-nav a{font-size:13px}.st-nav-group>button{width:26px}.st-guest{gap:12px;font-size:12px}.st-signup{padding:9px 11px}.st-prices{display:none}.st-account span{display:none}.st-mobile-more{display:grid;place-items:center;padding:0;width:30px;height:40px}.st-mobile-more .ic{width:21px;height:21px}body.studio-workbench .sm-header{display:none!important}body.studio-workbench .side>.top{display:flex;justify-content:flex-end}body.studio-workbench .main{padding-top:var(--st-top)}.st-model-panel{padding:16px;display:block;max-height:calc(100dvh - var(--st-top) - 16px)}.st-model-intro{display:none}.st-model-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:3px}.st-model-grid button{padding:10px 7px;gap:8px}.st-model-grid b{font-size:12px}.st-model-grid small{font-size:10px}.st-model-grid button>.ic{display:none}.st-model-heading{margin-bottom:6px}.explore-wrap{padding:26px 20px 45px}.explore-hero{min-height:0;gap:25px}.explore-copy h1{font-size:40px}.explore-copy>p{font-size:14px}.explore-film{height:365px}.explore-kicker{font-size:8px;letter-spacing:.08em;margin-bottom:20px}.explore-cards{gap:10px}.explore-card{height:230px;padding:15px}.explore-card-copy{left:15px;right:26px;bottom:16px}.explore-card-copy strong{font-size:18px}.explore-card-copy>span{font-size:10px}.explore-cine{gap:25px}.explore-cine h2{font-size:26px}}
@media(max-width:600px){.studio-public-nav .brand .wordmark{font-size:20px}.studio-public-nav .brand{gap:5px}.st-actions{gap:9px}.st-account{padding:0}.explore-hero{grid-template-columns:1fr;gap:27px}.explore-copy{padding-top:10px}.explore-copy h1{font-size:43px}.explore-copy>p{font-size:14px;max-width:390px}.explore-film{height:260px}.explore-kicker{font-size:9px}.explore-primary{padding:14px 17px;font-size:13px}.explore-section-head{margin-top:35px}.explore-section-head h2{font-size:22px}.explore-section-head>span{display:none}.explore-cards{grid-template-columns:1fr}.explore-card{height:185px}.explore-card-copy{left:22px;right:45px;bottom:21px}.explore-card-copy strong{font-size:24px}.explore-card-copy>span{font-size:12px}.explore-cine{grid-template-columns:1fr;margin-top:32px;padding-top:32px}.studio-join{padding:40px 24px 26px}.studio-join h2{font-size:28px}}
@media(max-width:370px){body.studio-workbench .studio-public-nav{padding-inline:10px}.studio-public-nav .cocuyologo{display:none}.st-guest{gap:9px}.st-actions{gap:7px}.st-nav{gap:0}.st-nav a{font-size:12px}.explore-wrap{padding-inline:16px}.explore-copy h1{font-size:38px}.st-model-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.st-nav a::after,.explore-card>img,.st-nav-group>button .ic{transition:none}}
.cocuyo-companion{position:absolute;z-index:2;top:37%;left:50%;width:138px;height:106px;transform:translate(-50%,-50%);filter:drop-shadow(0 12px 26px #000b);animation:companion-float 6s ease-in-out infinite}
/* El componente de idioma controla su propio tamaño y desplegable. */
body.studio-workbench.audio-redesign #mesa{scroll-margin-top:calc(var(--st-top) + 12px)}
.st-side-extras{display:grid;gap:16px;padding:15px 10px;color:var(--muted2);font-size:12px}.st-side-extras>button{background:none;border:0;text-align:left;font:inherit;color:inherit;cursor:pointer}.st-side-extras>a{color:inherit;text-decoration:none}.st-side-extras>[data-idioma-slot]{display:none}.st-side-extras>a:hover,.st-side-extras>button:hover{color:var(--studio-accent)}
html[data-estudio-identidad=cuenta] .st-side-extras [data-idioma-slot]{display:none!important}
@media(max-width:900px){.st-side-extras>[data-idioma-slot]{display:block}}
#cocuyoComposer[hidden]{display:none}#cocuyoComposer{padding:30px;border:1px solid #394a2c;border-radius:20px;background:linear-gradient(120deg,#192313,#10130e);margin:35px 0;color:#ecf5e4}
.cocuyo-pilot-head{display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:.12em;color:#b4c99f}.cocuyo-pilot-head b{padding:6px 9px;border:1px solid #4c633a;border-radius:6px;letter-spacing:0;font-size:12px}
#cocuyoComposer h2{font:550 28px/1.2 var(--font);letter-spacing:-.04em;margin:20px 0 12px}#cocuyoComposer>p{color:#adbaa4;font-size:13px;line-height:1.7}#cocuyoComposer label{display:block;font-size:12px;margin:24px 0 10px}#cocuyoComposer textarea{box-sizing:border-box;display:block;width:100%;background:#0d130a;color:#edf6e5;border:1px solid #48583b;border-radius:12px;resize:vertical;min-height:110px;padding:16px;font:400 16px/1.6 var(--font)}#cocuyoComposer textarea:focus{outline:2px solid var(--studio-accent);outline-offset:2px}
.cocuyo-pilot-actions{display:flex;align-items:center;gap:20px;justify-content:space-between;margin-top:16px}#cocuyoComposer small{font-size:11px;line-height:1.6;color:#a6b797}.cocuyo-pilot-actions button,.cocuyo-plan>button{flex:none;border:0;border-radius:10px;padding:13px 19px;background:var(--studio-accent);color:#182211;font:600 13px var(--font);cursor:pointer}.cocuyo-pilot-actions button:disabled{opacity:.5;cursor:wait}
.cocuyo-plan{margin-top:24px;padding-top:24px;border-top:1px solid #3f4a34}.cocuyo-plan[hidden]{display:none}.cocuyo-plan-model{font-size:12px;color:var(--studio-accent)}.cocuyo-plan h3{font:550 23px/1.25 var(--font);margin:12px 0}.cocuyo-plan>p,.cocuyo-plan details p{font-size:13px;line-height:1.7;color:#c3d0b8;white-space:pre-wrap}.cocuyo-plan summary{font-size:12px;cursor:pointer;color:#b7c6a9;margin:20px 0}.cocuyo-plan>small{display:block;margin:12px 0}.cocuyo-api-meter{font-size:11px!important;color:#9fb48e!important;font-variant-numeric:tabular-nums}
@media(max-width:600px){#cocuyoComposer{padding:24px 18px}.cocuyo-pilot-actions{align-items:stretch;flex-direction:column;gap:14px}#cocuyoComposer h2{font-size:25px}}
.companion-body{position:absolute;inset:12px 27px 0;border-radius:42% 42% 49% 49%;border:1px solid #bdf76966;background:linear-gradient(130deg,#455936,#101c0c 65%);display:flex;align-items:flex-start;justify-content:center;gap:11px;padding-top:25px;box-shadow:inset 0 1px 12px #d2ffa022}
.companion-body i{width:11px;height:22px;border-radius:8px;background:#c4ff6d;box-shadow:0 0 10px #bcff6b,0 0 30px #99fb3766}
.companion-wing{position:absolute;top:0;width:48px;height:73px;border-radius:80% 10% 80% 40%;border:1px solid #c4f68c88;background:linear-gradient(130deg,#dcffb52e,#e7ffcf0a);transform:rotate(-35deg)}.companion-wing.left{left:0}.companion-wing.right{right:0;transform:scaleX(-1) rotate(-35deg)}
.cocuyo-how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;margin-top:25px;padding:30px 0;border-bottom:1px solid var(--border)}.cocuyo-how>div>span{font-size:11px;color:var(--studio-accent)}.cocuyo-how h2{font-size:16px;font-weight:550;margin:10px 0}.cocuyo-how p{font-size:12px;line-height:1.6;color:#aeb6a6;margin:0}
@keyframes companion-float{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,-58%)}}
@media(max-width:600px){.cocuyo-how{grid-template-columns:1fr;gap:22px;margin-top:10px}.cocuyo-how>div{padding-left:35px;position:relative}.cocuyo-how>div>span{position:absolute;left:0;top:12px}.cocuyo-how h2{margin-bottom:6px}}
@media(prefers-reduced-motion:reduce){.cocuyo-companion{animation:none}}

/* Cocuyo reúne exploración y guía; los editores quedan a un clic. */
.explore-wrap{padding-top:30px}.explore-hero{min-height:0;gap:32px}.explore-film{height:320px;border-radius:20px}.explore-copy h1{font-size:clamp(36px,3.6vw,53px);margin-bottom:16px}.explore-copy>p{font-size:14px;line-height:1.7;margin-bottom:21px}.explore-kicker{margin-bottom:18px}.explore-hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px}.explore-guide-link{font-size:12px;color:#c2caba;text-decoration:none}.explore-guide-link:hover{color:var(--studio-accent)}
.explore-paths,.cocuyo-guide{scroll-margin-top:calc(var(--st-top) + 22px);outline:none}.explore-paths:focus-visible,.cocuyo-guide:focus-visible{outline:2px solid var(--studio-accent);outline-offset:8px}.explore-section-head{margin-top:32px}.explore-card{height:205px}
.cocuyo-guide{display:grid;grid-template-columns:100px 1fr;gap:25px;align-items:start;margin-top:32px;padding:28px;border:1px solid #30392b;border-radius:18px;background:#10150d}.cocuyo-guide-avatar{position:relative;height:95px}.cocuyo-guide .cocuyo-companion{top:50%;scale:.68}.cocuyo-guide-tag{font-size:9px;font-weight:550;letter-spacing:.09em;color:#a8bb97}.cocuyo-guide h2{font-size:25px;letter-spacing:-.035em;font-weight:550;margin:12px 0}.cocuyo-guide-copy>p{font-size:13px;color:#abb6a2;line-height:1.75;margin:0;max-width:700px}.cocuyo-guide summary{cursor:pointer;color:var(--studio-accent);font-size:12px;margin-top:17px}.cocuyo-guide .cocuyo-how{margin-top:18px;padding:0;border:0;gap:20px}.cocuyo-how h3{font-size:14px;font-weight:550;margin:10px 0}
@media(max-width:900px){.explore-film{height:290px}.explore-copy h1{font-size:39px}.explore-hero{gap:24px}.explore-primary{padding:13px 16px}.explore-hero-actions{gap:14px}.explore-card{height:220px}.cocuyo-guide{grid-template-columns:75px 1fr;gap:20px;padding:24px}}
@media(max-width:600px){.explore-wrap{padding-top:22px}.explore-copy{padding-top:0}.explore-copy h1{font-size:39px}.explore-copy>p{font-size:14px}.explore-film{height:180px;border-radius:16px}.explore-hero{gap:23px}.explore-film-caption{left:18px;bottom:18px}.explore-motion{right:18px;bottom:18px}.explore-card{height:180px}.cocuyo-guide{grid-template-columns:1fr;gap:8px;padding:24px 20px}.cocuyo-guide-avatar{width:80px;height:60px}.cocuyo-guide .cocuyo-companion{left:50%;scale:.5}.cocuyo-guide h2{font-size:24px}.cocuyo-guide .cocuyo-how{gap:14px}.cocuyo-how h3{margin-top:5px}}


/* cocuyo-css: assets/css/estudio-cuenta-movil.css */
/* En móvil se presenta el mismo menú de cuenta del escritorio. */
@media(max-width:900px){
 body.studio-workbench.studio-simple #accmenu{
  position:fixed!important;top:auto;left:auto!important;right:12px;
  bottom:calc(var(--sm-bottom,64px) + 10px + env(safe-area-inset-bottom,0px));
  width:min(280px,calc(100vw - 24px));max-width:calc(100vw - 24px);
  max-height:calc(100dvh - var(--sm-bottom,64px) - 36px - env(safe-area-inset-bottom,0px));
  overflow:auto;overscroll-behavior:contain;z-index:200;
 }
 body.studio-workbench.studio-simple #accmenu .mi{min-height:46px;font-size:14px}
 body.studio-workbench #accmenu .acc-identidad{gap:9px}
 body.studio-workbench #accmenu .acc-identidad>div{flex:1;min-width:0}
 body.studio-workbench #accmenu #btnmascreditos{flex:none;height:36px;min-height:36px;padding:0 9px;gap:6px}
 body.studio-workbench #accmenu #btnmascreditos .credit-wallet-icon{width:17px;height:17px;flex-basis:17px}
}


/* cocuyo-css: assets/css/navegacion-global.css */
/* Una navegación para Cine, Cocuyo y creación. Panel editorial inspirado
   en Navbar Section 2 de SolaceUI / 21st.dev, adaptado sin dependencias. */
/* crear.html (y sus traducciones) carga esta hoja SIN tokens.css: el parche de
   [hidden] de .cn-header se queda y el foco lleva valores de respaldo. */
.studio-public-nav .st-pricing,.sm-nav .st-pricing{display:flex;align-items:center;justify-content:center;gap:9px;flex:none;min-height:44px;padding:7px 11px;color:#d7dbd2;font:550 12px/1.2 var(--fuente,var(--font,sans-serif));text-decoration:none;white-space:nowrap;border:1px solid #ffffff10;border-radius:10px;background:#ffffff04;transition:color .16s,border-color .16s,background .16s}
.cn-pricing-label{display:inline-flex;align-items:center;gap:6px}.cn-pricing-label svg{width:15px;height:15px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;opacity:.8}
/* El ahorro forma parte del enlace, sin un segundo cartel promocional. */
.cn-pricing-badge{padding:1px 0 1px 9px;border-left:1px solid #ffffff1b;background:transparent;color:#a9c988;font-size:10px;font-weight:500;line-height:1.2;white-space:nowrap;font-variant-numeric:tabular-nums}
.studio-public-nav .st-pricing:hover,.sm-nav .st-pricing:hover{color:#e5f1d5;border-color:#aff33e40;background:#aff33e08}
.studio-public-nav .st-pricing:focus-visible,.sm-nav .st-pricing:focus-visible{outline:var(--foco-contorno,2px solid var(--verde-cocuyo));outline-offset:var(--foco-separacion,2px)}
@media(max-width:1180px){.studio-public-nav .st-pricing{gap:0;padding-inline:9px}.cn-pricing-badge{display:none}}
@media(max-width:900px){body.studio-workbench.studio-simple .sm-nav:has(>.st-pricing){grid-template-columns:repeat(5,minmax(0,1fr))}.sm-nav .st-pricing{min-width:0;min-height:44px;flex-direction:column;gap:0;padding:4px 1px;font-size:10px;border-color:transparent;background:transparent;border-radius:8px}.sm-nav .st-pricing .cn-pricing-label{flex-direction:column;gap:4px}.sm-nav .st-pricing .cn-pricing-label svg{width:18px;height:18px;opacity:1}.sm-nav .st-pricing .cn-pricing-badge{display:none}.sm-nav .st-pricing,.sm-nav .st-pricing .cn-pricing-label{color:var(--muted,var(--gris-humo));font-weight:500}.sm-nav .st-pricing[aria-current=page],.sm-nav .st-pricing:hover{color:var(--blanco-luz)}}
@media(prefers-reduced-motion:reduce){.studio-public-nav .st-pricing,.sm-nav .st-pricing{transition:none}}
.cn-header,body.studio-workbench .studio-public-nav{--cn-accent:var(--verde-cocuyo,#aff33e);--cn-top:72px;box-sizing:border-box;position:fixed;inset:0 0 auto;height:var(--cn-top);display:flex;align-items:center;gap:28px;padding:0 28px;background:rgba(10,11,10,.96);border-bottom:1px solid #292c27;color:#f3f5ef;font-family:var(--fuente,var(--font,sans-serif));backdrop-filter:blur(22px)}
.cn-header{z-index:var(--z-nav,80)}.cn-header [hidden],.cn-mega[hidden]{display:none!important}.cn-header *{box-sizing:border-box}.cn-header button,.cn-header a{font:inherit;color:inherit;text-decoration:none}.cn-header button{cursor:pointer}
.cn-unified{--cn-top:72px;padding-top:var(--cn-top)!important}.cn-unified>.cabecera,.cn-unified .inicio-nav{display:none!important}.cn-unified .inicio-hero{min-height:calc(100svh - var(--cn-top));grid-template-rows:minmax(min-content,1fr) auto}.cn-brand,.studio-public-nav .brand .wordmark{font-size:25px;font-weight:750;letter-spacing:-1.1px;white-space:nowrap;flex:none}.cn-brand .o-viva{color:var(--verde-cocuyo);text-shadow:0 0 18px #aff33e38}
.cn-nav,.studio-public-nav .st-nav{display:flex;align-items:stretch;gap:7px;height:100%;margin:0;min-width:0}.cn-nav>a,.cn-group,.studio-public-nav .st-nav>a,.studio-public-nav .st-nav-group,.studio-public-nav .sn-agent-entry{display:flex;align-items:center;position:relative}.cn-nav>a,.cn-group>a,.studio-public-nav .st-nav>a,.studio-public-nav .st-nav-group>a,.studio-public-nav .sn-agent-entry{padding:10px 12px;min-height:44px;font-size:13px;font-weight:550;color:#adb2a8;border-radius:9px}.cn-nav>a,.studio-public-nav .st-nav>a,.studio-public-nav .sn-agent-entry{align-self:center}.cn-group>a,.studio-public-nav .st-nav-group>a{padding-right:3px}.cn-group>button,.studio-public-nav .st-nav-group>button{background:none;border:0;color:#929a89;width:27px;height:44px;display:grid;place-items:center;border-radius:7px}.cn-group>button>svg{width:13px;height:13px;transition:transform .2s}.cn-group>button[aria-expanded=true]>svg{transform:rotate(180deg);color:var(--cn-accent)}
.cn-nav a:hover,.studio-public-nav .st-nav a:hover,.studio-public-nav .sn-agent-entry:hover{color:#f7f9f3;background:#ffffff07}.cn-nav>a[aria-current=page],.cn-group>a[aria-current=page],.studio-public-nav .st-nav>a[aria-current=page]{color:var(--cn-accent);background:#aff33e0c;box-shadow:inset 0 0 0 1px #aff33e1f}.studio-public-nav .st-nav a::after{display:none}.studio-public-nav .st-nav-group:has(a[aria-current=page]){box-shadow:inset 0 -2px var(--cn-accent)}
.cn-actions{display:flex;align-items:center;gap:22px;margin-left:auto}.cn-actions .cabecera-acciones{display:flex;align-items:center;gap:15px;margin:0;flex-wrap:nowrap}.studio-public-nav .st-guest>a{font-size:12px!important;min-height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;padding:10px 15px!important;white-space:nowrap;font-weight:600!important}.studio-public-nav [data-st-login]{border:1px solid #434c3c;background:none;box-shadow:none}.studio-public-nav [data-st-login]:hover{background:var(--cn-accent);border-color:var(--cn-accent);color:#16200c}.cn-actions .saludo{display:none!important}.cn-actions #avatar-cine{width:36px;height:36px;min-height:36px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--verde-cocuyo) 35%,transparent);border-radius:50%;background:var(--acento-fondo)}.cn-actions .oculto{display:none!important}.cn-header .cuenta-espera{display:none}
.cn-mega,.studio-public-nav .st-model-panel.cn-mega{position:absolute;top:calc(100% + 9px);left:24px;right:24px;width:auto;display:grid;grid-template-columns:minmax(0,1fr);padding:22px;gap:0;max-height:calc(100dvh - 100px);overflow:auto;border:1px solid #363e30;border-radius:20px;background:#11140f;box-shadow:0 24px 70px #000b;animation:cn-reveal .18s ease-out;color:#f3f5ef;font-family:var(--fuente,var(--font,sans-serif))}
.cn-panel-content{min-width:0;padding:0}.cn-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.cn-panel-heading>div>span{font-size:9px;letter-spacing:.14em;color:#aab69f}.cn-panel-heading h2{font-size:23px;font-weight:550;letter-spacing:-.035em;margin:8px 0 0;color:#f2f6ec}.cn-panel-heading>button{display:grid;place-items:center;width:36px;height:36px;background:#ffffff06;border:1px solid #343c2d;border-radius:9px;color:#b6c0ad;font:24px sans-serif;cursor:pointer}
.cn-model-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.cn-model{display:flex;align-items:center;gap:12px;min-width:0;min-height:72px;padding:13px 11px;border:1px solid #2d3526!important;border-radius:11px;background:#191e15!important;text-align:left;text-decoration:none!important;color:#e7efde!important;font:inherit;cursor:pointer;transition:background .15s,border-color .15s,transform .15s}.cn-model:hover{background:#222c1a!important;border-color:#586e41!important;transform:translateY(-1px)}.cn-model:disabled{opacity:.5;cursor:default;transform:none}.cn-model>span:not(.mrcbox){display:grid;gap:6px;min-width:0}.cn-model b{font-size:12px;font-weight:550;line-height:1.3;color:#ecf3e3}.cn-model small{font-size:10px;color:#9eaf90;line-height:1.4}.cn-model .mrcbox{width:30px;height:30px;display:grid;place-items:center;flex:none;color:#aff33e}.cn-model .mrc{width:25px;height:25px}.cn-model>svg{width:13px;height:13px;flex:none;margin-left:auto;color:#91a37f}.cn-unavailable{margin-top:18px}.cn-unavailable>summary{font-size:11px;color:#a8b79c;cursor:pointer;padding:5px 0 12px}.cn-panel-footer{margin-top:20px;padding-top:15px;border-top:1px solid #2c3326;font-size:10px;color:#98a68e}.cn-panel-status{font-size:13px;line-height:1.6;color:#b1bea7;margin:20px 0}
.cn-header :is(a,button,select):focus-visible,.cn-mega :is(a,button,summary):focus-visible{outline:var(--foco-contorno,2px solid var(--verde-cocuyo));outline-offset:var(--foco-separacion,2px)}
.cn-unified .cn-header #avatar-cine:not(.oculto){display:grid!important}
@keyframes cn-reveal{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1180px){.cn-header,body.studio-workbench .studio-public-nav{gap:18px;padding-inline:20px}.cn-nav,.studio-public-nav .st-nav{gap:1px}.cn-nav>a,.cn-group>a,.studio-public-nav .st-nav>a,.studio-public-nav .st-nav-group>a,.studio-public-nav .sn-agent-entry{padding-left:9px;padding-right:9px;font-size:12px}.cn-group>a,.studio-public-nav .st-nav-group>a{padding-right:0}.cn-actions{gap:14px}.cn-actions .cabecera-acciones{gap:9px}.cn-mega,.studio-public-nav .st-model-panel.cn-mega{grid-template-columns:minmax(0,1fr)}.cn-model-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){body.studio-workbench .studio-public-nav{--cn-top:116px;height:116px;display:grid!important;grid-template-columns:auto 1fr;grid-template-rows:64px 52px;gap:0 10px;padding:0 16px}.studio-public-nav .brand .wordmark{font-size:23px}.studio-public-nav .st-nav{grid-column:1/-1;grid-row:2;width:100%;display:flex;justify-content:space-between;gap:0}.studio-public-nav .st-nav>a,.studio-public-nav .st-nav-group{flex:1;justify-content:center}.studio-public-nav .st-nav>a{padding-block:12px;min-height:44px}.studio-public-nav .st-actions{grid-column:2;grid-row:1;justify-self:end;margin-left:auto;gap:10px}.cn-mega,.studio-public-nav .st-model-panel.cn-mega{top:calc(100% + 5px);left:10px;right:10px;display:block;padding:17px;max-height:calc(100dvh - 135px);border-radius:15px}.cn-panel-content{padding:0}.cn-model-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.cn-panel-heading{margin-bottom:16px}.cn-panel-heading h2{font-size:21px}.cn-model{padding:12px 9px;min-height:75px;gap:10px}.cn-model>svg{display:none}.cn-panel-footer{margin-top:16px}}
@media(max-width:380px){body.studio-workbench .studio-public-nav{padding-inline:10px}.studio-public-nav .brand .wordmark{font-size:20px}.studio-public-nav .st-nav>a,.studio-public-nav .st-nav-group>a{padding-left:4px;padding-right:4px;font-size:11px}.studio-public-nav .st-nav-group>button{width:21px;padding:3px}.cn-model-grid{grid-template-columns:1fr}.cn-model{min-height:63px}}
@media(prefers-reduced-motion:reduce){.cn-mega{animation:none}.cn-model,.cn-group>button>svg{transition:none}}
@media(max-width:380px){
 .studio-public-nav .st-nav{display:grid;grid-template-columns:.9fr 1.1fr 1.1fr 1.1fr;min-width:0}
 .studio-public-nav .st-nav>a,.studio-public-nav .st-nav-group{min-width:0}
 .studio-public-nav .st-nav-group>button{width:18px;flex:none}
}

/* La portada y Cine continúan bajo la cabecera. Al desplazarse o abrir
   modelos recupera el fondo legible; la app nativa conserva su navegación. */
html:is([data-vista="intro"],[data-vista="cine"]) .cn-unified{padding-top:0!important}
html[data-vista="intro"] .cn-unified .inicio-hero{box-sizing:border-box;min-height:100svh;padding-top:calc(var(--cn-top) + env(safe-area-inset-top))}
html:is([data-vista="intro"],[data-vista="cine"]) .cn-header:not(.cn-scrolled):not(.cn-open){background:linear-gradient(180deg,#03050335,#0305030a);border-bottom-color:#ffffff12;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
html:is([data-vista="intro"],[data-vista="cine"]) .cn-header:not(.cn-scrolled) .cn-nav a:not([aria-current="page"]){color:#f1f5eb;text-shadow:0 1px 8px #000b}
/* La marca es la única entrada a Explorar; no se repite como pestaña. */
.cn-brand,.studio-public-nav #studioHomeButton{position:relative;min-height:44px;display:flex;align-items:center;border-radius:9px;cursor:pointer;transition:color .18s,filter .18s}
.cn-brand:hover,.studio-public-nav #studioHomeButton:hover{filter:drop-shadow(0 0 9px #aff33e50)}
.studio-public-nav #studioHomeButton[aria-current="page"]:after{content:"";position:absolute;left:2px;right:2px;bottom:0;height:2px;background:var(--verde-cocuyo,#aff33e);border-radius:2px}
.studio-public-nav #studioHomeButton:focus-visible{outline:var(--foco-contorno,2px solid var(--verde-cocuyo));outline-offset:var(--foco-separacion,2px)}
@media(prefers-reduced-motion:reduce){.cn-brand,.studio-public-nav #studioHomeButton{transition:none}}
.cn-panel-footer{display:flex;align-items:center;justify-content:space-between;gap:20px}
.cn-panel-footer>a,.cn-panel-footer>button{display:inline-flex;align-items:center;gap:9px;min-height:40px;padding:6px 0;border:0;background:none;color:var(--cn-accent);font:550 12px var(--fuente,var(--font,sans-serif));cursor:pointer;white-space:nowrap}
.cn-panel-footer svg{width:15px;height:15px}
.cn-panel-footer>span{text-align:right;line-height:1.6}
@media(max-width:600px){.cn-panel-footer{align-items:flex-start;flex-direction:column;gap:5px}.cn-panel-footer>span{text-align:left}}

/* Familias en cascada: una lista compacta y un segundo nivel conectado,
   como un menú de escritorio, con superficies y tipografía de Cocuyo. */
.cn-header .cn-nav>a,.cn-header .cn-group>a,
body.studio-workbench .studio-public-nav .st-nav>a,
body.studio-workbench .studio-public-nav .st-nav-group>a,
body.studio-workbench .studio-public-nav .sn-agent-entry{
 display:flex;align-items:center;justify-content:center;position:relative;line-height:1;min-height:44px;
 font-family:var(--fuente);font-weight:550;text-decoration:none;box-shadow:none;
}
.cn-header .cn-nav>a[aria-current=page],
body.studio-workbench .studio-public-nav .st-nav>a[aria-current=page],
body.studio-workbench .studio-public-nav .sn-agent-entry[aria-current=page]{
 color:var(--verde-cocuyo);background:transparent;box-shadow:none;
}
.cn-header .cn-nav>a[aria-current=page]::after,
body.studio-workbench .studio-public-nav .sn-agent-entry[aria-current=page]::after{
 content:"";position:absolute;left:12px;right:12px;bottom:0;height:2px;
 border-radius:2px;background:var(--verde-cocuyo);
}
body.studio-workbench .studio-public-nav .st-nav-group:has(a[aria-current=page]){box-shadow:none}
body.studio-workbench .studio-public-nav .st-nav-group>a[aria-current=page]{color:var(--verde-cocuyo);background:transparent}
body.studio-workbench .studio-public-nav .st-nav-group>a[aria-current=page]::after{
 display:block;content:"";position:absolute;left:9px;right:9px;bottom:0;height:2px;
 border-radius:2px;background:var(--verde-cocuyo);
}
.cn-mega,.studio-public-nav .st-model-panel.cn-mega{
 left:var(--cn-menu-left,180px);right:auto;width:min(660px,calc(100vw - 24px));
 top:calc(100% + 6px);padding:0;display:block;overflow:auto;overscroll-behavior:contain;
 max-height:calc(100dvh - var(--cn-top,72px) - 22px);border-radius:16px;
 background:var(--negro-elevado);border-color:var(--escarcha-borde);box-shadow:var(--sombra-3);
}
.cn-mega [hidden]{display:none!important}
.cn-mega .cn-panel-heading{gap:12px;margin:0;padding:14px 16px;border-bottom:1px solid var(--negro-borde)}
.cn-mega .cn-panel-heading h2{font:600 15px/1.3 var(--fuente);letter-spacing:-.02em;margin:0;color:var(--blanco-luz)}
.cn-mega .cn-panel-heading>span{font:400 12px/1.3 var(--fuente);color:var(--gris-humo)}
.cn-mega .cn-panel-heading>button{width:32px;height:32px;margin-left:auto;flex:none;font-size:22px;background:transparent;border:0;color:var(--gris-niebla)}
.cn-cascade{display:grid;grid-template-columns:220px minmax(0,1fr);align-items:start}
.cn-family-list{padding:9px;display:grid;gap:2px}
.cn-mega .cn-family{
 display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:9px 10px;
 font:500 13px/1.3 var(--fuente);text-align:left;color:var(--gris-niebla);background:transparent;
 border:1px solid transparent;border-radius:8px;cursor:pointer;transition:background .14s,color .14s;
}
.cn-mega .cn-family .mrcbox{display:grid;place-items:center;width:23px;height:23px;flex:none;color:var(--verde-cocuyo)}
.cn-mega .cn-family .mrc{width:21px;height:21px}
.cn-mega .cn-family>span:not(.mrcbox){flex:1;min-width:0}
.cn-mega .cn-family>small{font-size:10px;font-variant-numeric:tabular-nums;color:var(--gris-humo)}
.cn-mega .cn-family>svg{width:12px;height:12px;flex:none;color:var(--gris-humo)}
.cn-mega .cn-family:hover,.cn-mega .cn-family[aria-expanded=true]{
 background:color-mix(in srgb,var(--verde-cocuyo) 8%,transparent);color:var(--blanco-luz);
}
.cn-mega .cn-family[aria-expanded=true]{border-color:color-mix(in srgb,var(--verde-cocuyo) 16%,transparent)}
.cn-mega .cn-family[aria-expanded=true]>svg{color:var(--verde-cocuyo)}
.cn-family-deck{align-self:stretch;min-width:0;border-left:1px solid var(--negro-borde);background:color-mix(in srgb,var(--negro-abismo) 42%,var(--negro-elevado));padding:12px}
.cn-family-heading{display:flex;align-items:center;gap:10px;min-height:36px;padding:0 8px 10px;font:600 13px/1.4 var(--fuente);color:var(--blanco-luz)}
.cn-family-heading>small{margin-left:auto;color:var(--gris-humo);font-size:10px;font-weight:400}
.cn-family-heading>button{display:none}
.cn-mega .cn-model-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:5px}
.cn-mega .cn-model{gap:11px;min-height:62px;padding:11px 12px;border:1px solid transparent!important;border-radius:9px;background:transparent!important;color:var(--blanco-luz)!important;transform:none}
.cn-mega .cn-model:hover{background:var(--negro-elevado)!important;border-color:var(--escarcha-borde)!important;transform:none}
.cn-mega .cn-model:disabled{opacity:1;color:var(--gris-humo)!important;cursor:not-allowed}
.cn-mega .cn-model:disabled:hover{background:transparent!important;border-color:transparent!important}
.cn-mega .cn-model:disabled b,.cn-mega .cn-model:disabled .mrcbox{color:var(--gris-humo)}
.cn-mega .cn-model .mrcbox{width:26px;height:26px;color:var(--verde-cocuyo)}
.cn-mega .cn-model .mrc{width:23px;height:23px}
.cn-mega .cn-model b{font:550 13px/1.4 var(--fuente);color:var(--blanco-luz);overflow-wrap:anywhere}
.cn-mega .cn-model small{font:400 11px/1.4 var(--fuente);color:var(--gris-humo)}
.cn-mega .cn-model>span:not(.mrcbox){gap:3px}
.cn-mega .cn-model>svg{display:block;width:12px;height:12px;color:var(--gris-humo)}
.cn-mega .cn-model:disabled>svg{visibility:hidden}
.cn-mega .cn-panel-footer{margin:0;padding:10px 16px;border-top:1px solid var(--negro-borde);gap:14px}
.cn-mega .cn-panel-footer>a,.cn-mega .cn-panel-footer>button{min-height:40px;color:var(--verde-cocuyo);font-size:12px}
.cn-mega .cn-panel-footer>span{max-width:230px;color:var(--gris-humo);font-size:10px}
.cn-mega .cn-panel-status{margin:0;padding:12px 18px;border-bottom:1px solid var(--negro-borde);font-size:12px;color:var(--gris-niebla)}
@media(max-width:900px){
 .cn-mega,.studio-public-nav .st-model-panel.cn-mega{left:12px;right:auto;width:min(660px,calc(100vw - 24px));max-height:calc(100dvh - 134px)}
 body.studio-workbench .studio-public-nav .st-nav>a{padding:12px 2px;font-size:12px}
}
@media(max-width:600px){
 .cn-mega,.studio-public-nav .st-model-panel.cn-mega{left:10px;right:10px;width:auto;border-radius:13px}
 .cn-cascade{display:block}
 .cn-family-list{padding:7px}
 .cn-mega .cn-family{min-height:47px;padding:10px 12px;font-size:14px}
 .cn-mega .cn-family>small{font-size:11px}
 .cn-family-deck{display:none;border-left:0;padding:7px}
 .cn-mega[data-nav-drill=true] .cn-family-list{display:none}
 .cn-mega[data-nav-drill=true] .cn-family-deck{display:block}
 .cn-family-heading{padding:0 9px 8px 0;font-size:14px;min-height:48px}
 .cn-family-heading>button{display:grid;place-items:center;min-width:44px;min-height:44px;background:transparent;border:0;border-radius:8px;color:var(--gris-niebla);cursor:pointer}
 .cn-family-heading>button>svg{width:16px;height:16px;transform:rotate(180deg)}
 .cn-mega .cn-model{min-height:67px}
 .cn-mega .cn-panel-heading{padding:10px 13px;gap:9px}
 .cn-mega .cn-panel-heading>span{font-size:11px}
 .cn-mega .cn-panel-footer{align-items:center;flex-direction:row;gap:10px;padding:8px 13px}
 .cn-mega .cn-panel-footer>span{max-width:148px;text-align:right;font-size:9px}
}
@media(prefers-reduced-motion:reduce){.cn-mega .cn-family{transition:none}}

/* La nueva portada lleva al agente; YouTube vive en Comunidad (supermenú). */
html[data-experiencia="nueva"] .cn-agent{white-space:nowrap}

/* Single available model: direct resolution choices, same menu and mobile drilldown. */
.cn-mega .cn-family-name{display:grid;gap:2px}.cn-mega .cn-family-name>b{font:inherit}.cn-mega .cn-family-name>small{font-size:10px;line-height:1.3;color:var(--gris-humo);overflow-wrap:anywhere}
.cn-mega a.cn-family{text-decoration:none}.cn-mega .cn-resolution b{font-size:15px;font-variant-numeric:tabular-nums}.cn-mega .cn-family-heading>span{min-width:0;overflow-wrap:anywhere}.cn-mega .cn-family-heading>small{flex:none}
.cn-direct-summary{padding:12px;display:grid;gap:7px;color:var(--gris-niebla);font-size:12px;line-height:1.5}.cn-direct-summary>b{color:var(--blanco-luz);font-size:14px}.cn-direct-summary>p{margin:0;color:var(--gris-humo)}.cn-inactive-label{margin-top:10px;padding:8px 12px;font-size:10px;color:var(--gris-humo)}

/* Portada (dueño, 28-sep-2026): a la derecha UN solo botón, «Empieza a
   crear» (lima lleno), siempre el último: el avatar aparece a su izquierda
   al resolver la sesión, así el botón no se mueve. Login queda oculto en la
   cabecera (se entra desde la ventana de acceso que abre este botón). */
.cn-header{--cn-avatar:36px}
.cn-header .cn-actions .cabecera-acciones{gap:10px}
.cn-header .cn-actions #btn-entrar-cabecera,.cn-header .cuenta-espera{display:none!important}
.cn-header .cn-start{box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;flex:none;height:40px;min-height:40px;margin:0;padding:0 18px;border:1px solid var(--verde-cocuyo);border-radius:var(--radio-pill);background:var(--verde-cocuyo);color:var(--tinta-sobre-verde);font:600 13px/1 var(--fuente);letter-spacing:0;white-space:nowrap;text-decoration:none;box-shadow:none;transition:background var(--trans-rapida),border-color var(--trans-rapida)}
.cn-header .cn-start:hover{background:var(--lima-clara);border-color:var(--lima-clara);color:var(--tinta-sobre-verde)}
.cn-header .cn-actions #avatar-cine{width:var(--cn-avatar);height:var(--cn-avatar);min-height:var(--cn-avatar)}
/* Precios con su reclamo: una pastilla pequeña «No caducan». */
.cn-header .cn-pricing{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.cn-pricing-tag{padding:3px 8px;border-radius:var(--radio-pill);background:color-mix(in srgb,var(--verde-cocuyo) 16%,transparent);color:var(--verde-cocuyo);font-size:10.5px;font-weight:600;line-height:1.2}
/* Móvil (≤1023 px): una sola fila con logo, «Empieza a crear» y ☰; el resto
   vive en el panel del ☰ (supermenu.css). */
@media(prefers-reduced-motion:reduce){.cn-header .cn-start{transition:none}}

/* El idioma vive en el pie (portada nueva, anterior o Cine), junto a lo legal. */
.cn-idioma-pie{display:inline-flex;align-items:center}
.cn-idioma-pie .cocuyo-idioma{border-color:var(--negro-borde);background:transparent;color:var(--gris-niebla)}
.cn-idioma-pie .cocuyo-idioma>summary:hover,.cn-idioma-pie .cocuyo-idioma[open]>summary{color:var(--blanco-luz)}
.pie-legal>.cn-idioma-pie{justify-self:center}

/* Letra fina (29-sep-2026): kerning de la fuente, cifras tabulares en el
   saldo y los costes de la cabecera, y textos del panel sin viudas. */
.cn-header,body.studio-workbench .studio-public-nav,.cn-mega{font-kerning:normal}
.cn-header,body.studio-workbench .studio-public-nav{font-variant-numeric:tabular-nums}
.cn-mega :is(.cn-panel-heading h2,.cn-family-heading>span){text-wrap:balance}
.cn-mega :is(.cn-model small,.cn-direct-summary>p,.cn-panel-status){text-wrap:pretty}

/* El editor conserva las opciones de la portada junto al selector en vivo. */
.st-model-panel .cn-editor-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;padding:16px;border-top:1px solid var(--negro-borde)}
.st-model-panel .cn-editor-options section+section{margin-top:18px}
.st-model-panel .cn-editor-options h3{margin:0 0 7px;font:600 11px/1.4 var(--fuente);color:var(--gris-humo)}
.st-model-panel :is(.cn-editor-options,.cn-editor-links) ul,.st-model-panel .cn-editor-links{list-style:none;margin:0;padding:0}
.st-model-panel :is(.cn-editor-options,.cn-editor-links) a,.st-model-panel .cn-editor-option-soon{display:flex;align-items:center;gap:9px;min-height:42px;padding:7px 8px;border-radius:8px;color:var(--gris-niebla);font:500 12px/1.4 var(--fuente);text-decoration:none}
.st-model-panel :is(.cn-editor-options,.cn-editor-links) a:hover,.st-model-panel :is(.cn-editor-options,.cn-editor-links) a:focus-visible{background:var(--negro-elevado);color:var(--blanco-luz)}
.st-model-panel :is(.cn-editor-options,.cn-editor-links) a:focus-visible{outline:var(--foco-contorno,2px solid var(--verde-cocuyo));outline-offset:var(--foco-separacion,2px)}
.st-model-panel .cn-editor-option-icon{display:grid;place-items:center;width:22px;flex:none;color:var(--verde-cocuyo)}
.st-model-panel .cn-editor-option-icon svg{width:20px;height:20px}
.st-model-panel :is(.cn-editor-options,.cn-editor-links) a>span:not(.cn-editor-option-icon){min-width:0;overflow-wrap:anywhere}
.st-model-panel :is(.cn-editor-options,.cn-editor-links) small{margin-left:auto;flex:none;color:var(--verde-cocuyo);font-size:10px}
.st-model-panel .cn-editor-option-soon{color:var(--gris-humo)}
.st-model-panel .cn-editor-option-soon :is(.cn-editor-option-icon,small){color:var(--gris-humo)}
.st-model-panel ul.cn-editor-links{display:flex;flex-wrap:wrap;gap:8px;padding:8px 16px;border-top:1px solid var(--negro-borde)}
.st-model-panel .cn-editor-status{margin:0;padding:12px 16px;border-top:1px solid var(--negro-borde);color:var(--gris-niebla);font-size:12px}
@media(max-width:600px){.st-model-panel .cn-editor-options{grid-template-columns:minmax(0,1fr);gap:18px;padding:13px}.st-model-panel :is(.cn-editor-options,.cn-editor-links) a,.st-model-panel .cn-editor-option-soon{min-height:44px;font-size:13px}}


/* cocuyo-css: assets/css/estudio-simple.css */
/* Un espacio de creación sin la navegación lateral repetida. */
.cocuyo-assistant-wrap{max-width:1000px;padding-top:30px}
.cocuyo-assistant-wrap>h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.cocuyo-explorer-back{display:inline-flex;align-items:center;gap:8px;min-height:44px;text-decoration:none;color:var(--muted2);font:500 12px var(--font)}
.cocuyo-explorer-back:hover{color:var(--studio-accent)}
.cocuyo-explorer-back .ic{width:16px;height:16px}
.cocuyo-assistant-wrap #cocuyoComposer{margin:12px 0 30px}
body.studio-workbench.studio-simple{--side:0px!important}
body.studio-workbench.studio-simple .side{display:none!important}
body.studio-simple .st-mobile-more,body.studio-simple #accmenu .mi-ver{display:none!important}
body.studio-simple .st-library{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}
body.studio-simple .st-library .ic{width:19px;height:19px}
body.studio-simple .studio-public-nav #acct{display:grid;place-items:center;width:42px;height:42px;min-height:42px;padding:0;background:var(--surface);border:1px solid var(--border);border-radius:50%}
body.studio-simple .studio-public-nav #acct .av{display:grid;width:32px;height:32px;font-size:13px}
body.studio-simple .studio-public-nav #acct .acct-identidad,body.studio-simple .studio-public-nav #acct .acct-chevron{display:none}
body.studio-simple .studio-public-nav #btnmascreditos{width:124px;min-height:42px;padding:8px 10px;border:1px solid var(--border);border-radius:10px;background:var(--surface);font-size:11px}
body.studio-simple .studio-public-nav #btnmascreditos [data-credit-label],body.studio-simple .studio-public-nav #btnmascreditos .credit-wallet-caption{display:none}
body.studio-simple .studio-public-nav #btnmascreditos .credit-wallet-row{justify-content:center;gap:6px;font-size:11px}
body.studio-simple .studio-public-nav #btnmascreditos .credit-meter{height:3px;margin-top:5px}
body.studio-simple .studio-public-nav #btnmascreditos{height:42px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;gap:0}
#cocuyoEnergy{box-sizing:border-box;height:42px}
body.studio-simple .studio-public-nav #btnmascreditos [data-credit-value]{font-size:16px;font-weight:750;letter-spacing:-.2px;font-variant-numeric:tabular-nums;color:var(--text)}
#cocuyoEnergy{width:128px;min-height:42px;padding:7px 10px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);text-align:left;font-size:11px}
#cocuyoEnergy[hidden]{display:none!important}
#cocuyoEnergy>span:first-child{display:flex;justify-content:space-between;gap:8px}
#cocuyoEnergy b{font-variant-numeric:tabular-nums;color:var(--studio-accent)}
.cocuyo-energy-track{display:block;height:4px;background:#ffffff15;border-radius:8px;overflow:hidden;margin-top:6px}
.cocuyo-energy-track i{display:block;height:100%;background:var(--studio-accent);border-radius:8px;transition:width .3s}
#cocuyoEnergy[data-low=true] b{color:#ff9b8f}
#cocuyoEnergy[data-low=true] i{background:#ff9b8f}
#cocuyoComposer{scroll-margin-top:100px;padding:clamp(22px,4vw,46px);border:1px solid #b8f35b33;border-radius:24px;background:radial-gradient(ellipse at 90% 0%,#b8f35b0c,transparent 60%),#111312}
.cocuyo-compose-heading{display:flex;align-items:center;gap:12px;margin-bottom:18px;font-size:17px;color:#d1eea6}
#cocuyoComposer h2{font-size:clamp(25px,3.2vw,38px);line-height:1.2;letter-spacing:-1px;margin:0 0 12px}
#cocuyoComposer>p{font-size:15px;line-height:1.6;color:#a6b0a9;max-width:640px}
#cocuyoComposer form{margin-top:25px}
.cocuyo-type{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:13px}
.cocuyo-type button{padding:8px 13px;border:1px solid #ffffff15;border-radius:20px;color:#b1bab5;font-size:12px;background:#ffffff05}
.cocuyo-type button[aria-pressed=true]{background:#b8f35b15;border-color:#b8f35b60;color:#d6f9a7}
#cocuyoComposer textarea{display:block;width:100%;min-height:116px;resize:vertical;box-sizing:border-box;padding:17px;border:1px solid #ffffff25;border-radius:14px;background:#090b09;color:#f5f7f4;font:inherit;font-size:16px;line-height:1.65;outline:none}
#cocuyoComposer textarea:focus{border-color:#b8f35b;box-shadow:0 0 0 3px #b8f35b10}
#cocuyoComposer .cocuyo-pilot-actions{display:flex;align-items:center;gap:10px;margin-top:13px}
#cocuyoComposer .cocuyo-pilot-actions button{min-height:44px;padding:10px 17px;border-radius:12px;font-size:13px;font-weight:650}
#cocuyoComposer button[type=submit]{margin-left:auto;background:#b8f35b;color:#15210a;border:1px solid #b8f35b}
#cocuyoComposer button:disabled{opacity:.5;cursor:default}
#cocuyoComposer .cocuyo-mic{display:flex;align-items:center;gap:9px;background:#ffffff08;border:1px solid #ffffff25;color:#e8eee8}
.cocuyo-mic svg{width:18px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
#cocuyoComposer .cocuyo-mic[aria-pressed=true]{border-color:#ff9b8f;color:#ffb4aa}
.cocuyo-record-time{font-size:12px;color:#bac2bc;font-variant-numeric:tabular-nums}
.cocuyo-compose-note{display:block;margin-top:13px;color:#8c998e;font-size:12px;line-height:1.6}
.cocuyo-cancel-record{color:#cbd2cd;font-size:12px;text-decoration:underline;padding:10px 0}
.cocuyo-plan-spec{display:flex;gap:7px;margin:14px 0}
.cocuyo-plan-spec span{padding:5px 9px;border-radius:6px;background:#ffffff09;color:#c5cec7;font-size:12px}
.cocuyo-plan-price{font-weight:650;color:#dcf9b7}
body.studio-simple #accmenu .studio-session-switch{margin:8px 12px}
body.studio-simple #accmenu #studioSessionToggle{min-height:44px;padding:8px 10px}
body.studio-simple #accmenu #studioSessionToggle small{display:none}
@media(min-width:901px){
 body.studio-workbench.studio-simple #accmenu{position:fixed;left:auto;right:20px;top:calc(var(--st-top) + 8px);bottom:auto;width:300px;max-height:calc(100dvh - var(--st-top) - 24px);overflow:auto;z-index:200}
 body.studio-workbench.studio-simple #submenu{left:auto!important;right:328px;z-index:201}
}
@media(max-width:900px){
 body.studio-workbench.studio-simple{--st-top:64px;--sm-top:64px}
 body.studio-workbench.studio-simple .studio-public-nav{grid-template-columns:auto minmax(0,1fr);grid-template-rows:64px;padding:0 12px;gap:8px}
 body.studio-simple .studio-public-nav .brand .wordmark{font-size:19px}
 body.studio-simple .st-brand-slot{grid-column:1;grid-row:1}
 body.studio-simple .studio-public-nav .st-nav{grid-column:2;grid-row:1;gap:0;min-width:0}
 body.studio-simple .st-nav a{font-size:12px}
 body.studio-simple .st-nav-group>button{width:22px;padding:4px}
 body.studio-simple .st-actions{display:none}
 body.studio-simple .st-actions .st-guest{display:none}
 body.studio-simple .studio-public-nav #acct,body.studio-simple .studio-public-nav #btnmascreditos,body.studio-simple .studio-public-nav .st-library{display:none!important}
 /* Barra inferior en UNA sola fila, tenga los botones que tenga
    (Proyectos · Apps · Creaciones · Precios · Cuenta, y Agente si la
    cuenta tiene acceso). Con columnas fijas el sexto botón (Cuenta)
    saltaba a una segunda fila. */
 body.studio-simple .sm-nav{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}
 /* Precios alinea icono y texto con los demás botones de la barra. */
 body.studio-workbench.studio-simple .sm-nav .st-pricing{min-height:48px;padding:3px 0}
 body.studio-workbench.studio-simple .sm-nav .st-pricing .cn-pricing-label{gap:5px}
 body.studio-workbench.studio-simple .sm-nav .st-pricing .cn-pricing-label svg{width:21px;height:21px}
 /* Cine y los tres editores conservan el mismo orden de la portada. */
 body.studio-workbench.studio-simple .studio-public-nav .st-nav{display:grid;grid-template-columns:minmax(44px,.75fr) minmax(0,1.2fr) repeat(2,minmax(0,1fr));gap:0}
 body.studio-workbench.studio-simple .studio-public-nav .st-nav>a.st-cine{justify-content:center;padding:12px 2px;min-height:44px;font-size:12px}
 body.studio-simple .sm-nav [data-sm-account][aria-expanded=true]{color:var(--studio-accent)}
 body.studio-simple[data-studio-page=explore] .studio-public-nav #btnmascreditos{display:block!important;width:108px}
 body.studio-simple[data-studio-page=explore] .studio-public-nav #btnmascreditos[hidden]{display:none!important}
 body.studio-simple[data-studio-page=explore] .st-actions:has(#cocuyoEnergy:not([hidden])){display:flex!important;position:fixed;top:var(--st-top);left:0;right:0;justify-content:flex-end;padding:8px 14px;background:#090b09eF;border-bottom:1px solid #ffffff10}
 body.studio-simple[data-studio-page=explore]:has(#cocuyoEnergy:not([hidden])) #pg-explore{padding-top:60px}
 #cocuyoEnergy{width:120px}
 #cocuyoComposer{border-radius:18px;padding:22px 17px}
 #cocuyoComposer .cocuyo-pilot-actions{flex-direction:row;flex-wrap:wrap}
 #cocuyoComposer .cocuyo-pilot-actions button{padding:10px 12px}
 #cocuyoComposer .cocuyo-record-time:empty{display:none}
}
@media(max-width:370px){
 body.studio-workbench.studio-simple .studio-public-nav .st-nav a{font-size:11px}
 body.studio-workbench.studio-simple .studio-public-nav .st-nav>a.st-cine{font-size:11px}
 body.studio-workbench.studio-simple .studio-public-nav .st-nav-group>button{width:18px;padding:2px}
}

/* El panel de Video se define en estudio-video-layout.css. */

/* El mismo compositor se abre sobre el editor sin perder su borrador. */
#cocuyoChat{box-sizing:border-box;width:min(640px,calc(100vw - 28px));max-height:calc(100dvh - 32px);margin:auto;padding:0;border:1px solid var(--border2);border-radius:24px;background:var(--surface);color:var(--text);overflow:auto;overscroll-behavior:contain;box-shadow:0 30px 100px #0009}
#cocuyoChat:not([open]){display:none}
#cocuyoChat::backdrop{background:#040604b8;backdrop-filter:blur(5px)}
#cocuyoChat #cocuyoComposer{border:0;margin:0;border-radius:0;padding:32px}
#cocuyoChat #cocuyoComposer h2{font-size:29px;letter-spacing:-.9px}
#cocuyoChat #cocuyoComposer>p{font-size:14px}
#cocuyoChat .cocuyo-chat-close{position:sticky;z-index:2;float:right;top:15px;margin:15px 15px -51px 0;display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--border);border-radius:50%;background:var(--surface2,var(--surface));color:var(--muted2);font-size:25px;cursor:pointer}
#cocuyoComposer [data-cocuyo-reset]{border:0;background:transparent;color:var(--muted2);font:500 12px var(--font);padding:12px 0;cursor:pointer}
#cocuyoComposer [data-cocuyo-reset][hidden]{display:none}
#cocuyoComposer .cocuyo-user-message{padding:12px 15px;background:var(--surface2);border:1px solid var(--border);border-radius:14px 14px 4px 14px;color:var(--text);white-space:pre-wrap;overflow-wrap:anywhere}
#cocuyoChat button:focus-visible{outline:2px solid var(--studio-accent);outline-offset:3px}
#cocuyoEnergy:hover{border-color:var(--studio-accent);background:var(--surface2)}
[data-cocuyo-mobile-energy]{font:600 9px/1.2 var(--font);color:var(--studio-accent);font-variant-numeric:tabular-nums}
.sm-create[data-low=true] [data-cocuyo-mobile-energy]{color:var(--danger,#ff9b8f)}
.sm-nav .sm-create:has([data-cocuyo-mobile-energy]:not([hidden])){gap:2px}
@media(max-width:600px){#cocuyoChat{width:calc(100vw - 16px);max-height:calc(100dvh - 20px);border-radius:20px}#cocuyoChat #cocuyoComposer{padding:26px 18px 20px}#cocuyoChat #cocuyoComposer h2{font-size:26px}.cocuyo-pilot-actions{gap:10px}}
@media(prefers-reduced-motion:no-preference){#cocuyoChat[open]{animation:cocuyo-chat-in .18s ease-out}@keyframes cocuyo-chat-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}}


/* cocuyo-css: assets/css/estudio-cabecera-movil.css */
/* Móvil: Cocuyo y los tres editores comparten una sola fila. */
@media (max-width: 900px) {
 body.studio-workbench,
 body.studio-workbench.studio-simple {
  --st-top: calc(64px + env(safe-area-inset-top, 0px));
  --sm-top: var(--st-top);
 }
 body.studio-workbench header.studio-public-nav {
  --cn-top: var(--st-top);
  box-sizing: border-box;
  height: var(--st-top);
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding: env(safe-area-inset-top, 0px) 14px 0;
 }
 body.studio-workbench .studio-public-nav .st-brand-slot { flex: none; }
 body.studio-workbench .studio-public-nav .brand .wordmark { font-size: 20px; }
 body.studio-workbench .studio-public-nav .cocuyologo { display: none; }
 body.studio-workbench .studio-public-nav .st-nav {
  display: flex;
  flex: 1;
  min-width: 0;
  width: auto;
  height: 100%;
  gap: 2px;
  justify-content: space-between;
 }
 /* Comunidad (comunidad-nav.js) no cabe en la fila: caía a una segunda línea
    recortada bajo Imagen. En móvil se llega desde el ☰ de la portada. */
 body.studio-workbench .studio-public-nav .cn-community-entry { display: none; }
 body.studio-workbench .studio-public-nav .st-nav-group { flex: 1; min-width: 0; justify-content: center; }
 body.studio-workbench .studio-public-nav .st-nav-group > a { display: flex; align-items: center; min-height: 44px; padding: 12px 2px; font-size: 12px; }
 body.studio-workbench .studio-public-nav .st-nav-group > button { flex: none; width: 22px; min-height: 44px; padding: 4px; }
 body.studio-workbench .studio-public-nav .st-actions:not(:has(.st-language:not([hidden]))),
 body.studio-workbench.studio-simple[data-studio-page="explore"] .st-actions:has(#cocuyoEnergy:not([hidden])),
 body.studio-workbench #cocuyoEnergy { display: none !important; }
 /* Invitados pueden cambiar idioma sin abrir la entrada de Cuenta. */
 body.studio-workbench .studio-public-nav .st-actions:has(.st-language:not([hidden])) {
  display: flex !important;
  position: static;
  flex: none;
  /* Ancho según el contenido: en tableta el selector muestra «🌐 ES» (75 px)
     y con 44 px fijos se salía por la derecha. */
  width: auto;
  min-width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  gap: 0;
  border: 0;
  background: transparent;
 }
 body.studio-workbench .studio-public-nav .st-actions > :not(.st-language) { display: none !important; }
 body.studio-workbench .studio-public-nav .st-language:not([hidden]) { display: flex; }
 /* Ocultar el contador también elimina la franja y su espacio reservado. */
 body.studio-workbench.studio-simple[data-studio-page="explore"]:has(#cocuyoEnergy:not([hidden])) #pg-explore { padding-top: 0; }
 body.studio-workbench .studio-public-nav .st-model-panel {
  max-height: calc(100dvh - var(--st-top) - var(--sm-bottom, 76px) - env(safe-area-inset-bottom, 0px) - 10px);
 }
}
@media (max-width: 370px) {
 body.studio-workbench header.studio-public-nav { gap: 6px; padding-inline: 10px; }
 body.studio-workbench .studio-public-nav .brand .wordmark { font-size: 18px; }
 body.studio-workbench.studio-simple .studio-public-nav .st-nav-group > a { padding-inline: 1px; }
 body.studio-workbench .studio-public-nav .st-nav-group > button { width: 18px; padding: 2px; }
}
/* La experiencia nueva se carga después: conservar también su zona segura. */
@media(max-width:900px){
 html[data-experiencia="nueva"] body.studio-workbench.studio-simple:not(.experiencia-facil){--st-top:calc(64px + env(safe-area-inset-top,0px));--sm-top:var(--st-top)}
 html[data-experiencia="nueva"] body.studio-workbench.studio-simple header.studio-public-nav{--st-top:inherit;height:var(--st-top);grid-template-rows:64px}
}


/* cocuyo-css: assets/css/estudio-video-layout.css */
/* Video: una superficie de creación, controles alineados y acción al pie.
   Referencia visual: editor Video de Higgsfield. Se conservan los nodos,
   eventos y límites reales; sólo cambia la distribución del compositor. */
.studio-param-copy{display:contents}
.studio-param-label{display:none}
body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar{
 display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;position:static;align-items:stretch;margin:0;padding:0;border:0;background:none;
}
body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar>.lbl,
body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar>.cost{display:none}
body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar>div{min-width:0}
body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar .param{
 display:flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:44px;height:auto;gap:6px;margin:0;padding:10px 8px;border:1px solid var(--border);border-radius:10px;background:var(--surface2);font:550 13px/1.35 var(--font);color:var(--text);box-shadow:none;
}
body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar>.param[data-pop="model"]{
 grid-column:1/-1;justify-content:flex-start;min-height:52px;padding:12px;gap:10px;border-color:var(--border2);background:var(--bg);font-size:14px;font-weight:600;
}
body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar>.param[data-pop="model"]::before{display:none}
body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar .param .car{margin-left:auto}
body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar .param:is(:hover,:focus-visible,.open){background:var(--surface3);border-color:var(--studio-accent)}
body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar>.param[data-pop="model"]>span:not(.car):not(.tile):not(.mrcbox){white-space:normal;overflow-wrap:anywhere;text-align:left}
body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #omniLimits{grid-column:1/-1}

/* 10-oct-2026 (dueño: «para crear video: eso estaba bien a la izquierda, lo
   pusiste abajo, se ve mal»): el panel de crear video va a la izquierda en
   cualquier ventana de ordenador (desde 1001 px de ancho), también si es baja
   (portátil con zoom, panel del navegador, barras abiertas). Antes, por debajo
   de 600 px de alto el compositor caía debajo del lienzo y casi fuera de la
   pantalla; ahora el panel se compacta y su contenido se desplaza dentro. */
@media(min-width:1001px){
 body.studio-workbench.studio-simple[data-studio-mode="video"][data-studio-page="home"]:not(.experiencia-facil){--video-pane:clamp(320px,29vw,370px);height:100dvh;overflow:hidden}
 body.studio-workbench.studio-simple[data-studio-mode="video"][data-studio-page="home"]:not(.experiencia-facil) .app{height:100dvh;min-height:0}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil) #pg-home>.studio-wrap{max-width:none;margin:0;padding:0;height:calc(100dvh - var(--st-top));box-sizing:border-box}
 /* Sin cabecera visible, pero el h1 «Estudio de video» sigue para lectores de pantalla (único h1 de la vista). */
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil) .studio-workhead{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil) .studio-workhead button{display:none}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil) #studioWorkspace{display:grid;grid-template-columns:var(--video-pane,350px) minmax(0,1fr);gap:0;height:calc(100dvh - var(--st-top));min-height:0}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil) #studioEditor{height:100%;min-height:0;position:relative;top:0;margin:0;scroll-margin:0}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa{position:static;inset:auto;display:block;width:100%;height:100%;padding:0;pointer-events:auto;z-index:50}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa .mesa-in{
  display:flex;flex-direction:column;gap:0;width:100%;height:100%;max-height:none;min-height:0;padding:20px 18px 18px;border:0;border-right:1px solid var(--border);border-radius:0;overflow:hidden;box-shadow:none;box-sizing:border-box;background:var(--surface);
 }
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa .studio-editor-head{display:flex;align-items:center;flex:none;min-height:24px;margin:0 0 16px;padding:0;border:0}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa .studio-editor-head>span:first-child{font:600 16px/1.3 var(--font);letter-spacing:-.02em;color:var(--text)}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa :is(.studio-editor-badge,.mesa-top){display:none}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #studioVideoModel{flex:none;margin:0 0 16px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #studioVideoModel .param{display:flex;align-items:center;gap:11px;width:100%;min-height:56px;padding:12px;border:1px solid var(--border2);border-radius:12px;background:var(--bg);color:var(--text);font:600 15px/1.35 var(--font);text-align:left;box-shadow:none}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #studioVideoModel .param>span:not(.tile):not(.mrcbox):not(.car){min-width:0;overflow-wrap:anywhere}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #studioVideoModel :is(.tile,.mrcbox){flex:0 0 28px;width:28px;height:28px;border-radius:8px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #studioVideoModel .car{margin-left:auto;flex:none}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #studioVideoModel .param:is(:hover,:focus-visible){border-color:var(--studio-accent);background:var(--surface2)}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa .composer{display:flex;flex-direction:column;flex:1;gap:12px;min-height:0;padding:0 4px 0 0;margin-right:-4px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--border2) transparent}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray{order:1;flex:none;min-height:0;max-height:none;overflow:visible;margin:0}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #attrow{max-height:none}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #ta{order:2;flex:1 1 160px;min-height:112px;max-height:240px;height:auto;margin:0;padding:14px;border:1px solid var(--border2)!important;border-radius:12px;background:var(--bg)!important;font-size:15px;line-height:1.6;overflow:auto}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #ta:focus-visible{outline:2px solid var(--studio-accent);outline-offset:-2px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #promptLimit{order:3;flex:none;margin:-5px 0 0;padding:0 2px;border:0;background:none;font-size:11px;line-height:1.45}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar{order:4;flex:none}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #refQuoteStatus{order:5;flex:none;margin:0;padding:9px;font-size:11px;line-height:1.4}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar .param:not([data-pop="model"]){position:relative;justify-content:flex-start;min-height:58px;padding:9px 10px;gap:0}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar .param:not([data-pop="model"])>.ic{display:none}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar .studio-param-copy{display:flex;flex-direction:column;gap:5px;min-width:0;width:100%;text-align:left}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar .studio-param-label{display:block;font:450 11px/1.3 var(--font);color:var(--muted2);white-space:nowrap}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar .studio-param-value{padding-right:16px;font:550 13px/1.3 var(--font);font-variant-numeric:tabular-nums;color:var(--text)}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar .param:not([data-pop="model"])>.car{position:absolute;right:10px;bottom:11px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar>span:not(.lbl):not(.cost){grid-column:1/-1}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #headicons{order:initial;flex:none;position:static;inset:auto;display:flex;width:100%;margin:0;padding:16px 0 0;border:0;background:var(--surface)}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #headicons .roundbtn{width:100%;min-height:48px;margin:0;padding:12px 14px;font-size:14px;border-radius:11px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil) #studioResults{min-width:0;width:100%;height:100%;max-height:100%;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scroll-margin:0;border:0;border-radius:0;padding:24px;box-sizing:border-box}
}
@media(min-width:1001px) and (max-height:760px){
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa .mesa-in{padding:14px 16px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa .studio-editor-head{margin-bottom:10px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa .composer{gap:9px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #studioVideoModel{margin-bottom:12px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #studioVideoModel .param{min-height:52px;padding:10px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #ta{min-height:96px;max-height:160px;flex-basis:140px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #headicons{padding-top:12px}
}
@media(min-width:1001px) and (max-height:599px){
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa .mesa-in{padding:10px 14px 12px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa .studio-editor-head{min-height:20px;margin-bottom:6px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa .composer{gap:8px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #studioVideoModel{margin-bottom:8px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #studioVideoModel .param{min-height:44px;padding:8px 10px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #ta{min-height:72px;max-height:120px;flex-basis:96px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar .param:not([data-pop="model"]){min-height:48px;padding-block:7px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #headicons{padding-top:8px}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #headicons .roundbtn{min-height:44px;padding-block:10px}
}
@media(max-width:1000px){
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa .composer{min-height:0}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar{gap:7px;padding:9px 0 0}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #parambar>.param[data-pop="model"]{margin:0;min-height:50px;border:1px solid var(--border2);border-radius:11px;justify-content:flex-start}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #promptLimit{background:none;border:0;padding:5px 2px 0;font-size:10px;line-height:1.5}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #ta{min-height:130px;max-height:220px;margin:0;padding:13px;border:1px solid var(--border2)!important;border-radius:12px;font-size:14px;line-height:1.6}
 body.studio-workbench.studio-simple[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #headicons{position:static;inset:auto;margin:0;padding:12px 0}
}


/* cocuyo-css: assets/css/estudio-video-operaciones.css */
/* Selector nativo compacto; el compositor y sus acciones conservan su lugar. */
#studioVideoOperations[hidden]{display:none!important}
#studioVideoOperations{flex:none;min-width:0;margin:0 0 12px}
#mesa .param[data-video-operation] .car[hidden]{display:none!important}
.video-operation-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;padding:3px;border:1px solid var(--border);border-radius:10px;background:var(--bg)}
.video-operation-tabs.video-operation-return{grid-template-columns:1fr}
.video-operation-tabs button{min-width:0;min-height:44px;padding:7px 2px;border:0;border-radius:7px;background:transparent;color:var(--muted);font:550 11px/1.2 var(--font);cursor:pointer;transition:background .16s,color .16s;overflow-wrap:anywhere}
.video-operation-tabs button[aria-pressed=true]{background:var(--surface3);color:var(--text);box-shadow:0 1px 4px #0003}
.video-operation-tabs button:hover:not(:disabled){color:var(--studio-accent)}
.video-operation-tabs button:disabled{opacity:.5;cursor:not-allowed}
.video-operation-tabs button:focus-visible{outline:2px solid var(--studio-accent);outline-offset:1px}
.video-operation-hint{margin:8px 2px 0;color:var(--muted2);font:400 11px/1.55 var(--font)}
@media(prefers-reduced-motion:reduce){.video-operation-tabs button{transition:none}}


/* cocuyo-css: assets/css/estudio-video-movimiento.css */
/* Controles propios de Movimiento, sin parámetros que el proveedor no admite. */
body[data-video-operation="motion"] #studioVideoModel,
body[data-video-operation="motion"] #parambar [data-pop="model"]{display:none!important}
.video-operation-beta{display:inline-block;margin-right:6px;padding:1px 5px;border:1px solid var(--border);border-radius:4px;color:var(--muted2);font:600 9px/1.5 var(--font);vertical-align:1px}
.video-motion-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:10px 0 0;min-width:0}
.video-motion-fields label{display:flex;flex-direction:column;gap:5px;min-width:0;color:var(--muted2);font:500 11px/1.3 var(--font)}
.video-motion-fields select{width:100%;min-width:0;min-height:44px;padding:7px 8px;border:1px solid var(--border);border-radius:7px;background:var(--surface);color:var(--text);font:500 12px/1.3 var(--font)}
.video-motion-fields select:focus-visible,.video-motion-fields input:focus-visible{outline:2px solid var(--studio-accent);outline-offset:2px}
.video-motion-fields .video-motion-sound{grid-column:1/-1;flex-direction:row;align-items:center;gap:9px;min-height:44px;cursor:pointer;color:var(--text)}
.video-motion-sound input{width:16px;height:16px;margin:0;flex:none;accent-color:var(--studio-accent)}
.video-motion-sound span{overflow-wrap:anywhere}


/* cocuyo-css: assets/css/estudio-referencias-acabado.css */
/* Acabado de las referencias: mismos controles, permisos y límites.
   Superficies discretas, miniaturas claras y acciones visibles con teclado. */
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray{
 --ref-size:74px;gap:10px;align-items:center;scrollbar-color:var(--border2) transparent;
}
body.studio-workbench[data-studio-mode="image"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray{--ref-size:64px}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray #attrow{
 box-sizing:border-box;gap:10px!important;min-width:0;align-items:center;scrollbar-color:var(--border2) transparent;scrollbar-width:thin;
}
body.studio-workbench[data-studio-mode="image"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #attrow{
 flex-wrap:nowrap!important;max-width:calc(100% - 74px);padding:4px 2px!important;scroll-padding-inline:3px;
}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip{
 box-sizing:border-box;flex:0 0 var(--ref-size);width:var(--ref-size);height:var(--ref-size);border:1px solid var(--border2);border-radius:12px;background:var(--surface2);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent);isolation:isolate;
}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip:focus-within{
 border-color:var(--studio-accent);box-shadow:inset 0 0 0 1px var(--studio-accent);
}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip :is(img,video){
 display:block;width:100%;height:100%;object-fit:cover;
}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip .x{
 /* 9-oct-2026: X de 20 px (toque de 24) en la esquina, a la vista al pasar el
    ratón o con el foco dentro; el centro queda libre para ver y arrastrar. */
 display:grid;place-items:center;position:absolute;top:0;right:0;z-index:5;box-sizing:border-box;width:24px;height:24px;padding:2px;opacity:0;border:0;border-radius:50%;background:color-mix(in srgb,var(--negro-abismo,#050505) 80%,transparent);background-clip:content-box;color:var(--text);box-shadow:none;cursor:pointer;transition:opacity .12s ease,background-color .12s ease;
}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip:is(:hover,:focus-within) .x{opacity:1}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip .x:is(:hover,:focus-visible){
 background-color:var(--peligro,#b91c1c);color:var(--blanco-luz);
}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip .x svg{width:12px;height:12px;stroke-width:2}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip .attver{
 background:color-mix(in srgb,var(--bg) 12%,transparent);color:var(--blanco-luz);pointer-events:none;
}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip .attver:is(:hover,:focus-visible){
 opacity:1;background:color-mix(in srgb,var(--bg) 32%,transparent);
}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip .attver:focus-visible{outline-offset:-3px}
/* Número de orden pequeño abajo a la izquierda; un clic abre la vista previa y,
   con dos o más, la miniatura se arrastra (estudio-referencias-orden.js). */
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip .att-num{
 position:absolute;left:3px;bottom:3px;z-index:3;box-sizing:border-box;min-width:16px;height:16px;padding:0 4px;border-radius:5px;background:color-mix(in srgb,var(--negro-abismo,#050505) 78%,transparent);color:var(--blanco-luz,#f5f5f5);font:650 10px/16px var(--font);font-variant-numeric:tabular-nums;text-align:center;pointer-events:none;
}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray .attchip:has(.attrol) .att-num{bottom:calc(24px + 3px)}
/* 9-oct-2026: con «No admitida» abajo, el número sube (no se tapan); en una
   subida, junto a su anillo. */
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip.sobra .att-num{top:3px;bottom:auto}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip.up .att-num{top:auto;bottom:3px}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip:not(.up){cursor:zoom-in;touch-action:pan-x}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip.ref-orden-movible{cursor:grab}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip :is(img,video){-webkit-user-drag:none;user-select:none}
/* En Video, el icono de ampliar de una imagen sale al pasar el ratón, como en Imagen (el de reproducir de un video sigue a la vista). */
@media(hover:hover){
 body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray .attchip[data-kind="image"] .attver{opacity:0}
 body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray .attchip[data-kind="image"]:is(:hover,:focus-within) .attver{opacity:1}
}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray .attchip:has(.attrol){height:calc(var(--ref-size) + 24px)}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray .attchip:has(.attrol) :is(img,video){height:var(--ref-size)}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray .attrol{
 appearance:auto;min-height:25px;height:25px;padding:3px 5px 3px 8px;background:var(--surface2);color:var(--text);border-top:1px solid var(--border2);font:500 11px/1.3 var(--font);text-align:left;
}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray .attchip[data-kind="video"] .attver svg{
 box-sizing:border-box;width:32px;height:32px;padding:7px;border:1px solid color-mix(in srgb,var(--text) 24%,transparent);border-radius:50%;background:color-mix(in srgb,var(--bg) 78%,transparent);filter:none;
}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray .attchip[data-kind="audio"]{
 flex-basis:160px;width:160px;height:76px;padding:11px 34px 10px 11px;background:linear-gradient(135deg,var(--surface3),var(--surface2));
}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray .att-media-name{margin-top:7px;font-size:11px;font-weight:500;line-height:1.3;color:var(--text)}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray .att-duration{bottom:5px;right:5px;padding:3px 5px;border:1px solid var(--border);border-radius:5px;color:var(--text);font-size:10px}

/* Imagen: el siguiente adjunto se añade junto a las miniaturas, en un solo botón. */
body.studio-workbench[data-studio-mode="image"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #imageRefControls{flex:0 0 var(--ref-size);width:var(--ref-size)}
body.studio-workbench[data-studio-mode="image"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #addImageRefs{
 width:var(--ref-size);height:var(--ref-size);min-height:var(--ref-size);border:1px dashed var(--border2);border-radius:12px;background:var(--surface2);color:var(--text);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent);
}
body.studio-workbench[data-studio-mode="image"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #imageRefIcons{
 display:grid;place-items:center;width:32px;height:32px;border:1px solid var(--border2);border-radius:50%;background:var(--surface3);color:var(--text);
}
body.studio-workbench[data-studio-mode="image"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #imageRefIcons svg{width:19px;height:19px;stroke-width:1.7}
body.studio-workbench[data-studio-mode="image"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #addImageRefs:disabled{opacity:.5;cursor:not-allowed}

/* Video: todos los tipos que admite el modelo permanecen a la vista. */
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #refgrid{
 flex:1 0 100%;width:100%;max-width:100%;flex-wrap:wrap;gap:8px;margin:0;padding:0;border:0;border-radius:0;background:none;overflow:visible;
}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #refgrid .refwrap-compact{flex:1 1 72px;min-width:0}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #refgrid .ref-add-compact{
 display:flex;position:relative;flex-direction:column;justify-content:center;align-items:center;gap:7px;width:100%;min-height:84px;height:84px;padding:10px 7px;border:1px solid var(--border2);border-radius:12px;background:var(--surface2);color:var(--text);font:500 11px/1.3 var(--font);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent);
}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #refgrid .ref-orb{
 display:grid;place-items:center;box-sizing:border-box;width:30px;height:30px;margin:0;border:1px solid var(--border2);border-radius:50%;background:var(--surface3);color:var(--muted2);transform:none;box-shadow:none;
}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #refgrid .ref-orb svg{width:17px;height:17px;stroke-width:1.6}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray #refgrid .ref-add-count{
 position:absolute;top:7px;right:8px;color:var(--muted2);font:500 10px/1.2 var(--font);font-variant-numeric:tabular-nums;
}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray:has(.attchip) #refgrid{
 flex:0 1 auto;width:auto;
}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray:has(.attchip) #refgrid .refwrap-compact{flex:0 1 auto}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray:has(.attchip) #refgrid .ref-add-compact{
 flex-direction:row;gap:6px;width:auto;height:44px;min-height:44px;padding:8px;border-radius:10px;
}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray:has(.attchip) #refgrid .ref-orb{width:24px;height:24px;border:0;background:none}
body.studio-workbench[data-studio-mode="video"]:not(.experiencia-facil):not(.modo-audio) #mesa #imageReferenceTray:has(.attchip) #refgrid .ref-add-count{position:static;color:var(--studio-accent)}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray :is(#addImageRefs,.ref-add-compact):is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled){
 border-color:var(--studio-accent);background:var(--studio-active);color:var(--text);
}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray :is(button,select):focus-visible{
 outline:2px solid var(--studio-accent);outline-offset:-3px;
}

/* Los menús mantienen su posicionamiento y top layer originales. */
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .refpop{
 padding:14px;border-color:var(--border2);border-radius:14px;background:var(--surface);box-shadow:var(--sombra-3);
}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .refpop .ref-pop-title{padding:2px 2px 10px;font-size:13px;line-height:1.4;letter-spacing:-.01em}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .refpop .ref-pop-hint{margin:0 2px 12px;color:var(--muted2);font-size:12px;line-height:1.55;text-align:left}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .refpop button{gap:10px;min-height:44px;border:1px solid transparent;border-radius:9px;font-size:12px;line-height:1.4}
body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .refpop button:is(:hover,:focus-visible):not(:disabled){border-color:var(--border2);background:var(--surface3);color:var(--text)}
@media(hover:none){
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip .x{opacity:1}
}
@media(hover:none),(pointer:coarse){
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray .attchip .attver{opacity:1;background:transparent}
}
@media(prefers-reduced-motion:no-preference){
 body.studio-workbench:not(.experiencia-facil):not(.modo-audio):is([data-studio-mode="image"],[data-studio-mode="video"]) #mesa #imageReferenceTray :is(.attchip,.x,#addImageRefs,.ref-add-compact){transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,opacity .12s ease}
}
/* Sólo éxitos de adjuntos: estado de 3 s bajo la cabecera, lejos de Generar. */
.studio-reference-status{position:fixed;top:calc(var(--st-top,64px) + env(safe-area-inset-top,0px) + 12px);right:20px;z-index:70;box-sizing:border-box;max-width:calc(100vw - 32px);pointer-events:none;color:var(--text);font:500 12px/1.45 var(--font);overflow-wrap:anywhere}
.studio-reference-status:not(:empty){padding:10px 14px;border:1px solid var(--border2);border-radius:12px;background:var(--surface2);box-shadow:var(--sombra-3)}
@media(max-width:600px){.studio-reference-status{right:16px}}
/* Elección explícita de Google: mantiene pequeños los controles de adjuntos. */
#mesa #refgrid .ref-mode-switch{display:flex;flex:1 0 100%;gap:4px;padding:3px;border:1px solid var(--border2);border-radius:10px;background:var(--surface2)}
#mesa #refgrid .ref-mode-switch button{flex:1;min-width:0;min-height:34px;padding:7px 10px;border:1px solid transparent;border-radius:7px;background:none;color:var(--muted2);font:500 12px/1.25 var(--font);cursor:pointer}
#mesa #refgrid .ref-mode-switch button[aria-pressed="true"]{border-color:var(--border2);background:var(--surface3);color:var(--text)}
#mesa #refgrid .ref-mode-hint{flex:1 0 100%;margin:0;color:var(--muted2);font:400 11px/1.5 var(--font)}
@media(max-width:900px){
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageReferenceTray #imageRefControls{flex:0 0 44px;width:44px}
 body.studio-workbench.studio-simple.modo-imagen:not(.experiencia-facil):not(.modo-audio)[data-studio-mode="image"] #mesa #imageReferenceTray #addImageRefs{width:44px;height:44px;min-height:44px;border-radius:11px}
}


/* cocuyo-css: assets/css/estudio-sesiones.css */
/* Biblioteca flotante de sesiones; mismo control en escritorio y móvil. */
#studioSessionPanel.cs-library{box-sizing:border-box;position:fixed;inset:auto;margin:0;display:flex;flex-direction:column;padding:0;overflow:hidden;width:410px;border:1px solid var(--escarcha-borde);border-radius:16px;background:var(--negro-elevado);color:var(--blanco-luz);box-shadow:var(--sombra-3);font:13px/1.4 var(--fuente);z-index:240}
#studioSessionPanel.cs-library[hidden]{display:none!important}
#studioSessionPanel.cs-library .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
#studioSessionPanel.cs-library .cs-search input{border:0!important;box-shadow:none!important;outline:none!important;background:transparent}
#studioSessionPanel.cs-library .cs-search:focus-within{border-color:var(--verde-cocuyo);box-shadow:0 0 0 1px var(--verde-cocuyo)}
.cs-library *{box-sizing:border-box}.cs-library button,.cs-library input,.cs-library select{font:inherit;color:inherit}.cs-library button{cursor:pointer}.cs-library svg{width:18px;height:18px;flex:none}.cs-library button:disabled{opacity:.45;cursor:wait}.cs-library :is(button,input,select):focus-visible{outline:2px solid var(--verde-cocuyo);outline-offset:2px}
.cs-heading{display:flex;align-items:center;justify-content:space-between;padding:13px 16px 7px;flex:none}.cs-heading strong{font-size:16px;font-weight:600;letter-spacing:-.025em}.cs-heading button{display:grid;place-items:center;width:36px;height:36px;border:0;background:transparent;border-radius:8px;color:var(--gris-humo)}
.cs-library-links{display:flex;gap:8px;padding:4px 14px 14px;border-bottom:1px solid var(--negro-borde);flex:none}.cs-library-links button{display:flex;align-items:center;gap:8px;min-height:42px;border:1px solid var(--negro-borde);background:transparent;border-radius:9px;padding:8px 10px;font-size:12px}.cs-library-links button:first-child{flex:1}.cs-library-links svg{color:var(--verde-cocuyo);width:17px;height:17px}.cs-library-links button:hover{background:var(--negro-abismo)}
.cs-session-title{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 16px 9px;flex:none}.cs-session-title h2{margin:0;font-size:13px;font-weight:600}.cs-session-title select{font-size:11px;padding:6px 3px;background:var(--negro-elevado);border:0;color:var(--gris-humo);max-width:150px}.cs-search{display:flex;gap:9px;align-items:center;padding:0 11px;margin:0 14px 10px;min-height:40px;border:1px solid var(--negro-borde);border-radius:9px;flex:none;color:var(--gris-humo)}.cs-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;min-height:38px;font-size:12px}.cs-search:focus-within{border-color:var(--verde-cocuyo)}
.cs-filters{display:flex;gap:5px;padding:0 14px 11px;flex:none}.cs-filters button{flex:1;min-height:34px;padding:6px 9px;background:transparent;border:1px solid transparent;border-radius:7px;color:var(--gris-humo);font-size:11px}.cs-filters button[aria-pressed=true]{background:color-mix(in srgb,var(--verde-cocuyo) 10%,transparent);color:var(--verde-cocuyo);border-color:color-mix(in srgb,var(--verde-cocuyo) 16%,transparent)}
#sessions.cs-session-list{flex:1;min-height:0;max-height:340px;overflow:auto;overscroll-behavior:contain;padding:0 8px 8px;margin:0;scrollbar-width:thin;display:block}.cs-session-list h3{padding:6px 8px;margin:0;color:var(--gris-humo);font-size:10px;font-weight:500;letter-spacing:.04em}.cs-session{display:flex;align-items:center;gap:2px;border:1px solid transparent;border-radius:10px;padding:1px;margin:2px 0}.cs-session.is-current{background:color-mix(in srgb,var(--verde-cocuyo) 5%,transparent);border-color:color-mix(in srgb,var(--verde-cocuyo) 12%,transparent)}.cs-session:hover{background:var(--negro-abismo)}
.cs-session-open{display:flex;align-items:center;gap:10px;min-width:0;flex:1;min-height:55px;border:0;background:transparent;padding:8px;text-align:left;border-radius:8px}.cs-folder{display:grid;place-items:center;flex:none;width:29px;height:29px;border-radius:7px;background:var(--negro-abismo);color:var(--gris-humo)}.is-current .cs-folder{color:var(--verde-cocuyo)}.cs-session-open>span:nth-child(2){display:grid;gap:3px;min-width:0;flex:1}.cs-session-open b{font-size:12px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cs-session-open small{font-size:10px;color:var(--gris-humo)}.cs-kinds{display:flex;align-items:center;gap:3px}.cs-kinds svg{width:12px;height:12px;color:var(--gris-humo)}.cs-session-actions{display:flex;gap:1px;padding-right:4px}.cs-session-actions button{display:grid;place-items:center;width:30px;min-height:38px;background:transparent;border:0;border-radius:6px;color:var(--gris-humo)}.cs-session-actions svg{width:14px;height:14px}.cs-session-actions button:hover,.cs-session-actions button[aria-pressed=true]{color:var(--verde-cocuyo);background:color-mix(in srgb,var(--verde-cocuyo) 6%,transparent)}
.cs-rename{display:grid;gap:8px;padding:10px;border:1px solid var(--verde-cocuyo);border-radius:9px;margin:3px 0}.cs-rename input{min-width:0;width:100%;background:var(--negro-abismo);border:1px solid var(--negro-borde);border-radius:6px;padding:9px}.cs-rename>div{display:flex;gap:8px;justify-content:flex-end}.cs-rename button{min-height:34px;padding:6px 11px;background:transparent;border:1px solid var(--negro-borde);border-radius:7px;font-size:11px}.cs-rename button[type=submit]{background:var(--verde-cocuyo);color:var(--tinta-sobre-verde);border-color:var(--verde-cocuyo)}
.cs-empty,.cs-error{margin:0;padding:13px 16px;font-size:12px;color:var(--gris-humo);flex:none}.cs-error{color:var(--peligro)}.cs-empty[hidden],.cs-error[hidden]{display:none}.cs-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;border-top:1px solid var(--negro-borde);flex:none}.cs-footer button{display:flex;align-items:center;gap:8px;min-height:39px;padding:8px 12px;border:1px solid var(--negro-borde);background:var(--negro-abismo);border-radius:8px;font-size:12px}.cs-footer button:first-child{color:var(--verde-cocuyo)}.cs-footer .cs-retry{background:transparent;border:0;font-size:11px;color:var(--gris-humo)}
@media(max-width:600px){#studioSessionPanel.cs-library{border-radius:13px}.cs-session-actions button{min-width:34px;min-height:44px}.cs-session-open{min-height:59px;gap:7px}.cs-kinds{display:none}.cs-session-open b{font-size:13px}.cs-library-links button{min-height:44px}.cs-filters button{min-height:39px}.cs-rename button{min-height:40px}}
.cs-library .cs-storage{flex:none;min-height:0;padding:0 16px 10px;color:var(--gris-humo);font-size:10px}.cs-library .cs-storage:empty{display:none}
@media(max-width:900px){
 #studioSessionPanel.cs-library{border-radius:20px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
 #studioSessionPanel.cs-library .cs-heading{padding:12px 16px 8px}
 #studioSessionPanel.cs-library .cs-heading button{width:44px;height:44px}
 #studioSessionPanel.cs-library .cs-search{min-height:46px}
 #studioSessionPanel.cs-library .cs-search input{font-size:16px;min-height:44px}
 #studioSessionPanel.cs-library .cs-session-title select{font-size:16px;min-height:44px;max-width:160px}
 #studioSessionPanel.cs-library .cs-filters button{min-height:44px;font-size:12px}
 #studioSessionPanel.cs-library #sessions.cs-session-list{flex:1 0 auto;max-height:280px}
 #studioSessionPanel.cs-library .cs-session-actions button{width:44px;min-width:44px;min-height:44px}
 #studioSessionPanel.cs-library .cs-rename input{font-size:16px;min-height:44px}
 #studioSessionPanel.cs-library :is(.cs-footer button,.cs-rename button){min-height:44px}
}


/* cocuyo-css: assets/css/estudio-biblioteca.css */
/* Biblioteca: separar lo generado de los archivos de referencia propios. */
.studio-assets-sources{display:flex;gap:6px;margin:8px 0 22px;padding:5px;width:max-content;max-width:100%;border:1px solid #292c27;border-radius:14px;background:#10120f}
.studio-assets-sources button{display:flex;align-items:center;justify-content:center;gap:9px;min-height:42px;padding:10px 18px;border:0;border-radius:10px;background:transparent;color:#aeb4a7;font:550 14px var(--font,sans-serif);cursor:pointer;transition:background .16s,color .16s}
.studio-assets-sources button.on{background:#28331f;color:#d6fca8}
.studio-assets-sources button:hover{color:#eff5e8;background:#20251b}
.studio-assets-sources button:focus-visible{outline:2px solid var(--studio-accent,#aff33e);outline-offset:2px}
.studio-assets-sources button span{font-size:11px;font-variant-numeric:tabular-nums;opacity:.72;min-width:16px}
.studio-assets-sources .ic{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
body.studio-simple .st-actions>.studio-session-switch{margin:0;position:relative}
body.studio-simple .st-actions #studioSessionToggle{padding:0;min-width:42px;width:42px;height:42px;min-height:42px;display:grid;place-items:center}
body.studio-simple .st-actions #studioSessionToggle>.ic{width:20px;height:20px;color:inherit}
body.studio-simple .st-actions #studioSessionToggle[aria-expanded=true]{border-color:#779749;color:#cbf996;background:#20291a}
.studio-assets-storage{font-size:12px;line-height:1.5;color:#a4ad9b;margin-top:12px}
@media(min-width:1001px){#fselbar.fsel-video-side{left:calc(var(--video-pane,370px) + 20px);right:20px;margin-inline:auto;max-width:calc(100vw - var(--video-pane,370px) - 40px);bottom:16px!important}}
@media(max-width:600px){.studio-assets-sources{width:100%;margin:8px 0 16px}.studio-assets-sources button{flex:1;padding:10px 12px}.studio-assets-actions{gap:8px}.studio-assets-heading p{font-size:13px;line-height:1.5}}
@media(prefers-reduced-motion:reduce){.studio-assets-sources button{transition:none}}

/* Pantallas táctiles: controles de Creaciones con objetivo de 44 px. Las
   casillas de selección conservan su tamaño visible y amplían sólo la zona
   de toque con un pseudo-elemento transparente. */
@media(pointer:coarse){
 #pg-library :is(.studio-assets-sources button,.bv-accion,.bv-busca,.bv-chip,.bv-sel){min-height:44px}
 .bv-tar .fsel::after{content:"";position:absolute;inset:-9px}
 .bv-dia .fsel-dia{position:relative}
 .bv-dia .fsel-dia::after{content:"";position:absolute;inset:-11px}
}


/* cocuyo-css: assets/css/estudio-compartir.css */
/* Sólo el diálogo de compartir. No modifica posiciones del Estudio. */
.cshare-dialog{box-sizing:border-box;width:min(440px,calc(100vw - 24px));max-height:calc(100dvh - 32px);margin:auto;padding:24px;border:1px solid #30352d;border-radius:22px;background:#131610;color:#f1f4ec;font:400 14px/1.55 var(--font,sans-serif);box-shadow:0 24px 90px #0009;overflow:auto}
.cshare-dialog::backdrop{background:#000a;backdrop-filter:blur(5px)}
.cshare-dialog header{display:flex;align-items:center;gap:16px;justify-content:space-between}
.cshare-dialog h2{margin:0;font-size:22px;line-height:1.25;font-weight:650;letter-spacing:-.025em}
.cshare-dialog p{margin:14px 0;color:#b8c0af}
.cshare-dialog button{box-sizing:border-box;min-height:44px;border:1px solid #3b4433;border-radius:12px;background:#20261b;color:#edf4e5;font:600 14px var(--font,sans-serif);padding:10px 15px;cursor:pointer}
.cshare-dialog [data-share-close]{flex:0 0 44px;padding:0;font-size:26px;line-height:1;border:0;background:transparent;color:#cbd2c4}
.cshare-dialog button:hover{background:#303a26;color:#fff}
.cshare-dialog button:focus-visible{outline:2px solid #aff33e;outline-offset:3px}
.cshare-dialog .cshare-primary{width:100%;background:#aff33e;color:#142004;border-color:#aff33e}
.cshare-dialog .cshare-primary:hover{background:#bdfa63}
.cshare-dialog button:disabled{opacity:.55;cursor:wait}
.cshare-dialog .cshare-status{font-size:13px;min-height:40px}
.cshare-dialog .cshare-fallback{display:grid;gap:10px}
.cshare-dialog .cshare-fallback small{color:#aeb9a2;line-height:1.55}
.cshare-dialog [hidden]{display:none!important}
@media(max-width:420px){.cshare-dialog{padding:20px}.cshare-dialog h2{font-size:20px}}


/* cocuyo-css: assets/css/estudio-ediciones.css */
/* Edición beta dentro del Estudio; no cambia la distribución del compositor. */
.ce-dialog{box-sizing:border-box;width:min(760px,calc(100vw - 24px));max-height:calc(100dvh - 28px);margin:auto;padding:24px;border:1px solid var(--border,#303030);border-radius:20px;background:var(--surface,#151515);color:var(--text,#eee);font:400 14px/1.5 var(--font,sans-serif);overflow:auto;box-shadow:0 24px 100px #000b}
.ce-dialog::backdrop{background:#000b;backdrop-filter:blur(5px)}
.ce-dialog [hidden]{display:none!important}
.ce-dialog header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.ce-dialog h2{font-size:22px;letter-spacing:-.025em;margin:0;line-height:1.2}
.ce-dialog h3{font-size:15px;margin:0 0 10px}
.ce-dialog .ce-beta{display:inline-block;font-size:11px;font-weight:600;color:var(--accent,#b3f046);background:#b3f04612;border:1px solid #b3f04635;border-radius:6px;padding:2px 6px;margin-bottom:7px}
.ce-dialog button,.ce-dialog select{font:600 13px var(--font,sans-serif);min-height:44px;border:1px solid var(--border,#333);border-radius:10px;padding:10px 14px;background:#232323;color:#f2f2f2;cursor:pointer}
.ce-dialog button:hover{background:#303030}.ce-dialog button:disabled{opacity:.5;cursor:default}
.ce-dialog [data-edit-close]{width:44px;flex:0 0 44px;padding:0;font-size:25px;background:transparent;border:0}
.ce-dialog input,.ce-dialog textarea,.ce-dialog select{accent-color:var(--accent,#b3f046)}
.ce-dialog :is(button,input,textarea,select,a):focus-visible{outline:2px solid var(--accent,#b3f046);outline-offset:3px}
.ce-preview{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin:0 0 18px}
.ce-preview figure{margin:0;min-width:0;border:1px solid var(--border,#333);border-radius:12px;overflow:hidden;background:#090909}
.ce-preview:has([data-edit-result][hidden]) figure:first-child{grid-column:1/-1;max-width:100%}
.ce-preview:has([data-edit-result][hidden]) img{height:150px}
.ce-preview img{width:100%;height:190px;object-fit:contain;display:block}
.ce-preview figcaption{font-size:12px;color:#bbb;padding:8px 12px;display:flex;justify-content:space-between;gap:12px}
.ce-preview a{color:var(--accent,#b3f046)}
.ce-dialog form{display:grid;gap:16px}
.ce-dialog label.ce-field{display:grid;gap:7px;font-weight:600}
.ce-dialog textarea{box-sizing:border-box;width:100%;min-height:85px;max-height:240px;padding:12px;border:1px solid var(--border,#333);border-radius:10px;background:#0c0c0c;color:#eee;font:400 14px/1.5 var(--font,sans-serif);resize:vertical}
.ce-settings{display:flex;flex-wrap:wrap;gap:12px}.ce-settings label{flex:1;min-width:100px}.ce-settings select{width:100%}
.ce-note,.ce-status{color:#aaa;font-size:13px;margin:0;overflow-wrap:anywhere}.ce-status{min-height:22px;margin-top:12px}
.ce-status:empty{display:none}
.ce-rights{border:1px solid var(--border,#333);border-radius:12px;padding:13px;display:grid;gap:10px}
.ce-rights label{display:flex;align-items:flex-start;gap:10px;font-size:12px;color:#ccc}.ce-rights input{flex:0 0 17px;width:17px;height:17px;margin:1px 0 0}
.ce-actions{display:flex;gap:10px;flex-wrap:wrap}.ce-actions button{flex:1}
.ce-dialog .ce-primary{background:var(--accent,#b3f046);color:#152006;border-color:transparent}.ce-dialog .ce-primary:hover{background:#c4ff65}
.ce-quote{border:1px solid #b3f04640;border-radius:12px;background:#b3f04609;padding:13px}.ce-quote strong{display:block;font-size:17px;margin-bottom:3px}.ce-quote span{color:#bbb;font-size:12px}
.ce-history{margin-top:20px;padding-top:17px;border-top:1px solid var(--border,#333)}.ce-history-list{display:grid;gap:8px}
.ce-history-list button{display:flex;justify-content:space-between;gap:16px;align-items:center;text-align:left;font-weight:400;min-width:0}.ce-history-list span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.ce-history-list small{flex-shrink:0;color:#a8b993}
@media(max-width:480px){.ce-dialog{padding:18px}.ce-dialog h2{font-size:20px}.ce-preview img{height:140px}.ce-preview{gap:8px}.ce-preview figcaption{padding:7px;font-size:11px}.ce-actions{flex-direction:column}}


/* cocuyo-css: assets/css/estudio-ejemplos.css */
/* Estados vacíos; no cambia el editor ni la navegación. */
body.studio-workbench .cocuyo-ejemplos{--ej-stroke:#ffffff20;--ej-ink:#f3f4ef;--ej-muted:#b0b5ac}
body.studio-workbench .cocuyo-ejemplos .ej-heading{text-align:left;width:min(100%,1120px);margin:0;align-self:center}
body.studio-workbench .cocuyo-ejemplos .ej-heading>span{display:block;margin-bottom:10px;color:var(--studio-accent);font:600 10px/1.4 var(--font);letter-spacing:.16em}
body.studio-workbench .cocuyo-ejemplos .ej-heading h3{font:600 clamp(25px,2.5vw,34px)/1.15 var(--font);letter-spacing:-.035em;color:var(--ej-ink);margin:0}
body.studio-workbench .cocuyo-ejemplos .ej-heading p{max-width:600px;margin:10px 0 0;font:400 13px/1.6 var(--font);color:var(--ej-muted);text-wrap:pretty}
.cocuyo-ejemplos .ej-model,.ej-dialog .ej-model{display:inline-flex;align-items:center;gap:6px;border:1px solid #ffffff25;border-radius:7px;padding:5px 7px;color:#f1f5ed;background:#0d110ed9;font:500 10px/1.2 var(--font);letter-spacing:0;backdrop-filter:blur(10px);white-space:nowrap}
.ej-model i{width:5px;height:5px;border-radius:50%;background:var(--studio-accent,#a6ef38)}
body.studio-workbench .cocuyo-ejemplos .studio-image-mood{gap:12px}
body.studio-workbench .cocuyo-ejemplos .ej-image-tile{aspect-ratio:auto;padding-bottom:76px;border-radius:16px;border:1px solid var(--ej-stroke);background:linear-gradient(150deg,#1b2016,#11150f)}
.cocuyo-ejemplos .ej-image-photo{display:block;aspect-ratio:4/3;overflow:hidden}
body.studio-workbench .cocuyo-ejemplos .ej-image-tile img{object-fit:cover;filter:none}
body.studio-workbench .cocuyo-ejemplos .ej-image-tile::after{display:none}
.cocuyo-ejemplos .ej-image-tile>.ej-model{position:absolute;top:11px;left:11px;z-index:2;max-width:calc(100% - 22px)}
body.studio-workbench .cocuyo-ejemplos .ej-image-open{position:absolute;inset:0;z-index:3;display:flex;align-items:flex-end;justify-content:space-between;gap:8px;width:100%;height:100%;padding:16px;margin:0;border:0;border-radius:15px;background:none;color:#fff;text-align:left;cursor:pointer}
.cocuyo-ejemplos .ej-image-open>span{min-width:0}
.cocuyo-ejemplos .ej-image-open b{display:block;font:550 15px/1.35 var(--font);letter-spacing:-.02em}
body.studio-workbench .cocuyo-ejemplos .ej-image-open small{display:block;position:static;margin-top:6px;color:#d5ddcd;font:400 11px/1.4 var(--font);text-shadow:none}
.cocuyo-ejemplos .ej-image-open svg{width:20px;height:20px;flex:none;margin-bottom:3px;color:var(--studio-accent)}
body.studio-workbench .cocuyo-ejemplos .ej-image-open:is(:hover,:focus-visible){background:linear-gradient(transparent,#101b052e);color:#fff}
body.studio-workbench .cocuyo-ejemplos .ej-image-open:focus-visible{outline:2px solid var(--studio-accent);outline-offset:-4px}
body.studio-workbench .cocuyo-ejemplos .ej-disclaimer{align-self:center;width:min(100%,1120px);max-width:1120px;text-align:left;margin:0;color:var(--ej-muted);font:400 11px/1.6 var(--font)}
body.studio-workbench .cocuyo-ejemplos.studio-image-welcome .studio-video-motion{top:-51px;right:0;width:38px;min-height:38px;z-index:5}
body.studio-workbench .cocuyo-ejemplos[data-empty-mode="video"] .studio-video-frame video{filter:none}
body.studio-workbench .cocuyo-ejemplos[data-empty-mode="video"] .studio-video-frame>.ej-model{position:absolute;left:14px;top:14px;bottom:auto;right:auto;z-index:3;font-size:10px}
.cocuyo-ejemplos .ej-video-title{position:absolute;left:18px;right:64px;bottom:20px;z-index:2;color:#fff;text-shadow:0 1px 14px #0008}
.ej-video-title b{display:block;font:550 clamp(20px,2.3vw,28px)/1.2 var(--font);letter-spacing:-.03em}
.ej-video-title small{display:block;margin-top:7px;font:400 11px/1.3 var(--font);color:#d6dcce}
.cocuyo-ejemplos .studio-video-reference figcaption b,.cocuyo-ejemplos .studio-video-reference figcaption span,.cocuyo-ejemplos .studio-video-reference figcaption small{display:block}
.cocuyo-ejemplos .studio-video-reference figcaption b{font-weight:550;font-size:13px;margin-bottom:5px}
.cocuyo-ejemplos .studio-video-reference figcaption span{font-size:10px;color:#d3efb1}
.cocuyo-ejemplos .studio-video-reference figcaption small{font-size:11px;color:#c4c9c0;margin-top:3px}
.ej-video-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;width:min(100%,1120px)}
body.studio-workbench .cocuyo-ejemplos .ej-video-footer p{max-width:430px;margin:0;color:var(--ej-muted);font-size:12px;line-height:1.6;text-wrap:pretty}
body.studio-workbench .cocuyo-ejemplos .ej-action,.ej-dialog .ej-action{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:12px 16px;margin:0;min-height:44px;border:1px solid #b0f04640;border-radius:10px;background:#182211;color:#d6f5b5;font:600 12px/1.35 var(--font);white-space:nowrap;cursor:pointer}
.ej-action svg,.audio-guide-action>svg{width:18px;height:18px;flex:none}
body.studio-workbench .cocuyo-ejemplos .ej-action:is(:hover,:focus-visible),.ej-dialog .ej-action:is(:hover,:focus-visible){background:#26371a;border-color:var(--studio-accent);color:#f0ffe3}
.ej-action:disabled{opacity:.5;cursor:not-allowed}
body.studio-workbench.audio-redesign .cocuyo-ejemplos .audio-guide-card{border:1px solid #ffffff1b;border-radius:16px;background:linear-gradient(150deg,#191d16,#111410);overflow:hidden}
body.studio-workbench.audio-redesign .cocuyo-ejemplos .audio-guide-copy h4{color:#f0f3eb}
body.studio-workbench.audio-redesign .cocuyo-ejemplos .audio-guide-voice{border-color:#ffffff12;border-radius:10px;background:#ffffff04;min-height:52px}
.cocuyo-ejemplos .audio-guide-voice svg,.ej-voice-preview svg{fill:none;stroke:currentColor;stroke-width:1.8;width:18px;height:18px;flex:none}
.ej-sound-art{position:relative;height:132px;margin:10px 20px;display:grid;place-items:center;isolation:isolate;overflow:hidden}
.ej-sound-art>span{position:absolute;width:105px;height:105px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#d7ff9f,#629133 36%,#26311e 70%);box-shadow:0 0 40px #85d52218;opacity:.85}
.ej-sound-art>div{display:flex;align-items:center;justify-content:center;gap:3px;height:64px;width:100%;z-index:1;filter:drop-shadow(0 2px 2px #102000)}
.ej-sound-art i{display:block;width:3px;height:var(--bar);border-radius:2px;background:linear-gradient(#efffde,#b9ea7d);opacity:.85}
body.studio-workbench.audio-redesign .cocuyo-ejemplos .ej-voice-preview{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:calc(100% - 40px);height:auto;min-width:0;min-height:44px;flex:0 0 auto;margin:0 20px;padding:10px;border:1px solid #c2e78f30;border-radius:9px;background:#28371a;color:#e4f9ce;font:500 12px/1.4 var(--font);cursor:pointer}
.ej-voice-preview>span{min-width:0;white-space:normal;word-break:normal;text-align:center}
body.studio-workbench.audio-redesign .cocuyo-ejemplos .ej-voice-preview:disabled{opacity:.5;cursor:not-allowed}
.ej-voices-status{min-height:148px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:14px;padding:10px;color:#b4bca9;font:400 12px/1.6 var(--font)}
body.studio-workbench.audio-redesign .cocuyo-ejemplos .ej-voices-status button{width:auto;min-height:40px;margin:0;padding:8px 14px;border:1px solid #c2e78f30;border-radius:8px;background:#28371a;color:#e4f9ce;font:500 12px/1.4 var(--font)}
.ej-voice-preview .vz-p{display:none}.ej-voice-preview.on .vz-p{display:block!important}.ej-voice-preview.on .vz-t{display:none}
body.studio-workbench .cocuyo-ejemplos .ej-audio-note{margin:12px 20px 18px;max-width:none;color:#b4bca9;font:400 11px/1.6 var(--font);text-align:center}
.ej-dialog{box-sizing:border-box;width:min(520px,calc(100vw - 28px));max-width:none;max-height:calc(100dvh - 28px);padding:0;border:1px solid #ffffff25;border-radius:19px;background:#11140f;color:#f0f3eb;overflow:auto;box-shadow:0 32px 100px #0009;scrollbar-width:thin}
.ej-dialog::backdrop{background:#000b;backdrop-filter:blur(7px)}
.ej-dialog>img{display:block;width:100%;height:180px;object-fit:cover}
.ej-dialog .ej-close{position:absolute;right:12px;top:12px;z-index:2;display:grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid #ffffff40;border-radius:50%;background:#080c09d9;color:#fff;font-size:25px;cursor:pointer}
.ej-dialog-body{padding:22px}
.ej-dialog h2{font:600 25px/1.2 var(--font);letter-spacing:-.035em;margin:12px 0 8px}
.ej-dialog p{font:400 13px/1.6 var(--font);color:#c1c8b9;margin:12px 0}
.ej-dialog .ej-dialog-spec{color:#91aa7c;font-size:11px;margin:0}
.ej-dialog details{border:1px solid #ffffff1a;border-radius:9px;padding:10px 12px;margin-top:14px}
.ej-dialog summary{font:500 12px/1.5 var(--font);cursor:pointer;min-height:24px}
.ej-dialog .ej-prompt{max-height:135px;overflow:auto;white-space:pre-wrap;font-size:11px;line-height:1.7;overflow-wrap:anywhere}
.ej-dialog .ej-replace{display:flex;align-items:flex-start;gap:9px;margin-top:14px;font:400 12px/1.5 var(--font);color:#d4dccc;cursor:pointer}
.ej-replace input{flex:none;margin:3px 0 0;accent-color:var(--studio-accent)}
.ej-dialog .ej-status{color:#d6e8c3;font-size:12px;min-height:0}
.ej-dialog .ej-status:empty{margin:16px 0 0}
.ej-dialog .ej-action{width:100%}
.ej-no-charge{display:block;margin:12px 0 0;color:#a7b19b;font:400 11px/1.6 var(--font);text-align:center}
.ej-dialog :is(button,input,summary):focus-visible,.cocuyo-ejemplos button:focus-visible{outline:2px solid var(--studio-accent,#a5eb38);outline-offset:3px}
@media(max-width:600px){
 body.studio-workbench .cocuyo-ejemplos .ej-heading h3{font-size:25px;max-width:270px}
 body.studio-workbench .cocuyo-ejemplos .ej-heading p{font-size:12px;max-width:280px}
 body.studio-workbench .cocuyo-ejemplos .studio-image-mood{gap:8px}
 body.studio-workbench .cocuyo-ejemplos .ej-image-tile{aspect-ratio:auto;padding-bottom:82px;border-radius:12px}
 .cocuyo-ejemplos .ej-image-tile>.ej-model{top:8px;left:8px;font-size:11px;padding:4px 5px;gap:4px}
 body.studio-workbench .cocuyo-ejemplos .ej-image-open{padding:11px;gap:4px}
 .cocuyo-ejemplos .ej-image-open b{font-size:13px}
 body.studio-workbench .cocuyo-ejemplos .ej-image-open small{font-size:10px;line-height:1.35}
 .cocuyo-ejemplos .ej-image-open svg{width:16px;height:16px}
 .ej-video-footer{flex-direction:column;align-items:stretch;gap:12px}
 body.studio-workbench .cocuyo-ejemplos .ej-video-footer p{max-width:none}
 .cocuyo-ejemplos .studio-video-reference figcaption b{font-size:11px;margin-bottom:2px}
 .cocuyo-ejemplos .studio-video-reference figcaption small{display:none}
 .cocuyo-ejemplos .ej-video-title{left:13px;bottom:16px}
 .ej-video-title b{font-size:20px}
 .ej-dialog>img{height:140px}.ej-dialog-body{padding:17px}.ej-dialog h2{font-size:23px}
}
@media(prefers-reduced-motion:no-preference){.ej-image-open,.ej-action{transition:background .16s,border-color .16s}.ej-audio-selected:has(.ej-voice-preview.on) .ej-sound-art i{animation:ej-sound 850ms ease-in-out infinite alternate}.ej-audio-selected:has(.ej-voice-preview.on) .ej-sound-art i:nth-child(3n){animation-delay:-360ms}@keyframes ej-sound{to{transform:scaleY(.42)}}}

/* Teléfono: explorar las cuatro ideas sin desplazar el campo de creación. */
@media(max-width:900px){
 body.studio-workbench.studio-simple .cocuyo-ejemplos.studio-image-welcome{gap:12px;padding:4px 0;overflow:visible}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-heading{padding-right:52px}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-heading>span{display:none}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-heading h3{font-size:22px;line-height:1.2}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-heading p{font-size:12px;line-height:1.45;margin-top:7px}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .studio-image-mood{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:42%;grid-template-rows:auto;gap:10px;width:100%;max-width:100%;height:auto;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scroll-padding-inline:2px;overscroll-behavior-x:contain;scrollbar-width:none;padding:2px 2px 8px;transform:none;box-sizing:border-box}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-image-tile{width:auto;height:auto;min-width:0;margin:0;padding-bottom:53px;aspect-ratio:auto;scroll-snap-align:start;border-radius:13px;background:var(--surface2);transform:none}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-image-photo{aspect-ratio:4/3}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-image-open{padding:11px;border-radius:12px}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-image-open b{font-size:12px;line-height:1.35}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-image-open small{display:none}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-image-open svg{width:16px;height:16px;margin-bottom:0}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-image-tile>.ej-model{font-size:11px;padding:4px 5px;top:7px;left:7px;max-width:calc(100% - 14px)}
 body.studio-workbench.studio-simple .cocuyo-ejemplos.studio-image-welcome .studio-video-motion{top:-62px;right:0;width:44px;height:44px;min-height:44px}
 body.studio-workbench.studio-simple .cocuyo-ejemplos .ej-disclaimer{font-size:10px;line-height:1.5}
 body.studio-workbench.studio-simple.modo-imagen .studio-results:has(.studio-image-welcome){margin-bottom:0}
 body.studio-workbench.studio-simple.modo-imagen .studio-workspace:has(.studio-image-welcome){gap:18px}
}
@media(min-width:601px) and (max-width:900px){
 body.studio-workbench.studio-simple .cocuyo-ejemplos .studio-image-mood{grid-auto-columns:calc((100% - 30px)/4)}
}

/* Video: una única escena completa, sin columnas vacías ni recortes del sujeto. */
body.studio-workbench .studio-video-welcome.studio-video-solo[data-empty-mode="video"]{min-height:0;padding:12px 0;gap:0}
body.studio-workbench .studio-video-welcome.studio-video-solo[data-empty-mode="video"] .studio-video-mood{display:block;width:min(100%,854px);height:auto;aspect-ratio:854/480;margin:0;animation:none}
body.studio-workbench .studio-video-welcome.studio-video-solo[data-empty-mode="video"] .studio-video-frame{width:100%;height:100%;max-height:none;aspect-ratio:854/480;grid-column:auto;grid-row:auto}
body.studio-workbench .studio-video-welcome.studio-video-solo[data-empty-mode="video"] .studio-video-frame video{object-fit:contain;filter:none}
body.studio-workbench .studio-video-welcome.studio-video-solo[data-empty-mode="video"] .studio-video-frame::after{display:none}
body.studio-workbench .studio-video-welcome.studio-video-solo[data-empty-mode="video"] .studio-video-motion{width:44px;height:44px;min-height:44px}
/* Espacio vacío: una muestra propia; el resto se abre sólo cuando hace falta. */
body.studio-workbench .studio-results-empty.ej-quiet,
body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio) .studio-image-welcome.ej-quiet{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:0;padding:20px 12px;overflow:visible;text-align:center}
body.studio-workbench .ej-quiet .ej-quiet-feature{width:min(100%,520px);margin:0}
.ej-quiet-feature>img{display:block;width:100%;height:clamp(180px,30vh,300px);object-fit:contain;border-radius:16px}
.ej-quiet-feature>figcaption{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:12px auto 0;max-width:400px;text-align:left}
.ej-quiet-feature>figcaption b,.ej-quiet-feature>figcaption small{display:block;font:500 13px/1.4 var(--font);color:var(--ej-ink,#f5f6f0)}
.ej-quiet-feature>figcaption small{margin-top:3px;font-size:11px;color:var(--ej-muted,#a9aca4)}
.ej-quiet .ej-quiet-use{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:8px 12px;border:1px solid #ffffff24;border-radius:10px;background:#ffffff06;color:#eef2e8;font:500 12px/1.3 var(--font);white-space:nowrap;cursor:pointer}
.ej-quiet-use svg{width:15px;height:15px}
.ej-quiet .ej-quiet-examples{width:min(100%,520px);margin:0;border:0;background:none;text-align:center}
.ej-quiet-examples>summary{display:list-item;width:fit-content;margin:0 auto;padding:12px 9px;min-height:44px;box-sizing:border-box;color:#bfc4b8;font:500 12px/1.6 var(--font);cursor:pointer;list-style-position:inside}
.ej-quiet-examples>summary::marker{font-size:9px;color:#959d8b}
.ej-quiet-recipes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:6px 0 0}
.ej-quiet-recipes>button{display:flex;min-width:0;flex-direction:column;gap:8px;padding:0 0 8px;border:1px solid #ffffff17;border-radius:10px;overflow:hidden;background:#ffffff03;color:#d5d9d0;font:500 11px/1.4 var(--font);cursor:pointer;text-align:left}
.ej-quiet-recipes>button img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain}
.ej-quiet-recipes>button span{padding:0 8px;overflow-wrap:anywhere}
.ej-quiet .ej-quiet-use:hover,.ej-quiet-recipes>button:hover,.ej-quiet .ej-quiet-voice:hover{border-color:#beed835e;background:#b9f2780b;color:#d8ffac}
.ej-quiet :is(button,summary):focus-visible{outline:2px solid #b9f278;outline-offset:4px}
body.studio-workbench .studio-results-empty.ej-quiet-audio{gap:0;min-height:280px;padding:40px 20px}
.ej-quiet-audio>.ej-quiet-wave,.ej-quiet-audio>.ic{width:44px;height:44px;margin:0 0 18px;color:#bbd899;opacity:.8}
body.studio-workbench .ej-quiet-audio>h3{max-width:380px;margin:0;font:500 clamp(17px,1.5vw,20px)/1.5 var(--font);letter-spacing:-.3px;color:#e6e9e1}
body.studio-workbench .ej-quiet-audio>.ej-quiet-hint{max-width:350px;margin:9px 0 0;font:400 13px/1.6 var(--font);color:#939b8c}
.ej-quiet-audio>.ej-quiet-voices{width:min(100%,400px);margin-top:14px}
body.studio-workbench .ej-quiet .ej-quiet-note{margin:4px 0 12px;color:#939b8c;font:400 11px/1.6 var(--font)}
.ej-quiet-voice-list{display:grid;gap:6px;text-align:left}
.ej-quiet .ej-quiet-voice{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:56px;padding:10px 14px;border:1px solid #ffffff14;border-radius:10px;background:#ffffff03;color:#dfe6d6;text-align:left;cursor:pointer}
.ej-quiet-voice b,.ej-quiet-voice small{display:block;font:500 12px/1.4 var(--font)}
.ej-quiet-voice small{margin-top:3px;color:#99a290;font-size:11px;font-weight:400}
.ej-quiet-voice>svg{flex:none;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}
.ej-quiet-voice.on .vz-t{display:none}.ej-quiet-voice.on .vz-p{display:block!important}
.ej-quiet .ej-quiet-voice.on{border-color:#beed8366;color:#d8ffac}
.ej-quiet .ej-voices-status{min-height:0;align-items:center;padding:12px;font-size:12px;color:#a8b29e;text-align:center}
@media(max-width:600px){
 body.studio-workbench.studio-simple .studio-results-empty.ej-quiet,
 body.studio-workbench.modo-imagen:not(.experiencia-facil):not(.modo-audio) .studio-image-welcome.ej-quiet{padding:8px 4px;gap:4px}
 .ej-quiet-feature>img{height:180px;max-height:32dvh;border-radius:12px}
 .ej-quiet-feature>figcaption{gap:8px;margin-top:8px;max-width:360px}
 .ej-quiet-feature>figcaption b{font-size:12px}
 .ej-quiet .ej-quiet-use{font-size:11px;padding:8px 10px}
 .ej-quiet-recipes{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-width:360px;margin:auto}
 body.studio-workbench.studio-simple .studio-results-empty.ej-quiet-audio{min-height:220px;padding:28px 16px}
}

/* Imagen, Video y Audio: dos luces de Cocuyo, sin recursos editoriales. */
body.studio-workbench .studio-results-empty.ej-waiting{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;width:100%;min-height:clamp(200px,38dvh,440px);padding:32px 16px;box-sizing:border-box;border:0;background:none;text-align:center}
body.studio-workbench.audio-redesign .studio-results:has(#genout>.ej-waiting)>.audio-feed-toolbar{display:none}
.ej-waiting-lights{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:26px}
.ej-waiting-lights i{display:block;width:9px;height:17px;border-radius:8px;transform:rotate(18deg);background:var(--studio-accent,#a6ef38);box-shadow:0 0 14px #a6ef3838;opacity:.85}
@media(min-width:901px){
 body.studio-workbench .studio-results-empty.ej-waiting:is([data-empty-mode="video"],[data-empty-mode="audio"]){min-height:calc(100dvh - 140px)}
}
body.studio-workbench .ej-waiting>p{margin:0;max-width:100%;color:#a6ada0;font:450 14px/1.5 var(--font);letter-spacing:.01em;text-wrap:balance}
@media(prefers-reduced-motion:no-preference){
 .ej-waiting-lights i{animation:ej-waiting-glow 3.6s ease-in-out infinite}
 .ej-waiting-lights i:nth-child(2){animation-delay:-1.8s}
 @keyframes ej-waiting-glow{0%,100%{opacity:.5;box-shadow:0 0 10px #a6ef3820}50%{opacity:1;box-shadow:0 0 20px #a6ef3860}}
}
@media(max-width:900px){
 body.studio-workbench:not(.experiencia-facil) .studio-workspace:has(.ej-waiting){display:flex;flex-direction:column;gap:14px}
 body.studio-workbench:not(.experiencia-facil) .studio-results:has(.ej-waiting){order:-1;margin:0;padding:0;border:0}
 body.studio-workbench.audio-redesign:not(.experiencia-facil) .studio-workspace:has(#genout>.ej-waiting){display:flex;flex-direction:column}
 body.studio-workbench.audio-redesign .studio-results:has(#genout>.ej-waiting){display:block;order:-1!important}
 body.studio-workbench.studio-simple .studio-results-empty.ej-waiting{min-height:clamp(150px,26dvh,240px);padding:24px 12px;gap:14px}
 body.studio-workbench .ej-waiting>p{font-size:13px}
}


/* cocuyo-css: assets/css/estudio-referencias-historial.css */
/* Ficha privada de referencias: historial local y Bóveda comparten diseño. */
.jr-refmas{display:inline-flex;align-items:center;justify-content:center;align-self:center;min-width:28px;height:28px;padding:0 5px;border-radius:6px;background:#252a21;color:#d4e6c0;font-size:11px;font-weight:600}
.creation-references{margin:20px 0;min-width:0}
.creation-references h3{display:flex;align-items:center;gap:8px;margin:0 0 12px;color:#dce2d5;font:600 12px/1.4 var(--font,sans-serif)}
.creation-references h3>span{border:1px solid #3b4432;border-radius:6px;padding:1px 6px;color:var(--verde-cocuyo,#aff33e);font-variant-numeric:tabular-nums}
.creation-references-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-height:440px;overflow:auto;overscroll-behavior:contain;padding:1px 3px 4px 1px}
.creation-reference{margin:0;min-width:0;border:1px solid #30352b;border-radius:11px;overflow:hidden;background:#141711}
.creation-reference>img,.creation-reference>video{display:block;width:100%;height:116px;object-fit:contain;background:#080a07}
.creation-reference-video,.creation-reference-audio{grid-column:1/-1}
.creation-reference-video>video{height:auto;max-height:200px;min-height:110px}
.creation-reference-audio>audio{display:block;width:calc(100% - 16px);height:44px;margin:10px 8px 0}
.creation-reference figcaption{display:flex;flex-wrap:wrap;align-items:center;gap:5px 8px;padding:9px 10px;color:#e3e8dd;font:500 12px/1.5 var(--font,sans-serif)}
.creation-reference-name{flex:1;min-width:0;overflow-wrap:anywhere}
.creation-reference-role{flex:none;padding:1px 6px;border-radius:5px;background:#2a3421;color:#c9e5a5;font-size:10px}
.creation-reference small{display:block;flex-basis:100%;color:#9aa690;font-size:10px;font-variant-numeric:tabular-nums}
.creation-reference-unavailable{display:grid;place-items:center;min-height:100px;padding:10px;color:#a5aa9f;font-size:12px;text-align:center}
.creation-references :is(video,audio):focus-visible{outline:2px solid var(--verde-cocuyo,#aff33e);outline-offset:-2px}
@media(max-width:480px){.creation-references-grid{max-height:360px}.creation-reference figcaption{padding:8px}.creation-reference>img{height:100px}}


/* cocuyo-css: assets/css/estudio-cuenta-menu.css */
/* Una sola superficie para la cuenta: identidad y ajustes junto al editor. */
body.studio-workbench.studio-simple #accmenu{width:340px;padding:7px;border:1px solid var(--border2);border-radius:17px;background:var(--elev);box-shadow:0 18px 56px #0009;scrollbar-width:thin;scrollbar-color:var(--border2) transparent;overscroll-behavior:contain}
body.studio-workbench #accmenu [hidden]{display:none!important}
body.studio-workbench #accmenu .acc-identidad{display:flex;align-items:center;gap:10px;padding:12px 10px 16px}
body.studio-workbench #accmenu .acc-identidad>div{min-width:0;flex:1}
body.studio-workbench #accmenu .acc-avatar{width:34px;height:34px;flex:none;border-radius:11px}
body.studio-workbench #accmenu .acc-avatar .ic{width:18px;height:18px}
body.studio-workbench #accmenu .acc-identidad strong{font-size:13px;font-weight:600;color:var(--text)}
body.studio-workbench #accmenu .em{font-size:11px;line-height:1.4;padding-top:4px;overflow-wrap:anywhere}
body.studio-workbench #accmenu .sec{padding:5px 0;border-top:1px solid var(--border)}
body.studio-workbench #accmenu .mi,body.studio-workbench #accmenu #accRecargar{display:flex;align-items:center;justify-content:flex-start;width:100%;min-height:43px;height:auto;gap:11px;padding:10px 12px;margin:0;border:0;border-radius:10px;background:transparent;font-family:inherit;font-size:13px;font-weight:500;line-height:1.35;color:var(--text);text-align:left;cursor:pointer;list-style:none}
body.studio-workbench #accmenu .mi::-webkit-details-marker,body.studio-workbench #accmenu .acc-delete>summary::-webkit-details-marker{display:none}
body.studio-workbench #accmenu .mi>.ic{width:18px;height:18px;flex:0 0 18px;color:var(--muted);stroke-width:1.7}
body.studio-workbench #accmenu :is(.mi,#accRecargar):hover{background:var(--surface2);color:var(--text)}
body.studio-workbench #accmenu .mi:hover>.ic,body.studio-workbench #accmenu .acc-section[open]>.mi>.ic{color:var(--lima)}
body.studio-workbench #accmenu :is(button,a,summary,input,select):focus-visible{outline:2px solid var(--lima);outline-offset:2px}
body.studio-workbench #accmenu .mi:focus-visible{outline-offset:-2px;background:var(--surface2)}
body.studio-workbench #accmenu #estudio-salir{color:var(--muted2)}
body.studio-workbench #accmenu #estudio-salir:hover{color:var(--text)}
body.studio-workbench #accmenu .acc-arrow{width:13px;height:13px;flex:none;margin-left:auto;color:var(--dim);fill:none;stroke:currentColor;stroke-width:1.8;transition:transform .16s ease}
body.studio-workbench #accmenu .acc-section[open]>.mi{background:var(--surface2)}
body.studio-workbench #accmenu .acc-section[open] .acc-arrow{transform:rotate(90deg)}
body.studio-workbench #accmenu .acc-section-body{margin:5px 5px 9px;padding:10px 9px 12px;border:1px solid var(--border);border-radius:10px;background:color-mix(in srgb,var(--surface) 62%,transparent);font-size:12px;line-height:1.5}
body.studio-workbench #accmenu .acc-plan{display:block;font-size:12px;font-weight:600;color:var(--text)}
body.studio-workbench #accmenu .acc-hint{font-size:11px;line-height:1.55;color:var(--muted2);margin:6px 0 11px}
body.studio-workbench #accmenu .acc-hint:empty{display:none}
body.studio-workbench #accmenu .acc-action{display:flex;align-items:center;justify-content:center;width:100%;min-height:39px;padding:9px 11px;margin:8px 0 0;border:1px solid var(--border2);border-radius:8px;background:var(--surface2);color:var(--text);font-family:inherit;font-size:12px;font-weight:500;line-height:1.35;cursor:pointer;text-align:center}
body.studio-workbench #accmenu .acc-action:hover{border-color:color-mix(in srgb,var(--lima) 45%,var(--border2))}
body.studio-workbench #accmenu button:disabled,body.studio-workbench #accmenu input:disabled{opacity:.5;cursor:default}
body.studio-workbench #accmenu .acc-action-small{background:transparent;min-height:34px;font-size:11px}
body.studio-workbench #accmenu .acc-status{font-size:11px;line-height:1.5;margin:9px 0 0;color:var(--muted2);overflow-wrap:anywhere}
body.studio-workbench #accmenu .is-error{color:#ffaaa3}
body.studio-workbench #accmenu .acc-language{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:1px 0 12px}
body.studio-workbench #accmenu .acc-language>span{font-weight:500}
body.studio-workbench #accmenu .cocuyo-idioma{min-height:44px;padding:0;background:var(--surface2);border:1px solid var(--border2);border-radius:9px}
body.studio-workbench #accmenu .cocuyo-idioma svg{width:15px;height:15px}
body.studio-workbench #accmenu .acc-notice{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding-top:12px;border-top:1px solid var(--border);cursor:pointer}
body.studio-workbench #accmenu .acc-notice>span{display:grid;gap:5px;min-width:0}
body.studio-workbench #accmenu .acc-notice strong{font-size:12px;font-weight:500}
body.studio-workbench #accmenu .acc-notice small{font-size:10px;line-height:1.5;color:var(--muted2)}
body.studio-workbench #accmenu .acc-notice input{width:18px;height:18px;flex:none;margin:2px 0;accent-color:var(--lima)}
body.studio-workbench #accmenu .acc-storage{display:grid;gap:4px;padding-bottom:5px}
body.studio-workbench #accmenu .acc-storage small{font-size:10px;color:var(--muted2)}
body.studio-workbench #accmenu .acc-legal{display:flex;flex-wrap:wrap;gap:5px 12px;margin:13px 0;font-size:10px}
body.studio-workbench #accmenu .acc-legal a,body.studio-workbench #accmenu .acc-hint a{color:var(--muted2);text-decoration:underline;text-underline-offset:3px}
body.studio-workbench #accmenu .acc-legal a:hover,body.studio-workbench #accmenu .acc-hint a:hover{color:var(--text)}
body.studio-workbench #accmenu .acc-delete{border-top:1px solid var(--border);margin-top:12px;padding-top:5px}
body.studio-workbench #accmenu .acc-delete>summary{list-style:none;cursor:pointer;min-height:36px;display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--muted2);border-radius:5px}
body.studio-workbench #accmenu .acc-delete>summary:after{content:'+';font-size:16px;color:var(--dim)}
body.studio-workbench #accmenu .acc-delete[open]>summary:after{content:'−'}
body.studio-workbench #accmenu .acc-delete[open]>summary{color:#ffaaa3}
body.studio-workbench #accmenu .acc-delete label{display:block;font-size:11px;color:var(--muted2);margin:7px 0}
body.studio-workbench #accmenu .acc-delete input{display:block;width:100%;min-width:0;min-height:40px;padding:9px 11px;border:1px solid var(--border2);border-radius:7px;background:var(--surface);font-family:inherit;font-size:13px;line-height:1.4;color:var(--text)}
body.studio-workbench #accmenu .acc-danger{color:#ffb1a9;border-color:#e76d613b;background:#e76d610b}
body.studio-workbench #accmenu .acc-danger:hover{border-color:#e76d61a0}
body.studio-workbench #submenu{display:none!important}
body.studio-workbench #accmenu.open{animation:account-menu-enter .14s ease-out}
@keyframes account-menu-enter{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:901px){body.studio-workbench.studio-simple #accmenu{left:auto;right:20px;top:calc(var(--st-top) + 8px);bottom:auto;max-height:calc(100dvh - var(--st-top) - 24px);overflow:auto;z-index:200}}
@media(max-width:900px){body.studio-workbench.studio-simple #accmenu{width:min(340px,calc(100vw - 24px))}body.studio-workbench.studio-simple #accmenu .mi{min-height:46px;font-size:13px}body.studio-workbench #accmenu .acc-action{min-height:42px}body.studio-workbench #accmenu .acc-delete input{font-size:16px}body.studio-workbench #accmenu .acc-delete>summary{min-height:42px}}
@media(prefers-reduced-motion:reduce){body.studio-workbench #accmenu.open{animation:none}body.studio-workbench #accmenu .acc-arrow{transition:none}}

/* Perfil compacto: datos legibles en una sola superficie, sin pantalla extra. */
body.studio-workbench.studio-simple #accmenu{width:352px;padding:8px;border-radius:19px;background:var(--elev)}
body.studio-workbench #accmenu .acc-identidad{gap:12px;padding:14px 12px 13px;flex-wrap:wrap}
body.studio-workbench #accmenu .acc-avatar{width:38px;height:38px;border-radius:12px;background:color-mix(in srgb,var(--lima) 11%,var(--surface2));border:1px solid color-mix(in srgb,var(--lima) 18%,var(--border));color:var(--lima)}
body.studio-workbench #accmenu .acc-identidad>div{flex:1 1 180px}
body.studio-workbench #accmenu .acc-identidad strong{display:block;font-size:15px;line-height:1.3;letter-spacing:-.02em;overflow-wrap:anywhere}
body.studio-workbench #accmenu .em{font-size:12px;line-height:1.45;color:var(--muted2)}
body.studio-workbench #accmenu .acc-storage-overview{display:grid;grid-template-columns:18px minmax(0,1fr);gap:10px;align-items:center;margin:0 10px 12px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface)}
body.studio-workbench #accmenu .acc-storage-overview>.ic{width:18px;height:18px;color:var(--muted2);fill:none;stroke:currentColor;stroke-width:1.6}
body.studio-workbench #accmenu .acc-storage-overview>div{display:grid;gap:4px;min-width:0}
body.studio-workbench #accmenu .acc-storage-overview span{font-size:11px;color:var(--muted2)}
body.studio-workbench #accmenu .acc-storage-overview small{font-size:11px;line-height:1.45;color:var(--text);overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
body.studio-workbench #accmenu #accRecargar{min-height:60px;margin:0 0 5px;background:color-mix(in srgb,var(--lima) 7%,var(--surface));border:1px solid color-mix(in srgb,var(--lima) 16%,var(--border));gap:10px}
body.studio-workbench #accmenu #accRecargar:hover{background:color-mix(in srgb,var(--lima) 12%,var(--surface2));border-color:color-mix(in srgb,var(--lima) 35%,var(--border))}
body.studio-workbench #accmenu #accRecargar>.ic{color:var(--lima)}
body.studio-workbench #accmenu .acc-topup-copy{display:grid;gap:4px;flex:1;min-width:0}
body.studio-workbench #accmenu .acc-topup-copy>small{font-size:10px;line-height:1.3;color:var(--muted2);font-weight:400}
body.studio-workbench #accmenu .acc-topup-balance{display:grid;gap:3px;flex:none;max-width:110px;text-align:right;font-size:18px;font-weight:650;line-height:1.1;letter-spacing:-.025em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
body.studio-workbench #accmenu .acc-topup-balance small{font-size:10px;font-weight:400;line-height:1.2;letter-spacing:0;color:var(--muted2)}
body.studio-workbench:has(#acct:is([data-credit-state="low"],[data-credit-state="empty"])) #accmenu .acc-topup-balance>span{color:#ffaaa3}
body.studio-workbench #accmenu .mi{min-height:44px}
body.studio-workbench #accmenu .acc-section-body{margin:4px 4px 9px;padding:13px 12px;border-radius:11px}
body.studio-workbench #accmenu .acc-hint,body.studio-workbench #accmenu .acc-status{font-size:12px;line-height:1.5}
body.studio-workbench #accmenu .acc-notice small{font-size:11px}
body.studio-workbench #accmenu .acc-notice input{width:20px;height:20px;margin:3px 0}
body.studio-workbench #accmenu .acc-legal{font-size:11px;line-height:1.5}
@media(max-width:900px){
 body.studio-workbench.studio-simple #accmenu{width:min(340px,calc(100% - 24px))}
 body.studio-workbench #accmenu .acc-identidad{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:2px 10px}
 body.studio-workbench #accmenu .acc-identidad>.acc-avatar{grid-column:1;grid-row:1/3}
 body.studio-workbench #accmenu .acc-identidad>div{display:contents}
 body.studio-workbench #accmenu .acc-identidad strong{grid-column:2;grid-row:1}
 body.studio-workbench #accmenu .acc-identidad .em{grid-column:2/4;grid-row:2;overflow-wrap:anywhere;font-size:12px}
 body.studio-workbench #accmenu .acc-identidad #btnmascreditos{grid-column:3;grid-row:1;flex:none;margin-left:0;min-height:44px;max-width:110px;padding-inline:10px}
 body.studio-workbench #accmenu .acc-identidad #btnmascreditos .credit-wallet-value{font-size:18px;font-variant-numeric:tabular-nums}
 body.studio-workbench #accmenu .acc-topup-balance{display:none}
 body.studio-workbench #accmenu #accRecargar{min-height:52px}
 body.studio-workbench #accmenu .acc-topup-copy>small{display:none}
 body.studio-workbench #accmenu .acc-delete input{font-size:16px}
}


/* cocuyo-css: assets/css/estudio-modelos-selector.css */
/* Selector de modelos del compositor. Disponibles y coste junto al nombre. */
body.studio-workbench #modal.model-picker{align-items:center;padding:24px;z-index:200}
body.studio-workbench #modal.model-picker .mbox{width:min(760px,100%);max-width:760px;max-height:calc(100dvh - 48px);border-radius:20px;background:var(--elev);border:1px solid var(--border2)}
body.studio-workbench #modal.model-picker .studio-model-head{padding:20px 20px 14px}
body.studio-workbench #modal.model-picker .studio-model-head h2{margin:0;font:600 19px/1.25 var(--font);letter-spacing:-.03em}
body.studio-workbench #modal.model-picker .studio-model-head :is(.studio-eyebrow,.studio-model-note){display:none}
body.studio-workbench #modal.model-picker .mtop{gap:8px;padding:0 16px 12px;border:0}
body.studio-workbench #modal.model-picker .msearch{height:44px;min-height:44px;min-width:0;padding:9px 12px;gap:9px;border-radius:11px;border:1px solid var(--border2);background:var(--surface)}
body.studio-workbench #modal.model-picker .msearch:focus-within{border-color:var(--studio-accent)}
body.studio-workbench #modal.model-picker .msearch input{width:100%;min-width:0;font-size:14px}
body.studio-workbench #modal.model-picker .msearch input:focus-visible{outline:none!important;box-shadow:none!important}
body.studio-workbench #modal.model-picker .mclose{width:44px;height:44px;flex:0 0 44px;border:1px solid var(--border);border-radius:11px;color:var(--muted2);font-size:16px}
body.studio-workbench #modal.model-picker .mbody{min-height:0;overflow:auto;padding:0 10px 12px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--border2) transparent}
body.studio-workbench #modal.model-picker .cms-toolbar{position:sticky;top:0;z-index:1;display:flex;align-items:center;gap:8px;padding:0 6px 10px;background:var(--elev)}
body.studio-workbench #modal.model-picker .cms-count{min-width:0;font-size:11px;color:var(--muted)}
body.studio-workbench #modal.model-picker #modelRetry{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;margin-left:auto;border:0;border-radius:9px;padding:8px;background:transparent;color:var(--muted2)}
body.studio-workbench #modal.model-picker #modelRetry:hover{color:var(--text);background:var(--surface2)}
body.studio-workbench #modal.model-picker #modelRetry svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
body.studio-workbench #modal.model-picker .cms-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
body.studio-workbench #modal.model-picker .mrow{width:100%;min-width:0;min-height:56px;display:flex;align-items:center;gap:9px;margin:0;padding:8px;border:1px solid var(--border);border-radius:11px;background:transparent;text-align:left;font:inherit;color:var(--text);cursor:pointer;box-shadow:none}
body.studio-workbench #modal.model-picker .mrow:hover:not(:disabled){background:var(--surface2)}
body.studio-workbench #modal.model-picker .mrow.sel{background:var(--studio-active);border-color:color-mix(in srgb,var(--studio-accent) 28%,var(--border));box-shadow:none}
body.studio-workbench #modal.model-picker .mrow :is(.logo,.mrcbox){width:32px;height:32px;flex:0 0 32px;border-radius:9px;display:grid;place-items:center;background:var(--surface)}
body.studio-workbench #modal.model-picker .mrow .mrcbox .mrc{width:22px;height:22px}
body.studio-workbench #modal.model-picker .mrow .body{display:grid;gap:5px;min-width:0;flex:1}
body.studio-workbench #modal.model-picker .mrow .nm{display:block;font-size:13px;font-weight:550;line-height:1.3;letter-spacing:-.015em;overflow-wrap:anywhere}
body.studio-workbench #modal.model-picker .cms-detail{display:block;font-size:10px;line-height:1.35;color:var(--muted2)}
body.studio-workbench #modal.model-picker .cms-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
body.studio-workbench #modal.model-picker .cms-editorial{color:var(--studio-accent);font-size:10px;font-weight:500;line-height:1.35}
body.studio-workbench #modal.model-picker .cms-cost{flex:none;max-width:124px;font-size:11px;font-weight:550;font-variant-numeric:tabular-nums;line-height:1.4;text-align:right;color:var(--text)}
body.studio-workbench #modal.model-picker .cms-cost-dynamic{max-width:112px;font-size:10px;font-weight:400;color:var(--muted2)}
body.studio-workbench #modal.model-picker .mrow .radio{display:grid;place-items:center;width:16px;height:16px;flex:0 0 16px;margin:0;border:1px solid var(--border2);background:transparent}
body.studio-workbench #modal.model-picker .mrow.sel .radio{border-color:var(--studio-accent);background:var(--studio-accent);color:var(--tinta-sobre-verde)}
body.studio-workbench #modal.model-picker .mrow .radio:after{display:none}
body.studio-workbench #modal.model-picker .radio svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2}
body.studio-workbench #modal.model-picker .mrow:disabled{cursor:default;opacity:.65}
body.studio-workbench #modal.model-picker .cms-footnote{padding:10px 8px 0;margin:4px 0 0;font-size:10px;line-height:1.5;color:var(--muted)}
body.studio-workbench #modal.model-picker :is(button,select,summary):focus-visible{outline:2px solid var(--studio-accent);outline-offset:1px}
@media(max-width:760px){
 body.studio-workbench #modal.model-picker .mbox{max-width:580px}
 body.studio-workbench #modal.model-picker .cms-options{grid-template-columns:minmax(0,1fr)}
 body.studio-workbench #modal.model-picker .mrow{min-height:64px}
}
@media(max-width:600px){
 body.studio-workbench #modal.model-picker{align-items:flex-end;padding:0}
 body.studio-workbench #modal.model-picker .mbox{width:100%;max-height:calc(100dvh - 36px);border-radius:20px 20px 0 0;padding-bottom:env(safe-area-inset-bottom,0px)}
 body.studio-workbench #modal.model-picker .studio-model-head{padding:18px 16px 12px}
 body.studio-workbench #modal.model-picker .mtop{padding-inline:12px}
 body.studio-workbench #modal.model-picker .mbody{padding-inline:6px}
 body.studio-workbench #modal.model-picker .mrow{gap:8px;padding:10px 8px}
 body.studio-workbench #modal.model-picker .mrow .nm{font-size:13px}
 body.studio-workbench #modal.model-picker .cms-cost{max-width:124px;font-size:11px}
 body.studio-workbench #modal.model-picker .cms-cost-dynamic{max-width:112px;font-size:10px}
 body.studio-workbench #modal.model-picker .mrow :is(.logo,.mrcbox){width:28px;height:28px;flex-basis:28px}
 body.studio-workbench #modal.model-picker .mrow .radio{width:14px;height:14px;flex-basis:14px}
}
@media(prefers-reduced-motion:reduce){body.studio-workbench #modal.model-picker *{scroll-behavior:auto}}
@media(max-width:900px){
 body.studio-workbench #modal.model-picker .msearch input{font-size:16px}
}