@font-face{font-family:Metamorphous;src:url(/assets/metamorphous.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:Alegreya;src:url(/assets/alegreya.ttf) format("truetype");font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:Cinzel;src:url('/assets/cinzel.ttf') format('truetype');font-style:normal;font-weight:400 900;font-display:swap}
:root{color-scheme:dark;--paper:#101719;--ink:#e8dfcd;--muted:#a8ada8;--line:#3e4036;--gold:#d2ae65;--surface:#192023;--display:Metamorphous,Palatino,Georgia,serif;--game-font:Alegreya,Georgia,serif}
*{box-sizing:border-box}html{scroll-padding-top:24px}body{margin:0;background:radial-gradient(ellipse at 85% 30%,#25333540,transparent 55%),var(--paper);color:var(--ink);font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:inherit;text-underline-offset:4px}button,input{font:inherit}button,a,input,summary{outline-offset:5px}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--gold)}button{cursor:pointer}.wrap{width:min(1160px,calc(100% - 64px));margin:auto;position:relative}.world-art{position:absolute;inset:110px 0 auto;height:clamp(380px,33.333vw,650px);background:linear-gradient(180deg,#10171900 45%,#101719 100%),linear-gradient(90deg,#10171999,transparent 75%),url('/assets/forever-hyjal-sunset-v3.webp') center top/cover no-repeat;pointer-events:none;opacity:.92}.preview{position:relative;background:#0a1012;border-bottom:1px solid #453b29;text-align:center;padding:6px 16px;font-size:9px;letter-spacing:1.8px;color:#a69e8b}.nav{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #6a593b;position:relative}.nav:after{content:"◆";position:absolute;font-size:9px;color:var(--gold);bottom:-9px;left:50%;text-shadow:0 0 12px #e7ba6370}.brand{display:flex;align-items:center;gap:12px;text-decoration:none}.brand-name{font:700 23px/1 var(--display);letter-spacing:1.3px;color:#e0bd77;text-shadow:0 2px 3px #000}.brand-name small{display:block;font:500 8px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:3px;color:#a49c87;margin-top:8px}.sigil{width:39px;height:46px;display:grid;place-items:center;background:linear-gradient(135deg,#926d35,#dfba6a 45%,#5d4224);clip-path:polygon(0 0,100% 0,100% 77%,50% 100%,0 77%);position:relative;isolation:isolate;color:#e1be7b;font:700 27px var(--display)}.sigil:before{content:"";position:absolute;inset:2px;clip-path:inherit;background:linear-gradient(135deg,#57332a,#241b18);z-index:-1}.nav-links{display:flex;height:100%;gap:34px;font-size:11px;font-weight:650;letter-spacing:1.4px;text-transform:uppercase;align-items:stretch}.nav-links a{display:flex;align-items:center;position:relative;text-decoration:none;color:#bfb9aa}.nav-links a:hover,.nav-links a[aria-current=page]{color:#f0cf89}.nav-links a[aria-current=page]:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--gold);box-shadow:0 0 12px #d2ae65}
.hero{display:grid;grid-template-columns:minmax(0,1fr) 268px;gap:54px;align-items:end;padding:64px 0 54px;min-height:355px}.eyebrow{display:block;color:var(--gold);font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin:0 0 16px}h1{font:600 clamp(36px,4.2vw,54px)/1.2 var(--display);letter-spacing:-1px;margin:0 0 20px;text-wrap:balance;color:#f1e5cb;text-shadow:0 3px 15px #0009;max-width:800px}h1 em{font-style:normal;color:#d6b576}.intro{font-size:15px;line-height:1.8;color:#c1c5bd;max-width:590px;margin:0;text-shadow:0 1px 4px #000}.scope{border:1px solid #776440;background:linear-gradient(135deg,#1c2525e8,#101617ed);padding:22px;box-shadow:inset 0 0 0 4px #101719,0 8px 25px #0004;position:relative}.scope:before{content:"FIELD NOTES";font-size:9px;font-weight:650;letter-spacing:2px;color:var(--gold);display:block;margin-bottom:10px}.scope strong{font:600 15px/1.5 var(--display);color:#e6d5ae;display:block}.scope p{font-size:12px;color:#b5b9b1;margin:10px 0}.scope time{font-size:10px;color:#bfa97e}
.update{display:grid;grid-template-columns:155px 1fr;gap:32px;background:linear-gradient(120deg,#273031,#192022);border:1px solid #655738;box-shadow:inset 0 0 0 4px #141c1c,0 10px 30px #0002;padding:28px 32px;margin-bottom:48px;position:relative}.update:before,.addon:before,.journal-nav:before{content:"";position:absolute;width:7px;height:7px;top:7px;left:7px;border-top:1px solid #b79b63;border-left:1px solid #b79b63}.update-label{display:flex;gap:9px;align-items:flex-start;font:600 11px/1.8 var(--display);color:#d2bc8f;padding-top:3px}.dot{width:7px;height:7px;background:var(--gold);transform:rotate(45deg);margin-top:6px;flex-shrink:0}.update h3{font:500 22px/1.4 var(--display);color:#e8d5ad;margin:0 0 10px}.update p{font-size:13px;margin:9px 0;color:#bec4bc;max-width:750px}.update .limit{font-size:12px;color:#a4aaa1}.update a{font-size:12px;color:#dcc08a;display:inline-block;margin-top:6px}.update .eyebrow{font-size:9px;margin-bottom:9px}
.section-head{display:flex;justify-content:space-between;gap:20px;align-items:baseline;margin-bottom:20px}h2{font:500 27px/1.4 var(--display);color:#dfc694;margin:0}.section-head p{font-size:11px;color:var(--muted);margin:0}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.filters{display:flex;gap:6px;flex-wrap:wrap}.filters button{padding:9px 15px;background:#131b1e;border:1px solid #3b423b;font-size:11px;color:#b9baae;min-height:40px}.filters button:hover{border-color:#9b814e;color:#e6d5ab}.filters button[aria-pressed=true]{background:linear-gradient(#713526,#46251e);color:#f1d496;border-color:#af8645;box-shadow:inset 0 0 0 2px #241c19}.search input{background:#0c1316;border:1px solid #535341;color:var(--ink);padding:10px 14px;width:230px;font-size:12px;border-radius:0;min-height:40px}.search input::placeholder{color:#969d95}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.addon{--item:#c9a867;position:relative;background:radial-gradient(ellipse at 10% 0%,#6a573b1f,transparent 70%),linear-gradient(135deg,#202729,#151c1e);border:1px solid #5c513d;padding:25px;display:flex;flex-direction:column;min-width:0;box-shadow:inset 0 0 0 4px #131a1c,0 8px 20px #0002}.addon[data-category=interface]{--item:#b39bdd}.addon[data-category=controller]{--item:#82b5d2}.addon[hidden]{display:none}.card-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:24px}.addon-mark{width:49px;height:49px;display:grid;place-items:center;background:radial-gradient(circle at 45% 35%,#465052,#10171c 80%);border:1px solid var(--item);color:var(--item);box-shadow:0 0 0 3px #101719,inset 0 0 12px #0009}.addon-mark svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.status{display:inline-flex;align-items:center;gap:6px;border:1px solid #5e5138;color:#d1bc8f;font-size:9px;padding:4px 7px;white-space:nowrap;background:#28251b}.status:before{content:"";border:1px solid currentColor;border-radius:50%;width:5px;height:5px}.addon .eyebrow{margin-bottom:4px;font-size:9px;color:#aaa994}.addon h3{font:500 26px/1.4 var(--display);color:var(--item);margin:0 0 10px}.description{font-size:13px;color:#b6bcb4;margin:0 0 23px;min-height:43px}.release{border-top:1px solid var(--line);padding-top:16px}.release>span{display:block;color:#aaa996;font-size:10px;margin-bottom:5px}.release>div{font-size:12px;color:#d2c2a0}.release small{display:block;font-size:11px;color:#9da598;margin-top:8px;line-height:1.6}.addon details{font-size:11px;margin:20px 0}.addon summary{cursor:pointer;color:#d3c7ad}.addon details p{font-size:12px;color:var(--muted)}.project-link{font-size:11px;font-weight:650;letter-spacing:.4px;display:flex;justify-content:space-between;margin-top:auto;padding-top:16px;border-top:1px solid var(--line);text-decoration:none;color:#d4ba86}.project-link:hover{text-decoration:underline}.empty{padding:35px;text-align:center;border:1px dashed #655738;color:var(--muted)}
.questions{display:grid;grid-template-columns:1fr 1.7fr;gap:70px;padding:64px 0 52px}.questions h2{max-width:280px}.questions details{border-top:1px solid var(--line);padding:18px 0;font-size:13px}.questions details:last-child{border-bottom:1px solid var(--line)}.questions summary{color:#d8cfbb;cursor:pointer}.questions details p{color:var(--muted);font-size:13px;margin-bottom:0}.method{background:#1a2223;padding:23px 27px;font-size:12px;color:#a6afa3;margin-bottom:44px;border-left:2px solid #8b764f}.method strong{display:block;color:#cfb98c;margin-bottom:5px}.method p{margin:0}.footer{border-top:1px solid #514830;padding:26px 0 32px;display:flex;justify-content:space-between;gap:25px;font-size:10px;color:#a2a38e}
/* Guides read like a quest journal, with a quiet parchment surface for long text. */
.article-header{padding:36px 0 34px;min-height:323px}.crumbs{font-size:11px;color:#c0b99f;margin-bottom:24px}.crumbs a{text-decoration:none}.crumbs span{color:#b29760;padding:0 10px}.article-header h1{max-width:810px;font-size:clamp(32px,3.5vw,44px);line-height:1.23}.article-header .eyebrow{margin-bottom:12px}.article-meta{font-size:11px;color:#bdbaa8;display:flex;gap:9px;align-items:center}.article-meta:before{content:"◆";color:var(--gold);font-size:8px}.article-header>.intro{max-width:540px}.article-layout{display:grid;grid-template-columns:minmax(0,810px) minmax(210px,1fr);gap:28px;align-items:start;margin-bottom:52px}.article-body{--muted:#6a6050;--line:#c7b99b;color:#392f23;background:radial-gradient(ellipse at 20% 0%,#fff8e060,transparent 70%),repeating-linear-gradient(6deg,#0000 0 3px,#8b6b3c06 4px 5px),#e1d4b6;padding:34px 42px 40px;border:1px solid #9f8655;box-shadow:inset 0 0 0 5px #c7b38c,inset 0 0 0 6px #a7926a,0 12px 35px #0005;position:relative}.article-body:before,.article-body:after{position:absolute;content:"◆";color:#8b6e40;font-size:9px;top:8px;left:11px}.article-body:after{left:auto;right:11px}.article-body p{font-size:14px;line-height:1.85}.article-body p:first-child{margin-top:0}.article-body .lead{font-size:16px;color:#453b2c;line-height:1.9}.article-body h2{font:600 23px/1.45 var(--display);color:#50391f;margin:34px 0 16px}.article-body .source-inline{font-size:11px;color:#6a6050}.article-body a{color:#68451f}.quick-answer{background:linear-gradient(110deg,#b9995f30,#f3e5c470);border:1px solid #a78c56;border-left:3px solid #90672a;padding:19px 22px;margin:26px 0;box-shadow:inset 0 0 0 3px #ebdfc2}.quick-answer>span{display:block;font-size:9px;font-weight:750;color:#755426;text-transform:uppercase;letter-spacing:1.6px}.quick-answer>strong{display:block;font:600 22px/1.45 var(--display);color:#563b18;margin:8px 0}.quick-answer p{margin:8px 0 0;font-size:12px;color:#6a5941}.table-scroll{overflow:auto}table{border-collapse:collapse;width:100%;background:#eadfc6;font-size:12px}caption{text-align:left;font-size:10px;color:var(--muted);padding-bottom:10px}th,td{text-align:left;padding:14px;border:1px solid #c1ad83;vertical-align:top}thead th{background:#c8b38a;color:#44351f;font-size:11px}tbody th{width:35%;font-weight:600}li{padding-left:3px;margin:10px 0;font-size:14px}li::marker{color:#886029;font-weight:700}.article-body .primary-link{display:inline-flex;gap:15px;text-decoration:none;background:linear-gradient(#743524,#48251c);border:1px solid #9b7238;box-shadow:inset 0 0 0 2px #2f201b,0 2px 5px #6f552a33;color:#f5db9f;padding:12px 18px;font-size:12px;margin:12px 0}.primary-link:hover{filter:brightness(1.17)}.editor-note{border-top:1px solid #b7a176;padding:20px 0 0;margin-top:32px}.editor-note strong{font-size:11px;color:#624823}.editor-note p{font-size:11px;margin:6px 0;color:#6a5d47}.guide-aside{display:grid;gap:22px;position:sticky;top:24px}.journal-nav{position:relative;border:1px solid #6c5a37;background:linear-gradient(135deg,#293031,#161d20);box-shadow:inset 0 0 0 4px #141c1e;padding:22px}.journal-nav h2{font:600 15px var(--display);margin-bottom:18px;color:#d8bd86}.journal-nav ol{list-style:none;padding:0;counter-reset:chapter;margin:0}.journal-nav li{margin:0;padding:0;border-top:1px solid #41483e;counter-increment:chapter}.journal-nav a{display:flex;gap:10px;padding:12px 0;font-size:11px;color:#c0c5b9;text-decoration:none;line-height:1.5}.journal-nav a:before{content:"0" counter(chapter);font-size:9px;color:#d2b572;padding-top:1px}.journal-nav a:hover{color:#f1cf8c}.aside-link{padding:0 18px}.aside-link .eyebrow{font-size:9px;margin-bottom:9px}.aside-link h3{font:500 19px/1.5 var(--display);color:#d1b783;margin:0 0 8px}.aside-link p{font-size:12px;color:#a5aea2;margin:0 0 14px}.aside-link>a{font-size:11px;color:#ddc594}.guide-list{display:grid;gap:20px;max-width:860px;margin:0 0 70px}.guide-item{display:grid;grid-template-columns:64px 1fr;gap:26px;border:1px solid #79633c;padding:30px;text-decoration:none;background:linear-gradient(130deg,#293030,#161e20);box-shadow:inset 0 0 0 4px #131c1d}.guide-item:hover{border-color:#d6b36b;background:linear-gradient(130deg,#303635,#1c2527)}.guide-number{font:500 35px var(--display);color:#ae9258;border-right:1px solid #685b3e;padding-right:20px}.guide-item h2{font-size:24px}.guide-item p{font-size:13px;color:#b1b9ad}.guide-item .eyebrow{font-size:9px;color:#d2b475;margin-top:0}.guide-item small{font-size:11px;color:#dfc48c}
@media(max-width:1000px){.hero{grid-template-columns:minmax(0,1fr) 240px;gap:25px}.hero h1{font-size:39px}.addon{padding:22px}.card-top{align-items:flex-start;flex-direction:column;gap:15px}.article-layout{grid-template-columns:minmax(0,1fr) 210px;gap:20px}.article-body{padding:30px}.article-header h1{max-width:710px}}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.world-art{height:400px;background-position:center,center,70% top}.nav{height:78px}.nav-links{gap:20px;font-size:10px}.brand-name{font-size:20px}.hero{grid-template-columns:1fr;padding:40px 0;gap:25px}.hero h1{font-size:40px;max-width:600px}.scope{max-width:none;padding:20px}.scope:before{margin-bottom:6px}.scope p{margin:7px 0}.grid{grid-template-columns:1fr}.card-top{flex-direction:row;align-items:center}.description{min-height:0}.update{grid-template-columns:1fr;gap:16px;padding:25px}.questions{grid-template-columns:1fr;gap:25px}.questions h2{max-width:none}.article-header{min-height:0;padding:30px 0}.article-header h1{font-size:34px}.article-layout{display:flex;flex-direction:column;gap:20px}.article-body{width:100%;padding:28px 30px}.guide-aside{position:static;width:100%;order:-1}.journal-nav{padding:16px 20px}.journal-nav h2{margin-bottom:10px;font-size:13px}.journal-nav ol{display:grid;grid-template-columns:1fr 1fr;column-gap:24px}.journal-nav a{padding:9px 0}.aside-link{display:none}.toolbar{align-items:flex-start;flex-direction:column}.search,.search input{width:100%}.footer{font-size:9px}.guide-item{padding:25px;gap:20px;grid-template-columns:46px 1fr}.guide-number{font-size:29px}.guide-item h2{font-size:23px}}
@media(max-width:440px){.wrap{width:calc(100% - 28px)}.preview{font-size:8px;padding:5px 10px}.brand{gap:9px}.brand-name{font-size:17px;letter-spacing:.5px}.brand-name small{font-size:7px;letter-spacing:2px}.sigil{width:30px;height:37px;font-size:22px}.nav-links{gap:15px;font-size:9px}.nav:after{left:55%}.hero h1{font-size:33px;letter-spacing:-.7px}.intro{font-size:14px}.update{padding:23px;margin-bottom:35px}.section-head{display:block}.section-head h2{font-size:25px}.section-head p{margin-top:8px}.filters{gap:5px}.filters button{padding:8px 10px;font-size:10px}.questions{padding-top:45px}.footer{flex-direction:column;gap:8px}.article-header h1{font-size:28px;letter-spacing:-.6px}.article-header .eyebrow{font-size:9px}.crumbs{margin-bottom:20px}.article-body{padding:26px 22px}.article-body .lead{font-size:15px}.article-body h2{font-size:21px}.quick-answer{padding:15px}.quick-answer>strong{font-size:20px}th,td{padding:10px;font-size:11px}.journal-nav ol{column-gap:16px}.journal-nav a{font-size:10px}.guide-item{grid-template-columns:1fr}.guide-number{display:none}.guide-item h2{font-size:21px}}
@media(prefers-reduced-motion:no-preference){a,button{transition:color .15s,border-color .15s,background-color .15s}}

/* Shared game-like reading face; navigation and tiny metadata stay sans-serif. */
.intro,.description,.update p,.article-body,.questions details p,.scope p{font-family:var(--game-font);font-size:17px}.brand-name{font-weight:400;letter-spacing:.2px}.tool-switch{display:flex;gap:18px;font-size:11px;padding:13px 0;border-bottom:1px solid #404437}.tool-switch a{text-decoration:none;color:#9ca8a2}.tool-switch a[aria-current=page]{color:var(--gold)}
