/* Review v2: the photographic room continues behind walnut pearl glass. */
:root{--ivory:#fff1df;--gold:#edcba6;--walnut:#805138}
body{background:#6a351a;isolation:isolate}
.room-backdrop{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.backdrop-stage{position:absolute;left:50%;top:50%;width:max(100vw,177.7778vh);height:max(56.25vw,100vh);transform:translate(-50%,-50%)}
.backdrop-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}
.backdrop-original{mask:url('assets/room-preserve-mask.svg') 0 0/100% 100% no-repeat}
main{max-width:none;padding-bottom:44px}
.preview-note{position:absolute;z-index:5;right:26px;top:18px;padding:5px 10px;font-size:10px;color:#f9dfc5;background:#51311a33;border:1px solid #eed2b134;border-radius:10px;backdrop-filter:blur(6px)}
.hall{background:transparent;overflow:visible;isolation:auto}
.room-clean,.room-original{display:none}
header{top:30px;height:110px;text-align:left}
.church-name{position:absolute;left:74px;top:0;width:370px;height:76px;margin:0;background:linear-gradient(110deg,#fff9ed 5%,#f1ca91 35%,#ffedc9 55%,#d8a565 74%,#fff4de);filter:drop-shadow(0 1px 1px #41200c) drop-shadow(0 0 5px #edb65c55)}
header h1{position:absolute;left:50%;top:22px;transform:translateX(-50%);font-size:36px;color:#fff4df;letter-spacing:.08em}
.screen button>img{filter:none}
.frame{filter:none}
.play-disc{width:60px;height:60px;font-size:35px;border:1px solid #ffe8d3c2;background:radial-gradient(ellipse at 33% 18%,#ead7c8ce 0%,#be987cc9 19%,#8e5b3cd9 45%,#643b26d9 70%,#bd8a63da 100%);box-shadow:inset 0 1px 4px #fff4e6d1,inset 0 -3px 6px #3e1f1780,0 0 14px #d1a17a38,0 5px 12px #321c1566;backdrop-filter:blur(9px);color:#fff4e9}
.watch-word{top:calc(50% + 43px);font-size:18px;color:#fff3df}
.viewing{position:relative;width:calc(100% - 84px);max-width:1280px;margin:-12px auto 0;padding:28px 32px 32px;border:1px solid #fff3dfdb;border-radius:34px 9px 34px 9px;background:linear-gradient(125deg,rgba(241,220,198,.15) 0%,rgba(186,143,111,.13) 32%,rgba(125,79,52,.15) 61%,rgba(217,181,150,.15) 100%);box-shadow:inset 0 0 3px #fff6e478,0 0 3px #fff3df9c,0 0 13px #ffedcb38,0 16px 48px #321a1238;backdrop-filter:blur(2px) saturate(1.03);-webkit-backdrop-filter:blur(2px) saturate(1.03)}
.viewing::before{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:linear-gradient(116deg,transparent 35%,#fff1de05 48%,transparent 62%)}
.now{border-bottom-color:#ffe8d550;gap:24px}
h2{color:#fff4e7;text-shadow:0 1px 3px #35180ea8}
.eyebrow,.catalog-heading span,.card small,footer,.mini-controls span,.player-status{color:#ffe6cc;text-shadow:0 1px 3px #3b1e13a3}
.view-actions>*,.tabs button,.mini-controls button,input{color:#fff0df;border:1px solid #f4d2b59c;background:linear-gradient(135deg,#b18b6e70 0%,#774d34a3 44%,#543422ab 72%,#a5765459 100%);box-shadow:inset 0 0 2px #fff1dd9c,0 0 2px #fff0d99c,0 0 8px #ffe3bd38,0 3px 8px #47281829;text-shadow:0 1px 2px #341b14b8;backdrop-filter:blur(8px)}
.tabs button[aria-pressed=true]{color:#fff4e8;border-color:#ffe8d4;background:linear-gradient(140deg,#c6a388ab,#976d4faa 36%,#70452eae 74%,#c2926e91);box-shadow:inset 0 0 3px #fff2e5c0,0 0 3px #fff2dd9c,0 0 10px #ffe3bd40}
.tabs button:hover,.view-actions>*:hover,.mini-controls button:hover{border-color:#ffefdc;box-shadow:inset 0 0 3px #fff4e6c9,0 0 3px #fff3dfbb,0 0 11px #ffe6bd50}
.mini-controls #toggle-play{width:38px;height:38px;min-height:38px;border-radius:50%;font-size:22px;background:radial-gradient(ellipse at 33% 18%,#e2cbb8b0,#a87955bb 26%,#72452dd9 65%,#ba8359b3);box-shadow:inset 0 1px 4px #fff4dca6,0 0 8px #d5a37738}
.mini-controls button[aria-pressed=true]{border-color:#f9ddbf;color:#fff4df}
input::placeholder{color:#ead3bc}
.mini-track{left:16px;right:16px;background:linear-gradient(90deg,#e9d2b89c,#c1a17b50)}
.mini-pearl{width:32px;height:32px;top:8px;left:calc((100% - 32px) * var(--ratio));box-shadow:0 0 8px #edb88645,0 4px 5px -3px #39231888}
.mini-pearl span{font-size:8px;color:#fff6ed;text-shadow:0 1px 2px #543725}
.mini-end{right:12px;top:20px;width:8px;height:8px;background:radial-gradient(ellipse at 35% 25%,#f3e2cf,#c79971 42%,#8e5a37 90%);box-shadow:0 0 7px #edba8c70}
.mini-timeline:has(input:focus-visible){outline-color:#ffe8d1}
.card{background:linear-gradient(145deg,#c8a38538,#68412d5c);border-color:#efcfaf70;box-shadow:inset 0 1px 1px #fff2df6b,0 5px 15px #4124171a;color:#fff2df}
.card[aria-pressed=true]{outline-color:#ffe4c8}
.card span{text-shadow:0 1px 3px #391d16b3}
footer{color:#efd4b8}
@media(min-width:1600px){.hall{max-width:1700px;margin:auto}}
@media(max-width:800px){.viewing{width:calc(100% - 32px);padding:22px;border-radius:27px 8px 27px 8px}.now{gap:16px}.cards{gap:14px}}
@media(max-width:650px){.backdrop-stage{width:100%;height:100%;transform:none;left:0;top:0}.backdrop-clean{object-fit:cover!important}.backdrop-original{display:none}.hall{background:transparent;height:440px!important}header{top:15px;width:100%;height:82px}.church-name{left:24px;top:0;width:234px!important;height:49px!important}header h1{left:25px;top:53px;transform:none;font-size:24px}.preview-note{right:12px;top:15px;font-size:8px;padding:4px 7px;max-width:76px;text-align:center}.screen{background:#100b08}.play-disc{width:48px;height:48px;font-size:29px}.watch-word{font-size:15px;top:calc(50% + 36px)}.viewing{margin:0 auto}.mini-controls{gap:8px}.mini-controls #toggle-play{width:36px;height:36px;min-height:36px}.mini-player{margin-bottom:20px}.card span{font-size:14px;padding:10px}.mini-controls button{background-color:#70472b3d}.tabs button{padding:12px 16px}}

.preview-note{display:none}
@media(max-width:650px){.screen{left:30px;top:122px;width:calc(100% - 60px);height:266px;border:0;border-radius:0;box-shadow:none}.frame{display:block;left:30px;top:122px;width:1536px;height:864px;max-width:none}.screen:fullscreen{left:0;top:0;width:100vw;height:100vh}.viewing{backdrop-filter:blur(2px) saturate(1.03);-webkit-backdrop-filter:blur(2px) saturate(1.03)}}

/* A bounded catalogue keeps the hall page compact. */
.cards{height:min(480px,60svh);min-height:240px;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#d5b08b #68462b24;grid-auto-rows:max-content;align-content:start;padding:12px;border:1px solid #f6dfc383;border-radius:22px 7px 22px 7px;background:linear-gradient(130deg,#c9aa872b,#67432929);box-shadow:inset 0 1px 2px #fff2db55,inset 0 -1px 3px #442a191a;-webkit-overflow-scrolling:touch}.cards:focus-visible{outline:2px solid #ffe9cc;outline-offset:4px}.cards::-webkit-scrollbar{width:7px}.cards::-webkit-scrollbar-track{background:#6e452524;border-radius:8px}.cards::-webkit-scrollbar-thumb{background:linear-gradient(#e5c49f,#aa7954);border:1px solid #f8dfbd70;border-radius:8px}.card{min-width:0;min-height:0}.cards:empty{display:none}@media(max-width:650px){.cards{height:390px;max-height:60svh;min-height:240px;gap:12px;padding:9px;border-radius:18px 5px 18px 5px}.catalog-heading span{font-size:12px}}

/* Review v3: readable pearl timer and the same material on both play buttons. */
.hall{height:var(--hall-height)!important;aspect-ratio:auto}
.screen iframe{inset:0;width:100%;height:100%}
.screen:fullscreen{left:0!important;top:0!important;width:100vw!important;height:100vh!important}
.screen.is-portrait button>img{object-fit:cover}
.mini-controls #toggle-play,.play-disc{background-color:transparent;background-image:var(--walnut-pearl);background-size:100% 100%;border:0;color:#fff9f0;box-shadow:0 0 0 1px #fff0d696,0 0 4px #fff1dd75,0 0 11px #ffe2b838,0 3px 8px #40271655;text-shadow:0 1px 2px #412719;backdrop-filter:none}
.mini-controls #toggle-play{width:52px;height:52px;min-height:52px;flex-shrink:0;font-size:29px}
.play-disc{width:64px;height:64px;font-size:38px}
.watch-word{top:calc(50% + 43px)}
.mini-timeline{height:88px;margin:10px 14px 8px}
.mini-track{display:none}
.mini-pearl{top:16px;left:calc((100% - 56px) * var(--ratio));width:56px;height:56px;isolation:isolate;box-shadow:0 0 12px #edb88638,0 4px 6px -3px #39231888}
.mini-pearl span{font-size:12px;font-weight:650;color:#fffaf1;text-shadow:0 1px 2px #332016,0 0 3px #332016}
.mini-end{right:22px;top:38px;width:12px;height:12px}
.mini-pearl::before,.mini-pearl::after{content:'';position:absolute;inset:-3px;z-index:-1;border:1px solid #fff0db70;border-radius:46% 54% 49% 51% / 52% 47% 53% 48%;background:radial-gradient(ellipse,#e9c59f00 45%,#e9c59f16 75%,#fff1d52b);opacity:0;pointer-events:none}
.mini-timeline[data-state=playing] .mini-pearl::before,.mini-timeline[data-state=playing] .mini-pearl::after,.mini-timeline[data-state=connecting] .mini-pearl::before,.mini-timeline[data-state=connecting] .mini-pearl::after{animation:walnut-wave 3.8s ease-out infinite}
.mini-timeline[data-state=playing] .mini-pearl::after,.mini-timeline[data-state=connecting] .mini-pearl::after{animation-delay:-1.9s}
.mini-timeline.is-joined .mini-end{opacity:0}
.mini-timeline[data-state=joined] .mini-pearl::before,.mini-timeline[data-state=joined] .mini-pearl::after{animation:walnut-wave 3.8s ease-out 1}
.mini-timeline[data-state=joined] .mini-pearl::after{animation-delay:.7s}
@keyframes walnut-wave{0%{transform:scale(.91) rotate(-7deg);opacity:0}18%{opacity:.68}100%{transform:scale(1.7) rotate(9deg);opacity:0}}
.mini-timeline input{height:88px;appearance:none;-webkit-appearance:none;background:transparent;border:0;box-shadow:none}
.mini-timeline input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:56px;height:56px;background:transparent;border:0}
.mini-timeline input::-moz-range-thumb{width:56px;height:56px;background:transparent;border:0}
.mini-timeline input::-webkit-slider-runnable-track{height:56px;background:transparent}
.mini-timeline input::-moz-range-track{background:transparent}
@media(max-width:400px){.mini-controls{display:grid;grid-template-columns:52px 1fr auto;gap:10px}.mini-controls #native-controls{grid-column:1/-1;margin:0;justify-self:end;min-height:36px;padding:7px 12px}.mini-controls #duration{font-size:13px}}
@media(prefers-reduced-motion:reduce){.mini-pearl::before,.mini-pearl::after{animation:none!important}.mini-timeline[data-state=playing] .mini-pearl,.mini-timeline[data-state=connecting] .mini-pearl{box-shadow:0 0 16px #f2c99b69}}

/* The owner replaced the gold frame with the room's soft architectural light. */
.frame{display:none}
.screen{overflow:visible;border:0;border-radius:3px;box-shadow:0 8px 24px #28170f66}
.screen::before,.screen::after{content:'';position:absolute;inset:-4px;z-index:3;pointer-events:none;border:1px solid #fff3dcbb;border-radius:4px;background:none;box-shadow:none}
.screen::before{filter:blur(4px);opacity:.65;transform:scale(1.005)}
.screen::after{border-width:1.5px;border-color:#fff5e3cc;box-shadow:0 0 3px #fff4df80,inset 0 0 2px #fff5df30}
.screen iframe,.screen button{border-radius:3px}
.screen button{overflow:hidden}
.screen button:focus-visible{outline:1px dashed #fff3df;outline-offset:9px}
.screen:fullscreen::before,.screen:fullscreen::after{display:none}
.screen::before,.screen::after{transition:opacity 1.4s ease,filter 1.4s ease,box-shadow 1.4s ease}
.screen::before{opacity:.2;filter:blur(5px)}
.screen::after{opacity:.54;box-shadow:0 0 2px #fff4df50}
.screen[data-state=playing]::before{opacity:.75;filter:blur(6px);box-shadow:0 0 10px 2px #ffefd14a}
.screen[data-state=playing]::after{opacity:1;box-shadow:0 0 4px #fff4df88,inset 0 0 3px #fff5df30}
.screen[data-state=connecting]::before{opacity:.43}
.screen[data-state=connecting]::after{opacity:.78}
@media(prefers-reduced-motion:reduce){.screen::before,.screen::after{transition:none}}
.hall-navigation{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 24px;padding-bottom:20px;border-bottom:1px solid #ffe8d533}
.hall-navigation a{display:inline-flex;align-items:center;min-height:44px;padding:9px 16px;color:#fff0df;text-decoration:none;font-size:13px;border:1px solid #f4d2b57c;border-radius:20px 4px 20px 4px;background:linear-gradient(135deg,#b18b6e40,#774d3478 44%,#54342270);box-shadow:inset 0 0 2px #fff1dd80,0 0 2px #fff0d996,0 0 8px #ffe3bd38;text-shadow:0 1px 2px #341b14b8}
html[data-effects=less] .mini-pearl::before,html[data-effects=less] .mini-pearl::after{animation:none!important}