/* Shared site chrome: one control grammar across all three scenes. */
.site-mark { position:fixed; z-index:100; left:max(20px,env(safe-area-inset-left)); top:calc(6px + env(safe-area-inset-top)); min-height:var(--site-touch-target); padding:10px 0; color:#fff8e4; font:25px/1 var(--hand); text-decoration:none; text-shadow:0 1px 3px #2a1b11,var(--chrome-mark-shadow,0 1px 4px #174f9270); background:var(--chrome-mark-bg,transparent); border-radius:8px; box-shadow:var(--chrome-halo,none); }
.site-mark-dot { display:inline-block; width:.13em; height:.13em; margin:0 .015em .02em; overflow:hidden; border-radius:50%; background:#fff8e4; color:transparent; font-size:1em; line-height:0; }

/* Quiet, persistent access to the three compositions. */
.view-switcher { position:fixed; z-index:100; left:max(13px,env(safe-area-inset-left)); top:calc(56px + env(safe-area-inset-top)); display:flex; gap:0; padding:var(--chrome-nav-padding,0); color:var(--chrome-ink,#fff8e4); background:var(--chrome-nav-bg,#17223773); border-radius:8px; box-shadow:var(--chrome-halo,none); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); }
.view-switcher a { display:grid; place-items:center; width:var(--site-touch-target); height:var(--site-touch-target); color:inherit; opacity:var(--chrome-icon-opacity,.72); border-radius:4px; transition:opacity var(--site-control-motion),background var(--site-control-motion); }
.view-switcher svg { width:18px; height:18px; filter:var(--chrome-icon-shadow,none); }
.view-switcher a[aria-current="page"] { opacity:var(--chrome-current-opacity,1); }
.view-switcher a:hover,.view-switcher a:focus-visible { opacity:1; background:#ffffff18; }
.view-switcher a:focus-visible { outline:1px solid currentColor; outline-offset:1px; }
/* First-load nudge: a slow double-pulse that settles back to the resting icons. */
.view-switcher.attention a { animation:view-switch-attention 4.36s ease-in-out both; }
.view-switcher.attention a:nth-child(2) { animation-delay:.32s; }
.view-switcher.attention a:nth-child(3) { animation-delay:.64s; }
@keyframes view-switch-attention {
  0%,100% { transform:scale(1); background:transparent; box-shadow:none; }
  22%,58% { transform:scale(1.16); background:#fff6d92e; box-shadow:0 0 12px 3px #ffedb873; }
  40% { transform:scale(1.05); background:#fff6d914; box-shadow:0 0 4px 1px #ffedb82e; }
}
@media(max-width:650px) { .site-mark { left:max(14px,env(safe-area-inset-left)); top:calc(2px + env(safe-area-inset-top)); padding:11px 0; font-size:21px; } .view-switcher { left:max(7px,env(safe-area-inset-left)); top:calc(50px + env(safe-area-inset-top)); } }
@media(prefers-reduced-motion:reduce) { .view-switcher a { transition:none; } .view-switcher.attention a { animation:none; background:#fff6d92e; box-shadow:0 0 8px 2px #ffedb873; } }


/* SFX-only speaker toggle, riding with the view switcher. */
.sound-toggle { display:grid; place-items:center; width:var(--site-touch-target); height:var(--site-touch-target); padding:0; color:inherit; opacity:.72; background:none; border:0; border-radius:4px; cursor:pointer; transition:opacity var(--site-control-motion),background var(--site-control-motion); }
.sound-toggle svg { width:18px; height:18px; }
.sound-toggle:hover,.sound-toggle:focus-visible { opacity:1; background:#ffffff18; }
.sound-toggle:focus-visible { outline:1px solid currentColor; outline-offset:1px; }
.sound-toggle .sound-slash { display:none; }
.sound-toggle[data-muted="true"] .sound-slash { display:block; }
.sound-toggle[data-muted="true"] .sound-waves { display:none; }
.view-switcher.attention .sound-toggle { animation:none; }
