/* OS only. Distinct optical chrome above an intentionally quiet reading layer. */
html[data-device][data-theme=macos] {
  --liquid-ink:#262626;
  --liquid-fill:rgba(249,249,248,.24);
  --liquid-blur:7px;--liquid-rim:18px;--liquid-shift:11px;
  --liquid-filter:blur(20px) saturate(1.25);
  --liquid-shadow:0 8px 28px #25211d18,0 1px 3px #25211d12;
}
html[data-device][data-theme=macos] body.windows-os,
html[data-device=desktop][data-theme=macos] body.windows-os,
html[data-device=phone][data-theme=macos] body.windows-os {
  background:#ded9d0 url('os-wallpaper-contour.webp') center/cover fixed no-repeat;
}
@media (orientation:portrait) {
  html[data-device=phone][data-theme=macos] body.windows-os {
    background-image:url('os-wallpaper-contour-mobile.webp');
  }
}
html[data-device][data-theme=macos] .os-desktop::before {display:none;}
html[data-device][data-theme=macos] :is(.mac-menubar,.desktop-icon,.desktop-hint,.wallpaper-brand span) {
  color:#242426;text-shadow:0 1px 3px #ffffff45;
}
/* A transparent menu bar, rather than another frosted rectangle across the screen. */
html[data-device=desktop][data-theme=macos] .mac-menubar {
  background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;
  border:0;box-shadow:none;color:#242426;text-shadow:none;
}
html[data-device=desktop][data-theme=macos] .mac-menubar button {color:inherit;border-radius:8px;}
html[data-device=desktop][data-theme=macos] .mac-menubar button:hover,
html[data-device=desktop][data-theme=macos] .mac-menubar button[aria-expanded=true] {background:#ffffff25;}
/* The new optical surfaces. Highlights are independent of the content, so text stays sharp. */
html[data-device][data-theme=macos] .liquid-surface {
  --lens-filter:var(--liquid-refraction,blur(var(--liquid-blur))) saturate(1.35);
  background:var(--liquid-fill);
  border:1px solid #423d3610;box-shadow:var(--liquid-shadow);color:var(--liquid-ink);
  backdrop-filter:var(--lens-filter);-webkit-backdrop-filter:var(--lens-filter);
}
html[data-device][data-theme=macos] body.windows-os .liquid-surface {
  border-color:#211e1a29;
}
html[data-device][data-theme=macos] .liquid-surface::before {
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;
  background:var(--liquid-specular,linear-gradient(135deg,#ffffff30,transparent 22%,transparent 78%,#ffffff28)) center/100% 100% no-repeat;
  box-shadow:inset 0 .5px #ffffff30,inset 0 -.5px #15151512;
}
html[data-device][data-theme=macos] .liquid-surface::after {
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;
  box-shadow:none;opacity:0;transition:opacity .2s ease;
  background:radial-gradient(ellipse at var(--light-x,25%) var(--light-y,0%),#ffffff22,transparent 62%);
}
html[data-device][data-theme=macos] .liquid-surface:hover::after {opacity:.45;}
html[data-device][data-theme=macos] .liquid-surface.is-liquid-pressed::after {opacity:1;}
html[data-device][data-theme=macos] footer.taskbar.liquid-surface {
  --liquid-fill:rgba(250,249,248,.16);--liquid-blur:2.5px;--liquid-rim:18px;--liquid-shift:14px;
  border-radius:28px;background:var(--liquid-fill);
  box-shadow:0 12px 32px #28221c20,0 2px 5px #28221c14;
}
html[data-device=desktop][data-theme=macos] footer.taskbar {padding:9px 13px;height:78px;bottom:12px;}
html[data-device][data-theme=macos] .start-button,html[data-device][data-theme=macos] .dock-label {color:#173047;text-shadow:0 1px 1px #ffffff9c;}
html[data-device][data-theme=macos] .dock-dot {background:#123047;box-shadow:0 1px 1px #fff9;}
html[data-device][data-theme=macos] :is(.icon-art,.dock-app-art,.start-button>span) {position:relative;}
html[data-device][data-theme=macos] :is(.icon-art,.dock-app-art,.start-button>span)::after {
  content:'';position:absolute;inset:0;pointer-events:none;border-radius:23%;
  box-shadow:inset 0 .5px #ffffff55;
  background:linear-gradient(145deg,#ffffff0d,transparent 42%);
}
/* Window glass lives in the frame and navigation, not on the paragraphs. */
html[data-device][data-theme=macos] .os-window {
  background:#f4f3f12e;backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid #25211d26;
  border-radius:22px;padding:0;box-shadow:0 22px 60px #24201b26,0 2px 7px #24201b12;
}
html[data-device][data-theme=macos] .os-window.is-active {box-shadow:0 24px 64px #24201b30,0 2px 8px #24201b20;}
html[data-device=desktop][data-theme=macos] .os-window .os-titlebar.liquid-surface {
  position:relative;min-height:54px;padding:9px 13px;border:0;border-radius:21px 21px 0 0;
  --liquid-fill:rgba(249,249,248,.38);--liquid-blur:7px;background:var(--liquid-fill);backdrop-filter:var(--lens-filter);-webkit-backdrop-filter:var(--lens-filter);box-shadow:0 1px #24211d0b;
}
html[data-device][data-theme=macos] .os-window .window-content {background:#f8fafd;}
html[data-device=desktop][data-theme=macos] .os-window .os-window-bottom {background:#e8f2fcf0;color:#53647b;border-top:1px solid #d4dfeb;}
html[data-device][data-theme=macos] .os-window:not(.is-active) .os-titlebar {--liquid-fill:rgba(234,240,249,.74);}
html[data-device][data-theme=macos] .start-menu.liquid-surface {position:fixed;border-radius:24px;--liquid-fill:rgba(250,249,247,.48);--liquid-blur:10px;--liquid-rim:22px;--liquid-shift:15px;padding:12px;}
html[data-device][data-theme=macos] .start-menu-items :is(button,a):hover {background:#ffffff70;}
/* Identity is content, not an extra glass panel. Preserve the supplied logo. */
html[data-device][data-theme=macos] .wallpaper-brand img {background:transparent;border:0;box-shadow:none;position:relative;z-index:1;}
html[data-device][data-theme=macos] .brand-lens {position:relative;display:block;border:0;background:transparent;box-shadow:none;}
html[data-device][data-theme=macos] .wallpaper-brand span {color:#333335;text-shadow:none;}
/* Thicker regular material for text-heavy overlays. */
html[data-device][data-theme=macos] :is(.dictation-dialog,.phone-search-dialog).liquid-surface,
html[data-device][data-theme=macos] #setup-dialog.liquid-surface {
  position:fixed;border-radius:26px;--liquid-fill:rgba(250,249,247,.64);--liquid-blur:12px;--liquid-rim:24px;--liquid-shift:14px;
  color:#242426;
}
html[data-device][data-theme=macos] :is(.dictation-dialog,.phone-search-dialog,#setup-dialog)::backdrop {background:#10244038;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);}
html[data-device][data-theme=macos] .dictation-dialog :is(.dictation-disclosure,.dictation-actions) {background:#ffffff73;border:1px solid #ffffff8c;border-radius:20px;box-shadow:none;}
html[data-device][data-theme=macos] .dictation-dialog .dictation-actions {padding:10px;}
html[data-device][data-theme=macos] .dictation-dialog .dictation-button {border-radius:999px;}
html[data-device][data-theme=macos] .phone-search-dialog input[type=search] {border-radius:999px;background:#ffffffe0;border:1px solid #9fbbd46b;}
html[data-device][data-theme=macos] .phone-search-result {background:#ffffff9e;border-color:#ffffff82;border-radius:16px;}
html[data-device][data-theme=macos] #setup-dialog .setup-footer {background:#ffffff3d;border-color:#ffffff4d;}
/* Sculpted pill controls, with a subtle press rather than a permanent animation. */
html[data-device][data-theme=macos] .os-window .window-content .button {border-radius:999px;}
html[data-device][data-theme=macos] .os-window .window-content .button.primary {
  background:#2469cd;border:1px solid #1d5ebf;
  box-shadow:0 2px 4px #174b941a;
}
html[data-device][data-theme=macos] .os-window .window-content .button:not(.primary) {background:linear-gradient(#ffffffc9,#eef4faaa);border:1px solid #c1d0e1;box-shadow:inset 0 1px #fff,0 2px 6px #16385210;}
html[data-device][data-theme=macos] .os-window .window-content .button:active {transform:scale(.98);}
html[data-device][data-theme=macos] .dictation-button.dictation-primary {border-radius:999px;background:#2469cd;border:1px solid #1d5ebf;box-shadow:0 2px 4px #174b941a;}
/* Mobile has one floating navigation pill above the edge-to-edge reading surface. */
html[data-device=phone][data-theme=macos] #workspace .os-window {background:transparent;border:0;border-radius:0;box-shadow:none;}
html[data-device=phone][data-theme=macos] #workspace .os-window.is-active {box-shadow:none;}
html[data-device=phone][data-theme=macos] .os-window .os-titlebar.liquid-surface {
  position:relative;margin:3px max(10px,env(safe-area-inset-right,0px)) 10px max(10px,env(safe-area-inset-left,0px));
  min-height:52px;border-radius:27px;padding:4px 8px;border:1px solid #423d3610;--liquid-fill:rgba(248,247,245,.22);--liquid-blur:3px;--liquid-rim:15px;--liquid-shift:10px;background:var(--liquid-fill);backdrop-filter:var(--lens-filter);-webkit-backdrop-filter:var(--lens-filter);
}
html[data-device=phone][data-theme=macos] .os-window .window-content {border-radius:24px 24px 16px 16px;}
html[data-device=phone][data-theme=macos] .os-window .phone-home {position:relative;background:#24242607;box-shadow:none;border:1px solid transparent;color:#2469cd;min-height:40px;border-radius:22px;}
html[data-device=phone][data-theme=macos] footer.taskbar.liquid-surface {border-radius:32px;height:88px;}
html[data-device=phone][data-theme=macos] .phone-home-search.liquid-surface {border-radius:999px;--liquid-fill:rgba(247,246,244,.18);--liquid-blur:2px;--liquid-rim:15px;--liquid-shift:12px;color:#242426;}
html[data-device=phone][data-theme=macos] .phone-page-dots {background:#ffffff14;border:1px solid #ffffff30;box-shadow:inset 0 1px #ffffff6b;}
html[data-device=phone][data-theme=macos] .brand-lens.liquid-surface {border-radius:32px;}
html[data-device=phone][data-theme=macos] .wallpaper-brand img {border-radius:32px;background:transparent;}
@media(max-width:1000px) and (max-height:600px) and (orientation:landscape) and (pointer:coarse) {
  html[data-device=phone][data-theme=macos] .os-window .os-titlebar.liquid-surface {min-height:44px;margin-top:0;margin-bottom:6px;}
  html[data-device=phone][data-theme=macos] footer.taskbar.liquid-surface {height:62px;border-radius:27px;}
}
/* The assistant sidebar is navigation: it can retain the wallpaper context. */
html[data-theme=macos] #projekt :is(.window-content,.project-wizard,.wizard-layout) {background:transparent;}
html[data-theme=macos] #projekt .wizard-main {background:#f8fafd;border-radius:20px 0 0 0;}
html[data-theme=macos] #projekt .wizard-header {background:#f0f6fc;border-color:#ffffff52;}
html[data-theme=macos] #projekt .wizard-sidebar.liquid-surface {position:relative;--liquid-fill:rgba(247,246,244,.50);--liquid-blur:10px;background:var(--liquid-fill);border:0;border-radius:0;color:#242426;backdrop-filter:var(--lens-filter);-webkit-backdrop-filter:var(--lens-filter);box-shadow:none;}
html[data-theme=macos] #projekt .wizard-sidebar.liquid-surface::before,
html[data-theme=macos] #projekt .wizard-sidebar.liquid-surface::after {display:none;}
html[data-theme=macos] #projekt .wizard-sidebar button[aria-current=step] {background:#ffffff90;border-color:transparent;border-radius:999px;color:#245aaa;box-shadow:0 1px 3px #2424260c;}
html[data-theme=macos] #projekt footer.wizard-footer.liquid-surface {position:relative;--liquid-fill:rgba(248,247,245,.50);--liquid-blur:8px;background:var(--liquid-fill);border:0;border-radius:0;backdrop-filter:var(--lens-filter);-webkit-backdrop-filter:var(--lens-filter);box-shadow:0 -1px #24242608;}
html[data-device=phone][data-theme=macos] #projekt .window-content {border-radius:24px 24px 16px 16px;}
html[data-device=phone][data-theme=macos] #projekt .wizard-main {border-radius:20px 20px 0 0;}
html[data-device=phone][data-theme=macos] #projekt .wizard-sidebar.liquid-surface {border-radius:24px 24px 0 0;}

/* Solid material is the baseline if filtering or accessibility preferences require it. */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  html[data-device][data-theme=macos] .liquid-surface {background:#eaf3fc!important;}
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more) {
  html[data-device][data-theme=macos] .liquid-surface {background:#eaf3fc!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:0 3px 12px #1234512b;}
  html[data-device][data-theme=macos] .liquid-surface::before,html[data-device][data-theme=macos] .liquid-surface::after {display:none;}
  html[data-device][data-theme=macos] .os-window .window-content {background:#f8fafc;}
  html[data-device][data-theme=macos] :is(.dictation-dialog,.phone-search-dialog,#setup-dialog)::backdrop {backdrop-filter:none;-webkit-backdrop-filter:none;background:#10244070;}
}
@media(prefers-reduced-motion:reduce) {
  html[data-device][data-theme=macos] .liquid-surface {transition:none!important;}
  html[data-device][data-theme=macos] .os-window .window-content .button:active {transform:none;}
}
@media(forced-colors:active) {
  html[data-device][data-theme=macos] .liquid-surface {background:Canvas!important;color:CanvasText;border:1px solid CanvasText!important;box-shadow:none;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
  html[data-device][data-theme=macos] .liquid-surface::before,html[data-device][data-theme=macos] .liquid-surface::after {display:none;}
}

/* Thin content overlays stay above the material without another glass layer. */
html[data-device][data-theme=macos] :is(footer.taskbar,.start-menu,.phone-home-search,.os-titlebar,.wizard-sidebar,.wizard-footer,.material-probe)>* {position:relative;z-index:1;}
html[data-device][data-theme=macos] .phone-home-search {transition:scale .24s cubic-bezier(.2,.8,.2,1);}
html[data-device][data-theme=macos] .phone-home-search.is-liquid-pressed {scale:.96;}
html[data-device][data-theme=macos] .material-probe {position:relative;border-radius:999px;--liquid-blur:3px;--liquid-rim:20px;--liquid-shift:14px;--liquid-fill:#ffffff22;}
html[data-device][data-theme=macos] .material-probe[data-material=regular] {--liquid-blur:9px;--liquid-fill:#ffffff65;}
html[data-device][data-theme=macos] .material-probe[data-scheme=dark] {--liquid-fill:#161a243d;color:#fff;}
@media(prefers-reduced-motion:reduce){html[data-device][data-theme=macos] .phone-home-search.is-liquid-pressed{scale:1;}}


/* Light contour wallpaper: charcoal labels preserve contrast on the satin planes. */
html[data-device][data-theme=macos] body.windows-os :is(.mac-menubar,.desktop-icon,.desktop-hint,.wallpaper-brand span) {
  color:#24262c;text-shadow:0 1px 2px #ffffff65;
}
html[data-device][data-theme=macos] .wallpaper-brand img {filter:none;}
html[data-device][data-theme=macos] :is(.start-button,.dock-label,.phone-home-search.liquid-surface) {color:#24262c;text-shadow:0 1px 2px #ffffff65;}
html[data-device][data-theme=macos] .dock-dot {background:#24262c;box-shadow:0 1px 2px #ffffff55;}
html[data-device=phone][data-theme=macos] .phone-page-dots button {color:#24262c;}
html[data-device][data-theme=macos] .os-window .os-titlebar.liquid-surface {--liquid-fill:rgba(245,249,255,.78);}
html[data-device][data-theme=macos] .start-menu.liquid-surface {--liquid-fill:rgba(245,249,255,.76);}
html[data-device][data-theme=macos] #projekt .wizard-sidebar.liquid-surface {--liquid-fill:rgba(245,249,255,.80);}
html[data-device][data-theme=macos] #projekt footer.wizard-footer.liquid-surface {--liquid-fill:rgba(245,249,255,.80);}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more) {
  html[data-device][data-theme=macos] :is(.start-button,.dock-label,.phone-home-search.liquid-surface) {color:#173047;text-shadow:none;}
}
@media(forced-colors:active) {
  html[data-device][data-theme=macos] body.windows-os :is(.mac-menubar,.desktop-icon,.desktop-hint,.wallpaper-brand span) {color:CanvasText;text-shadow:none;}
}