:root{font-family:"Avenir Next",Avenir,"Segoe UI",sans-serif;background:#06070a}
html,body,body *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
header{z-index:4;align-items:center;gap:24px}
header .destination{font:400 clamp(19px,2.2vw,27px)/1.25 "Avenir Next",Avenir,"Segoe UI",sans-serif;letter-spacing:.005em;padding:0;min-height:44px;display:flex;align-items:center;color:#e9e8e2;transition:color .4s,opacity .7s}
#telly{opacity:var(--telly-presence,1)}#portal{opacity:var(--art-presence,1)}
header .destination:hover,header .destination:focus-visible{color:var(--green);opacity:1}
.invitation{position:fixed;left:70px;right:70px;bottom:max(34px,env(safe-area-inset-bottom));text-align:center;font-size:14px;line-height:1.45;letter-spacing:.025em;color:#aeb3b5;margin:0;pointer-events:none;opacity:0;transition:opacity 1.8s;z-index:3}
html[data-ready] .invitation{opacity:.85}html[data-touched] .invitation{opacity:0}
#notice{bottom:100px;font-size:14px;z-index:5}.shade{opacity:.42}.sound-button,.instagram-link{z-index:5}
html[data-shaping] #touch.active{box-shadow:0 0 18px #39ff1418}
@media(max-width:600px){.invitation{font-size:12px;left:65px;right:65px;bottom:max(31px,env(safe-area-inset-bottom));max-width:220px;margin:auto}header .destination{font-size:20px}}
@media(prefers-reduced-motion:reduce){.invitation{opacity:.85}}
