:root{--bg0:#0e1326;--bg1:#151b36;--bg2:#1f1b3d;--bg3:#0f2a33;--ink:#f3eedf;--muted:#c4bdd6;--gold:#f2c96b;--gold2:#ffe9a8;--teal:#5eead4;--lav:#c4b5fd;--card:rgba(28,32,64,.66);--card-b:rgba(242,201,107,.22);--btn-ink:#1a1530;--ring:#5eead4;--shadow:0 18px 40px -18px rgba(0,0,0,.7);--glow:0 0 32px rgba(242,201,107,.35);--chip:rgba(94,234,212,.12);--chip-ink:#99f6e4;--soon:rgba(196,181,253,.16);--soon-ink:#ddd6fe;color-scheme:dark light}
@media (prefers-color-scheme:light){:root{--bg0:#fbf7ec;--bg1:#fdf8ea;--bg2:#efeafd;--bg3:#e3f6f2;--ink:#2a2340;--muted:#5d5576;--gold:#a6731c;--gold2:#7a5312;--teal:#0f766e;--lav:#6d28d9;--card:rgba(255,255,255,.74);--card-b:rgba(166,115,28,.22);--btn-ink:#2a1d05;--ring:#0f766e;--shadow:0 16px 36px -20px rgba(80,60,20,.35);--glow:0 0 28px rgba(242,201,107,.5);--chip:rgba(15,118,110,.1);--chip-ink:#0f5e57;--soon:rgba(109,40,217,.1);--soon-ink:#5b21b6}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;min-height:100%;background:var(--bg0)}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;color:var(--ink);line-height:1.6;font-family:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,Cambria,serif;background:radial-gradient(ellipse 80% 50% at 50% -5%,rgba(242,201,107,.28),transparent 70%),radial-gradient(ellipse 60% 40% at 90% 30%,rgba(94,234,212,.12),transparent 70%),radial-gradient(ellipse 60% 40% at 5% 70%,rgba(196,181,253,.14),transparent 70%),linear-gradient(170deg,var(--bg1) 0%,var(--bg2) 55%,var(--bg3) 100%)}
.sans{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
a{color:var(--teal)}
a:focus-visible,.btn:focus-visible{outline:3px solid var(--ring);outline-offset:3px;border-radius:10px}
.skip{position:absolute;left:-999px;top:0;background:var(--bg1);color:var(--ink);padding:.5rem 1rem;border-radius:0 0 12px 0;z-index:9}
.skip:focus{left:0}
.sr{position:absolute;width:0;height:0;overflow:hidden}
.wrap{width:100%;max-width:1120px;margin:0 auto;padding:0 1.25rem}
main{flex:1}
.hero{text-align:center;padding:5rem 0 3.5rem;position:relative;overflow:hidden}
.sigil{width:120px;height:120px;display:block;margin:0 auto 1.25rem;filter:drop-shadow(0 0 18px rgba(242,201,107,.55));animation:glow 5s ease-in-out infinite}
.sigil .spin{transform-origin:50% 50%;animation:spin 60s linear infinite}
.eyebrow{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;letter-spacing:.32em;text-transform:uppercase;font-size:.8rem;color:var(--teal);margin:0 0 .6rem;font-weight:600}
h1{font-size:clamp(2.4rem,7vw,4.6rem);line-height:1.05;margin:0 0 1rem;font-weight:700;letter-spacing:.01em;background:linear-gradient(180deg,var(--gold2),var(--gold) 60%,#c99a3f);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 40px rgba(242,201,107,.15)}
h1 .dot{color:var(--lav);-webkit-text-fill-color:var(--lav)}
.tagline{font-size:clamp(1.1rem,2.6vw,1.4rem);color:var(--muted);margin:0 auto 2rem;max-width:38rem;font-style:italic}
.actions{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.6rem;border-radius:12px;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-weight:700;font-size:1rem;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}
.btn-gold{color:#2a1d05;background:linear-gradient(180deg,#ffe9a8,#f2c96b);box-shadow:var(--glow)}
.btn-ghost{color:var(--ink);border:1px solid var(--card-b);background:var(--card)}
.btn:hover{transform:translateY(-2px)}
.motes{position:absolute;inset:0;pointer-events:none}
.motes span{position:absolute;bottom:-10px;width:6px;height:6px;border-radius:50%;background:var(--gold2);box-shadow:0 0 10px 3px rgba(242,201,107,.6);opacity:0;animation:rise 9s ease-in infinite}
.motes span:nth-child(1){left:12%}
.motes span:nth-child(2){left:26%;animation-delay:2.5s;background:var(--teal);box-shadow:0 0 10px 3px rgba(94,234,212,.5)}
.motes span:nth-child(3){left:44%;animation-delay:5s}
.motes span:nth-child(4){left:63%;animation-delay:1.2s;background:var(--lav);box-shadow:0 0 10px 3px rgba(196,181,253,.5)}
.motes span:nth-child(5){left:78%;animation-delay:3.8s}
.motes span:nth-child(6){left:90%;animation-delay:6.4s;background:var(--teal);box-shadow:0 0 10px 3px rgba(94,234,212,.5)}
section{margin:0 0 4rem;scroll-margin-top:1rem}
.sec-head{text-align:center;margin:0 auto 1.8rem;max-width:40rem}
h2{font-size:clamp(1.6rem,3.5vw,2.1rem);margin:0 0 .4rem;color:var(--gold2);font-weight:700}
.sec-head p{margin:0;color:var(--muted)}
.divider{display:block;width:220px;height:18px;margin:.5rem auto 0;color:var(--gold)}
.grid{display:grid;gap:1.1rem;list-style:none;margin:0;padding:0}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
.card{position:relative;background:var(--card);border:1px solid var(--card-b);border-radius:18px;box-shadow:var(--shadow);padding:1.5rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(180deg,rgba(242,201,107,.08),transparent 40%)}
.class-card{transition:transform .25s ease,border-color .25s ease}
.class-card:hover{transform:translateY(-3px);border-color:var(--gold)}
.class-top{display:flex;align-items:center;gap:.9rem;margin-bottom:.7rem}
.crest{width:52px;height:52px;flex:none;color:var(--accent,var(--gold))}
.class-card h3,.card h3{margin:0;font-size:1.3rem;color:var(--ink)}
.role{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--chip-ink);background:var(--chip);border-radius:999px;padding:.15rem .6rem;display:inline-block;margin-top:.2rem}
.card p{margin:.4rem 0 0;color:var(--muted)}
.c-priest{--accent:#f5f0e1}
.c-paladin{--accent:#f2c96b}
.c-druid{--accent:#f59e57}
.c-shaman{--accent:#60a5fa}
@media (prefers-color-scheme:light){.c-priest{--accent:#8a7a52}.c-paladin{--accent:#a6731c}.c-druid{--accent:#c2410c}.c-shaman{--accent:#1d4ed8}}
.note{text-align:center;color:var(--muted);font-size:.95rem;margin:1.2rem auto 0;max-width:44rem}
.soon{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;position:absolute;top:1rem;right:1rem;font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--soon-ink);background:var(--soon);border:1px solid var(--soon-ink);border-radius:999px;padding:.12rem .55rem}
.guide h3{padding-right:6.5rem}
.icon{width:40px;height:40px;color:var(--teal);margin-bottom:.6rem;display:block}
footer{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;text-align:center;padding:2rem 1rem 2.6rem;color:var(--muted);font-size:.9rem;border-top:1px solid var(--card-b)}
footer nav{display:flex;gap:1.2rem;justify-content:center;flex-wrap:wrap;margin-bottom:.5rem}
footer p{margin:.2rem 0}
.center{text-align:center}
.lost{padding:6rem 0 4rem}
.lost .code{font-size:clamp(4rem,14vw,7rem);font-weight:700;line-height:1;margin:0;color:var(--gold)}
.lost h1{font-size:clamp(1.8rem,5vw,2.6rem)}
@keyframes glow{0%,100%{filter:drop-shadow(0 0 14px rgba(242,201,107,.45))}50%{filter:drop-shadow(0 0 28px rgba(242,201,107,.8))}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes rise{0%{transform:translateY(0);opacity:0}15%{opacity:.9}100%{transform:translateY(-420px);opacity:0}}
@media (max-width:900px){.g3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.g3,.g2{grid-template-columns:1fr}.hero{padding:3.5rem 0 2.5rem}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.motes{display:none}}
.c-gold{--accent:#f2c96b}
.c-teal{--accent:#5eead4}
.c-lavender{--accent:#c4b5fd}
@media (prefers-color-scheme:light){.c-gold{--accent:#a6731c}.c-teal{--accent:#0f766e}.c-lavender{--accent:#6d28d9}}
.topbar{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;border-bottom:1px solid var(--card-b);background:rgba(14,19,38,.35);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
@media (prefers-color-scheme:light){.topbar{background:rgba(255,255,255,.5)}}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:3.6rem;flex-wrap:wrap}
.brand{display:inline-flex;align-items:center;gap:.55rem;color:var(--gold2);text-decoration:none;font-weight:700;letter-spacing:.02em}
.brand svg{width:28px;height:28px}
.topbar nav{display:flex;gap:1.1rem;flex-wrap:wrap}
.topbar nav a{color:var(--muted);text-decoration:none;font-weight:600;font-size:.95rem;padding:.3rem 0;border-bottom:2px solid transparent}
.topbar nav a:hover,.topbar nav a[aria-current=page]{color:var(--ink);border-bottom-color:var(--gold)}
@media (max-width:620px){.topbar .wrap{gap:.2rem 1rem;padding-top:.55rem;padding-bottom:.55rem;min-height:0}.topbar nav{gap:.1rem .85rem;width:100%}.topbar nav a{font-size:.9rem;padding:.25rem 0}}
.link-card{display:block;color:inherit;text-decoration:none;height:100%}
.link-card:hover{border-color:var(--gold)}
.link-card:focus-visible{outline:3px solid var(--ring);outline-offset:3px;border-radius:18px}
.grid>li{display:flex;flex-direction:column}
.grid>li>.card,.grid>li>.link-card{flex:1}
.more{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;display:inline-block;margin-top:.8rem;font-weight:600;color:var(--teal);font-size:.92rem}
.center-more{text-align:center;margin-top:1.4rem}
.meta{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:.85rem;color:var(--teal);margin:0 0 .3rem;letter-spacing:.04em}
.page-head{text-align:center;padding:3.5rem 0 2rem}
.page-head h1{font-size:clamp(2rem,5.5vw,3.2rem)}
.page-head p{color:var(--muted);max-width:40rem;margin:0 auto}
.page-head .crest{width:72px;height:72px;margin:0 auto .8rem;display:block}
.crumbs{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:.88rem;margin:0 0 1rem;color:var(--muted)}
.crumbs a{color:var(--muted)}
.article{max-width:46rem;margin:0 auto 4rem;padding:2rem clamp(1.2rem,4vw,2.6rem)}
.cover{display:block;width:100%;height:auto;border-radius:14px;margin:0 0 1.4rem;border:1px solid var(--card-b)}
.card-cover{display:block;width:calc(100% + 3rem);max-width:none;height:160px;object-fit:cover;margin:-1.5rem -1.5rem 1rem;border-radius:18px 18px 0 0}
.prose{font-size:1.08rem}
.prose>:first-child{margin-top:0}
.prose h1,.prose h2,.prose h3,.prose h4{color:var(--gold2);line-height:1.25;margin:1.8rem 0 .6rem;background:none;-webkit-text-fill-color:currentColor;font-size:revert}
.prose h1{font-size:1.9rem}.prose h2{font-size:1.55rem}.prose h3{font-size:1.25rem}
.prose p,.prose ul,.prose ol{margin:0 0 1rem}
.prose li{margin:.25rem 0}
.prose img{max-width:100%;height:auto;border-radius:12px}
.prose blockquote{margin:1rem 0;padding:.4rem 1.1rem;border-left:3px solid var(--lav);color:var(--muted);background:var(--soon);border-radius:0 12px 12px 0}
.prose code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em;background:var(--chip);padding:.1rem .35rem;border-radius:6px}
.prose pre{overflow:auto;background:rgba(0,0,0,.3);padding:1rem;border-radius:12px}
.prose pre code{background:none;padding:0}
.prose table{border-collapse:collapse;width:100%;margin:0 0 1rem;display:block;overflow-x:auto}
.prose th,.prose td{border:1px solid var(--card-b);padding:.45rem .7rem;text-align:left}
.prose hr{border:0;border-top:1px solid var(--card-b);margin:2rem 0}
.article .soon{position:static;display:inline-block;margin-bottom:1rem}
.empty{text-align:center;color:var(--muted)}
.news-list{max-width:46rem;margin:0 auto}
.news-list li+li{margin-top:1.1rem}
.spec-links{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0 0}
.spec-links a,.spec-tabs a{display:inline-block;padding:.35rem .85rem;border-radius:999px;background:var(--chip);color:var(--chip-ink);font-weight:600;font-size:.9rem;text-decoration:none}
.spec-links a:hover,.spec-tabs a:hover{filter:brightness(1.15)}
.spec-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin:1.2rem 0 0}
.spec-tabs a[aria-current]{background:var(--gold);color:#1b1305}
.spec-grid{margin-bottom:1.5rem}
.intro{margin-bottom:2rem}
.phase{margin:0 0 2.8rem}
.phase-note{max-width:52rem;margin:0 auto 1.4rem;color:var(--muted)}
.bis-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,30rem),1fr));gap:1rem}
.bis-slot{padding:1rem 1.1rem;overflow-x:auto}
.bis-slot h3{margin:0 0 .6rem;font-size:1.05rem;color:var(--gold2)}
table.bis{width:100%;border-collapse:collapse;font-size:.93rem}
table.bis th{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);text-align:left;padding:.3rem .45rem;border-bottom:1px solid var(--card-b)}
table.bis td{padding:.45rem;border-bottom:1px solid var(--card-b);vertical-align:top}
table.bis tr:last-child td{border-bottom:0}
table.bis td.rank{white-space:nowrap;color:var(--muted);width:1%}
table.bis small{display:block;color:var(--muted);font-size:.8rem;margin-top:.15rem}
.guide-body{max-width:52rem;margin:0 auto 2rem}
.sources{max-width:52rem;margin:0 auto 2rem;padding:1.1rem 1.4rem;font-size:.92rem}
.sources h2{font-size:1.1rem;margin:0 0 .4rem}
.sources .prose{font-size:.92rem;color:var(--muted)}
.g2{grid-template-columns:repeat(auto-fill,minmax(min(100%,20rem),1fr))}