/* Shared Apple-inspired visual system. Editing toolbars and tool rails are intentionally excluded. */
:root {
  --apple-bg: #f5f5f7;
  --apple-surface: #ffffff;
  --apple-surface-raised: rgba(255, 255, 255, 0.92);
  --apple-card: rgba(255, 255, 255, 0.72);
  --apple-fill: rgba(118, 118, 128, 0.12);
  --apple-fill-strong: rgba(118, 118, 128, 0.18);
  --apple-separator: rgba(0, 0, 0, 0.08);
  --apple-label: #1d1d1f;
  --apple-secondary: #6e6e73;
  --apple-tertiary: #86868b;
  --apple-blue: #0071e3;
  --apple-blue-light: rgba(0, 113, 227, 0.1);
  --apple-blue-pressed: #0068d1;
  --apple-red: #ff3b30;
  --apple-green: #248a3d;
  --apple-orange: #ff9500;
  --apple-radius-control: 12px;
  --apple-radius-card: 16px;
  --apple-radius-modal: 20px;
  --apple-radius-pill: 9999px;
  --apple-shadow-card: 0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.06);
  --apple-shadow-modal: 0 20px 60px rgba(0,0,0,.2), 0 2px 8px rgba(0,0,0,.08);
  --apple-ease: cubic-bezier(.25,.46,.45,.94);

  --bg-page: var(--apple-bg);
  --bg-card: var(--apple-card);
  --text-primary: var(--apple-label);
  --text-secondary: var(--apple-secondary);
  --text-tertiary: var(--apple-tertiary);
  --border-light: var(--apple-separator);
}

@media (prefers-color-scheme: dark) {
  :root {
    --apple-bg: #000000;
    --apple-surface: #1c1c1e;
    --apple-surface-raised: rgba(44,44,46,.94);
    --apple-fill: rgba(118,118,128,.24);
    --apple-fill-strong: rgba(118,118,128,.32);
    --apple-separator: rgba(84,84,88,.65);
    --apple-label: #f5f5f7;
    --apple-secondary: #aeaeb2;
    --apple-tertiary: #8e8e93;
    --apple-blue: #0a84ff;
    --apple-blue-pressed: #409cff;
    --apple-red: #ff453a;
    --apple-green: #30d158;
    --apple-shadow-card: 0 1px 2px rgba(0,0,0,.35), 0 10px 28px rgba(0,0,0,.3);
    --apple-shadow-modal: 0 24px 64px rgba(0,0,0,.62);
  }
}

html { color-scheme: light dark; }
*, *::before, *::after { box-sizing: border-box; }
body { color: var(--apple-label); background: var(--apple-bg); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; letter-spacing: 0; }
button, input, select, textarea { font: inherit; letter-spacing: 0; }
::selection { background: color-mix(in srgb, var(--apple-blue) 24%, transparent); }

/* Commands outside editing toolbars */
body .primary-btn,
body.apple-benchmark button.primary,
body .sheet-btn.primary,
body[data-active-view="workbench"] :is(.workbench-panel, .workbench-empty-state, .wb-export-modal) .primary-action {
  min-height: 44px;
  padding: 10px 18px;
  border: 1px solid transparent;
  border-radius: var(--apple-radius-pill);
  color: #fff;
  background: var(--apple-blue);
  box-shadow: none;
  font-weight: 600;
  transition: background .16s var(--apple-ease), transform .16s var(--apple-ease), opacity .16s;
}
body .primary-btn:active,
body.apple-benchmark button.primary:active,
body .sheet-btn.primary:active,
body[data-active-view="workbench"] :is(.workbench-panel, .workbench-empty-state, .wb-export-modal) .primary-action:active { background: var(--apple-blue-pressed); transform: scale(.98); }
body .primary-btn:disabled,
body.apple-benchmark button.primary:disabled,
body[data-active-view="workbench"] :is(.workbench-panel, .workbench-empty-state, .wb-export-modal) .primary-action:disabled { opacity: .38; cursor: default; transform: none; }

body .secondary-btn:not(.float-btn):not(.topbar-list):not(.topbar-size),
body[data-active-view="workbench"] :is(.workbench-panel, .wb-export-modal) .secondary-action {
  min-height: 44px;
  padding: 10px 16px;
  border: 1px solid var(--apple-separator);
  border-radius: var(--apple-radius-control);
  color: var(--apple-blue);
  background: var(--apple-surface);
  box-shadow: none;
  font-weight: 600;
  transition: background .16s var(--apple-ease), transform .16s var(--apple-ease), opacity .16s;
}
body .secondary-btn:not(.float-btn):active,
body[data-active-view="workbench"] :is(.workbench-panel, .wb-export-modal) .secondary-action:active { background: var(--apple-fill); transform: scale(.98); }
body .secondary-btn:disabled,
body[data-active-view="workbench"] :is(.workbench-panel, .wb-export-modal) .secondary-action:disabled { opacity: .38; cursor: default; }

/* Forms and settings content */
body :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea) {
  min-height: 42px;
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--apple-separator);
  border-radius: var(--apple-radius-control);
  outline: 0;
  color: var(--apple-label);
  background: var(--apple-surface);
  box-shadow: 0 1px 1px rgba(0,0,0,.02);
  transition: border-color .16s, box-shadow .16s, background .16s;
}
body :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea):focus {
  border-color: var(--apple-blue);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--apple-blue) 18%, transparent);
}
body :where(input, select, textarea):disabled { opacity: .5; background: var(--apple-fill); }
body :where(input[type="checkbox"], input[type="radio"]) { accent-color: var(--apple-blue); }
body :where(label, .fld-lbl, .wbe-label) { color: var(--apple-secondary); }

/* Toolbars: colors only. Dimensions, spacing and positioning remain owned by existing CSS. */
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(.topbar, .float-bar, .info-bar, .color-strip-wrap) {
  color: var(--apple-label);
  background: color-mix(in srgb, var(--apple-surface) 92%, transparent);
  border-color: var(--apple-separator);
  box-shadow: 0 1px 10px rgba(0,0,0,.05);
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
}
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(.topbar-size, .topbar-list, .topbar-undo, .float-btn) { color: var(--apple-secondary); }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(.topbar-size, .topbar-list, .float-btn.icon-only) { background: var(--apple-fill); }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(.brand-btn, .topbar-save, .float-btn.active, .float-play) { color: #fff; background: var(--apple-blue); box-shadow: 0 1px 5px color-mix(in srgb, var(--apple-blue) 25%, transparent); }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(.brand-btn, .topbar-save, .float-btn.active, .float-play) :where(svg, span) { color: inherit; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(.float-divider, .info-divider) { background: var(--apple-separator); }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(.float-btn[data-tool="erase"], .float-btn[data-tool="deleteColor"]).active { color: #fff; background: var(--apple-red); }

body[data-active-view="workbench"] :where(.result-toolbar, .workbench-edit-rail, .workbench-modebar, .workbench-view-aids) {
  color: var(--apple-label);
  background-color: color-mix(in srgb, var(--apple-surface) 92%, transparent);
  border-color: var(--apple-separator);
}
body[data-active-view="workbench"] :where(.workbench-edit-rail-action, .workbench-edit-rail-transform, .workbench-edit-rail-tool, .workbench-mode-btn) { color: var(--apple-secondary); border-color: var(--apple-separator); }
body[data-active-view="workbench"] :where(.workbench-edit-rail-tool.is-active, .workbench-mode-btn.is-active, .workbench-mode-btn[aria-pressed="true"]) { color: var(--apple-blue); border-color: var(--apple-blue); background-color: color-mix(in srgb, var(--apple-blue) 10%, var(--apple-surface)); }
body[data-active-view="workbench"] :where(.workbench-edit-rail-action:active, .workbench-edit-rail-transform:active, .workbench-mode-btn:active) { background-color: var(--apple-fill); }

/* Main app: content, cards and all modal families. */
body:not(.apple-benchmark):not([data-active-view="workbench"]) .canvas-area { background: var(--apple-bg); }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .empty-state { max-width: 430px; padding: 28px 22px; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .empty-title { color: #1d1d1f; font-size: 30px; font-weight: 760; letter-spacing: -.02em; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .empty-desc { color: #6e6e73; font-size: 15px; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .local-privacy { border: 0; background: transparent; color: #6e6e73; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .empty-state .primary-btn { border-color: transparent!important; background: #1d1d1f!important; color: #fff!important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .empty-state .secondary-btn { border-color:rgba(0,0,0,.11);background:rgba(255,255,255,.78);color:#3a3a3c; }
@media(min-width:900px){
  body:not(.apple-benchmark):not([data-active-view="workbench"]) .empty-state { width:min(680px,calc(100vw - 96px));max-width:none;padding:42px 36px; }
  body:not(.apple-benchmark):not([data-active-view="workbench"]) .empty-title { font-size:34px; letter-spacing: -.025em; }
}

body :where(.modal-overlay, .sheet-overlay, .layer-panel-overlay, .wb-export-modal) { background: rgba(0,0,0,.22); backdrop-filter: none; -webkit-backdrop-filter: none; }
body :where(.modal-panel, .sheet-panel, .layer-panel, .drawer, .wb-export-modal-card) {
  --dialog-surface: color-mix(in srgb, var(--apple-surface) 92%, var(--apple-bg));
  color: var(--apple-label);
  background: var(--dialog-surface);
  border: .5px solid var(--apple-separator);
  box-shadow: var(--apple-shadow-modal);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body :where(.modal-panel, .wb-export-modal-card) { border-radius: var(--apple-radius-modal); overflow: hidden; }
body :where(.sheet-panel, .drawer) { border-radius: 22px 22px 0 0; }
body :where(.modal-head, .wb-export-modal-head) { min-height: 56px; padding: 12px 16px; border-bottom: .5px solid var(--apple-separator); color: var(--apple-label); background: var(--dialog-surface, var(--apple-surface)); font-size: 17px; font-weight: 600; }
body :where(.modal-body, .wb-export-modal-opts) { color: var(--apple-label); background: var(--dialog-surface, var(--apple-surface)); }
body :where(.modal-footer, .wb-export-modal-foot) { padding: 12px 16px calc(16px + env(safe-area-inset-bottom, 0px)); border-top: .5px solid var(--apple-separator); background: var(--dialog-surface, var(--apple-surface)); }
body :where(.modal-x, .wb-export-modal-x) { width: 32px; height: 32px; border-radius: 50%; color: var(--apple-secondary); background: var(--apple-fill); font-size: 20px; line-height: 1; }
body :where(.modal-x, .wb-export-modal-x):active { background: var(--apple-fill-strong); transform: scale(.94); }
body :where(.sheet-handle, .drawer-handle) { width: 36px; height: 4px; border-radius: 999px; background: var(--apple-separator); opacity: 1; }
body .sheet-title, body .drawer-title { color: var(--apple-label); font-size: 17px; font-weight: 650; }
body .sheet-btn { min-height: 48px; margin-bottom: 8px; border: 1px solid var(--apple-separator) !important; border-radius: var(--apple-radius-control); color: var(--apple-blue) !important; background: var(--apple-surface) !important; font-weight: 600; }
body .sheet-btn:active { background: var(--apple-fill) !important; transform: scale(.985); }
body .sheet-btn.danger { color: var(--apple-red) !important; }
body .sheet-cancel, body .drawer-close { min-height: 48px; color: var(--apple-blue); font-weight: 600; }

body :where(.param-group, .export-toggle, .brand-section, .stats-row) { border-color: var(--apple-separator); background: var(--apple-surface); }

/* Main app legacy and dynamically-created overlays */
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .modal-overlay, .sheet-overlay, .drawer, .layer-panel, .strategy-chooser,
  .export-preview-overlay, .layer-sheet-overlay, .onboard-overlay,
  #processingOverlay, .focus-overlay, .preview-3d-overlay, .param-group
) {
  --yellow: var(--apple-blue);
  --yellow-d: var(--apple-blue-pressed);
  --yellow-light: color-mix(in srgb, var(--apple-blue) 9%, var(--apple-surface));
  --yellow-alpha: color-mix(in srgb, var(--apple-blue) 16%, transparent);
  color: var(--apple-label);
}
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .strategy-panel, .layer-sheet-panel, .layer-sheet-card, .onboard-card,
  .proc-panel, .focus-panel, .cp-picker-panel
) {
  color: var(--apple-label) !important;
  border: .5px solid var(--apple-separator) !important;
  border-radius: var(--apple-radius-modal) !important;
  background: var(--apple-surface-raised) !important;
  box-shadow: var(--apple-shadow-modal) !important;
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
}
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .strategy-head, .layer-panel-head, .layer-sheet-head, .onboard-card-title,
  .proc-title, .export-section-title
) { color: var(--apple-label) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .strategy-head p, .strategy-source, .strategy-card-head small, .onboard-card-desc,
  .proc-step, .proc-sub, .export-guide, .layer-meta, .layer-sheet-op-label
) { color: var(--apple-secondary) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .strategy-card, .strategy-source, .layer-item, .layer-sheet-card,
  .drawing-item, .stats-item, .export-toggle, .export-res-card
) { border-color: var(--apple-separator) !important; background: var(--apple-surface) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .strategy-card.selected, .series-tab.active, .chip:has(input:checked),
  .chip-sm:has(input:checked), .export-res-card.selected, .layer-item.active
) { border-color: var(--apple-blue) !important; background: color-mix(in srgb, var(--apple-blue) 9%, var(--apple-surface)) !important; color: var(--apple-label) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .strategy-card footer button, .cp-btn-confirm, .onboard-next,
  #denoiseAdvancedConfirm, .export-download-btn, .proc-bar-fill
) { border-color: var(--apple-blue) !important; background: var(--apple-blue) !important; color: #fff !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .strategy-close, .layer-close-btn, .layer-sheet-close, .cp-btn-cancel,
  .onboard-skip, .drawing-item-act, .stats-act-btn
) { color: var(--apple-blue) !important; background: var(--apple-fill) !important; border-color: transparent !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .danger, .drawing-delete, .stats-delete
) { color: var(--apple-red) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .proc-bar-track, .export-more-body, .cp-values, .layer-panel-footer
) { border-color: var(--apple-separator) !important; background: var(--apple-fill) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .crop-panel, .modal-panel-crop
) { background: var(--apple-surface-raised) !important; color: var(--apple-label) !important; border-color: var(--apple-separator) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) input[type="range"] { accent-color: var(--apple-blue) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .onboard-dot.active { background: var(--apple-blue) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .strategy-notice { border-left-color: var(--apple-blue) !important; background: color-mix(in srgb, var(--apple-blue) 8%, var(--apple-surface)) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .export-toggle.on, .export-fopt.on, .export-res-opt.on,
  .layer-item.active, .layer-item.type-ref.active
) { border-color: var(--apple-blue) !important; background: color-mix(in srgb, var(--apple-blue) 9%, var(--apple-surface)) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .export-toggle.on .export-toggle-r, .layer-footer-chip.active,
  .focus-progress-fill, #processingOverlay .proc-bar-fill
) { background: var(--apple-blue) !important; color: #fff !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .layer-ctrl-btn.on, .layer-ctrl-btn.ref-transform, .layer-drag-handle:active
) { color: var(--apple-blue) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .drawer-search input, .cp-hex-input, .fld-sel, .fld-inp,
  #inputDialogInput, #textToolInput, #textSpacingNum, #saveNameInput,
  #epSearch, #rpSearch, .layer-sheet-rename-input
):focus { border-color: var(--apple-blue) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--apple-blue) 18%, transparent) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(
  .color-picker-item.selected
) { border-color: var(--apple-blue) !important; box-shadow: 0 0 0 2px var(--apple-blue), 0 2px 8px color-mix(in srgb, var(--apple-blue) 30%, transparent) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .stats-cleanup { color: var(--apple-blue) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .color-cleanup-panel { max-width: 440px; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .color-cleanup-copy { margin: 0 4px 14px; color: var(--apple-secondary); font-size: 13px; line-height: 1.55; text-align: center; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .color-cleanup-meter { padding: 12px; border: 1px solid var(--apple-separator); border-radius: 12px; background: var(--apple-fill); }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .color-cleanup-meter > div:first-child { display: flex; justify-content: space-between; align-items: center; color: var(--apple-secondary); font-size: 12px; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .color-cleanup-meter strong { color: var(--apple-label); font-size: 14px; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .color-cleanup-meter input { width: 100%; margin: 12px 0 6px; accent-color: var(--apple-blue) !important; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .color-cleanup-scale { display: flex; justify-content: space-between; color: var(--apple-tertiary); font-size: 11px; }
body:not(.apple-benchmark):not([data-active-view="workbench"]) .color-cleanup-status { min-height: 38px; padding: 10px 4px; color: var(--apple-secondary); font-size: 12px; text-align: center; }

@media (max-width: 700px) {
  body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(.strategy-panel, .layer-sheet-panel, .focus-panel) { border-radius: 22px 22px 0 0 !important; }
}
body .export-toggle.on { border-color: var(--apple-blue); background: color-mix(in srgb, var(--apple-blue) 8%, var(--apple-surface)); }

/* Workbench content only. result-toolbar/edit rail/modebar are deliberately untouched. */
body[data-active-view="workbench"] { --bg: var(--apple-bg); --surface: var(--apple-surface); --surface-soft: var(--apple-fill); --text: var(--apple-label); --muted: var(--apple-secondary); --light: var(--apple-tertiary); --line: var(--apple-separator); --blue: var(--apple-blue); background: var(--apple-bg); }
body[data-active-view="workbench"] :where(.studio-card, .source-card, .workbench-panel, .workbench-settings-panel, .wb-wm-panel) {
  color: var(--apple-label);
  border: .5px solid var(--apple-separator);
  border-radius: var(--apple-radius-card);
  background: var(--apple-surface);
  box-shadow: var(--apple-shadow-card);
}
body[data-active-view="workbench"] :where(.panel-title, .workbench-empty-state h3) { color: var(--apple-label); }
body[data-active-view="workbench"] :where(.panel-meta, .wbe-hint, .canvas-placeholder) { color: var(--apple-secondary); }
body[data-active-view="workbench"] .wb-export-modal-preview { border-radius: 12px; background: var(--apple-fill); }
body[data-active-view="workbench"] .wb-export-opt { min-height: 48px; padding: 10px 12px; border-bottom: .5px solid var(--apple-separator); }

/* Workbench dynamically-created dialogs, sheets, popovers and context menus */
body[data-active-view="workbench"] :where(
  .wb-settings-modal, .wbe-export-dialog, .wbe-export-strategy-dialog,
  .wbe-tiling-export-dialog, .feature-guide-modal, .wb-mobile-save-draft-sheet,
  .wb-mobile-save-draft-name-sheet, .wb-mobile-palette-sheet
) { color: var(--apple-label); }
body[data-active-view="workbench"] :where(
  .wb-settings-modal-backdrop, .wb-mobile-palette-sheet-backdrop
) { background: rgba(0,0,0,.34) !important; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
body[data-active-view="workbench"] :where(
  .wb-settings-modal-shell, .wbe-export-dialog-card, .wbe-export-strategy,
  .wbe-crop-manual-panel, .wb-mobile-palette-sheet-content,
  .wb-mobile-save-draft-sheet, .wb-mobile-save-draft-name-sheet,
  .feature-guide-modal, .wb-brush-picker-panel
) {
  color: var(--apple-label) !important;
  border: .5px solid var(--apple-separator) !important;
  border-radius: var(--apple-radius-modal) !important;
  background: var(--apple-surface-raised) !important;
  box-shadow: var(--apple-shadow-modal) !important;
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
}
body[data-active-view="workbench"] :where(
  .wb-settings-modal-head, .wb-mobile-palette-sheet-header,
  .wb-brush-picker-panel-head, .wbe-export-strategy-title
) { color: var(--apple-label) !important; border-color: var(--apple-separator) !important; background: inherit !important; }
body[data-active-view="workbench"] :where(
  .wb-settings-modal-close, .wb-mobile-palette-sheet-close-btn
) { color: var(--apple-secondary) !important; background: var(--apple-fill) !important; border-radius: 50% !important; }
body[data-active-view="workbench"] :where(
  .wb-settings-section, .wb-settings-row, .wb-mobile-palette-sheet-row,
  .wb-mobile-palette-sheet-reduce, .wbe-export-strategy-list,
  .wbe-export-strategy-manual
) { color: var(--apple-label) !important; border-color: var(--apple-separator) !important; background: var(--apple-surface) !important; }
body[data-active-view="workbench"] :where(
  .wb-settings-hint, .wb-mobile-palette-sheet-meta, .wb-mobile-palette-sheet-reduce-hint,
  .wb-lasso-menu-hint, .wbe-export-strategy-manual
) { color: var(--apple-secondary) !important; }
body[data-active-view="workbench"] :where(
  .wb-settings-chip.is-active, .wb-settings-chip[aria-pressed="true"],
  .wb-mobile-palette-sheet-item.is-active
) { border-color: var(--apple-blue) !important; color: var(--apple-blue) !important; background: color-mix(in srgb, var(--apple-blue) 9%, var(--apple-surface)) !important; }
body[data-active-view="workbench"] .wb-lasso-menu {
  color: var(--apple-label) !important;
  border: .5px solid var(--apple-separator) !important;
  border-radius: 14px !important;
  background: var(--apple-surface-raised) !important;
  box-shadow: var(--apple-shadow-modal) !important;
  backdrop-filter: blur(24px) saturate(180%);
  -webkit-backdrop-filter: blur(24px) saturate(180%);
}
body[data-active-view="workbench"] :where(.wb-lasso-menu-btn, .wb-lasso-submenu-btn, .wb-save-menu-item) { color: var(--apple-label) !important; border-color: var(--apple-separator) !important; background: transparent !important; }
body[data-active-view="workbench"] :where(.wb-lasso-menu-btn--primary) { color: var(--apple-blue) !important; }
body[data-active-view="workbench"] :where(.wb-lasso-menu-btn--danger, [data-danger="true"]) { color: var(--apple-red) !important; }
body[data-active-view="workbench"] :where(.wb-save-menu-pop, .wb-lasso-submenu) { color: var(--apple-label) !important; border-color: var(--apple-separator) !important; border-radius: 12px !important; background: var(--apple-surface-raised) !important; box-shadow: var(--apple-shadow-card) !important; }
body[data-active-view="workbench"] :where(.wb-mobile-palette-sheet-reduce-slider, .wb-settings-modal input[type="range"]) { accent-color: var(--apple-blue) !important; }

@media (max-width: 700px) {
  body[data-active-view="workbench"] :where(.wb-settings-modal-shell, .wb-mobile-palette-sheet-content) { border-radius: 22px 22px 0 0 !important; }
  body[data-active-view="workbench"] :where(.wbe-export-dialog-card, .wb-export-modal-card, .wbe-export-strategy) { border-radius: 18px !important; }
}

/* Benchmark page */
body.apple-benchmark { min-height: 100vh; overflow-x: hidden; background: var(--apple-bg); color: var(--apple-label); }
body.apple-benchmark .top { background: color-mix(in srgb, var(--apple-surface) 88%, transparent); border-bottom: .5px solid var(--apple-separator); box-shadow: 0 1px 12px rgba(0,0,0,.04); backdrop-filter: blur(24px) saturate(180%); -webkit-backdrop-filter: blur(24px) saturate(180%); }
body.apple-benchmark .top b { font-size: 19px; font-weight: 700; }
body.apple-benchmark .top span { color: var(--apple-secondary); }
body.apple-benchmark .layout { gap: 14px; padding: 14px; }
body.apple-benchmark .panel { border: .5px solid var(--apple-separator); border-radius: var(--apple-radius-card); color: var(--apple-label); background: var(--apple-surface); box-shadow: var(--apple-shadow-card); }
body.apple-benchmark :where(h2,h3) { color: var(--apple-label); }
body.apple-benchmark :where(.meta, .stage) { border-color: var(--apple-separator); border-radius: 12px; background: var(--apple-fill); }
body.apple-benchmark :where(.muted, figcaption) { color: var(--apple-secondary); }
body.apple-benchmark .metric { border-bottom-color: var(--apple-separator); }
body.apple-benchmark .error { color: var(--apple-red); }

@media (max-width: 700px) {
  /* Dialogs stay centered by default. Only explicit sheets are bottom-aligned. */
  body :where(.modal-panel, .wb-export-modal-card) { width: calc(100vw - 24px); max-width: none; max-height: calc(100dvh - 24px); border-radius: 18px; }
  body:not(.apple-benchmark):not([data-active-view="workbench"]) .modal-overlay { align-items: center; padding: 12px; }
  body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(#inputDialog, #settingsBrandModal, #statsModal, #cropOverlay, .segmentation-modal) { align-items: center !important; padding: 12px; }
  body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(#inputDialog, #settingsBrandModal, #statsModal, #cropOverlay, .segmentation-modal) .modal-panel { width: min(100%, 520px); max-width: calc(100vw - 24px); border-radius: 18px; }
  body:not(.apple-benchmark):not([data-active-view="workbench"]) #settingsModal { align-items: flex-end; padding: 0; }
  body:not(.apple-benchmark):not([data-active-view="workbench"]) #settingsModal .modal-panel { width: 100%; max-width: 100%; border-radius: 22px 22px 0 0; }
  body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(#cropOverlay, .segmentation-modal) .modal-panel { max-height: calc(100dvh - 24px); }
  body.apple-benchmark .layout { padding: 10px; gap: 10px; }
  body.apple-benchmark .top { padding: 10px 12px; }
}

@media (hover: none), (pointer: coarse) {
  /* Mobile overlays use opaque surfaces and compositor-only motion. */
  body :where(
    .modal-overlay, .sheet-overlay, .strategy-chooser, .layer-panel-overlay,
    .layer-sheet-overlay, .onboard-overlay, .export-preview-overlay,
    .preview-3d-overlay, .segmentation-modal,
    .wb-settings-modal-backdrop, .wb-mobile-palette-sheet-backdrop,
    .topbar, .float-bar, .float-capsule, .info-bar, .color-strip-wrap,
    .tool-hint-toast
  ) {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  body :where(
    .modal-panel, .sheet-panel, .drawer, .strategy-panel, .layer-panel,
    .layer-sheet-panel, .onboard-card, .proc-panel, .focus-panel,
    .cp-picker-panel, .wb-settings-modal-shell, .wbe-export-dialog-card,
    .wbe-export-strategy, .wbe-crop-manual-panel,
    .wb-mobile-palette-sheet-content, .wb-mobile-save-draft-sheet,
    .wb-mobile-save-draft-name-sheet, .feature-guide-modal,
    .wb-brush-picker-panel
  ) {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background-color: var(--apple-surface-raised, #fff) !important;
  }
  body :where(.modal-panel, .sheet-panel, .drawer, .strategy-panel, .focus-panel) {
    will-change: transform, opacity;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Reduced-transparency: freeze translucency to solid surfaces (mirrors the touch-device rule above). */
@media (prefers-reduced-transparency: reduce) {
  *, *::before, *::after { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  body :where(
    .topbar, .float-bar, .float-capsule, .info-bar, .color-strip-wrap,
    .modal-panel, .sheet-panel, .drawer, .strategy-panel, .layer-panel,
    .layer-sheet-panel, .onboard-card, .proc-panel, .focus-panel, .cp-picker-panel,
    .wb-settings-modal-shell, .wbe-export-dialog-card, .wbe-export-strategy,
    .wbe-crop-manual-panel, .wb-mobile-palette-sheet-content,
    .wb-mobile-save-draft-sheet, .wb-mobile-save-draft-name-sheet,
    .feature-guide-modal, .wb-brush-picker-panel, .wb-lasso-menu,
    .wb-save-menu-pop, .wb-lasso-submenu, .float-color-wrap
  ) { background-color: var(--apple-surface) !important; }
  body :where(.modal-overlay, .sheet-overlay, .layer-panel-overlay, .wb-export-modal) {
    background: rgba(0,0,0,.4) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  }
}

/* Apple geometry and color contract: modal 20, card/canvas 16, controls 12, primary pill. */
body :where(.modal-panel,.wb-export-modal-card,.strategy-panel,.segmentation-panel,.legal-modal,.onboard-card,.preview-3d-container){border-radius:var(--apple-radius-modal)!important}
body :where(.empty-state,.desktop-image-dropzone,.settings-preview-wrap,.param-group,.drawing-item,.stats-color-item,.export-res-opt,.export-fopt,.brush-size-option,.delete-color-mode-option,.workbench-panel,.workbench-empty-state,.result-canvas-wrap,.workbench-canvas-shell,.panel,.stage){border-radius:var(--apple-radius-card)!important}
body :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),select,textarea,.secondary-btn:not(.float-btn),.topbar-project,.topbar-project-menu,.sheet-btn,.export-btn,.ep-btn,.tool-tab,.workbench-mode-btn){border-radius:var(--apple-radius-control)!important}
body :where(.primary-btn,.sheet-btn.primary,.export-download-btn,.legal-agree-btn,button.primary,.primary-action){border-radius:var(--apple-radius-pill)!important;background:var(--apple-blue)!important;color:#fff!important;border-color:transparent!important}
body :where(.primary-btn,.sheet-btn.primary,.export-download-btn,.legal-agree-btn,button.primary,.primary-action):active{background:var(--apple-blue-pressed)!important}
body:not(.apple-benchmark):not([data-active-view="workbench"]) :where(.brand-btn,.topbar-save,.float-btn.active,.float-play){background:var(--apple-blue)!important;color:#fff!important}
body :where(.modal-panel,.sheet-panel,.layer-panel,.drawer,.wb-export-modal-card,.legal-modal,.onboard-card){--dialog-surface:color-mix(in srgb,var(--apple-surface) 92%,var(--apple-bg));border-color:var(--apple-separator)!important;background-color:var(--dialog-surface)!important}
body :where(.canvas-area,.workbench-shell,.layout){background-color:var(--apple-bg)}
body :where(.icon,.ui-svg-icon){width:1em;height:1em;flex:0 0 auto;stroke-linecap:round;stroke-linejoin:round}
.ui-svg-icon{display:inline-block;vertical-align:-.14em}