/* Identidad propia del laboratorio; los componentes comparten únicamente la estructura. */
:root{color-scheme:dark;--bg:#080a0e;--paper:#111419;--ink:#f1f3f6;--text:#d2d6dd;--muted:#77808d;--line:#282d35;--green:#c5f67a;--green-light:#c5f67a12;--gold:#c5f67a;--error:#ff9b92;font-size:14px}
.session-required{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:20px;padding:20px 22px;border:1px solid #4a5b36;background:#182016;border-radius:8px}.session-required strong{font:500 18px 'Space Grotesk',sans-serif;color:#d4edb4}.session-required p{font-size:12px;color:#9cac90;margin-top:6px;line-height:1.6}.session-required a{flex-shrink:0;text-decoration:none}@media(max-width:740px){.session-required{align-items:flex-start;flex-direction:column}.session-required a{width:100%}}
body{background:radial-gradient(ellipse at 77% 12%,#3c4b4320 0,transparent 40%),var(--bg)}
.topbar{height:70px;background:#0c0e12d9;border-bottom:1px solid #23272f;backdrop-filter:blur(20px);padding:0 42px}.brand{font:600 21px 'Space Grotesk',sans-serif;color:#f0f2f6;letter-spacing:-.8px}.brand img{filter:grayscale(1) brightness(3);width:28px;height:28px}.workspace-label{font:500 10px monospace;letter-spacing:1.8px;color:#969faa}.lab-version{border:1px solid #353b42;border-radius:3px;padding:2px 4px;font-size:8px;margin-left:7px;color:#737f8e}.brand-divider{background:#2b3038}.top-actions{gap:25px}.connection{border-color:#303b2a;border-radius:5px;font:10px monospace;padding:7px 10px;background:#161c13;color:#aabd96}.connection.ready{background:#141b12;color:#b1c799}.connection.ready span{background:#c5f67a;box-shadow:0 0 8px #c5f67a44}.connection.error{border-color:#653431;background:#271411;color:#ffafa6}.back-link{font-size:11px;color:#818b99}.back-link:hover{color:#dce3eb}
.page{padding:40px 44px 0;max-width:1560px}.page-heading{align-items:center}.eyebrow{font:10px monospace;letter-spacing:1.5px;color:#9aaf8a;display:flex;align-items:center;gap:8px;margin-bottom:13px}.live-dot{display:inline-block;width:5px;height:5px;background:#c5f67a;border-radius:50%;box-shadow:0 0 9px #c5f67a35;flex-shrink:0}h1{font:500 46px/1.15 'Space Grotesk',sans-serif;letter-spacing:-2.1px;color:#f1f3f6}h1 span{color:#c5f67a}.subtitle{color:#7f8996;font-size:12px;margin-top:12px;line-height:1.7}.button{border-radius:6px;min-height:39px;font-size:11px;letter-spacing:.1px}.button.secondary{background:#171b21;border-color:#323842;color:#c4ccd7}.button.secondary:hover{background:#242b33;border-color:#526044}.button.primary{color:#18240b;background:#c5f67a;font-weight:700;border-color:#d8ffa1;box-shadow:0 1px 0 #dcffad inset}.button.primary:hover:not(:disabled){background:#d2ff93;box-shadow:0 0 25px #c5f67a17}.button:disabled{opacity:.4}button:focus-visible,a:focus-visible{outline-color:#c5f67a;outline-width:2px}
.tabs{margin:30px 0 25px;gap:7px;padding-bottom:14px;border-bottom:1px solid #222831}.tab{border:1px solid transparent;border-radius:6px;padding:10px 14px;font-size:11px;color:#7c8796;gap:8px}.tab.active{background:#1c2420;border-color:#3c4b36;color:#d0edb5;font-weight:500}.tab:not(.active):hover{background:#141a20;color:#bac5d3}.tab span{background:#242d28;color:#a8c694;font:9px monospace;border-radius:3px}.powered{font:9px monospace;letter-spacing:.1px;color:#667382;margin-bottom:0;margin-right:1px}.studio-layout{grid-template-columns:minmax(345px,390px) minmax(0,1fr);gap:25px}.composer{background:linear-gradient(145deg,#15191f,#101319);border-color:#2a3039;border-radius:10px;box-shadow:0 20px 70px #0002}.composer-body{padding:24px}.section-label label,.field-title label{font-size:11px;letter-spacing:.15px;font-weight:600;color:#c7ced9}.section-label span{font:8px monospace;color:#636e7d}.field-title span{font:9px monospace;color:#626e7d}textarea,select,input[type=search]{background:#0a0e13;border-color:#303742;color:#c9d4e1;border-radius:6px}textarea{background:#0b0e13;font-size:12px;line-height:1.8;padding:14px;min-height:150px}textarea::placeholder{color:#596576}input:focus,select:focus,textarea:focus{border-color:#849a63;box-shadow:0 0 0 3px #c5f67a08}.inspiration{margin-bottom:23px}.inspiration>span{font:9px monospace;color:#636e7d}.inspiration>div{gap:7px}.inspiration button{color:#8c9bae;background:#161c23;border:1px solid #2a3540;border-radius:4px;padding:7px 9px;font-size:9px}.inspiration button:hover{background:#263421;color:#d2eabe;border-color:#596c44}.inspiration i{color:#9da8b8}.dropzone{border-color:#374031;border-radius:6px;background:linear-gradient(120deg,#171d1710,#b1d98404);padding:17px 9px}.dropzone:hover,.dropzone.dragging{background:#c5f67a09;border-color:#829e60}.dropzone>i{background:#c5f67a0b;border:1px solid #c5f67a15;color:#a4c97a;border-radius:6px;font-size:12px;padding:8px}.dropzone strong{font-size:10px;color:#9cab95}.dropzone span{font-size:8px;color:#627260}.reference-item img{border-color:#414a39}.reference-item button{background:#1b242c;border-color:#45515a;color:#e1e8f0}.divider{background:#252c35;margin:23px 0}.text-button{color:#b5d68e;font-size:9px}.model-meta{font-size:8px;color:#616e7d;margin-top:10px}.model-meta a{color:#899aab}.options-grid{gap:12px}.options-grid label{font-size:10px;color:#929fb0}select{font-size:10px;cursor:pointer}.generate-footer{background:#0d1116;border-color:#252d35;padding:19px 24px}.generate-footer .button{height:44px;font-size:11px}.generate-footer p{font-size:8px;color:#5c6879;margin-top:11px}
.preview-header{font:10px monospace;letter-spacing:.4px;color:#8e9aa8;min-height:27px;margin:0 1px 12px}.preview-header i{color:#97a682}.small-badge{background:#161c24;border:1px solid #2c3642;color:#718299;font:8px monospace;border-radius:3px;padding:5px 9px}.preview-canvas{min-height:535px;height:calc(100vh - 335px);max-height:775px;border-color:#2c343d;border-radius:10px;background-color:#0c1015;background-image:linear-gradient(#808ca209 1px,transparent 1px),linear-gradient(90deg,#808ca209 1px,transparent 1px);background-size:34px 34px;box-shadow:0 0 70px #030609 inset}.preview-canvas:before{content:'';position:absolute;left:10px;top:10px;width:18px;height:18px;border-left:1px solid #697b58;border-top:1px solid #697b58;pointer-events:none;z-index:1}.preview-canvas:after{content:'';position:absolute;right:10px;bottom:10px;width:18px;height:18px;border-right:1px solid #697b58;border-bottom:1px solid #697b58;pointer-events:none;z-index:1}.empty-preview{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;background:radial-gradient(ellipse at 50% 34%,#a7d77a0b,transparent 48%);padding:28px 15px}.portal-art{width:275px;height:207px;position:relative;margin:0 auto 10px;filter:drop-shadow(0 0 30px #b6ed7b12)}.portal-art svg{width:100%;height:100%}.portal-coordinate{position:absolute;top:49%;font:7px monospace;color:#4c5964;letter-spacing:1px}.portal-coordinate.left{left:-34px}.portal-coordinate.right{right:-37px}.canvas-label{font:8px monospace;letter-spacing:2.6px;color:#728b5c;margin:12px 0}.empty-preview h2,.generating-preview h2{font:400 27px/1.3 'Space Grotesk',sans-serif;letter-spacing:-1px;color:#d5dee8}.empty-preview p{color:#67778b;font-size:11px;line-height:1.9;margin-top:12px}.empty-caption{display:flex;align-items:center;gap:8px;background:#101914;border:1px solid #2b3b25;border-radius:30px;padding:7px 11px;font:8px monospace;color:#789167;margin-top:26px}.studio-note{padding:20px 8px;color:#5e6c7d;font-size:9px;gap:10px;line-height:1.8}.studio-note>i{color:#697c56;font-size:11px}.studio-note strong{color:#8b9b83}.generating-preview>p{color:#85999a;font-size:11px}.generation-orbit{background:#c5f67a08;border-color:#88b54d44;color:#c5f67a;box-shadow:0 0 40px #9ec94c0b}.generation-orbit:after{border-top-color:#c5f67a;inset:-12px;animation-duration:3s}.elapsed{background:#212e1c;color:#abc98a;font:11px monospace;border:1px solid #3e5431}.generating-preview p.muted{color:#6e7e92}.result-footer strong{color:#b9c8d8;font-weight:500}.result-footer span{color:#698093;font:9px monospace}.result-error{color:#d59892;background:#301c1b66;border:1px solid #653e3c;border-radius:10px;font-size:12px}.result-image{border-radius:9px}.notice{background:#252012;border-color:#564725;color:#c7b074;border-radius:6px;font-size:11px}.notice.error{background:#291816;border-color:#61352f;color:#e4a29b}.page-footer{font:8px monospace;letter-spacing:1.1px;color:#3f4e60;border-color:#212832;padding:23px 0;margin-top:26px}
.gallery-heading h2{font:500 24px 'Space Grotesk',sans-serif;letter-spacing:-.8px}.gallery-heading p{color:#6e7c91;font-size:11px}.gallery-card{background:#121820;border-color:#2b3543;border-radius:8px}.gallery-card:hover{border-color:#697f4e;box-shadow:0 3px 25px #0004}.gallery-card img{background:#18212e}.gallery-card-info strong{color:#b4c6dc;font-weight:500}.gallery-card-info p{color:#788ba3}.gallery-card-info small{color:#52667f;font:8px monospace}.gallery-placeholder{background:radial-gradient(ellipse,#263323,#111922);color:#829b66;font-size:11px}.gallery-placeholder i{color:#b5d98c}.gallery-empty{background:#11171e;border-color:#303d4c;color:#5f748c}.gallery-empty h3{color:#9fb4c9;font:500 20px 'Space Grotesk',sans-serif}.gallery-empty p{color:#667a92}.gallery-empty i{color:#6f8658}
dialog{background:#11161d;border-color:#3b4654;border-radius:13px;color:#c3cfdc;box-shadow:0 20px 140px #000b}dialog::backdrop{background:#02050ad9;backdrop-filter:blur(9px)}.dialog-header h2{font:500 27px 'Space Grotesk',sans-serif;letter-spacing:-.9px}.dialog-header p:not(.eyebrow){color:#708299}.icon-button{background:#1d2733;border-color:#344355;color:#a1b3c7;border-radius:5px}.search-box>i{color:#769057}.models-status{color:#738863;font:9px monospace;min-height:35px;line-height:1.6}.model-row{border-color:#263240;padding:15px 0}.provider-icon{background:#1e30252e;border-color:#3e5631;color:#adc886;border-radius:6px;font:600 14px 'Space Grotesk',sans-serif}.model-row h3{font-size:11px;color:#b3c5dc}.model-row p{font:8px/1.6 monospace;color:#5a748d}.model-row button{font-size:9px}.model-row button.linked{background:#22301b;color:#b3d091;border-color:#405a2e}.dialog-footer{background:#0d131a;border-color:#293746;color:#566f85;font-size:8px}.dialog-footer a{color:#94b775}
@media(min-width:1600px){.page{padding-top:44px}.preview-canvas{min-height:580px}}@media(max-width:1050px){.page{padding:30px 26px 0}.topbar{padding:0 26px}.studio-layout{grid-template-columns:330px minmax(0,1fr);gap:20px}h1{font-size:39px}.composer-body{padding:21px}.generate-footer{padding:19px 21px}.preview-canvas{min-height:535px}.portal-art{width:225px;height:175px}.portal-coordinate.left{left:-13px}.portal-coordinate.right{right:-16px}.empty-preview h2{font-size:23px}.powered{display:none}}
@media(min-width:741px) and (max-height:1000px){.topbar{height:62px}.page{padding-top:25px}h1{font-size:39px}.eyebrow{margin-bottom:9px}.subtitle{margin-top:8px}.tabs{margin-top:21px;margin-bottom:18px;padding-bottom:11px}.composer-body{padding:20px}textarea{height:112px;min-height:112px;display:block}.inspiration{margin:9px 0 16px;display:flex;align-items:center;gap:9px}.inspiration>div{margin-top:0}.inspiration>span{font-size:8px}.inspiration button{padding:6px 7px}.dropzone{position:relative;min-height:65px;padding:15px 10px 15px 46px;align-items:flex-start;justify-content:center}.dropzone>i{position:absolute;left:10px;margin:0}.dropzone span{font-size:7.5px}.divider{margin:15px 0}.field-title{margin-bottom:9px}.model-meta{margin:8px 0 15px}select{height:37px}.generate-footer{padding:14px 20px}.preview-canvas{min-height:470px;height:calc(100vh - 338px)}.studio-note{padding:15px 7px}.page-footer{margin-top:14px}}
@media(max-width:740px){.topbar{padding:0 18px;height:62px;gap:13px}.brand{font-size:20px}.brand-divider{display:block;height:19px}.workspace-label{display:block;font-size:8px;letter-spacing:.7px}.lab-version{display:none}.connection{font-size:8px;padding:6px 7px}.top-actions{gap:0}.page{padding:27px 16px 0}.page-heading{align-items:flex-start;gap:17px}h1{font-size:38px;letter-spacing:-1.7px}.eyebrow{font-size:8px;letter-spacing:1.3px}.subtitle{font-size:11px;line-height:1.8;max-width:310px}.tabs{margin-top:23px;margin-bottom:20px;padding-bottom:12px;gap:5px}.tab{font-size:10px;padding:9px 12px}.studio-layout{grid-template-columns:1fr;gap:25px}.composer-body{padding:21px}.preview-canvas{height:480px;min-height:420px}.portal-art{width:255px;height:193px}.empty-preview h2{font-size:25px}.gallery-heading h2{font-size:22px}.page-footer{margin-top:20px}.dialog-header h2{font-size:24px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* Tamaños de lectura: controles cómodos y ayudas legibles a escala normal. */
:root { font-size: 16px; }
.topbar { min-height: 74px; height: auto; padding: 18px 40px; gap: 22px; }
.brand { font-size: 26px; }
.brand img { width: 34px; height: 34px; }
.workspace-label { font-size: 12px; }
.lab-version { font-size: 11px; }
.connection { font-size: 12px; padding: 9px 12px; }
.back-link { font-size: 14px; color: #a4afbd; }
.page { max-width: 1780px; padding: 34px clamp(24px, 4vw, 64px) 0; }
.eyebrow { font-size: 12px; margin-bottom: 12px; }
h1 { font-size: 50px; letter-spacing: -2px; }
.subtitle { font-size: 16px; color: #a0adbe; margin-top: 12px; }
.button, .page-heading > .button { min-height: 46px; padding: 12px 18px; font-size: 15px; }
.tabs { margin: 26px 0 24px; padding-bottom: 16px; gap: 12px; }
.tab { min-height: 46px; font-size: 15px; padding: 12px 18px; color: #a0adbe; }
.tab span { font-size: 12px; padding: 3px 7px; }
.powered { font-size: 12px; color: #91a0b3; }
.studio-layout { grid-template-columns: minmax(420px, 500px) minmax(0, 1fr); gap: 32px; }
.composer { border-radius: 14px; }
.composer-body { padding: 26px; }
.section-label label, .field-title label { font-size: 15px; }
.section-label span, .field-title span { font-size: 12px; color: #9ba8b9; }
.section-label, .field-title { margin-bottom: 12px; }
textarea { height: 144px; min-height: 144px; padding: 16px; font-size: 16px; line-height: 1.65; display: block; }
textarea::placeholder { color: #92a0b3; }
.inspiration { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin: 14px 0 22px; }
.inspiration > span { font-size: 12px; color: #9ba8b9; }
.inspiration > div { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.inspiration button { font-size: 13px; padding: 9px 11px; color: #b3c0d0; }
.inspiration i { font-size: 12px; }
.dropzone { position: relative; min-height: 96px; padding: 18px 16px 18px 66px; align-items: flex-start; justify-content: center; }
.dropzone > i { position: absolute; left: 17px; margin: 0; font-size: 17px; padding: 10px; }
.dropzone strong { font-size: 15px; color: #c0d2b3; }
.dropzone span { font-size: 12px; line-height: 1.6; color: #9aa98f; }
.reference-item img { width: 76px; height: 76px; }
.reference-item button { width: 26px; height: 26px; font-size: 17px; }
.divider { margin: 23px 0; }
.text-button { font-size: 14px; padding: 5px 0; }
select { height: 48px; padding: 0 13px; font-size: 15px; }
.model-meta { font-size: 12px; line-height: 1.6; color: #9baabd; margin: 12px 0 22px; }
.model-meta a { color: #b3c4d9; }
.model-meta i { font-size: 10px; }
.options-grid { gap: 16px; }
.options-grid label { font-size: 14px; color: #b4c1d2; margin-bottom: 10px; }
.generate-footer { padding: 20px 26px; }
.generate-footer .button { height: 54px; font-size: 17px; }
.generate-footer p { font-size: 12px; line-height: 1.6; color: #97a5b9; margin-top: 12px; }
.preview-panel { position: sticky; top: 24px; min-width: 0; }
.preview-header { font-size: 14px; color: #b0bdcc; margin-bottom: 14px; gap: 12px; flex-wrap: wrap; }
.small-badge { font-size: 12px; color: #a5b6cd; padding: 7px 10px; }
.preview-canvas { min-height: 560px; height: 65vh; max-height: 880px; border-radius: 14px; }
.portal-art { width: 320px; height: 242px; }
.portal-coordinate { font-size: 10px; color: #788698; }
.canvas-label { font-size: 12px; color: #a4bf87; }
.empty-preview h2, .generating-preview h2 { font-size: 34px; }
.empty-preview p, .generating-preview > p { font-size: 16px; color: #a5b4c7; line-height: 1.7; }
.empty-caption { font-size: 12px; color: #aac78d; padding: 10px 14px; }
.studio-note { padding: 20px 8px; font-size: 13px; color: #99aac0; }
.studio-note strong { color: #bacbab; }
.studio-note > i { font-size: 15px; color: #a9c187; }
.generation-orbit { width: 94px; height: 94px; font-size: 32px; }
.elapsed { font-size: 15px; padding: 10px 15px; }
.generating-preview p.muted { font-size: 14px; color: #9cadc5; }
.result-footer strong { font-size: 15px; }
.result-footer span { font-size: 13px; color: #9fb0c6; }
.result-error, .notice { font-size: 15px; line-height: 1.6; }
.page-footer { font-size: 12px; color: #8596ac; margin-top: 30px; }
.gallery-heading h2 { font-size: 30px; }
.gallery-heading p { font-size: 15px; color: #a0b0c4; }
.gallery-card-info { padding: 20px; }
.gallery-card-info strong { font-size: 16px; color: #cfdaea; }
.gallery-card-info p { font-size: 14px; color: #a6b6cb; }
.gallery-card-info small { font-size: 12px; line-height: 1.6; color: #91a5c0; }
.gallery-placeholder, .gallery-empty p { font-size: 15px; color: #a5b8ce; }
.gallery-empty h3 { font-size: 25px; color: #c2d3e5; }
dialog { max-width: 820px; }
.dialog-header h2 { font-size: 32px; }
.dialog-header p:not(.eyebrow) { font-size: 15px; color: #a1b3ca; line-height: 1.6; }
.icon-button { width: 40px; height: 40px; font-size: 17px; }
.search-box input { height: 48px; font-size: 16px; padding-left: 42px; }
.search-box > i { top: 16px; left: 15px; font-size: 16px; }
.models-status { font-size: 13px; color: #afc29c; padding-top: 15px; padding-bottom: 15px; }
.model-row { gap: 16px; padding: 19px 0; }
.provider-icon { width: 45px; height: 45px; font-size: 20px; }
.model-row h3 { font-size: 16px; color: #ccdbed; }
.model-row p { font-size: 12px; color: #96acc7; }
.model-row button { min-height: 42px; font-size: 14px; padding: 10px 13px; }
.dialog-footer { font-size: 12px; line-height: 1.6; color: #98adc4; flex-wrap: wrap; }
.session-required p { font-size: 15px; }
@media (max-width: 1200px) {
  .studio-layout { grid-template-columns: minmax(380px, 440px) minmax(0, 1fr); gap: 24px; }
  .composer-body { padding: 22px; }
  .portal-art { width: 250px; height: 189px; }
  .empty-preview h2, .generating-preview h2 { font-size: 29px; }
  .powered { display: none; }
}
@media (max-width: 1000px) {
  .studio-layout { grid-template-columns: 1fr; }
  .preview-panel { position: static; }
  .preview-canvas { min-height: 480px; height: 65vh; }
}
@media (max-width: 740px) {
  .topbar { flex-wrap: wrap; padding: 18px 20px; gap: 12px; }
  .brand { font-size: 25px; }
  .brand-divider { display: none; }
  .workspace-label { margin-left: auto; font-size: 12px; }
  .top-actions { width: 100%; justify-content: space-between; gap: 12px; }
  .connection { font-size: 12px; }
  .back-link { display: inline; font-size: 13px; }
  .page { padding: 28px 20px 0; }
  h1 { font-size: 42px; }
  .eyebrow { font-size: 12px; letter-spacing: 1px; }
  .subtitle { font-size: 16px; max-width: none; }
  .tabs { gap: 8px; }
  .tab { font-size: 14px; padding: 12px; }
  .composer-body, .generate-footer { padding: 20px; }
  .inspiration { align-items: flex-start; flex-direction: column; }
  textarea, select { font-size: 16px; }
  .dropzone { padding: 17px 12px 17px 55px; }
  .dropzone > i { left: 11px; font-size: 14px; padding: 8px; }
  .dropzone strong { font-size: 14px; }
  .options-grid { gap: 12px; }
  .preview-canvas { min-height: 470px; height: 62vh; }
  .preview-header { font-size: 13px; }
  .portal-art { width: 240px; height: 182px; }
  .portal-coordinate.left { left: -10px; }
  .portal-coordinate.right { right: -10px; }
  .empty-preview h2, .generating-preview h2 { font-size: 29px; }
  .empty-caption { font-size: 12px; }
  .result-actions { flex-wrap: wrap; }
  .gallery-heading { flex-wrap: wrap; }
  .gallery-heading .button { font-size: 14px; }
  .gallery-heading h2 { font-size: 28px; }
  .gallery-heading p { font-size: 15px; }
  .dialog-header { padding: 22px 20px; gap: 12px; }
  .dialog-header h2 { font-size: 28px; }
  .provider-icon { display: none; }
  .model-row { gap: 10px; flex-wrap: wrap; }
  .model-row-info { min-width: 150px; }
  .model-row button { font-size: 13px; }
}

.enhance-field{display:flex;gap:10px;align-items:flex-start;margin-top:16px;cursor:pointer;font-size:10px;line-height:1.6;color:#7f8c9b}.enhance-field input{margin-top:3px;accent-color:#9fc36f}.enhance-field strong{display:block;color:#c7ced9;font-weight:600;font-size:11px}
.result-enhanced{flex-basis:100%;order:3;font-size:11px;color:#8e9aa8}.result-enhanced summary{cursor:pointer;color:#b5d68e}.result-enhanced p{margin-top:8px;line-height:1.7;max-height:160px;overflow:auto;color:#a9b5c3}.result-footer{flex-wrap:wrap}
.button.danger{color:#e4a29b;border-color:#61352f;background:#1a1212}.button.danger:hover:not(:disabled){background:#291816}
#result-image{cursor:grab}#result-image:active{cursor:grabbing}
