/* THE ROOM · 1102f · SIGIL BEHIND THE ROOM
   The Sound Observatory runs behind the whole room (data-sky="page"): the seven sigils climb across the back wall, the galaxies drift,
   the fractals bloom, every kick of a playing song lands behind the chairs. The tufted leather frames it — full at the walls, opening
   in the middle like a skylight — the seat lights pool over it, and the words sit on smoked glass. Nothing plays until a song is tapped. */

html.hp-sky body { background: transparent; }
body:not(.in) #hp-sky { display: none; }                                  /* the tower stays the tower */
html.hp-sky #dust { mix-blend-mode: screen; }                              /* the seat lights pool over the sky instead of covering it */
html.hp-sky #room::before { opacity: .64;
  -webkit-mask-image: radial-gradient(ellipse 74% 64% at 50% 48%, rgba(0,0,0,.14) 0%, rgba(0,0,0,.4) 56%, #000 100%);
          mask-image: radial-gradient(ellipse 74% 64% at 50% 48%, rgba(0,0,0,.14) 0%, rgba(0,0,0,.4) 56%, #000 100%); }
html.hp-sky header, html.hp-sky footer { background-color: rgba(7,6,6,.66) !important; }
html.hp-sky #hp-soundtrack { position: relative; z-index: 0; }

/* the words on smoked glass */
html.hp-sky .m .txt { background: rgba(8,8,10,.74); }
html.hp-sky .m.brian .txt { background: linear-gradient(rgba(225,6,0,.12), rgba(225,6,0,.12)), rgba(10,7,7,.76); }
html.hp-sky .m.sys .txt { background: none; text-shadow: 0 1px 8px #000, 0 0 2px #000; }
html.hp-sky .card { background: rgba(10,10,12,.72); }
html.hp-sky .say textarea { background: rgba(10,10,12,.78); }
html.hp-sky .chips button, html.hp-sky .faces { background: rgba(5,5,6,.6); }
html.hp-sky .m .who, html.hp-sky .face h3, html.hp-sky .face .lede, html.hp-sky .face .kick, html.hp-sky .lg-bar h4 { text-shadow: 0 1px 10px #000, 0 0 2px #000; }

@media (max-width: 640px) {
  html.hp-sky #room::before { -webkit-mask-image: radial-gradient(ellipse 90% 60% at 50% 50%, rgba(0,0,0,.18) 0%, rgba(0,0,0,.45) 60%, #000 100%);
                                      mask-image: radial-gradient(ellipse 90% 60% at 50% 50%, rgba(0,0,0,.18) 0%, rgba(0,0,0,.45) 60%, #000 100%); }
}
