:root{color-scheme:light}
:root[data-theme="dark"]{
  color-scheme:dark;
  --green:#ededef;
  --muted:#9b9ba3;
  --border:#2a2a2e;
  --night-bg:#0a0a0b;
  --night-surface:#141416;
  --night-raised:#1d1d20;
  --night-input:#0f0f11;
  --night-text:#ececef;
  --night-muted:#9b9ba3;
  --night-accent:#ffffff;
  background:var(--night-bg);
  color:var(--night-text);
}
.theme-toggle{flex-shrink:0}
.theme-toggle svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
header{height:auto;min-height:76px;flex-wrap:wrap;gap:12px;padding-top:12px;padding-bottom:12px}
.header-controls{flex-wrap:wrap}
:root[data-theme="dark"] :is(.sidebar,header,.panel,.slot,.slot-overview,dialog){background:var(--night-surface);color:var(--night-text)}
:root[data-theme="dark"] :is(input,select,textarea){background:var(--night-input);color:var(--night-text);border-color:#34343a}
:root[data-theme="dark"] ::placeholder{color:#6f6f78;opacity:1}
:root[data-theme="dark"] :is(label,.checkbox,.button,.history-item){color:#c8c8ce}
:root[data-theme="dark"] :is(.button.outline,.ref button,.close-image){background:var(--night-raised);border-color:#34343a;color:var(--night-text)}
:root[data-theme="dark"] :is(.button.primary,.brand-mark){background:var(--green);color:#0a0a0b}
:root[data-theme="dark"] .button:hover{filter:brightness(1.12)}
:root[data-theme="dark"] .theme-toggle[aria-pressed="true"]{border-color:var(--green);background:#26262a;color:#ffffff}
:root[data-theme="dark"] :is(.nav-item,.history-item:hover,.history-item.active){background:#232327;color:#ffffff}
:root[data-theme="dark"] :is(.step,.count-tag){background:#26262a;color:#d4d4d8}
:root[data-theme="dark"] :is(.banner,.holiday-options,.assist-result){background:#18181b;border-color:#34343a;color:#d4d4d8}
:root[data-theme="dark"] :is(.version-tag,.options-grid){border-color:var(--border)}
:root[data-theme="dark"] .upload{background:#111113;border-color:#34343a}
:root[data-theme="dark"] .upload.drag{background:#222226;border-color:var(--green)}
:root[data-theme="dark"] :is(.upload strong,.upload-icon,.slot-title,.holiday-intro strong){color:var(--night-accent)}
:root[data-theme="dark"] :is(.brand-sub,.nav-title,.history-empty,.history-item small,.sidebar-bottom,.sidebar-bottom p,.breadcrumb,.breadcrumb span,.intro p,.version-tag,.subtle,.upload span:not(.upload-icon),.upload small,.button.text,.slot-number,.slot-scene,.edit-label,.plan-note,.bottom-bar>div>span,.page-footer,.result-placeholder,.result-status,.icon-button,.settings-note,.holiday-intro span,.holiday-help,.slot-dialog-footer p,.model-status,.assist-status){color:var(--night-muted)}
:root[data-theme="dark"] .eyebrow{color:#a1a1aa}
:root[data-theme="dark"] .bottom-bar{background:#141416f2}
:root[data-theme="dark"] :is(.slot-dialog-footer,pre,.result-image){background:#0f0f11}
:root[data-theme="dark"] .slot.editing{border-color:var(--green);box-shadow:0 0 0 2px #ffffff22}
:root[data-theme="dark"] .slot:hover{box-shadow:0 4px 16px #00000030}
:root[data-theme="dark"] dialog{box-shadow:0 20px 80px #00000080}
:root[data-theme="dark"] dialog::backdrop{background:#000000a6}
:root[data-theme="dark"] .slot-dialog::backdrop{background:#00000080}
:root[data-theme="dark"] :is(.result-status.failed,.result-error){color:#f3ad8e}
:root[data-theme="dark"] .result-status.done{color:#9bd4ae}
:root[data-theme="dark"] .toast{background:#ececef;color:#0a0a0b;box-shadow:0 4px 25px #00000040}
:root[data-theme="dark"] :is(.connection-dot.connected,.local-dot){background:#80c9a2}
:root[data-theme="dark"] .connection-dot{background:#d2b581}
:root[data-theme="dark"] :is(input,select,textarea):focus{outline-color:#ffffff40;border-color:var(--green)}
:root[data-theme="dark"] :is(button,a):focus-visible{outline:2px solid #d4d4d8}
:root[data-theme="dark"] ::selection{background:#3f3f46;color:#fff}
@media(max-width:800px){header{min-height:65px}}

:root[data-theme="dark"] .resolution-options .invalid{color:#f3ad8e}

:root[data-theme="dark"] .quality-badge.pass{color:#9bd4ae}:root[data-theme="dark"] .quality-badge.fail{color:#f3ad8e}:root[data-theme="dark"] .quality-badge.uncertain{color:#e0c388}

/* Collapsible sidebar: same compact rail the layout already uses on narrow screens. */
.sidebar-toggle{border:0;background:none;color:var(--muted);width:32px;height:32px;border-radius:8px;display:inline-grid;place-items:center;margin-right:10px;flex-shrink:0}
.sidebar-toggle:hover{background:#eef2e9}
:root[data-theme="dark"] .sidebar-toggle:hover{background:var(--night-raised)}
.sidebar-toggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
header .header-left{display:flex;align-items:center}
:root[data-sidebar="collapsed"] .sidebar{width:68px;padding:23px 12px}
:root[data-sidebar="collapsed"] :is(.brand>span:last-child,.nav-title,.history,.sidebar-bottom){display:none}
:root[data-sidebar="collapsed"] .brand-mark{width:40px;height:40px}
:root[data-sidebar="collapsed"] .nav-item{font-size:0;padding:15px;margin-top:30px}
:root[data-sidebar="collapsed"] .nav-item:before{content:'◈';font-size:19px}
:root[data-sidebar="collapsed"] .workspace{margin-left:68px}
:root[data-sidebar="collapsed"] .bottom-bar{left:68px}
@media(max-width:800px){.sidebar-toggle{display:none}}

/* Sidebar "new task" button; icon-only on the compact rail. */
.new-task{display:flex;align-items:center;gap:10px;width:100%;margin-top:28px;padding:12px 14px;border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--green);font-size:13px;font-weight:600;text-align:left}
.new-task:hover{background:#f3f7f0;border-color:#c9d6c4}
.new-task-icon{font-size:16px;line-height:1}
.new-task+.nav-title{margin-top:28px}
:root[data-theme="dark"] .new-task{background:var(--night-raised);border-color:#34343a;color:var(--night-text)}
:root[data-theme="dark"] .new-task:hover{background:#26262a;border-color:#4a4a52}
:root[data-sidebar="collapsed"] .new-task{justify-content:center;padding:12px 0}
:root[data-sidebar="collapsed"] .new-task-label{display:none}
@media(max-width:800px){.new-task{justify-content:center;padding:12px 0}.new-task-label{display:none}}

/* Generation history: hover "⋯" menu with rename and delete. */
.history-row{position:relative}
.history-row .history-item{padding-right:34px}
.history-more{position:absolute;top:50%;right:4px;transform:translateY(-50%);width:26px;height:26px;border:0;border-radius:6px;background:none;color:var(--muted);font-size:16px;line-height:1;opacity:0}
.history-row:hover .history-more,.history-more:focus-visible{opacity:1}
.history-more:hover{background:#e3eadf}
@media(hover:none){.history-more{opacity:1}}
.history-menu{position:fixed;z-index:40;width:128px;padding:4px;border:1px solid var(--border);border-radius:9px;background:#fff;box-shadow:0 8px 28px #1e3a2a24}
.history-menu button{display:block;width:100%;padding:9px 10px;border:0;border-radius:6px;background:none;text-align:left;font-size:12px;color:#35553d}
.history-menu button:hover:not(:disabled){background:#eef2e9}
.history-menu button.danger{color:#b4452f}
.history-menu button:disabled{opacity:.45;cursor:not-allowed}
.history-rename{margin:4px 0;padding:9px;font-size:12px}
:root[data-theme="dark"] .history-more:hover{background:#2a2a2f}
:root[data-theme="dark"] .history-menu{background:var(--night-raised);border-color:#34343a;box-shadow:0 8px 28px #00000080}
:root[data-theme="dark"] .history-menu button{color:var(--night-text)}
:root[data-theme="dark"] .history-menu button:hover:not(:disabled){background:#2a2a2f}
:root[data-theme="dark"] .history-menu button.danger{color:#f09a86}
.history-row:hover .history-item{background:#eef2e9}
:root[data-theme="dark"] .history-row:hover .history-item{background:#232327;color:#ffffff}
