/* November 5: editor state owns contrast; no persisted or construction switch. */
:root {
  --nov05-editor-open: 0;
  --nov05-font-data: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", sans-serif;
  --nov05-editor-bg: #242830;
  --nov05-editor-preview: #1e2229;
  --nov05-editor-paper: #2c323b;
  --nov05-editor-wash: #363e49;
  --nov05-editor-ink: #eef0f4;
  --nov05-editor-secondary: #c9ced7;
  --nov05-editor-muted: #adb5c1;
  --nov05-editor-line: #49535f;
  --nov05-editor-accent: #cdd8e4;
  --nov05-editor-accent-deep: #18212b;
  --nov05-editor-accent-wash: #3d4855;
  --nov05-editor-scheme: dark;
}
html[data-argus-theme="warm"] .editor-layer.ws[data-ed-demo] {
  --nov05-editor-bg: #c8ccc9;
  --nov05-editor-preview: #d6d9d6;
  --nov05-editor-paper: #e8ebe8;
  --nov05-editor-wash: #dce1dd;
  --nov05-editor-ink: #252b29;
  --nov05-editor-secondary: #444d49;
  --nov05-editor-muted: #515b56;
  --nov05-editor-line: #a9b2ad;
  --nov05-editor-accent: #364943;
  --nov05-editor-accent-deep: #263a34;
  --nov05-editor-accent-wash: #cdd9d3;
  --nov05-editor-scheme: light;
}
html[data-argus-theme="paper"] .editor-layer.ws[data-ed-demo] {
  --nov05-editor-bg: #d8dde4;
  --nov05-editor-preview: #e3e7ed;
  --nov05-editor-paper: #f3f5f8;
  --nov05-editor-wash: #e8ecf1;
  --nov05-editor-ink: #232935;
  --nov05-editor-secondary: #454e5c;
  --nov05-editor-muted: #535e6e;
  --nov05-editor-line: #b0bbc9;
  --nov05-editor-accent: #394d66;
  --nov05-editor-accent-deep: #263954;
  --nov05-editor-accent-wash: #d6dfeb;
  --nov05-editor-scheme: light;
}
:root:has(.editor-layer.ws[data-ed-demo]) {
  --nov05-editor-open: 1;
}
.editor-layer.ws[data-ed-demo] {
  --canvas-bg: var(--nov05-editor-bg);
  --surface: var(--nov05-editor-paper);
  --surface-2: var(--nov05-editor-wash);
  --surface-soft: var(--nov05-editor-paper);
  --card-bg: var(--nov05-editor-paper);
  --ink-1: var(--nov05-editor-ink);
  --ink-2: var(--nov05-editor-secondary);
  --ink-3: var(--nov05-editor-muted);
  --ink: var(--nov05-editor-ink);
  --ink-soft: var(--nov05-editor-secondary);
  --ink-mute: var(--nov05-editor-muted);
  --line: var(--nov05-editor-line);
  --border: var(--nov05-editor-line);
  --hairline: var(--nov05-editor-line);
  --accent-ui: var(--nov05-editor-accent);
  --accent: var(--nov05-editor-accent);
  --accent-marker: var(--nov05-editor-accent-wash);
  --u6-paper: var(--nov05-editor-paper);
  --u6-paper-deep: var(--nov05-editor-wash);
  --u6-wash: var(--nov05-editor-wash);
  --u6-line: var(--nov05-editor-line);
  --u6-ink: var(--nov05-editor-ink);
  --u6-ink-soft: var(--nov05-editor-secondary);
  --u6-ink-mute: var(--nov05-editor-muted);
  --u6-gold: var(--nov05-editor-accent);
  --u6-pick: var(--nov05-editor-accent);
  --u6-pick-deep: var(--nov05-editor-accent-deep);
  --u6-pick-wash: var(--nov05-editor-accent-wash);
  --ctl-hover: var(--nov05-editor-wash);
  --chip-bg: var(--nov05-editor-paper);
  --project-band: var(--nov05-editor-paper);
  --project-band-text: var(--nov05-editor-ink);
  --ed-island: var(--nov05-editor-bg);
  color-scheme: var(--nov05-editor-scheme);
}
.editor-layer.ws[data-ed-demo] {
  font-family: var(--nov05-font-hand);
  color: var(--ink-1);
}
.editor-layer.ws[data-ed-demo] :is(button, summary, h2, h3, h4, .ed-wf-head, .ed-wf-title, .creation-item, .creation-catalog) {
  font-family: var(--nov05-font-hand);
}
.editor-layer.ws[data-ed-demo] :is(input, textarea, select, code, pre, .gen-model-name, .gen-value) {
  font-family: var(--nov05-font-data);
}
.editor-layer.ws[data-ed-demo] :is(.ed-wf-head, .ed-wf-title) {
  font: 400 17px/1.35 var(--nov05-font-display);
}
.editor-layer.ws[data-ed-demo] :is(.creation-item, .ed-topt-pop) { font-size: 15px; font-weight: 400; }
.editor-layer.ws[data-ed-demo] .creation-choice { padding-inline: 3px; font-size: 13px; line-height: 1.35; font-weight: 400; }
.editor-layer.ws[data-ed-demo] .creation-choice:first-child > span { white-space: nowrap; }
.editor-layer.ws[data-ed-demo] :is(.gen-compact-title, .gen-compact-heading strong, .ed-composer-group h4, .ed-wf-title strong) { font-weight: 400; }
.editor-layer.ws[data-ed-demo] .creation-choice svg { color: var(--nov05-editor-secondary); }
.editor-layer.ws[data-ed-demo] .ws .ed-wf-guide-trigger {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
  min-height: 28px;
  padding: 2px 6px;
  border: 1px solid transparent;
  border-radius: 5px;
  color: var(--ink-2);
  background: transparent;
  font-size: 12px;
  cursor: pointer;
}
.editor-layer.ws[data-ed-demo] .ws .ed-wf-guide-trigger:hover { border-color: var(--hairline); }
.editor-layer.ws[data-ed-demo] .ws .ed-wf-guide-trigger[aria-expanded="true"] svg { transform: rotate(180deg); }
.editor-layer.ws[data-ed-demo] .ws .ed-wf-guide p { padding: 2px 0 8px; font-size: 13px; }
.editor-layer.ws[data-ed-demo] .ws .ed-wf-tile.noimg .ed-wf-noimg {
  display: grid;
  align-self: stretch;
  flex: 1 1 auto;
  place-items: center;
  color: var(--ink-2);
}
.editor-layer.ws[data-ed-demo] .ws .rp-body > .rp-current-input { padding-block: 4px 8px; }
.editor-layer.ws[data-ed-demo] .ws .rp-current-input .xu-input-thumb { width: 40px; height: 40px; flex-basis: 40px; }
.editor-layer.ws[data-ed-demo] .ws [data-local-inpaint-panel] > details { padding-block: 4px; border-bottom: 0; }
.editor-layer.ws[data-ed-demo] .ws [data-local-inpaint-status] { margin: 0 0 8px; font-size: 13px; overflow-wrap: anywhere; }
@media (pointer: coarse) {
  .editor-layer.ws[data-ed-demo] .ws .ed-wf-panel :is(.ed-wf-guide-trigger, [data-wf-back], [data-ed-wf-close]) {
    min-height: 44px;
    touch-action: manipulation;
  }
  .editor-layer.ws[data-ed-demo] .ws .ed-wf-panel [data-ed-wf-close] { min-width: 44px; }
  .editor-layer.ws[data-ed-demo] .ws :is([data-local-inpaint-panel] button, [data-local-qwen-run]) { min-height: 44px; }
  .editor-layer.ws[data-ed-demo] .ws [data-local-inpaint-panel] > details > summary {
    min-height: 44px;
    padding-block: 10px;
  }
  .editor-layer.ws[data-ed-demo] .ws :is(.ed-wf-panel, .ed-composer) :is(textarea, input:not([type]), input[type="text"], input[type="search"], input[type="number"], input[type="url"]) {
    font-size: 16px;
  }
}
.editor-layer.ws[data-ed-demo] .ws .ws-canvas {
  top: 0;
  background: var(--nov05-editor-preview);
  border-color: var(--hairline);
}
.editor-layer.ws[data-ed-demo] .ws :is(.ed-wf-panel, .ed-composer, .ed-layer-dock, .ed-operation-panel) {
  background: var(--surface);
  color: var(--ink-1);
}
.editor-layer.ws[data-ed-demo] .ws .ed-composer {
  background: var(--surface-2);
  box-shadow: none;
}
.editor-layer.ws[data-ed-demo] .ws .ed-history {
  background: var(--surface-2);
  box-shadow: none;
}
.editor-layer.ws[data-ed-demo] .ws .ed-hist-item[aria-current="true"] {
  background: var(--surface);
  border-color: var(--accent-ui);
  outline: 0;
  box-shadow: none;
}
.editor-layer.ws[data-ed-demo] .ws .ed-hist-item[aria-current="true"]:focus-visible {
  outline: 2px solid var(--accent-ui);
}
.editor-layer.ws[data-ed-demo] .ws .ed-wf-head {
  min-height: 40px;
  border-bottom: 1px solid var(--hairline);
}
.editor-layer.ws[data-ed-demo] :is(button, summary, input, textarea, select):focus-visible {
  outline: 2px solid var(--accent-ui);
  outline-offset: 2px;
}
.editor-layer.ws[data-ed-demo] ::selection { background: var(--u6-pick-wash); color: var(--ink-1); }
.editor-layer.ws[data-ed-demo] textarea { caret-color: var(--accent-ui); }
.editor-layer.ws[data-ed-demo] .ws .ed-composer :is(textarea, input)::placeholder {
  color: var(--ink-3);
  opacity: 1;
}
/* Fit image content inside a stable workspace; opening a portrait does not shrink the editor. */
.editor-layer.ws[data-ed-demo] {
  pointer-events: none;
  --nov05-editor-context: 22vw;
}
.editor-layer.ws[data-ed-demo] .ed-navigation-controls {
  --ctl-hover: var(--nov05-canvas-hover);
  --u6-ink: var(--nov05-canvas-ink);
  --accent-ui: var(--nov05-canvas-accent);
  top: auto; bottom: 18px; left: 20px;
  display: flex; gap: 2px; padding: 4px; width: 76px;
  max-width: calc(var(--nov05-editor-context) - 20px);
  border: 1px solid var(--nov05-canvas-line);
  border-radius: 10px; box-shadow: none;
  background: var(--nov05-canvas-surface); color: var(--nov05-canvas-ink);
}
.editor-layer.ws[data-ed-demo] .ed-navigation-controls > button {
  flex: 1 1 0; min-width: 0; width: auto; height: 32px; padding: 0;
  border: 0; border-radius: 6px; background: transparent; color: inherit;
}
.editor-layer.ws[data-ed-demo]:is(.max, :not(.max)) > .ws {
  position: fixed;
  inset: 0 12px 12px var(--nov05-editor-context);
  width: auto;
  min-width: 0;
  max-width: none;
  height: auto;
  min-height: 0;
  max-height: none;
  margin: 0;
  transform: none;
  border-radius: 0;
  box-shadow: none;
  background: var(--nov05-editor-bg);
  pointer-events: auto;
  border-left: 1px solid var(--nov05-editor-line);
}
.editor-layer.ws[data-ed-demo] .ws .ed-rail { top: 0; }
/* The drawing column keeps native wheel/keyboard access without a second visual slider. */
.editor-layer.ws[data-ed-demo]:is(.ed-composer-docked, :not(.ed-composer-docked)) .ws .ed-toolbar {
  top: 46px;
  bottom: 12px;
  width: 42px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 4px;
  overflow: visible;
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: 6px;
}
.editor-layer.ws[data-ed-demo] .ws .ed-toolbar > .ed-drawing-tools {
  order: 1;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  flex: 1 1 auto;
  min-height: 32px;
  width: 100%;
  gap: 3px;
  overflow-y: auto;
  overflow-x: hidden;
  scrollbar-width: none;
  overscroll-behavior: contain;
  scroll-padding-block: 4px;
}
.editor-layer.ws[data-ed-demo] .ws .ed-drawing-tools::-webkit-scrollbar { display: none; }
.editor-layer.ws[data-ed-demo] .ws .ed-drawing-tools > :is(button, details) { flex: 0 0 32px; width: 32px; min-height: 32px; }
.editor-layer.ws[data-ed-demo] .ws .ed-toolbar > .ed-workflow-tools {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  position: static;
  width: 32px;
  flex: 0 0 auto;
  margin-top: 0;
  padding-top: 10px;
  border-top: 1px solid var(--hairline);
  background: transparent;
}
.editor-layer.ws[data-ed-demo] .ws .ed-toolbar > .ed-workflow-tools > :is(.ed-tool, .ed-c-send) {
  grid-column: auto;
  grid-row: auto;
  flex: 0 0 32px;
  margin: 0;
  width: 32px;
  height: 32px;
  min-height: 32px;
}
.editor-layer.ws[data-ed-demo] .ws .ed-workflow-tools > .ed-tsep { display: none; }
.editor-layer.ws[data-ed-demo] .ws .ed-workflow-tools > [data-ed-tool="workflow"] {
  background: var(--u6-pick-wash);
  color: var(--accent-ui);
}
.editor-layer.ws[data-ed-demo] .ws :is(.gen-submit, .gen-send, .ed-c-send):not(:disabled) {
  background: var(--nov05-editor-accent-deep);
  color: var(--nov05-editor-paper);
  border-color: var(--nov05-editor-accent-deep);
}
.editor-layer.ws[data-ed-demo] .ws :is(.ed-tool, .creation-choice, .gen-select-trigger, .ed-hist-item) { border-radius: 5px; }
@media (max-width: 900px) {
  .editor-layer.ws[data-ed-demo] .ed-navigation-controls { left: 10px; bottom: 10px; }
  .editor-layer.ws[data-ed-demo] { --nov05-editor-context: clamp(64px, 10vw, 90px); }
  .editor-layer.ws[data-ed-demo]:is(.max, :not(.max)) > .ws { right: 4px; bottom: 4px; }
}
@media (max-height: 560px) {
  .editor-layer.ws[data-ed-demo]:is(.ed-composer-docked, :not(.ed-composer-docked)) .ws .ed-toolbar { top: 46px; bottom: 4px; gap: 4px; }
  .editor-layer.ws[data-ed-demo] .ws .ed-toolbar > .ed-workflow-tools { gap: 2px; padding-top: 6px; }
}
.app-frame:has(.canvas-shell):has(.editor-layer.ws[data-ed-demo]) .canvas-shell > .left-rail {
  top: 60px;
  bottom: auto;
  width: 50px;
  height: auto;
  padding: 2px;
  overflow: visible;
  visibility: visible;
  opacity: 1;
  pointer-events: none;
  background: transparent;
  box-shadow: none;
  z-index: 301;
}
.app-frame:has(.canvas-shell):has(.editor-layer.ws[data-ed-demo]) .canvas-shell > .left-rail > button,
.app-frame:has(.canvas-shell):has(.editor-layer.ws[data-ed-demo]) .left-rail .bl-control > [data-action="canvas-settings"] {
  visibility: visible;
  pointer-events: auto;
  background: var(--surface);
  color: var(--ink-1);
  border: 1px solid var(--hairline);
  border-radius: 8px;
}
.app-frame:has(.canvas-shell):has(.editor-layer.ws[data-ed-demo]) .left-rail .bl-control {
  display: flex;
  margin: 0;
  padding: 0;
  width: auto;
  pointer-events: none;
}
.app-frame:has(.canvas-shell):has(.editor-layer.ws[data-ed-demo]) .left-rail .bl-control > :is([data-action="undo"],[data-action="redo"]) { display: none; }
.app-frame:has(.canvas-shell):has(.editor-layer.ws[data-ed-demo]) .left-rail .bl-control > [data-action="canvas-settings"] {
  width: 36px !important;
  height: 36px;
}
.app-frame:has(.editor-layer.ws[data-ed-demo]) .canvas-shell > .material-sidebar:has([data-editor-assets]) {
  top: 60px;
  bottom: 76px;
  max-width: min(340px, calc(22vw - 68px));
  background: var(--surface);
  color: var(--ink-1);
}
.material-sidebar:has([data-editor-assets]) > .sidebar-tabs { gap: 2px; margin-inline: 10px; }
.material-sidebar:has([data-editor-assets]) > .sidebar-tabs > button {
  flex: 1 1 0;
  min-width: 0;
  padding-inline: 3px;
  font-size: 11px;
  white-space: normal;
}
.editor-asset-shelf { padding: 4px 12px 12px; font: 12px/1.45 var(--nov05-font-data, sans-serif); }
.editor-asset-shelf [hidden] { display: none; }
.editor-asset-tabs { display: flex; gap: 5px; margin-bottom: 8px; }
.editor-asset-tabs > button { flex: 1 1 0; min-width: 0; }
.editor-asset-tabs > button, .editor-asset-card, .editor-pinterest-topics > a, .editor-asset-upload {
  min-height: 36px;
  padding: 5px 7px;
  color: var(--ink-1);
  background: var(--surface);
  border: 1px solid var(--hairline);
  border-radius: 7px;
  cursor: pointer;
}
.editor-asset-tabs > [aria-pressed="true"], .editor-asset-shelf :is(button, a):hover { background: var(--ctl-hover); }
.editor-asset-shelf :is(button, a):focus-visible { outline: 2px solid var(--accent-ui); outline-offset: 2px; }
.editor-asset-shelf button:disabled { opacity: .55; cursor: default; }
.editor-asset-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.editor-asset-card { display: flex; flex-direction: column; gap: 4px; min-width: 0; text-align: left; }
.editor-asset-card > img, .editor-asset-no-preview {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 4px;
  background: var(--chip-bg);
}
.editor-asset-no-preview { display: grid; place-items: center; color: var(--ink-2); }
.editor-asset-caption { display: grid; gap: 2px; width: 100%; min-width: 0; }
.editor-asset-caption strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.editor-asset-caption > span, .editor-asset-note { color: var(--ink-2); }
.editor-asset-caption > span { font-size: 11px; }
.editor-asset-note { margin: 0 0 8px; }
.editor-pinterest-topics { display: grid; gap: 4px; margin: 8px 0; }
.editor-pinterest-topics > a { display: flex; align-items: center; justify-content: space-between; text-decoration: none; }
.editor-asset-upload { width: 100%; }
[data-editor-pinterest-widget] > iframe { display: block; width: 100%; height: 300px; margin-top: 8px; border: 0; border-radius: 6px; }

@media (max-width: 1079px) {
  .app-frame:has(.canvas-shell):has(.editor-layer.ws[data-ed-demo]) .canvas-shell > .sidebar.aux-card:not(.aux-card--config) {
    inset: auto auto max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left)) !important;
    width: min(440px, calc(100vw - 20px - env(safe-area-inset-left) - env(safe-area-inset-right))) !important;
    max-width: none;
    height: min(62dvh, 560px) !important;
  }
  .app-frame:has(.editor-layer.ws[data-ed-demo]) .canvas-shell > .sidebar.aux-card > .aux-body { touch-action: pan-y; }
}
@media (hover: none) and (pointer: coarse) {
  .editor-asset-shelf :is(button, a),
  .app-frame:has(.editor-layer.ws[data-ed-demo]) .sidebar.aux-card :is(.sidebar-tabs > button, .sidebar-top > button) { min-height: 44px; }
  .app-frame:has(.canvas-shell):has(.editor-layer.ws[data-ed-demo]) .left-rail .bl-control > [data-action="canvas-settings"] {
    width: 44px !important;
    height: 44px;
  }
}