/* BioStudio AI — macOS 26 (Tahoe) shell fidelity layer.

   Loaded last, after css/os-win11.css. Restates the Tahoe metrics over the
   older macOS skin (css/macos-theme.css): the transparent menu bar, 16px
   window corners, 12px traffic lights, the Liquid Glass Dock, 12px-radius
   menus with SF-style glyphs, Finder with a floating glass sidebar, Control
   Center modules, Notification Center, Spotlight and the Apps grid.

   Scoped to the macOS OS-style marker: `#os.theme-macos` for the shell,
   `body.theme-macos` for popups. White is Light appearance; Black, Ocean and
   Orchid are Dark appearance (the last two tinted by their palette). */

/* --- Fonts ----------------------------------------------------------------
   SF Pro is the system font on Apple hosts; elsewhere Inter (OFL) stands in. */
@font-face { font-family: "BS Inter"; src: url("../assets/fonts/inter/inter-latin-var.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

/* --- Tokens: Light --------------------------------------------------------- */
html:not(.shell-mobile) #os.theme-macos,
html:not(.shell-mobile) body.theme-macos {
  --m26-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro", "BS Inter", "Helvetica Neue", sans-serif;
  --m26-font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro", "BS Inter", "Helvetica Neue", sans-serif;
  --m26-text: rgba(0, 0, 0, 0.85);
  --m26-text-2: rgba(0, 0, 0, 0.5);
  --m26-text-3: rgba(0, 0, 0, 0.26);
  --m26-accent: #007aff;
  --m26-on-accent: #ffffff;
  --m26-accent-soft: rgba(0, 122, 255, 0.14);
  --m26-window: #f5f5f5;
  --m26-content: #ffffff;
  --m26-sidebar: rgba(234, 234, 236, 0.72);
  --m26-separator: rgba(0, 0, 0, 0.1);
  --m26-hover: rgba(0, 0, 0, 0.05);
  --m26-press: rgba(0, 0, 0, 0.09);
  --m26-control: #ffffff;
  --m26-control-stroke: rgba(0, 0, 0, 0.12);
  --m26-glass: rgba(255, 255, 255, 0.46);
  --m26-glass-strong: rgba(250, 250, 252, 0.8);
  --m26-glass-edge: rgba(255, 255, 255, 0.72);
  --m26-glass-shade: rgba(0, 0, 0, 0.08);
  --m26-menu: rgba(244, 244, 246, 0.8);
  --m26-menu-stroke: rgba(0, 0, 0, 0.1);
  --m26-menu-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.12), 0 10px 32px rgba(0, 0, 0, 0.22);
  --m26-win-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.2), 0 24px 64px rgba(0, 0, 0, 0.3), 0 8px 20px rgba(0, 0, 0, 0.12);
  --m26-win-shadow-idle: 0 0 0 0.5px rgba(0, 0, 0, 0.14), 0 14px 40px rgba(0, 0, 0, 0.18);
  --m26-win-edge: rgba(255, 255, 255, 0);
  --m26-zebra: rgba(0, 0, 0, 0.028);
  --m26-scroll: rgba(0, 0, 0, 0.36);
  --m26-menubar-ink: rgba(0, 0, 0, 0.86);
  --m26-menubar-hover: rgba(0, 0, 0, 0.1);
  --m26-menubar-shadow: none;
  color-scheme: light;
}

/* --- Tokens: Dark (Black / Ocean / Orchid) --------------------------------- */
html:not(.shell-mobile) #os.theme-macos:is([data-color-theme="black"], [data-color-theme="ocean"], [data-color-theme="orchid"]),
html:not(.shell-mobile) body.theme-macos:is([data-color-theme="black"], [data-color-theme="ocean"], [data-color-theme="orchid"]) {
  --m26-text: rgba(255, 255, 255, 0.86);
  --m26-text-2: rgba(255, 255, 255, 0.55);
  --m26-text-3: rgba(255, 255, 255, 0.25);
  --m26-accent: #0a84ff;
  --m26-accent-soft: rgba(10, 132, 255, 0.22);
  --m26-window: #2b2b2d;
  --m26-content: #1e1e1f;
  --m26-sidebar: rgba(44, 44, 48, 0.66);
  --m26-separator: rgba(255, 255, 255, 0.1);
  --m26-hover: rgba(255, 255, 255, 0.07);
  --m26-press: rgba(255, 255, 255, 0.12);
  --m26-control: rgba(255, 255, 255, 0.1);
  --m26-control-stroke: rgba(255, 255, 255, 0.12);
  --m26-glass: rgba(34, 34, 38, 0.42);
  --m26-glass-strong: rgba(40, 40, 44, 0.8);
  --m26-glass-edge: rgba(255, 255, 255, 0.2);
  --m26-glass-shade: rgba(0, 0, 0, 0.3);
  --m26-menu: rgba(38, 38, 40, 0.8);
  --m26-menu-stroke: rgba(255, 255, 255, 0.12);
  --m26-menu-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.6), 0 10px 32px rgba(0, 0, 0, 0.5);
  --m26-win-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.8), 0 24px 64px rgba(0, 0, 0, 0.55), 0 8px 20px rgba(0, 0, 0, 0.3);
  --m26-win-shadow-idle: 0 0 0 0.5px rgba(0, 0, 0, 0.7), 0 14px 40px rgba(0, 0, 0, 0.4);
  --m26-win-edge: rgba(255, 255, 255, 0.13);
  --m26-zebra: rgba(255, 255, 255, 0.035);
  --m26-scroll: rgba(255, 255, 255, 0.4);
  --m26-menubar-ink: rgba(255, 255, 255, 0.95);
  --m26-menubar-hover: rgba(255, 255, 255, 0.2);
  --m26-menubar-shadow: 0 0 6px rgba(0, 0, 0, 0.35);
  color-scheme: dark;
}

html:not(.shell-mobile) #os.theme-macos:is([data-color-theme="ocean"], [data-color-theme="orchid"]),
html:not(.shell-mobile) body.theme-macos:is([data-color-theme="ocean"], [data-color-theme="orchid"]) {
  --m26-accent: var(--ct-accent);
  --m26-on-accent: var(--ct-accent-ink);
  --m26-accent-soft: var(--ct-accent-soft);
  --m26-window: var(--ct-surface-2);
  --m26-content: var(--ct-bg);
  --m26-menu: var(--ct-flyout);
}

html:not(.shell-mobile) #os.theme-macos,
html:not(.shell-mobile) body.theme-macos {
  --font: var(--m26-font);
  --mac-menu-h: 24px;
  --mac-dock-icon: 52px;
  --mac-dock-app-icon: 52px;
  --taskbar-h: 72px;
  --window-titlebar-h: 30px;
  --accent: var(--m26-accent);
  --menu-bg: var(--m26-menu);
  --menu-border: var(--m26-menu-stroke);
  font-family: var(--m26-font);
  -webkit-font-smoothing: antialiased;
}

/* Wallpaper (Tahoe). A custom wallpaper still wins: it is set inline. */
.tk-macos {
  background: url("../assets/wallpapers/tahoe-light.svg") center / cover no-repeat, #8fc3ff;
}

html:not(.shell-mobile) #os.theme-macos.wp-tahoe[data-os-theme] {
  background: url("../assets/wallpapers/tahoe-light.svg") center / cover no-repeat, #c6e1ff;
}

html:not(.shell-mobile) #os.theme-macos.wp-tahoe[data-os-theme]:is([data-color-theme="black"], [data-color-theme="ocean"], [data-color-theme="orchid"]) {
  background: url("../assets/wallpapers/tahoe-dark.svg") center / cover no-repeat, #0a1330;
}

/* ============================================================================
   Menu bar — transparent in Tahoe, ink adapts to the wallpaper
   ============================================================================ */

html:not(.shell-mobile) #os.theme-macos .mac-menu-bar {
  height: 24px;
  padding: 0 8px 0 12px;
  border: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  color: var(--m26-menubar-ink);
  font-family: var(--m26-font);
  font-size: 13px;
  font-weight: 500;
  text-shadow: var(--m26-menubar-shadow);
}

html:not(.shell-mobile) #os.theme-macos :is(.mac-apple, .mac-menu-app, .mac-menu-item, .mac-menu-icon, .mac-menu-clock) {
  height: 22px;
  padding: 0 9px;
  border-radius: 6px;
  color: var(--m26-menubar-ink);
  font-size: 13px;
  font-weight: 500;
  background: transparent;
}

html:not(.shell-mobile) #os.theme-macos .mac-menu-app {
  font-weight: 700;
}

html:not(.shell-mobile) #os.theme-macos .mac-apple {
  padding: 0 10px 0 8px;
  font-size: 15px;
}

html:not(.shell-mobile) #os.theme-macos :is(.mac-apple, .mac-menu-app, .mac-menu-item, .mac-menu-icon, .mac-menu-clock):hover,
html:not(.shell-mobile) #os.theme-macos :is(.mac-apple, .mac-menu-app, .mac-menu-item, .mac-menu-icon, .mac-menu-clock).is-open {
  background: var(--m26-menubar-hover);
}

html:not(.shell-mobile) #os.theme-macos .mac-menu-icon {
  width: 30px;
  padding: 0;
}

html:not(.shell-mobile) #os.theme-macos .mac-menu-icon .icon {
  width: 16px;
  height: 16px;
}

html:not(.shell-mobile) #os.theme-macos .mac-menu-icon .icon svg {
  filter: drop-shadow(var(--m26-menubar-shadow, 0 0 0 transparent));
}

html:not(.shell-mobile) #os.theme-macos .mac-menu-clock {
  min-width: 0;
  padding: 0 8px;
  font-variant-numeric: tabular-nums;
  white-space: pre;
}

/* Tahoe's default status items: Battery, Wi-Fi, Spotlight, Control Center. */
html:not(.shell-mobile) #os.theme-macos .mac-menu-right > [title="Volume"] {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .mac-menu-right > [title="Battery"] { order: 1; }
html:not(.shell-mobile) #os.theme-macos .mac-menu-right > [title="Wi-Fi"] { order: 2; }
html:not(.shell-mobile) #os.theme-macos .mac-menu-right > .mac-search { order: 3; }
html:not(.shell-mobile) #os.theme-macos .mac-menu-right > .mac-control-center { order: 4; }
html:not(.shell-mobile) #os.theme-macos .mac-menu-right > .os-ai-chrome-anchor { order: 0; }
html:not(.shell-mobile) #os.theme-macos .mac-menu-right > .mac-menu-clock { order: 6; }

html:not(.shell-mobile) #os.theme-macos .mac-menu-bar .tray-notif-badge {
  top: 1px;
  right: 0;
  min-width: 14px;
  height: 14px;
  font-size: 9px;
  line-height: 14px;
  background: #ff3b30;
}

html:not(.shell-mobile) #os.theme-macos .desktop-surface {
  inset: 24px 0 max(var(--taskbar-clearance), var(--os-system-dock-clearance, 0px)) 0;
}

/* ============================================================================
   Windows — 16px corners, 12px traffic lights, no title-bar separator
   ============================================================================ */

html:not(.shell-mobile) #os.theme-macos .window {
  --m26-win-bg: var(--m26-window);
  --m26-win-text: var(--m26-text);
  --m26-win-text-idle: var(--m26-text-3);
  --m26-win-edge-in: var(--m26-win-edge);
}

html:not(.shell-mobile) #os.theme-macos .window[data-app-color-tone="light"] {
  --m26-win-bg: #f5f5f5;
  --m26-win-text: rgba(0, 0, 0, 0.85);
  --m26-win-text-idle: rgba(0, 0, 0, 0.3);
  --m26-win-edge-in: rgba(255, 255, 255, 0);
}

html:not(.shell-mobile) #os.theme-macos .window[data-app-color-tone="dark"] {
  --m26-win-bg: #2b2b2d;
  --m26-win-text: rgba(255, 255, 255, 0.86);
  --m26-win-text-idle: rgba(255, 255, 255, 0.3);
  --m26-win-edge-in: rgba(255, 255, 255, 0.13);
}

html:not(.shell-mobile) #os.theme-macos .window[data-app-color-theme]:not([data-app-color-theme="white"]):not([data-app-color-theme="black"]) {
  --m26-win-bg: var(--titlebar-bg);
}

html:not(.shell-mobile) #os.theme-macos .window,
html:not(.shell-mobile) #os.theme-macos .window[data-app-color-theme] {
  border-radius: 16px !important;
  border: 0 !important;
  box-shadow: inset 0 0 0 1px var(--m26-win-edge-in), var(--m26-win-shadow-idle) !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  font-family: var(--m26-font);
  animation-duration: 0.22s;
  animation-timing-function: cubic-bezier(0.2, 0.9, 0.3, 1);
}

html:not(.shell-mobile) #os.theme-macos .window.focused,
html:not(.shell-mobile) #os.theme-macos .window[data-app-color-theme].focused {
  box-shadow: inset 0 0 0 1px var(--m26-win-edge-in), var(--m26-win-shadow) !important;
}

html:not(.shell-mobile) #os.theme-macos .window.maximized,
html:not(.shell-mobile) #os.theme-macos .window[data-app-color-theme].maximized {
  border-radius: 0 !important;
  box-shadow: none !important;
}

html:not(.shell-mobile) #os.theme-macos .window.snapped {
  border-radius: 16px !important;
}

html:not(.shell-mobile) #os.theme-macos .window .window-titlebar,
html:not(.shell-mobile) #os.theme-macos .window[data-app-color-theme] .window-titlebar {
  height: 30px;
  padding: 0;
  justify-content: center;
  border-bottom: 0 !important;
  background: var(--m26-win-bg) !important;
  color: var(--m26-win-text) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  opacity: 1 !important;
}

html:not(.shell-mobile) #os.theme-macos .window .window-title-text,
html:not(.shell-mobile) #os.theme-macos .window[data-app-color-theme] .window-title-text {
  font-family: var(--m26-font);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.005em;
  color: var(--m26-win-text) !important;
}

html:not(.shell-mobile) #os.theme-macos .window:not(.focused) .window-title-text,
html:not(.shell-mobile) #os.theme-macos .window[data-app-color-theme]:not(.focused) .window-title-text {
  color: var(--m26-win-text-idle) !important;
}

/* Controls strip: traffic lights on the left, BioStudio's tools on the right. */
html:not(.shell-mobile) #os.theme-macos .window .window-controls {
  left: 13px;
  right: 10px;
  gap: 8px;
  pointer-events: none;
}

html:not(.shell-mobile) #os.theme-macos .window .window-controls > * {
  pointer-events: auto;
}

html:not(.shell-mobile) #os.theme-macos .window .window-controls > :not(.win-btn.close):not(.win-btn.min):not(.win-btn.max) {
  order: 10;
}

html:not(.shell-mobile) #os.theme-macos .window .win-btn.max {
  margin-right: auto;
}

html:not(.shell-mobile) #os.theme-macos .window :is(.win-btn.close, .win-btn.min, .win-btn.max),
html:not(.shell-mobile) #os.theme-macos .window[data-app-color-theme] :is(.win-btn.close, .win-btn.min, .win-btn.max) {
  width: 12px;
  min-width: 12px;
  height: 12px;
  padding: 0;
  border-radius: 50%;
  display: grid;
  place-items: center;
  box-shadow: inset 0 0 0 0.5px rgba(0, 0, 0, 0.14) !important;
  color: rgba(0, 0, 0, 0.55) !important;
  filter: none;
}

html:not(.shell-mobile) #os.theme-macos .window .win-btn.close { background: #ff5f57 !important; }
html:not(.shell-mobile) #os.theme-macos .window .win-btn.min { background: #febc2e !important; }
html:not(.shell-mobile) #os.theme-macos .window .win-btn.max { background: #28c840 !important; }

html:not(.shell-mobile) #os.theme-macos .window:not(.focused) :is(.win-btn.close, .win-btn.min, .win-btn.max) {
  background: #dcdcdc !important;
  box-shadow: inset 0 0 0 0.5px rgba(0, 0, 0, 0.1) !important;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app-color-tone="dark"]:not(.focused) :is(.win-btn.close, .win-btn.min, .win-btn.max) {
  background: #4d4d50 !important;
}

html:not(.shell-mobile) #os.theme-macos .window .window-controls:hover :is(.win-btn.close, .win-btn.min, .win-btn.max) {
  background-color: var(--tl) !important;
}

html:not(.shell-mobile) #os.theme-macos .window .win-btn.close { --tl: #ff5f57; }
html:not(.shell-mobile) #os.theme-macos .window .win-btn.min { --tl: #febc2e; }
html:not(.shell-mobile) #os.theme-macos .window .win-btn.max { --tl: #28c840; }

html:not(.shell-mobile) #os.theme-macos .window :is(.win-btn.close, .win-btn.min, .win-btn.max) svg {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .window :is(.win-btn.close, .win-btn.min, .win-btn.max)::before {
  content: "";
  width: 8px;
  height: 8px;
  background: rgba(0, 0, 0, 0.55);
  opacity: 0;
  -webkit-mask: var(--tl-glyph) center / 8px 8px no-repeat;
  mask: var(--tl-glyph) center / 8px 8px no-repeat;
  transition: opacity 0.08s linear;
}

html:not(.shell-mobile) #os.theme-macos .window .window-controls:hover :is(.win-btn.close, .win-btn.min, .win-btn.max)::before {
  opacity: 1;
}

html:not(.shell-mobile) #os.theme-macos .window .win-btn.close {
  --tl-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M1.3 1.3l5.4 5.4M6.7 1.3L1.3 6.7' stroke='%23000' stroke-width='1.25' stroke-linecap='round'/%3E%3C/svg%3E");
}

html:not(.shell-mobile) #os.theme-macos .window .win-btn.min {
  --tl-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M1 4h6' stroke='%23000' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E");
}

html:not(.shell-mobile) #os.theme-macos .window .win-btn.max {
  --tl-glyph: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M1.4 2.2v4.4h4.4zM6.6 5.8V1.4H2.2z' fill='%23000'/%3E%3C/svg%3E");
}

html:not(.shell-mobile) #os.theme-macos .window .win-btn.close:hover,
html:not(.shell-mobile) #os.theme-macos .window .win-btn:hover {
  filter: none;
}

html:not(.shell-mobile) #os.theme-macos .window .win-btn:active::before {
  background: rgba(0, 0, 0, 0.8);
}

/* BioStudio's tools on the right read as small toolbar glyphs. */
html:not(.shell-mobile) #os.theme-macos .window :is(.win-btn.skills, .win-btn.notes, .win-btn.newtab, .win-btn.mergeback, .win-btn.pin) {
  width: 26px;
  min-width: 26px;
  height: 22px;
  border-radius: 6px;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--m26-win-text-idle) !important;
  font-size: 13px;
}

html:not(.shell-mobile) #os.theme-macos .window :is(.win-btn.skills, .win-btn.notes, .win-btn.newtab, .win-btn.mergeback, .win-btn.pin):hover {
  background: var(--m26-hover) !important;
  color: var(--m26-win-text) !important;
}

html:not(.shell-mobile) #os.theme-macos .window :is(.win-btn.pin, .win-btn.newtab, .win-btn.mergeback) svg {
  width: 14px;
  height: 14px;
  opacity: 1;
}

/* No title-bar hairline: content meets the title bar directly. */
html:not(.shell-mobile) #os.theme-macos .window .window-body {
  border-top: 0;
}

html.fx-glow:not(.shell-mobile) #os.theme-macos:not(.shell-mobile) .window::before {
  display: none;
}

html.fx-glass:not(.shell-mobile) #os.theme-macos:not(.shell-mobile) .window:not(.focused) :is(.window-title-text, .window-controls) {
  opacity: 1;
}

/* ============================================================================
   Dock — Liquid Glass
   ============================================================================ */

html:not(.shell-mobile) #os.theme-macos .taskbar {
  height: 72px;
  padding: 0 0 6px;
}

/* Liquid Glass: a frosted slab with a bright specular rim along the top, a
   softer one along the bottom, and a faint lensing edge all round. */
html:not(.shell-mobile) #os.theme-macos .taskbar-center {
  --dock-sheen: linear-gradient(180deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.08) 42%, rgba(255, 255, 255, 0.02) 60%, rgba(255, 255, 255, 0.12));
  position: relative;
  gap: 4px;
  min-height: 0;
  padding: 6px 8px 7px;
  border-radius: 26px;
  border: 0;
  background: var(--dock-sheen), var(--m26-glass);
  backdrop-filter: blur(min(24px, var(--bs-max-blur, 24px))) saturate(2) brightness(1.06) contrast(1.02);
  -webkit-backdrop-filter: blur(min(24px, var(--bs-max-blur, 24px))) saturate(2) brightness(1.06) contrast(1.02);
  box-shadow:
    inset 0 1.5px 0.5px rgba(255, 255, 255, 0.7),
    inset 1px 0 0.5px rgba(255, 255, 255, 0.22),
    inset -1px 0 0.5px rgba(255, 255, 255, 0.22),
    inset 0 -1px 0.5px rgba(255, 255, 255, 0.28),
    inset 0 0 0 0.5px rgba(255, 255, 255, 0.36),
    inset 0 -10px 18px -12px rgba(255, 255, 255, 0.3),
    0 0 0 0.5px var(--m26-glass-shade),
    0 16px 40px rgba(0, 0, 0, 0.22),
    0 2px 6px rgba(0, 0, 0, 0.08);
}

html:not(.shell-mobile) #os.theme-macos:is([data-color-theme="black"], [data-color-theme="ocean"], [data-color-theme="orchid"]) .taskbar-center {
  --dock-sheen: linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.03) 45%, rgba(255, 255, 255, 0) 60%, rgba(255, 255, 255, 0.06));
}

html:not(.shell-mobile) #os.theme-macos .taskbar-apps {
  gap: 4px;
}

html:not(.shell-mobile) #os.theme-macos :is(.tb-icon-btn, .task-btn) {
  width: 52px;
  min-width: 52px;
  height: 52px;
  border-radius: 12px;
  background: transparent !important;
}

html:not(.shell-mobile) #os.theme-macos :is(.tb-icon-btn, .task-btn):hover {
  background: transparent !important;
}

html:not(.fx-tb-magnify):not(.shell-mobile) #os.theme-macos :is(.tb-icon-btn, .task-btn):hover {
  transform: none;
}

/* App icons fill the tile: the artwork carries its own margin and shadow.
   renderIcon() sizes inline, hence !important. */
html:not(.shell-mobile) #os.theme-macos :is(.task-btn-icon, .task-btn-icon .icon) {
  width: 52px !important;
  height: 52px !important;
}

html:not(.shell-mobile) #os.theme-macos .taskbar-start .icon {
  width: 52px !important;
  height: 52px !important;
}

html:not(.shell-mobile) #os.theme-macos .task-btn:active .task-btn-icon,
html:not(.shell-mobile) #os.theme-macos .tb-icon-btn:active > .icon {
  filter: brightness(0.7);
}

/* Running: a small dot under the icon, inside the glass. */
html:not(.shell-mobile) #os.theme-macos .task-btn-indicator {
  bottom: -5px;
  width: 4px !important;
  height: 4px;
  background: var(--m26-text) !important;
}

/* Apps sits right after Finder; the divider, Downloads and Trash close the
   Dock (css/macos-theme.css hides stray centre buttons, hence !important). */
html:not(.shell-mobile) #os.theme-macos .taskbar-apps > .taskbar-start {
  order: 0;
}

html:not(.shell-mobile) #os.theme-macos .taskbar .taskbar-center > .dock-divider { order: 5; }
html:not(.shell-mobile) #os.theme-macos .taskbar .taskbar-center > .dock-minimized { order: 6; }
html:not(.shell-mobile) #os.theme-macos .taskbar .taskbar-center > .tb-icon-btn.dock-stack:not([hidden]) {
  display: grid !important;
  order: 7;
}

/* Divider before the Downloads stack and the Trash. */
html:not(.shell-mobile) #os.theme-macos .dock-divider {
  align-self: stretch;
  width: 1px;
  margin: 4px 5px;
  background: color-mix(in srgb, var(--m26-text) 22%, transparent);
}

html:not(.shell-mobile) #os.theme-macos .dock-stack {
  display: grid;
  place-items: center;
}

html:not(.shell-mobile) #os.theme-macos .dock-stack svg {
  width: 52px;
  height: 52px;
}

/* ============================================================================
   Menus — rounded glass, SF glyphs, accent highlight
   ============================================================================ */

html:not(.shell-mobile) body.theme-macos .ctx-menu {
  --m26m-bg: var(--m26-menu);
  --m26m-text: var(--m26-text);
  --m26m-text-2: var(--m26-text-2);
  --m26m-stroke: var(--m26-menu-stroke);
  --m26m-sep: var(--m26-separator);
  --m26m-shadow: var(--m26-menu-shadow);
}

html:not(.shell-mobile) body.theme-macos .ctx-menu[data-app-color-tone="light"] {
  --m26m-bg: rgba(244, 244, 246, 0.8);
  --m26m-text: rgba(0, 0, 0, 0.85);
  --m26m-text-2: rgba(0, 0, 0, 0.45);
  --m26m-stroke: rgba(0, 0, 0, 0.1);
  --m26m-sep: rgba(0, 0, 0, 0.1);
  --m26m-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.12), 0 10px 32px rgba(0, 0, 0, 0.22);
}

html:not(.shell-mobile) body.theme-macos .ctx-menu[data-app-color-tone="dark"] {
  --m26m-bg: rgba(38, 38, 40, 0.8);
  --m26m-text: rgba(255, 255, 255, 0.86);
  --m26m-text-2: rgba(255, 255, 255, 0.45);
  --m26m-stroke: rgba(255, 255, 255, 0.12);
  --m26m-sep: rgba(255, 255, 255, 0.1);
  --m26m-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.6), 0 10px 32px rgba(0, 0, 0, 0.5);
}

html:not(.shell-mobile) body.theme-macos .ctx-menu[data-app-color-theme]:not([data-app-color-theme="white"]):not([data-app-color-theme="black"]) {
  --m26m-bg: color-mix(in srgb, var(--surface) 86%, transparent);
}

html:not(.shell-mobile) body.theme-macos .ctx-menu,
html:not(.shell-mobile) body.theme-macos .ctx-menu[role="menu"][data-app-color-theme] {
  min-width: 190px;
  max-width: 340px;
  padding: 5px;
  border-radius: 12px;
  border: 0 !important;
  background: var(--m26m-bg) !important;
  background-image: none !important;
  box-shadow: inset 0 0 0 0.5px var(--m26m-stroke), var(--m26m-shadow);
  backdrop-filter: blur(min(30px, var(--bs-max-blur, 30px))) saturate(1.8);
  -webkit-backdrop-filter: blur(min(30px, var(--bs-max-blur, 30px))) saturate(1.8);
  color: var(--m26m-text) !important;
  font-family: var(--m26-font);
  opacity: 0;
  transform: none;
  transition: opacity 0.12s ease;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu.ctx-in,
html:not(.shell-mobile) body.theme-macos .ctx-menu[role="menu"][data-app-color-theme].ctx-in {
  opacity: 1;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-item,
html:not(.shell-mobile) body.theme-macos .ctx-menu[role="menu"][data-app-color-theme] .ctx-item {
  height: 24px;
  padding: 0 10px 0 8px;
  gap: 8px;
  border-radius: 7px;
  font-family: var(--m26-font);
  font-size: 13px;
  font-weight: 400;
  color: var(--m26m-text) !important;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-item:hover:not([disabled]),
html:not(.shell-mobile) body.theme-macos .ctx-menu[role="menu"][data-app-color-theme] .ctx-item:hover:not([disabled]) {
  background: var(--m26-accent) !important;
  color: #ffffff !important;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-item.danger,
html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-item.danger:hover:not([disabled]) {
  color: var(--m26m-text) !important;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-item.danger:hover:not([disabled]) {
  color: #ffffff !important;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-item[disabled] {
  opacity: 1;
  color: var(--m26m-text-2) !important;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-item[disabled] .ctx-icon {
  opacity: 0.5;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-icon {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  color: inherit;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-icon .icon {
  width: 15px;
  height: 15px;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-check {
  color: inherit;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu :is(.ctx-shortcut, .ctx-arrow) {
  color: var(--m26m-text-2);
  font-size: 13px;
  letter-spacing: 0.04em;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-item:hover:not([disabled]) :is(.ctx-shortcut, .ctx-arrow, .ctx-icon) {
  color: rgba(255, 255, 255, 0.86);
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-arrow .icon {
  width: 11px;
  height: 11px;
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-sep {
  height: 1px;
  margin: 5px 10px;
  background: var(--m26m-sep);
}

html:not(.shell-mobile) body.theme-macos .ctx-menu .ctx-header {
  padding: 4px 10px 2px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: var(--m26m-text-2);
}

/* ============================================================================
   Desktop — Finder desktop icons, top-right
   ============================================================================ */

html:not(.shell-mobile) #os.theme-macos {
  --desktop-pad: 8px;
  --desktop-icon-glyph-small: 48px;
  --desktop-icon-width-small: 84px;
  --desktop-icon-cell-small: 88px;
  --desktop-icon-row-small: 88px;
  --desktop-icon-glyph-medium: 64px;
  --desktop-icon-width-medium: 96px;
  --desktop-icon-cell-medium: 100px;
  --desktop-icon-row-medium: 106px;
  --desktop-icon-glyph-large: 88px;
  --desktop-icon-width-large: 116px;
  --desktop-icon-cell-large: 120px;
  --desktop-icon-row-large: 134px;
  --desktop-icon-label: 12px;
  --desktop-icon-label-small: 12px;
  --desktop-icon-label-large: 12px;
}

html:not(.shell-mobile) #os.theme-macos .desktop-icon {
  gap: 4px;
  padding: 2px;
  border: 0;
  border-radius: 6px;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55);
}

html:not(.shell-mobile) #os.theme-macos .desktop-icon .desktop-icon-glyph {
  padding: 3px;
  border-radius: 8px;
  transition: none;
}

html:not(.shell-mobile) #os.theme-macos .desktop-icon.selected .desktop-icon-glyph {
  background: rgba(0, 0, 0, 0.22);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

html:not(.shell-mobile) #os.theme-macos .desktop-icon:hover .desktop-icon-glyph {
  transform: none;
}

/* App folders stay inside one icon cell, like a Launchpad folder tile. */
html:not(.shell-mobile) #os.theme-macos .desktop-folder-preview,
html:not(.shell-mobile) #os.theme-macos .size-large .desktop-folder-preview,
html:not(.shell-mobile) #os.theme-macos .size-small .desktop-folder-preview {
  --folder-glyph-scale: 1;
  padding: 6px;
  gap: 4px;
  border-radius: 23%;
}

html:not(.shell-mobile) #os.theme-macos .size-large .desktop-folder-preview {
  width: var(--desktop-icon-glyph-large);
  height: var(--desktop-icon-glyph-large);
}

html:not(.shell-mobile) #os.theme-macos .size-small .desktop-folder-preview {
  width: var(--desktop-icon-glyph-small);
  height: var(--desktop-icon-glyph-small);
  padding: 4px;
  gap: 3px;
}

html:not(.shell-mobile) #os.theme-macos .desktop-folder-mini {
  border-radius: 24%;
  background: none;
  box-shadow: none;
}

html:not(.shell-mobile) #os.theme-macos .desktop-folder-mini .icon {
  width: 100%;
  height: 100%;
}

html:not(.shell-mobile) #os.theme-macos .desktop-icon-label {
  padding: 0 5px;
  border-radius: 4px;
  font-family: var(--m26-font);
  font-weight: 600;
  line-height: 15px;
  color: #ffffff;
}

html:not(.shell-mobile) #os.theme-macos .desktop-icon.selected .desktop-icon-label {
  background: var(--m26-accent);
  text-shadow: none;
  -webkit-line-clamp: 4;
}

html:not(.shell-mobile) #os.theme-macos .marquee {
  border: 1px solid rgba(255, 255, 255, 0.75);
  background: rgba(255, 255, 255, 0.18);
  border-radius: 2px;
}

/* ============================================================================
   Control Center
   ============================================================================ */

html:not(.shell-mobile) #os.theme-macos .flyout {
  border: 0;
  border-radius: 24px;
  background: var(--m26-glass-strong);
  box-shadow: inset 0 1px 0.5px var(--m26-glass-edge), inset 0 0 0 0.5px rgba(255, 255, 255, 0.25), 0 0 0 0.5px var(--m26-glass-shade), 0 18px 50px rgba(0, 0, 0, 0.28);
  backdrop-filter: blur(min(40px, var(--bs-max-blur, 40px))) saturate(1.9);
  -webkit-backdrop-filter: blur(min(40px, var(--bs-max-blur, 40px))) saturate(1.9);
  color: var(--m26-text);
  font-family: var(--m26-font);
  transition: opacity 0.14s ease, transform 0.22s cubic-bezier(0.2, 0.9, 0.3, 1);
}

html:not(.shell-mobile) #os.theme-macos .flyout.opens-down:not(.visible) {
  transform: translateY(-6px) scale(0.98);
}

html:not(.shell-mobile) #os.theme-macos .quick-settings[data-variant="tahoe"] {
  width: 328px;
  padding: 12px;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: minmax(60px, auto);
  gap: 10px;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-module {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 10px;
  border-radius: 18px;
  border: 0;
  background: color-mix(in srgb, var(--m26-glass-strong) 60%, rgba(255, 255, 255, 0.4));
  box-shadow: inset 0 0 0 0.5px var(--m26-control-stroke);
  color: var(--m26-text);
  font-family: var(--m26-font);
  text-align: left;
}

html:not(.shell-mobile) #os.theme-macos:is([data-color-theme="black"], [data-color-theme="ocean"], [data-color-theme="orchid"]) .m26-cc-module {
  background: rgba(255, 255, 255, 0.07);
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-conn {
  grid-column: 1 / span 2;
  grid-row: span 2;
  flex-direction: column;
  align-items: stretch;
  justify-content: space-around;
  gap: 4px;
  padding: 8px;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-focus {
  grid-column: 3 / span 2;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-small {
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  gap: 6px;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-slider {
  grid-column: 1 / -1;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  padding: 10px 12px 12px;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 3px 4px;
  border-radius: 10px;
  background: transparent;
  color: var(--m26-text);
  text-align: left;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-row:hover,
html:not(.shell-mobile) #os.theme-macos button.m26-cc-module:hover {
  background: var(--m26-hover);
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-circle {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: color-mix(in srgb, var(--m26-text) 12%, transparent);
  color: var(--m26-text);
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-circle.on {
  background: var(--m26-accent);
  color: #ffffff;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-circle .icon {
  width: 15px;
  height: 15px;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-title {
  font-size: 13px;
  font-weight: 600;
  line-height: 16px;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-sub {
  overflow: hidden;
  font-size: 11px;
  line-height: 14px;
  color: var(--m26-text-2);
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* The slider is a 24px capsule filled in white up to the value. */
html:not(.shell-mobile) #os.theme-macos .m26-cc-track {
  position: relative;
  height: 24px;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-track-icon {
  position: absolute;
  left: 7px;
  top: 5px;
  z-index: 1;
  pointer-events: none;
  color: rgba(0, 0, 0, 0.55);
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-track-icon .icon {
  width: 14px;
  height: 14px;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-range {
  --fill: 60%;
  width: 100%;
  height: 24px;
  margin: 0;
  border-radius: 12px;
  -webkit-appearance: none;
  appearance: none;
  background: linear-gradient(90deg, #ffffff var(--fill), color-mix(in srgb, var(--m26-text) 12%, transparent) var(--fill));
  box-shadow: inset 0 0 0 0.5px var(--m26-control-stroke);
  cursor: pointer;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.3);
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-range::-moz-range-thumb {
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-edit {
  display: block;
  margin: 10px auto 0;
  height: 26px;
  padding: 0 14px;
  border-radius: 13px;
  background: color-mix(in srgb, var(--m26-text) 8%, transparent);
  color: var(--m26-text);
  font-size: 12px;
  font-weight: 500;
}

html:not(.shell-mobile) #os.theme-macos .m26-cc-edit:hover {
  background: color-mix(in srgb, var(--m26-text) 13%, transparent);
}

/* ============================================================================
   Notification Center — notification cards and the Calendar widget
   ============================================================================ */

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] {
  width: 344px;
  max-height: calc(100dvh - 40px);
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow: auto;
  border: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-header {
  justify-content: flex-end;
  margin: 0;
  padding: 0 4px;
  font-size: 0;
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-header > span {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-clear {
  height: 24px;
  padding: 0 12px;
  border-radius: 12px;
  background: var(--m26-glass-strong);
  box-shadow: inset 0 0 0 0.5px var(--m26-glass-edge), 0 4px 12px rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(min(30px, var(--bs-max-blur, 30px)));
  -webkit-backdrop-filter: blur(min(30px, var(--bs-max-blur, 30px)));
  color: var(--m26-text);
  font-size: 12px;
  font-weight: 500;
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-list {
  max-height: none;
  gap: 8px;
  overflow: visible;
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-empty {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-item,
html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .w11-cal-card {
  border-radius: 22px;
  background: var(--m26-glass-strong);
  box-shadow: inset 0 1px 0.5px var(--m26-glass-edge), inset 0 0 0 0.5px rgba(255, 255, 255, 0.2), 0 0 0 0.5px var(--m26-glass-shade), 0 10px 30px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(min(40px, var(--bs-max-blur, 40px))) saturate(1.8);
  -webkit-backdrop-filter: blur(min(40px, var(--bs-max-blur, 40px))) saturate(1.8);
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-item {
  padding: 12px 14px;
  gap: 10px;
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-item.unread {
  background: var(--m26-glass-strong);
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-item-title {
  font-size: 13px;
  font-weight: 600;
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-item-msg {
  font-size: 13px;
  color: var(--m26-text);
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] :is(.nc-item-category, .nc-item-time) {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: var(--m26-text-2);
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-unread-dot {
  background: var(--m26-accent);
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .w11-cal-card {
  width: 170px;
  padding: 12px 12px 10px;
  align-self: flex-start;
}

html:not(.shell-mobile) #os.theme-macos .notif-center[data-variant="tahoe"] .nc-calendar {
  margin: 0;
  padding: 0;
  border: 0;
}

html:not(.shell-mobile) #os.theme-macos .m26-cal-month {
  margin: 0 0 6px 4px;
  color: #ff3b30;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

html:not(.shell-mobile) #os.theme-macos .m26-cal-grid {
  grid-template-columns: repeat(7, 1fr);
  gap: 1px 0;
}

html:not(.shell-mobile) #os.theme-macos .m26-cal-grid .cal-dow {
  padding: 0 0 2px;
  font-size: 9px;
  font-weight: 600;
  color: var(--m26-text-2);
}

html:not(.shell-mobile) #os.theme-macos .m26-cal-grid .cal-cell {
  padding: 0;
  aspect-ratio: 1;
  font-size: 10px;
  font-weight: 500;
  color: var(--m26-text);
}

html:not(.shell-mobile) #os.theme-macos .m26-cal-grid .cal-cell.today {
  background: #ff3b30;
  color: #ffffff;
  font-weight: 700;
}

/* ============================================================================
   Finder
   Traffic lights sit on a floating glass sidebar; the unified toolbar lives
   in the title bar; list view has zebra rows and accent selections.
   ============================================================================ */

html:not(.shell-mobile) #os.theme-macos .window.has-titlebar-accessory {
  --finder-side: 196px;
  border-radius: 20px !important;
}

html:not(.shell-mobile) #os.theme-macos .window.has-titlebar-accessory .window-titlebar,
html:not(.shell-mobile) #os.theme-macos .window[data-app-color-theme].has-titlebar-accessory .window-titlebar {
  position: relative;
  height: 52px;
  justify-content: flex-start;
  background: var(--m26-finder-content, var(--m26-content)) !important;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app-color-tone="dark"] {
  --m26-finder-content: #1e1e1f;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app-color-tone="light"] {
  --m26-finder-content: #ffffff;
}

/* Top of the floating sidebar, behind the traffic lights. */
html:not(.shell-mobile) #os.theme-macos .window.has-titlebar-accessory .window-titlebar::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 8px;
  bottom: 0;
  width: var(--finder-side);
  border-radius: 14px 14px 0 0;
  background: var(--m26-sidebar);
  pointer-events: none;
}

html:not(.shell-mobile) #os.theme-macos .window.has-titlebar-accessory .window-title-text {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .window.has-titlebar-accessory .window-controls {
  left: 22px;
  right: 12px;
}

html:not(.shell-mobile) #os.theme-macos .window.has-titlebar-accessory .window-titlebar-accessory {
  position: relative;
  margin-left: calc(var(--finder-side) + 16px);
  margin-right: 112px;
}

html:not(.shell-mobile) #os.theme-macos .finder-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  height: 100%;
}

html:not(.shell-mobile) #os.theme-macos .finder-glass {
  display: flex;
  align-items: center;
  height: 34px;
  padding: 0 3px;
  border-radius: 17px;
  background: var(--m26-glass-strong);
  box-shadow: inset 0 1px 0.5px var(--m26-glass-edge), inset 0 0 0 0.5px var(--m26-control-stroke), 0 2px 8px rgba(0, 0, 0, 0.08);
  color: var(--m26-text);
}

html:not(.shell-mobile) #os.theme-macos button.finder-glass {
  min-width: 34px;
  justify-content: center;
  gap: 2px;
  padding: 0 9px;
}

html:not(.shell-mobile) #os.theme-macos :is(.finder-histbtn, .finder-seg) {
  width: 32px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: var(--m26-text);
}

html:not(.shell-mobile) #os.theme-macos :is(.finder-histbtn, .finder-seg, button.finder-glass):hover:not(:disabled) {
  background: var(--m26-hover);
}

html:not(.shell-mobile) #os.theme-macos :is(.finder-histbtn, .finder-seg, button.finder-glass):disabled {
  opacity: 0.35;
}

html:not(.shell-mobile) #os.theme-macos .finder-seg.is-on {
  background: color-mix(in srgb, var(--m26-text) 10%, transparent);
}

html:not(.shell-mobile) #os.theme-macos .finder-toolbar .icon {
  width: 16px;
  height: 16px;
}

html:not(.shell-mobile) #os.theme-macos .finder-toolbar button .icon:last-child:not(:first-child) {
  width: 9px;
  height: 9px;
  opacity: 0.6;
}

html:not(.shell-mobile) #os.theme-macos .finder-title {
  min-width: 0;
  overflow: hidden;
  padding: 0 4px;
  color: var(--m26-text);
  font-family: var(--m26-font-display);
  font-size: 15px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html:not(.shell-mobile) #os.theme-macos .finder-spacer {
  flex: 1 1 auto;
}

html:not(.shell-mobile) #os.theme-macos .finder-search {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 180px;
  height: 34px;
  padding: 0 12px;
  border-radius: 17px;
  background: var(--m26-glass-strong);
  box-shadow: inset 0 1px 0.5px var(--m26-glass-edge), inset 0 0 0 0.5px var(--m26-control-stroke);
  color: var(--m26-text-2);
}

html:not(.shell-mobile) #os.theme-macos .window .finder-search-input:not(#_) {
  flex: 1;
  min-width: 0;
  height: 30px;
  padding: 0;
  border: 0 !important;
  outline: none;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--m26-text) !important;
  font-family: var(--m26-font);
  font-size: 13px;
}

/* Explorer body in the Finder variant. */
html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] {
  --fe-accent: var(--m26-accent);
  --files-sidebar-w: var(--finder-side, 196px);
  background: var(--m26-finder-content, var(--m26-content));
  color: var(--m26-text);
  font-family: var(--m26-font);
}

html:not(.shell-mobile) #os.theme-macos .window .fe-explorer-root[data-os-variant="finder"] :is(.fe-explorer, .fe-body, .files-main, .files-grid) {
  background: var(--m26-finder-content, var(--m26-content)) !important;
  box-shadow: none !important;
  font-family: var(--m26-font);
}

/* The slim strip (sync, OneDrive, function search) under the toolbar keeps
   the sidebar running through it, so the glass panel stays one piece. */
html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .files-toolbar.fe-command-bar:not(#_) {
  display: flex;
  justify-content: flex-end;
  height: auto;
  min-height: 0;
  padding: 0 12px 4px calc(var(--finder-side, 196px) + 16px);
  border: 0 !important;
  background: linear-gradient(90deg,
    transparent 8px,
    var(--m26-sidebar) 8px,
    var(--m26-sidebar) calc(8px + var(--finder-side, 196px)),
    transparent calc(8px + var(--finder-side, 196px))) !important;
  box-shadow: none;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .finder-strip:not(#_) {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 0 !important;
  background: transparent !important;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .finder-strip:empty {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .window .fe-explorer-root[data-os-variant="finder"] .finder-strip .btn:not(#_) {
  height: 24px;
  padding: 0 10px;
  border-radius: 12px;
  border: 0 !important;
  background: color-mix(in srgb, var(--m26-text) 7%, transparent) !important;
  box-shadow: none !important;
  color: var(--m26-text) !important;
  font-family: var(--m26-font);
  font-size: 12px;
  font-weight: 500;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] :is(.fe-selection-bar, .files-path.fe-address-bar, .files-pane-resizer) {
  display: none !important;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-body {
  grid-template-columns: var(--finder-side, 196px) 0 minmax(0, 1fr) auto !important;
}

/* The floating sidebar: glass, rounded, inset 8px from the window edge. */
html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .files-sidebar.fe-nav-pane:not(#_) {
  width: var(--finder-side, 196px);
  margin: 0 0 8px 8px;
  padding: 4px 8px 10px;
  gap: 1px;
  border: 0 !important;
  border-radius: 0 0 14px 14px;
  background: var(--m26-sidebar) !important;
  color: var(--m26-text) !important;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-nav-header {
  margin: 10px 0 2px;
  padding: 0 8px;
  color: var(--m26-text-2);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-nav-header:first-child {
  margin-top: 0;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .files-side-item {
  height: 28px;
  min-height: 28px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 8px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
  color: var(--m26-text);
  font-family: var(--m26-font);
  font-size: 13px;
  font-weight: 400;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .files-side-item.is-nested {
  padding-left: 18px;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .files-side-item:hover {
  background: transparent;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .files-side-item.active:not(#_) {
  background: color-mix(in srgb, var(--m26-text) 10%, transparent) !important;
  box-shadow: none;
  color: var(--m26-text);
  font-weight: 400;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .files-side-item.active::before {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-nav-icon {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  display: grid;
  place-items: center;
  color: var(--m26-accent);
  font-size: 0;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-nav-icon .icon {
  width: 16px;
  height: 16px;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-nav-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-nav-badge {
  background: color-mix(in srgb, var(--m26-text) 16%, transparent);
  color: var(--m26-text);
}

/* List view. */
html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-details-header:not(#_) {
  height: 26px;
  margin: 0 12px;
  padding: 0;
  border: 0 !important;
  border-bottom: 1px solid var(--m26-separator) !important;
  background: transparent !important;
  color: var(--m26-text-2);
  font-size: 11px;
  font-weight: 500;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-details-header .fe-col-sort {
  color: var(--m26-text-2);
  font-size: 11px;
  font-weight: 500;
  border-left: 1px solid var(--m26-separator);
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-list-row {
  min-height: 24px;
  width: calc(100% - 24px);
  margin: 0 12px;
  padding: 0 8px;
  border-radius: 6px;
  font-size: 13px;
  color: var(--m26-text);
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-list-row:nth-of-type(even) {
  background: var(--m26-zebra);
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-list-row :is(.fe-list-modified, .fe-list-created, .fe-list-type, .fe-list-size, .fe-list-location) {
  color: var(--m26-text-2);
  font-size: 13px;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] :is(.fe-list-icon, .fe-list-icon svg) {
  width: 16px;
  height: 16px;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .file-item:hover {
  background: inherit;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-list-row.selected,
html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-list-row.selected:nth-of-type(even) {
  background: var(--m26-accent);
  color: #ffffff;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-list-row.selected :is(.fe-list-modified, .fe-list-created, .fe-list-type, .fe-list-size, .fe-list-location) {
  color: rgba(255, 255, 255, 0.86);
}

html:not(.shell-mobile) #os.theme-macos .window:not(.focused) .fe-explorer-root[data-os-variant="finder"] .fe-list-row.selected {
  background: color-mix(in srgb, var(--m26-text) 14%, transparent);
  color: var(--m26-text);
}

/* Icon view: a grey plate behind the selected icon, a blue label pill. */
html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .files-grid.fe-view-icons {
  grid-template-columns: repeat(auto-fill, 96px);
  gap: 8px 6px;
  padding: 12px 16px;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-icon-tile {
  padding: 4px;
  border: 0;
  border-radius: 8px;
  background: transparent !important;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-icon-tile.selected .fe-icon-wrap {
  border-radius: 8px;
  background: color-mix(in srgb, var(--m26-text) 10%, transparent);
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-icon-tile .file-name,
html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-icon-caption {
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 12px;
  color: var(--m26-text);
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .fe-icon-tile.selected .file-name {
  background: var(--m26-accent);
  color: #ffffff;
}

/* Status bar: centred, small, on the content surface. */
html:not(.shell-mobile) #os.theme-macos .window .fe-explorer-root[data-os-variant="finder"] .fe-statusbar:not(#_) {
  height: 26px;
  min-height: 26px;
  justify-content: center;
  padding: 0 12px 0 calc(var(--finder-side, 196px) + 16px);
  border: 0 !important;
  background: transparent !important;
  color: var(--m26-text-2) !important;
  font-family: var(--m26-font);
  font-size: 11px;
  text-align: center;
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root[data-os-variant="finder"] .files-preview {
  border-left: 1px solid var(--m26-separator);
  background: var(--m26-finder-content, var(--m26-content));
}

html:not(.shell-mobile) #os.theme-macos .fe-explorer-root:focus-visible {
  outline: none;
}

/* ============================================================================
   Spotlight, Apps, alerts, banners, Mission Control
   ============================================================================ */

/* Spotlight: a glass capsule a quarter of the way down the screen. */
html:not(.shell-mobile) body.theme-macos .bs-search-overlay {
  align-items: flex-start;
  justify-content: center;
  padding-top: 22vh;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html:not(.shell-mobile) body.theme-macos .bs-search-box {
  width: min(680px, calc(100vw - 32px));
  max-height: 60vh;
  border: 0;
  border-radius: 28px;
  background: var(--m26-glass-strong);
  box-shadow: inset 0 1px 0.5px var(--m26-glass-edge), inset 0 0 0 0.5px rgba(255, 255, 255, 0.25), 0 0 0 0.5px var(--m26-glass-shade), 0 24px 60px rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(min(40px, var(--bs-max-blur, 40px))) saturate(1.9);
  -webkit-backdrop-filter: blur(min(40px, var(--bs-max-blur, 40px))) saturate(1.9);
  color: var(--m26-text);
  font-family: var(--m26-font);
}

html:not(.shell-mobile) body.theme-macos .bs-search-head {
  height: 56px;
  padding: 0 20px;
  gap: 12px;
  border: 0;
  background: transparent;
}

html:not(.shell-mobile) body.theme-macos .bs-search-mag {
  font-size: 20px;
  color: var(--m26-text-2);
}

html:not(.shell-mobile) body.theme-macos .bs-search-input {
  font-family: var(--m26-font-display);
  font-size: 22px;
  font-weight: 400;
  color: var(--m26-text);
  border: 0 !important;
  outline: none;
  box-shadow: none !important;
  background: transparent !important;
}

html:not(.shell-mobile) body.theme-macos .bs-search-esc {
  display: none;
}

html:not(.shell-mobile) body.theme-macos .bs-search-hint {
  padding: 0 22px 6px;
  font-size: 12px;
  color: var(--m26-text-2);
}

/* Apps (the Tahoe replacement for Launchpad). */
html:not(.shell-mobile) #os.theme-macos .launchpad-backdrop {
  background: rgba(20, 22, 30, 0.28);
  backdrop-filter: blur(min(46px, var(--bs-max-blur, 46px))) saturate(1.5);
  -webkit-backdrop-filter: blur(min(46px, var(--bs-max-blur, 46px))) saturate(1.5);
}

html:not(.shell-mobile) #os.theme-macos .launchpad-glow {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .launchpad-searchbar {
  width: 260px;
  height: 34px;
  padding: 0 12px;
  gap: 6px;
  border: 0;
  border-radius: 17px;
  background: rgba(255, 255, 255, 0.18);
  box-shadow: inset 0 1px 0.5px rgba(255, 255, 255, 0.35), inset 0 0 0 0.5px rgba(255, 255, 255, 0.25);
}

html:not(.shell-mobile) #os.theme-macos .launchpad-search {
  color: #ffffff;
  font-family: var(--m26-font);
  font-size: 13px;
}

html:not(.shell-mobile) #os.theme-macos .launchpad-section-title {
  color: rgba(255, 255, 255, 0.72);
  font-family: var(--m26-font);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}

html:not(.shell-mobile) #os.theme-macos .launchpad-grid {
  grid-template-columns: repeat(auto-fill, minmax(116px, 1fr));
  gap: 22px 8px;
}

html:not(.shell-mobile) #os.theme-macos .launchpad-icon-glyph,
html:not(.shell-mobile) #os.theme-macos .launchpad-icon-glyph .icon {
  width: 80px;
  height: 80px;
}

html:not(.shell-mobile) #os.theme-macos .launchpad-label {
  color: #ffffff;
  font-family: var(--m26-font);
  font-size: 12px;
  font-weight: 500;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
}

/* Alerts: a glass sheet with side-by-side capsule buttons. */
html:not(.shell-mobile) body.theme-macos .platform-dialog-overlay {
  background: rgba(0, 0, 0, 0.12);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

html:not(.shell-mobile) body.theme-macos .platform-dialog {
  width: min(300px, calc(100vw - 48px));
  padding: 20px;
  border: 0;
  border-radius: 26px;
  background: var(--m26-glass-strong) !important;
  box-shadow: inset 0 1px 0.5px var(--m26-glass-edge), inset 0 0 0 0.5px rgba(255, 255, 255, 0.25), 0 0 0 0.5px var(--m26-glass-shade), 0 24px 60px rgba(0, 0, 0, 0.32);
  backdrop-filter: blur(min(40px, var(--bs-max-blur, 40px))) saturate(1.8);
  -webkit-backdrop-filter: blur(min(40px, var(--bs-max-blur, 40px))) saturate(1.8);
  color: var(--m26-text);
  font-family: var(--m26-font);
}

html:not(.shell-mobile) body.theme-macos .platform-dialog-head {
  padding: 0;
  border: 0;
  background: transparent;
}

html:not(.shell-mobile) body.theme-macos .platform-dialog-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--m26-text);
}

html:not(.shell-mobile) body.theme-macos .platform-dialog-x {
  display: none;
}

html:not(.shell-mobile) body.theme-macos .platform-dialog-body {
  padding: 6px 0 18px;
}

html:not(.shell-mobile) body.theme-macos .platform-dialog-message {
  font-size: 11px;
  line-height: 15px;
  color: var(--m26-text);
}

html:not(.shell-mobile) body.theme-macos .platform-dialog-foot {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 8px;
  padding: 0;
  border: 0;
  background: transparent;
}

html:not(.shell-mobile) body.theme-macos .platform-dialog :is(.platform-dialog-foot button, .platform-dialog-foot .btn) {
  height: 28px;
  min-width: 0;
  padding: 0 12px;
  border: 0;
  border-radius: 14px;
  background: color-mix(in srgb, var(--m26-text) 10%, transparent);
  box-shadow: none;
  color: var(--m26-text);
  font-family: var(--m26-font);
  font-size: 13px;
  font-weight: 500;
}

html:not(.shell-mobile) body.theme-macos .platform-dialog-foot > :last-child {
  background: var(--m26-accent);
  color: #ffffff;
}

html:not(.shell-mobile) body.theme-macos .platform-dialog-input {
  height: 26px;
  border-radius: 7px;
  border: 0;
  box-shadow: inset 0 0 0 0.5px var(--m26-control-stroke);
  background: var(--m26-control);
  font-family: var(--m26-font);
  font-size: 13px;
}

/* Notification banners slide in under the menu bar, top right. */
html:not(.shell-mobile) #os.theme-macos .toast-layer {
  top: 32px;
  bottom: auto;
  right: 10px;
  gap: 8px;
}

html:not(.shell-mobile) #os.theme-macos .toast {
  width: 344px;
  padding: 12px 14px;
  gap: 10px;
  border: 0;
  border-radius: 22px;
  background: var(--m26-glass-strong);
  box-shadow: inset 0 1px 0.5px var(--m26-glass-edge), inset 0 0 0 0.5px rgba(255, 255, 255, 0.2), 0 0 0 0.5px var(--m26-glass-shade), 0 10px 30px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(min(40px, var(--bs-max-blur, 40px))) saturate(1.8);
  -webkit-backdrop-filter: blur(min(40px, var(--bs-max-blur, 40px))) saturate(1.8);
  color: var(--m26-text);
  font-family: var(--m26-font);
  transform: translateX(calc(100% + 24px));
  transition: transform 0.4s cubic-bezier(0.2, 0.9, 0.3, 1);
}

html:not(.shell-mobile) #os.theme-macos .toast.show {
  transform: none;
}

html:not(.shell-mobile) #os.theme-macos .toast-icon .icon {
  width: 32px;
  height: 32px;
}

html:not(.shell-mobile) #os.theme-macos .toast-title {
  font-size: 13px;
  font-weight: 600;
}

html:not(.shell-mobile) #os.theme-macos .toast-message {
  font-size: 13px;
  line-height: 17px;
  color: var(--m26-text);
}

html:not(.shell-mobile) #os.theme-macos .toast-close {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  font-size: 13px;
}

/* Mission Control: spaces bar along the top, windows spread below. */
html:not(.shell-mobile) body.theme-macos .tv-scrim {
  background: rgba(10, 12, 20, 0.34);
  backdrop-filter: blur(min(24px, var(--bs-max-blur, 24px)));
  -webkit-backdrop-filter: blur(min(24px, var(--bs-max-blur, 24px)));
}

html:not(.shell-mobile) #os.theme-macos .task-view .tv-inner > .tv-desktops {
  order: -1;
}

html:not(.shell-mobile) body.theme-macos .tv-desktops {
  margin: 0 auto;
  padding: 8px 12px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.14);
  box-shadow: inset 0 1px 0.5px rgba(255, 255, 255, 0.3);
}

/* Mission Control shows windows large, spread over the screen, with the
   title as a small capsule under each. */
html:not(.shell-mobile) body.theme-macos .tv-window {
  width: clamp(300px, 30vw, 460px);
  border-radius: 12px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

html:not(.shell-mobile) body.theme-macos .tv-window .tv-thumb {
  height: auto;
  aspect-ratio: 16 / 10.5;
  overflow: visible;
  background: transparent;
  box-shadow: none;
}

html:not(.shell-mobile) body.theme-macos .tv-window .tv-thumb > .window.tb-fit {
  border-radius: 16px !important;
  box-shadow: 0 0 0 1.5px rgba(0, 0, 0, 0.3), 0 40px 110px rgba(0, 0, 0, 0.45) !important;
}

html:not(.shell-mobile) body.theme-macos .tv-window:hover .tv-thumb > .window.tb-fit {
  box-shadow: 0 0 0 10px var(--m26-accent), 0 40px 110px rgba(0, 0, 0, 0.45) !important;
}

html:not(.shell-mobile) body.theme-macos .tv-window:hover {
  box-shadow: none;
}

html:not(.shell-mobile) body.theme-macos .tv-window .tv-window-head {
  width: max-content;
  max-width: 90%;
  margin: 8px auto 0;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(min(20px, var(--bs-max-blur, 20px)));
  -webkit-backdrop-filter: blur(min(20px, var(--bs-max-blur, 20px)));
}

html:not(.shell-mobile) body.theme-macos .tv-window:hover {
  transform: none;
  box-shadow: 0 0 0 3px var(--m26-accent);
}

html:not(.shell-mobile) body.theme-macos .tv-window-head {
  justify-content: center;
  color: #ffffff;
  font-family: var(--m26-font);
  font-size: 12px;
  font-weight: 500;
}

html:not(.shell-mobile) body.theme-macos .tv-thumb {
  border-radius: 12px;
}

/* ============================================================================
   Scrollbars and focus
   ============================================================================ */

#os.theme-macos ::-webkit-scrollbar,
body.theme-macos ::-webkit-scrollbar {
  width: 11px;
  height: 11px;
}

#os.theme-macos ::-webkit-scrollbar-track,
body.theme-macos ::-webkit-scrollbar-track {
  background: transparent;
}

#os.theme-macos ::-webkit-scrollbar-thumb,
body.theme-macos ::-webkit-scrollbar-thumb {
  border: 3px solid transparent;
  border-radius: 6px;
  background: var(--m26-scroll) padding-box;
}

#os.theme-macos ::-webkit-scrollbar-corner,
body.theme-macos ::-webkit-scrollbar-corner {
  background: transparent;
}

/* macOS focus ring: a soft accent halo, keyboard focus only. */
#os.theme-macos :focus-visible,
body.theme-macos :focus-visible {
  outline: 3px solid color-mix(in srgb, var(--m26-accent) 55%, transparent);
  outline-offset: 0;
}

#os.theme-macos [tabindex="-1"]:focus-visible,
#os.theme-macos .finder-search-input:focus-visible,
body.theme-macos :is(.bs-search-input, .launchpad-search):focus-visible {
  outline: none;
}

/* The Dock's Apps tile: a light squircle holding a 3 × 3 grid of colour. */
html:not(.shell-mobile) #os.theme-macos .taskbar-start > .icon {
  visibility: hidden;
}

html:not(.shell-mobile) #os.theme-macos .taskbar-start {
  position: relative;
}

html:not(.shell-mobile) #os.theme-macos .taskbar-start::before {
  content: "";
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 52 52'%3E%3Cdefs%3E%3ClinearGradient id='g' x1='0' y1='0' x2='0' y2='1'%3E%3Cstop offset='0' stop-color='%23fdfdfe'/%3E%3Cstop offset='1' stop-color='%23d9dde4'/%3E%3C/linearGradient%3E%3C/defs%3E%3Crect x='3' y='3' width='46' height='46' rx='11' fill='url(%23g)'/%3E%3Crect x='3.4' y='3.4' width='45.2' height='45.2' rx='10.6' fill='none' stroke='%23000' stroke-opacity='.08' stroke-width='.8'/%3E%3Cg%3E%3Crect x='11' y='11' width='8' height='8' rx='2.2' fill='%23ff5f57'/%3E%3Crect x='22' y='11' width='8' height='8' rx='2.2' fill='%23febc2e'/%3E%3Crect x='33' y='11' width='8' height='8' rx='2.2' fill='%2328c840'/%3E%3Crect x='11' y='22' width='8' height='8' rx='2.2' fill='%2334c7f4'/%3E%3Crect x='22' y='22' width='8' height='8' rx='2.2' fill='%23007aff'/%3E%3Crect x='33' y='22' width='8' height='8' rx='2.2' fill='%23af52de'/%3E%3Crect x='11' y='33' width='8' height='8' rx='2.2' fill='%23ff2d55'/%3E%3Crect x='22' y='33' width='8' height='8' rx='2.2' fill='%23ff9f0a'/%3E%3Crect x='33' y='33' width='8' height='8' rx='2.2' fill='%238e8e93'/%3E%3C/g%3E%3C/svg%3E") center / 52px 52px no-repeat;
}

/* Spotlight's field carries no rectangular focus outline. */
html:not(.shell-mobile) body.theme-macos .bs-search-input:focus,
html:not(.shell-mobile) body.theme-macos .bs-search-input:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

/* The branded BioStudio desktop — slowly turning logo, splash on click —
   is the macOS wallpaper too (css/macos-theme.css used to hide it). */
html:not(.shell-mobile) #os.theme-macos .wallpaper-logo-layer.is-active {
  display: block !important;
}

html:not(.shell-mobile) #os.theme-macos .wallpaper-logo-layer.is-active .wallpaper-wordmark {
  display: flex !important;
}

html:not(.shell-mobile) #os.theme-macos .wallpaper-logo-layer.is-active .wallpaper-logo-splash {
  display: block !important;
}

/* That desktop is dark, so the transparent menu bar reads in white on it. */
html:not(.shell-mobile) #os.theme-macos.wp-biostudio {
  --m26-menubar-ink: rgba(255, 255, 255, 0.95);
  --m26-menubar-hover: rgba(255, 255, 255, 0.2);
  --m26-menubar-shadow: 0 0 6px rgba(0, 0, 0, 0.35);
}

/* Apps grid: the squircle is the tile — no plate behind it, full size. */
html:not(.shell-mobile) #os.theme-macos .launchpad-icon-glyph:has(.icon-osapp) {
  background: none;
  box-shadow: none;
}

html:not(.shell-mobile) #os.theme-macos .launchpad-icon-glyph:has(.icon-osapp),
html:not(.shell-mobile) #os.theme-macos .launchpad-icon-glyph .icon.icon-osapp {
  width: 72px !important;
  height: 72px !important;
  filter: none;
}

/* ============================================================================
   System Settings (the Profile app)
   ============================================================================ */

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-content {
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  grid-template-areas: "head title" "nav body";
  height: 100%;
  padding: 0;
  overflow: hidden !important;
  background: var(--m26-finder-content, var(--m26-content));
  font-family: var(--m26-font);
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] :is(.profile-hero, .profile-footnote, .profile-page-title) {
  display: none;
}

/* The sidebar: a floating glass pane, search on top, then the account. */
html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-nav-head,
html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-main-tabs {
  margin-left: 8px;
  background: var(--m26-sidebar);
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-nav-head {
  grid-area: head;
  display: flex;
  flex-direction: column-reverse;
  gap: 10px;
  margin-top: 0;
  padding: 10px 10px 8px;
  border-radius: 0;
}

html:not(.shell-mobile) #os.theme-macos .profile-nav-searchbox {
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
  justify-content: flex-end;
  gap: 6px;
  height: 28px;
  padding: 0 10px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--m26-text) 7%, transparent);
  color: var(--m26-text-2);
}

html:not(.shell-mobile) #os.theme-macos .window .profile-nav-search:not(#_) {
  flex: 1;
  min-width: 0;
  height: 26px;
  padding: 0;
  border: 0 !important;
  outline: none;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--m26-text) !important;
  font-family: var(--m26-font);
  font-size: 13px;
}

html:not(.shell-mobile) #os.theme-macos .window .profile-nav-search:not(#_)::placeholder {
  color: var(--m26-text-2);
}

html:not(.shell-mobile) #os.theme-macos .profile-nav-user {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px;
  border-radius: 8px;
  background: transparent;
  color: var(--m26-text);
  text-align: left;
}

html:not(.shell-mobile) #os.theme-macos .profile-nav-user:hover {
  background: color-mix(in srgb, var(--m26-text) 7%, transparent);
}

html:not(.shell-mobile) #os.theme-macos .profile-nav-avatar {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(180deg, #a8a8b0, #6c6c74);
  color: #ffffff !important;
  font-size: 15px;
  font-weight: 600;
}

html:not(.shell-mobile) #os.theme-macos .profile-nav-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

html:not(.shell-mobile) #os.theme-macos .profile-nav-id {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

html:not(.shell-mobile) #os.theme-macos .profile-nav-name {
  overflow: hidden;
  font-size: 13px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html:not(.shell-mobile) #os.theme-macos .profile-nav-email {
  overflow: hidden;
  font-size: 11px;
  color: var(--m26-text-2) !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-main-tabs {
  grid-area: nav;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1px;
  margin: 0 0 8px 8px;
  padding: 2px 10px 12px;
  border: 0;
  border-radius: 0 0 14px 14px;
  overflow-y: auto;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-main-tab {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 28px;
  padding: 0 6px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  box-shadow: none;
  color: var(--m26-text);
  font-family: var(--m26-font);
  font-size: 13px;
  font-weight: 400;
  text-align: left;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-main-tab.active:not(#_) {
  background: var(--m26-accent) !important;
  color: #ffffff !important;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-main-tab.active .profile-tab-label:not(#_) {
  color: #ffffff !important;
}

/* Each pane gets its coloured squircle, like System Settings. */
html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-tab-icon {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  border-radius: 5.5px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--tab-c) 70%, #ffffff), var(--tab-c));
  box-shadow: inset 0 0 0 0.5px rgba(0, 0, 0, 0.12);
  color: #ffffff !important;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-main-tab[data-tab="learned"] .profile-tab-icon:not(#_) {
  color: #6a4b00 !important;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-tab-icon .icon {
  color: inherit !important;
  width: 13px;
  height: 13px;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-tab-body {
  grid-area: body;
  grid-row: 1 / span 2;
  min-height: 0;
  padding: 18px 24px 24px;
  overflow-y: auto;
}

/* Grouped settings: rounded boxes with a bold caption. */
html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .settings-section {
  margin: 0 0 16px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 0;
  background: color-mix(in srgb, var(--m26-text) 4%, transparent);
  box-shadow: inset 0 0 0 0.5px var(--m26-separator);
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .settings-section > h3 {
  margin: 0 0 10px;
  color: var(--m26-text);
  font-family: var(--m26-font);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

/* ============================================================================
   Get Info — the narrow inspector window with disclosure sections
   ============================================================================ */

html:not(.shell-mobile) body.theme-macos .fe-os-props[data-variant="mac"] {
  --fe-os-props-shadow: var(--m26-win-shadow);
  width: 300px;
  max-height: calc(100vh - 80px);
  overflow-y: auto;
  border-radius: 16px;
  background: var(--m26-window);
  box-shadow: var(--m26-win-shadow);
  color: var(--m26-text);
  font-family: var(--m26-font);
  font-size: 11px;
  scrollbar-width: none;
}

html:not(.shell-mobile) body.theme-macos .fe-os-props[data-variant="mac"] .fe-os-props-bar {
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  height: 30px;
  padding: 0 12px;
  background: var(--m26-window);
  cursor: default;
  user-select: none;
  touch-action: none;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-lights {
  display: flex;
  gap: 8px;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-light {
  width: 12px;
  height: 12px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: color-mix(in srgb, var(--m26-text) 18%, transparent);
  box-shadow: inset 0 0 0 0.5px rgba(0, 0, 0, 0.12);
}

html:not(.shell-mobile) body.theme-macos .fe-mi-light.is-close { background: #ff5f57; cursor: default; }
html:not(.shell-mobile) body.theme-macos .fe-mi-light:nth-child(2) { background: #febc2e; }

html:not(.shell-mobile) body.theme-macos .fe-mi-light.is-close:hover {
  background: #ff5f57 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3.8 3.8l4.4 4.4m0-4.4L3.8 8.2' stroke='%234d0000' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") center / 12px no-repeat;
}

html:not(.shell-mobile) body.theme-macos .fe-os-props[data-variant="mac"] .fe-os-props-title {
  flex: 1;
  min-width: 0;
  margin-right: 52px;
  overflow: hidden;
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 14px 12px;
  border-bottom: 1px solid var(--m26-separator);
}

html:not(.shell-mobile) body.theme-macos .fe-mi-head .fe-os-props-icon {
  width: 40px;
  height: 40px;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-id {
  flex: 1;
  min-width: 0;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-name {
  display: flex;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  overflow-wrap: anywhere;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-size {
  margin-left: auto;
  flex: 0 0 auto;
  color: var(--m26-text-2);
  font-weight: 400;
  font-size: 12px;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-sub {
  margin-top: 2px;
  color: var(--m26-text-2);
  font-size: 11px;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-sec {
  padding: 6px 14px 8px;
  border-bottom: 1px solid var(--m26-separator);
}

html:not(.shell-mobile) body.theme-macos .fe-mi-sec > summary {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 2px 0;
  font-size: 11px;
  font-weight: 700;
  list-style: none;
  cursor: default;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-sec > summary::-webkit-details-marker {
  display: none;
}

/* The disclosure chevron. */
html:not(.shell-mobile) body.theme-macos .fe-mi-sec > summary::before {
  content: "";
  width: 9px;
  height: 9px;
  background: var(--m26-text-2);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3.5 1.8 6.7 5 3.5 8.2' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3.5 1.8 6.7 5 3.5 8.2' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform 0.15s ease;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-sec[open] > summary::before {
  transform: rotate(90deg);
}

html:not(.shell-mobile) body.theme-macos .fe-mi-grid {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  gap: 3px 6px;
  margin: 6px 0 2px;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-grid:empty {
  display: none;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-grid dt {
  color: var(--m26-text);
  font-weight: 600;
  text-align: right;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-grid dd {
  margin: 0;
  overflow-wrap: anywhere;
  user-select: text;
}

html:not(.shell-mobile) body.theme-macos .fe-mi-actions {
  margin: 6px 0 2px 82px;
}

html:not(.shell-mobile) body.theme-macos .fe-os-props .fe-os-link {
  height: 20px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: var(--m26-control);
  box-shadow: 0 0 0 0.5px var(--m26-control-stroke), 0 0.5px 1px rgba(0, 0, 0, 0.08);
  color: var(--m26-text);
  font: 11px var(--m26-font);
}

html:not(.shell-mobile) body.theme-macos .fe-mi-field:not(#_) {
  width: 100%;
  height: 22px;
  margin: 6px 0 2px;
  padding: 0 6px;
  border: 0 !important;
  border-radius: 5px;
  background: var(--m26-content) !important;
  box-shadow: 0 0 0 0.5px var(--m26-control-stroke) !important;
  color: var(--m26-text) !important;
  font: 12px var(--m26-font);
}

/* ============================================================================
   Activity Monitor (Task Manager) — unified toolbar, tabs, bottom load pane
   ============================================================================ */

html:not(.shell-mobile) #os.theme-macos .window[data-app="task-manager"].has-titlebar-accessory {
  --finder-side: 0px;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="task-manager"].has-titlebar-accessory .window-titlebar::before {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="task-manager"].has-titlebar-accessory .window-titlebar-accessory {
  margin-left: 78px;
  margin-right: 112px;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-width: 0;
  height: 100%;
  color: var(--m26-text);
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-titles {
  display: flex;
  flex-direction: column;
  min-width: 0;
  margin-right: auto;
  line-height: 1.2;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-title {
  overflow: hidden;
  font: 700 15px var(--m26-font-display);
  text-overflow: ellipsis;
  white-space: nowrap;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-sub {
  color: var(--m26-text-2) !important;
  font-size: 11px;
  white-space: nowrap;
}

html:not(.shell-mobile) #os.theme-macos :is(.tmgr-mac-tools, .tmgr-seg, .tmgr-mac-search) {
  display: flex;
  align-items: center;
  height: 34px;
  padding: 0 3px;
  border-radius: 17px;
  background: var(--m26-glass-strong);
  box-shadow: inset 0 1px 0.5px var(--m26-glass-edge), inset 0 0 0 0.5px var(--m26-control-stroke), 0 2px 8px rgba(0, 0, 0, 0.08);
}

html:not(.shell-mobile) #os.theme-macos :is(.tmgr-tool, .tmgr-seg-btn):not(#_) {
  display: grid;
  place-items: center;
  height: 28px;
  min-width: 32px;
  padding: 0 8px;
  border: 0 !important;
  border-radius: 14px;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--m26-text) !important;
  font: 500 12px var(--m26-font);
  cursor: default;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-tool:not(#_):hover {
  background: var(--m26-hover) !important;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-seg-btn {
  padding: 0 12px !important;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-seg-btn.active:not(#_) {
  background: var(--m26-press) !important;
  font-weight: 600;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-search {
  gap: 6px;
  width: 180px;
  padding: 0 12px;
  color: var(--m26-text-2);
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-search .tmgr-search-input:not(#_) {
  flex: 1;
  min-width: 0;
  height: 26px;
  padding: 0;
  border: 0 !important;
  outline: none;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--m26-text) !important;
  font: 13px var(--m26-font);
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="task-manager"] {
  container-type: inline-size;
}

@container (max-width: 720px) {
  html:not(.shell-mobile) #os.theme-macos .tmgr-mac-search { width: 34px; padding: 0 10px; }
  html:not(.shell-mobile) #os.theme-macos .tmgr-mac-search .tmgr-search-input:not(#_) { width: 0; }
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] {
  background: var(--m26-finder-content, var(--m26-content)) !important;
  color: var(--m26-text);
  font-family: var(--m26-font);
  font-size: 12px;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] :is(.tmgr-kpis, .tmgr-toolbar, .tmgr-note, .tmgr-bar-wrap, .tmgr-title) {
  display: none !important;
}

/* Each tab shows its own column, as Activity Monitor does; there is no
   Status column. */
html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-table :is(th, td):nth-child(2),
html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"][data-view="cpu"] .tmgr-table :is(th, td):is(:nth-child(4), :nth-child(5)),
html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"][data-view="memory"] .tmgr-table :is(th, td):is(:nth-child(3), :nth-child(5)),
html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"][data-view="energy"] .tmgr-table :is(th, td):is(:nth-child(3), :nth-child(4)) {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-scroll {
  margin: 0;
  border: 0;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-table th:not(#_) {
  height: 26px;
  padding: 0 8px;
  border: 0;
  border-bottom: 1px solid var(--m26-separator);
  border-right: 1px solid var(--m26-separator);
  background: var(--m26-finder-content, var(--m26-content)) !important;
  color: var(--m26-text-2) !important;
  font: 400 11px var(--m26-font);
  letter-spacing: 0;
  text-transform: none;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-table th:first-child {
  padding-left: 14px;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-table :is(th, td):nth-child(n + 3) {
  width: 110px;
  text-align: right;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-table th.sorted:not(#_) {
  color: var(--m26-text) !important;
  font-weight: 600;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-table td {
  height: 24px;
  padding: 0 8px;
  border: 0;
  color: var(--m26-text);
  font-size: 12px;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-name {
  padding-left: 14px !important;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-app {
  font-weight: 400;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-icon .icon {
  width: 16px !important;
  height: 16px !important;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-energy:not(#_) {
  color: var(--m26-text) !important;
  font-weight: 400;
  text-align: right;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-row:nth-child(even) {
  background: var(--m26-zebra);
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-row:hover {
  background: var(--m26-hover);
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-row.selected {
  background: var(--m26-accent);
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-row.selected :is(td, span):not(#_) {
  color: var(--m26-on-accent) !important;
}

/* The bottom pane: stats either side of the history graph. */
html:not(.shell-mobile) #os.theme-macos .tmgr[data-os="mac"] .tmgr-mac-pane {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, 1.1fr) minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  flex: 0 0 auto;
  height: 118px;
  padding: 10px 18px 12px;
  border-top: 1px solid var(--m26-separator);
  background: var(--m26-window);
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-stats {
  display: grid;
  grid-template-columns: auto auto;
  justify-content: space-between;
  gap: 4px 12px;
  margin: 0;
  font-size: 11px;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-stats dt {
  color: var(--m26-text);
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-stats dd {
  margin: 0;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

html:not(.shell-mobile) #os.theme-macos .tmgr[data-view="cpu"] .tmgr-mac-stats:first-child dd:nth-of-type(1) { color: #ff3b30 !important; }
html:not(.shell-mobile) #os.theme-macos .tmgr[data-view="cpu"] .tmgr-mac-stats:first-child dd:nth-of-type(2) { color: #0a84ff !important; }

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-graph-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  height: 100%;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-graph-label {
  color: var(--m26-text-2);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.02em;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-graph {
  flex: 1;
  width: 100%;
  min-height: 0;
  overflow: hidden;
  border-radius: 4px;
  background: var(--m26-content);
  box-shadow: inset 0 0 0 0.5px var(--m26-control-stroke);
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-graph svg {
  width: 100%;
  height: 100%;
  display: block;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-graph .tmgr-grid path {
  stroke: var(--m26-separator);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

html:not(.shell-mobile) #os.theme-macos .tmgr-mac-graph .tmgr-line { fill: none; stroke-width: 1; vector-effect: non-scaling-stroke; }
html:not(.shell-mobile) #os.theme-macos .tmgr-mac-graph .is-sys { fill: rgba(255, 59, 48, 0.55); stroke: #ff3b30; }
html:not(.shell-mobile) #os.theme-macos .tmgr-mac-graph .is-user { fill: rgba(10, 132, 255, 0.5); stroke: #0a84ff; }
html:not(.shell-mobile) #os.theme-macos .tmgr-mac-graph .is-mem { fill: rgba(52, 199, 89, 0.55); stroke: #34c759; }
html:not(.shell-mobile) #os.theme-macos .tmgr-mac-graph .is-energy { fill: rgba(10, 132, 255, 0.45); stroke: #0a84ff; }
html:not(.shell-mobile) #os.theme-macos .tmgr-mac-graph .tmgr-line:is(.is-sys, .is-user, .is-mem, .is-energy) { fill: none; }

/* About: the product lock-up centred on top, then grouped rows. */
html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-about-section:not(#_) {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .about-layout:not(#_) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas: "info" "specs" "keys";
  gap: 16px;
  max-width: 560px;
  min-height: 0 !important;
  margin: 0 auto;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .about-info {
  grid-area: info;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .about {
  padding: 8px 0 0;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .about .tagline {
  color: var(--m26-text-2) !important;
  font-size: 12px;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] :is(.about-specs, .about-shortcuts):not(#_) {
  border-radius: 12px;
  border: 0 !important;
  background: color-mix(in srgb, var(--m26-text) 4%, transparent);
  box-shadow: inset 0 0 0 0.5px var(--m26-separator);
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .about-specs {
  grid-area: specs;
  display: block;
}

html:not(.shell-mobile) #os.theme-macos .about-specs-head {
  display: flex;
  align-items: center;
  padding: 8px 12px;
  border-bottom: 0.5px solid var(--m26-separator);
}

html:not(.shell-mobile) #os.theme-macos .about-specs-title {
  flex: 1;
  margin: 0;
  color: var(--m26-text);
  font: 700 13px var(--m26-font);
}

html:not(.shell-mobile) #os.theme-macos .about-specs-copy:not(#_) {
  height: 22px;
  padding: 0 10px;
  border: 0 !important;
  border-radius: 6px;
  background: var(--m26-control) !important;
  box-shadow: 0 0 0 0.5px var(--m26-control-stroke), 0 0.5px 1px rgba(0, 0, 0, 0.08) !important;
  color: var(--m26-text) !important;
  font: 13px var(--m26-font);
}

html:not(.shell-mobile) #os.theme-macos .about-specs-grid {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  margin: 0;
  padding: 0 12px;
  font-size: 13px;
}

html:not(.shell-mobile) #os.theme-macos .about-specs-grid :is(dt, dd) {
  padding: 8px 0;
  border-bottom: 0.5px solid var(--m26-separator);
}

html:not(.shell-mobile) #os.theme-macos .about-specs-grid :is(dt, dd):nth-last-child(-n + 2) {
  border-bottom: 0;
}

html:not(.shell-mobile) #os.theme-macos .about-specs-grid dt {
  color: var(--m26-text) !important;
}

html:not(.shell-mobile) #os.theme-macos .about-specs-grid dd {
  margin: 0;
  color: var(--m26-text-2) !important;
  text-align: right;
  user-select: text;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .about-shortcuts:not(#_) {
  grid-area: keys;
  padding: 10px 12px !important;
  overflow: visible !important;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .about-shortcuts-title {
  margin: 0 0 4px;
  color: var(--m26-text) !important;
  font: 700 13px var(--m26-font);
  text-transform: none;
  letter-spacing: 0;
}

/* Settings groups: no house accent stripe, no drop shadow, sentence-case titles. */
html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] :is(.dashboard-section, .profile-section, .admin-section):not(#_) {
  padding: 12px 14px;
  border: 0 !important;
  border-radius: 12px;
  background: color-mix(in srgb, var(--m26-text) 4%, transparent) !important;
  box-shadow: inset 0 0 0 0.5px var(--m26-separator);
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] :is(.dashboard-section, .profile-section, .admin-section)::before {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] :is(.dashboard-section, .profile-section, .admin-section, .about-specs) h3:not(#_) {
  color: var(--m26-text) !important;
  font: 700 13px var(--m26-font);
  letter-spacing: 0;
  text-transform: none;
}

html:not(.shell-mobile) #os.theme-macos .window[data-app="profile"] .profile-about-section:not(#_) {
  padding: 0;
  background: transparent !important;
  box-shadow: none;
}

/* ============================================================================
   Green-button tiling menu: Move & Resize, Fill & Arrange, Full Screen
   ============================================================================ */

html:not(.shell-mobile) body.theme-macos .snap-flyout.is-macos {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 232px;
  padding: 6px;
  border: 0;
  border-radius: 12px;
  background: var(--m26-menu);
  box-shadow: var(--m26-menu-shadow);
  color: var(--m26-text);
  font-family: var(--m26-font);
  backdrop-filter: blur(min(30px, var(--bs-max-blur, 30px))) saturate(1.8);
  -webkit-backdrop-filter: blur(min(30px, var(--bs-max-blur, 30px))) saturate(1.8);
  transform: translateY(-2px) scale(0.98);
  transform-origin: top left;
}

html:not(.shell-mobile) body.theme-macos .snap-flyout.is-macos.show {
  transform: none;
}

html:not(.shell-mobile) body.theme-macos .snap-mac-title {
  padding: 4px 8px 2px;
  color: var(--m26-text-2);
  font-size: 11px;
  font-weight: 600;
}

html:not(.shell-mobile) body.theme-macos .snap-mac-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2px;
  padding: 2px 2px 4px;
}

html:not(.shell-mobile) body.theme-macos .snap-mac-tile {
  display: grid;
  place-items: center;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--m26-text);
  cursor: default;
}

html:not(.shell-mobile) body.theme-macos .snap-mac-tile:hover {
  background: var(--m26-accent);
  color: var(--m26-on-accent);
}

html:not(.shell-mobile) body.theme-macos .snap-mac-screen {
  position: relative;
  width: 24px;
  height: 17px;
  border: 1.4px solid currentColor;
  border-radius: 4px;
  opacity: 0.85;
}

/* A transparent border insets the fill from the frame on every side. */
html:not(.shell-mobile) body.theme-macos .snap-mac-fill {
  position: absolute;
  box-sizing: border-box;
  border: 1.4px solid transparent;
  border-radius: 3px;
  background: currentColor;
  background-clip: padding-box;
}

html:not(.shell-mobile) body.theme-macos .snap-mac-sep {
  height: 1px;
  margin: 3px 8px;
  background: var(--m26-separator);
}

html:not(.shell-mobile) body.theme-macos .snap-mac-item {
  height: 24px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--m26-text);
  font: 13px var(--m26-font);
  text-align: left;
  cursor: default;
}

html:not(.shell-mobile) body.theme-macos .snap-mac-item:hover {
  background: var(--m26-accent);
  color: var(--m26-on-accent);
}

/* ============================================================================
   Dock — name labels and minimized windows (js/core/mac-dock.js)
   ============================================================================ */

.dock-tip,
.dock-minimized {
  display: none;
}

html:not(.shell-mobile) #os.theme-macos .dock-tip:not([hidden]) {
  position: absolute;
  z-index: 30;
  display: block;
  padding: 4px 11px;
  border-radius: 999px;
  background: var(--m26-menu);
  box-shadow: inset 0 0 0 0.5px var(--m26-menu-stroke), 0 4px 14px rgba(0, 0, 0, 0.2);
  color: var(--m26-text);
  font: 500 13px var(--m26-font);
  white-space: nowrap;
  pointer-events: none;
  backdrop-filter: blur(min(24px, var(--bs-max-blur, 24px))) saturate(1.8);
  -webkit-backdrop-filter: blur(min(24px, var(--bs-max-blur, 24px))) saturate(1.8);
  animation: dock-tip-in 0.12s ease-out;
}

@keyframes dock-tip-in {
  from { opacity: 0; transform: translateY(3px); }
  to { opacity: 1; transform: none; }
}

html:not(.shell-mobile) #os.theme-macos .dock-minimized:not([hidden]) {
  display: flex;
  gap: 4px;
}

html:not(.shell-mobile) #os.theme-macos .dock-min {
  position: relative;
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: default;
}

html:not(.shell-mobile) #os.theme-macos .dock-min-card {
  display: flex;
  flex-direction: column;
  width: 46px;
  height: 34px;
  overflow: hidden;
  border-radius: 5px;
  background: var(--m26-content);
  box-shadow: 0 0 0 0.5px rgba(0, 0, 0, 0.2), 0 2px 6px rgba(0, 0, 0, 0.25);
}

html:not(.shell-mobile) #os.theme-macos .dock-min-bar {
  display: flex;
  gap: 2px;
  flex: 0 0 7px;
  align-items: center;
  padding: 0 3px;
  background: var(--m26-window);
}

html:not(.shell-mobile) #os.theme-macos .dock-min-bar i {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #ff5f57;
}

html:not(.shell-mobile) #os.theme-macos .dock-min-bar i:nth-child(2) { background: #febc2e; }
html:not(.shell-mobile) #os.theme-macos .dock-min-bar i:nth-child(3) { background: #28c840; }

html:not(.shell-mobile) #os.theme-macos .dock-min-body {
  display: grid;
  flex: 1;
  place-items: center;
  opacity: 0.55;
}

html:not(.shell-mobile) #os.theme-macos .dock-min-body .icon {
  width: 20px !important;
  height: 20px !important;
}

html:not(.shell-mobile) #os.theme-macos .dock-min-badge {
  position: absolute;
  right: 1px;
  bottom: 3px;
}

html:not(.shell-mobile) #os.theme-macos .dock-min-badge .icon {
  width: 20px !important;
  height: 20px !important;
}

html:not(.shell-mobile) #os.theme-macos .dock-min:active .dock-min-card {
  filter: brightness(0.8);
}