/* ===== Regras incorporadas de admin-shell.css ===== */
/* Gilmar Amaro — interface administrativa: hierarquia simples, superfícies leves e foco no trabalho. */
:root {
  --shell-bg: var(--ui-bg, #eee6d3);
  --shell-text: var(--ui-text, #0e2d3a);
  --shell-heading: var(--ui-heading, #0e2d3a);
  --shell-muted: var(--ui-muted, #627a7e);
  --shell-panel: var(--ui-surface, #f7f1e5);
  --shell-sidebar: var(--ui-sidebar, #e5dcc8);
  --shell-line: var(--ui-divider, #d0c4ac);
  --shell-hover: var(--ui-hover, #dcd1ba);
  --shell-accent: var(--ui-accent, #c0924d);
  --shell-radius: 16px;
}

body.admin-shell-ready { background: var(--shell-bg) ; color: var(--shell-text) ; }
body.admin-shell-ready .admin-header { display: none ; }
body.admin-shell-ready button,
body.admin-shell-ready input,
body.admin-shell-ready select,
body.admin-shell-ready textarea { font-family: inherit; }
body.admin-shell-ready button { letter-spacing: normal; }
body.admin-shell-ready button:focus-visible,
body.admin-shell-ready a:focus-visible,
body.admin-shell-ready summary:focus-visible,
body.admin-shell-ready input:focus-visible,
body.admin-shell-ready select:focus-visible,
body.admin-shell-ready textarea:focus-visible { outline: 2px solid var(--shell-accent) ; outline-offset: 2px ; }

.admin-shell-main {
  display: grid ;
  grid-template-columns: 236px minmax(0, 1fr) ;
  align-items: start ;
  gap: 20px ;
  width: calc(100% - 40px) ;
  max-width: none ;
  margin: 16px auto 28px ;
  padding: 0 ;
}
.admin-sidebar {
  position: sticky ;
  top: 16px ;
  display: flex ;
  flex-direction: column ;
  gap: 22px ;
  min-width: 0 ;
  min-height: calc(100vh - 32px) ;
  height: calc(100vh - 32px) ;
  padding: 18px 12px 12px ;
  overflow: auto ;
  border: 1px solid var(--shell-line) ;
  border-radius: 18px ;
  background: var(--shell-sidebar) ;
  color: var(--shell-text) ;
  box-shadow: 0 10px 28px rgba(14, 45, 58, .04) ;
}
.sidebar-brand {
  display: flex ;
  align-items: center ;
  gap: 10px ;
  min-width: 0 ;
  padding: 3px 6px 17px ;
  border: 0 ;
  border-bottom: 1px solid var(--shell-line) ;
  border-radius: 0 ;
  color: var(--shell-text) ;
  text-decoration: none ;
}
.sidebar-monogram {
  display: grid ;
  place-items: center ;
  flex: 0 0 40px ;
  width: 40px ;
  height: 40px ;
  border-radius: 12px ;
  background: var(--shell-accent) ;
  color: #171717 ;
  font: 22px var(--display, Arial, sans-serif) ;
}
.sidebar-brand-copy { display: block; min-width: 0; }
.sidebar-brand strong { display: block ; font: 18px var(--display, Arial, sans-serif) ; letter-spacing: -.025em ; color: var(--shell-heading) ; line-height: 1.25 ; }
.sidebar-brand small { display: block ; margin-top: 4px ; color: var(--shell-muted) ; font-size: 8px ; letter-spacing: .09em ; line-height: 1.4 ; }
.admin-nav { display: grid ; gap: 4px ; min-width: 0 ; }
.admin-nav-item {
  display: flex ;
  align-items: center ;
  gap: 10px ;
  width: 100% ;
  min-width: 0 ;
  padding: 10px 10px ;
  border: 1px solid transparent ;
  border-radius: 10px ;
  background: transparent ;
  color: var(--shell-text) ;
  text-align: left ;
  cursor: pointer ;
  transition: background .16s ease, border-color .16s ease, transform .16s ease ;
}
.admin-nav-item:hover { background: var(--shell-hover) ; border-color: var(--shell-line) ; }
.admin-nav-item.active { background: var(--shell-panel) ; border-color: var(--shell-line) ; box-shadow: inset 3px 0 0 var(--shell-accent) ; color: var(--shell-heading) ; }
.nav-symbol { flex: 0 0 19px ; width: 19px ; height: 19px ; color: var(--ui-icon, var(--shell-accent)) ; }
.nav-item-copy { display: grid; gap: 3px; min-width: 0; }
.nav-item-label { display: block; font-size: 12px; font-weight: 680; line-height: 1.25; }
.nav-item-description { display: block; font-size: 10px; font-weight: 400; color: var(--shell-muted); line-height: 1.35; }
.admin-nav-item.active .nav-item-description { color: var(--shell-muted); }
.sidebar-bottom { margin-top: auto ; padding: 13px 8px 5px ; border: 0 ; border-top: 1px solid var(--shell-line) ; color: var(--shell-muted) ; font-size: 11px ; }
.sidebar-bottom a { color: inherit ; text-decoration: none ; }
.sidebar-bottom a:hover { color: var(--shell-heading) ; }

.admin-workspace { min-width: 0 ; padding: 0 ; }
.workspace-topbar {
  display: flex ;
  align-items: center ;
  justify-content: space-between ;
  gap: 16px ;
  min-height: 64px ;
  margin: 0 0 16px ;
  padding: 4px 2px 14px ;
  border-bottom: 1px solid var(--shell-line) ;
}
.workspace-topbar .eyebrow { display: block; margin: 0 0 3px ; color: var(--shell-muted) ; font-size: 9px ; letter-spacing: .13em ; }
.workspace-topbar h1 { margin: 0 ; color: var(--shell-heading) ; font: 29px/1.15 var(--display, Arial, sans-serif) ; letter-spacing: -.02em ; }
.workspace-status { display: inline-flex ; align-items: center ; gap: 7px ; padding: 7px 10px ; border: 1px solid var(--shell-line) ; border-radius: 999px ; background: var(--shell-panel) ; color: var(--shell-muted) ; font-size: 10px ; white-space: nowrap; }
.workspace-status svg { width: 14px; height: 14px; color: var(--shell-muted); }
.workspace-content { min-width: 0 ; max-width: none ; }
.workspace-content > [hidden],
.unified-editor-pane[hidden],
.editor-subpane[hidden] { display: none ; }
.workspace-content > .preferences-view,
.workspace-content > .projects-view,
.workspace-content > .analytics-view,
.workspace-content > .security-view { min-width: 0; }

/* Overview */
.overview-intro { max-width: none ; margin: 0 0 18px ; padding: 8px 3px 0 ; }
.overview-intro .eyebrow { margin: 0 0 8px ; font-size: 9px ; letter-spacing: .13em ; }
.overview-intro h1 { margin: 0 0 10px ; color: var(--shell-heading) ; font: clamp(34px, 3.4vw, 46px)/1.02 var(--display, Arial, sans-serif) ; letter-spacing: -.035em ; }
.overview-intro h1 span { color: var(--shell-accent) ; }
.overview-intro > p:last-child { max-width: 680px ; margin: 0 ; color: var(--shell-muted) ; font-size: 13px ; line-height: 1.65 ; }
.quick-actions { margin: 22px 0 20px; }
.quick-actions-heading { display: block; margin-bottom: 12px; }
.quick-actions-heading .eyebrow { margin: 0 0 5px; font-size: 9px; letter-spacing: .13em; color: var(--shell-muted); }
.quick-actions-heading h2 { margin: 0; color: var(--shell-heading); font: 24px/1.15 var(--display, Arial, sans-serif); letter-spacing: -.02em; }
.quick-actions-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.quick-action-card { display: grid ; grid-template-columns: 38px minmax(0, 1fr) 16px ; align-items: center ; gap: 11px ; min-width: 0 ; min-height: 112px ; padding: 16px ; border: 1px solid var(--shell-line) ; border-radius: 14px ; background: var(--shell-panel) ; color: var(--shell-text) ; text-align: left ; white-space: normal ; box-shadow: 0 5px 18px rgba(14, 45, 58, .025) ; }
.quick-action-card:hover { background: var(--shell-hover) ; transform: translateY(-1px); }
.quick-action-icon { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--shell-line); border-radius: 11px; color: var(--ui-icon, var(--shell-accent)); }
.quick-action-icon svg { width: 19px; height: 19px; }
.quick-action-copy { display: grid; gap: 5px; min-width: 0; }
.quick-action-copy strong { color: var(--shell-heading); font-size: 12px; line-height: 1.35; }
.quick-action-copy small { color: var(--shell-muted) ; font-size: 10px ; line-height: 1.45 ; }
.quick-action-arrow { width: 15px; height: 15px; color: var(--shell-muted); }
.connection-card { margin: 22px 0 0 ; padding: 16px ; border: 1px solid var(--shell-line) ; border-radius: 14px ; background: var(--shell-panel) ; color: var(--shell-text) ; font-size: 12px ; }
.connection-heading { display: flex; align-items: center; gap: 9px; font-size: 13px; font-weight: 750; color: var(--shell-heading); }
.connection-heading svg { width: 19px; height: 19px; color: var(--ui-icon, var(--shell-accent)); }
.connection-summary { margin: 8px 0 12px ; color: var(--shell-muted) ; line-height: 1.55 ; }
.connection-details { margin: 10px 0 0; padding-top: 10px; border-top: 1px solid var(--shell-line); }
.connection-details summary { color: var(--shell-muted); font-size: 11px; font-weight: 650; cursor: pointer; }
.connection-details > p { margin: 10px 0 ; font-size: 11px ; line-height: 1.6 ; overflow-wrap: anywhere; }
.connection-card .supabase-diagnostic-panel { display: grid; gap: 8px; margin-top: 13px; }
.connection-card .supabase-diagnostic-button { justify-self: start; }

/* Editor: smaller controls area and generous live preview. */
.editor-page-heading { display: flex; align-items: start; justify-content: space-between; gap: 10px; margin: 0 0 12px; }
.editor-page-heading .eyebrow { margin: 0 0 3px; font-size: 9px; letter-spacing: .13em; color: var(--shell-muted); }
.editor-page-copy { margin: 0; color: var(--shell-muted); font-size: 12px; line-height: 1.5; }
.unified-site-editor { display: grid ; grid-template-columns: minmax(410px, .78fr) minmax(0, 1.22fr) ; gap: 14px ; align-items: start ; width: 100% ; min-width: 0 ; }
.unified-editor-tools { display: grid ; grid-template-columns: 136px minmax(0, 1fr) ; align-items: stretch ; min-width: 0 ; border: 1px solid var(--shell-line) ; border-radius: var(--shell-radius) ; overflow: hidden ; background: var(--shell-panel) ; }
.unified-editor-tabs { display: flex ; flex-direction: column ; align-items: stretch ; gap: 4px ; min-width: 0 ; min-height: 100% ; max-height: calc(100vh - 160px) ; overflow: auto ; overscroll-behavior: contain; padding: 8px ; border-right: 1px solid var(--shell-line) ; background: var(--shell-sidebar) ; }
.editor-tab-button { display: flex ; align-items: center ; gap: 9px ; width: 100% ; min-width: 0 ; min-height: 42px ; padding: 9px 8px ; border: 1px solid transparent ; border-radius: 9px ; background: transparent ; color: var(--shell-text) ; text-align: left ; white-space: normal ; cursor: pointer; }
.editor-tab-button:hover { background: var(--shell-hover) ; }
.editor-tab-button.active { border-color: var(--shell-line) ; background: var(--shell-panel) ; box-shadow: inset 2px 0 0 var(--shell-accent) ; color: var(--shell-heading) ; font-weight: 700 ; }
.editor-tab-icon { display: block; flex: 0 0 18px; width: 18px; height: 18px; color: var(--ui-icon, var(--shell-accent)); }
.editor-tab-label { min-width: 0; color: inherit; font-size: 11px; line-height: 1.3; overflow-wrap: anywhere; }
.unified-editor-panes { min-width: 0 ; max-height: calc(100vh - 160px) ; overflow: auto ; overscroll-behavior: contain; padding: 12px ; scrollbar-gutter: stable; }
.unified-editor-pane { min-width: 0; outline-offset: 3px; }
.unified-editor-pane > .panel { display: block ; max-width: none ; margin: 0 ; padding: 0 ; border: 0 ; border-radius: 0 ; box-shadow: none ; background: transparent ; color: var(--shell-text) ; }
.unified-editor-pane .panel-heading { margin: 0 0 13px ; }
.unified-editor-pane .panel-heading .eyebrow { margin: 0 0 5px ; color: var(--shell-muted) ; font-size: 9px ; letter-spacing: .1em ; }
.unified-editor-pane .panel-heading h2 { margin: 0 0 6px ; color: var(--shell-heading) ; font-size: 20px ; line-height: 1.2 ; letter-spacing: -.015em ; }
.unified-editor-pane .panel-heading p:not(.eyebrow), .unified-editor-pane .subcopy { color: var(--shell-muted) ; font-size: 11px ; line-height: 1.5 ; }
.unified-editor-pane label, .unified-editor-pane .visual-inspector label, .unified-editor-pane .visual-property-group label { color: var(--shell-text) ; font-size: 11px ; font-weight: 650 ; line-height: 1.4 ; }
.unified-editor-pane input:not([type=checkbox]):not([type=radio]):not([type=range]),
.unified-editor-pane select,
.unified-editor-pane textarea { width: 100%; min-width: 0; min-height: 35px; padding: 8px 9px ; border: 1px solid var(--shell-line) ; border-radius: 8px ; background: var(--shell-panel) ; color: var(--shell-text) ; font: inherit ; font-size: 12px ; }
.unified-editor-pane input[type=range] { width: 100%; accent-color: var(--shell-accent); }
.unified-editor-pane input[type=checkbox], .unified-editor-pane input[type=radio] { accent-color: var(--shell-accent); }
.unified-editor-pane input[type=color] { width: 42px; min-width: 42px; min-height: 34px; padding: 3px ; border: 1px solid var(--shell-line) ; border-radius: 7px ; background: var(--shell-panel) ; }
.unified-editor-pane .setting-field { min-width: 0; padding: 10px ; border: 1px solid var(--shell-line) ; border-radius: 10px ; background: color-mix(in srgb, var(--shell-panel) 88%, transparent) ; }
.unified-editor-pane .settings-grid, .unified-editor-pane .advanced-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) ; gap: 9px ; }
.unified-editor-pane .settings-tab-description { margin: 0 0 10px ; color: var(--shell-muted) ; font-size: 11px ; line-height: 1.5 ; }
.unified-editor-pane .settings-tabs { gap: 5px ; margin: 12px 0 10px ; padding-bottom: 8px ; border-color: var(--shell-line) ; }
.unified-editor-pane .settings-tab { min-height: 30px; padding: 7px 9px ; border: 1px solid var(--shell-line) ; border-radius: 8px ; color: var(--shell-text) ; font-size: 10px ; background: transparent ; }
.unified-editor-pane .settings-tab.active { background: var(--shell-hover) ; color: var(--shell-heading) ; border-color: var(--shell-accent) ; }
.unified-editor-pane .settings-tab-panel[hidden] { display: none ; }
.unified-editor-pane .form-actions { display: flex; flex-wrap: wrap; gap: 7px ; margin-top: 13px ; }
.unified-editor-pane .form-actions button, .unified-editor-pane button, .unified-section-actions button { min-height: 34px; padding: 8px 11px ; border-radius: 8px ; font-size: 11px ; }
.unified-editor-pane .custom-sections-manager { margin-top: 16px ; padding: 13px ; border: 1px solid var(--shell-line) ; border-radius: 12px ; background: transparent ; }
.unified-editor-pane .custom-section-form { gap: 9px ; }
.unified-editor-pane .visual-editor-workspace { display: block ; min-width: 0 ; }
.unified-editor-pane .visual-editor-frame-wrap { display: none ; }
.unified-editor-pane .visual-inspector { position: static ; width: 100% ; max-width: none ; max-height: none ; overflow: visible ; display: grid ; gap: 8px ; padding: 0 ; border: 0 ; border-radius: 0 ; background: transparent ; box-shadow: none ; }
.unified-editor-pane .visual-inspector h3 { margin: 0 0 5px ; color: var(--shell-heading) ; font-size: 17px ; }
.unified-editor-pane .visual-inspector .visual-dimension-row { display: grid ; grid-template-columns: minmax(0, 1fr) 88px ; gap: 8px ; align-items: end; }
.unified-editor-pane .visual-inspector .visual-property-group { min-width: 0; margin: 3px 0 ; padding: 11px ; border: 1px solid var(--shell-line) ; border-radius: 10px ; background: transparent ; }
.unified-editor-pane .visual-inspector .visual-property-group summary { cursor: pointer; color: var(--shell-heading) ; font-size: 11px ; font-weight: 750 ; }
.unified-editor-pane .visual-editor-actions, .unified-editor-pane .visual-transform-actions, .unified-editor-pane .layer-actions { display: grid ; grid-template-columns: repeat(2, minmax(0, 1fr)) ; gap: 6px ; }
.unified-editor-pane .visual-editor-actions button, .unified-editor-pane .visual-transform-actions button, .unified-editor-pane .layer-actions button { min-width: 0; white-space: normal; }
.unified-editor-pane .visual-layers { min-width: 0; padding: 11px ; border: 1px solid var(--shell-line) ; border-radius: 10px ; background: transparent ; }
.unified-editor-pane .visual-layer-item { display: block; width: 100%; min-width: 0; border: 1px solid transparent ; border-radius: 7px ; background: transparent ; color: var(--shell-text) ; text-align: left; }
.unified-editor-pane .visual-layer-item:hover, .unified-editor-pane .visual-layer-item.active { background: var(--shell-hover) ; color: var(--shell-heading) ; border-color: var(--shell-line) ; }

.editor-subtabs { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; margin: 0 0 12px; padding: 0 0 10px; border-bottom: 1px solid var(--shell-line); }
.editor-subtab { display: inline-flex ; align-items: center ; gap: 7px ; width: auto ; min-height: 33px ; padding: 7px 9px ; border: 1px solid transparent ; border-radius: 8px ; background: transparent ; color: var(--shell-text) ; }
.editor-subtab .editor-tab-icon { width: 15px; height: 15px; flex-basis: 15px; }
.editor-subtab .editor-tab-icon svg { width: 15px; height: 15px; }
.editor-subtab .editor-tab-label { font-size: 10px; }
.editor-subtab.active { border-color: var(--shell-line) ; background: var(--shell-hover) ; color: var(--shell-heading) ; font-weight: 700 ; }
.editor-subpanes { min-width: 0; }
.editor-subpanes > .unified-editor-pane { min-width: 0; }
.editor-fallback { padding: 13px; border: 1px dashed var(--shell-line); border-radius: 10px; color: var(--shell-muted); font-size: 12px; line-height: 1.5; }
.unified-section-actions { display: flex ; align-items: center; flex-wrap: wrap; gap: 8px ; margin-top: 12px ; padding: 12px 0 0 ; border-top: 1px solid var(--shell-line) ; }
.unified-action-note { flex: 1 1 100%; color: var(--shell-muted) ; font-size: 10px ; line-height: 1.5 ; }

.unified-editor-preview { position: sticky ; top: 16px ; display: flex ; flex-direction: column ; gap: 9px ; min-width: 0 ; height: calc(100vh - 32px) ; min-height: 540px ; max-height: calc(100vh - 32px) ; padding: 12px ; overflow: hidden ; border: 1px solid var(--shell-line) ; border-radius: var(--shell-radius) ; background: var(--shell-panel) ; box-shadow: 0 10px 28px rgba(14,45,58,.035) ; }
.unified-preview-head { display: flex ; align-items: center ; justify-content: space-between ; flex-wrap: wrap ; gap: 8px ; flex: 0 0 auto ; }
.unified-preview-title { display: grid; gap: 2px; }
.unified-preview-title strong { color: var(--shell-heading) ; font-size: 13px ; }
.unified-preview-title span { color: var(--shell-muted); font-size: 10px; }
.unified-preview-actions { display: flex ; align-items: center; gap: 5px ; flex-wrap: wrap ; }
.unified-preview-actions button { min-height: 31px ; padding: 7px 9px ; border-radius: 8px ; font-size: 10px ; }
.unified-preview-actions .unified-reset-layout { border-color: var(--shell-line) ; color: var(--shell-muted) ; }
.unified-preview-note { flex: 0 0 auto; margin: 0 ; color: var(--shell-muted) ; font-size: 10px ; line-height: 1.4 ; }
.unified-live-status { flex: 0 0 auto; margin: 0 ; padding: 7px 9px; border: 1px solid var(--shell-line); border-radius: 8px; background: color-mix(in srgb, var(--shell-panel) 80%, var(--shell-bg)); color: var(--shell-muted); font-size: 10px ; line-height: 1.4 ; overflow-wrap: anywhere; }
.unified-live-status[data-state="error"] { border-color: #cc8b7f; color: #a53a2c ; background: color-mix(in srgb, #f5dcd5 50%, var(--shell-panel)); }
.unified-live-status[data-state="pending"] { border-color: var(--shell-accent); color: var(--shell-heading) ; }
.unified-editor-preview .visual-editor-toolbar { display: flex ; align-items: center; flex-wrap: wrap; gap: 6px ; flex: 0 0 auto ; margin: 0 ; padding: 0 0 8px ; border-bottom: 1px solid var(--shell-line) ; }
.unified-editor-preview .visual-editor-toolbar label { margin: 0 ; font-size: 10px ; color: var(--shell-muted) ; }
.unified-editor-preview .visual-editor-toolbar button, .unified-editor-preview .visual-editor-toolbar select, .unified-editor-preview .visual-editor-toolbar a { min-width: 0; min-height: 30px; padding: 6px 8px ; border-radius: 7px ; font-size: 10px ; }
.unified-editor-preview .visual-editor-toolbar #editor-selection-status { flex: 1 1 100%; color: var(--shell-muted) ; font-size: 10px ; line-height: 1.4 ; }
.unified-editor-preview .editor-shortcuts-help { flex: 1 1 100%; margin: 0; color: var(--shell-muted) ; font-size: 10px ; }
.unified-editor-preview .visual-editor-frame-wrap { display: flex ; flex: 1 1 0 ; align-items: stretch ; justify-content: center ; width: 100% ; min-width: 0 ; min-height: 0 ; height: auto ; overflow: hidden ; border: 1px solid var(--shell-line) ; border-radius: 10px ; background: #e9e8e2 ; }
.unified-editor-preview #site-preview-frame { display: block ; flex: 1 1 auto ; width: 100% ; height: 100% ; min-width: 0 ; min-height: 0 ; border: 0 ; background: #fff ; }

/* Preferences, project inventory, metrics and security share the same visual language. */
.preferences-view > .panel, .projects-view .panel, .analytics-view > .panel, .security-view > .panel { margin: 0 0 14px ; padding: 20px ; border: 1px solid var(--shell-line) ; border-radius: var(--shell-radius) ; background: var(--shell-panel) ; box-shadow: none ; }
.preferences-view .panel-heading, .projects-view .panel-heading, .analytics-view .panel-heading, .security-view .panel-heading { margin-bottom: 16px ; }
.preferences-view .panel-heading h2, .projects-view .panel-heading h2, .analytics-view .panel-heading h2, .security-view .panel-heading h2 { margin: 0 0 8px ; color: var(--shell-heading) ; font-size: 25px ; line-height: 1.2 ; }
.preferences-view label, .projects-view label, .analytics-view label, .security-view label { color: var(--shell-text) ; font-size: 11px ; }
.preferences-view input:not([type=range]):not([type=checkbox]):not([type=radio]), .preferences-view select,
.projects-view input:not([type=range]):not([type=checkbox]):not([type=radio]), .projects-view select,
.security-view input { background: var(--shell-panel) ; color: var(--shell-text) ; border-color: var(--shell-line) ; }
.preferences-view .setting-field { background: transparent ; border-color: var(--shell-line) ; }
.projects-view .admin-layout { grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr) ; gap: 14px ; }
.projects-view .form-panel, .projects-view .list-panel { min-width: 0; }
.projects-view .toolbar { gap: 7px ; }
.projects-view .items-list { gap: 0 ; }
.projects-view .item { grid-template-columns: 72px minmax(0, 1fr) ; gap: 12px ; padding: 12px 0 ; border: 0 ; border-bottom: 1px solid var(--shell-line) ; border-radius: 0 ; background: transparent ; }
.projects-view .thumb { width: 72px ; height: 66px ; border-radius: 8px ; }
.projects-view .item h3 { color: var(--shell-heading) ; font-size: 13px ; }
.projects-view .item p { color: var(--shell-muted) ; }
.projects-view .item-actions { gap: 5px ; }
.projects-view .analytics-card, .analytics-view .analytics-card, .analytics-view .analytics-chart-card { background: var(--shell-panel) ; color: var(--shell-text) ; border-color: var(--shell-line) ; box-shadow: none ; }
.analytics-view .analytics-cards { gap: 10px ; border: 0 ; }
.analytics-view .analytics-card { padding: 14px ; border: 1px solid var(--shell-line) ; border-radius: 12px ; }
.analytics-view .analytics-card span, .analytics-view .analytics-card small { color: var(--shell-muted) ; }
.analytics-view .analytics-card strong { color: var(--shell-heading) ; }
.analytics-view .analytics-chart-empty { background: transparent ; border-color: var(--shell-line) ; color: var(--shell-muted) ; }
.security-view form { max-width: 620px; }
.admin-shell-footer { display: flex ; justify-content: space-between; gap: 12px; width: calc(100% - 40px) ; max-width: none ; margin: 0 auto 18px ; padding: 12px 2px ; border-top: 1px solid var(--shell-line) ; color: var(--shell-muted) ; font-size: 10px ; }

@media (max-width: 1380px) {
  .admin-shell-main { grid-template-columns: 218px minmax(0, 1fr) ; gap: 14px ; }
  .unified-site-editor { grid-template-columns: minmax(390px, .83fr) minmax(0, 1.17fr) ; gap: 10px ; }
  .unified-editor-tools { grid-template-columns: 124px minmax(0, 1fr) ; }
  .unified-editor-panes { padding: 9px ; }
  .quick-actions-grid { gap: 8px; }
  .quick-action-card { padding: 13px ; grid-template-columns: 32px minmax(0, 1fr) 14px ; gap: 8px ; }
  .quick-action-icon { width: 32px; height: 32px; }
}
@media (max-width: 1150px) {
  .unified-site-editor { grid-template-columns: minmax(0, 1fr) ; }
  .unified-editor-preview { position: relative ; top: auto ; grid-row: 1; height: 68vh ; min-height: 420px ; max-height: 720px ; }
  .unified-editor-tools { grid-template-columns: 150px minmax(0, 1fr) ; }
  .unified-editor-panes { max-height: none ; }
  .unified-editor-tabs { max-height: none ; }
}
@media (max-width: 1000px) {
  .admin-shell-main { grid-template-columns: 190px minmax(0, 1fr) ; width: calc(100% - 28px) ; gap: 12px ; }
  .admin-sidebar { padding-inline: 9px ; }
  .nav-item-description { display: none; }
  .quick-actions-grid { grid-template-columns: 1fr; }
  .quick-action-card { min-height: 78px ; }
  .projects-view .admin-layout { grid-template-columns: minmax(0, 1fr) ; }
  .advanced-grid, .settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) ; }
}
@media (max-width: 720px) {
  .admin-shell-main { display: block ; width: calc(100% - 24px) ; margin: 12px auto 22px ; }
  .admin-sidebar { position: relative ; top: auto ; height: auto ; min-height: 0 ; margin-bottom: 14px ; padding: 10px 10px 8px ; border-radius: 14px ; gap: 10px ; overflow: visible ; }
  .sidebar-brand { padding: 2px 4px 9px ; }
  .sidebar-monogram { width: 34px ; height: 34px ; flex-basis: 34px ; border-radius: 10px ; font-size: 19px ; }
  .sidebar-brand strong { font-size: 16px ; }
  .sidebar-brand small { font-size: 7px ; }
  .admin-nav { display: flex ; gap: 4px ; overflow-x: auto ; padding-bottom: 2px ; }
  .admin-nav-item { flex: 0 0 auto ; width: auto ; gap: 6px ; min-height: 36px ; padding: 8px 9px ; white-space: nowrap ; }
  .admin-nav-item .nav-symbol { width: 15px ; height: 15px ; flex-basis: 15px ; }
  .nav-item-label { font-size: 10px; }
  .sidebar-bottom { display: none ; }
  .workspace-topbar { min-height: 51px ; margin-bottom: 12px ; padding-bottom: 10px ; }
  .workspace-topbar h1 { font-size: 24px ; }
  .workspace-status { padding: 6px 8px ; font-size: 9px ; }
  .overview-intro h1 { font-size: clamp(32px, 9vw, 42px) ; }
  .quick-actions-heading h2 { font-size: 21px; }
  .connection-card { padding: 13px ; }
  .unified-site-editor { gap: 12px ; }
  .unified-editor-preview { height: 62vh ; min-height: 360px ; max-height: 640px ; padding: 9px ; }
  .unified-editor-tools { grid-template-columns: minmax(0, 1fr) ; }
  .unified-editor-tabs { display: grid ; grid-template-columns: repeat(5, minmax(0, 1fr)) ; max-height: none ; gap: 3px ; padding: 5px ; border-right: 0 ; border-bottom: 1px solid var(--shell-line) ; }
  .unified-editor-tabs .editor-tab-button { display: flex ; flex-direction: column ; align-items: center ; justify-content: center ; gap: 4px ; min-height: 57px ; padding: 5px 2px ; text-align: center ; }
  .unified-editor-tabs .editor-tab-label { font-size: 9px ; line-height: 1.2 ; text-align: center; overflow-wrap: anywhere; }
  .unified-editor-panes { max-height: none ; padding: 11px ; }
  .unified-editor-pane .settings-grid, .unified-editor-pane .advanced-grid { grid-template-columns: minmax(0, 1fr) ; }
  .unified-preview-head { align-items: start ; }
  .unified-preview-actions { justify-content: flex-start; width: 100%; }
  .unified-preview-actions button { flex: 1 1 auto; }
  .unified-editor-preview .visual-editor-toolbar { gap: 4px ; }
  .unified-editor-preview .visual-editor-toolbar button, .unified-editor-preview .visual-editor-toolbar select, .unified-editor-preview .visual-editor-toolbar a { flex: 1 1 auto; }
  .preferences-view > .panel, .projects-view .panel, .analytics-view > .panel, .security-view > .panel { padding: 14px ; }
  .advanced-grid, .settings-grid { grid-template-columns: minmax(0, 1fr) ; }
  .analytics-view .analytics-cards { grid-template-columns: repeat(2, minmax(0, 1fr)) ; }
  .admin-shell-footer { flex-direction: column; width: calc(100% - 24px) ; }
}
@media (max-width: 420px) {
  .workspace-topbar { align-items: start ; }
  .workspace-status { max-width: 120px; white-space: normal; line-height: 1.3; }
  .workspace-status svg { flex: 0 0 14px; }
  .quick-action-card { grid-template-columns: 32px minmax(0, 1fr) 14px ; }
  .unified-preview-actions .unified-reset-layout { flex-basis: 100%; }
  .unified-editor-tabs .editor-tab-label { font-size: 8px ; }
  .editor-subtab { flex: 1 1 auto; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .admin-nav-item, .quick-action-card { transition: none ; }
}

/* Mobile: bleed the sidebar to the viewport edge without introducing 2px horizontal scroll. */
@media (max-width: 720px) {
  body.admin-shell-ready .admin-shell-main > .admin-sidebar {
    margin-left: -12px ;
    margin-right: -12px ;
  }
}

/* A tool bar that stays legible on phones: device and zoom controls keep their labels. */
@media (max-width: 720px) {
  .unified-editor-preview .visual-editor-toolbar {
    display: grid ;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) ;
    align-items: center ;
    gap: 6px ;
  }
  .unified-editor-preview .visual-editor-toolbar #editor-refresh,
  .unified-editor-preview .visual-editor-toolbar .editor-open-site,
  .unified-editor-preview .visual-editor-toolbar #editor-selection-status,
  .unified-editor-preview .visual-editor-toolbar .editor-shortcuts-help { grid-column: 1 / -1 ; }
  .unified-editor-preview .visual-editor-toolbar label[for="editor-device"] { grid-column: 1; grid-row: 2; }
  .unified-editor-preview .visual-editor-toolbar #editor-device { grid-column: 1; grid-row: 3; width: 100%; }
  .unified-editor-preview .visual-editor-toolbar label[for="editor-zoom"] { grid-column: 2; grid-row: 2; }
  .unified-editor-preview .visual-editor-toolbar #editor-zoom { grid-column: 2; grid-row: 3; width: 100%; }
  .unified-editor-preview .visual-editor-toolbar #editor-selection-status { margin-top: 1px ; }
}

/* Wide workspaces: move the five editor areas into a horizontal toolbar.
   This restores width to forms and prevents nested controls from feeling compressed. */
@media (min-width: 721px) {
  .unified-editor-tools {
    grid-template-columns: minmax(0, 1fr) ;
  }
  .unified-editor-tabs {
    display: grid ;
    grid-template-columns: repeat(5, minmax(0, 1fr)) ;
    grid-auto-flow: row ;
    align-items: stretch ;
    min-height: 0 ;
    max-height: none ;
    overflow-x: auto ;
    overflow-y: hidden ;
    padding: 7px ;
    gap: 5px ;
    border-right: 0 ;
    border-bottom: 1px solid var(--shell-line) ;
  }
  .unified-editor-tabs .editor-tab-button {
    display: flex ;
    flex-direction: column ;
    align-items: center ;
    justify-content: center ;
    gap: 5px ;
    min-height: 58px ;
    padding: 7px 4px ;
    text-align: center ;
    white-space: normal ;
  }
  .unified-editor-tabs .editor-tab-button.active {
    box-shadow: inset 0 -2px 0 var(--shell-accent) ;
  }
  .unified-editor-tabs .editor-tab-label {
    text-align: center ;
    font-size: 10px ;
    line-height: 1.25 ;
    overflow-wrap: anywhere ;
  }
  .unified-editor-panes {
    max-height: calc(100vh - 235px) ;
    min-height: 360px;
    padding: 14px ;
  }
  .unified-editor-pane .section-style-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) ;
  }
}

/* On tablets, let tool categories wrap rather than shrink into unreadable labels. */
@media (min-width: 721px) and (max-width: 900px) {
  .unified-editor-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr)) ;
    overflow: visible ;
  }
  .unified-editor-panes {
    max-height: none ;
  }
}

/* RGB is an advanced option, not an always-visible second row under every color. */
body.admin-shell-ready .rgb-controls {
  margin-top: 5px;
  min-width: 0;
}
body.admin-shell-ready .rgb-controls > summary {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 0;
  color: var(--shell-muted) ;
  font-size: 10px ;
  font-weight: 600 ;
  cursor: pointer;
  list-style-position: inside;
}
body.admin-shell-ready .rgb-controls[open] {
  padding: 5px 7px 7px;
  border: 1px solid var(--shell-line);
  border-radius: 8px;
  background: color-mix(in srgb, var(--shell-panel) 92%, transparent);
}
body.admin-shell-ready .rgb-controls .rgb-triple {
  margin-top: 5px ;
  gap: 5px ;
}
body.admin-shell-ready .rgb-controls .rgb-triple label {
  gap: 4px ;
  color: var(--shell-muted) ;
  font-size: 9px ;
}
body.admin-shell-ready .rgb-controls .rgb-triple input {
  min-height: 29px ;
  padding: 5px 6px ;
  font-size: 11px ;
}

/* Every primary admin area remains visible in a compact mobile navigation grid. */
@media (max-width: 720px) {
  body.admin-shell-ready .admin-nav {
    display: grid ;
    grid-template-columns: repeat(3, minmax(0, 1fr)) ;
    align-items: stretch ;
    overflow: visible ;
    gap: 5px ;
  }
  body.admin-shell-ready .admin-nav-item {
    display: flex ;
    justify-content: flex-start ;
    width: 100% ;
    min-width: 0 ;
    min-height: 38px ;
    padding: 7px 6px ;
    white-space: normal ;
  }
  body.admin-shell-ready .admin-nav-item .nav-item-label {
    white-space: normal ;
    font-size: 9px ;
    line-height: 1.2 ;
  }
}
@media (max-width: 350px) {
  body.admin-shell-ready .admin-nav { grid-template-columns: repeat(2, minmax(0, 1fr)) ; }
}


/* Preview focus mode: enlarge the viewport without changing the site's CSS viewport width. */
body.admin-preview-expanded::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 99990;
  background: rgba(8, 8, 8, .88);
  backdrop-filter: blur(2px);
}
.unified-editor-preview.is-expanded {
  position: fixed ;
  inset: 10px ;
  z-index: 99991 ;
  width: auto ;
  max-width: none ;
  height: auto ;
  min-height: 0 ;
  max-height: none ;
  margin: 0 ;
  border-radius: 12px ;
  box-shadow: 0 18px 60px rgba(0, 0, 0, .45) ;
}
.unified-editor-preview.is-expanded .visual-editor-frame-wrap {
  flex: 1 1 0 ;
  width: 100% ;
  min-height: 0 ;
  height: auto ;
}
@media (max-width: 720px) {
  .unified-editor-preview.is-expanded { inset: 4px ; padding: 8px ; }
}
@media (max-height: 600px) {
  .unified-editor-preview.is-expanded { inset: 4px ; min-height: 0 ; }
}


/* Correção de contraste e foco: os campos do painel não dependem das cores escolhidas para o tema. */
body.admin-shell-ready .unified-editor-pane input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
body.admin-shell-ready .unified-editor-pane select,
body.admin-shell-ready .unified-editor-pane textarea,
body.admin-shell-ready .preferences-view input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
body.admin-shell-ready .preferences-view select,
body.admin-shell-ready .projects-view input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
body.admin-shell-ready .projects-view select,
body.admin-shell-ready .security-view input,
body.admin-shell-ready .site-settings-panel input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
body.admin-shell-ready .site-settings-panel select,
body.admin-shell-ready .site-settings-panel textarea {
  background-color: #F8F6F0 ;
  color: #102D38 ;
  -webkit-text-fill-color: #102D38 ;
  border-color: #B9B3A6 ;
  caret-color: #A8472E ;
  opacity: 1 ;
}
body.admin-shell-ready .unified-editor-pane input::placeholder,
body.admin-shell-ready .unified-editor-pane textarea::placeholder,
body.admin-shell-ready .site-settings-panel input::placeholder,
body.admin-shell-ready .site-settings-panel textarea::placeholder {
  color: #617177 ;
  -webkit-text-fill-color: #617177 ;
  opacity: 1 ;
}
body.admin-shell-ready .unified-editor-pane input:disabled,
body.admin-shell-ready .unified-editor-pane select:disabled,
body.admin-shell-ready .unified-editor-pane textarea:disabled {
  background-color: #E3E0D8 ;
  color: #555D60 ;
  -webkit-text-fill-color: #555D60 ;
  opacity: .86 ;
  cursor: not-allowed ;
}
body.admin-shell-ready .unified-editor-pane input[type="color"],
body.admin-shell-ready .site-settings-panel input[type="color"] {
  -webkit-text-fill-color: initial ;
}
body.admin-shell-ready .unified-editor-pane input:not(:disabled),
body.admin-shell-ready .unified-editor-pane select:not(:disabled),
body.admin-shell-ready .unified-editor-pane textarea:not(:disabled),
body.admin-shell-ready .site-settings-panel input:not(:disabled),
body.admin-shell-ready .site-settings-panel select:not(:disabled),
body.admin-shell-ready .site-settings-panel textarea:not(:disabled) {
  pointer-events: auto ;
  user-select: text ;
  cursor: text;
}
body.admin-shell-ready .unified-editor-pane select:not(:disabled) { cursor: pointer; }
body.admin-shell-ready .unified-editor-pane input[type="file"] { cursor: pointer; }
body.admin-shell-ready .settings-tab { background: #252525 ; color: #F3EEE2 ; border-color: #454545 ; }
body.admin-shell-ready .settings-tab.active,
body.admin-shell-ready .settings-tab:hover { background: #C0924D ; color: #111111 ; border-color: #C0924D ; }
body.admin-shell-ready .editor-subtab { background: #252525 ; color: #F3EEE2 ; border-color: #454545 ; }
body.admin-shell-ready .editor-subtab.active,
body.admin-shell-ready .editor-subtab:hover { background: #C0924D ; color: #111111 ; border-color: #C0924D ; }
body.admin-shell-ready .editor-tab-button.active { background: #C0924D ; color: #111111 ; border-color: #C0924D ; }
body.admin-shell-ready .editor-tab-button.active .editor-tab-label,
body.admin-shell-ready .editor-tab-button.active .editor-tab-icon { color: #111111 ; }
body.admin-shell-ready #visual-content:disabled { background-color: #E3E0D8 ; color: #555D60 ; -webkit-text-fill-color: #555D60 ; }


/* Campos administrativos legíveis em todas as abas, independentemente do tema escolhido. */
body.admin-shell-ready input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="button"]):not([type="submit"]),
body.admin-shell-ready textarea,
body.admin-shell-ready select {
  background: #F8F6F0 ;
  color: #102D38 ;
  -webkit-text-fill-color: #102D38 ;
  border-color: #B9B3A6 ;
  caret-color: #A8472E ;
  opacity: 1 ;
  box-shadow: none;
}
body.admin-shell-ready input::placeholder,
body.admin-shell-ready textarea::placeholder {
  color: #617177 ;
  -webkit-text-fill-color: #617177 ;
  opacity: 1 ;
}
body.admin-shell-ready input:disabled,
body.admin-shell-ready textarea:disabled,
body.admin-shell-ready select:disabled {
  background: #E3E0D8 ;
  color: #555D60 ;
  -webkit-text-fill-color: #555D60 ;
  cursor: not-allowed ;
}
body.admin-shell-ready input:not(:disabled):not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
body.admin-shell-ready textarea:not(:disabled),
body.admin-shell-ready select:not(:disabled) {
  pointer-events: auto ;
  user-select: text ;
  cursor: text;
}
body.admin-shell-ready select:not(:disabled) { cursor: pointer; }
body.admin-shell-ready input[type="file"] { color: #102D38 ; }
body.admin-shell-ready input[type="color"] { cursor: pointer; }

/* Usabilidade 2026-10: leitura clara dos controles, estados de imagem e alvos de toque. */
body.admin-shell-ready .site-settings-form .setting-field {
  min-width: 0 ;
  display: flex ;
  flex-direction: column ;
  gap: 9px ;
  padding: 14px ;
}
body.admin-shell-ready .site-settings-form .setting-field h3 {
  margin: 0 ;
  color: var(--ui-text) ;
  font-size: 14px ;
  font-weight: 700 ;
  line-height: 1.35 ;
}
body.admin-shell-ready .site-settings-form .field-help,
body.admin-shell-ready .site-settings-form .setting-field small {
  display: block ;
  color: var(--ui-muted) ;
  font-size: 12px ;
  line-height: 1.5 ;
  overflow-wrap: anywhere;
}
body.admin-shell-ready .site-settings-form .setting-field label {
  margin: 4px 0 0 ;
  color: var(--ui-text) ;
  font-size: 13px ;
  font-weight: 700 ;
  line-height: 1.4 ;
}
body.admin-shell-ready .site-settings-form input:not([type="file"]):not([type="color"]):not([type="range"]),
body.admin-shell-ready .site-settings-form textarea,
body.admin-shell-ready .site-settings-form select {
  min-width: 0 ;
  min-height: 44px ;
  padding: 11px 12px ;
  background: #F8F6F0 ;
  color: #0E2D3A ;
  -webkit-text-fill-color: #0E2D3A ;
  border: 1px solid #B9B5AA ;
  border-radius: 8px ;
  font-size: 14px ;
  line-height: 1.45 ;
}
body.admin-shell-ready .site-settings-form input[type="file"] {
  min-height: 44px ;
  padding: 8px ;
  background: #F8F6F0 ;
  color: #0E2D3A ;
  border: 1px solid #B9B5AA ;
  border-radius: 8px ;
  font-size: 12px ;
  line-height: 1.4 ;
}
body.admin-shell-ready .site-settings-form input[type="color"] {
  min-height: 44px ;
  width: 100% ;
  border: 1px solid #B9B5AA ;
  border-radius: 8px ;
}
body.admin-shell-ready .site-settings-form .hero-image-preview {
  position: relative;
  display: grid ;
  place-items: center ;
  width: 100% ;
  min-height: 170px ;
  aspect-ratio: 16 / 9;
  margin: 3px 0 0 ;
  padding: 12px ;
  overflow: hidden ;
  border: 1px solid var(--ui-divider) ;
  border-radius: 10px ;
  background-color: #EEE6D3 ;
  background-position: center ;
  background-size: cover ;
  color: #0E2D3A ;
  text-align: center ;
  font-size: 12px ;
  font-weight: 700 ;
  line-height: 1.45 ;
  text-shadow: 0 1px 2px #FFFFFF, 0 0 7px #FFFFFF ;
}
body.admin-shell-ready .site-settings-form .hero-image-preview.has-image {
  color: #FFFFFF ;
  text-shadow: 0 1px 4px #000000, 0 0 8px #000000 ;
}
body.admin-shell-ready .site-settings-form .hero-image-preview.is-loading {
  background-image: linear-gradient(135deg,#EEE6D3,#D8D1C3) ;
  color: #0E2D3A ;
  text-shadow: none ;
}
body.admin-shell-ready .site-settings-form .hero-image-preview.has-error {
  background: #FBEAE5 ;
  color: #8C2F1D ;
  border: 1px solid #B94D34 ;
  text-shadow: none ;
}
body.admin-shell-ready #site-settings-status {
  padding: 10px 12px ;
  border-radius: 8px ;
  background: #E8F2EA ;
  color: #245336 ;
  font-size: 13px ;
  line-height: 1.5 ;
  overflow-wrap: anywhere ;
}
body.admin-shell-ready .site-settings-form .form-actions button,
body.admin-shell-ready .site-settings-form button {
  min-height: 44px ;
  padding: 10px 14px ;
  font-size: 12px ;
  line-height: 1.35 ;
  white-space: normal ;
}
body.admin-shell-ready :is(input,textarea,select,button,a,[tabindex]):focus-visible {
  outline: 3px solid #C0924D ;
  outline-offset: 3px ;
}
@media (max-width: 720px) {
  body.admin-shell-ready .site-settings-form .advanced-grid,
  body.admin-shell-ready .site-settings-form .settings-tab-panel .advanced-grid {
    grid-template-columns: minmax(0,1fr) ;
  }
  body.admin-shell-ready .site-settings-form .hero-image-preview { min-height: 150px ; }
  body.admin-shell-ready .site-settings-form input:not([type="file"]):not([type="color"]):not([type="range"]),
  body.admin-shell-ready .site-settings-form textarea,
  body.admin-shell-ready .site-settings-form select { font-size: 16px ; }
  body.admin-shell-ready .site-settings-form .form-actions { display: grid ; grid-template-columns: minmax(0,1fr) ; }
  body.admin-shell-ready .site-settings-form .form-actions button { width: 100% ; }
  body.admin-shell-ready .unified-editor-tabs { grid-template-columns: repeat(3,minmax(0,1fr)) ; }
  body.admin-shell-ready .unified-editor-tabs .editor-tab-button { min-height: 56px ; padding: 8px 5px ; }
  body.admin-shell-ready .unified-editor-tabs .editor-tab-label { font-size: 11px ; line-height: 1.3 ; overflow-wrap: normal ; word-break: normal ; }
  body.admin-shell-ready .admin-nav-item { min-height: 44px ; }
}
@media (max-width: 420px) {
  body.admin-shell-ready .unified-editor-tabs { grid-template-columns: repeat(3,minmax(0,1fr)) ; }
  body.admin-shell-ready .unified-editor-tabs .editor-tab-label { font-size: 11px ; }
  body.admin-shell-ready .site-settings-form .setting-field { padding: 12px ; }
}
@media (max-width: 600px) {
  body.admin-shell-ready .analytics-bar-item small { font-size: 10px ; }
  body.admin-shell-ready .sidebar-brand small { font-size: 9px ; letter-spacing: .04em ; }
  body.admin-shell-ready .visual-editor-toolbar button,
  body.admin-shell-ready .visual-editor-toolbar select,
  body.admin-shell-ready .visual-editor-toolbar .editor-open-site { min-height: 44px ; }
  body.admin-shell-ready .visual-editor-actions button,
  body.admin-shell-ready .layer-actions button,
  body.admin-shell-ready .visual-inspector-actions button { min-height: 44px ; }
}


/* UX refinement: explicit text editing, readable helper copy, and balanced desktop workbench. */
.visual-edit-text-direct {
  grid-column: 1 / -1 ;
  width: 100% ;
  min-height: 44px ;
  padding: 11px 14px ;
  border: 1px solid #B17D32 ;
  border-radius: 10px ;
  background: #C0924D ;
  color: #0E2D3A ;
  font-size: 12px ;
  font-weight: 800 ;
  letter-spacing: .005em ;
  cursor: pointer ;
}
.visual-edit-text-direct:hover:not(:disabled) { background: #D3A45E ; box-shadow: 0 3px 10px rgba(192,146,77,.18) ; }
.visual-edit-text-direct:disabled { opacity: .5 ; cursor: not-allowed ; box-shadow: none ; }
.visual-editing-hint { margin: 0 0 7px ; color: var(--shell-muted, #697174) ; font-size: 11px ; line-height: 1.55 ; }
#visual-content { min-height: 92px ; line-height: 1.55 ; }
#visual-content-help { display: block; margin: 5px 0 10px ; color: var(--shell-muted, #697174) ; font-size: 10px ; line-height: 1.5 ; }
.unified-preview-note { max-width: 78ch; padding: 7px 9px ; border-left: 3px solid var(--shell-accent, #C0924D) ; border-radius: 0 7px 7px 0 ; background: color-mix(in srgb, var(--shell-accent, #C0924D) 8%, var(--shell-panel, #242424)) ; line-height: 1.5 ; }
.unified-editor-pane :is(button, input, select, textarea, summary, a):focus-visible,
.unified-editor-preview :is(button, input, select, textarea, summary, a):focus-visible { outline: 2px solid var(--shell-accent, #C0924D) ; outline-offset: 2px ; }
@media (min-width: 1151px) {
  .unified-site-editor { grid-template-columns: minmax(380px, .86fr) minmax(0, 1.14fr) ; gap: 16px ; }
  .unified-editor-preview { min-width: 0 ; }
}
@media (max-width: 720px) {
  .visual-edit-text-direct { min-height: 46px ; }
  .visual-editing-hint { font-size: 12px ; }
}


/* Clear, always-visible direct text editing action in the preview toolbar. */
.preview-edit-text-direct {
  min-height: 38px ;
  padding: 8px 12px ;
  border: 1px solid rgba(192,146,77,.9) ;
  border-radius: 8px ;
  background: var(--shell-accent, #C0924D) ;
  color: #171512 ;
  font-size: 12px ;
  font-weight: 700 ;
  white-space: nowrap ;
}
.preview-edit-text-direct:hover:not(:disabled) { filter: brightness(1.05); }
.preview-edit-text-direct:disabled { opacity: .48 ; cursor: not-allowed ; }
.preview-edit-text-direct:focus-visible,
.visual-edit-text-direct:focus-visible { outline: 3px solid #F5D7A2 ; outline-offset: 2px ; }
@media (max-width: 850px) {
  .preview-edit-text-direct { flex: 1 1 100%; min-height: 44px ; white-space: normal ; }
}


