:root{--bg:#050b14;--surface:#0b1422;--surface-2:#101d2d;--line:#1e3043;--text:#f5f7fa;--muted:#93a5b7;--cyan:#53d8ff;--blue:#168fff;--gold:#d7b875;--serif:'Cinzel',serif;--sans:'Inter',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.55}a{color:inherit;text-decoration:none}button{font:inherit}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,76px);position:fixed;z-index:20;top:0;width:100%;background:linear-gradient(180deg,rgba(5,11,20,.98),rgba(5,11,20,.78));border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(14px)}.brand{display:flex;gap:11px;align-items:center;min-width:max-content}.brand-mark{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--cyan);font-family:var(--serif);font-size:24px;transform:rotate(45deg);color:var(--cyan);box-shadow:inset 0 0 20px rgba(83,216,255,.12)}.brand-mark::first-letter{transform:rotate(-45deg)}.brand>span:last-child{display:grid;line-height:1.05;letter-spacing:.16em}.brand b{font-family:var(--serif);font-size:14px}.brand small{font-size:8px;color:var(--muted);margin-top:5px}.desktop-nav{display:flex;gap:34px;height:100%;align-items:center}.desktop-nav a{height:100%;display:flex;align-items:center;font-size:14px;color:#c5d0db;position:relative}.desktop-nav a:hover,.desktop-nav a.active{color:white}.desktop-nav .active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--cyan);box-shadow:0 0 12px var(--cyan)}.header-actions{display:flex;gap:10px}.search,.menu{width:42px;height:42px;border:1px solid var(--line);background:rgba(14,27,43,.7);color:white;border-radius:3px;font-size:22px;cursor:pointer}.menu{display:none}.mobile-nav{position:fixed;z-index:19;top:76px;width:100%;background:#091321;padding:18px 24px;border-bottom:1px solid var(--line)}.mobile-nav a{display:block;padding:12px}.hero{height:min(790px,88vh);min-height:650px;position:relative;display:flex;align-items:center;overflow:hidden}.hero>img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,8,15,.98) 2%,rgba(3,8,15,.8) 32%,rgba(3,8,15,.15) 70%),linear-gradient(0deg,var(--bg),transparent 25%)}.hero-content{z-index:1;position:relative;max-width:680px;margin-left:clamp(24px,8vw,130px);padding-top:52px}.eyebrow{display:block;text-transform:uppercase;letter-spacing:.22em;font-weight:700;font-size:12px;color:var(--cyan);margin-bottom:14px}.hero h1{font-family:var(--serif);font-size:clamp(44px,6.2vw,84px);line-height:1.02;margin:0 0 22px;letter-spacing:-.035em}.hero h1 em{font-style:normal;color:var(--cyan);text-shadow:0 0 34px rgba(83,216,255,.35)}.hero p{font-size:18px;color:#bfccd9;max-width:600px}.hero-actions{display:flex;gap:12px;margin:32px 0}.button{min-height:48px;padding:0 22px;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;gap:18px;text-transform:uppercase;font-size:12px;font-weight:700;letter-spacing:.08em;cursor:pointer}.button.primary{border-color:#31bbeb;background:linear-gradient(135deg,#187ca9,#12a4dd);color:#fff;box-shadow:0 10px 35px rgba(16,151,205,.18)}.button.secondary{background:rgba(7,16,27,.72)}.hero-stats{display:flex;gap:26px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.06em}.hero-stats b{color:white;font-size:15px;margin-right:4px}.hero-stats i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#50d890;margin-right:6px;box-shadow:0 0 9px #50d890}.ad{border:1px dashed #29435b;background:rgba(12,24,39,.6);display:grid;place-items:center;color:#7990a6;text-align:center}.ad span{font-size:9px;letter-spacing:.2em}.ad strong{color:#9eb0c1;font-size:14px}.ad small{font-size:11px}.ad-top{height:90px;max-width:900px;margin:22px auto 80px}.section,.content-band{padding:80px clamp(24px,8vw,130px);max-width:1500px;margin:auto}.content-band{max-width:none;background:#08111d;border-top:1px solid #13263a;border-bottom:1px solid #13263a}.content-band>*{max-width:1240px;margin-left:auto;margin-right:auto}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:34px}.section-heading h2{font-family:var(--serif);font-size:clamp(28px,3vw,42px);margin:0}.section-heading .eyebrow{margin-bottom:6px}.section-heading>a{font-size:13px;color:var(--cyan)}.combo-card{min-height:330px;border:1px solid var(--line);background:radial-gradient(circle at 85% 20%,rgba(26,142,202,.2),transparent 35%),linear-gradient(135deg,#0b1726,#07101b);display:grid;grid-template-columns:.85fr 1.4fr;padding:46px;align-items:center;gap:45px;position:relative;overflow:hidden}.combo-card:before{content:"COMBO";position:absolute;right:-20px;top:-45px;font-family:var(--serif);font-size:150px;color:rgba(255,255,255,.018)}.class-label{display:flex;align-items:center;gap:15px}.class-icon{width:54px;height:54px;border:1px solid #41617b;background:#142538;display:grid;place-items:center;font-size:24px}.class-label>span:last-child{display:grid}.class-label small,.guide-list small{font-size:10px;color:var(--cyan);letter-spacing:.15em}.class-label b{font-family:var(--serif);font-size:22px}.combo-info p{color:var(--muted);font-size:14px}.tags{display:flex;flex-wrap:wrap;gap:7px;margin:20px 0}.tags span{border:1px solid var(--line);padding:4px 9px;font-size:10px;color:#b3c0cb}.play-combo{border:0}.combo-flow{display:flex;align-items:center;justify-content:center;gap:10px;position:relative}.combo-flow>i{color:#4c657b;font-size:28px}.skill{display:grid;justify-items:center;gap:8px;position:relative;min-width:72px}.skill b{width:66px;height:66px;border:1px solid #3a4c60;background:linear-gradient(145deg,#192b40,#0b1625);display:grid;place-items:center;font-size:28px;box-shadow:inset 0 0 22px rgba(0,0,0,.6);transition:.25s}.skill small{font-size:10px;color:#8496a7}.skill .key{position:absolute;right:0;top:-7px;z-index:2;background:#07101b;border:1px solid #3c5369;border-radius:50%;width:21px;height:21px;text-align:center;font-size:10px;line-height:19px}.skill.active b,.skill.complete b{border-color:var(--cyan);box-shadow:0 0 24px rgba(83,216,255,.45),inset 0 0 20px rgba(83,216,255,.15);transform:translateY(-5px)}.class-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.class-grid article{border:1px solid var(--line);background:var(--surface);min-height:102px;padding:20px;display:flex;align-items:center;gap:15px;transition:.2s}.class-grid article:hover{border-color:#3c6683;background:var(--surface-2);transform:translateY(-2px)}.class-grid article>span{font-size:27px}.class-grid h3{font-family:var(--serif);font-size:15px;margin:0}.class-grid p{font-size:11px;color:var(--muted);margin:2px 0}.class-grid article>b{margin-left:auto;color:var(--cyan)}.guide-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:46px}.featured-guide{display:grid;grid-template-columns:180px 1fr;gap:28px;align-items:center}.featured-guide .art{height:230px;display:grid;place-items:center;font-size:80px;color:var(--cyan);background:radial-gradient(circle,rgba(83,216,255,.25),transparent 48%),linear-gradient(145deg,#122238,#08111d);border:1px solid var(--line)}.category{font-size:10px;color:var(--cyan);letter-spacing:.16em}.featured-guide h3{font-family:var(--serif);font-size:25px;line-height:1.25}.featured-guide p{color:var(--muted);font-size:14px}.featured-guide a{color:var(--cyan);font-size:12px;font-weight:700}.guide-list article{display:grid;grid-template-columns:48px 1fr;gap:14px;padding:15px 0;border-bottom:1px solid var(--line)}.number{font-family:var(--serif);font-size:24px;color:#476178}.guide-list h3{font-size:15px;margin:4px 0}.guide-list p{font-size:12px;color:var(--muted);margin:0}.news-layout{display:grid;grid-template-columns:1fr 320px;gap:70px}.news{display:grid;grid-template-columns:100px 1fr;gap:24px;padding:24px 0;border-top:1px solid var(--line)}.news time{font-size:10px;color:#7690a6;letter-spacing:.1em}.news span{font-size:10px;color:var(--cyan)}.news h3{font-family:var(--serif);margin:5px 0}.news p{margin:0;color:var(--muted);font-size:13px}.ad-box{height:280px;margin-top:55px}footer{border-top:1px solid var(--line);padding:45px clamp(24px,8vw,130px);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:50px;color:var(--muted);font-size:11px}footer p{max-width:560px}footer>div:last-child{display:flex;gap:20px}.search-dialog{width:min(620px,90vw);border:1px solid #34556e;background:#0a1625;color:white;padding:38px;box-shadow:0 30px 100px #000;border-radius:4px}.search-dialog::backdrop{background:rgba(1,5,10,.8);backdrop-filter:blur(8px)}.search-dialog button{position:absolute;right:15px;top:8px;background:none;border:0;color:#9fb2c4;font-size:26px}.search-dialog label{font-family:var(--serif);font-size:24px;display:block;margin-bottom:20px}.search-dialog input{width:100%;height:54px;background:#07101b;border:1px solid #36536b;color:white;padding:0 16px;font-size:16px}.search-dialog p{color:var(--muted);font-size:12px}
/* Combo explorer */
.source-note{font-size:11px;color:#748ba0;text-transform:uppercase;letter-spacing:.08em}.combo-tabs{display:flex;gap:8px;overflow-x:auto;padding:0 0 14px;scrollbar-width:thin}.combo-tabs button{flex:0 0 auto;min-height:47px;padding:0 16px;border:1px solid var(--line);background:#091421;color:#92a5b6;cursor:pointer;font-size:12px;display:flex;gap:8px;align-items:center}.combo-tabs button:hover,.combo-tabs button[aria-selected="true"]{border-color:var(--cyan);color:#fff;background:#102337;box-shadow:inset 0 -2px var(--cyan)}.combo-tabs button span{font-size:18px}.class-icon img{width:100%;height:100%;object-fit:cover}.skill b img{width:100%;height:100%;object-fit:cover;display:block}.skill strong{font-size:10px;font-weight:700;max-width:86px;text-align:center;line-height:1.2}.combo-tip{font-size:12px;color:var(--muted);text-align:center;margin:22px 0 0}.combo-tip b{color:var(--gold)}
@media(max-width:980px){.desktop-nav{display:none}.menu{display:block}.combo-card{grid-template-columns:1fr;padding:32px}.class-grid{grid-template-columns:repeat(2,1fr)}.guide-grid{grid-template-columns:1fr}.news-layout{grid-template-columns:1fr}.ad-box{width:100%;max-width:500px;margin:0 auto}footer{grid-template-columns:1fr;text-align:center;justify-items:center}}
@media(max-width:620px){.topbar{height:66px}.brand-mark{width:34px;height:34px;font-size:20px}.hero{min-height:720px;height:94vh;align-items:flex-end}.hero>img{object-position:62% center}.hero-shade{background:linear-gradient(0deg,var(--bg) 3%,rgba(3,8,15,.82) 58%,rgba(3,8,15,.1)),linear-gradient(90deg,rgba(3,8,15,.8),transparent)}.hero-content{margin:0;padding:110px 24px 70px}.hero p{font-size:16px}.hero-actions{flex-direction:column}.button{width:100%}.hero-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px 16px}.ad-top{margin:20px 16px 36px;height:100px}.section,.content-band{padding:55px 20px}.section-heading{align-items:flex-start;gap:15px}.section-heading>a{display:none}.combo-card{padding:26px 18px}.combo-flow{overflow-x:auto;justify-content:flex-start;padding:18px 2px}.skill{min-width:64px}.skill b{width:56px;height:56px}.class-grid{grid-template-columns:1fr}.featured-guide{grid-template-columns:1fr}.featured-guide .art{height:150px}.news{grid-template-columns:1fr;gap:5px}footer>div:last-child{flex-wrap:wrap;justify-content:center}.search{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Class catalog and complete guide */
.class-card{border:1px solid var(--line);background:var(--surface);min-height:102px;padding:14px;display:flex;align-items:center;gap:15px;transition:.2s}.class-card:hover{border-color:#3c6683;background:var(--surface-2);transform:translateY(-2px)}.class-card>img{width:64px;height:64px;object-fit:cover;object-position:top;border:1px solid #2a455b;background:#07101b}.class-card>b{margin-left:auto;color:var(--cyan)}.back-link{font-size:12px;color:var(--cyan);align-self:center}.class-page{padding-top:76px}.class-hero{min-height:390px;padding:70px clamp(24px,8vw,130px);display:flex;align-items:center;gap:48px;background:radial-gradient(circle at 20%,rgba(108,46,157,.35),transparent 28%),linear-gradient(135deg,#0b1020,#07101b);border-bottom:1px solid var(--line)}.class-hero>img{width:220px;height:220px;object-fit:cover;object-position:top;border:1px solid #45345d;box-shadow:0 20px 70px rgba(0,0,0,.5)}.class-hero h1{font-family:var(--serif);font-size:clamp(46px,7vw,82px);margin:0}.class-hero p{max-width:650px;color:var(--muted)}.build-tabs{display:flex;gap:8px;margin-top:25px}.build-tabs button{padding:11px 20px;border:1px solid var(--line);background:#0d1928;color:#91a4b5;cursor:pointer}.build-tabs button[aria-selected="true"]{border-color:var(--cyan);color:#fff;background:#123047}.build-panel{display:none;max-width:1300px;margin:auto;padding:65px clamp(20px,6vw,70px)}.build-panel.active{display:block}.build-head{margin-bottom:36px}.build-head h2{font-family:var(--serif);font-size:36px;margin:5px 0}.build-head p{color:var(--muted)}.ability-section{margin:35px 0}.ability-title{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);margin-bottom:18px}.ability-title h2{font-family:var(--serif);font-size:20px}.ability-title span{font-size:10px;color:var(--cyan);text-transform:uppercase}.ability-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.ability-grid.compact{grid-template-columns:repeat(2,1fr)}.ability-card{display:flex;gap:14px;padding:15px;background:var(--surface);border:1px solid var(--line);min-height:94px}.ability-card img{width:62px;height:62px;object-fit:cover;border:1px solid #40556b;flex:none}.ability-card h3{font-size:13px;margin:1px 0;color:#fff}.ability-card p{font-size:11px;margin:3px 0;color:var(--cyan)}.ability-card small{display:block;font-size:10px;color:var(--muted);line-height:1.35}.ability-columns{display:grid;grid-template-columns:1.1fr .9fr;gap:28px}.strategy{margin-top:35px;padding:28px;border-left:3px solid var(--gold);background:linear-gradient(90deg,rgba(215,184,117,.1),transparent)}.strategy span{font-size:10px;letter-spacing:.16em;color:var(--gold)}.strategy p{margin-bottom:0;color:#c0cad4}
@media(max-width:980px){.ability-grid{grid-template-columns:repeat(2,1fr)}.ability-columns{grid-template-columns:1fr}}
@media(max-width:620px){.class-page{padding-top:66px}.class-hero{padding:50px 20px;display:grid;gap:20px}.class-hero>img{width:130px;height:130px}.class-hero h1{font-size:44px}.build-tabs{overflow-x:auto}.ability-grid,.ability-grid.compact{grid-template-columns:1fr}.ability-card{min-height:88px}.back-link{display:none}}
.skill-catalog{max-width:1300px;margin:0 auto;padding:70px clamp(20px,6vw,70px);border-top:1px solid var(--line)}.skill-catalog>header h2{font-family:var(--serif);font-size:36px;margin:4px 0}.skill-catalog>header p{color:var(--muted)}.catalog-section{margin-top:38px}.catalog-heading{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);margin-bottom:15px}.catalog-heading h3{font-family:var(--serif)}.catalog-heading span{font-size:11px;color:var(--cyan)}.catalog-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.catalog-grid article{display:flex;align-items:center;gap:10px;padding:10px;background:#091421;border:1px solid var(--line);font-size:11px}.catalog-grid img{width:46px;height:46px;object-fit:cover;flex:none}@media(max-width:900px){.catalog-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.catalog-grid{grid-template-columns:1fr}}