/* LIEBER LAUT* */
@font-face{font-family:"Inter Tight";font-weight:100 900;font-display:swap;src:url(assets/fonts/inter-tight-latin-wght-normal.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter Tight";font-weight:100 900;font-display:swap;src:url(assets/fonts/inter-tight-latin-ext-wght-normal.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Inter Tight";font-weight:100 900;font-display:swap;src:url(assets/fonts/inter-tight-cyrillic-wght-normal.woff2) format("woff2-variations");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"JetBrains Mono";font-weight:500;font-display:swap;src:url(assets/fonts/jetbrains-mono-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"JetBrains Mono";font-weight:500;font-display:swap;src:url(assets/fonts/jetbrains-mono-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"JetBrains Mono";font-weight:500;font-display:swap;src:url(assets/fonts/jetbrains-mono-cyrillic-500-normal.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}

:root{--red:#FF3B2F;--ink:#07090a;--glass:#121819;--white:#F4F6F5;--sans:"Inter Tight",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,monospace}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--ink);color:var(--white);font-family:var(--sans);overflow:hidden;-webkit-font-smoothing:antialiased}
canvas#scene{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}
canvas#scene:active{cursor:grabbing}
.exhibit canvas#scene{cursor:none}
.lbl{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
a{color:inherit}
.ast{color:var(--red)}

/* gate */
.gate{position:fixed;inset:0;z-index:20;display:grid;grid-template-rows:auto 1fr auto;padding:clamp(20px,4vw,48px);background:rgba(7,9,10,.72);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);transition:opacity .7s}
.gate.out{opacity:0;pointer-events:none}
.gate .top{display:flex;justify-content:space-between;gap:16px;opacity:.8}
.gate .mid{align-self:center}
.gate h1{font-family:var(--sans);font-weight:850;font-size:clamp(68px,15vw,260px);line-height:.8;letter-spacing:-.045em;margin:0;text-transform:uppercase}
.gate h1 .ast{font-weight:400;vertical-align:top;font-size:.55em;line-height:1;margin-left:.02em}
.gate .row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px 48px;align-items:end;margin-top:clamp(24px,4vw,48px)}
.gate p.brief{font-size:clamp(19px,2vw,26px);line-height:1.25;font-weight:500;max-width:30ch;margin:0;letter-spacing:-.01em}
.gate .actions{display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.gate .go{display:inline-flex;align-items:center;gap:12px;background:var(--white);color:#000;border:0;padding:20px 28px;font-family:var(--mono);font-size:13px;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;transition:background .2s,color .2s}
.gate .go:hover{background:var(--red);color:#fff}
.gate .go svg{width:16px;height:16px}
.gate .alt{background:none;border:0;color:var(--white);opacity:.7;cursor:pointer;text-decoration:underline;text-underline-offset:4px;padding:6px 0}
.gate .alt:hover{opacity:1}
.gate .bottom{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;opacity:.6;line-height:1.6}
.gate .bottom .warn{color:var(--red);opacity:1}
@media (max-width:760px){.gate .row{grid-template-columns:1fr}.gate .actions{align-items:stretch}.gate .go{justify-content:center}.gate .top span:last-child{display:none}}

/* hud */
.hud{position:fixed;inset:0;z-index:10;pointer-events:none}
.brand{position:absolute;left:24px;top:20px;font-weight:850;font-size:20px;letter-spacing:-.03em;text-transform:uppercase}
.info-link{position:absolute;right:24px;top:24px;pointer-events:auto;text-decoration:none;opacity:.75}
.info-link:hover{opacity:1}
.meter{transition:opacity .4s;position:absolute;left:24px;top:50%;transform:translateY(-50%);height:min(46vh,420px);width:6px;background:rgba(255,255,255,.12)}
.meter .fill{position:absolute;left:0;right:0;bottom:0;height:0;background:var(--white)}
.meter.over .fill{background:var(--red)}
.meter .thr{position:absolute;left:-6px;width:18px;height:2px;background:var(--red)}
.meter .thr span{position:absolute;left:26px;top:-6px;white-space:nowrap;color:var(--red)}
.meter .db{position:absolute;left:0;bottom:-24px;white-space:nowrap;opacity:.6}
.hint{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);text-align:center;transition:opacity .6s}
.hint b{display:block;font-weight:850;font-size:clamp(40px,6vw,84px);letter-spacing:-.03em;line-height:.9;text-transform:uppercase}
.hint span{opacity:.7}
.object{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;opacity:0;transition:opacity .45s;background:radial-gradient(ellipse at center,rgba(7,9,10,.55),rgba(7,9,10,.85))}
.object p{font-weight:850;font-size:clamp(56px,12vw,220px);line-height:.84;letter-spacing:-.045em;text-transform:uppercase;margin:0}
.object p em{font-style:normal;color:var(--red)}
.object .lbl{display:block;margin-top:clamp(18px,2.4vw,32px);opacity:.75}
.object .silenced{margin:0 0 clamp(14px,2vw,26px);color:var(--red);opacity:1}
.object .silenced:empty{display:none}
.nomic{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);text-align:center;width:min(46ch,calc(100% - 32px));display:none}
.nomic b{display:block;font-weight:800;font-size:clamp(24px,3.4vw,40px);letter-spacing:-.025em;margin-bottom:8px}
.calib{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;display:none}
.calib i{display:block;width:180px;height:2px;background:rgba(255,255,255,.2);margin:14px auto 0;position:relative;overflow:hidden}
.calib i::after{content:"";position:absolute;inset:0;background:var(--red);transform-origin:left;animation:cal 3s linear forwards}
@keyframes cal{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.speed{position:absolute;right:24px;bottom:28px;display:flex;align-items:center;gap:10px;pointer-events:auto;opacity:.7;transition:opacity .2s}
.speed:hover{opacity:1}
.speed input{-webkit-appearance:none;appearance:none;width:110px;height:2px;background:rgba(255,255,255,.35);outline:none}
.speed input::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:var(--white);border-radius:0;cursor:pointer}
.speed input::-moz-range-thumb{width:12px;height:12px;background:var(--white);border:0;border-radius:0;cursor:pointer}
.speed output{min-width:3.2em}
.exhibit .speed{display:none}
@media (max-width:640px){.speed{right:16px;bottom:auto;top:46px}.speed input{width:80px}}
.debug{position:absolute;right:16px;bottom:16px;font:11px/1.5 var(--mono);background:rgba(0,0,0,.7);padding:10px 12px;display:none;pointer-events:auto}
.exhibit .brand,.exhibit .info-link,.exhibit .hint span{display:none}
@media (max-width:640px){.brand{font-size:17px;left:16px;top:16px}.info-link{right:16px;top:18px}.meter{left:16px;height:34vh}.hint{bottom:24px}}

.quiet .meter,.quiet .speed,.quiet .hint{opacity:0}
.quiet .calib{display:none!important}
