/* Inscription-led hierarchy; activity lives inside the instruments. */
body{font-family:Palatino,"Palatino Linotype",Georgia,serif}
.header{justify-content:flex-end;padding:30px 6%;min-height:96px}
.introduction{top:58px;left:7%;width:46%;max-width:520px}
.brand-title{font:inherit;line-height:0;margin:0 0 24px;letter-spacing:normal}
.brand-title .wordmark{width:min(414px,100%);display:block;color:#e2c48b;line-height:0}
.wordmark>svg{width:100%;height:auto;display:block;overflow:visible}
.wordmark:focus-visible{outline:1px solid #9edbd6;outline-offset:6px}
.brand-foil{opacity:0;transition:opacity .5s ease;pointer-events:none}
.wordmark:is(:hover,:focus-visible) .brand-foil{opacity:.95}
.dek{font-size:22px;line-height:1.45;letter-spacing:.005em;color:#c9d9d8;margin-bottom:0}
.living-type{background:radial-gradient(100px circle at var(--light-x,-200px) var(--light-y,0px),#c5eae0,#e4c99c 42%,#bdced0 85%);background-clip:text;-webkit-background-clip:text;color:transparent}
.places{width:min(450px,100%);margin-top:30px;padding-top:16px;gap:14px;border-top-color:#c5b27c28}
.place-art{height:92px}.place-art svg{width:76px;height:92px}
.place-label{font-family:Palatino,Georgia,serif;font-size:15px;line-height:1.35;letter-spacing:.015em;max-width:140px;margin-top:10px;min-height:42px;color:#e0d6be}
.place-control{padding-bottom:14px;text-shadow:0 2px 10px #031219}.place-control::after{background:#c3ac76}
.place-control:focus-visible{outline:1px solid #9edbd6;outline-offset:3px}
.place-control.is-awake .place-art::before{opacity:1}
.place-control.is-awake .glyph-light{opacity:1}
.place-control.is-awake .place-label{color:#e8efe2}
.portal-world,.portal-boundary,.learning-field,.shared-light{transition:opacity .9s ease}
.place-control.is-awake :is(.portal-world,.portal-boundary,.learning-field,.shared-light){opacity:1}
.portal-vortex{transform-origin:48px 61px;animation:portal-turn 16s linear infinite;animation-play-state:paused}
.is-awake .portal-vortex{animation-play-state:running}
.is-awake .portal-boundary{filter:drop-shadow(0 0 2px #e8ace17a)}
.is-awake .observe-glyph .glyph-core{opacity:.22;transition:opacity .7s}
.learning-thread{stroke-dasharray:120;stroke-dashoffset:120}
.is-awake .learning-thread{animation:find-pattern 4s ease both}
.scan-light{animation:scan-view 5s ease-in-out infinite;animation-play-state:paused}
.is-awake .scan-light{animation-play-state:running}
.shared-form{transform-origin:48px 53px;opacity:.2}
.is-awake .shared-form{animation:shared-form 3.8s ease-in-out infinite}
.is-awake .contribution-left{animation:give-left 3.8s ease-in-out infinite}
.is-awake .contribution-right{animation:give-right 3.8s ease-in-out infinite}
@keyframes portal-turn{to{transform:rotate(360deg)}}
@keyframes find-pattern{to{stroke-dashoffset:0}}
@keyframes scan-view{0%,100%{transform:translateX(-10px);opacity:.1}50%{transform:translateX(25px);opacity:.5}}
@keyframes give-left{0%,12%{transform:translateX(0);opacity:0}25%{opacity:1}70%,100%{transform:translateX(23px);opacity:0}}
@keyframes give-right{0%,12%{transform:translateX(0);opacity:0}25%{opacity:1}70%,100%{transform:translateX(-23px);opacity:0}}
@keyframes shared-form{0%,35%,100%{transform:scale(.7);opacity:.15}68%{transform:scale(1);opacity:1}}
#water{position:absolute;inset:0;width:100%;height:100%;z-index:-3;opacity:0;pointer-events:none}#water.ready{opacity:1}
.instruments{gap:10px;align-items:center}
.sound-switch{height:38px;background:#061b2360;border-color:#cfb57c38;border-radius:4px}
.play-button{width:35px;height:36px}.play-button svg{width:23px;height:23px}
.sound-toggle{font:12px Palatino,Georgia,serif;height:36px;padding-right:11px;gap:10px;color:#d4c7aa}
.instrument-button{font-family:Palatino,Georgia,serif;min-width:42px;height:42px;border-radius:4px!important}
.instrument-button svg{width:24px;height:24px}#motion{font-size:12px;padding:0 6px;gap:7px;color:#d4c7aa}
.seal-button .material-glyph{width:38px;height:44px}.seal-label{font:11px Palatino,Georgia,serif;min-width:33px;color:#d4c7aa}
.about-link{padding:0 4px;min-width:37px;gap:6px;font-size:12px;color:#d4c7aa}.about-link svg{width:24px;height:24px}
.about-link .about-label{margin-left:0;color:inherit}
.panel-heading{font:11px Palatino,Georgia,serif;letter-spacing:.12em}.track{font:14px/1.4 Palatino,Georgia,serif}.track small{font:11px/1.4 Palatino,Georgia,serif;color:#9ebbc2}.sketch-label{font-size:10px}
.sound-panel{width:310px;border-radius:5px;border-color:#c6ab733d}
.place-dialog p:not(.eyebrow){font-family:Palatino,Georgia,serif;font-size:16px;line-height:1.6}.place-dialog .eyebrow{font-family:Palatino,Georgia,serif;font-size:11px}
.learning-notes dd{font:14px/1.6 Palatino,Georgia,serif}.place-dialog .panel-footnote{font-size:12px!important}.shore-return{font:13px Palatino,Georgia,serif}
dialog .close{color:#d9c293}.eyebrow{font-family:Palatino,Georgia,serif}
@media(pointer:fine){
 body{cursor:url('assets/imago-hand.svg') 15 3,auto}
 button,a{cursor:url('assets/imago-hand-active.svg') 15 3,pointer}
 input[type="range"]{cursor:ew-resize}dialog p,dialog dd,dialog dt{cursor:text}
}
@media(min-width:1600px){.introduction{top:110px}.brand-title .wordmark{width:459px}.dek{font-size:24px}.places{margin-top:38px}}
@media(max-width:900px) and (min-width:761px){.introduction{top:102px;width:51%}.brand-title .wordmark{width:342px}.dek{font-size:20px}.header{padding:22px 5%}}
@media(max-width:760px){
 .header{padding:17px 6%;min-height:68px}.instruments{gap:7px}#motion-label{display:inline}
 .introduction{top:100px;width:86%;max-width:520px}.brand-title{margin-bottom:19px}.brand-title .wordmark{width:min(420px,100%)}
 .dek{font-size:21px;line-height:1.45}.places{width:100%;gap:9px;margin-top:28px;padding-top:16px}.place-art{height:87px}.place-art svg{width:72px;height:87px}.place-label{font-size:14px;max-width:115px;min-height:40px}
 .instrument-button{min-width:35px}#motion{font-size:11px;gap:4px}.seal-button{padding-right:1px}.seal-label{font-size:10px;min-width:30px}.seal-button .material-glyph{width:32px;height:39px}
 .sound-toggle{font-size:11px}.sound-switch{height:35px}.play-button{width:31px;height:33px}.sound-toggle{height:33px}.sound-panel{top:66px;width:min(310px,calc(100vw - 36px))}
}
@media(max-width:420px){
 .header{padding:13px 5%;min-height:62px}.instruments{gap:4px}#motion-label,.about-label{display:none}.instrument-button{min-width:30px}.about-link{min-width:31px}
 .introduction{top:93px}.brand-title{margin-bottom:19px}.dek{font-size:19px}.places{margin-top:25px;gap:6px}.place-art{height:82px}.place-art svg{width:68px;height:82px}.place-label{font-size:13px;min-height:36px}
 .place-dialog p:not(.eyebrow){font-size:15px}.learning-notes dd{font-size:13px}.place-dialog .eyebrow{font-size:10px}
}
@media(max-height:720px) and (min-width:761px){.introduction{top:44px}.brand-title .wordmark{width:382px}.brand-title{margin-bottom:19px}.dek{font-size:21px}.places{margin-top:24px;padding-top:12px}.place-art{height:83px}.place-art svg{width:69px;height:83px}}
@media(max-height:720px){.place-dialog p:not(.eyebrow){font-size:14px;line-height:1.5}.learning-notes dd{font-size:12px;line-height:1.5}.place-dialog .panel-footnote{font-size:11px!important}}
.page-hidden .material-glyph *{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.material-glyph *,.brand-foil{animation:none!important;transition:none!important}.is-awake .learning-thread{stroke-dashoffset:0}}
