:root{--ground:#120d08;--ground-lift:#2c1a0c;--ink:#fbeedb;--muted:#d9b98c;--link:#ffd28c;--edge:#f3dcb8;--glow:#ffb35c}*,:before,:after{box-sizing:border-box}body{color:var(--ink);background:linear-gradient(180deg, #120d08d1 0%, #120d088c 32%, #120d087a 62%, #120d08bd 100%), url(../scene.jpg) center 38% / cover no-repeat, var(--ground);min-height:100dvh;margin:0;padding:1.25rem 1rem;font-family:system-ui,sans-serif;line-height:1.6;position:relative}a{color:var(--link);z-index:1;position:relative}h1{color:var(--ink);letter-spacing:.08em;text-transform:uppercase;z-index:1;margin:0;font-size:clamp(1.3rem,1rem + 1.6vw,2rem);font-weight:600;position:relative}.defs{position:absolute}.ambience{z-index:0;pointer-events:none;position:fixed;inset:0;overflow:hidden}.mote{width:10px;height:10px;box-shadow:0 0 10px 4px var(--glow);opacity:0;filter:blur(.5px);background:#fff6e6;border-radius:50%;animation:14s ease-in-out infinite drift;position:absolute}.mote:first-child{animation-duration:16s;animation-delay:0s;left:18%}.mote:nth-child(2){width:6px;height:6px;animation-duration:12s;animation-delay:3s;left:38%}.mote:nth-child(3){animation-duration:18s;animation-delay:6s;left:58%}.mote:nth-child(4){width:7px;height:7px;animation-duration:15s;animation-delay:2s;left:74%}.mote:nth-child(5){width:5px;height:5px;animation-duration:13s;animation-delay:8s;left:88%}@keyframes drift{0%{opacity:0;bottom:-5%}15%{opacity:.85}85%{opacity:.55}to{opacity:0;bottom:90%}}main{z-index:1;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;min-height:calc(100dvh - 8rem);display:flex;position:relative}.beam{filter:blur(28px);z-index:0;background:linear-gradient(#ffb35c4d 0%,#ffb35c1a 55%,#0000 85%);width:min(70vw,46rem);position:absolute;top:22%;bottom:0;left:50%;transform:translate(-50%)rotate(4deg)}.rack{z-index:1;touch-action:none;justify-content:center;align-items:center;gap:clamp(4px,1.2vw,22px);width:100%;max-width:min(68rem,96vw);display:flex;position:relative}.glass{cursor:ns-resize;border-radius:8px;flex:1 1 0;min-width:0}.glass:focus-visible{outline:2px solid var(--link);outline-offset:4px}.glass-art{pointer-events:none;width:100%;height:auto;max-height:min(62dvh,32rem);display:block}.wall,.rim{fill:none;stroke:var(--edge);stroke-width:1.4px;opacity:.45}.rim{opacity:.65}.cavity{fill:#ffffff0a;clip-path:url(#vessel-clip)}.water,.water-base{fill:url(#water-fill);clip-path:url(#vessel-clip);transition:y 90ms linear,height 90ms linear,cy 90ms linear,opacity 90ms linear}.surface{fill:#fbeedb;filter:drop-shadow(0 0 6px var(--glow));clip-path:url(#vessel-clip);transform-box:fill-box;transform-origin:50%;transition:cy 90ms linear}.sheen,.sheen-dim{clip-path:url(#vessel-clip);filter:blur(1.1px);pointer-events:none}.sheen{fill:url(#highlight-bright)}.sheen-dim{fill:url(#highlight-dim)}.bloom{fill:url(#bloom-fill);opacity:0;transform-box:fill-box;transform-origin:50%}.glass.ringing .bloom{animation:.46s ease-out bloom}.glass.ringing .surface{animation:.34s ease-out shiver}.ripple-1,.ripple-2{fill:none;stroke:var(--edge);stroke-width:1.2px;opacity:0;clip-path:url(#vessel-clip);transform-box:fill-box;transform-origin:50%;transition:cy 90ms linear}.glass.ringing .ripple-1{animation:.56s ease-out ripple}.glass.ringing .ripple-2{animation:.56s ease-out .1s ripple}@keyframes ripple{0%{opacity:.55;transform:scale(.5)}to{opacity:0;transform:scale(1.9)}}.reflect{fill:var(--glow);opacity:.16;filter:blur(3px)}@keyframes bloom{0%{opacity:.9;transform:scale(.35)}to{opacity:0;transform:scale(1.6)}}@keyframes shiver{0%{transform:scaleY(1)}30%{transform:scaleY(1.9)}to{transform:scaleY(1)}}.mallet{stroke:#f0d6a8;stroke-width:2.6px;stroke-linecap:round;opacity:0;transform-box:view-box;transform-origin:70px -10px;transform:rotate(-30deg)}.glass.struck .mallet{animation:.42s cubic-bezier(.3,0,.4,1) tap}@keyframes tap{0%{opacity:0;transform:rotate(-30deg)}20%{opacity:.95;transform:rotate(-24deg)}45%{opacity:1;transform:rotate(-14deg)}62%{opacity:.85;transform:rotate(-19deg)}to{opacity:0;transform:rotate(-30deg)}}.gust path{fill:none;stroke:#fffaf0;stroke-width:1.9px;stroke-linecap:round;filter:drop-shadow(0 0 2px #ffd9a0);opacity:0}.glass.blowing .gust-1{animation:.9s linear infinite gust}.glass.blowing .gust-2{animation:1.1s linear .12s infinite gust}.glass.blowing .gust-3{animation:1s linear .24s infinite gust}@keyframes gust{0%{opacity:0;transform:translate(0)}25%{opacity:.95}70%{opacity:.7}to{opacity:0;transform:translate(96px)}}.glass.rim-hot .rim{opacity:1;stroke:#fff4de;stroke-width:2px}.glass.rim-hot{cursor:pointer}@media (prefers-reduced-motion:reduce){.water,.water-base,.surface,.ripple-1,.ripple-2{transition:none}.glass.ringing .bloom,.glass.ringing .surface,.glass.ringing .ripple-1,.glass.ringing .ripple-2,.glass.struck .mallet{animation:none}.glass.blowing .gust-1,.glass.blowing .gust-2,.glass.blowing .gust-3{opacity:.5;animation:none;transform:translate(48px)}.mote{opacity:0;animation:none}}