/* Dohs optical material: controls above content, never a treatment for the content itself. */
:root { --glass-warm: 246,244,240; --glass-ink: 26,26,26; }
.glass-definitions { position:absolute; width:0; height:0; overflow:visible; pointer-events:none; }
[data-glass] { position:relative; --glass-proximity:0; --glass-angle:135deg; --glass-x:50%; --glass-y:0px; }
[data-glass] > :not(.liquid-surface) { position:relative; z-index:2; }
.liquid-surface { position:absolute; inset:0; display:block; pointer-events:none; border-radius:inherit; z-index:0; }
.glass-optical-plane,.glass-frost,.glass-edge,.glass-light { position:absolute; inset:0; display:block; pointer-events:none; border-radius:inherit; }
/* One continuous outline for the carrier and each material layer. Older
   engines retain a fully rounded capsule, never a polygon approximation. */
.btn[data-glass],.nav-project { border-radius:999px; }
@supports (corner-shape:superellipse(1.25)) {
  .site-header.is-scrolled[data-glass],.btn[data-glass],.mobile-menu[data-glass],.nav-project { corner-shape:superellipse(1.25); }
  [data-glass]:not([data-glass="photograph"]) > .liquid-surface,
  [data-glass]:not([data-glass="photograph"]) > .liquid-surface > span { corner-shape:inherit; }
}
.glass-optical-plane { overflow:hidden; background:transparent; }
.glass-frost { background:rgba(var(--glass-warm),.56); box-shadow:inset 0 1px 1px rgba(255,255,255,.64),inset 0 -1px 2px rgba(26,26,26,.1); }
.glass-edge { padding:1px; background:conic-gradient(from var(--glass-angle),rgba(255,255,255,.92),rgba(255,255,255,.05) 14%,rgba(26,26,26,.14) 32%,rgba(255,255,255,.76) 50%,rgba(255,255,255,.03) 66%,rgba(26,26,26,.13) 82%,rgba(255,255,255,.92)); mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; }
.glass-light { opacity:var(--glass-proximity); background:radial-gradient(ellipse 120px 75px at var(--glass-x) var(--glass-y),rgba(223,111,42,.16),rgba(255,255,255,.10) 28%,transparent 75%); transition:opacity 220ms ease; box-shadow:inset 0 1px 0 rgba(255,255,255,.16); }
.glass-pressed .glass-light { background:radial-gradient(ellipse 150px 90px at var(--glass-x) var(--glass-y),rgba(223,111,42,.23),rgba(255,255,255,.13) 38%,transparent 78%); }

/* The header is quiet on entry, then becomes one optical capsule while scrolling. */
.site-header.is-scrolled[data-glass] { border-radius:999px; background:transparent; backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:0 8px 24px rgba(26,26,26,.105),0 2px 5px rgba(26,26,26,.045); border-color:transparent; }
.site-header:not(.is-scrolled) > .liquid-surface { display:none; }
/* One even tint across the lens. Refraction and rim highlights provide depth,
   without a milky band building toward the middle of the navigation. */
:is([data-glass="navigation"],[data-glass="context"]) .glass-frost { background:rgba(var(--glass-warm),.28); box-shadow:inset 0 1px 1px rgba(255,255,255,.62),inset 0 -1px 1px rgba(255,255,255,.34),inset 0 0 4px rgba(26,26,26,.08); }
/* The menu retains the nav's lens and rim, with extra uniform diffusion for reading. */
[data-glass="context"] { --context-frost:.56; }
[data-glass="context"] .glass-frost { background:rgba(var(--glass-warm),var(--context-frost)); }
:is([data-glass="navigation"],[data-glass="context"]) .glass-light { background:radial-gradient(ellipse 175px 90px at var(--glass-x) var(--glass-y),rgba(223,111,42,.17),rgba(255,255,255,.12) 27%,transparent 75%); }
.site-header.is-scrolled .desktop-nav a { color:var(--dark); text-shadow:0 0 1px rgba(var(--glass-warm),1),0 0 2px rgba(var(--glass-warm),.95),0 1px 5px rgba(var(--glass-warm),.7); }
.site-header.is-scrolled .menu-toggle { filter:drop-shadow(0 0 1px rgba(var(--glass-warm),.95)); }
.site-header.is-scrolled .brand img { filter:drop-shadow(0 0 2px rgba(var(--glass-warm),.9)); }
/* Thin, satin overlay inside the shared nav lens. No second refraction layer. */
.site-header.is-scrolled .nav-project { background:rgba(var(--glass-warm),.48); border-color:rgba(26,26,26,.13); box-shadow:inset 0 1px 0 rgba(255,255,255,.82),0 1px 3px rgba(26,26,26,.035); }
.site-header.is-scrolled .nav-project:is(:hover,[aria-current]) { background:rgba(var(--glass-ink),.93); color:var(--light); }

/* A single clear optical carrier under the photograph controls. */
.photo-controls[data-glass] { border-radius:50px; padding:7px 8px 7px 18px; gap:6px; box-shadow:0 5px 22px rgba(0,0,0,.16); }
[data-glass="photograph"] .glass-frost { background:rgba(26,26,26,.70); box-shadow:inset 0 1px 0 rgba(255,255,255,.52),inset 0 -1px 2px rgba(0,0,0,.24); }
[data-glass="photograph"] .photo-counter { margin-right:9px; text-shadow:0 1px 3px rgba(0,0,0,.5); }
[data-glass="photograph"] .round-control { border:0; background:rgba(246,244,240,.08); backdrop-filter:none; -webkit-backdrop-filter:none; width:44px; height:44px; box-shadow:inset 0 1px 0 rgba(255,255,255,.1); }
[data-glass="photograph"] .round-control:hover { background:rgba(246,244,240,.2); }

/* Primary actions use dark satin glass. Orange remains the actionable accent. */
.btn[data-glass] { background:transparent; box-shadow:0 3px 9px rgba(26,26,26,.07); }
.btn[data-glass] .glass-frost { inset:2px; background:rgba(var(--glass-ink),.93); box-shadow:inset 0 1px 1px rgba(255,255,255,.2),inset 0 -1px 1px rgba(0,0,0,.4); }
.btn[data-glass] .glass-edge { opacity:.65; }
.btn[data-glass]:hover { background:transparent; }
.btn[data-glass] .button__arrow { box-shadow:inset 0 1px 1px rgba(255,255,255,.32),inset 0 -1px 1px rgba(79,33,12,.16); }
.mobile-menu[data-glass] { background:transparent; border-radius:26px; box-shadow:0 18px 35px rgba(26,26,26,.13); }
[data-glass="menu"] .glass-frost { background:rgba(var(--glass-warm),.78); }

/* WebKit/Gecko use one real, bounded backdrop sample. The surrounding content
   supplies color and light, while the satin body, clear rim and specular edge
   supply depth. No cloned DOM, SVG/filter stacking, masks on the backdrop,
   promoted 3D planes, or sticky-position compensation. */
.glass-optical-plane { -webkit-backdrop-filter:blur(12px) saturate(1.16); backdrop-filter:blur(12px) saturate(1.16); }
:is([data-glass="navigation"],[data-glass="context"]) .glass-optical-plane { -webkit-backdrop-filter:blur(3.5px) saturate(1.18); backdrop-filter:blur(3.5px) saturate(1.18); }
[data-glass="context"] .glass-optical-plane { -webkit-backdrop-filter:blur(7px) saturate(1.18); backdrop-filter:blur(7px) saturate(1.18); }
[data-glass="menu"] .glass-optical-plane { -webkit-backdrop-filter:blur(5px) saturate(1.12); backdrop-filter:blur(5px) saturate(1.12); }
[data-glass="action"] .glass-optical-plane { -webkit-backdrop-filter:blur(1.2px) saturate(1.12); backdrop-filter:blur(1.2px) saturate(1.12); }
[data-glass-engine="optical-satin"] [data-glass]:not([data-glass="navigation"]):not([data-glass="context"]) .glass-frost { background-image:linear-gradient(155deg,rgba(255,255,255,.10),transparent 32%,transparent 65%,rgba(26,26,26,.035)); }
[data-glass-engine="optical-satin"] .glass-edge { padding:1.25px; }
[data-glass]:not([data-glass="photograph"]) .glass-edge { padding:.75px; }
[data-glass-engine="optical-satin"] :is([data-glass="navigation"],[data-glass="context"]) .glass-frost { box-shadow:inset 0 1px 1px rgba(255,255,255,.72),inset 0 -1px 1px rgba(255,255,255,.4),inset 0 3px 5px rgba(255,255,255,.14),inset 0 -3px 5px rgba(26,26,26,.075); }
[data-glass-engine="surface"] .glass-frost { background:var(--light); }
[data-glass-engine="surface"] :is([data-glass="action"],[data-glass="photograph"]) .glass-frost { background:var(--dark); }
@media(max-width:760px) {
  .photo-bottomline { flex-wrap:wrap; align-items:flex-start; row-gap:18px; }
  .photo-caption { max-width:100%; }
  .photo-controls[data-glass] { margin-left:auto; padding:6px 7px 6px 14px; flex-shrink:0; }
  [data-glass="photograph"] .photo-counter { font-size:12px; gap:8px; }
  .site-header.is-scrolled .nav-project { padding:9px 12px; }
  .nav-project[aria-current] { padding-inline:12px; }
}
@media(max-width:380px) {
  .site-header.is-scrolled .nav-project { padding:9px 5px; }
  .nav-project[aria-current] { padding-inline:5px; }
  .photo-controls[data-glass] { padding-left:12px; gap:3px; }
}
/* Preferences take precedence over optics, including changes made while open. */
[data-glass-engine="solid"] .glass-optical-plane,[data-glass-engine="solid"] .glass-light,[data-glass-engine="solid"] .glass-edge { display:none!important; }
[data-glass-engine="solid"] .glass-frost { background:var(--light); backdrop-filter:none!important; -webkit-backdrop-filter:none!important; box-shadow:none; border:1px solid var(--rule); }
[data-glass-engine="solid"] [data-glass="action"] .glass-frost { inset:0; }
[data-glass-engine="solid"] :is([data-glass="photograph"],[data-glass="action"]) .glass-frost { background:var(--dark); border-color:rgba(246,244,240,.4); }
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more) {
  .glass-optical-plane,.glass-edge,.glass-light { display:none!important; }
  .glass-frost { background:var(--light)!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important; }
  :is([data-glass="photograph"],[data-glass="action"]) .glass-frost { background:var(--dark)!important; }
}
@media(forced-colors:active) {
  .site-header.is-scrolled .desktop-nav a { text-shadow:none; }
  .site-header.is-scrolled :is(.brand img,.menu-toggle) { filter:none; }
  .liquid-surface { display:none!important; }
  .site-header.is-scrolled[data-glass],.mobile-menu[data-glass] { background:Canvas; border:1px solid CanvasText; box-shadow:none; }
  .btn[data-glass],.photo-controls[data-glass] { background:ButtonFace; color:ButtonText; border:1px solid ButtonText; box-shadow:none; }
  [data-glass="photograph"] .round-control { border:1px solid ButtonText; color:ButtonText; }
}
@media print { .liquid-surface,.glass-definitions { display:none!important; } }

/* Supply uses the same optical material on a compact shopping header. */
:root{--light:var(--paper);--dark:var(--ink);--rule:var(--line);--orange-text:#b0531a;--ease:cubic-bezier(.22,1,.36,1)}
.site-header[data-glass]{position:sticky}
.site-header:not(.is-scrolled)>.liquid-surface{display:block}
.site-header[data-glass]{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.site-header[data-glass] .glass-frost{background:rgba(246,244,240,.72)}
.site-header.is-scrolled[data-glass] .glass-frost{background:rgba(246,244,240,.66)}
.site-header[data-glass] .glass-light{background:radial-gradient(ellipse 175px 90px at var(--glass-x) var(--glass-y),rgba(223,111,42,.13),rgba(255,255,255,.12) 27%,transparent 75%)}
.btn[data-glass]{isolation:isolate;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.btn[data-glass]:before{display:none}
.btn[data-glass] .glass-frost{inset:1px;background:rgba(26,26,26,.93)}
.btn.secondary[data-glass] .glass-frost,.btn.light[data-glass] .glass-frost,.builder-feature>.btn[data-glass] .glass-frost{background:rgba(246,244,240,.72);box-shadow:inset 0 1px 1px #fff9,inset 0 -1px 1px #26221514}
.btn[data-glass]>.glass-label{pointer-events:none}
[data-glass-engine="solid"] .site-header[data-glass]{background:var(--paper)}
[data-glass-engine="solid"] .btn.secondary[data-glass] .glass-frost,[data-glass-engine="solid"] .btn.light[data-glass] .glass-frost,[data-glass-engine="solid"] .builder-feature>.btn[data-glass] .glass-frost{background:var(--paper)}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.btn.secondary[data-glass] .glass-frost,.btn.light[data-glass] .glass-frost,.builder-feature>.btn[data-glass] .glass-frost{background:var(--paper)!important}.site-header[data-glass]{background:var(--paper)!important}}
@media(forced-colors:active){.site-header[data-glass]{background:Canvas;border:1px solid CanvasText}.btn[data-glass]{background:ButtonFace;color:ButtonText}}