/* SlowWrath · frostbound refinement · 2026-10-19 */
:root{--header-height:80px;--site-gutter:max(clamp(18px,6vw,150px),calc((100vw - 1680px)/2));--copy:#b8c8ce;--muted:#9aadb5}
html{scroll-padding-top:calc(var(--header-height) + 24px);background:#060c12 url('/assets/images/community-bg-v1.png') center/cover fixed no-repeat;background-image:linear-gradient(rgba(5,13,21,.68),rgba(5,13,21,.78)),url('/assets/images/community-bg-v1.png')}
body,body.shop-page{padding:var(--header-height) var(--site-gutter) 0;background:transparent;animation:none;transform:none;filter:none;perspective:none}
/* A quiet frost-metal trim separates the page from the side artwork. */
body::before,body::after{content:"";position:fixed;top:0;bottom:0;z-index:90;width:3px;pointer-events:none;border-inline:1px solid rgba(144,200,214,.16);background:linear-gradient(180deg,rgba(165,222,231,.12),rgba(165,222,231,.45) 22%,rgba(103,166,183,.26) 72%,rgba(165,222,231,.12));box-shadow:0 0 12px rgba(98,187,211,.1)}
body::before{left:calc(var(--site-gutter) - 3px)}
body::after{right:calc(var(--site-gutter) - 3px)}
body>main{background:var(--bg);box-shadow:0 0 70px rgba(0,0,0,.4)}
.minimal-footer{background:#04090d}
.page-wrap,.container{width:min(1480px,calc(100% - 80px))}
[hidden]{display:none!important}
button,a,input,select,summary{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}
button{cursor:pointer}
button:disabled{cursor:not-allowed}
.skip-link{position:fixed;z-index:120;top:10px;left:18px;padding:12px 20px;transform:translateY(-160%);background:var(--cyan);color:#061018;font-weight:800}
.skip-link:focus{transform:none}
.site-header,.site-header.solid-header{position:fixed;inset:0 var(--site-gutter) auto;z-index:100;background:rgba(5,12,18,.94);border-bottom:1px solid rgba(156,232,239,.11);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);transition:background .25s,box-shadow .25s}
.site-header.is-scrolled{background:rgba(4,10,16,.97);box-shadow:0 12px 36px rgba(0,0,0,.3)}
.site-header::after{content:none;display:none}
.nav-shell{height:var(--header-height);border:0;gap:24px}
.nav-links{gap:22px;font-size:.76rem}
.nav-links a{padding:28px 0}
.nav-actions{gap:14px}
.nav-cta{letter-spacing:.055em}
.nav-actions .account-link,.nav-links .nav-mobile-account{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:9px 15px;border:1px solid rgba(127,217,239,.6);background:rgba(42,129,161,.19);color:#aeeeff;font-size:.67rem;font-weight:850;letter-spacing:.055em;text-transform:uppercase;white-space:nowrap;transition:background .2s,border-color .2s,color .2s}
.nav-actions .account-link:hover,.nav-actions .account-link.active,.nav-links .nav-mobile-account:hover{border-color:#a9edf6;background:#9ce8ef;color:#061018}
.nav-links .nav-mobile-account{display:none}
.nav-mobile-only{display:none}
.menu-button{min-height:42px}
.brand-icon{transition:filter .3s,transform .5s}
.brand:hover .brand-icon{filter:drop-shadow(0 0 12px #8debf2);transform:rotate(25deg)}
.button,.nav-cta,.quiet-action{transition:background .22s,border-color .22s,box-shadow .22s,transform .22s}
.button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 30px rgba(0,0,0,.22)}
.button-primary:hover{box-shadow:0 6px 30px rgba(129,224,237,.16)}
.button span,.text-link{transition:transform .22s,color .22s}
.button:hover span{transform:translateX(3px)}
.hero-new{min-height:790px;height:calc(100svh - var(--header-height));max-height:1040px}
.hero-new-content{padding-top:0;padding-bottom:70px}
.hero-new-content h1{max-width:1100px;font-size:clamp(3.2rem,4.8vw,5.8rem);font-weight:700;letter-spacing:-.045em;text-wrap:balance}
.hero-new-content h1 span{color:#a6edf2}
.hero-lead{font-size:1.04rem;max-width:680px;line-height:1.8}
.hero-new-art{animation:frost-drift 32s ease-in-out infinite alternate;will-change:transform}
.hero-new-art::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 73% 12%,rgba(65,208,193,.13),transparent 30%),radial-gradient(1px 1px at 62% 24%,#a0e6ed 95%,transparent),radial-gradient(2px 2px at 80% 58%,#a0e6ed 95%,transparent),radial-gradient(1px 1px at 45% 70%,#d0f8fd 95%,transparent),radial-gradient(1px 1px at 93% 38%,#d0f8fd 95%,transparent);animation:frost-light 8s ease-in-out infinite alternate}
@keyframes frost-drift{from{transform:scale(1.01)}to{transform:scale(1.055) translate(-.5%,.2%)}}
@keyframes frost-light{from{opacity:.3;translate:0 0}to{opacity:.85;translate:0 -12px}}
.hero-meta{display:flex;flex-wrap:wrap;gap:12px 22px;margin-top:30px;color:#b2c8cf;font-size:.67rem;letter-spacing:.05em}
.hero-meta span{display:flex;align-items:center;gap:8px}
.hero-meta span::before{content:"";width:4px;height:4px;background:#6bd7df;rotate:45deg}
.status-panel{background:rgba(7,17,25,.87);border-color:rgba(151,221,230,.25);box-shadow:0 18px 60px rgba(0,0,0,.22)}
.realm-identity small{font-size:.63rem}
.realm-identity.is-offline small{color:#ef9d9d}
.realm-identity:has(.unknown) small{color:#c0c9ce}
.status-dot.unknown{background:#869ba4;box-shadow:none}
.status-dot:not(.offline):not(.unknown){animation:realm-pulse 3s ease-in-out infinite}
@keyframes realm-pulse{50%{box-shadow:0 0 0 5px rgba(112,224,173,.1),0 0 15px rgba(112,224,173,.4)}}
.status-panel dd{font-variant-numeric:tabular-nums}
.realmlist-copy{min-height:72px}
.realmlist-copy:hover{background:rgba(156,232,239,.05)}
.realmlist-copy code{overflow-wrap:anywhere}
.rate-strip{background:linear-gradient(120deg,rgba(103,208,222,.04),transparent 75%)}
.rate-strip article{transition:background .25s}
.rate-strip article:hover{background:rgba(156,232,239,.045)}
.route-grid{gap:14px;border:0;grid-template-columns:repeat(4,minmax(0,1fr))}
.route-card{position:relative;overflow:hidden;min-height:280px;padding:30px;border:1px solid var(--edge);background:linear-gradient(150deg,#0e1d28,#08131d)}
.route-card-wide{grid-column:span 2;grid-row:span 2;justify-content:flex-end;background:linear-gradient(0deg,rgba(4,12,19,.97),rgba(4,12,19,.24)),url('/assets/images/journey-north-v2.webp') 52% center/cover}
.route-card-wide h3{font-size:clamp(2rem,3vw,3.2rem);max-width:440px;margin-top:30px}
.route-card-wide>span{margin-top:auto}
.route-card-wide b{margin-top:0}
.route-card h3{margin-top:35px}
.route-card:hover{border-color:rgba(156,232,239,.45);background-color:#10232d;transform:translateY(-4px)}
.route-card::after{content:"↗";position:absolute;top:24px;right:26px;color:#5a929d;font-size:1rem;transition:transform .25s,color .25s}
.route-card:hover::after{color:#b5f7fb;transform:translate(2px,-2px)}
.section-heading h2,.split-heading h2,.closing-cta h2{text-wrap:balance}
.feature-image{box-shadow:0 20px 70px rgba(0,0,0,.2)}
.feature-image img{transition:transform .8s}
.feature-image:hover img{transform:scale(1.035)}
.home-visual{background-position:center 55%}
.form-heading small,.panel-form label>small,.security-note{display:none}
.panel-form input{min-height:48px}
.panel-form .checkbox input{min-height:0}
.panel-form .honeypot{display:none}
.account-tool summary small{display:none}
.shop-hero h1{line-height:1.02}
.shop-hero{padding-top:84px}
.shop-section{scroll-margin-top:calc(var(--header-height) + 24px)}
.product-preview-hint{display:none}
.product-card,.adventure-card,.hd-pack-card,.fact-card{transition:border-color .25s,background .25s}
.product-card:hover,.adventure-card:hover,.hd-pack-card:hover,.fact-card:hover{background-color:rgba(156,232,239,.035)}
.account-summary strong,.character-card h3{overflow-wrap:anywhere}
.footer-legal{color:#8b9da5}
.page-image-waystones{--page-image:url('/assets/images/realm-waystones.png')}
.page-image-launcher{--page-image:url('/assets/images/launcher-integrity-v1.png')}
.page-image-waystation{--page-image:url('/assets/images/launcher-waystation.png')}
.page-image-frostbound{--page-image:url('/assets/images/hero-frostbound-v2.webp')}
.ranking-empty,.event-error{line-height:1.7}
.status-chip{max-width:100%;white-space:normal}
.motion-ready .route-card.reveal.is-visible{transition:opacity .7s,transform .3s,border-color .25s,background .25s}
.route-card:nth-child(3n+2){transition-delay:70ms}
.route-card:nth-child(3n){transition-delay:120ms}
.noscript-message{padding:12px 24px;border-bottom:1px solid var(--edge);color:#cbd9de;background:#10212c;text-align:center}
@media(min-width:1281px) and (max-width:1450px){.nav-shell{gap:20px}.nav-links{gap:16px;font-size:.71rem}.nav-actions{gap:10px}.brand{font-size:.8rem}}
@media(max-width:1600px){
  .menu-button{display:block;margin-left:auto;color:#dce8ea;background:#0a1720;border:1px solid var(--edge);padding:9px 14px;font-size:.67rem}
  .nav-links{display:none;position:absolute;top:calc(var(--header-height) + 1px);left:32px;right:32px;margin:0;padding:12px;max-height:calc(100dvh - var(--header-height) - 20px);overflow-y:auto;overscroll-behavior:contain;background:#0a1720;border:1px solid rgba(156,232,239,.27);box-shadow:0 22px 50px rgba(0,0,0,.5)}
  .nav-links.open{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
  .nav-links a{padding:12px 16px;min-height:44px;border:1px solid transparent}
  .nav-links a:hover,.nav-links a.active{background:rgba(156,232,239,.07);border-color:var(--edge)}
  .nav-links a.active::after{display:none}
  .nav-links .nav-mobile-only{display:block}
  .nav-links .nav-mobile-only.guest-only[hidden]{display:none}
  .nav-links .nav-mobile-account{border-top:1px solid var(--edge)}
  .nav-shell{gap:16px}.nav-actions .account-link{display:inline-flex}
  .route-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .route-card-wide{grid-column:span 2;grid-row:auto}
  .status-panel{grid-template-columns:190px 1fr 260px}
  .status-panel dl div{padding:7px 16px}
}
@media(max-width:1000px){
  .nav-actions .nav-cta{display:none}
  .rate-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rate-strip article:nth-child(2){border-right:0}
  .rate-strip article:nth-child(-n+2){border-bottom:1px solid var(--edge)}
  .route-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.route-card-wide{grid-column:span 2;min-height:350px}
  .status-panel{grid-template-columns:170px 1fr}.realmlist-copy{grid-column:1/-1;border-top:1px solid var(--edge);padding:12px 24px;min-height:65px}
  .status-panel dl{border-right:0}.hero-new-content{padding-bottom:120px}
  .hero-new-content h1{font-size:clamp(3rem,6.3vw,4.6rem)}
}
@media(max-width:760px){
  :root{--header-height:68px;--site-gutter:12px}
  .page-wrap,.container{width:calc(100% - 36px)}
  .nav-shell{gap:10px}.brand{font-size:.76rem;gap:9px;letter-spacing:.13em}.brand-icon{width:27px;height:27px}
  .nav-links{left:18px;right:18px}.nav-links.open{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nav-actions{gap:8px}.nav-actions .nav-cta,.nav-actions .account-link{display:none}.menu-button{min-height:40px;padding:8px 11px}.nav-shop{min-height:40px}
  .hero-new{display:flex;flex-direction:column;align-items:stretch;gap:44px;height:auto;max-height:none;min-height:0;padding:68px 0 22px}
  .hero-new-content{padding:0}.hero-new-content h1{font-size:clamp(2.5rem,10.8vw,4.6rem);line-height:1.06;max-width:620px}
  .hero-lead{margin-top:23px;font-size:.93rem}.hero-actions{margin-top:26px;gap:10px;flex-direction:row}.hero-actions .button{min-height:49px;flex:1 1 180px}
  .hero-meta{margin-top:24px;gap:10px 16px;font-size:.6rem}
  .status-panel,.motion-ready .status-panel.reveal,.motion-ready .status-panel.reveal.is-visible{position:relative;inset:auto;transform:none;grid-template-columns:1fr;min-width:0}
  .realm-identity{padding:17px 20px}.status-panel dl{grid-row:auto;grid-column:auto;border:0;border-top:1px solid var(--edge)}
  .status-panel dl div{padding:14px 12px}.status-panel dt{font-size:.59rem}.realmlist-copy{grid-column:auto;padding:13px 20px}
  .hero-new-art{background-position:62% center}.hero-new::before{background:linear-gradient(90deg,rgba(4,9,14,.91),rgba(4,9,14,.53)),linear-gradient(0deg,#060c12,transparent 65%)}
  .route-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.route-card{min-height:230px;padding:22px}.route-card-wide{min-height:330px}
  .route-card h3{font-size:1.26rem;margin-top:36px}.route-card-wide h3{font-size:2.2rem}.route-card p{font-size:.78rem}.route-card b{font-size:.68rem}.route-card>span{font-size:.58rem}
  .route-card::after{top:18px;right:18px}.rate-strip article{display:grid;gap:5px}.rate-strip span{font-size:.68rem}
  .closing-cta>div>div{flex-wrap:wrap}.closing-cta .button{flex:1 1 160px;min-width:0}.shop-hero{padding-top:65px}.shop-hero h1{font-size:clamp(2.6rem,11vw,4rem)}
  .home-visual{min-height:580px}.feature-image,.feature-image img{min-height:220px}
  .download-box{min-width:0}.download-box .button{padding-inline:12px;gap:14px}.inline-statuses span{letter-spacing:.03em}
}
@media(max-width:360px){.nav-shell{gap:7px}.brand{font-size:.66rem;gap:6px}.nav-shop{min-width:54px;padding:8px}.menu-button{padding:8px}.route-grid{grid-template-columns:1fr}.route-card-wide{grid-column:auto}.hero-new-content h1{font-size:2.7rem}}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .motion-ready .reveal{opacity:1!important;transform:none!important}.hero-new-art{will-change:auto}
  .motion-ready .status-panel.reveal,.motion-ready .status-panel.reveal.is-visible{opacity:1!important;transform:translateX(-50%)!important}
}
@media(max-width:760px) and (prefers-reduced-motion:reduce){.motion-ready .status-panel.reveal,.motion-ready .status-panel.reveal.is-visible{transform:none!important}}
