@font-face{font-family:"Museum Gujarati";src:url('./assets/fonts/NotoSerifGujarati.ttf') format('truetype');font-weight:100 900;font-display:swap}
:root{--ivory:#f5e7cb;--brass:#eac18b;--faded:#b5a489;--serif:Baskerville,"Iowan Old Style",Georgia,serif;--label:"Gill Sans","Trebuchet MS",Arial,sans-serif;background:#181510;color:var(--ivory);font-family:var(--serif);font-synthesis:none}
html:lang(gu){--serif:"Museum Gujarati","Gujarati Sangam MN",serif;--label:"Gujarati Sangam MN","Museum Gujarati",sans-serif}
*{box-sizing:border-box}body,h1,h2,p{margin:0}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button:focus-visible{outline:2px solid #f5d49e;outline-offset:2px}.chamber{height:100svh;min-height:340px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden;position:relative;isolation:isolate;background:radial-gradient(ellipse at 25% -14%,#68523842,transparent 56%),radial-gradient(ellipse at 50% 32%,#56423050,transparent 71%),linear-gradient(104deg,#221d18,#2d251d 44%,#1a1916 79%,#191814)}
.chamber:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(94deg,#ffe6bd04 0 1px,transparent 2px 7px),linear-gradient(0deg,#100f0ce8,transparent 36%);opacity:.8}
header{position:relative;z-index:3;margin:0 4.8%;padding:clamp(13px,2.7vh,33px) 0 14px;border-bottom:1px solid #ae94704d;display:flex;align-items:center;justify-content:space-between;gap:12px}
.title{display:flex;gap:clamp(14px,1.6vw,34px);align-items:baseline}h1{font-weight:400;font-size:clamp(31px,3.1vw,68px);line-height:1.12;letter-spacing:-.045em}.title span{font:clamp(14px,1.1vw,22px) var(--label);color:var(--faded)}
nav{display:flex;align-items:center;gap:clamp(4px,.75vw,16px)}nav button{padding:0 7px;min-height:45px;min-width:44px;font:clamp(16px,1.1vw,24px) var(--label);color:#c6b99e}nav button[lang=en]{font-family:"Gill Sans","Trebuchet MS",sans-serif}nav button[lang=gu]{font-family:"Museum Gujarati",serif}nav button[aria-pressed=true][lang]{color:var(--ivory);text-decoration:underline;text-underline-offset:7px}
.speaker{border-left:1px solid #ab936b52;margin-left:4px;padding:0 9px 0 18px}.speakerIcon{width:28px;height:23px;position:relative;display:inline-block;vertical-align:middle}.speakerIcon:before{content:"";position:absolute;left:1px;top:4px;width:15px;height:16px;background:currentColor;clip-path:polygon(0 33%,35% 33%,90% 0,90% 100%,35% 67%,0 67%)}.speakerIcon i,.speakerIcon i:after{display:block;border:1.6px solid currentColor;border-left:0;border-block-color:transparent;border-radius:50%;position:absolute;right:7px;top:5px;width:9px;height:14px}.speakerIcon i:after{content:"";right:-6px;top:-4px;width:13px;height:18px}.speakerIcon.muted i{border:none;background:currentColor;width:1.6px;height:11px;top:7px;right:4px;transform:rotate(-40deg)}.speakerIcon.muted i:after{width:1.6px;height:11px;top:0;right:0;background:currentColor;transform:rotate(80deg);border:0}
.installation{position:relative;min-height:0;overflow:hidden}.rack{height:100%;width:min(91%,1750px);margin:auto;position:relative;display:flex;justify-content:space-evenly;align-items:center;gap:3%}
.instrument{position:relative;display:block;flex:none;width:var(--size);aspect-ratio:1;padding:0;border-radius:50%;outline-offset:6px;user-select:none}.low{--size:min(31vw,47vh);--angle:-4deg}.middle{--size:min(26vw,39vh);--angle:2deg}.high{--size:min(21vw,31vh);--angle:-1.5deg}.low{top:3%}.middle{top:-3%}.high{top:-7%}.instrument[aria-disabled=true]{cursor:default}
.hanging,.metal,.metal img{position:absolute;inset:0;width:100%;height:100%;display:block}.hanging{transform:rotate(var(--angle));transform-origin:50% 10%}.cord{position:absolute;bottom:87%;height:100vh;width:clamp(2px,.25vw,5px);background:repeating-linear-gradient(42deg,#332a20 0 2px,#927d58 2.5px,#4d3c29 4px);box-shadow:1px 1px 1px #080703;pointer-events:none}.c1{left:26%;transform:rotate(3deg);transform-origin:bottom}.c2{right:26%;transform:rotate(-3deg);transform-origin:bottom}
.metal{filter:drop-shadow(7px 16px 8px #0806037a) brightness(.92);transition:filter .42s}.metal img{pointer-events:none}.eyelet{position:absolute;top:10.7%;width:2.1%;height:3.2%;min-width:2px;border-radius:50%;background:linear-gradient(110deg,#3f3524,#18130e 57%,#867452);box-shadow:0 1px 1px #d8b880}.e1{left:25.8%}.e2{right:25.8%}.eyelet:before{content:"";position:absolute;bottom:37%;left:30%;width:35%;height:132%;border-radius:4px;background:repeating-linear-gradient(45deg,#463825 0 2px,#a08c69 2px 3px)}
.wave{position:absolute;inset:2.2%;border:3px solid #ffdc9d;border-radius:50%;animation:wave .575s ease-out both;pointer-events:none}
.instrument[data-lit=true] .metal{filter:drop-shadow(0 0 20px #d6a54d90) brightness(1.55);transition-duration:.045s}.instrument[data-lit=true] .hanging{animation:strike .55s ease-out}.instrument:active .metal{filter:brightness(1.35)}
@keyframes wave{from{opacity:1;transform:scale(.96)}to{opacity:0;transform:scale(1.21)}}@keyframes strike{0%{transform:rotate(var(--angle)) scale(.98)}40%{transform:rotate(calc(var(--angle) + 1.2deg)) scale(1.01)}100%{transform:rotate(var(--angle))}}
.caption{position:relative;z-index:2;padding:0 5% clamp(21px,5vh,70px);text-align:center;min-height:18vh;display:flex;flex-direction:column;align-items:center;gap:clamp(8px,1.2vh,18px);justify-content:flex-start}.caption h2{font-size:clamp(36px,4.5vw,93px);font-weight:400;line-height:1.12;letter-spacing:-.045em;text-wrap:balance}.caption p{font:clamp(16px,1.25vw,26px)/1.45 var(--label);color:#c9bca5;max-width:55ch}.beats{display:flex;align-items:center;justify-content:center;gap:12px;min-height:28px}.beats i{width:12px;height:12px;border:1px solid #b39c77;border-radius:50%}.beats .marked{background:var(--brass);box-shadow:0 0 6px #d5ad8140}
html:lang(gu) h1,html:lang(gu) h2{letter-spacing:0;line-height:1.4}html:lang(gu) .caption h2{font-size:clamp(29px,3.8vw,78px)}
.srOnly{position:absolute;height:1px;width:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:670px) and (orientation:portrait){header{margin:0 4%;padding:14px 0 8px;align-items:start}.title{display:block}.title span{display:block;font-size:14px;margin-top:4px}nav{gap:0}nav button{font-size:15px;padding:0 5px}.speaker{padding:0 6px 0 9px}.rack{width:96%;gap:0}.low{--size:36vw;top:9%}.middle{--size:31vw;top:-8%}.high{--size:26vw;top:3%}.caption{min-height:27vh;padding-bottom:25px}.caption h2{max-width:15ch}.caption p{font-size:16px;max-width:35ch}}
@media(max-height:490px) and (orientation:landscape){header{padding:3px 0}.caption{padding-bottom:7px;min-height:0}.caption h2{font-size:29px}.caption p{font-size:15px}.beats{min-height:15px}.low{--size:min(27vw,44vh)}.middle{--size:min(24vw,39vh)}.high{--size:min(20vw,33vh)}}
@media(prefers-reduced-motion:reduce){*,*:after,*:before{animation:none!important;transition:none!important}.wave{border-width:4px;opacity:1}}
.installation:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .5s ease-out;background:radial-gradient(ellipse 29% 65% at var(--origin) 52%,#d795362b,transparent 100%)}
.installation[data-pulse=true]:before{opacity:1;transition-duration:.06s}
.listen .instrument[data-lit=false] .metal,.retry .metal{filter:drop-shadow(7px 16px 8px #0806037a) brightness(.70)}
.idle .metal{animation:gallery-light 9s ease-in-out infinite}.idle .middle .metal{animation-delay:-6s}.idle .high .metal{animation-delay:-3s}
@keyframes gallery-light{0%,65%,100%{filter:drop-shadow(7px 16px 8px #0806037a) brightness(.83)}30%{filter:drop-shadow(7px 16px 8px #0806037a) brightness(1.06)}}