/* ============================================================
   LEONIDA POST — El Estudio
   ============================================================ */
.estudio { background: var(--surface); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.estudio__pestanas { display: flex; border-bottom: 1px solid var(--line); overflow-x: auto; }
.estudio__pestana { flex: 1; min-width: 140px; padding: 14px 12px; background: none; border: 0; border-bottom: 3px solid transparent; color: var(--ink-2); font: inherit; font-weight: 700; cursor: pointer; white-space: nowrap; }
.estudio__pestana--activa { color: var(--ink); border-bottom-color: var(--pink); background: color-mix(in srgb, var(--pink) 8%, transparent); }
.estudio__cuerpo { display: grid; grid-template-columns: minmax(280px, 420px) 1fr; gap: 18px; padding: 18px; }
.estudio__panel { display: grid; gap: 12px; align-content: start; }
.estudio__ayuda { margin: 0; color: var(--ink-2); font-size: .92rem; line-height: 1.5; }
.estudio__idea, .estudio__campo input[type=text], .estudio__campo select { width: 100%; background: var(--bg-2, var(--surface-2)); color: var(--ink); border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font: inherit; font-size: .95rem; }
.estudio__idea { resize: vertical; min-height: 84px; }
.estudio__idea:focus, .estudio__campo input:focus { outline: 2px solid var(--pink); outline-offset: 1px; border-color: transparent; }
.estudio__campo { display: flex; flex-direction: column; gap: 4px; font-size: .72rem; font-family: var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-3); }
.estudio__campo input[type=file] { font: inherit; font-size: .82rem; color: var(--ink-2); text-transform: none; letter-spacing: 0; }
.estudio__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.estudio__fila { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.estudio__check { display: flex; align-items: center; gap: 8px; font-size: .82rem; color: var(--ink-2); }
.estudio__dos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.estudio__dos > div { display: grid; gap: 8px; align-content: start; min-width: 0; }
.estudio__dos b { font-size: .8rem; color: var(--cyan); font-family: var(--font-mono); letter-spacing: .1em; text-transform: uppercase; }
.estudio__vista { min-width: 0; }
.estudio__lienzo { position: relative; background: #000; border-radius: 14px; overflow: hidden; min-height: 240px; display: grid; place-items: center; }
.estudio__lienzo canvas { display: block; width: 100%; height: auto; max-height: 72vh; object-fit: contain; }
.estudio__vacio { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; color: var(--ink-3); font-size: .95rem; text-align: center; padding: 20px; background: rgba(0,0,0,.35); }
.estudio__vacio[hidden] { display: none; }
.estudio__acciones { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.img__miniaturas { display: flex; gap: 6px; overflow-x: auto; padding: 4px 0; }
.img__mini { flex: none; width: 84px; height: 54px; padding: 0; border: 2px solid transparent; border-radius: 8px; overflow: hidden; background: var(--surface-2); cursor: pointer; }
.img__mini img { width: 100%; height: 100%; object-fit: cover; display: block; }
.img__mini--sel { border-color: var(--pink); }
.tuits__tema { cursor: pointer; border: 1px solid var(--line); background: var(--surface-2); }

/* Galería de la comunidad */
.galeria-estudio { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.creacion { background: var(--surface); border: 1px solid var(--line); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; }
.creacion--oculta { opacity: .5; }
.creacion__img { display: block; background: #000; }
.creacion__img img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.creacion__pie { padding: 10px 12px 12px; display: grid; gap: 8px; }
.creacion__autor { display: flex; align-items: center; gap: 8px; font-size: .84rem; min-width: 0; }
.creacion__autor > span { display: flex; flex-direction: column; min-width: 0; }
.creacion__autor small { color: var(--ink-3); font-size: .74rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.creacion__acciones { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.creacion__acciones .foro__accion--sec { margin-left: auto; }

@media (max-width: 860px) {
  .estudio__cuerpo { grid-template-columns: 1fr; padding: 12px; }
  .estudio__dos { grid-template-columns: 1fr; }
}

/* Preguntas para afinar antes de dibujar */
.estudio__afinar { display: grid; gap: 10px; padding: 12px; border: 1px dashed color-mix(in srgb, var(--pink) 45%, transparent); border-radius: 12px; background: color-mix(in srgb, var(--pink) 5%, transparent); }
.estudio__preg { display: grid; gap: 6px; }
.estudio__preg > span { font-size: .9rem; color: var(--ink); }
.estudio__preg [data-libre] { flex: 1; min-width: 120px; background: var(--bg-2, var(--surface-2)); color: var(--ink); border: 1px solid var(--line); border-radius: 999px; padding: 5px 12px; font: inherit; font-size: .8rem; }

/* Arte oficial elegido automáticamente como base */
.estudio__base { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 12px; background: color-mix(in srgb, var(--cyan) 8%, transparent); border: 1px solid color-mix(in srgb, var(--cyan) 30%, transparent); }
.estudio__base img { width: 64px; height: 40px; object-fit: cover; border-radius: 6px; flex: none; }
.estudio__base > span { display: flex; flex-direction: column; min-width: 0; flex: 1; font-size: .84rem; }
.estudio__base small { color: var(--ink-3); font-size: .72rem; }

.estudio__lienzo canvas { touch-action: none; }
input[type=range][data-ret-grosor] { width: 100%; accent-color: var(--pink); }

.estudio [hidden] { display: none !important; }
