/* The sculptural surround is a separate vector layer, never part of the glass. */
body{background:#080a0a;background-image:radial-gradient(ellipse at 50% 48%,#5d40221a,transparent 65%)}
header,main,footer{position:relative;z-index:1}header{gap:20px}header .edition{margin-left:auto}#playaView{background:#151812;border:1px solid #635435;color:#c1ad7d;padding:9px 12px;letter-spacing:.5px;font-size:9px;white-space:nowrap}#playaView:hover{background:#29281b}
.desert-scenery{position:fixed;inset:0;pointer-events:none;z-index:0;background:linear-gradient(#060a0e 0%,#101416 44%,#342c23 70%,#171613 73%,#252017 100%);opacity:.65}
.mountains{position:absolute;left:0;right:0;bottom:26%;height:14%;background:#131614;clip-path:polygon(0 78%,4% 62%,8% 67%,13% 38%,16% 48%,19% 32%,24% 66%,30% 82%,38% 86%,43% 76%,51% 85%,58% 66%,62% 75%,66% 49%,71% 58%,75% 28%,80% 44%,85% 52%,91% 25%,95% 57%,100% 69%,100% 100%,0 100%)}
.playa-ground{position:absolute;inset:74% 0 0;background:repeating-linear-gradient(172deg,transparent 0 51px,#a48a4e09 52px,transparent 53px 74px),radial-gradient(ellipse at 50% 0,#8c734522,transparent 65%)}
.sculpted-frame{position:absolute;z-index:4;pointer-events:none;left:-7.6%;top:-9.7%;width:115.2%;height:118.5%;filter:drop-shadow(1px 3px 2px #000b);object-fit:fill}
.mirror{background:linear-gradient(105deg,#11150f,#73603e 5%,#181d13 8%,#151910 85%,#8b7044 96%,#0b100a);box-shadow:0 28px 80px #000b,0 0 0 1px #4f462e,inset 0 0 0 5px #0a0b09,inset 0 0 0 7px #766440,inset 0 0 0 10px #171912}
.crest{height:54px;visibility:hidden}.corner{display:none}.frame-bottom{bottom:9px;font-size:5px;letter-spacing:2.5px}.mirror-caption{margin-top:48px}.glass{background:#101512}.glass-top{color:#cbb98166}.ritual-note{margin:24px 0;font-size:9px;line-height:1.8;color:#b1a58b;border-left:1px solid #8d7545;padding-left:13px}.mode-note p{color:#b9ae94}details a{color:#c4ad78;text-decoration:underline;text-underline-offset:3px}
main{padding-top:70px;padding-bottom:50px}.introduction{padding-bottom:25px}.scale-visitor{display:none}
body.playa-view header{height:65px;border:0}body.playa-view main{display:block;padding:40px 0 0;min-height:calc(100svh - 140px)}body.playa-view .introduction{display:none}body.playa-view .mirror-area{width:min(45svh,380px);margin:0 auto}body.playa-view .crest{height:0}body.playa-view .mirror-caption{margin-top:36px}body.playa-view .status{font-size:8px;max-width:360px;margin:8px auto 0}body.playa-view .controls{padding:0;margin:0}body.playa-view .controls>.eyebrow,body.playa-view .mode-note,body.playa-view .ritual-note,body.playa-view details{display:none}body.playa-view .modes{display:flex;justify-content:center;gap:30px;margin:35px auto 0;max-width:600px;padding:0 20px}body.playa-view .mode{width:auto;padding:10px 0;gap:12px}body.playa-view .mode b{font-size:24px}body.playa-view .mode small{display:none}body.playa-view .mode-mark{display:none}body.playa-view .session-tools{justify-content:center;margin:16px 0}body.playa-view footer{margin-top:25px}body.playa-view .desert-scenery{opacity:1;background:radial-gradient(ellipse at 60% 10%,#18252c,transparent 55%),linear-gradient(#03080d 0%,#101b21 47%,#67503a 68%,#29271f 70%,#1d1b16 100%)}body.playa-view .mountains{bottom:30%;height:12%;background:#1b211e}body.playa-view .playa-ground{inset:70% 0 0}body.playa-view .scale-visitor{display:block;position:absolute;bottom:19%;left:calc(50% - 270px);width:28px;height:103px;border-radius:40% 40% 8% 8%;background:#080d0c;transform:rotate(-4deg);box-shadow:55px 72px 20px -15px #0007}body.playa-view .scale-visitor:before{content:'';position:absolute;left:5px;top:-20px;width:18px;height:23px;border-radius:50%;background:#080d0c}body.playa-view .scale-visitor:after{content:'';position:absolute;top:80px;left:0;width:11px;height:62px;background:#080d0c;box-shadow:17px 0 #080d0c;transform:rotate(3deg)}
.mirror-area:fullscreen .sculpted-frame{height:118.5%}.mirror-area:fullscreen .mirror{margin:35px 0}
@media(min-width:521px) and (max-width:850px){body:not(.playa-view) .mirror-area{max-width:calc(100% - 35px);justify-self:center}}
@media(max-width:850px){header .edition{display:none}#playaView{margin-left:auto}.sculpted-frame{left:-7.6%;width:115.2%}.controls{padding-top:20px}main{padding-top:50px}.ritual-note{display:none}body.playa-view .scale-visitor{left:calc(50% - 220px)}}
@media(max-width:520px){main{padding-top:24px}.crest{height:40px}.mirror-area{width:93%}.mirror-caption{margin-top:39px}.controls{margin-top:16px}.frame-bottom{font-size:4px}.threshold p{font-size:24px}.threshold small{font-size:8px}body.playa-view main{padding-top:50px}body.playa-view .mirror-area{width:min(65vw,39svh)}body.playa-view .modes{gap:20px;margin-top:25px}body.playa-view .mode b{font-size:20px}body.playa-view .mode{gap:6px}body.playa-view .numeral{width:auto}body.playa-view .scale-visitor{left:10%;bottom:23%;transform:scale(.65);transform-origin:bottom}body.playa-view .threshold{inset:25% 0 6%}body.playa-view .threshold p{font-size:19px;margin:10px 0 14px}body.playa-view .threshold-symbol{font-size:28px}body.playa-view .primary{font-size:9px;padding:10px}body.playa-view .primary span{margin-left:9px}body.playa-view .text-button{font-size:8px;padding:12px 5px}body.playa-view .threshold small{font-size:6px}body.playa-view .mirror-caption{font-size:5px;gap:8px;letter-spacing:.5px}body.playa-view .status{font-size:7px}body.playa-view .session-tools button{font-size:8px}}

/* Reference revision: a tall gilt looking glass, with a carved shell pediment. */
.mirror-area{width:100%;max-width:420px;justify-self:center}
.mirror{aspect-ratio:9/16;padding:0;background:none;box-shadow:none;border-radius:0;filter:drop-shadow(0 18px 24px #0009)}
.sculpted-frame{inset:0;width:100%;height:100%;object-fit:fill;filter:drop-shadow(1px 2px 1px #0009)}
.glass{position:absolute;inset:11.4% 16.4% 10.3%;aspect-ratio:auto;border-radius:50% 50% 30% 30% / 21% 21% 5% 5%;clip-path:url(#gilt-aperture);box-shadow:inset 0 0 24px #000}
.beading,.frame-bottom{display:none}.crest{height:12px}.mirror-caption{margin-top:12px}.glass-top{font-size:6px;letter-spacing:2px}.threshold{inset:25% 0 7%}.threshold p{font-size:24px}.primary{padding:12px 14px}.primary span{margin-left:12px}.threshold small{font-size:7px}
.glass canvas{object-fit:cover;object-position:center}
body.playa-view .mirror-area{width:min(34svh,360px);max-width:none}body.playa-view .mirror-caption{margin-top:8px}body.playa-view .modes{margin-top:24px}body.playa-view .threshold p{font-size:20px;margin:12px 0 17px}body.playa-view .threshold-symbol{font-size:28px}body.playa-view .primary{padding:10px;font-size:9px}body.playa-view .primary span{margin-left:6px}body.playa-view .text-button{font-size:8px;padding:13px 5px}body.playa-view .threshold small{font-size:6px}
.mirror-area:fullscreen .mirror{height:min(78svh,1000px);width:auto;aspect-ratio:9/16;margin:0 auto}.mirror-area:fullscreen .sculpted-frame{height:100%}.mirror-area:fullscreen .glass{height:auto;aspect-ratio:auto}
@media(max-width:850px){.sculpted-frame{left:0;width:100%}body:not(.playa-view) .mirror-area{max-width:360px}.threshold p{font-size:21px}.threshold-symbol{font-size:30px}.primary{font-size:9px}.text-button{font-size:9px}}
@media(max-width:520px){.mirror-area{width:100%;max-width:350px}.crest{height:8px}.mirror-caption{margin-top:8px}body.playa-view .mirror-area{width:min(73vw,34svh)}body.playa-view .glass-top{font-size:5px}.threshold small{font-size:6px}.live-label{font-size:5px;letter-spacing:1px}.threshold p{font-size:23px}.glass-top{top:15%}}
