/* BioStudio AI — Bench.
   A tiling workbench. Windows become full-height columns laid side by side
   on a strip that scrolls sideways (js/core/style-behaviors.js): nothing
   overlaps, new windows open beside the one you are using, drag a column to
   reorder, resize it to set its width, maximize to make it full width. The
   top bar holds a minimap of the columns, an "Open an app or file…" field
   and compact app buttons. Surfaces read like a lab bench on a cutting mat. */

/* --- Palette ---------------------------------------------------------------- */
html:not(.shell-mobile) #os.theme-bench[data-color-theme],
html:not(.shell-mobile) body.theme-bench[data-color-theme] {
  --ct-desktop: #dfe5de;
  --ct-bg: #f6f7f5;
  --ct-surface: #ffffff;
  --ct-surface-2: #f3f5f2;
  --ct-surface-3: #e8ece7;
  --ct-titlebar: #f3f5f2;
  --ct-flyout: #ffffff;
  --ct-input: #ffffff;
  --ct-text: #18211d;
  --ct-muted: #56625c;
  --ct-faint: #8a958f;
  --ct-line: rgba(24, 40, 32, 0.14);
  --ct-line-strong: rgba(24, 40, 32, 0.26);
  --ct-hover: rgba(24, 40, 32, 0.06);
  --ct-taskbar: #f3f5f2;
  --ct-shadow: 0 10px 30px rgba(24, 40, 32, 0.12);
  --nv-mat-line: rgba(24, 60, 44, 0.08);
  --nv-mat-line-strong: rgba(24, 60, 44, 0.16);
}

html:not(.shell-mobile) #os.theme-bench:is([data-color-theme="black"], [data-color-theme="ocean"], [data-color-theme="orchid"]),
html:not(.shell-mobile) body.theme-bench:is([data-color-theme="black"], [data-color-theme="ocean"], [data-color-theme="orchid"]) {
  --ct-desktop: #141816;
  --ct-bg: #171b19;
  --ct-surface: #1d2220;
  --ct-surface-2: #1a1f1c;
  --ct-surface-3: #252b28;
  --ct-titlebar: #1a1f1c;
  --ct-flyout: #1f2522;
  --ct-input: #141816;
  --ct-text: #e6ece8;
  --ct-muted: #a3aea8;
  --ct-faint: #6f7a74;
  --ct-line: rgba(230, 236, 232, 0.1);
  --ct-line-strong: rgba(230, 236, 232, 0.2);
  --ct-hover: rgba(230, 236, 232, 0.06);
  --ct-taskbar: #111513;
  --ct-shadow: 0 10px 30px rgba(0, 0, 0, 0.45);
  --nv-mat-line: rgba(160, 220, 190, 0.05);
  --nv-mat-line-strong: rgba(160, 220, 190, 0.1);
}

html:not(.shell-mobile) #os.theme-bench,
html:not(.shell-mobile) body.theme-bench {
  --nv-font: "IBM Plex Sans", ui-sans-serif, -apple-system, "Segoe UI", "BS Inter", "Helvetica Neue", sans-serif;
  --nv-font-title: var(--nv-font);
  --nv-font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --nv-ink: var(--ct-text);
  --nv-ink-2: var(--ct-muted);
  --nv-ink-3: var(--ct-faint);
  --nv-line: var(--ct-line);
  --nv-surface: var(--ct-surface);
  --nv-surface-3: var(--ct-surface-3);
  --nv-accent: #0f7b6c;
  --nv-on-accent: #ffffff;
  --nv-radius: 8px;
  --nv-radius-menu: 8px;
  --nv-radius-item: 5px;
  --nv-win-border: 1px solid var(--ct-line-strong);
  --nv-win-border-focus: 1px solid var(--nv-accent);
  --nv-shadow: 0 0 0 1px color-mix(in srgb, var(--nv-accent) 40%, transparent), 0 10px 28px rgba(24, 40, 32, 0.16);
  --nv-shadow-idle: 0 4px 14px rgba(24, 40, 32, 0.08);
  --nv-titlebar: var(--ct-surface-2);
  --nv-titlebar-rule: 1px solid var(--ct-line);
  --nv-titlebar-h: 34px;
  --nv-title-size: 12.5px;
  --nv-title-weight: 600;
  --nv-ctl-w: 30px;
  --nv-ctl-h: 24px;
  --nv-ctl-radius: 5px;
  --nv-ctl-gap: 2px;
  --nv-ctl-pad: 6px;
  --nv-ctl-glyph: 12px;
  --nv-hover: var(--ct-hover);
  --nv-close-hover: #c4432f;
  --nv-menu: var(--ct-surface);
  --nv-menu-border: 1px solid var(--ct-line-strong);
  --nv-menu-shadow: 0 12px 30px rgba(24, 40, 32, 0.16);
  --nv-menu-pad: 4px;
  --nv-menu-hover: color-mix(in srgb, #0f7b6c 12%, transparent);
  --nv-menu-hover-ink: var(--ct-text);
  --nv-item-h: 28px;
  --nv-scrim: rgba(10, 20, 16, 0.24);
  --nv-desk-ink: var(--ct-text);
  --nv-desk-shadow: none;
  --nv-desk-hover: rgba(255, 255, 255, 0.4);
  --nv-desk-selected: color-mix(in srgb, #0f7b6c 16%, transparent);
  --nv-scroll: color-mix(in srgb, var(--ct-text) 30%, transparent);
  --taskbar-h: 44px;
  --taskbar-clearance: 0px;
}

html:not(.shell-mobile) #os.theme-bench:is([data-color-theme="black"], [data-color-theme="ocean"], [data-color-theme="orchid"]),
html:not(.shell-mobile) body.theme-bench:is([data-color-theme="black"], [data-color-theme="ocean"], [data-color-theme="orchid"]) {
  --nv-accent: #3cc3ad;
  --nv-on-accent: #07201b;
  --nv-menu-hover: color-mix(in srgb, #3cc3ad 16%, transparent);
  --nv-menu-shadow: 0 12px 30px rgba(0, 0, 0, 0.5);
  --nv-shadow: 0 0 0 1px color-mix(in srgb, #3cc3ad 45%, transparent), 0 10px 28px rgba(0, 0, 0, 0.5);
  --nv-shadow-idle: 0 4px 14px rgba(0, 0, 0, 0.35);
  --nv-desk-hover: rgba(255, 255, 255, 0.05);
}

/* A cutting mat: fine lines every 20px, stronger every 100px. */
html:not(.shell-mobile) #os.theme-bench.wp-bench[data-os-theme] {
  background:
    linear-gradient(var(--nv-mat-line-strong) 1px, transparent 1px) 0 0 / 100px 100px,
    linear-gradient(90deg, var(--nv-mat-line-strong) 1px, transparent 1px) 0 0 / 100px 100px,
    linear-gradient(var(--nv-mat-line) 1px, transparent 1px) 0 0 / 20px 20px,
    linear-gradient(90deg, var(--nv-mat-line) 1px, transparent 1px) 0 0 / 20px 20px,
    var(--ct-desktop);
}

.tk-bench {
  background:
    linear-gradient(rgba(24, 60, 44, 0.18) 1px, transparent 1px) 0 0 / 12px 12px,
    linear-gradient(90deg, rgba(24, 60, 44, 0.18) 1px, transparent 1px) 0 0 / 12px 12px,
    #dfe5de;
}

html:not(.shell-mobile) #os.theme-bench .wallpaper-logo-layer,
html:not(.shell-mobile) #os.theme-bench .wallpaper-wordmark {
  display: none !important;
}

html:not(.shell-mobile) #os.theme-bench .desktop-surface {
  inset: 44px 0 0 0;
}

/* --- Columns ------------------------------------------------------------------ */
html:not(.shell-mobile) #os.theme-bench .window.bench-anim {
  transition: left 0.24s cubic-bezier(0.2, 0.8, 0.2, 1), width 0.24s cubic-bezier(0.2, 0.8, 0.2, 1), top 0.24s ease, height 0.24s ease;
}

html:not(.shell-mobile) #os.theme-bench .window.focused .window-titlebar,
html:not(.shell-mobile) #os.theme-bench .window[data-app-color-theme].focused .window-titlebar {
  box-shadow: inset 0 3px 0 var(--nv-accent);
}

html:not(.shell-mobile) #os.theme-bench .window .window-title-text {
  gap: 8px;
}

html:not(.shell-mobile) #os.theme-bench .window.bench-tiled .resize-handle:not(.resize-e) {
  display: none;
}

/* --- Top bar -------------------------------------------------------------------- */
html:not(.shell-mobile) #os.theme-bench .taskbar {
  top: 0;
  bottom: auto;
  left: 0;
  right: 0;
  height: 44px;
  display: grid;
  grid-template-columns: minmax(160px, 1fr) auto minmax(160px, 1fr);
  align-items: center;
  gap: 12px;
  padding: 0 8px 0 12px;
  border: 0;
  border-bottom: 1px solid var(--ct-line-strong);
  border-radius: 0;
  background: var(--ct-taskbar);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transform: none !important;
  font-family: var(--nv-font);
}

html:not(.shell-mobile) #os.theme-bench .taskbar-left {
  display: flex;
  align-items: center;
  min-width: 0;
}

/* Minimap of the columns, with the visible range outlined. */
html:not(.shell-mobile) #os.theme-bench .bench-map {
  position: relative;
  display: block;
  width: min(260px, 100%);
  height: 24px;
  border-radius: 6px;
  background: var(--ct-surface-3);
  box-shadow: inset 0 0 0 1px var(--ct-line);
  overflow: hidden;
}

html:not(.shell-mobile) #os.theme-bench .bench-map-cell {
  position: absolute;
  top: 5px;
  bottom: 5px;
  min-width: 3px;
  border-radius: 2px;
  background: color-mix(in srgb, var(--ct-text) 26%, transparent);
  cursor: pointer;
}

html:not(.shell-mobile) #os.theme-bench .bench-map-cell.is-focused {
  background: var(--nv-accent);
}

html:not(.shell-mobile) #os.theme-bench .bench-map-cell:hover {
  background: color-mix(in srgb, var(--nv-accent) 70%, transparent);
}

html:not(.shell-mobile) #os.theme-bench .bench-map-view {
  position: absolute;
  top: 1px;
  bottom: 1px;
  border: 1.5px solid var(--nv-accent);
  border-radius: 5px;
  pointer-events: none;
}

html:not(.shell-mobile) #os.theme-bench .taskbar-center {
  gap: 6px;
  justify-content: center;
}

html:not(.shell-mobile) #os.theme-bench .taskbar-center > :is(.taskbar-apps-launcher, .tb-desktop-pill, .dock-divider, .dock-stack, .tb-search),
html:not(.shell-mobile) #os.theme-bench .taskbar-center > .tb-icon-btn[title^="Task"] {
  display: none !important;
}

/* The command field (the Start button, dressed as an input). */
html:not(.shell-mobile) #os.theme-bench .taskbar-start {
  order: 0;
  width: clamp(240px, 32vw, 440px);
  height: 30px;
  justify-content: flex-start;
  gap: 8px;
  padding: 0 10px;
  border: 1px solid var(--ct-line-strong);
  border-radius: 6px;
  background: var(--ct-surface);
  color: var(--ct-muted);
  font-family: var(--nv-font);
  font-size: 13px;
}

html:not(.shell-mobile) #os.theme-bench .taskbar-start:hover {
  border-color: var(--nv-accent);
  background: var(--ct-surface);
}

html:not(.shell-mobile) #os.theme-bench .taskbar-start > .icon {
  width: 16px;
  height: 16px;
}

html:not(.shell-mobile) #os.theme-bench .taskbar-start .tb-start-label {
  display: inline;
}

html:not(.shell-mobile) #os.theme-bench .taskbar-apps {
  order: 1;
  gap: 2px;
}

html:not(.shell-mobile) #os.theme-bench :is(.task-btn, .tb-icon-btn:not(.taskbar-start)) {
  width: 32px;
  min-width: 32px;
  height: 32px;
  border-radius: 6px;
  border: 0;
  background: transparent;
  color: var(--ct-text);
}

html:not(.shell-mobile) #os.theme-bench .task-btn:hover {
  background: var(--ct-hover);
}

html:not(.shell-mobile) #os.theme-bench .task-btn.active {
  background: color-mix(in srgb, var(--nv-accent) 14%, transparent);
}

html:not(.shell-mobile) #os.theme-bench :is(.task-btn-icon, .task-btn-icon .icon) {
  width: 20px;
  height: 20px;
}

html:not(.shell-mobile) #os.theme-bench .task-btn-indicator {
  bottom: 2px;
  height: 2px;
  background: var(--ct-faint);
}

html:not(.shell-mobile) #os.theme-bench .task-btn.running .task-btn-indicator { width: 8px; opacity: 1; }
html:not(.shell-mobile) #os.theme-bench .task-btn.active .task-btn-indicator { width: 14px; background: var(--nv-accent); }

/* Tray. */
html:not(.shell-mobile) #os.theme-bench .taskbar-right {
  height: 44px;
}

html:not(.shell-mobile) #os.theme-bench .taskbar-tray {
  height: 44px;
  gap: 2px;
  padding: 0;
}

html:not(.shell-mobile) #os.theme-bench :is(.tray-chevron, .tray-cluster, .tray-clock, .tray-notif-btn, .tb-style-toggle) {
  height: 30px;
  border-radius: 6px;
  background: transparent;
  color: var(--ct-text);
  font-family: var(--nv-font);
}

html:not(.shell-mobile) #os.theme-bench :is(.tray-chevron, .tray-cluster, .tray-clock, .tray-notif-btn, .tb-style-toggle):hover {
  background: var(--ct-hover);
}

html:not(.shell-mobile) #os.theme-bench .tray-clock {
  flex-direction: row;
  align-items: center;
  gap: 8px;
  font-family: var(--nv-font-mono);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}

html:not(.shell-mobile) #os.theme-bench .tray-clock .clock-date {
  order: -1;
  font-size: 12px;
  color: var(--ct-muted);
}

html:not(.shell-mobile) #os.theme-bench .tb-show-desktop {
  display: none;
}

html:not(.shell-mobile) #os.theme-bench .flyout.opens-up {
  top: 52px !important;
  bottom: auto !important;
}

html:not(.shell-mobile) #os.theme-bench .toast-layer {
  top: 56px;
  bottom: auto;
}

/* --- Launcher: a dropdown under the command field ---------------------------- */
html:not(.shell-mobile) #os.theme-bench .start-menu {
  top: 50px;
  bottom: auto;
  width: min(560px, calc(100vw - 24px));
  height: min(520px, calc(100dvh - 70px));
  min-height: 0;
  padding: 0;
  border: 1px solid var(--ct-line-strong);
  border-radius: 8px;
  background: var(--ct-surface);
  box-shadow: var(--nv-menu-shadow);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  transform: translateX(-50%) translateY(-6px);
  font-family: var(--nv-font);
}

html:not(.shell-mobile) #os.theme-bench .start-menu.visible {
  transform: translateX(-50%) translateY(0);
}

html:not(.shell-mobile) #os.theme-bench .start-menu::before,
html:not(.shell-mobile) #os.theme-bench .start-home > :is(.start-section:not(.start-inline-all-head), .start-grid, .start-recommended),
html:not(.shell-mobile) #os.theme-bench .start-inline-all-head {
  display: none !important;
}

html:not(.shell-mobile) #os.theme-bench .start-searchbar {
  height: 42px;
  margin: 0;
  padding: 0 14px;
  border: 0;
  border-bottom: 1px solid var(--ct-line);
  border-radius: 8px 8px 0 0;
  background: transparent;
  box-shadow: none;
}

html:not(.shell-mobile) #os.theme-bench :is(.start-home, .start-results) {
  gap: 0;
  padding: 6px;
}

html:not(.shell-mobile) #os.theme-bench .start-letter-head {
  height: 24px;
  padding: 0 10px;
  color: var(--ct-faint);
  font-family: var(--nv-font-mono);
  font-size: 11px;
  font-weight: 600;
}

html:not(.shell-mobile) #os.theme-bench :is(.start-all-row, .start-best) {
  min-height: 34px;
  padding: 0 10px;
  gap: 10px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  box-shadow: none;
  transform: none;
  color: var(--ct-text);
}

html:not(.shell-mobile) #os.theme-bench :is(.start-all-row, .start-best):hover {
  background: color-mix(in srgb, var(--nv-accent) 10%, transparent);
}

html:not(.shell-mobile) #os.theme-bench :is(.start-all-row, .start-all-row.is-generic) .start-all-icon {
  width: 22px;
  height: 22px;
  background: none;
  box-shadow: none;
}

html:not(.shell-mobile) #os.theme-bench .start-all-row .start-all-icon .icon {
  width: 22px;
  height: 22px;
}

html:not(.shell-mobile) #os.theme-bench .start-all-name {
  font-size: 13px;
  font-weight: 500;
}

html:not(.shell-mobile) #os.theme-bench .start-all-sub {
  font-size: 11.5px;
  color: var(--ct-faint);
}

html:not(.shell-mobile) #os.theme-bench .start-footer {
  height: 38px;
  padding: 0 6px 0 12px;
  border-top: 1px solid var(--ct-line);
  border-radius: 0 0 8px 8px;
  background: var(--ct-surface-2);
}