:root { --ink:#090c0b; --gold:#d9b86c; --bright:#f3d996; --muted:#8e958e; --line:rgba(217,184,108,.24); }
* { box-sizing:border-box; }
html { min-height:100%; background:var(--ink); }
body { margin:0; min-height:100vh; overflow-x:hidden; color:#e8e3d8; font-family:Inter, sans-serif; background:radial-gradient(circle at 50% 36%, #20241d 0, #111612 32%, #090c0b 68%); position:relative; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; background:linear-gradient(90deg, rgba(0,0,0,.5), transparent 25%, transparent 75%, rgba(0,0,0,.5)), radial-gradient(ellipse at center, transparent 45%, rgba(0,0,0,.7)); z-index:0; }
#embers { position:fixed; inset:0; width:100%; height:100%; z-index:0; opacity:.55; pointer-events:none; }
.grain { position:fixed; inset:0; opacity:.075; pointer-events:none; z-index:5; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); }
body > header, body > footer, main { position:relative; z-index:2; }
body > header { height:88px; padding:0 clamp(24px,5vw,72px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(217,184,108,.11); }
.mini-brand { display:flex; align-items:center; gap:12px; color:#ddd2b9; text-decoration:none; font:600 13px/1 Cinzel,serif; letter-spacing:.2em; }
.mini-brand img { width:35px; height:35px; object-fit:contain; filter:drop-shadow(0 0 8px rgba(217,184,108,.25)); }
.header-actions { display:flex; align-items:center; gap:clamp(18px,3vw,40px); }
.header-actions nav { display:flex; align-items:center; }
.header-actions nav a { color:#a8a18e; text-decoration:none; text-transform:uppercase; font:500 9px/1 Cinzel,serif; letter-spacing:.2em; transition:color .2s ease; }
.header-actions nav a:hover,.header-actions nav a[aria-current="page"] { color:var(--bright); }
.header-actions nav a:focus-visible { outline:1px solid var(--gold); outline-offset:6px; }
.status { text-transform:uppercase; color:#777e78; font-size:9px; letter-spacing:.25em; display:flex; align-items:center; gap:10px; }
.status i { width:5px; height:5px; border-radius:50%; background:#bd9e56; box-shadow:0 0 10px #bd9e56; animation:pulse 2.5s ease-in-out infinite; }
main { min-height:calc(100vh - 154px); display:grid; place-items:center; padding:56px 20px 66px; }
.hero { width:min(780px,100%); text-align:center; display:flex; flex-direction:column; align-items:center; }
.sigil-wrap { width:clamp(160px,21vw,230px); aspect-ratio:1; position:relative; display:grid; place-items:center; margin-bottom:13px; animation:arrive 1.2s cubic-bezier(.2,.8,.2,1) both; }
.sigil { width:92%; position:relative; z-index:2; filter:drop-shadow(0 12px 26px rgba(0,0,0,.65)) drop-shadow(0 0 20px rgba(217,184,108,.12)); }
.orbit { position:absolute; inset:3%; border:1px solid rgba(217,184,108,.1); border-radius:50%; }
.orbit::after { content:""; width:4px; height:4px; background:var(--bright); border-radius:50%; position:absolute; top:12%; left:13%; box-shadow:0 0 12px var(--gold); }
.orbit-one { animation:spin 28s linear infinite; }
.orbit-two { inset:12%; border-color:rgba(217,184,108,.07); animation:spin 20s linear reverse infinite; }
.eyebrow { display:flex; align-items:center; gap:16px; color:#ae9c76; font-size:9px; text-transform:uppercase; letter-spacing:.42em; animation:rise 1s .25s both; }
.eyebrow span { width:42px; height:1px; background:linear-gradient(90deg,transparent,var(--gold)); }
.eyebrow span:last-child { transform:scaleX(-1); }
h1 { font:500 clamp(46px,8vw,82px)/.94 Cinzel,serif; letter-spacing:.04em; text-transform:uppercase; margin:18px 0 22px; color:#eee8da; text-shadow:0 4px 30px #000; animation:rise 1s .4s both; }
h1 em { font-style:normal; color:var(--gold); font-size:.65em; display:block; letter-spacing:.32em; margin:10px 0 0 .32em; }
.lead { margin:0; color:#999d96; font:300 clamp(14px,1.8vw,17px)/1.85 Inter,sans-serif; letter-spacing:.035em; animation:rise 1s .55s both; }
.download-launcher { display:inline-flex; flex-direction:column; align-items:center; justify-content:center; min-width:230px; margin-top:34px; padding:14px 28px 12px; border:1px solid rgba(243,217,150,.72); color:#151710; background:linear-gradient(180deg,#efd58e,#cda85b); text-decoration:none; text-transform:uppercase; box-shadow:0 10px 30px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.45); transition:transform .18s ease,filter .18s ease,box-shadow .18s ease; animation:rise 1s .78s both; }
.download-launcher span { font:600 11px/1.2 Cinzel,serif; letter-spacing:.2em; }
.download-launcher small { margin-top:6px; color:rgba(21,23,16,.68); font:500 8px/1 Inter,sans-serif; letter-spacing:.16em; }
.download-launcher:hover { transform:translateY(-2px); filter:brightness(1.06); box-shadow:0 14px 36px rgba(0,0,0,.5),0 0 22px rgba(217,184,108,.12); }
.download-launcher:focus-visible { outline:2px solid var(--bright); outline-offset:4px; }
body > footer { min-height:66px; padding:0 clamp(24px,5vw,72px); border-top:1px solid rgba(217,184,108,.09); display:flex; align-items:center; justify-content:space-between; color:#555b56; font-size:8px; letter-spacing:.2em; text-transform:uppercase; }
.footer-mark { color:#726b58; }
.notes-main { min-height:calc(100vh - 154px); display:block; padding:70px 20px 90px; }
.notes-shell { width:min(920px,100%); margin:0 auto; }
.notes-intro { text-align:center; margin:0 auto 48px; max-width:700px; animation:rise .8s both; }
.notes-kicker { color:#ae9c76; font:500 9px/1 Cinzel,serif; letter-spacing:.38em; text-transform:uppercase; }
.notes-intro h1 { margin:16px 0 18px; font-size:clamp(40px,7vw,66px); }
.notes-intro p { margin:0; color:#929890; font:300 15px/1.8 Inter,sans-serif; }
.notes-list { display:grid; gap:24px; }
.patch { position:relative; padding:clamp(24px,4vw,42px); border:1px solid rgba(217,184,108,.18); background:linear-gradient(145deg,rgba(28,32,26,.88),rgba(11,14,12,.9)); box-shadow:0 20px 60px rgba(0,0,0,.25); animation:rise .8s .15s both; }
.patch::before { content:""; position:absolute; left:-1px; top:28px; bottom:28px; width:2px; background:linear-gradient(transparent,var(--gold),transparent); }
.patch-header { display:flex; justify-content:space-between; align-items:flex-start; gap:24px; padding-bottom:22px; border-bottom:1px solid rgba(217,184,108,.13); }
.patch-title h2 { margin:8px 0 0; color:#e7e0d1; font:500 clamp(21px,3vw,28px)/1.25 Cinzel,serif; letter-spacing:.04em; }
.patch-version { color:var(--gold); font:500 9px/1 Cinzel,serif; letter-spacing:.22em; text-transform:uppercase; }
.patch time { flex:none; color:#727972; font-size:9px; letter-spacing:.16em; text-transform:uppercase; }
.patch-summary { margin:24px 0 0; color:#a7aaa3; font:300 14px/1.8 Inter,sans-serif; }
.patch-section { margin-top:26px; }
.patch-section h3 { display:flex; align-items:center; gap:10px; margin:0 0 14px; color:#cfbd91; font:600 10px/1 Cinzel,serif; letter-spacing:.18em; text-transform:uppercase; }
.patch-section h3::before { content:"✦"; color:var(--gold); font-size:7px; }
.patch-section ul { margin:0; padding:0 0 0 20px; color:#969b95; font:300 13px/1.75 Inter,sans-serif; }
.patch-section li { padding-left:5px; margin:5px 0; }
.patch-section li::marker { color:#8c7544; }
.patch-badges { display:flex; flex-wrap:wrap; gap:8px; margin-top:26px; }
.badge { padding:7px 9px 6px; border:1px solid rgba(217,184,108,.18); color:#91856a; background:rgba(217,184,108,.04); font:500 8px/1 Cinzel,serif; letter-spacing:.15em; text-transform:uppercase; }
.notes-back { display:inline-block; margin-top:38px; color:#9c927b; text-decoration:none; font:500 9px/1 Cinzel,serif; letter-spacing:.18em; text-transform:uppercase; }
.notes-back:hover { color:var(--bright); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@keyframes rise { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:none} }
@keyframes arrive { from{opacity:0;transform:scale(.88) rotate(-4deg)} to{opacity:1;transform:none} }
@keyframes spin { to{transform:rotate(360deg)} }
@keyframes pulse { 50%{opacity:.35;box-shadow:0 0 3px #bd9e56} }
@media (max-width:600px) { body>header{height:70px;padding:0 20px}.status{display:none}.header-actions{gap:12px}.header-actions nav a{font-size:8px}.mini-brand span{font-size:10px}.sigil-wrap{width:165px}body>footer{justify-content:center}.footer-mark,body>footer>span:last-child{display:none}main{padding-top:34px}.lead br{display:none}.notes-main{padding:48px 16px 70px}.patch-header{display:block}.patch time{display:block;margin-top:12px}.patch{padding:24px 22px} }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}#embers{display:none} }