@font-face{font-family:PegasusDisplay;src:url('BeaufortforLOL-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
:root{
  --type-display:clamp(50px,6vw,78px);
  --type-section:clamp(38px,4.5vw,58px);
  --type-subsection:clamp(29px,3vw,40px);
  --type-card:clamp(24px,2.2vw,29px);
  --type-lead:clamp(16px,1.45vw,18px);
  --type-body:16px;
  --type-label:11px;
}
body{font-size:var(--type-body);line-height:1.6}
html,body{max-width:100%;overflow-x:clip}
h1,h2,h3{font-family:PegasusDisplay,Georgia,serif}
.hero h1,.features-hero h1,.news-hero h1,.legal-hero h1,.intro h1,.auth-art h1,.news-reader h1{font-size:var(--type-display);line-height:.9;letter-spacing:-2.5px;font-weight:700}
.heading,.feature-intro h2,.detail-heading h2,.news-intro h2,.feature-philosophy h2{font-size:var(--type-section);line-height:.96;letter-spacing:-1.8px}
.beta h2,.story-feature h2,.wide-feature h3{font-size:var(--type-subsection);line-height:1;letter-spacing:-.8px}
.card-content h3,.feature h3,.feature-group h3,.news-card h3,.road-step h3,.currency-grid h3,.npc-grid h3,.stage h2,.summary h2,.auth-card h2,.legal-copy h2{font-size:var(--type-card);line-height:1.08;letter-spacing:-.25px}
.legal-summary h2{font-size:var(--type-subsection);line-height:1}
.hero p,.intro p,.features-hero p,.feature-intro p,.detail-heading p,.news-hero p,.news-intro p,.legal-hero p,.article-lead{font-size:var(--type-lead);line-height:1.6}
.card-content p,.feature-group p,.wide-feature p,.story-feature p,.story-feature li,.currency-grid p,.npc-grid p,.news-card p,.legal-copy p,.legal-copy li{line-height:1.65}
.label,.eyebrow{font-size:var(--type-label);line-height:1.2;letter-spacing:2.4px}
.button,.primary,.ghost,.play,.feature-link{line-height:1.1}

/* Shared navigation: identical alignment and typography on every page. */
.nav{
  min-height:80px!important;height:80px!important;padding:0 clamp(20px,4vw,64px)!important;
  display:grid!important;grid-template-columns:185px minmax(0,1fr) 185px!important;align-items:center!important;gap:clamp(20px,3vw,48px)!important;
  background:linear-gradient(180deg,rgba(4,5,12,.98) 0%,rgba(7,8,17,.88) 55%,rgba(7,8,17,.18) 100%)!important;
  box-shadow:0 18px 34px rgba(0,0,0,.3)!important;
  position:sticky!important;inset:auto!important;top:0!important;z-index:1000!important;
  -webkit-backdrop-filter:blur(14px)!important;backdrop-filter:blur(14px)!important;
}
.nav .brand,.nav .wordmark{margin:0!important;justify-self:start!important}
.nav .brand img,.nav .wordmark img{display:block;width:170px!important;height:58px!important;object-fit:contain}
.nav>.links{justify-self:center!important;display:flex;align-items:center;justify-content:center;gap:clamp(19px,1.8vw,31px)!important}
.nav>.links a{font-family:PegasusDisplay,Georgia,serif!important;font-size:11px!important;font-weight:700!important;line-height:1!important;letter-spacing:1.15px!important;text-decoration:none;white-space:nowrap}
.mobile-nav-links a{font-family:PegasusDisplay,Georgia,serif!important;letter-spacing:1.25px!important}
.nav>.button,.nav>.play{justify-self:end!important;margin:0!important;font-family:PegasusDisplay,Georgia,serif!important;font-size:11px!important;letter-spacing:1.15px!important;text-decoration:none!important;white-space:nowrap}

/* Home hero sizing lives here so the CSP-protected inline stylesheet remains untouched. */
body>main>.hero{min-height:640px!important;padding-bottom:62px!important}

/* Home identity showcase: HD artwork with a focused editorial panel. */
body>main>#features{padding-bottom:24px!important}
body>main>#interlude-server.identity-showcase{
  padding:0!important;
  background:linear-gradient(115deg,#211341,#100d1f)!important;
}
body>main>#interlude-server .identity-showcase-media{
  min-height:590px;
  display:flex;
  align-items:center;
  padding:46px clamp(36px,6vw,116px);
  background-image:linear-gradient(90deg,rgba(5,7,15,.2),transparent 48%),url('interlude-server-banner.jpg?v=20261013-1');
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}
body>main>#interlude-server .feature-intro{
  width:min(790px,44vw);
  display:block!important;
  padding:46px 45px 43px;
  background:linear-gradient(135deg,rgba(35,19,65,.98),rgba(21,13,40,.98));
  box-shadow:0 22px 55px rgba(2,2,8,.38);
}
body>main>#interlude-server .feature-intro .heading{margin:17px 0 31px}
body>main>#interlude-server .feature-intro .lede{max-width:620px;margin:0;color:#c3bccb}

/* Hall of Fame crest treatment. */
.hall-row{align-items:center;min-height:48px}
.hall-identity{display:flex!important;align-items:center;min-width:0;gap:11px}
.hall-identity strong{display:flex;align-items:baseline;min-width:0;gap:7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hall-identity small{color:var(--gold,#e4bd66);font:700 10px/1 Arial,sans-serif;letter-spacing:.6px}
.clan-crest{width:32px;height:24px;flex:0 0 32px;object-fit:contain;image-rendering:pixelated;border:1px solid rgba(228,189,102,.35);background:#070811;padding:2px}
.clan-crest-empty{display:grid;place-items:center;color:rgba(228,189,102,.4);font-size:11px}

@media(max-width:640px){
  :root{--type-display:clamp(42px,13vw,56px);--type-section:clamp(34px,10vw,44px);--type-subsection:clamp(28px,8vw,36px);--type-card:24px;--type-lead:16px}
  .hero h1,.features-hero h1,.news-hero h1,.legal-hero h1{letter-spacing:-1.8px}
  .heading,.feature-intro h2,.detail-heading h2,.news-intro h2,.feature-philosophy h2{letter-spacing:-1.2px}
}
@media(max-width:1140px){
  .nav{display:flex!important;gap:14px!important}
  .nav>.links{display:none!important}
  .nav>.button,.nav>.play{margin-left:auto!important}
}
@media(max-width:640px){
  .nav{min-height:72px!important;height:72px!important;padding:0 16px!important;gap:10px!important}
  .nav .brand img,.nav .wordmark img{width:min(140px,42vw)!important;height:50px!important}
  .mobile-nav-toggle{width:42px!important;height:42px!important;flex-basis:42px!important}
  body>main>.hero{min-height:570px!important;padding-bottom:44px!important}
  .shell{width:min(100% - 32px,1180px)!important}
  .dashboard{padding-top:34px!important;padding-bottom:64px!important}
  .dashboard-hero{padding:25px 22px!important}
  .dashboard-hero h1{font-size:clamp(38px,12vw,52px)!important;overflow-wrap:anywhere}
  .activity-grid article{padding:18px!important;min-width:0}
  .history-row{align-items:center;min-width:0;gap:10px}
  .history-row>b{flex:0 0 auto}
  .feature-strip{overflow:hidden}
  .feature-group li{align-items:flex-start;flex-direction:column;gap:4px}
  .feature-group li span{text-align:left}
  .story-feature,.wide-feature,.feature-philosophy,.stage,.download-card{padding:24px 20px!important}
  .article-hero{max-height:62vh;object-fit:cover}
  .news-hero h1{font-size:clamp(40px,12vw,52px)!important;letter-spacing:-1.5px!important;overflow-wrap:anywhere}
  .download-wrap{padding-inline:16px!important}
  .download-card{width:100%!important;min-width:0;padding:26px 20px!important}
  .download-card h1{font-size:clamp(38px,12vw,50px)!important;overflow-wrap:anywhere}
  .download-button{padding-inline:12px!important;overflow-wrap:anywhere}
  .windows-notice{padding:20px 16px!important}
  body>main>#features{padding-bottom:16px!important}
  body>main>#interlude-server.identity-showcase{padding-top:0!important}
  body>main>#interlude-server .identity-showcase-media{
    min-height:650px;
    align-items:flex-end;
    padding:260px 16px 22px;
    background-image:linear-gradient(0deg,rgba(7,8,17,.92) 0%,rgba(7,8,17,.18) 58%),url('interlude-server-banner.jpg?v=20261013-1');
    background-position:67% center;
  }
  body>main>#interlude-server .feature-intro{width:100%;padding:28px 22px 27px}
  body>main>#interlude-server .feature-intro .heading{margin:13px 0 20px;font-size:clamp(34px,10vw,44px)!important}
  body>main>#interlude-server .feature-intro .lede{font-size:15px;line-height:1.55}
}