:root {
  --ink: #f4f0e7;
  --muted: #98a1a5;
  --gold: #d7a84d;
  --gold-light: #f1cf7b;
  --gold-dark: #8f692e;
  --night: #070d11;
  --panel: #0c151b;
  --panel-2: #111d24;
  --line: rgba(216, 177, 91, .18);
  --teal: #47c6ad;
  --serif: "Cinzel", Georgia, serif;
  --sans: "Manrope", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--night); color: var(--ink); font-family: var(--sans); line-height: 1.6; overflow-x: hidden; }
body.modal-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
.container { width: min(1160px, calc(100% - 48px)); margin-inline: auto; }
.skip-link { position: fixed; top: -60px; left: 20px; z-index: 200; padding: 10px 16px; background: var(--gold); color: #101010; }
.skip-link:focus { top: 16px; }

.site-header { position: fixed; z-index: 100; width: 100%; top: 0; border-bottom: 1px solid rgba(255,255,255,.07); background: rgba(6,12,16,.78); backdrop-filter: blur(18px); transition: .3s ease; }
.site-header.scrolled { background: rgba(6,12,16,.96); box-shadow: 0 12px 40px rgba(0,0,0,.25); }
.nav-shell { max-width: 1320px; min-height: 82px; padding: 0 32px; margin: auto; display: flex; align-items: center; gap: 36px; }
.brand { display: inline-flex; align-items: center; gap: 12px; flex-shrink: 0; }
.brand-name { font-family: var(--serif); font-size: 21px; line-height: .9; letter-spacing: .08em; color: var(--gold-light); font-weight: 700; text-shadow: 0 2px 15px rgba(215,168,77,.16); }
.brand-name small, .dash-brand small, .download-emblem small { display: block; font-family: var(--sans); font-size: 8px; letter-spacing: .48em; text-align: center; color: #d8d7d1; margin-top: 8px; }
.brand-mark { width: 38px; height: 45px; position: relative; display: inline-grid; place-items: center; filter: drop-shadow(0 3px 8px rgba(215,168,77,.25)); }
.brand-mark::before, .brand-mark::after { content: ""; position: absolute; background: linear-gradient(#f0ce7b,#9c702d); }
.brand-mark::before { width: 3px; height: 40px; transform: rotate(45deg); }
.brand-mark::after { width: 3px; height: 40px; transform: rotate(-45deg); }
.brand-mark span { width: 13px; height: 13px; border: 2px solid var(--gold-light); transform: rotate(45deg); background: #101920; z-index: 1; }
.main-nav { display: flex; align-items: center; gap: 28px; margin: 0 auto; }
.main-nav a { color: #aab0b2; font-size: 13px; font-weight: 600; position: relative; white-space: nowrap; transition: .2s; }
.main-nav a:hover, .main-nav a.active { color: #fff; }
.main-nav a.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -29px; height: 2px; background: var(--gold); }
.nav-actions { display: flex; gap: 10px; }
.nav-session { align-items: center; gap: 12px; }
.session-user { min-width: 145px; display: flex; align-items: center; flex: 0 0 auto; gap: 9px; padding: 0 16px; border-left: 1px solid rgba(255,255,255,.12); }
.session-user > i { width: 8px; height: 8px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 9px var(--teal); }
.session-user span { min-width: 0; line-height: 1.2; }
.session-user small { display: block; color: #6f7a7d; text-transform: uppercase; letter-spacing: .14em; font-size: 6px; font-weight: 600; }
.session-user strong { display: block; max-width: 150px; overflow: hidden; color: var(--gold-light); text-overflow: ellipsis; white-space: nowrap; font-size: 9px; }
.button { border: 1px solid transparent; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 42px; padding: 0 20px; font-weight: 800; font-size: 12px; letter-spacing: .02em; transition: .25s ease; }
.button:hover { transform: translateY(-2px); }
.button-gold { color: #15120b; background: linear-gradient(135deg, #edc867, #bc8938); box-shadow: inset 0 1px rgba(255,255,255,.35), 0 8px 26px rgba(191,138,55,.16); }
.button-gold:hover { background: linear-gradient(135deg, #f4d77e, #cf9b45); box-shadow: 0 10px 35px rgba(215,168,77,.25); }
.button-ghost { background: transparent; color: #ddd; border-color: rgba(255,255,255,.15); }
.button-glass { background: rgba(15,24,30,.6); color: white; border-color: rgba(255,255,255,.18); backdrop-filter: blur(8px); }
.button-large { min-height: 54px; padding: 0 28px; }
.menu-toggle { display: none; border: 0; background: transparent; padding: 8px; }
.menu-toggle span { display: block; width: 24px; height: 2px; margin: 5px; background: white; }

.hero { min-height: 790px; height: 100svh; max-height: 940px; position: relative; display: flex; align-items: center; isolation: isolate; overflow: hidden; }
.hero-art { position: absolute; inset: 0; z-index: -3; background: var(--hero-image, url("assets/daybreak-hero.png")) center / cover no-repeat; animation: heroReveal 1.8s ease both; }
.hero-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(3,8,12,.98) 0%, rgba(5,10,14,.88) 26%, rgba(5,10,14,.42) 55%, rgba(5,10,14,.08) 85%), linear-gradient(0deg, var(--night) 0%, transparent 24%), linear-gradient(180deg, rgba(3,8,12,.2), transparent 35%); }
.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .16; pointer-events: none; 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='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E"); }
.hero-content { padding-top: 70px; }
.eyebrow { margin: 0 0 20px; color: var(--gold-light); text-transform: uppercase; letter-spacing: .24em; font-size: 10px; font-weight: 800; }
.eyebrow span { display: inline-block; vertical-align: middle; width: 32px; height: 1px; background: var(--gold); margin-right: 12px; }
.hero h1, h2 { font-family: var(--serif); font-weight: 500; line-height: 1.12; }
.hero h1 { font-size: clamp(48px, 5.6vw, 84px); letter-spacing: -.04em; margin: 0; max-width: 780px; text-shadow: 0 7px 28px rgba(0,0,0,.45); animation: liftIn .8s .15s ease both; }
.hero h1 em { color: var(--gold-light); font-style: normal; }
.hero-copy { max-width: 570px; color: #c0c5c6; font-size: 16px; line-height: 1.8; margin: 24px 0 30px; animation: liftIn .8s .3s ease both; }
.hero-actions { display: flex; gap: 12px; animation: liftIn .8s .45s ease both; }
.play-icon { width: 24px; height: 24px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; font-size: 8px; padding-left: 2px; }
.hero-stats { display: flex; gap: 0; margin: 42px 0 0; animation: liftIn .8s .6s ease both; }
.hero-stats div { min-width: 160px; padding: 0 28px; border-left: 1px solid rgba(255,255,255,.14); }
.hero-stats div:first-child { padding-left: 0; border-left: 0; }
.hero-stats dt { color: #e9e7df; font-family: var(--serif); font-size: 16px; font-weight: 600; }
.hero-stats dd { color: #777f83; font-size: 10px; margin: 1px 0; text-transform: uppercase; letter-spacing: .08em; }
.status-dot { display: inline-block; width: 7px; height: 7px; background: var(--teal); border-radius: 50%; box-shadow: 0 0 9px var(--teal); margin-right: 5px; }
.scroll-cue { position: absolute; bottom: 31px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; color: #8b9293; text-transform: uppercase; font-size: 8px; letter-spacing: .2em; gap: 5px; }
.scroll-cue i { color: var(--gold); font-style: normal; animation: bounce 1.8s infinite; }

.section { padding: 116px 0; position: relative; }
.section-heading { max-width: 710px; margin-bottom: 55px; }
.section-heading.centered { text-align: center; margin-inline: auto; }
.section-heading.centered .eyebrow span:last-child { margin: 0 0 0 12px; }
h2 { font-size: clamp(36px, 4vw, 56px); margin: 0 0 20px; letter-spacing: -.035em; }
.section-heading > p:last-child, .dashboard-intro > p, .classes-layout .class-copy > p, .download-layout > div > p, .join-card > div > p { color: var(--muted); max-width: 640px; }
.world { background: radial-gradient(circle at 50% 20%, rgba(37,76,82,.16), transparent 42%), #080f13; }
.world::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.016) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.016) 1px, transparent 1px); background-size: 80px 80px; mask-image: linear-gradient(transparent, black 25%, transparent); }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid rgba(255,255,255,.08); position: relative; }
.feature-card { min-height: 420px; padding: 54px 42px; background: rgba(10,18,23,.68); border-right: 1px solid rgba(255,255,255,.08); position: relative; transition: .35s; overflow: hidden; }
.feature-card:last-child { border-right: 0; }
.feature-card::after { content: ""; position: absolute; inset: auto 0 0; height: 2px; background: var(--gold); transform: scaleX(0); transition: .35s; }
.feature-card:hover { background: #101b21; transform: translateY(-8px); box-shadow: 0 25px 50px rgba(0,0,0,.25); }
.feature-card:hover::after, .feature-card.featured::after { transform: scaleX(1); }
.feature-number { position: absolute; right: 26px; top: 22px; font-family: var(--serif); color: rgba(255,255,255,.12); font-size: 38px; }
.feature-icon { color: var(--gold-light); font-size: 41px; margin-bottom: 34px; }
.feature-card h3 { font-family: var(--serif); font-size: 21px; margin: 0 0 18px; }
.feature-card p { color: #899296; font-size: 13px; line-height: 1.85; }
.feature-card a { color: var(--gold-light); display: inline-flex; gap: 15px; font-size: 11px; text-transform: uppercase; letter-spacing: .12em; margin-top: 26px; font-weight: 700; }

.classes { overflow: hidden; background: linear-gradient(100deg, #091116 52%, #101d22); border-block: 1px solid rgba(255,255,255,.06); }
.classes::after { content: ""; position: absolute; right: -15%; top: -40%; width: 65%; aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(215,168,77,.08); box-shadow: inset 0 0 100px rgba(60,126,130,.08), 0 0 100px rgba(60,126,130,.05); }
.classes-layout { display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 80px; }
.class-copy { position: relative; z-index: 2; }
.class-tabs { margin-top: 42px; border-top: 1px solid rgba(255,255,255,.08); }
.class-tab { width: 100%; border: 0; border-bottom: 1px solid rgba(255,255,255,.08); padding: 17px 5px; text-align: left; background: transparent; display: flex; align-items: center; gap: 20px; cursor: pointer; color: #6e777a; transition: .25s; }
.class-tab b { font-family: var(--serif); font-size: 11px; }
.class-tab span { font-family: var(--serif); font-size: 15px; }
.class-tab small { display: block; font-family: var(--sans); font-size: 9px; text-transform: uppercase; letter-spacing: .12em; margin-top: 3px; color: #667074; }
.class-tab.active, .class-tab:hover { color: var(--gold-light); padding-left: 12px; }
.class-showcase { min-height: 510px; display: grid; place-items: center; position: relative; z-index: 2; }
.class-rune { width: 360px; height: 360px; border: 1px solid rgba(215,168,77,.2); border-radius: 50%; position: absolute; box-shadow: 0 0 80px rgba(79,168,165,.12), inset 0 0 60px rgba(215,168,77,.04); animation: rotateRune 25s linear infinite; }
.class-rune::before, .class-rune::after { content: ""; position: absolute; border: 1px dashed rgba(215,168,77,.16); border-radius: 50%; inset: 28px; }
.class-rune::after { inset: 80px; border-style: solid; }
.class-glyph { color: var(--gold-light); font-size: 130px; filter: drop-shadow(0 12px 35px rgba(0,0,0,.65)); transform: translateY(-20px); transition: .3s; }
.class-details { position: absolute; bottom: 5px; left: 0; right: 0; text-align: center; }
.class-details > span { color: var(--gold); text-transform: uppercase; letter-spacing: .2em; font-size: 9px; }
.class-details h3 { font-family: var(--serif); font-size: 31px; margin: 5px 0; }
.class-details p { color: #8f999c; font-size: 12px; max-width: 460px; margin: auto; }
.difficulty { display: flex; justify-content: center; align-items: center; gap: 5px; margin-top: 15px; }
.difficulty span { text-transform: uppercase; color: #70797c; font-size: 8px; letter-spacing: .1em; margin-right: 8px; }
.difficulty i { width: 17px; height: 3px; background: var(--gold); }
.difficulty i.off { background: #283138; }

.dashboard-section { background: radial-gradient(circle at 20% 30%, rgba(34,74,78,.18), transparent 30%), #070d11; }
.dashboard-intro { display: grid; grid-template-columns: 1fr .8fr; gap: 70px; align-items: end; margin-bottom: 50px; }
.dashboard-intro h2 { margin-bottom: 0; }
.dashboard-window { border: 1px solid rgba(215,168,77,.22); min-height: 650px; display: grid; grid-template-columns: 215px 1fr; background: #0b141a; box-shadow: 0 35px 80px rgba(0,0,0,.38); overflow: hidden; }
.dash-sidebar { padding: 25px 14px 18px; border-right: 1px solid rgba(255,255,255,.07); display: flex; flex-direction: column; background: #091116; }
.dash-brand { height: 74px; display: flex; align-items: center; justify-content: center; gap: 8px; border-bottom: 1px solid rgba(255,255,255,.06); margin: -10px 0 22px; }
.dash-brand .mini { transform: scale(.66); }
.dash-brand strong { font-family: var(--serif); color: var(--gold-light); letter-spacing: .06em; font-size: 12px; line-height: 1; }
.dash-brand small { font-size: 6px; margin-top: 6px; }
.dash-sidebar nav { display: grid; gap: 4px; }
.dash-nav { border: 0; background: transparent; color: #788387; padding: 11px 12px; display: flex; align-items: center; gap: 11px; text-align: left; cursor: pointer; font-size: 10px; font-weight: 600; }
.dash-nav span { width: 17px; color: #96a0a3; text-align: center; font-size: 14px; }
.dash-nav b { margin-left: auto; color: #758085; font-size: 9px; }
.dash-nav.active, .dash-nav:hover { background: linear-gradient(90deg, rgba(215,168,77,.12), transparent); color: var(--gold-light); box-shadow: inset 2px 0 var(--gold); }
.sidebar-server { margin-top: auto; border: 1px solid rgba(255,255,255,.07); background: #0d181e; padding: 12px; font-size: 9px; }
.sidebar-server span { display: block; color: #d5d5d2; font-weight: 700; }
.sidebar-server small { color: #5e696d; margin-left: 14px; }
.dash-logout { border: 0; background: transparent; color: #606a6e; text-align: left; font-size: 9px; padding: 18px 12px 0; cursor: pointer; }
.dash-main { min-width: 0; }
.dash-header { min-height: 82px; border-bottom: 1px solid rgba(255,255,255,.07); padding: 0 28px; display: flex; align-items: center; justify-content: space-between; background: #0c161c; }
.dash-header > div:first-child { display: flex; gap: 5px; font-size: 11px; color: #7f898c; }
.dash-header > div:first-child strong { color: #e2e1db; }
.dash-user { display: flex; align-items: center; gap: 10px; }
.dash-user button { border: 0; background: transparent; color: #879195; position: relative; cursor: pointer; }
.dash-user button i { position: absolute; top: -7px; right: -5px; width: 13px; height: 13px; display: grid; place-items: center; background: var(--gold); color: #111; font-size: 7px; font-style: normal; border-radius: 50%; }
.avatar { width: 34px; height: 34px; border: 1px solid var(--gold-dark); display: grid; place-items: center; background: #17242a; color: var(--gold-light); font-family: var(--serif); }
.dash-user p { font-size: 9px; line-height: 1.3; margin: 0; font-weight: 700; }
.dash-user small { display: block; font-size: 7px; color: #657075; font-weight: 500; }
.dash-panel { display: none; padding: 24px 28px 30px; animation: fadePanel .3s ease; }
.dash-panel.active { display: block; }
.welcome-card { min-height: 168px; padding: 26px; position: relative; border: 1px solid rgba(215,168,77,.15); background: radial-gradient(circle at 80% 20%, rgba(55,116,113,.17), transparent 30%), linear-gradient(120deg,#101e25,#0c171d); overflow: hidden; }
.welcome-card::after { content: ""; position: absolute; right: -15px; top: -80px; width: 260px; height: 260px; border-radius: 50%; border: 1px solid rgba(215,168,77,.11); box-shadow: inset 0 0 50px rgba(73,147,144,.07); }
.welcome-card > div:first-child { position: relative; z-index: 1; }
.welcome-card > div > span { text-transform: uppercase; color: #768186; font-size: 8px; letter-spacing: .12em; }
.welcome-card h3 { font-family: var(--serif); margin: 6px 0 0; font-size: 24px; }
.welcome-card p { margin: 2px 0; color: #7e898d; font-size: 9px; }
.welcome-card p b { color: var(--gold-light); }
.level-seal { position: absolute; right: 58px; top: 22px; z-index: 1; width: 92px; height: 92px; border-radius: 50%; border: 1px solid rgba(215,168,77,.2); display: flex; flex-direction: column; align-items: center; justify-content: center; background: rgba(7,14,18,.6); box-shadow: 0 0 0 8px rgba(215,168,77,.025); }
.level-seal small { color: #7f898c; font-size: 7px; letter-spacing: .2em; }
.level-seal strong { font-family: var(--serif); font-size: 29px; color: var(--gold-light); line-height: 1; }
.xp-bar { height: 4px; background: #202c31; position: absolute; left: 26px; bottom: 30px; right: 185px; }
.xp-bar span { display: block; height: 100%; background: linear-gradient(90deg,var(--gold-dark),var(--gold-light)); }
.xp-label { position: absolute; left: 26px; right: 185px; bottom: 8px; display: flex; justify-content: space-between; }
.xp-label span, .xp-label b { font-size: 7px; font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }
.quick-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 12px 0; }
.quick-grid > * { min-height: 70px; border: 1px solid rgba(255,255,255,.07); background: #0e191f; display: flex; align-items: center; padding: 14px; color: #d9d9d5; cursor: pointer; text-align: left; transition: .2s; }
.quick-grid > *:hover { border-color: rgba(215,168,77,.3); background: #111e25; }
.quick-grid > * > span { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; color: var(--gold-light); border: 1px solid rgba(215,168,77,.17); background: rgba(215,168,77,.05); }
.quick-grid p { margin: 0 0 0 10px; line-height: 1.3; }
.quick-grid strong { display: block; font-size: 9px; }
.quick-grid small { display: block; color: #667176; font-size: 7px; margin-top: 4px; }
.quick-grid i { margin-left: auto; color: #677277; font-style: normal; font-size: 11px; }
.dash-bottom-grid { display: grid; grid-template-columns: 1.6fr 1fr; gap: 12px; }
.character-card, .status-card { border: 1px solid rgba(255,255,255,.07); background: #0d171d; padding: 18px; }
.card-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.card-title h4 { font-family: var(--serif); font-size: 12px; margin: 0; }
.dash-link { border: 0; background: none; color: var(--gold); font-size: 7px; cursor: pointer; }
.character-list > div { min-height: 52px; display: flex; align-items: center; border-top: 1px solid rgba(255,255,255,.055); }
.char-icon { width: 30px; height: 30px; display: grid; place-items: center; background: #263738; color: var(--gold-light); font-family: var(--serif); font-size: 11px; margin-right: 9px; }
.char-icon.purple { background: #2b2638; color: #bf9ce8; }
.char-icon.green { background: #1e332d; color: #80cbae; }
.character-list p { margin: 0; line-height: 1.2; }
.character-list strong { display: block; font-size: 8px; }
.character-list small { font-size: 7px; color: #687277; }
.character-list > div > b { margin-left: auto; color: var(--gold); background: rgba(215,168,77,.08); padding: 3px 6px; font-size: 6px; text-transform: uppercase; }
.character-list > div > i { margin-left: auto; font-style: normal; color: #5b6569; font-size: 9px; }
.online-pill { color: #59cbb5; background: rgba(71,198,173,.08); border: 1px solid rgba(71,198,173,.17); padding: 3px 7px; font-size: 6px; text-transform: uppercase; }
.server-ring { width: 105px; height: 105px; border: 5px solid #1e2b30; border-top-color: var(--teal); border-right-color: #379b8c; border-radius: 50%; display: grid; place-items: center; text-align: center; margin: 8px auto 15px; transform: rotate(25deg); }
.server-ring span { transform: rotate(-25deg); }
.server-ring b { display: block; font-family: var(--serif); font-size: 19px; }
.server-ring small { display: block; color: #697478; font-size: 6px; text-transform: uppercase; }
.status-card dl { margin: 0; font-size: 7px; }
.status-card dl div { display: flex; justify-content: space-between; border-top: 1px solid rgba(255,255,255,.05); padding: 6px 0; }
.status-card dd { margin: 0; color: #899397; }
.placeholder-panel { min-height: 510px; text-align: center; place-content: center; }
.placeholder-panel.active { display: grid; }
.placeholder-panel > span { font-size: 42px; color: var(--gold-light); }
.placeholder-panel h3 { font-family: var(--serif); font-size: 24px; margin: 15px 0 0; }
.placeholder-panel p { color: #7e898d; font-size: 11px; max-width: 400px; margin: 8px auto 20px; }

.download-section { background: linear-gradient(90deg,#0c171d 0%,#081014 50%,#101e22); border-block: 1px solid rgba(255,255,255,.06); overflow: hidden; }
.download-layout { display: grid; grid-template-columns: 1fr 1fr; align-items: center; min-height: 490px; }
.download-layout > div:first-child { position: relative; z-index: 2; }
.requirements { display: flex; gap: 25px; padding: 0; margin: 30px 0; list-style: none; color: #707a7e; font-size: 10px; }
.requirements b { display: block; color: #c3c3be; font-size: 9px; text-transform: uppercase; }
.download-note { display: block; margin-top: 10px; color: #626c70; font-size: 8px; }
.download-buttons { display: flex; align-items: flex-start; flex-direction: column; gap: 8px; }
.download-buttons .download-note { margin: -3px 0 4px; }
.trailer-frame { display: block; width: min(100%, 1100px); aspect-ratio: 16 / 9; border: 0; background: #000; }
.download-emblem { position: relative; height: 470px; display: grid; place-items: center; }
.download-emblem::before { content: ""; width: 400px; height: 400px; position: absolute; border-radius: 50%; border: 1px solid rgba(215,168,77,.15); box-shadow: 0 0 0 50px rgba(215,168,77,.018), inset 0 0 100px rgba(51,134,132,.13); }
.download-emblem::after { content: ""; position: absolute; width: 310px; height: 310px; transform: rotate(45deg); border: 1px solid rgba(215,168,77,.09); }
.download-emblem > div { z-index: 2; text-align: center; }
.brand-mark.huge { transform: scale(2.2); margin-bottom: 30px; }
.download-emblem strong { display: block; font-family: var(--serif); font-size: 29px; color: var(--gold-light); letter-spacing: .1em; }
.download-emblem small { font-size: 9px; }

.join-section { padding-block: 90px; background: radial-gradient(circle at 25% 100%, rgba(43,103,101,.15), transparent 35%), #080f13; }

/* Chamada publica do Indique e Ganhe */
.referral-section{position:relative;overflow:hidden;background:radial-gradient(circle at 14% 25%,rgba(58,145,132,.18),transparent 34%),radial-gradient(circle at 88% 72%,rgba(216,168,61,.12),transparent 30%),#081115;border-block:1px solid rgba(255,255,255,.07)}
.referral-section::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 46%,rgba(255,255,255,.025) 46.2%,transparent 46.5%);pointer-events:none}
.referral-shell{display:grid;grid-template-columns:minmax(0,.92fr) minmax(470px,1.08fr);gap:clamp(45px,7vw,105px);align-items:center;position:relative}
.referral-copy h2{margin:16px 0 24px;font-size:clamp(42px,5.2vw,72px);line-height:.96}
.referral-copy h2 em{font-style:normal;color:var(--gold)}
.referral-copy>p:not(.eyebrow){max-width:590px;color:#9ca7aa;font-size:15px;line-height:1.8}
.referral-copy>p strong{color:#f2d276;font-weight:700}
.referral-example{display:grid;grid-template-columns:auto 1fr auto 1fr;align-items:center;gap:14px;margin:28px 0;padding:16px 18px;border:1px solid rgba(228,183,78,.24);background:rgba(228,183,78,.055)}
.referral-example>span{grid-column:1/-1;color:var(--gold);font-size:9px;letter-spacing:.2em;text-transform:uppercase}
.referral-example p{margin:0;color:#a8b1b4;font-size:12px}.referral-example b{display:block;color:#fff;font:600 18px Georgia,serif;margin-top:4px}.referral-example i{color:var(--gold);font-style:normal;font-size:18px}
.referral-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap}.referral-create{color:#c7ccca;font-size:11px;border-bottom:1px solid rgba(255,255,255,.28);padding-bottom:4px}
.referral-steps{border:1px solid rgba(255,255,255,.1);background:rgba(10,24,29,.8);box-shadow:0 30px 80px rgba(0,0,0,.24)}
.referral-steps article{display:grid;grid-template-columns:62px 1fr;gap:22px;padding:27px 30px;border-bottom:1px solid rgba(255,255,255,.08);transition:.25s ease}.referral-steps article:last-child{border-bottom:0}.referral-steps article:hover{background:rgba(228,183,78,.045);transform:translateX(-4px)}
.referral-steps article>span{display:grid;place-items:center;width:46px;height:46px;border:1px solid rgba(228,183,78,.35);color:var(--gold);font:600 15px Georgia,serif}
.referral-steps small{color:#6f858d;text-transform:uppercase;letter-spacing:.2em;font-size:8px}.referral-steps h3{margin:6px 0 7px;color:#f2eee5;font:600 20px Georgia,serif}.referral-steps p{margin:0;color:#7f8c90;font-size:11px;line-height:1.65}

/* Noticias e central editorial publica */
.news-section{background:#071015;border-block:1px solid rgba(255,255,255,.06)}
.news-section-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.7fr) auto;gap:28px;align-items:end;margin-bottom:34px}
.news-section-heading h2{margin:12px 0 0;font-size:clamp(38px,5vw,68px)}
.news-section-heading>p{color:var(--muted);line-height:1.7;margin:0}
.landing-news-grid,.news-archive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.landing-news-card,.news-card{border:1px solid rgba(255,255,255,.1);background:#0b171d;transition:.25s ease}
.landing-news-card:hover,.news-card:hover{transform:translateY(-4px);border-color:rgba(228,183,78,.45)}
.landing-news-cover,.news-card-cover{display:block;height:210px;background-size:cover;background-position:center;position:relative;overflow:hidden}
.landing-news-cover:after,.news-card-cover:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(4,10,13,.75))}
.landing-news-cover-empty,.news-card-cover-empty{display:grid;place-items:center;background:radial-gradient(circle at 70% 20%,rgba(228,183,78,.15),transparent 35%),linear-gradient(135deg,#10252c,#071116)}
.landing-news-cover-empty span,.news-card-cover-empty span{font:700 24px Georgia,serif;letter-spacing:.2em;color:#e4b74e}
.landing-news-card>div:last-child,.news-card-body{padding:24px}
.landing-news-meta,.news-card-meta{display:flex;justify-content:space-between;gap:15px;margin:0 0 14px!important;color:#708992!important;font-size:11px!important;text-transform:uppercase;letter-spacing:.12em}
.landing-news-meta span,.news-card-meta span{color:#e4b74e}
.landing-news-card h3,.news-card h2{margin:0 0 12px;font:26px/1.15 Georgia,serif}
.landing-news-card h3 a,.news-card h2 a{color:#f1eee6;text-decoration:none}
.landing-news-card>div>p:not(.landing-news-meta),.news-card-body>p{min-height:54px;color:var(--muted);line-height:1.65}
.landing-news-link,.news-card-link{display:inline-flex;gap:12px;color:#e4b74e;text-decoration:none;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.1em}
.landing-news-empty,.news-empty{padding:55px;border:1px dashed rgba(255,255,255,.12);text-align:center;color:var(--muted)}
.landing-news-empty span,.news-empty>span{display:block;color:#e4b74e;font-size:28px;margin-bottom:12px}
.news-public-body{min-height:100vh;background:#071015;color:#f1eee6}
.news-public-header{height:82px;padding:0 max(24px,calc((100vw - 1280px)/2));display:flex;align-items:center;gap:38px;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(5,12,15,.96)}
.news-public-header nav{display:flex;gap:26px;margin-left:auto}.news-public-header nav a{color:#829199;text-decoration:none;font-size:13px}.news-public-header nav a.active,.news-public-header nav a:hover{color:#e4b74e}
.news-public-main,.news-article-main{width:min(1280px,calc(100% - 48px));margin:0 auto;padding:90px 0 110px}
.news-public-heading{max-width:800px;margin-bottom:50px}.news-public-heading h1,.news-article h1{margin:14px 0 18px;font:clamp(46px,7vw,84px)/.98 Georgia,serif}.news-public-heading>p:last-child{color:var(--muted);font-size:17px;line-height:1.7}
.news-archive-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.news-card-cover{height:230px}
.news-article{width:min(920px,100%);margin:auto}.news-back{display:inline-block;margin-bottom:42px;color:#e4b74e;text-decoration:none;font-size:12px;text-transform:uppercase;letter-spacing:.12em}
.news-article header{margin-bottom:42px}.news-article-lead{max-width:760px;color:#9aabb1;font-size:20px;line-height:1.7}.news-article-meta{display:flex;gap:20px;margin-top:25px;color:#6f858d;font-size:12px}.news-article-cover{display:block;width:100%;max-height:560px;object-fit:cover;border:1px solid rgba(228,183,78,.25);margin-bottom:46px}.news-article-content{font-size:17px;line-height:1.9;color:#c4cdd0}.news-article-content p{margin:0 0 24px;white-space:pre-line}.news-article-content h2,.news-article-content h3,.news-article-content h4{font-family:var(--font-display);font-weight:400;color:#f3efe5;line-height:1.2;margin:46px 0 18px}.news-article-content h2{font-size:clamp(29px,4vw,44px)}.news-article-content h3{font-size:clamp(23px,3vw,31px)}.news-article-content h4{font-size:20px}.news-article-content strong{color:#f2ce74}.news-article-content em{color:#e8ecec}.news-article-content del{color:#75868d}.news-article-content a{color:#e8c565;text-decoration-color:rgba(232,197,101,.45);text-underline-offset:4px}.news-article-content code{padding:3px 7px;border:1px solid rgba(228,183,78,.2);background:#0b181e;color:#e8c565;font:14px/1.5 Consolas,monospace}.news-article-content ul,.news-article-content ol{display:grid;gap:10px;margin:0 0 28px;padding-left:25px}.news-article-content li::marker{color:#e4b74e}.news-article-content blockquote{position:relative;margin:30px 0;padding:22px 26px 22px 30px;border:1px solid rgba(228,183,78,.25);border-left:3px solid #e4b74e;background:linear-gradient(90deg,rgba(228,183,78,.1),rgba(14,29,35,.65));color:#e7ecec}.news-article-content blockquote::before{content:'Aviso';display:block;margin-bottom:7px;color:#e4b74e;font-size:10px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}.news-article-content hr{height:1px;border:0;margin:42px 0;background:linear-gradient(90deg,#e4b74e,rgba(228,183,78,0))}.news-public-footer{display:flex;justify-content:space-between;gap:20px;padding:28px max(24px,calc((100vw - 1280px)/2));border-top:1px solid rgba(255,255,255,.08);color:#63777f;font-size:11px}.news-public-footer a{color:#d9b55f;text-decoration:none}
.join-card { border: 1px solid rgba(215,168,77,.2); padding: 58px 65px; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 70px; background: linear-gradient(120deg,rgba(15,28,34,.9),rgba(9,17,21,.95)); position: relative; overflow: hidden; }
.join-card::after { content: ""; position: absolute; width: 220px; height: 220px; border: 1px solid rgba(215,168,77,.06); transform: rotate(45deg); right: -100px; top: -100px; }
.join-card h2 { font-size: clamp(32px,3.2vw,45px); }
.signup-form { display: grid; gap: 12px; position: relative; z-index: 2; }
.signup-form label > span, .login-modal label > span { display: block; color: #8f999b; font-size: 9px; text-transform: uppercase; letter-spacing: .1em; margin-bottom: 5px; }
input { width: 100%; height: 48px; border: 1px solid rgba(255,255,255,.11); background: #091217; color: white; padding: 0 14px; outline: none; }
input:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(215,168,77,.07); }
.signup-form > small { color: #626c70; text-align: center; font-size: 8px; }
.signup-form .checkbox { display: flex; align-items: center; gap: 8px; color: #7d888b; font-size: 9px; }
.signup-form .checkbox input { width: auto; height: auto; accent-color: var(--gold); }
.signup-form .signup-referral > span { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.signup-form .signup-referral > span small { color: var(--gold-light); font-size: 8px; letter-spacing: .12em; }
.signup-form .signup-referral > input { text-transform: uppercase; }
.signup-form .signup-referral > small { display: block; margin-top: 6px; color: #687477; font-size: 8px; line-height: 1.45; }

footer { background: #050a0d; border-top: 1px solid rgba(255,255,255,.06); padding: 55px 0 25px; }
.footer-top { display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: center; padding-bottom: 35px; }
.footer-top > p { text-align: center; color: #5d676a; font-family: var(--serif); font-size: 11px; }
.socials { display: flex; gap: 8px; justify-content: flex-end; }
.socials a { width: 33px; height: 33px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.1); color: #858e91; font-size: 10px; transition: .2s; }
.socials a:hover { color: var(--gold-light); border-color: var(--gold-dark); }
.footer-bottom { display: flex; justify-content: space-between; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.05); color: #485154; font-size: 8px; }
.footer-bottom nav { display: flex; gap: 25px; }

dialog { color: var(--ink); border: 1px solid rgba(215,168,77,.25); padding: 0; background: #0c161c; box-shadow: 0 35px 100px rgba(0,0,0,.7); }
dialog::backdrop { background: rgba(2,6,8,.8); backdrop-filter: blur(8px); }
.login-modal { width: min(450px,calc(100% - 32px)); padding: 48px; text-align: center; }
.modal-close { position: absolute; top: 13px; right: 16px; border: 0; background: transparent; color: #7f898d; font-size: 23px; cursor: pointer; }
.modal-mark { margin-bottom: 20px; }
.login-modal .eyebrow { margin: 5px 0 6px; }
.login-modal h2 { font-size: 30px; margin: 0; }
.login-modal > p:not(.eyebrow) { color: #788286; font-size: 11px; }
.login-modal form { text-align: left; display: grid; gap: 14px; margin-top: 25px; }
.form-row { display: flex; justify-content: space-between; font-size: 9px; color: #788286; }
.form-row .checkbox { display: flex; align-items: center; gap: 6px; }
.form-row input { width: auto; height: auto; }
.form-row a { color: var(--gold); }
.trailer-modal { width: min(860px,calc(100% - 32px)); aspect-ratio: 16/9; }
.trailer-placeholder { height: 100%; display: grid; place-content: center; text-align: center; background: linear-gradient(rgba(5,10,14,.65),rgba(5,10,14,.9)), url("assets/daybreak-hero.png") center/cover; }
.trailer-placeholder > span { color: var(--gold-light); width: 75px; height: 75px; border: 1px solid var(--gold); border-radius: 50%; display: grid; place-items: center; margin: auto; padding-left: 5px; }
.trailer-placeholder h2 { font-size: 28px; margin: 20px 0 0; }
.trailer-placeholder p { color: #929b9e; }
.toast { position: fixed; z-index: 300; right: 24px; bottom: 24px; background: #152229; color: #e7e6df; border-left: 3px solid var(--gold); padding: 13px 18px; font-size: 11px; box-shadow: 0 12px 40px rgba(0,0,0,.35); transform: translateY(100px); opacity: 0; transition: .3s; }
.toast.show { transform: none; opacity: 1; }

@keyframes heroReveal { from { opacity: 0; transform: scale(1.05); } to { opacity: 1; transform: scale(1); } }
@keyframes liftIn { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes bounce { 50% { transform: translateY(5px); } }
@keyframes rotateRune { to { transform: rotate(360deg); } }
@keyframes fadePanel { from { opacity: 0; transform: translateY(6px); } }

@media (max-width: 1050px) {
  .landing-news-grid,.news-archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.news-section-heading{grid-template-columns:1fr auto}.news-section-heading>p{grid-column:1/-1}
  .main-nav { gap: 17px; }
  .main-nav a { font-size: 11px; }
  .nav-shell { gap: 18px; }
  .dashboard-window { grid-template-columns: 180px 1fr; }
}

@media (max-width: 900px) {
  .referral-shell { grid-template-columns: 1fr; }
  .nav-actions { margin-left: auto; }
  .menu-toggle { display: block; order: 3; }
  .main-nav { position: absolute; top: 82px; left: 0; right: 0; padding: 25px 32px; background: rgba(7,13,17,.98); display: none; flex-direction: column; align-items: flex-start; border-bottom: 1px solid var(--line); }
  .main-nav.open { display: flex; }
  .main-nav a.active::after { display: none; }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-card { min-height: 0; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.08); }
  .classes-layout { grid-template-columns: 1fr; gap: 20px; }
  .dashboard-intro { grid-template-columns: 1fr; gap: 10px; }
  .dashboard-window { grid-template-columns: 1fr; }
  .dash-sidebar { flex-direction: row; padding: 10px; align-items: center; overflow-x: auto; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.07); }
  .dash-brand, .sidebar-server, .dash-logout { display: none; }
  .dash-sidebar nav { display: flex; width: 100%; }
  .dash-nav { white-space: nowrap; }
  .download-layout { grid-template-columns: 1fr; }
  .download-emblem { display: none; }
  .join-card { grid-template-columns: 1fr; gap: 25px; }
}

@media (max-width: 650px) {
  .referral-example{grid-template-columns:1fr auto 1fr}.referral-example>span{grid-column:1/-1}.referral-steps article{grid-template-columns:46px 1fr;padding:22px 18px;gap:14px}.referral-actions{align-items:stretch;flex-direction:column}.referral-actions .button{text-align:center}.referral-create{text-align:center;border:0}
  .landing-news-grid,.news-archive-grid{grid-template-columns:1fr}.news-section-heading{grid-template-columns:1fr}.news-public-header nav{display:none}.news-public-header{gap:15px}.news-public-header>.button{margin-left:auto;padding-inline:14px}.news-public-main,.news-article-main{width:min(100% - 30px,1280px);padding-top:55px}.news-card-cover{height:200px}.news-article-meta{flex-direction:column;gap:6px}
  .container { width: min(100% - 30px,1160px); }
  .nav-shell { min-height: 70px; padding: 0 15px; }
  .brand-name { font-size: 16px; }
  .brand-mark { transform: scale(.85); }
  .nav-actions { display: none; }
  .main-nav { top: 70px; }
  .hero { min-height: 740px; max-height: 860px; }
  .hero-art { background-position: 63% center; }
  .hero-shade { background: linear-gradient(90deg,rgba(3,8,12,.97),rgba(3,8,12,.64)),linear-gradient(0deg,var(--night),transparent 35%); }
  .hero h1 { font-size: 43px; }
  .hero-copy { font-size: 13px; }
  .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
  .hero-stats div { min-width: 0; padding: 0 12px; }
  .hero-stats div:nth-child(3) { display: none; }
  .scroll-cue { display: none; }
  .section { padding: 78px 0; }
  h2 { font-size: 34px; }
  .feature-card { padding: 42px 30px; }
  .class-showcase { min-height: 430px; }
  .class-rune { width: 280px; height: 280px; }
  .class-glyph { font-size: 100px; }
  .dashboard-window { overflow: visible; }
  .dash-sidebar { position: sticky; top: 69px; z-index: 5; background: #091116; }
  .dash-nav { padding: 9px; font-size: 0; }
  .dash-nav span { font-size: 18px; }
  .dash-nav b { font-size: 8px; }
  .dash-header { padding: 0 16px; }
  .dash-header > div:first-child { display: none; }
  .dash-user { margin-left: auto; }
  .dash-panel { padding: 15px; }
  .welcome-card { min-height: 210px; padding: 20px; }
  .level-seal { width: 65px; height: 65px; right: 18px; top: 18px; }
  .level-seal strong { font-size: 21px; }
  .xp-bar, .xp-label { left: 20px; right: 20px; }
  .quick-grid { grid-template-columns: 1fr; }
  .dash-bottom-grid { grid-template-columns: 1fr; }
  .requirements { flex-wrap: wrap; }
  .join-card { padding: 38px 25px; }
  .footer-top { grid-template-columns: 1fr; gap: 24px; text-align: center; }
  .footer-top .brand, .socials { justify-content: center; }
  .footer-bottom { flex-direction: column; text-align: center; gap: 15px; }
  .footer-bottom nav { justify-content: center; }
  .login-modal { padding: 40px 24px 28px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}