/* Decorations occupy empty viewport gutters only, behind the unchanged site. */
.ambient-sides { position: fixed; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; display: none; }
.site-shell { position: relative; z-index: 1; }
.ambient-zone { position: absolute; top: 0; bottom: 0; width: max(0px, calc((100% - 1280px) / 2)); overflow: hidden; pointer-events: none; }
.ambient-zone[data-ambient-side="left"] { left: 0; }
.ambient-zone[data-ambient-side="right"] { right: 0; }
.ambient-pattern { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; fill: none; stroke: #e6e6e6; stroke-width: .7; }
.ambient-pattern path, #ambient-lines path { vector-effect: non-scaling-stroke; }
.ambient-base { opacity: .065; }
.ambient-glow { opacity: 0; color: #f2f2f2; transition: opacity .24s ease; mask-image: radial-gradient(ellipse 180px 235px at var(--ambient-x, 50%) var(--ambient-y, 50%), #000000 0%, #00000099 38%, transparent 78%); -webkit-mask-image: radial-gradient(ellipse 180px 235px at var(--ambient-x, 50%) var(--ambient-y, 50%), #000000 0%, #00000099 38%, transparent 78%); }
.ambient-zone[data-active="true"] .ambient-glow { opacity: .13; }
@media (min-width: 1360px) { .ambient-sides { display: block; } }
@media (min-width: 1360px) and (max-width: 1599px) { .ambient-base { opacity: .045; } .ambient-zone[data-active="true"] .ambient-glow { opacity: .09; } }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) { .ambient-zone[data-listening="true"] { pointer-events: auto; } }
@media (prefers-reduced-motion: reduce), (hover: none), (pointer: coarse) { .ambient-glow { display: none; transition: none; } }
@media (forced-colors: active) { .ambient-sides { display: none; } }

/* Fixed space, tabular digits, and a truthful no-JS fallback. No live region. */
#desktop-demo .desktop-clock { display: inline-flex; align-items: center; justify-content: flex-end; gap: 0; inline-size: 21ch; flex-shrink: 0; white-space: nowrap; font-variant-numeric: tabular-nums; }
.desktop-clock[data-ready="false"] .clock-separator, .desktop-clock[data-ready="false"] .clock-time { visibility: hidden; }
.clock-time { margin-inline-start: .4em; display: inline-block; inline-size: 5ch; text-align: right; }
@media (max-width: 720px) { #desktop-demo .desktop-menu-items { display: none; } }

/* Bounded silver light; no full-page blur/filter or moving background image. */
.hero[data-spotlight] { position: relative; isolation: isolate; overflow: clip; }
.hero[data-spotlight]::before { content: ''; position: absolute; left: 0; top: 0; width: 520px; height: 360px; z-index: -1; pointer-events: none; border-radius: 50%; background: radial-gradient(ellipse at center, #d2d2d20a, #a8a8a804 38%, transparent 70%); opacity: 0; transform: translate3d(calc(var(--spot-x, 50%) - 260px), calc(var(--spot-y, 50%) - 180px), 0); transition: opacity .22s ease, transform .2s cubic-bezier(.2,.7,.2,1); }
.hero[data-spotlight-active="true"]::before { opacity: 1; }
@media (max-width: 1023px), (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce), (forced-colors: active) { .hero[data-spotlight]::before { display: none; transition: none; } }