/* Places are distinct: a portal, an instrument, an open pavilion. */
.place-label{max-width:150px;min-height:30px}
.pavilion-door{transition:fill-opacity .8s,stroke .8s}.pavilion-grains{transition:transform 1s,opacity 1s;opacity:.5}
.is-awake .pavilion-door{fill-opacity:.45;stroke:#d1eee0}.is-awake .pavilion-grains{transform:translateY(-5px);opacity:1}
.is-awake .pavilion-structure{filter:drop-shadow(0 0 2px #dfbf7b45)}
.effects-row{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid #c2b17c25;padding-top:12px;margin-top:13px}
.effects-row button{background:transparent;color:#cbbf9e;font:12px Palatino,Georgia,serif;min-height:34px;padding:5px 8px;border:1px solid transparent;border-radius:4px}
#effects-toggle{display:flex;gap:17px;align-items:center;padding-left:3px}#effects-state{font-size:11px;color:#8daab0;min-width:16px}#effects-toggle[aria-pressed="true"] #effects-state{color:#a6e2d6}
#effects-preview{border-color:#c2b17c35;min-width:36px}#effects-preview:hover{background:#c2b17c0d}
.sound-panel{transform-origin:top right}.track{transition:background .25s,border-color .25s,color .25s}.instrument-button,.sound-toggle,.play-button{transition:color .3s,background .3s,border-color .3s}
dialog[data-ui-state="opening"]::backdrop{animation:room-arrive .85s cubic-bezier(.16,1,.3,1) both}
dialog[data-ui-state="closing"]::backdrop{animation:room-leave .65s ease both}
@keyframes room-arrive{from{opacity:0}to{opacity:1}}
@keyframes room-leave{from{opacity:1}to{opacity:0}}
.work-entry+.work-entry{border-top:1px solid #b6a67b2c;padding-top:20px;margin-top:22px}.work-kind{font-size:10px;font-weight:400;line-height:1.5;text-transform:uppercase;letter-spacing:.1em;color:#bca77c;margin:0 0 12px}
.work-entry h3{font:400 25px Palatino,Georgia,serif;color:#e2d5b4;margin:9px 0 10px}
.work-link{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0!important;padding:13px 2px;color:#e3c78d!important;text-decoration:none;border-top:1px solid #b4aa7a18;font-size:17px;transition:color .3s,background .3s}
.work-link:hover{background:#b8d5cc06;color:#bde8dd!important}.work-link small{display:block;color:#9db8bf;font-size:12px;margin-top:5px}
@media(min-width:900px){
 .place-dialog[data-place="together"]{width:420px;margin:auto auto auto 6.5%;box-shadow:0 25px 70px #0006}
 .place-dialog[data-place="together"]::backdrop{background:#020d1324;backdrop-filter:none}
}
@media(max-width:760px){.place-label{font-size:14px;max-width:none}.effects-row{gap:8px}}
html[data-motion="off"] dialog::backdrop{animation:none!important}
@media(prefers-reduced-motion:reduce){dialog::backdrop{animation:none!important}}

/* No descriptive copy is introduced before it is discussed and approved. */
.introduction .places{margin-top:38px}
.place-dialog{padding-top:30px;padding-bottom:22px}
.place-dialog h2{margin-bottom:18px}
#place-content:empty{display:none}
.place-dialog[data-place="together"],.place-dialog[data-place="learning"]{width:min(420px,calc(100% - 36px))}
#motion-label{display:inline-grid!important;min-width:43px;text-align:left;position:relative}
#motion-label>span{grid-area:1/1;transition:opacity .55s ease,transform .7s cubic-bezier(.16,1,.3,1)}
.still-word{opacity:0;transform:translateY(5px)}
#motion[aria-pressed="false"] .motion-word{opacity:0;transform:translateY(-5px)}
#motion[aria-pressed="false"] .still-word{opacity:1;transform:translateY(0)}
#motion>svg{transition:transform 1.15s cubic-bezier(.4,0,.2,1),opacity .8s ease}
#motion[aria-pressed="false"]>svg{transform:rotate(-18deg);opacity:.55}
@media(prefers-reduced-motion:reduce){#motion-label>span,#motion>svg{transition:none!important;transform:none!important}}
