/* Keep the wall continuous around narrow content; the rooms remain exhibits. */
html,body{background:#101112!important}
body{background-image:none!important}
#motion,#film,#youtube,#journey{background:transparent!important}
#journey::before{background:transparent!important}
/* Full-width atmospheres fade into charcoal at each end. */
#uoalive{background:linear-gradient(to bottom,#101112,transparent 14%,transparent 86%,#101112),radial-gradient(ellipse at 75% 48%,#1a2642 0%,#101112 75%)!important}
#photography{background:linear-gradient(to bottom,#101112,transparent 17%,transparent 83%,#101112),radial-gradient(ellipse at 15% 50%,#18292e 0%,#101112 72%)!important}
#writing{background:linear-gradient(to bottom,#101112,transparent 16%,transparent 84%,#101112),radial-gradient(ellipse at 20% 50%,#25212e 0%,#101112 72%)!important}
#twitch{background:linear-gradient(to bottom,#101112,transparent 16%,transparent 84%,#101112),radial-gradient(ellipse at 80% 50%,#242135 0%,#101112 72%)!important}
main>section.exhibit{padding-top:clamp(52px,5vw,76px);padding-bottom:clamp(52px,5vw,76px)}
main>section.journey-exhibit{padding-top:55px;padding-bottom:55px}
main>section.machinima-exhibit,main>section.archive-exhibit{padding-bottom:55px}
.closing{padding-top:70px!important;padding-bottom:70px!important}
#film h2 .romance-word{color:#e46c71!important;text-shadow:none!important}

/* Section walls span the viewport, as on the live site. */
#motion,#film,#youtube,#journey,#machinima,#community,#tattoo{position:relative;isolation:isolate}
#motion::before,#film::before,#youtube::before,#journey::before,#machinima::before,#community::before,#tattoo::before{content:"";position:absolute;z-index:-1;inset:0 auto 0 50%;width:100vw;transform:translateX(-50%);pointer-events:none}
#motion::before,#youtube::before,#community::before{background:#1a1d1f!important}
#film::before,#machinima::before{background:#141719!important}
#journey::before{background:#1a1e20!important}
#tattoo::before{background:#181b1d!important}
#photography{background:#141719!important}
#writing{background:#1b1d20!important}
#curiosity{background:#141719!important}
#twitch{background:#172128!important}
#murlocs{background:#1b1e1d!important}
#recognition{background:#141719!important}
#cats{background:#1a1e20!important}

/* A centered pool of color gives each exhibition its own atmosphere. */
#motion::before{background:radial-gradient(ellipse 70% 52% at 50% 45%,#27323b 0%,#1a1d1f 75%)!important}
#film::before{background:radial-gradient(ellipse 70% 45% at 50% 42%,#382326 0%,#141719 75%)!important}
#youtube::before{background:radial-gradient(ellipse 70% 48% at 50% 44%,#26313a 0%,#1a1d1f 75%)!important}
#journey::before{background:radial-gradient(ellipse 70% 52% at 50% 45%,#26333a 0%,#1a1e20 75%)!important}
#machinima::before{background:radial-gradient(ellipse 70% 48% at 50% 44%,#292e3d 0%,#141719 75%)!important}
#community::before{background:radial-gradient(ellipse 70% 48% at 50% 45%,#273638 0%,#1a1d1f 75%)!important}
#tattoo::before{background:radial-gradient(ellipse 70% 50% at 50% 45%,#282b38 0%,#181b1d 75%)!important}
#uoalive{background:radial-gradient(ellipse 70% 60% at 50% 45%,#18233c 0%,#101112 78%)!important}
#photography{background:radial-gradient(ellipse 70% 48% at 50% 45%,#213137 0%,#141719 75%)!important}
#writing{background:radial-gradient(ellipse 70% 50% at 50% 45%,#302a3c 0%,#1b1d20 75%)!important}
#curiosity{background:radial-gradient(ellipse 70% 48% at 50% 45%,#23343b 0%,#141719 75%)!important}
#twitch{background:radial-gradient(ellipse 70% 58% at 50% 45%,#352a49 0%,#17161c 76%)!important}
#murlocs{background:radial-gradient(ellipse 70% 50% at 50% 45%,#27382f 0%,#1b1e1d 75%)!important}
#recognition{background:radial-gradient(ellipse 70% 48% at 50% 45%,#26313b 0%,#141719 75%)!important}
#cats{background:radial-gradient(ellipse 70% 55% at 50% 45%,#203840 0%,#1a1e20 75%)!important}
#welcome{background:radial-gradient(ellipse 70% 50% at 50% 40%,#1c3038 0%,#101112 75%)!important}
#gallery,.closing{position:relative;isolation:isolate;background:transparent!important}
#gallery::before,.closing::before{content:"";position:absolute;z-index:-1;inset:0 auto 0 50%;width:100vw;transform:translateX(-50%);pointer-events:none;background:radial-gradient(ellipse 70% 50% at 50% 45%,#1e2d33 0%,#101112 75%)}

#writing{background:radial-gradient(ellipse 70% 52% at 50% 45%,#3c2a50 0%,#1b1a20 76%)!important}
#writing .studio-room.writing-room h2 em{color:#70478b!important;text-shadow:none!important}
#film::before{background:radial-gradient(ellipse 70% 48% at 50% 43%,#48252a 0%,#141719 76%)!important}

/* Compact the four Switcher films on wide screens. */
@media(min-width:1101px){
  #machinima .switcher-film-wall{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-inline:45px}
  #machinima .switcher-film-wall .movie-image img{aspect-ratio:1.65;object-fit:contain;background:#151719}
  #machinima .switcher-film-wall .film-label>strong{font-size:clamp(23px,2vw,29px)}
  #machinima .switcher-wall-title{margin:42px 45px}
  #machinima .switcher-chamber{min-height:0;padding-bottom:100px}
  #machinima .switcher-chamber .chamber-destinations{margin-top:32px}
}

/* YouTube: a screening room within the gallery, with blue ink and a play motif. */
#youtube .channel-heading h2 em{color:#8ccfe3!important;text-shadow:0 0 24px #61b7d14d!important}
#youtube .channel-heading .button.blue{background:#246b87!important;border-color:#74b9d0!important;color:#fff!important}
#youtube .channel-heading .button.blue:hover{background:#3385a0!important}
#youtube .youtube-chamber .chamber-heading .eyebrow::before{content:'▶';display:inline-grid;place-items:center;width:27px;height:27px;margin-right:10px;border-radius:50%;background:#145a70;color:#fff;font-size:10px;vertical-align:middle}
#youtube .youtube-chamber .chamber-heading h3 em{color:#17647b!important}
#youtube .youtube-print .movie-image{border-color:#638b9b!important;box-shadow:0 9px 20px #12374330!important}
#youtube .youtube-print .film-kind{color:#235d70!important}
#youtube .youtube-print .film-watch{color:#07586f!important;font-weight:700}
#youtube .youtube-print .film-play{background:#12647c;color:#fff;border-color:#fff}
#youtube .youtube-print button:focus-visible{outline:3px solid #12647c;outline-offset:6px}

/* A smaller Murlocs room, with the title in its own green. */
#murlocs .murlocs-heading h2 em{color:#96d9a6!important;text-shadow:0 0 18px #5abf7d40!important}
#murlocs .murlocs-heading{margin-bottom:40px}
#murlocs .murlocs-room{width:100%;max-width:none;margin-inline:auto;min-height:0;padding-bottom:100px}
#murlocs .murlocs-room .chamber-heading{margin-top:38px;margin-bottom:35px}
#murlocs .murlocs-wall{gap:35px}
#murlocs .murlocs-feature{width:100%;max-width:480px;justify-self:center}
#murlocs .murlocs-cast{max-width:200px;margin-bottom:20px}
#murlocs .murlocs-extras{margin-top:30px}
@media(max-width:600px){#murlocs .murlocs-room{padding-bottom:90px}#murlocs .murlocs-wall{gap:30px}}

/* A compact YouTube screening room: black wall, red spotlights, and the play mark. */
#youtube .studio-room.youtube-chamber{max-width:1000px;margin-inline:auto;min-height:0;padding-bottom:105px;background:radial-gradient(ellipse at 50% 12%,#301014 0%,#0c0d0f 64%)!important;border-color:#4d3034!important;color:#f6f4f4!important;box-shadow:0 18px 45px #0007!important}
#youtube .youtube-chamber .chamber-heading .eyebrow::before{content:none}
#youtube .youtube-mark{display:inline-block;width:35px;height:25px;margin-right:12px;vertical-align:middle}
#youtube .youtube-chamber :is(h3,h3 em,strong,p,.eyebrow){color:#f4f1f1!important;text-shadow:none!important}
#youtube .youtube-chamber h3 em{color:#ff7980!important}
#youtube .studio-room.youtube-chamber .chamber-heading h3 em{color:#ff8f99!important;text-shadow:none!important}
#youtube .youtube-chamber .ceiling-rail{background:#7a1f2a!important;box-shadow:0 2px 9px #ff163d88!important}
#youtube .youtube-chamber .ceiling-rail i{background:linear-gradient(90deg,#25282b,#55565a,#222427)!important;box-shadow:0 4px 14px #ff153e55!important}
#youtube .youtube-chamber .ceiling-rail i::after{background:#ff2945!important;box-shadow:0 2px 9px 3px #ff123a99,0 10px 24px 5px #df002f55!important}
#youtube .youtube-chamber .ceiling-rail i span{background:linear-gradient(180deg,#ff25434d,#a9002a20 65%,transparent)!important}
#youtube .youtube-chamber .gallery-floor{background:linear-gradient(#25272a,#151618)!important;border-color:#5d3137!important}
#youtube .youtube-chamber .movie-image{background:#222426!important;border-color:#655054!important;box-shadow:0 9px 20px #0008!important}
#youtube .youtube-chamber .film-kind{color:#ffb1b8!important}
#youtube .youtube-chamber .film-watch,#youtube .youtube-chamber .chamber-destinations a{color:#ffa2aa!important}
#youtube .youtube-chamber .film-play{background:#e00024!important;border-color:#fff!important;color:#fff!important}
#youtube .youtube-chamber .youtube-prints{gap:25px;margin-inline:42px}
#youtube .youtube-chamber .youtube-print .film-label>strong{font-size:clamp(18px,1.7vw,23px)}
#youtube .review-ethos{border-top-color:#644046!important}
#youtube .review-ethos figure{border-left-color:#d34352!important}
@media(max-width:600px){#youtube .youtube-chamber{padding-bottom:90px}#youtube .youtube-chamber .youtube-prints{margin-inline:25px;gap:32px}#youtube .youtube-chamber .youtube-print .film-label>strong{font-size:23px}}

/* YouTube room: wider wall and centered, consistent play controls. */
#youtube .studio-room.youtube-chamber{width:100%;max-width:none}
#youtube .channel-heading .button.blue{background:#d80023!important;border-color:#ff5265!important;color:#fff!important}
#youtube .channel-heading .button.blue:hover{background:#ae001c!important}
#youtube .youtube-chamber .film-play{font-size:0;display:grid;place-items:center}
#youtube .youtube-chamber .film-play::after{content:"";display:block;width:11px;height:13px;margin-left:3px;background:#fff;clip-path:polygon(0 0,100% 50%,0 100%)}
#youtube .youtube-chamber .film-watch::after{content:"";display:inline-block;width:7px;height:9px;margin-left:7px;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}