/* The signal room is an instrument, with channels to tune into */
.fountain-message{border:5px solid #8597ac;box-shadow:0 0 0 5px #172335,12px 12px #101a2a99;background:#243348f5;padding:25px 26px}
.fountain-message>p:first-child{display:flex;justify-content:space-between;gap:12px;line-height:1.8}
.fountain-message>p:first-child:after{content:'● ONLINE';font-size:8px;color:#b2ccaf;white-space:nowrap}
.fountain-message h2{font-size:clamp(21px,2.2vw,32px)}
.signal-display{background:#121f2b;border:4px solid #53697b;padding:16px;margin:19px 0;color:#a7c4c5;box-shadow:inset 3px 3px #0b1621}
.signal-display__top{display:flex;justify-content:space-between;font:8px/1.6 var(--px);gap:10px}
.signal-wave{height:32px;display:flex;align-items:center;justify-content:space-between;gap:5px;margin:13px 0}
.signal-wave i{width:5px;height:var(--height);background:#a7c4c5;transform-origin:center;animation:signal-breathe 3.8s ease-in-out infinite;animation-delay:var(--delay)}
@keyframes signal-breathe{50%{scale:1 .45;opacity:.55}}
.signal-display__hint{font:11px/1.5 ui-monospace,Consolas,monospace;color:#8da7b6;margin:0}
.contact-lines{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:16px;border:0}
.contact-lines a{display:grid;grid-template-columns:30px minmax(0,1fr);gap:6px 10px;padding:13px 10px;background:#172637;border:2px solid #4e667b;box-shadow:3px 3px #101c29;align-items:center;transition:background .15s,translate .15s;min-width:0}
.contact-lines a:first-child{grid-column:1/-1}
.contact-lines a:hover,.contact-lines a:focus-visible{background:#354c60;translate:0 -2px;border-color:#aac3cd}
.contact-lines a span{font-size:7px;color:#d0d9e3;grid-column:2}
.contact-lines a b{font:10px/1.6 ui-monospace,Consolas,monospace;grid-column:2;overflow-wrap:anywhere;color:#a7bbc9}
.channel-icon{grid-column:1;grid-row:1/3;width:26px;height:26px;color:var(--channel,#a9c3d2);shape-rendering:crispEdges}
.radio-label{display:flex;justify-content:space-between;align-items:center;margin-top:21px;color:#9aabba;font:8px var(--px)}
.radio-dial{width:23px;height:23px;border:5px solid #9aabba;box-shadow:3px 3px #101c29;position:relative;background:#263b50}
.radio-dial:after{content:'';position:absolute;width:3px;height:10px;background:#e3e3cc;left:5px;top:-3px}
.radio-grille{width:90px;height:22px;background:repeating-linear-gradient(0deg,#101c29 0 3px,transparent 3px 6px)}
.transition>div:not(.transition-canvas){display:none!important}.transition .transition__label{display:none!important}
.transition-canvas{display:block;width:100%;height:100%;image-rendering:pixelated}
.landmark__art svg{width:100%;height:100%;overflow:visible;shape-rendering:crispEdges}
.landmark__art.illustrated:before,.landmark__art.illustrated:after{content:none}
.landmark:hover .window-light,.landmark.is-near .window-light{fill:#ffe0a3}
.landmark:hover .smoke,.landmark.is-near .smoke{animation:chimney 2.6s steps(4) infinite}
@keyframes chimney{to{translate:3px -9px;opacity:0}}
.landmark:hover .camp-flame,.landmark.is-near .camp-flame{animation:campfire 1s steps(3) infinite;transform-origin:50% 90%}
@keyframes campfire{50%{scale:.95 1.12}}
@media(max-width:600px){.fountain-message{padding:22px 15px}.fountain-message>p:first-child{font-size:8px}.fountain-message>p:first-child:after{font-size:6px}.fountain-message h2{font-size:22px}.signal-display{padding:12px}.contact-lines{gap:8px}.contact-lines a{padding:12px 8px;grid-template-columns:23px minmax(0,1fr);gap:6px}.channel-icon{width:22px;height:22px}.contact-lines a span{font-size:6px}.contact-lines a b{font-size:10px}.radio-label{font-size:7px}}
@media(prefers-reduced-motion:reduce){.signal-wave i,.smoke,.camp-flame{animation:none!important}}
