/* Waves — the supplied white-on-black interactive wave field. */
#desktop { background: #000; }
.desktop-art, .desktop-vignette { position: absolute; inset: 0; pointer-events: none; }
.desktop-art, .waves-component { background: #000; }
.waves-component { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.desktop-art::before, .waves-component::before {
  content: ""; position: absolute; inset: 0;
  background: #000 url("assets/waves-still.svg") center / cover no-repeat;
}
.waves-component.ready::before { display: none; }
.waves-canvas { display: block; width: 100%; height: 100%; opacity: 0; }
.waves-component.ready .waves-canvas { opacity: 1; }
.desktop-vignette { background: linear-gradient(0deg, rgba(0,0,0,.98), rgba(0,0,0,.75) 120px, transparent 300px); }
.desktop-intro { top: auto; bottom: 32px; left: 36px; right: auto; width: 420px; max-width: calc(50% - 250px); text-shadow: 0 1px 3px rgba(0,0,0,.5); color: #f6f2e9; }
.desktop-intro h1 { font-size: 26px; font-weight: 550; letter-spacing: -.035em; }
.desktop-intro p { color: #c6d2d6; font-size: 12px; letter-spacing: .015em; }
.icon:focus-visible { outline: 1px solid #f3d9b4; outline-offset: 6px; border-radius: 12px; }
.motion-toggle {
  position: absolute; right: 36px; top: 32px; z-index: 20;
  display: flex; align-items: center; gap: 8px; padding: 9px 12px;
  border: 1px solid rgba(222,235,237,.2); border-radius: 30px;
  background: rgba(14,30,39,.65); color: #d2dcdb;
  font: 11px -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  cursor: pointer; transition: background .2s, border-color .2s;
}
.motion-toggle[hidden] { display: none; }
.motion-toggle:hover { background: #223a43; border-color: #849c9e; }
.motion-dot { width: 5px; height: 5px; border-radius: 50%; background: #687e87; }
.motion-toggle[aria-pressed="true"] .motion-dot { background: #eed0a5; box-shadow: 0 0 9px #e6be8266; }
.motion-toggle:focus-visible { outline: 2px solid #f3d9b4; outline-offset: 4px; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  #desktop { cursor: url("assets/continuum-pointer.svg") 4 3, auto; }
  .window, .dock, .motion-toggle { cursor: auto; }
  .icon { cursor: url("assets/continuum-pointer.svg") 4 3, grab; }
  .icon.dragging { cursor: grabbing; }
}
@media (max-width: 1099px) {
  .desktop-intro { bottom: calc(112px + env(safe-area-inset-bottom, 0px)); left: 20px; right: auto; width: min(480px, calc(100% - 40px)); max-width: none; }
  .desktop-vignette { background: linear-gradient(0deg, rgba(0,0,0,.98), rgba(0,0,0,.95) 150px, transparent 380px); }
}
@media (max-width: 719px) {
  .desktop-intro h1 { font-size: 24px; }
  .desktop-intro p { font-size: 12px; max-width: 35ch; }
  .motion-toggle { display: none; }
}
@media (hover: none), (pointer: coarse) {
  .motion-toggle { display: none; }
}
@media (max-height: 500px) {
  .motion-toggle { top: 8px; }
}