/* Game presentation layered over the shared, functional portal components. */
:root { --max: 1520px; }
.home-page .topbar { background: linear-gradient(180deg,#070d18ed,#0e192b9e); }
.nav-links { background:#15253d38; border-color:#c5dce923; }
.nav-link { font-size:13px; padding-inline:20px; }
.home-page .hero-layout {
  min-height:calc(clamp(720px,70svh,950px) + var(--header-height));
  padding-top:calc(35px + var(--header-height)); padding-bottom:145px;
}
.hero-copy { width:min(850px,57%); }
.hero-copy>.eyebrow { padding:8px 13px; border-radius:6px; letter-spacing:.18em; background:#1b2d414f; font-size:10px; }
.hero-copy h1 { font-size:clamp(96px,5.9vw,148px); font-weight:750; line-height:1.02; letter-spacing:-.055em; margin:29px 0 26px; text-shadow:none; }
.hero-title-lead { font-size:.265em; font-weight:500; text-transform:uppercase; letter-spacing:.24em; line-height:1.4; color:#e7e9ed; margin-left:5px; }
.hero-title-tail {
  font-size:1em; font-weight:750; text-transform:uppercase; letter-spacing:-.055em; line-height:1.05; margin-top:4px;
  color:transparent; background:linear-gradient(115deg,#f8f7f2 18%,#e6f1f0 64%,#d0bbd7); background-clip:text; -webkit-background-clip:text; white-space:nowrap;
}
.hero-quote { font-size:25px; font-weight:400; letter-spacing:-.025em; color:#ecedf2; line-height:1.4; margin:0 0 19px; }
.hero-quote em { font-weight:500; animation:none; }
.hero-text { font-size:15px; max-width:460px; line-height:1.85; color:#bdcde0; }
.hero-actions { gap:28px; margin-top:31px; }
.hero-actions .primary-button { border-radius:10px; min-height:59px; background:linear-gradient(120deg,#f0e4c9,#e0cfae); padding-left:24px; box-shadow:0 8px 40px #edd6a52b,0 0 0 5px #e4d5b506; }
.hero-actions .primary-button>span { background:#16293b10; border-radius:7px; }
.hero-actions .text-button { font-size:13px; }
.hero-meta { margin-top:29px; font-size:9px; letter-spacing:.15em; color:#b4c1d2; }
.home-page .hero-art::after { background:linear-gradient(90deg,#070d18ec 0%,#070d18b8 20%,#070d1840 43%,transparent 70%),linear-gradient(0deg,var(--ink) 0%,#070d182e 24%,transparent 54%); }
.hero-orbit { right:10%; top:9%; width:clamp(520px,35vw,900px); border-color:#cae8ed21; }
.hero-orbit::after { width:6px; height:6px; background:#e9d7c1; box-shadow:0 0 17px 3px #ecd2b160; }
.hero-scene-label { position:absolute; right:max(40px,calc((100vw - var(--max))/2)); bottom:109px; display:grid; gap:5px; color:#c7d6e1; border-left:1px solid #bbdee760; padding-left:15px; font-size:10px; line-height:1.6; }
.hero-scene-label>span:first-child { font-size:9px; color:#e9ddc6; letter-spacing:.2em; }
.hero-scene-label>span:last-child { color:#a8b9ca; font-size:9px; }
.scroll-cue { bottom:105px; }
.journey-wayfinder { margin-top:-43px; border-radius:12px; background:linear-gradient(115deg,#172a3cef,#121f32f2 52%,#232338ee); border-color:#b9d9e626; box-shadow:0 24px 60px #0003; }
.journey-wayfinder>a { padding:27px 32px; gap:21px; }
.journey-symbol { width:36px; height:36px; color:#b8dfe3; flex-shrink:0; filter:drop-shadow(0 0 14px #9ed6e929); }
.journey-wayfinder>a:nth-child(2) .journey-symbol { color:#d2c2df; }
.journey-wayfinder>a:nth-child(3) .journey-symbol { color:#e3d3b4; }
.journey-link-copy { gap:5px; }
.journey-link-copy small { font-size:9px; letter-spacing:.12em; color:#8faabe; }
.journey-link-copy strong { font-size:16px; font-weight:500; color:#e3eaf2; }
.journey-arrow { font-size:22px; font-weight:300; }
.world-section { padding-top:115px; }
.section-heading { grid-template-columns:1.2fr 1fr; margin-bottom:45px; }
.section-heading h2 { font-size:clamp(48px,3.7vw,65px); font-weight:550; }
.section-heading>p:last-child { max-width:490px; color:#afbed2; font-size:15px; line-height:1.9; }
.vision-showcase { position:relative; border:1px solid #bcd9e12e; border-radius:20px; overflow:hidden; background:#111c2e; box-shadow:0 24px 80px #0003; }
.vision-tabs { position:absolute; z-index:3; top:37px; right:38px; width:calc(43% - 76px); display:flex; gap:4px; padding:5px; border:1px solid #c5dce925; border-radius:9px; background:#0d172a75; }
.vision-tab { min-height:42px; flex:1; border:0; border-radius:5px; padding:10px 9px; font-size:12px; color:#aabbd1; background:transparent; transition:color .25s,background .25s; }
.vision-tab:hover { color:#e7eff5; background:#c6e7ed09; }
.vision-tab.is-active { color:#e8f3f4; background:linear-gradient(125deg,#c0e3e620,#d4bfda1a); box-shadow:inset 0 0 0 1px #cde7eb20; }
.vision-panel { min-height:590px; display:grid; grid-template-columns:57% 43%; animation:vision-enter .55s ease both; }
.vision-scene { position:relative; isolation:isolate; overflow:hidden; min-width:0; background:#192c3c; }
.vision-scene>img { position:absolute; z-index:-2; width:100%; height:100%; inset:0; object-fit:cover; object-position:50% 44%; }
.vision-scene::after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,transparent 60%,#111c2e35 84%,#111c2e),linear-gradient(0deg,#071322b8,transparent 28%); }
.vision-scene--combat>img { object-position:79% 0; }
.vision-scene--progression>img { object-position:50% 12%; }
.vision-scene--progression { background:#252039; }
.vision-scene-label { position:absolute; bottom:40px; left:38px; font-size:10px; letter-spacing:.2em; color:#e2e6ee; padding-left:29px; background:linear-gradient(#b9dde5,#b9dde5) left center/17px 1px no-repeat; }
.vision-scene-mark { position:absolute; right:39px; bottom:32px; display:block; width:66px; height:66px; padding:15px; border:1px solid #bcdae72f; border-radius:50%; color:#c1e4e4; background:#1227383d; backdrop-filter:blur(10px); }
.vision-copy { position:relative; isolation:isolate; padding:135px 48px 44px 34px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; min-width:0; }
.vision-index { position:absolute; z-index:-1; right:40px; top:109px; font-size:120px; line-height:1; letter-spacing:-.08em; font-weight:250; color:#a8d0df09; pointer-events:none; }
.vision-copy .eyebrow { font-size:9px; letter-spacing:.12em; color:#a2c5d6; line-height:1.7; }
.vision-copy h3 { font-size:clamp(39px,2.8vw,53px); letter-spacing:-.04em; font-weight:550; line-height:1.15; margin:22px 0; }
.vision-copy>p:not(.eyebrow) { max-width:440px; font-size:14px; line-height:1.95; color:#adbed4; }
.vision-details { display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:24px 0 28px; }
.vision-details>li { font-size:10px; line-height:1.6; color:#bfd3e0; padding:5px 9px; border:1px solid #c3dbe525; border-radius:4px; background:#a9d3e606; }
.vision-link { display:inline-flex; gap:22px; align-items:center; font-size:12px; color:#ebdcc3; padding-bottom:10px; border-bottom:1px solid #e9d9b740; transition:color .2s,border-color .2s; }
.vision-link>span { font-size:19px; line-height:1; }
.vision-link:hover { color:#fff0d7; border-color:#e9d9b780; }
.art-note { margin-top:17px; font-size:10px; color:#91a4bc; }
.home-page .portal-entry { border-radius:20px; margin-top:105px; margin-bottom:82px; background:radial-gradient(ellipse at 0 0,#397a8727,transparent 58%),radial-gradient(ellipse at 100% 100%,#a483bb20,transparent 65%),linear-gradient(130deg,#152638,#101a2d); }
.home-page .portal-entry-copy h2 { font-weight:500; font-size:clamp(46px,3.6vw,63px); }
.home-page .portal-entry::before { content:""; left:20px; top:35px; width:370px; height:370px; border:1px solid #b2dfe516; border-radius:50%; box-shadow:0 0 0 35px #a4d8e705,0 0 0 85px #a4d8e704; transform:none; }
.home-page .feature-card { border-radius:11px; background:radial-gradient(350px circle at var(--spot-x,50%) var(--spot-y,0%),#a5d4e713,transparent 65%),linear-gradient(140deg,#17283b,#111c2d); }
.home-page .feature-card strong { font-weight:500; }
.home-page .feature-icon { border-radius:10px; }
.home-page .quick-links-heading h2 { font-weight:500; }
.primary-button:disabled,.primary-button:disabled:hover { opacity:.6; cursor:not-allowed; transform:none; box-shadow:none; }
.password-toggle[disabled] { cursor:not-allowed; opacity:.4; }
.stone-panel,.auth-panel,.dashboard-card,.roadmap-story-card,.roadmap-item,.roadmap-task { border-color:#bdd5e22b; }
.page-heading h1,.dashboard-intro h1 { font-weight:500; }
.roadmap-section-intro { margin-bottom:25px; }
.roadmap-section-intro h2 { font-size:32px; font-weight:500; letter-spacing:-.035em; margin:14px 0 12px; }
.roadmap-section-intro>p:last-child { color:#adbed2; font-size:13px; line-height:1.9; max-width:820px; }
.roadmap-foundations { margin-bottom:55px; }
.roadmap-foundation-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.roadmap-foundation-grid>article { display:grid; grid-template-columns:38px minmax(0,1fr); column-gap:21px; row-gap:12px; align-content:start; padding:28px; border:1px solid #bcd6e22c; border-radius:13px; background:linear-gradient(140deg,#1b3141b8,#121f32e8); }
.roadmap-foundation-grid .feature-icon { width:36px; height:36px; grid-row:span 2; padding:7px; margin:0; border-radius:9px; }
.roadmap-foundation-grid h3 { font-size:21px; font-weight:500; line-height:1.3; color:#e3edf2; }
.roadmap-foundation-grid p { font-size:13px; line-height:1.9; color:#abbed2; }
.roadmap-plan-heading { margin-bottom:28px; }
.roadmap-status--foundation-in-place,.roadmap-tab--foundation-in-place { color:#b3e2df; }
.roadmap-status--in-progress { color:#e6cfaf; }
.roadmap-lore-grid { display:grid; grid-template-columns:1fr 1fr; gap:23px; margin-top:65px; }
.roadmap-lore-grid>article { padding:38px; border:1px solid #bdd5e229; border-radius:15px; background:radial-gradient(ellipse at 0 0,#8ac2d510,transparent 65%),linear-gradient(145deg,#192b3dcc,#101d30e6); }
.roadmap-lore-grid h2 { font-size:38px; font-weight:500; letter-spacing:-.04em; margin:22px 0 25px; }
.roadmap-lore-grid>article>p:not(.eyebrow) { color:#b0c0d5; font-size:14px; line-height:1.95; margin-top:17px; max-width:650px; }
.roadmap-class-list { margin:0; }
.roadmap-class-list>div { display:grid; grid-template-columns:100px minmax(0,1fr); gap:22px; padding:15px 0; border-bottom:1px solid #bdd5e21a; }
.roadmap-class-list dt { font-size:18px; color:#c3e2e8; font-weight:500; }
.roadmap-class-list dd { margin:0; font-size:13px; color:#b1c3d7; line-height:1.85; }
.roadmap-lore-grid .roadmap-content-note { font-size:11px!important; color:#91a9c2!important; }
.roadmap-future { display:grid; grid-template-columns:.8fr 1.2fr; gap:60px; padding:40px 0 15px; margin-top:45px; border-top:1px solid #bdd5e225; }
.roadmap-future h2 { font-size:38px; font-weight:500; letter-spacing:-.04em; margin-top:20px; }
.roadmap-future>div>p:not(.eyebrow) { font-size:14px; line-height:1.95; color:#b0c0d5; max-width:830px; }
.roadmap-future .roadmap-pill-list { gap:10px; margin-top:25px; }
.roadmap-future .roadmap-pill-list li { font-size:11px; padding:7px 10px; border-radius:5px; }
@media(min-width:1600px) {
  .roadmap-section-intro h2 {font-size:36px}.roadmap-section-intro>p:last-child {font-size:14px}
  .roadmap-item h2 {font-size:24px}.roadmap-item p {font-size:14px;line-height:1.85}.roadmap-status {font-size:11px}
  .roadmap-story-card>p {font-size:14px;line-height:1.9}.roadmap-current-label {font-size:10px}.roadmap-task p {font-size:15px}
  .roadmap-story-card dd {font-size:13px}.roadmap-story-card dt {font-size:10px}.roadmap-tab {font-size:12px}
}
.vision-showcase:has(:focus-visible) { overflow:visible; }
.vision-tabs:has(:focus-visible) { outline:1px solid #bcd9e140; }
@keyframes vision-enter { from {opacity:.3;transform:translateY(5px)} to {opacity:1;transform:translateY(0)} }
@media(min-width:2200px) {
  .roadmap-section-intro h2 {font-size:40px}.roadmap-section-intro>p:last-child {font-size:15px}
  .roadmap-foundation-grid p,.roadmap-item p,.roadmap-story-card>p,.roadmap-class-list dd,.roadmap-lore-grid>article>p:not(.eyebrow) {font-size:15px}
  .roadmap-foundation-grid h3 {font-size:24px}.roadmap-item h2 {font-size:26px}.roadmap-task p {font-size:16px}.roadmap-tab {font-size:13px}
  :root {--max:1760px}
  .home-page .hero-layout {padding-top:calc(55px + var(--header-height))}
  .hero-copy {width:900px}.hero-copy h1 {font-size:148px}.hero-quote {font-size:29px}
  .hero-text {font-size:17px;max-width:530px}.hero-actions {margin-top:35px}
  .hero-actions .primary-button {min-height:64px;font-size:15px}.hero-meta {font-size:10px}
  .journey-wayfinder>a {padding:30px 38px}.journey-link-copy strong {font-size:18px}.journey-link-copy small {font-size:10px}.journey-symbol {width:40px;height:40px}
  .vision-panel {min-height:650px}.vision-copy {padding:143px 58px 50px 43px}.vision-copy h3 {font-size:58px}.vision-copy>p:not(.eyebrow) {font-size:15px;max-width:480px}
  .vision-details>li {font-size:11px}.vision-tabs {top:43px;right:47px;width:calc(43% - 94px)}.vision-tab {font-size:13px;min-height:45px}
  .vision-link {font-size:13px}.vision-index {font-size:150px}.home-page .portal-entry {gap:115px}
}
@media(min-width:2800px) { :root {--max:clamp(1760px,54vw,2080px)}.hero-copy h1 {font-size:clamp(148px,5vw,178px)}.vision-panel {min-height:700px} }
@media(max-width:1250px) {
  .hero-copy h1 {font-size:clamp(70px,6.5vw,96px)}.hero-quote {font-size:21px}
  .journey-wayfinder>a {padding:25px 22px;gap:15px}.journey-symbol {width:28px;height:28px}.journey-link-copy strong {font-size:14px}
  .vision-copy {padding:120px 29px 33px 24px}.vision-tabs {top:28px;right:25px;width:calc(43% - 50px)}.vision-tab {font-size:11px;padding-inline:5px}
  .vision-panel {min-height:550px}.vision-copy h3 {font-size:35px}.vision-copy>p:not(.eyebrow) {font-size:13px}.vision-details {gap:5px}.vision-details>li {font-size:9px}
}
@media(max-width:1100px) {
  .roadmap-foundation-grid {grid-template-columns:1fr}.roadmap-foundation-grid>article {padding:25px}
  .roadmap-lore-grid {gap:18px}.roadmap-lore-grid>article {padding:28px}.roadmap-lore-grid h2 {font-size:31px}
  .roadmap-class-list>div {grid-template-columns:75px minmax(0,1fr);gap:14px}.roadmap-class-list dt {font-size:16px}
  .roadmap-future {gap:30px}.roadmap-future h2 {font-size:32px}
  .nav-link {padding-inline:12px}.hero-copy {width:58%}.hero-copy h1 {font-size:clamp(67px,7.7vw,86px)}.hero-title-lead {font-size:.3em}.hero-text {font-size:14px}.hero-scene-label {display:none}
  .journey-link-copy strong {font-size:13px}.journey-link-copy small {font-size:8px}.journey-symbol {width:26px;height:26px}
  .vision-panel {grid-template-columns:50% 50%}.vision-tabs {width:calc(50% - 50px)}.vision-copy {padding-top:117px}.section-heading h2 {font-size:45px}.vision-copy h3 {font-size:32px}
}
@media(max-width:680px) {
  .roadmap-section-intro h2 {font-size:27px}.roadmap-foundations {margin-bottom:40px}.roadmap-foundation-grid>article {padding:23px;column-gap:17px}
  .roadmap-lore-grid {grid-template-columns:1fr;margin-top:45px}.roadmap-lore-grid>article {padding:27px}.roadmap-lore-grid h2 {font-size:31px}
  .roadmap-future {grid-template-columns:1fr;gap:24px;margin-top:35px;padding-top:32px}.roadmap-future h2 {font-size:32px}
  .home-page .hero-layout {padding-top:330px;min-height:850px;padding-bottom:120px}.hero-copy {width:100%;max-width:450px}
  .hero-copy h1 {font-size:clamp(47px,11.7vw,78px);margin:24px 0}.hero-title-tail {white-space:nowrap;max-width:none;margin-top:4px;font-size:1em}.hero-title-lead {font-size:.36em;margin-left:2px}
  .hero-quote {font-size:20px;margin-bottom:15px}.hero-text {font-size:13px}.hero-copy>.eyebrow {font-size:8px;letter-spacing:.12em;padding:7px 10px}
  .hero-actions {gap:18px;margin-top:25px}.hero-actions .primary-button {min-height:52px;font-size:11px;gap:12px;padding-left:15px}.hero-actions .text-button {font-size:11px}.hero-meta {font-size:8px;margin-top:25px}
  .scroll-cue {bottom:72px}.hero-orbit {display:none}.home-page .hero-art::after {background:linear-gradient(0deg,var(--ink) 0%,#070d18f4 36%,#070d189e 52%,#070d1822 74%)}
  .journey-wayfinder {margin-top:-25px}.journey-wayfinder>a {padding:22px;gap:19px}.journey-symbol {width:30px;height:30px}.journey-link-copy strong {font-size:15px}.journey-link-copy small {font-size:9px}
  .world-section {padding-top:70px}.section-heading h2 {font-size:37px}.section-heading>p:last-child {font-size:13px}.vision-showcase {border-radius:14px}
  .vision-tabs {top:320px;left:24px;right:24px;width:auto}.vision-panel {grid-template-columns:1fr;min-height:0}.vision-scene {min-height:295px}
  .vision-scene>img {object-position:50% 42%}.vision-scene--combat>img {object-position:75% 10%}.vision-scene--progression>img {object-position:50% 18%}
  .vision-scene::after {background:linear-gradient(0deg,#111c2e,transparent 34%)}.vision-scene-label {bottom:24px;left:25px;font-size:9px}.vision-scene-mark {right:25px;bottom:20px;width:51px;height:51px;padding:12px}
  .vision-copy {padding:105px 28px 35px;min-height:480px;justify-content:flex-start}.vision-copy h3 {font-size:35px;margin:21px 0}.vision-copy .eyebrow {font-size:8px}.vision-copy>p:not(.eyebrow) {font-size:13px}
  .vision-index {font-size:100px;top:106px;right:30px}.vision-details {margin:22px 0 26px;gap:7px}.vision-details>li {font-size:10px}.vision-tab {font-size:12px}.art-note {text-align:left;line-height:1.8}
  .home-page .portal-entry {margin-top:60px;margin-bottom:60px}.home-page .portal-entry-copy h2 {font-size:37px}.home-page .portal-entry::before {left:-150px;top:40px}
}
@media(max-width:380px) {
  .hero-copy h1 {font-size:46px}.hero-actions {gap:15px}.hero-quote {font-size:18px}.vision-tabs {left:20px;right:20px}.vision-copy {padding-inline:23px}.vision-copy h3 {font-size:32px}.home-page .portal-entry-copy h2 {font-size:34px}
}
@media(max-width:1100px) and (orientation:landscape) and (max-height:600px) {
  .home-page .hero-layout {padding-top:calc(36px + var(--header-height));min-height:calc(610px + var(--header-height))}.hero-copy h1 {font-size:72px}.hero-quote {font-size:20px}
}
@media(prefers-reduced-motion:reduce) { .vision-panel {animation:none}.vision-tab {transition:none} }