.nv-studio-app{--bg:#0b0b0c;--panel:#141416;--line:#2b2b2f;--text:#f1eee7;--muted:#98989f;--gold:#b89355;--accent:#f4f0e8;margin:0;background:var(--bg);color:var(--text);font:13px/1.4 Inter,Arial,sans-serif;overflow:hidden}
.nv-studio-app,.nv-studio-app *{box-sizing:border-box}
.nv-studio-app button,.nv-studio-app select,.nv-studio-app .exit-button,.nv-studio-app input,.nv-studio-app textarea{font:inherit}
.studio-topbar{height:58px;display:flex;align-items:center;gap:12px;padding:0 16px;border-bottom:1px solid var(--line);background:#101011;position:relative;z-index:5}
.studio-brand{font-weight:700;letter-spacing:.12em;margin-right:8px;white-space:nowrap}.studio-brand span{color:var(--gold);font-weight:400}
.studio-topbar label{display:flex;align-items:center;gap:7px;color:var(--muted)}
.studio-topbar button,.studio-topbar select,.exit-button{border:1px solid var(--line);background:#19191b;color:var(--text);padding:8px 11px;border-radius:6px;text-decoration:none;white-space:nowrap}
.studio-topbar button:hover,.exit-button:hover{border-color:#555}.mode-switch,.zoom-switch{display:flex}.mode-switch button,.zoom-switch button{border-radius:0}.mode-switch button:first-child,.zoom-switch button:first-child{border-radius:6px 0 0 6px}.mode-switch button:last-child,.zoom-switch button:last-child{border-radius:0 6px 6px 0}.is-active{background:var(--accent)!important;color:#111!important}
.studio-status{height:30px;display:grid;place-items:center;background:#1b1813;color:#d8b77c;font-size:11px;letter-spacing:.16em;border-bottom:1px solid #30291e}
.studio-layout{height:calc(100vh - 88px);display:grid;grid-template-columns:310px minmax(0,1fr)}
.studio-sidebar{background:var(--panel);border-right:1px solid var(--line);padding:18px;overflow:auto}.studio-sidebar section{margin-bottom:24px}.studio-sidebar h2{font-size:11px;letter-spacing:.15em;color:var(--muted);margin:0 0 12px}.empty-state{color:var(--muted);padding:15px;border:1px dashed var(--line);border-radius:6px}.studio-sidebar code{display:block;color:#b6b6bd;margin-top:7px;word-break:break-all;font-size:11px}.selection-kind{display:inline-block;margin-left:8px;padding:2px 6px;border:1px solid #3b3b40;border-radius:10px;color:#aaaab1;font-size:9px;letter-spacing:.12em;text-transform:uppercase;vertical-align:1px}.inheritance-note{margin:-2px 0 14px;padding:9px 10px;border-left:2px solid var(--gold);background:#1b1813;color:#c8b99e;font-size:11px}
.field{display:grid;gap:6px;margin-bottom:12px}.field label{color:#b9b9bf}.field input,.field textarea,.field select{width:100%;border:1px solid var(--line);background:#0e0e10;color:var(--text);padding:8px;border-radius:5px}.field input[type=color]{height:38px;padding:4px}.field textarea{min-height:82px;resize:vertical}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}.field-help{margin-top:-7px;margin-bottom:12px;color:#777780;font-size:10px}.danger-soft{width:100%;border:1px solid #624747;background:#241919;color:#e9b6b6;padding:9px;border-radius:6px}
.preview-area{min-width:0;min-height:0;display:grid;grid-template-rows:44px minmax(0,1fr);background:#080809}.preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;border-bottom:1px solid var(--line);background:#101011;color:#d7d7dc}.preview-toolbar>div:first-child{display:flex;align-items:baseline;gap:9px;min-width:0}.preview-toolbar strong{font-size:11px;letter-spacing:.09em;white-space:nowrap}.preview-toolbar span{font-size:10px;color:var(--muted);white-space:nowrap}.zoom-switch button{border:1px solid var(--line);background:#19191b;color:var(--text);padding:5px 9px;font-size:10px}
.preview-viewport{min-width:0;min-height:0;overflow:auto;padding:24px;display:flex;justify-content:center;align-items:flex-start}.device-holder{position:relative;flex:0 0 auto}.desktop-holder{width:min(1440px,100%);height:100%}.device-frame{background:white;box-shadow:0 16px 60px #000;transform-origin:top left}.device-frame.desktop{width:100%;height:100%}.device-frame.mobile{box-sizing:content-box;width:402px;height:874px;border:10px solid #252527;border-radius:42px;overflow:hidden;box-shadow:0 18px 70px #000}.device-frame.mobile::before{content:"";position:absolute;z-index:3;top:15px;left:50%;width:104px;height:29px;transform:translateX(-50%);border-radius:18px;background:#111;pointer-events:none;opacity:.92}.device-frame.mobile{position:relative}#preview{width:100%;height:100%;border:0;background:white;display:block;border-radius:inherit}.device-frame.mobile #preview{border-radius:31px}
@media (max-width:900px){.studio-topbar{gap:7px;padding-inline:10px}.studio-brand{margin-right:0}.studio-topbar button,.studio-topbar select,.exit-button{padding:7px 8px}.studio-layout{grid-template-columns:270px minmax(0,1fr)}}
@media (max-width:700px){.nv-studio-app{overflow:auto}.studio-topbar{height:auto;min-height:58px;flex-wrap:wrap;padding:9px 10px}.studio-brand{width:100%;padding-bottom:2px}.page-picker{flex:1 1 100%}.page-picker select{flex:1}.studio-status{position:sticky;top:0;z-index:4}.studio-layout{height:auto;min-height:calc(100vh - 118px);display:flex;flex-direction:column}.preview-area{order:1;height:64vh;min-height:480px}.studio-sidebar{order:2;border-right:0;border-top:1px solid var(--line);overflow:visible;padding-bottom:max(26px,env(safe-area-inset-bottom))}.preview-toolbar{padding-inline:10px}.preview-toolbar>div:first-child{display:grid;gap:0}.preview-viewport{padding:14px}.field-row{grid-template-columns:1fr 1fr}}
@media (max-width:430px){.studio-topbar button,.studio-topbar select,.exit-button{font-size:11px}.mode-switch{order:3}.preview-area{height:60vh;min-height:430px}.preview-toolbar span{font-size:9px}.zoom-switch button{padding:5px 7px}}
.project-state{display:inline-flex;align-items:center;gap:6px;max-width:180px;padding:6px 9px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.project-state::before{content:"";width:7px;height:7px;border-radius:50%;background:#777;flex:0 0 auto}.project-state[data-state="linked"]{color:#cbd9c3;border-color:#40513b;background:#151b13}.project-state[data-state="linked"]::before{background:#82b36e}.project-state[data-state="error"]{color:#e0b0b0;border-color:#624747;background:#241919}.project-state[data-state="error"]::before{background:#d46d6d}.project-state[data-state="download"]{color:#d8c49b;border-color:#5b4b2e;background:#211b12}.project-state[data-state="download"]::before{background:#c69a4b}.apply-button{border-color:#78603a!important;background:#2b2114!important;color:#f1d6a5!important}.apply-button:disabled{opacity:.5;cursor:wait}@media (max-width:900px){.project-state{display:none}}@media (max-width:700px){#bind-project{order:5}.apply-button{order:6}.exit-button{order:7}}

.measurement-control{display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:10px;align-items:center}.measurement-control input[type=range]{width:100%;margin:0;padding:0;background:transparent;border:0;accent-color:var(--gold)}.measurement-number{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border:1px solid var(--line);background:#0e0e10;border-radius:5px;overflow:hidden}.measurement-number input[type=number]{width:100%;min-width:0;border:0;background:transparent;padding:8px 4px 8px 8px;border-radius:0}.measurement-number span{padding:0 8px 0 4px;color:var(--muted);font-size:11px;pointer-events:none}.measurement-number:focus-within{border-color:#666}.measurement-field label{display:flex;justify-content:space-between}.measurement-field label::after{content:"desliza o usa las flechas";color:#707078;font-size:9px;letter-spacing:.03em}
@media (max-width:430px){.measurement-control{grid-template-columns:minmax(0,1fr) 82px}}

/* Neverlan Studio 2.0: estado publicado, borradores y cambios pendientes */
.studio-statusbar{min-height:38px;display:flex;align-items:stretch;border-bottom:1px solid var(--line);background:#121213}
.studio-context{min-width:0;flex:1;display:flex;align-items:center;gap:12px;padding:7px 16px;color:var(--muted);font-size:10px;white-space:nowrap;overflow:hidden}
.studio-context .context-label{color:#bda373;letter-spacing:.13em;font-weight:700}
.studio-context strong{color:var(--text);font-size:11px}
.studio-context span{overflow:hidden;text-overflow:ellipsis}
.studio-statusbar .studio-status{height:auto;min-width:245px;padding:0 16px;border:0;border-left:1px solid var(--line);font-weight:700}
.studio-status[data-state="published"]{background:#151b13;color:#a8ca99}
.studio-status[data-state="dirty"]{background:#211b12;color:#e1bb74}
.studio-status[data-state="message"]{background:#1b1813;color:#d8b77c}
.draft-banner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 16px;border-bottom:1px solid #5b4b2e;background:#211b12;color:#e4d1aa}
.draft-banner>div:first-child{display:flex;align-items:baseline;gap:10px}.draft-banner span{color:#a99572;font-size:10px}
.draft-actions{display:flex;gap:7px}.draft-actions button{border:1px solid #665538;background:#2b2114;color:#ead5ad;padding:6px 9px;border-radius:5px}
.nv-studio-app:has(.draft-banner:not([hidden])) .studio-layout{height:calc(100vh - 136px)}
.nv-studio-app:not(:has(.draft-banner:not([hidden]))) .studio-layout{height:calc(100vh - 96px)}
@media (max-width:700px){.studio-statusbar{position:sticky;top:0;z-index:4;display:block}.studio-context{padding:7px 10px;gap:8px;overflow-x:auto}.studio-statusbar .studio-status{min-height:28px;border-left:0;border-top:1px solid var(--line)}.draft-banner{align-items:flex-start;flex-direction:column;gap:8px}.draft-banner>div:first-child{display:grid;gap:2px}.nv-studio-app .studio-layout{height:auto!important}}


/* Studio 2.4: gestor estable de contenido, imágenes y audio */
.media-manager-section{padding-top:18px;border-top:1px solid var(--line)}
.media-manager-section select,.media-manager-section input{width:100%;border:1px solid var(--line);background:#0e0e10;color:var(--text);padding:8px;border-radius:5px}
.media-file-row{display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;gap:9px;margin:10px 0}
.media-file-row button{border:1px solid #4c4539;background:#211b12;color:#e6d0a7;padding:8px 9px;border-radius:5px;text-align:left}
.media-file-row button:hover{border-color:#78603a}
.media-file-row span{min-width:0;color:#9b9ba3;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.media-checkbox{display:flex;align-items:center;gap:9px;margin:14px 0;color:#c6c6cb}.media-checkbox input{width:auto;accent-color:var(--gold)}
.media-paths{display:grid;grid-template-columns:48px minmax(0,1fr);gap:4px 8px;padding:9px 10px;margin:10px 0;border:1px solid #28282c;background:#101012;border-radius:5px;color:#85858d;font:10px/1.45 ui-monospace,SFMono-Regular,Consolas,monospace;word-break:break-all}
.media-paths strong{color:#b7a37e;font-weight:500}
.media-manager-section[aria-busy="true"]{opacity:.65;pointer-events:none}


/* Studio 2.5 · contenido, footer y logo */
.global-manager-section textarea,
.media-manager-section textarea {
  width: 100%;
  min-height: 120px;
  resize: vertical;
}
.social-list {
  display: grid;
  gap: 12px;
  margin-bottom: 12px;
}
.social-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
  gap: 8px;
  padding: 12px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 12px;
  background: rgba(255,255,255,.025);
}
.social-editor .social-wide { grid-column: 1 / -1; }
.social-editor label {
  display: grid;
  gap: 5px;
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(255,255,255,.55);
}
.social-editor input[type="text"],
.social-editor input[type="url"],
.social-editor select {
  width: 100%;
}
.social-actions {
  grid-column: 1 / -1;
  display: flex;
  gap: 6px;
  justify-content: flex-end;
}
.social-actions button,
.secondary-action {
  min-height: 32px;
  padding: 0 10px;
}
.social-visible {
  display: flex !important;
  align-items: center;
  grid-template-columns: none !important;
}
.social-visible input { width: auto; }
.range-number-pair {
  display: grid;
  grid-template-columns: 1fr 74px;
  gap: 8px;
  align-items: center;
}


/* Studio 2.5.2 · separación visual Header / Footer */
.studio-area-section {
  border-top: 1px solid var(--line);
  padding-top: 18px;
}
.studio-area-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 13px;
}
.studio-area-heading h2 {
  margin: 0;
  color: var(--accent);
  font-size: 12px;
  letter-spacing: .18em;
}
.studio-area-heading span {
  color: var(--muted);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.manager-subsection {
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: rgba(255,255,255,.018);
}
.manager-subsection h3 {
  margin: 0 0 13px;
  color: #c9c4bb;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.studio-area-section[data-area="header"] .manager-subsection {
  border-left: 2px solid rgba(184,147,85,.72);
}
.studio-area-section[data-area="footer"] .manager-subsection {
  border-left: 2px solid rgba(152,152,159,.58);
}

/* Studio 2.8 · inspector seguro y propiedades progresivas */
.advanced-properties{margin:4px 0 12px;border:1px solid var(--line);border-radius:6px;background:#101012;overflow:hidden}
.advanced-properties summary{position:relative;padding:10px 34px 10px 11px;color:#aaaab1;font-size:10px;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;list-style:none;user-select:none}
.advanced-properties summary::-webkit-details-marker{display:none}
.advanced-properties summary::after{content:"+";position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--gold);font-size:15px;font-weight:400}
.advanced-properties[open] summary::after{content:"−"}
.advanced-properties[open] summary{border-bottom:1px solid var(--line);color:#d0cdc7}
.advanced-properties__body{padding:12px 11px 1px}
.container-notice{display:grid;gap:5px;margin:0 0 12px;padding:11px;border-left:2px solid #6f654f;background:#191713;color:#b9b4aa;font-size:11px}
.container-notice strong{color:#d8c9aa;font-size:10px;letter-spacing:.08em;text-transform:uppercase}
.container-notice span{line-height:1.45}



/* Studio 2.9 · historial y recuperación de elementos ocultos */
.history-actions{display:flex;gap:5px}
.history-actions button{padding-inline:9px}
.history-actions button:disabled{opacity:.38;cursor:not-allowed;border-color:var(--line)}
.hidden-elements-section{border-top:1px solid var(--line);padding-top:18px}
.hidden-elements-section h2{display:flex;align-items:center;justify-content:space-between;gap:8px}
.hidden-elements-section h2 span{color:var(--gold);font-size:10px;letter-spacing:0}
.hidden-elements-list{display:grid;gap:7px;margin-bottom:9px}
.hidden-element-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;align-items:center;padding:9px 10px;border:1px solid #333338;border-radius:6px;background:#101012}
.hidden-element-copy{min-width:0;display:grid;gap:2px}
.hidden-element-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:#dedad2}
.hidden-element-copy code{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#777780;font-size:9px}
.hidden-element-item button{border:1px solid #5b4b2e;background:#211b12;color:#e6d0a7;padding:6px 8px;border-radius:5px}
@media (max-width:900px){.history-actions button{font-size:0;padding:7px 9px}.history-actions #undo-button::before{content:"↶";font-size:14px}.history-actions #redo-button::before{content:"↷";font-size:14px}}


/* Studio 3.0 · fondos editables por sección */
.background-manager-section[data-area="background"] .manager-subsection{border-left:2px solid rgba(114,145,126,.72)}
.color-value-pair{display:grid;grid-template-columns:46px minmax(0,1fr);gap:8px;align-items:center}
.color-value-pair input[type="color"]{width:46px;height:36px;padding:3px;border:1px solid var(--line);border-radius:5px;background:#0e0e10;cursor:pointer}
.color-value-pair input[type="text"]{width:100%;font:11px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;text-transform:uppercase}
.background-manager-section .secondary-action{width:100%;margin-top:3px}
.background-manager-section[hidden]{display:none!important}


/* Studio 4.0 · editor global del menú */
.studio-area-section[data-area="menu"] .manager-subsection,
.studio-area-section[data-area="menu"] .advanced-properties{border-left:2px solid rgba(126,111,160,.76)}
.menu-manager-section .menu-preview-subsection{margin-bottom:12px}
.menu-preview-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.menu-preview-actions .secondary-action{width:100%}
.menu-manager-section .menu-editor-group{margin-bottom:10px}
.menu-manager-section .menu-editor-group .field:last-child{margin-bottom:8px}
.menu-manager-section select,
.menu-manager-section input[type="number"],
.menu-manager-section input[type="text"]{width:100%;border:1px solid var(--line);background:#0e0e10;color:var(--text);padding:8px;border-radius:5px}
.menu-manager-section select:disabled,
.menu-manager-section input:disabled{opacity:.42;cursor:not-allowed}
.menu-manager-section .menu-mobile-inheritance{margin-bottom:10px}
.menu-manager-section .menu-reset-all{margin-top:10px}
.menu-manager-section .color-value-pair{margin-bottom:2px}
.menu-manager-section .inheritance-note{margin:3px 0 0}
.menu-manager-section[data-mobile-inherited="true"] [data-menu-key],
.menu-manager-section[data-mobile-inherited="true"] [data-menu-item-key],
.menu-manager-section[data-mobile-inherited="true"] #menu-item-inherit-colors,
.menu-manager-section[data-mobile-inherited="true"] #menu-reset-item{pointer-events:none;opacity:.42}
@media (max-width:430px){.menu-preview-actions{grid-template-columns:1fr}}