:root{color-scheme:dark;--ink:#081b2c;--green:#00b78e;--paper:#eef5f2;--rule:#aacbc218;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:var(--ink);color:var(--paper);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}html,body{margin:0;min-width:280px}body{min-height:100svh}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid #46ddba;outline-offset:7px}::selection{background:#00b78e55;color:#fff}
.page{max-width:1800px;margin:auto;min-height:100svh;display:flex;flex-direction:column;padding:0 clamp(24px,5vw,88px);isolation:isolate;overflow:hidden}
.masthead{min-height:96px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--rule);position:relative;z-index:2;gap:24px}
.edition{font-size:13px;line-height:1.7;font-weight:400;color:#a1b7b0}
.launch-status{display:flex;align-items:center;gap:10px;color:#b7cec6;flex-shrink:0}.launch-status span{font-size:14px;line-height:1.5}
.stage{position:relative;display:flex;align-items:center;flex:1;min-height:640px;padding:64px 0 90px;isolation:isolate}
.identity{width:48%;max-width:600px;position:relative;z-index:2;text-align:left;padding-left:clamp(0px,2.3vw,38px);pointer-events:none}
.wordmark{display:block;width:min(100%,350px);height:auto;aspect-ratio:872/350;mix-blend-mode:lighten;margin-left:-6px}
h1{font-size:clamp(28px,2.8vw,40px);line-height:1.7;letter-spacing:-1px;font-weight:400;white-space:nowrap;margin:28px 0 0;direction:rtl;text-align:left;color:#d6e3de}
.artwork{position:absolute;z-index:0;width:68%;height:calc(100% + 20px);right:-7%;top:-12px;pointer-events:none}
.artwork canvas,.art-fallback{position:absolute;inset:0;width:100%;height:100%;display:block}.art-fallback{padding:7%;opacity:.6;transition:opacity .4s}.artwork.is-rendered .art-fallback{opacity:0}
.art-glow{position:absolute;inset:14% 7%;border-radius:50%;background:radial-gradient(ellipse,#00b78e09,transparent 68%);filter:blur(25px)}
.art-controls{position:absolute;right:3%;bottom:30px;color:#65897b;z-index:3}.art-controls button{background:transparent;color:#9ec1b1;border:1px solid #84b39a30;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;cursor:pointer;transition:background .2s,border-color .2s}.art-controls button:hover{background:#00b78e10;border-color:#00b78e80}.art-controls button[hidden]{display:none}.play-icon{display:none}button[aria-pressed=true] .pause-icon{display:none}button[aria-pressed=true] .play-icon{display:block}
.signature{display:flex;align-items:center;justify-content:center;min-height:80px;border-top:1px solid var(--rule);position:relative;z-index:2}.signature a{display:flex;align-items:baseline;gap:8px;text-decoration:none;transition:color .2s;font-size:12px;letter-spacing:-.15px;color:#c9d9d1;padding:12px}.signature a:hover{color:#36d7ad}.signature-by{font-size:10px;color:#8aa89a}.signature-athari{display:flex;gap:7px;align-items:center;font-weight:500}.signature-athari svg{color:var(--green);transition:transform .2s}.signature a:hover svg{transform:translate(2px,-2px)}
@media(prefers-reduced-motion:no-preference){.masthead,.signature{animation:arrive 1.2s both}.identity{animation:arrive 1.1s .12s both}.artwork{animation:art-arrive 1.8s .1s both}@keyframes arrive{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}@keyframes art-arrive{from{opacity:0}to{opacity:1}}}
@media(min-width:1600px){.stage{min-height:760px}.wordmark{width:395px}.identity{padding-left:60px}}
@media(max-width:1000px){.page{padding:0 32px}.identity{width:55%;padding-left:6px}.wordmark{width:290px}.artwork{width:77%;right:-15%;opacity:.85}h1{font-size:32px}}
@media(max-width:680px){.page{padding:0 26px}.masthead{min-height:80px;gap:16px}.edition{font-size:12px}.launch-status{gap:8px}.launch-status span{font-size:13px}.stage{min-height:640px;align-items:flex-start;padding:62px 0 330px;display:block}.identity{width:100%;padding:0;text-align:center;max-width:none}.wordmark{width:min(69vw,300px);margin:0 auto}h1{text-align:center;font-size:clamp(26px,6.6vw,35px);margin-top:22px;line-height:1.7;letter-spacing:-.8px}.artwork{width:calc(100% + 88px);height:400px;top:auto;bottom:-2px;left:-44px;right:auto;opacity:.8}.art-controls{right:0;bottom:20px}.art-controls button{height:40px;width:40px}.signature{min-height:80px}}
@media(max-width:360px){.page{padding:0 19px}.edition{font-size:12px}.stage{padding-top:50px;min-height:600px}.artwork{height:360px}.wordmark{width:min(100%,235px)}}
