@font-face{font-family:Vazirmatn;src:url('./Vazirmatn-wght.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{color-scheme:dark;--bg:#111615;--text:#f0eee6;--sage:#b9cdb1;--muted:#9ca99f}
*{box-sizing:border-box}body{margin:0;min-height:100svh;background:var(--bg);color:var(--text);font-family:Vazirmatn,sans-serif;overflow-x:hidden;display:flex;flex-direction:column}button{font:inherit}header,footer{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:30px 5vw}header .brand-name{font-size:24px;font-weight:550}.caption,footer{font-size:12px;color:var(--muted)}main{position:relative;z-index:1;flex:1;min-height:620px;display:flex;align-items:center;flex-direction:column;justify-content:center;padding:50px 24px 70px}.landscape{position:fixed;inset:-5%;width:110%;height:110%;pointer-events:none;opacity:.45}.quiet-center{position:fixed;inset:0;background:radial-gradient(ellipse at 50% 46%,#111615e8 0%,#111615b0 30%,#11161500 75%);pointer-events:none}.drift{transform-box:fill-box;transform-origin:center;will-change:transform}.back{animation:back 67s ease-in-out infinite alternate;opacity:.38}.middle{animation:middle 49s ease-in-out infinite alternate;opacity:.5}.front{animation:front 39s ease-in-out infinite alternate;opacity:.36}@keyframes back{from{transform:translate(-75px,12px)}to{transform:translate(85px,-14px)}}@keyframes middle{from{transform:translate(90px,-18px)}to{transform:translate(-90px,22px)}}@keyframes front{from{transform:translate(-50px,-8px)}to{transform:translate(65px,18px)}}.eyebrow{display:flex;align-items:center;gap:10px;color:var(--sage);font-size:12px;letter-spacing:.02em}.eyebrow i{width:5px;height:5px;border-radius:50%;background:var(--sage)}.logo{display:block;overflow:visible;width:min(900px,83vw);height:auto;margin:68px auto 36px;color:var(--text)}.intro{font-size:clamp(15px,2vw,20px);font-weight:300;color:#bdc6be;text-align:center;margin:0;line-height:2}.capture{width:230px;margin:22px 0 5px;color:var(--sage);opacity:.65;height:66px;display:flex;align-items:center}.capture svg{width:100%;overflow:visible}.capture path{transform-origin:300px 78px;animation:breathe 6s ease-in-out infinite}@keyframes breathe{0%,100%{transform:scaleY(.5);opacity:.5}50%{transform:scaleY(.9);opacity:1}}.controls{display:flex;gap:12px;margin-top:12px}button{min-height:46px;padding:10px 24px;border:1px solid transparent;border-radius:12px;background:var(--sage);color:#17241a;cursor:pointer;font-size:13px;transition:background .2s,border-color .2s}button.secondary{background:#1b241f;color:#d7dfd5;border-color:#344139}button:hover{background:#d0dfc8}button.secondary:hover{background:#29362d}button:focus-visible{outline:2px solid var(--sage);outline-offset:5px}.hint{min-height:24px;text-align:center;font-size:11px;color:#899b8c;margin-top:20px}.footer-state{font-size:11px}body[data-recording=true] .capture path{animation:recording 2.2s ease-in-out infinite}body[data-recording=true] .eyebrow i{animation:dot 1.6s ease-in-out infinite}body[data-recording=true] .landscape{opacity:.6}@keyframes recording{0%,100%{transform:scaleY(.7)}30%{transform:scaleY(1.5)}65%{transform:scaleY(1.05)}}@keyframes dot{50%{opacity:.35}}body[data-paused=true] .drift,body[data-paused=true] .capture path,body[data-paused=true] .eyebrow i{animation-play-state:paused}@media(prefers-reduced-motion:reduce){.drift,.capture path,.eyebrow i{animation:none!important;will-change:auto}*{transition:none!important}.logo g{filter:none}}@media(max-width:600px){header,footer{padding:24px}main{min-height:590px;padding:40px 20px 60px}.logo{width:90vw;margin:68px auto 44px}.controls{gap:8px}button{padding:10px 17px}.hint{max-width:290px}footer{font-size:10px}.footer-state{font-size:10px}}

/* Approved typography: display headings / readable interface text. */
@font-face{font-family:Lalezar;src:url("Lalezar-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
h1,h2{font-family:Lalezar,Vazirmatn,sans-serif!important;font-weight:400!important}

/* Body font selected by user: Sahel, pending possible future Bon purchase. */
@font-face{font-family:Sahel;src:url("Sahel.woff2") format("woff2");font-weight:400;font-display:swap}
body{font-family:Sahel,Vazirmatn,sans-serif}
button,input,textarea,select{font-family:inherit}
h1,h2{font-family:Lalezar,Sahel,sans-serif!important;font-weight:400!important}