/* BioStudio AI — BioStudioAI Air theme (theme-bs5 / biostudioai5).
   Frosted pastel glass: indigo→peach→mint canvas, translucent floating
   cards, large radii, deep blur, calm periwinkle accent. Structure comes
   from css/bsx-shell.css; this file is the full Air identity — tokens plus
   chrome, menus, dialogs, apps, and nested studio palettes. Dashboard:
   js/core/bsx-dashboard.js layout="hero". Light-first; dusk when .dark. */

/* ---- Design tokens ----------------------------------------------------- */
body.theme-bs5,
#os.theme-bs5 {
  --bsx-bg: #eef0fb;
  --bsx-surface: rgba(255, 255, 255, 0.62);
  --bsx-surface-2: rgba(255, 255, 255, 0.45);
  --bsx-border: rgba(255, 255, 255, 0.85);
  --bsx-accent: #6d8dff;
  --bsx-accent-strong: #4f6ef0;
  --bsx-accent-ink: #ffffff;
  --bsx-accent-soft: rgba(109, 141, 255, 0.14);
  --bsx-peach: #ffb8a3;
  --bsx-mint: #7fd8bd;
  --bsx-lilac: #b189e8;
  --bsx-radius: 16px;
  --bsx-radius-lg: 22px;
  --bsx-shadow: 0 8px 30px rgba(96, 106, 170, 0.12);
  --bsx-shadow-lg: 0 26px 70px rgba(96, 106, 170, 0.25);
  --bsx-blur: blur(min(26px, var(--bs-max-blur, 26px))) saturate(1.4);

  --font: Manrope, "Segoe UI Variable Display", "Segoe UI", system-ui,
    -apple-system, "Helvetica Neue", Arial, sans-serif;
  --ink: #2b3050;
  --ink-soft: #7d84a4;
  --ink-faint: #a8adc8;
  --faint: #a8adc8;
  --radius: 16px;
  --taskbar-h: 72px;
  --taskbar-clearance: calc(var(--taskbar-h) + 10px);
  --accent: #6d8dff;
  --accent-soft: var(--bsx-accent-soft);
  --accent-ink: #ffffff;
  --on-primary: #ffffff;
  --line: var(--bsx-border);
  font-family: var(--font);

  --win-bg: rgba(255, 255, 255, 0.72);
  --win-body-bg: rgba(255, 255, 255, 0.82);
  --win-border: rgba(255, 255, 255, 0.9);
  --win-border-focus: #6d8dff;
  --win-hover-bg: rgba(109, 141, 255, 0.1);
  --titlebar-bg: rgba(255, 255, 255, 0.55);
  --win-shadow: var(--bsx-shadow);
  --win-shadow-focus: var(--bsx-shadow-lg), 0 0 0 1px rgba(109, 141, 255, 0.45);
  --flyout-bg: rgba(255, 255, 255, 0.82);
  --flyout-border: rgba(255, 255, 255, 0.9);
  --tile-bg: rgba(255, 255, 255, 0.5);
  --tile-hover: rgba(109, 141, 255, 0.16);
  --input-bg: rgba(255, 255, 255, 0.75);
  --input-border: rgba(125, 132, 164, 0.3);
  --menu-bg: rgba(255, 255, 255, 0.86);
  --menu-border: rgba(125, 132, 164, 0.18);
  --menu-hover: rgba(109, 141, 255, 0.12);
  --modal-scrim: rgba(120, 130, 180, 0.25);

  --taskbar-bg: rgba(255, 255, 255, 0.55);
  --taskbar-border: rgba(255, 255, 255, 0.85);
  --tb-hover: rgba(109, 141, 255, 0.14);
  --tb-active: rgba(109, 141, 255, 0.1);

  --app-bar: rgba(255, 255, 255, 0.5);
  --app-line: rgba(125, 132, 164, 0.18);
  --app-btn: rgba(255, 255, 255, 0.72);
  --app-btn-hover: rgba(109, 141, 255, 0.14);
  --app-input: rgba(255, 255, 255, 0.8);
  --app-bg: rgba(238, 240, 251, 0.55);
  --primary: #6d8dff;
  --primary-strong: #4f6ef0;
  --primary-soft: rgba(109, 141, 255, 0.16);
  --success: #3d9a78;
  --success-strong: #2f7d62;
  --warning: #c47a3a;
  --danger: #e05a5a;
  --surface-2: rgba(255, 255, 255, 0.45);
  --surface-3: rgba(238, 240, 251, 0.7);
  --hover: rgba(109, 141, 255, 0.1);
  --scrollbar-thumb: rgba(125, 132, 164, 0.42);

  color: var(--ink);
}

/* Dusk appearance — same periwinkle / peach / mint identity, night glass. */
#os.theme-bs5.dark,
body.theme-bs5.dark,
body.dark.theme-bs5 {
  --bsx-bg: #16182a;
  --bsx-surface: rgba(28, 31, 52, 0.72);
  --bsx-surface-2: rgba(36, 40, 66, 0.62);
  --bsx-border: rgba(255, 255, 255, 0.12);
  --bsx-accent-soft: rgba(109, 141, 255, 0.2);
  --bsx-shadow: 0 8px 30px rgba(6, 8, 22, 0.4);
  --bsx-shadow-lg: 0 26px 70px rgba(4, 8, 24, 0.55);

  --ink: #e8eaf8;
  --ink-soft: #9aa1c4;
  --ink-faint: #7b82a8;
  --faint: #7b82a8;

  --win-bg: rgba(24, 27, 46, 0.78);
  --win-body-bg: rgba(18, 21, 38, 0.84);
  --win-border: rgba(255, 255, 255, 0.12);
  --win-border-focus: #6d8dff;
  --win-hover-bg: rgba(109, 141, 255, 0.16);
  --titlebar-bg: rgba(28, 31, 52, 0.62);
  --flyout-bg: rgba(28, 31, 52, 0.86);
  --flyout-border: rgba(255, 255, 255, 0.12);
  --tile-bg: rgba(255, 255, 255, 0.07);
  --tile-hover: rgba(109, 141, 255, 0.2);
  --input-bg: rgba(16, 18, 34, 0.7);
  --input-border: rgba(154, 161, 196, 0.28);
  --menu-bg: rgba(28, 31, 52, 0.9);
  --menu-border: rgba(255, 255, 255, 0.12);
  --menu-hover: rgba(109, 141, 255, 0.18);
  --modal-scrim: rgba(10, 12, 28, 0.5);

  --taskbar-bg: rgba(20, 22, 40, 0.62);
  --taskbar-border: rgba(255, 255, 255, 0.12);
  --tb-hover: rgba(109, 141, 255, 0.18);
  --tb-active: rgba(109, 141, 255, 0.14);

  --app-bar: rgba(28, 31, 52, 0.7);
  --app-line: rgba(255, 255, 255, 0.1);
  --app-btn: rgba(255, 255, 255, 0.08);
  --app-btn-hover: rgba(109, 141, 255, 0.18);
  --app-input: rgba(16, 18, 34, 0.72);
  --app-bg: rgba(18, 21, 38, 0.72);
  --primary-soft: rgba(109, 141, 255, 0.22);
  --surface-2: rgba(36, 40, 66, 0.62);
  --surface-3: rgba(44, 48, 78, 0.7);
  --hover: rgba(109, 141, 255, 0.16);
  --scrollbar-thumb: rgba(154, 161, 196, 0.4);
}

/* wallpaper — soft pastel field with drifting color blobs */
#os.wp-bs5 {
  background:
    radial-gradient(900px 640px at 14% 8%, rgba(147, 168, 255, 0.55), transparent 58%),
    radial-gradient(1000px 700px at 88% 18%, rgba(255, 197, 178, 0.5), transparent 60%),
    radial-gradient(900px 700px at 55% 105%, rgba(170, 235, 216, 0.55), transparent 60%),
    linear-gradient(165deg, #eef0fb 0%, #f6effa 50%, #edf4f6 100%);
}
#os.wp-bs5.dark {
  background:
    radial-gradient(900px 640px at 14% 8%, rgba(109, 141, 255, 0.28), transparent 58%),
    radial-gradient(1000px 700px at 88% 18%, rgba(255, 184, 163, 0.16), transparent 60%),
    radial-gradient(900px 700px at 55% 105%, rgba(127, 216, 189, 0.16), transparent 60%),
    linear-gradient(165deg, #121426 0%, #1a1830 50%, #14182a 100%);
}

/* ---- Dashboard glass flourishes ---------------------------------------- */
.bs5-home .bsx-greeting h1 {
  font-weight: 650;
  background: linear-gradient(110deg, #3a4470, #6d8dff 55%, #b189e8);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
#os.theme-bs5.dark .bs5-home .bsx-greeting h1 {
  background: linear-gradient(110deg, #e8eaf8, #6d8dff 55%, #cba3f5);
  -webkit-background-clip: text;
  background-clip: text;
}
.bs5-home .bsx-cmd {
  width: min(620px, 100%);
  padding: 14px 20px;
  border-radius: 999px;
  backdrop-filter: var(--bsx-blur);
  -webkit-backdrop-filter: var(--bsx-blur);
}
.bs5-home .bsx-cmd:hover,
.bs5-home .bsx-cmd:focus-within { box-shadow: 0 0 0 4px rgba(109, 141, 255, 0.15), var(--bsx-shadow); }
body.theme-bs5 .bsc-pop { border-radius: 20px; }
.bs5-home .bsx-proj,
.bs5-home .bsw-widget {
  backdrop-filter: var(--bsx-blur);
  -webkit-backdrop-filter: var(--bsx-blur);
}
.bs5-home .bsx-proj:hover { transform: translateY(-2px); box-shadow: var(--bsx-shadow-lg); }
.bs5-home .bsx-proj[data-i="0"] .bsx-proj-mark { background: #93a8ff; }
.bs5-home .bsx-proj[data-i="1"] .bsx-proj-mark { background: #ffb8a3; }
.bs5-home .bsx-proj[data-i="2"] .bsx-proj-mark { background: #7fd8bd; }
.bs5-home .bsx-proj[data-i="3"] .bsx-proj-mark { background: #cba3f5; }
.bs5-home .bsx-action { backdrop-filter: blur(min(14px, var(--bs-max-blur, 14px))); -webkit-backdrop-filter: blur(min(14px, var(--bs-max-blur, 14px))); }
.bs5-home .bsx-nav-link { border-radius: 999px; }
.bs5-home .bsx-nav-link.active {
  background: rgba(255, 255, 255, 0.75);
  box-shadow: var(--bsx-shadow);
  color: var(--bsx-accent-strong);
}
#os.theme-bs5.dark .bs5-home .bsx-nav-link.active {
  background: rgba(109, 141, 255, 0.22);
  color: #c5d0ff;
}
.bs5-home .bsx-app { backdrop-filter: var(--bsx-blur); -webkit-backdrop-filter: var(--bsx-blur); }
.bs5-home .bsx-navedit { backdrop-filter: blur(min(14px, var(--bs-max-blur, 14px))); -webkit-backdrop-filter: blur(min(14px, var(--bs-max-blur, 14px))); }
.bs5-home[data-layout="hero"] .bsx-view { width: 100%; text-align: left; }
.bs5-home[data-layout="hero"] .bsx-view .bsx-view-head p { text-align: left; }
.bs5-home .bsx-nav-user { backdrop-filter: blur(min(14px, var(--bs-max-blur, 14px))); -webkit-backdrop-filter: blur(min(14px, var(--bs-max-blur, 14px))); }
.bs5-home .bsw-clock-time {
  background: linear-gradient(110deg, #3a4470, #6d8dff);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
#os.theme-bs5.dark .bs5-home .bsw-clock-time {
  background: linear-gradient(110deg, #e8eaf8, #6d8dff);
  -webkit-background-clip: text;
  background-clip: text;
}

/* ====================================================================== */
/* Window chrome — floating frosted panes                                  */
/* ====================================================================== */
#os.theme-bs5 .window-titlebar {
  border-bottom: 1px solid rgba(125, 132, 164, 0.18);
  backdrop-filter: blur(min(20px, var(--bs-max-blur, 20px))) saturate(1.3);
  -webkit-backdrop-filter: blur(min(20px, var(--bs-max-blur, 20px))) saturate(1.3);
}
#os.theme-bs5.dark .window-titlebar { border-bottom-color: rgba(255, 255, 255, 0.1); }
#os.theme-bs5 .window.focused {
  box-shadow: var(--bsx-shadow-lg), 0 0 0 1px rgba(109, 141, 255, 0.55);
}
#os.theme-bs5 .window:not(.focused) .window-titlebar { opacity: 0.88; }
#os.theme-bs5 .win-btn { border-radius: 10px; }
#os.theme-bs5 .window-title-text { font-weight: 650; letter-spacing: -0.01em; }

/* ====================================================================== */
/* Taskbar dock — frosted pill                                             */
/* ====================================================================== */
#os.theme-bs5 .taskbar.bs-dock {
  border-radius: 999px;
  padding: 0 14px;
}
#os.theme-bs5 .taskbar.bs-dock .tb-icon-btn,
#os.theme-bs5 .taskbar.bs-dock .task-btn { border-radius: 999px; }
#os.theme-bs5 .taskbar.bs-dock .taskbar-start {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  box-shadow: 0 6px 18px rgba(109, 141, 255, 0.45);
}
#os.theme-bs5 .taskbar.bs-dock .taskbar-start:hover { filter: brightness(1.06); }
#os.theme-bs5 .toast-layer { bottom: calc(var(--taskbar-h) + 8px); }

/* ====================================================================== */
/* Start menu, flyouts, toasts, calendar                                   */
/* ====================================================================== */
#os.theme-bs5 .start-menu { background: var(--flyout-bg); color: var(--ink); }
#os.theme-bs5 .start-searchbar {
  border-radius: 999px;
  padding-left: 16px;
}
#os.theme-bs5 .start-searchbar:focus-within {
  box-shadow: 0 0 0 3px rgba(109, 141, 255, 0.16);
}
#os.theme-bs5 .start-tile { border-radius: 16px; }
#os.theme-bs5 .start-footer {
  background: var(--bsx-surface-2);
  border-top: 1px solid var(--bsx-border);
}
#os.theme-bs5 .qs-tile { border-radius: 16px; }
#os.theme-bs5 .qs-tile.on {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  color: var(--bsx-accent-ink);
}
#os.theme-bs5 .cal-cell { border-radius: 10px; }
#os.theme-bs5 .cal-cell.today {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  color: var(--bsx-accent-ink);
}
#os.theme-bs5 .nc-item { border-radius: 16px; }
#os.theme-bs5 .toast {
  border-radius: 18px;
  background: var(--flyout-bg);
  border-color: var(--flyout-border);
  box-shadow: var(--bsx-shadow-lg);
  backdrop-filter: var(--bsx-blur);
  -webkit-backdrop-filter: var(--bsx-blur);
}

/* ====================================================================== */
/* Context menus, previews, snap (on <body>)                               */
/* ====================================================================== */
body.theme-bs5 .ctx-menu,
body.theme-bs5 .tb-preview-popover,
body.theme-bs5 .snap-flyout {
  --menu-bg: var(--flyout-bg);
  --menu-border: var(--bsx-border);
  --menu-hover: var(--bsx-accent-soft);
  color: var(--ink);
  border-radius: 16px;
  box-shadow: var(--bsx-shadow-lg);
  backdrop-filter: var(--bsx-blur);
  -webkit-backdrop-filter: var(--bsx-blur);
}
body.theme-bs5 .ctx-item { border-radius: 10px; }
body.theme-bs5 .ctx-item:hover:not([disabled]) {
  background: var(--bsx-accent-soft);
  color: var(--bsx-accent-strong);
}
body.theme-bs5 .ctx-item.danger:hover:not([disabled]) {
  background: rgba(224, 90, 90, 0.14);
  color: var(--danger, #e05a5a);
}
body.theme-bs5 .snap-preview {
  background: rgba(109, 141, 255, 0.2);
  border-color: rgba(109, 141, 255, 0.55);
}
body.theme-bs5 .snap-cell { background: var(--bsx-accent); border-radius: 8px; }

body.theme-bs5 .user-flyout {
  border-radius: 20px;
  background: var(--flyout-bg);
  border-color: var(--flyout-border);
  box-shadow: var(--bsx-shadow-lg);
  backdrop-filter: var(--bsx-blur);
  -webkit-backdrop-filter: var(--bsx-blur);
}
body.theme-bs5 .user-flyout-avatar {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  color: var(--on-primary, #fff);
}

/* ====================================================================== */
/* Dialogs + global search                                                 */
/* ====================================================================== */
body.theme-bs5 .bs-search-overlay {
  background: rgba(120, 130, 180, 0.2);
  backdrop-filter: blur(min(10px, var(--bs-max-blur, 10px)));
  -webkit-backdrop-filter: blur(min(10px, var(--bs-max-blur, 10px)));
}
body.theme-bs5 .bs-search-box {
  background: var(--flyout-bg);
  color: var(--ink);
  border: 1px solid var(--bsx-border);
  border-radius: 22px;
  box-shadow: var(--bsx-shadow-lg), 0 0 0 4px rgba(109, 141, 255, 0.1);
  backdrop-filter: var(--bsx-blur);
  -webkit-backdrop-filter: var(--bsx-blur);
}
body.theme-bs5 .bs-search-head { border-bottom-color: var(--bsx-border); padding: 14px 16px; }
body.theme-bs5 .bs-search-mag { color: var(--bsx-accent); opacity: 1; }
body.theme-bs5 .bs-search-esc {
  border-radius: 999px;
  border-color: var(--input-border);
  color: var(--ink-soft);
  background: var(--bsx-surface-2);
}
body.theme-bs5 .bs-search-group { color: var(--bsx-accent-strong); }
body.theme-bs5 .bs-search-row { border-radius: 12px; }
body.theme-bs5 .bs-search-row.active { background: var(--bsx-accent-soft); }
body.theme-bs5 .bs-search-sub,
body.theme-bs5 .bs-search-hint { color: var(--ink-soft); }
body.theme-bs5 .bs-search-app { color: var(--ink-soft); border-color: var(--bsx-border); }

body.theme-bs5 .platform-dialog-overlay {
  background: var(--modal-scrim, rgba(120, 130, 180, 0.25));
  backdrop-filter: blur(min(8px, var(--bs-max-blur, 8px)));
  -webkit-backdrop-filter: blur(min(8px, var(--bs-max-blur, 8px)));
}
body.theme-bs5 .platform-dialog {
  border-radius: var(--bsx-radius-lg);
  border: 1px solid var(--bsx-border);
  background: var(--flyout-bg);
  color: var(--ink);
  box-shadow: var(--bsx-shadow-lg);
  backdrop-filter: var(--bsx-blur);
  -webkit-backdrop-filter: var(--bsx-blur);
}
body.theme-bs5 .platform-dialog-input {
  border-radius: 12px;
  background: var(--input-bg);
  border-color: var(--input-border);
  color: var(--ink);
}
body.theme-bs5 .platform-dialog-x:hover { background: var(--bsx-accent-soft); }

/* ====================================================================== */
/* Task view                                                               */
/* ====================================================================== */
#os.theme-bs5 .tv-scrim {
  background: rgba(120, 130, 180, 0.3);
  backdrop-filter: blur(min(14px, var(--bs-max-blur, 14px)));
  -webkit-backdrop-filter: blur(min(14px, var(--bs-max-blur, 14px)));
}
#os.theme-bs5 .tv-window,
#os.theme-bs5 .tv-desktop,
#os.theme-bs5 .tv-add {
  border-radius: var(--bsx-radius-lg);
  border: 1px solid var(--bsx-border);
  background: var(--bsx-surface);
  box-shadow: var(--bsx-shadow);
}
#os.theme-bs5 .tv-window:hover,
#os.theme-bs5 .tv-desktop:hover,
#os.theme-bs5 .tv-add:hover { border-color: var(--bsx-accent); }
#os.theme-bs5 .tv-desktop.active {
  border-color: var(--bsx-accent);
  box-shadow: 0 0 0 3px rgba(109, 141, 255, 0.2);
}
#os.theme-bs5 .tv-desktop-preview {
  background:
    radial-gradient(240px 160px at 72% 12%, rgba(147, 168, 255, 0.7), transparent 62%),
    radial-gradient(220px 160px at 18% 80%, rgba(255, 184, 163, 0.55), transparent 64%),
    linear-gradient(155deg, #c5d0ff, #f0d4ea 58%, #c8efe0);
}

/* ====================================================================== */
/* Buttons, fields, tables, scrollbars                                    */
/* ====================================================================== */
#os.theme-bs5 .btn,
body.theme-bs5 .btn {
  border-radius: 12px;
  border: 1px solid var(--input-border);
  background: var(--app-btn);
  color: var(--ink);
  font-weight: 550;
}
#os.theme-bs5 .btn:hover,
body.theme-bs5 .btn:hover { background: var(--app-btn-hover); }
#os.theme-bs5 .btn.primary,
body.theme-bs5 .btn.primary {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  border-color: transparent;
  color: var(--on-primary, #fff);
  box-shadow: 0 6px 16px rgba(109, 141, 255, 0.28);
}
#os.theme-bs5 .btn.primary:hover,
body.theme-bs5 .btn.primary:hover { filter: brightness(1.05); }
#os.theme-bs5 .btn.success,
body.theme-bs5 .btn.success {
  background: var(--success);
  color: var(--on-primary, #fff);
  border-color: transparent;
}
#os.theme-bs5 .btn.ghost:hover,
body.theme-bs5 .btn.ghost:hover { background: var(--bsx-accent-soft); }

#os.theme-bs5 .field,
#os.theme-bs5 input[type="text"],
#os.theme-bs5 input[type="search"],
#os.theme-bs5 input[type="number"],
#os.theme-bs5 input[type="email"],
#os.theme-bs5 input[type="password"],
#os.theme-bs5 textarea,
#os.theme-bs5 select,
#os.theme-bs5 .bs-select {
  border-radius: 12px;
  background: var(--input-bg);
  border-color: var(--input-border);
  color: var(--ink);
}
#os.theme-bs5 .field:focus,
#os.theme-bs5 input:focus-visible,
#os.theme-bs5 textarea:focus-visible,
#os.theme-bs5 select:focus-visible {
  outline: none;
  border-color: var(--bsx-accent);
  box-shadow: 0 0 0 3px rgba(109, 141, 255, 0.18);
}
#os.theme-bs5 input, #os.theme-bs5 textarea, #os.theme-bs5 select { color-scheme: light; }
#os.theme-bs5.dark input, #os.theme-bs5.dark textarea, #os.theme-bs5.dark select { color-scheme: dark; }

#os.theme-bs5 table { border-color: var(--bsx-border); }
#os.theme-bs5 th {
  background: var(--bsx-surface-2);
  color: var(--ink-soft);
  border-color: var(--app-line);
}
#os.theme-bs5 td { border-color: var(--app-line); }
#os.theme-bs5 tbody tr:hover td { background: var(--bsx-accent-soft); }

#os.theme-bs5 .theme-card,
#os.theme-bs5 .settings-section {
  background: var(--bsx-surface);
  border-color: var(--bsx-border);
  border-radius: 16px;
}
#os.theme-bs5 .theme-card.active {
  border-color: var(--bsx-accent);
  box-shadow: 0 0 0 3px rgba(109, 141, 255, 0.16);
}

#os.theme-bs5 :focus-visible,
body.theme-bs5 :focus-visible {
  outline: 2px solid var(--bsx-accent);
  outline-offset: 2px;
}

#os.theme-bs5,
body.theme-bs5 {
  scrollbar-color: var(--scrollbar-thumb) transparent;
}
#os.theme-bs5 ::-webkit-scrollbar,
body.theme-bs5 ::-webkit-scrollbar { width: 11px; height: 11px; }
#os.theme-bs5 ::-webkit-scrollbar-thumb,
body.theme-bs5 ::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
  border: 3px solid transparent;
  border-radius: 999px;
  background-clip: padding-box;
}

/* ====================================================================== */
/* Shared app chrome — toolbars, explorer, calculator, tabs              */
/* ====================================================================== */
#os.theme-bs5 .app-toolbar,
#os.theme-bs5 .files-toolbar,
#os.theme-bs5 .app-statusbar {
  background: var(--app-bar);
  border-color: var(--app-line);
  backdrop-filter: blur(min(18px, var(--bs-max-blur, 18px))) saturate(1.25);
  -webkit-backdrop-filter: blur(min(18px, var(--bs-max-blur, 18px))) saturate(1.25);
}
#os.theme-bs5 .app-toolbar,
#os.theme-bs5 .files-toolbar { border-bottom-color: var(--app-line); }
#os.theme-bs5 .app-statusbar { border-top-color: var(--app-line); }

#os.theme-bs5 .calc-display,
#os.theme-bs5 .calc-key,
#os.theme-bs5 .files-sidebar,
#os.theme-bs5 .files-path,
#os.theme-bs5 .files-preview,
#os.theme-bs5 .files-home-card,
#os.theme-bs5 .theme-card,
#os.theme-bs5 .seq-input,
#os.theme-bs5 .seq-stat,
#os.theme-bs5 .ad-formpane,
#os.theme-bs5 .ad-tabs,
#os.theme-bs5 .ad-row,
#os.theme-bs5 .ad-schem-card,
#os.theme-bs5 .ad-protocol {
  background: var(--bsx-surface);
  border-color: var(--app-line);
}
#os.theme-bs5 .calc-key,
#os.theme-bs5 .files-home-card,
#os.theme-bs5 .file-item,
#os.theme-bs5 .theme-card,
#os.theme-bs5 .seq-stat,
#os.theme-bs5 .ad-row,
#os.theme-bs5 .ad-schem-card,
#os.theme-bs5 .ad-tab,
#os.theme-bs5 .files-side-item { border-radius: 14px; }
#os.theme-bs5 .files-home-card:hover,
#os.theme-bs5 .file-item:hover,
#os.theme-bs5 .files-side-item:hover,
#os.theme-bs5 .fe-explorer-root .fe-nav-item:hover,
#os.theme-bs5 .theme-card:hover,
#os.theme-bs5 .ad-tab:hover { background: var(--bsx-accent-soft); }
#os.theme-bs5 .files-side-item.active,
#os.theme-bs5 .fe-explorer-root .fe-nav-item.active,
#os.theme-bs5 .theme-card.active,
#os.theme-bs5 .ad-tab.active {
  background: var(--bsx-accent-soft);
  color: var(--bsx-accent-strong);
  border-color: rgba(109, 141, 255, 0.35);
}
#os.theme-bs5 .file-item.selected {
  background: rgba(109, 141, 255, 0.16);
  outline-color: rgba(109, 141, 255, 0.45);
}
#os.theme-bs5 .calc-key.eq {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  color: var(--on-primary, #fff);
}

/* File Explorer — drop Windows Fluent blues; follow Air (then the in-window
   color picker, which restamps --accent / --app-* on the window). */
#os.theme-bs5 .fe-explorer-root {
  --fe-accent: var(--bsx-accent);
  --fe-accent-hover: var(--bsx-accent-strong);
  --fe-accent-soft: var(--bsx-accent-soft);
  --fe-accent-strong: rgba(109, 141, 255, 0.22);
  --fe-surface: var(--app-bg);
  --fe-elevated: var(--win-body-bg);
  --fe-sidebar: var(--app-bar);
  --fe-line: var(--app-line);
  --fe-line-strong: var(--input-border);
  --fe-ink: var(--ink);
  --fe-ink-soft: var(--ink-soft);
  --fe-radius: 14px;
  --fe-radius-lg: var(--bsx-radius-lg);
  --fe-shadow: var(--bsx-shadow);
  color: var(--fe-ink);
  background: var(--fe-surface);
}
#os.theme-bs5 .fe-explorer-root .fe-command-bar,
#os.theme-bs5 .fe-explorer-root .fe-nav-pane,
#os.theme-bs5 .fe-explorer-root .files-sidebar,
#os.theme-bs5 .fe-explorer-root .files-preview,
#os.theme-bs5 .fe-explorer-root .fe-statusbar,
#os.theme-bs5 .fe-explorer-root .app-statusbar {
  background: var(--app-bar);
  border-color: var(--app-line);
  color: var(--fe-ink);
  backdrop-filter: blur(min(18px, var(--bs-max-blur, 18px))) saturate(1.25);
  -webkit-backdrop-filter: blur(min(18px, var(--bs-max-blur, 18px))) saturate(1.25);
}
#os.theme-bs5 .fe-explorer-root .fe-tool-btn,
#os.theme-bs5 .fe-explorer-root .fe-nav-item,
#os.theme-bs5 .fe-explorer-root .files-side-item,
#os.theme-bs5 .fe-explorer-root .fe-search-wrap,
#os.theme-bs5 .fe-explorer-root .fe-address-shell,
#os.theme-bs5 .fe-explorer-root .fe-view-switcher,
#os.theme-bs5 .fe-explorer-root .fe-icon-tile {
  border-radius: 14px;
}
#os.theme-bs5 .fe-explorer-root .fe-fnsearch {
  --fn-accent: var(--fe-accent);
}

#os.theme-bs5 .notification-center-app .nc-app-nav { border-radius: 12px; }
#os.theme-bs5 .notification-center-app .nc-app-nav:hover { background: var(--bsx-accent-soft); }
#os.theme-bs5 .notification-center-app .nc-app-nav.active {
  background: var(--bsx-accent-soft);
  color: var(--bsx-accent-strong);
}
#os.theme-bs5 .notification-center-app .nc-nav-badge {
  background: var(--bsx-accent);
  color: var(--on-primary, #fff);
}

/* ====================================================================== */
/* Studio design system                                                    */
/* ====================================================================== */
#os.theme-bs5 .studio {
  --st-accent: var(--bsx-accent);
  --st-accent-soft: var(--bsx-accent-soft);
  --st-ai: #b189e8;
  --st-bg: rgba(255, 255, 255, 0.42);
  --st-panel: rgba(255, 255, 255, 0.62);
  --st-line: var(--bsx-border);
  --st-line-soft: rgba(109, 141, 255, 0.1);
  --st-ink: var(--ink);
  --st-ink-soft: var(--ink-soft);
  --st-info: var(--bsx-accent);
}
#os.theme-bs5.dark .studio {
  --st-bg: rgba(18, 21, 38, 0.5);
  --st-panel: rgba(28, 31, 52, 0.7);
  --st-line: rgba(255, 255, 255, 0.1);
  --st-line-soft: rgba(109, 141, 255, 0.14);
  --st-ink: var(--ink);
  --st-ink-soft: var(--ink-soft);
}
#os.theme-bs5 .st-toolbar,
#os.theme-bs5 .st-sidebar,
#os.theme-bs5 .st-inspector,
#os.theme-bs5 .st-card,
#os.theme-bs5 .st-ai,
#os.theme-bs5 .st-input,
#os.theme-bs5 .st-btn,
#os.theme-bs5 .st-tbtn,
#os.theme-bs5 .st-table-wrap {
  backdrop-filter: blur(min(18px, var(--bs-max-blur, 18px))) saturate(1.25);
  -webkit-backdrop-filter: blur(min(18px, var(--bs-max-blur, 18px))) saturate(1.25);
  border-radius: calc(var(--bsx-radius) + 2px);
}
#os.theme-bs5 .st-nav-item { border-radius: 12px; }
#os.theme-bs5 .st-nav-item.active {
  background: rgba(109, 141, 255, 0.14);
  color: var(--bsx-accent-strong, #4a5fd4);
}
#os.theme-bs5 .st-btn.primary,
#os.theme-bs5 .st-tbtn.primary {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  color: var(--on-primary, #fff);
  border-color: transparent;
}

/* ====================================================================== */
/* Nested studio palettes (GraphPad-style --pr-* plus ELN / plasmid)      */
/* ====================================================================== */
#os.theme-bs5 .graph-studio-app,
#os.theme-bs5 .pathology-studio-root,
#os.theme-bs5 .pathology-studio-app,
#os.theme-bs5 .las-root,
#os.theme-bs5 .las-root.las-gs-chrome,
#os.theme-bs5 .design-studio-root,
#os.theme-bs5 .design-studio-root .studio,
#os.theme-bs5 .lims-studio-app,
#os.theme-bs5 .spatial-studio-app,
#os.theme-bs5 .seahorse-studio-root,
#os.theme-bs5 .ms-studio-app,
#os.theme-bs5 .ms-studio-root,
#os.theme-bs5 .tox-studio-app,
#os.theme-bs5 .qms-lite-app,
#os.theme-bs5 .ss-studio-root,
#os.theme-bs5 .pkpd-studio-root,
#os.theme-bs5 .pcr-studio-app,
#os.theme-bs5 .pcrs-graph-shell,
#os.theme-bs5 .method-validation-root,
#os.theme-bs5 .omics-studio-app,
#os.theme-bs5 .molecular-design-root,
body.theme-bs5 .graph-studio-nav-cmenu,
body.theme-bs5 .graph-studio-cmenu {
  --pr-blue: var(--bsx-accent);
  --pr-blue-dk: var(--bsx-accent-strong);
  --pr-teal: #5bb89a;
  --pr-bg: var(--app-bg);
  --pr-surface: var(--win-body-bg);
  --pr-nav-bg: var(--app-bar);
  --pr-line: var(--app-line);
  --pr-ink: var(--ink);
  --pr-ink-soft: var(--ink-soft);
  --pr-hover: var(--bsx-accent-soft);
  --pr-active: var(--primary-soft);
  --pr-shadow: var(--bsx-shadow);
}
#os.theme-bs5 .pathology-studio-root,
#os.theme-bs5 .pathology-studio-app { --path-purple: var(--bsx-accent); }

#os.theme-bs5 .pcr-studio-app {
  --pcr-teal: #5bb89a;
  --pcr-cyan: #6d8dff;
  --pcr-violet: #b189e8;
  --pcr-navy: #3a4470;
}

#os.theme-bs5 .eln-studio-root {
  --eln-canvas: var(--app-bg);
  --eln-surface: var(--win-body-bg);
  --eln-surface-subtle: var(--app-bar);
  --eln-line: var(--app-line);
  --eln-line-strong: var(--input-border);
  --eln-text: var(--ink);
  --eln-muted: var(--ink-soft);
  --eln-faint: var(--ink-faint);
  --eln-blue: var(--bsx-accent);
  --eln-blue-dark: var(--bsx-accent-strong);
  --eln-blue-soft: var(--bsx-accent-soft);
  --eln-violet: var(--bsx-lilac);
  --st-accent: var(--bsx-accent);
}
#os.theme-bs5 .plasmid-studio-root,
#os.theme-bs5 .ps-app {
  --ps-ink: var(--ink);
  --ps-muted: var(--ink-soft);
  --ps-line: var(--app-line);
  --ps-panel: var(--win-body-bg);
  --ps-soft: var(--app-bg);
  --ps-blue: var(--bsx-accent);
  --ps-teal: var(--bsx-mint);
  --ps-navy: #3a4470;
}

#os.theme-bs5 .clib {
  --cl-accent: var(--bsx-accent);
  --cl-bg: var(--app-bg);
  --cl-panel: var(--bsx-surface);
  --cl-panel-2: var(--bsx-surface-2);
  --cl-line: var(--app-line);
  --cl-line-soft: rgba(109, 141, 255, 0.1);
  --cl-ink: var(--ink);
  --cl-soft: var(--ink-soft);
  --cl-radius: var(--bsx-radius);
  --cl-shadow: var(--bsx-shadow);
  --cl-shadow-lg: var(--bsx-shadow-lg);
}
#os.theme-bs5 .clib-header {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
}
#os.theme-bs5 .clib-toolbar,
#os.theme-bs5 .clib-side,
#os.theme-bs5 .clib-inspect,
#os.theme-bs5 .clib-card,
#os.theme-bs5 .clib-btn {
  backdrop-filter: blur(min(16px, var(--bs-max-blur, 18px))) saturate(1.2);
  -webkit-backdrop-filter: blur(min(16px, var(--bs-max-blur, 18px))) saturate(1.2);
  border-radius: 14px;
}

#os.theme-bs5 .html-studio-root,
#os.theme-bs5 .hs-app,
#os.theme-bs5 .hs-office-root,
#os.theme-bs5 .hs-office-root .studio {
  --hs-surface: var(--win-body-bg);
  --hs-surface-subtle: var(--app-bar);
  --hs-surface-raised: var(--bsx-surface);
  --hs-canvas-bg: var(--app-bg);
  --hs-nav-bg: var(--app-bar);
  --hs-hover: var(--bsx-accent-soft);
  --st-accent: var(--bsx-accent);
  --st-accent-soft: var(--bsx-accent-soft);
  --st-bg: var(--app-bg);
  --st-panel: var(--win-body-bg);
  --st-line: var(--app-line);
  --st-ink: var(--ink);
  --st-ink-soft: var(--ink-soft);
}
#os.theme-bs5 .hs-office-root .studio,
#os.theme-bs5 .rs-office-root .studio {
  background: var(--app-bg);
}

#os.theme-bs5 .office-app { background: var(--app-bg); }
#os.theme-bs5 .word-app .office-titlebar {
  background: linear-gradient(135deg, #6d8dff, #4f6ef0);
}
#os.theme-bs5 .excel-app .office-titlebar {
  background: linear-gradient(135deg, #5bb89a, #6d8dff);
}
#os.theme-bs5 .word-primary { background: var(--bsx-accent); color: var(--on-primary, #fff); }
#os.theme-bs5 .excel-primary { background: #5bb89a; color: var(--on-primary, #fff); }
#os.theme-bs5 .excel-btn.on { background: var(--bsx-accent-soft); border-color: var(--bsx-accent); color: var(--bsx-accent-strong); }
#os.theme-bs5 .office-ribbon,
#os.theme-bs5 .excel-ribbon {
  background: var(--app-bar);
  border-color: var(--app-line);
}

#os.theme-bs5 .graph-studio-ai-fab {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  box-shadow: 0 8px 22px rgba(109, 141, 255, 0.4);
}

/* ====================================================================== */
/* Studio AI + OS assistant                                                 */
/* ====================================================================== */
#os.theme-bs5 .studio-ai-fab {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  box-shadow: 0 8px 24px rgba(109, 141, 255, 0.4);
  color: var(--on-primary, #fff);
}
#os.theme-bs5 .studio-ai-panel {
  background: var(--flyout-bg);
  border-color: var(--bsx-border);
  border-radius: 20px;
  color: var(--ink);
  backdrop-filter: var(--bsx-blur);
  -webkit-backdrop-filter: var(--bsx-blur);
}
#os.theme-bs5 .studio-ai-msg.user { background: var(--bsx-accent-soft); }
#os.theme-bs5 .studio-ai-msg.ai { background: var(--bsx-surface-2); }
#os.theme-bs5 .studio-ai-send {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  color: var(--on-primary, #fff);
  border-radius: 12px;
}
#os.theme-bs5 .studio-ai-quickbtn {
  background: var(--bsx-surface);
  border-color: var(--bsx-border);
  border-radius: 999px;
}

body.theme-bs5 .os-ai-fab,
body.theme-bs5 .os-ai-fab-chrome,
body.theme-bs5 .os-ai-fab-float {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  box-shadow: 0 6px 18px rgba(109, 141, 255, 0.4);
}
body.theme-bs5 .os-ai-input:focus { border-color: var(--bsx-accent); }
body.theme-bs5 .os-ai-send,
body.theme-bs5 .os-ai-open {
  background: linear-gradient(135deg, #6d8dff, #b189e8);
  color: var(--on-primary, #fff);
}
body.theme-bs5 .os-ai-field.needed .os-ai-field-label { color: var(--bsx-accent-strong); }
body.theme-bs5 .os-ai-field-input:focus { border-color: var(--bsx-accent); }
body.theme-bs5 .os-ai-panel {
  border-radius: 20px;
  background: var(--flyout-bg);
  border-color: var(--bsx-border);
}
body.theme-bs5 .os-ai-tab.active { color: var(--bsx-accent-strong); }
