@charset "UTF-8";
:root {
  --ink:#363a32;
  --muted:#606253;
  --gold:#8b6939;
  --line:#7e704b66;
  --paper:#c6c3aa;
  --ok:#315638;
  --bad:#852f22;
  color-scheme:light;
}
* {
  box-sizing:border-box;
}
body {
  margin:0;
  font:13px/1.55 Georgia,'Times New Roman',serif;
  color:var(--ink);
  background:#a6afa1;
  position:relative;
  isolation:isolate;
}
body:before {
  content:'';
  position:absolute;
  inset:0 0 auto;
  height:clamp(950px,85vw,1300px);
  background:linear-gradient(to bottom,#a6afa108 0%,#a6afa11a 35%,#a6afa14d 58%,#a6afa1b3 78%,#a6afa1 100%),url('assets/portal-world.webp?v=093488ad96') center top/cover no-repeat;
  pointer-events:none;
  z-index:-1;
}
a {
  color:inherit;
  text-decoration:none;
}
button,input,select {
  font:inherit;
}
button,a {
  touch-action:manipulation;
}
button {
  cursor:pointer;
}
button:disabled {
  cursor:wait;
  opacity:.6;
}
[hidden] {
  display:none!important;
}
h1,h2,h3,p {
  margin:0;
}
h2,h3 {
  font-weight:400;
}
h2 {
  font-size:25px;
}
h3 {
  font-size:18px;
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible {
  outline:3px solid #375e71;
  outline-offset:3px;
}
.sr-only,.skip-link:not(:focus) {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
}
.skip-link:focus {
  position:fixed;
  top:8px;
  left:8px;
  z-index:99;
  padding:12px;
  background:#e5dbc3;
}
.site-shell {
  max-width:1360px;
  margin:auto;
  padding:0 34px;
}
.masthead {
  height:180px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 35px;
  gap:20px;
  text-shadow:0 1px 4px #fff9;
}
.masthead-note {
  display:grid;
  gap:5px;
  font-size:11px;
  letter-spacing:3px;
  color:#454d43;
}
.masthead-note small {
  font-size:8px;
  letter-spacing:1.6px;
}
.wordmark {
  text-align:center;
  position:relative;
  padding:14px 32px 6px;
}
.wordmark h1 {
  font-size:clamp(46px,5vw,70px);
  font-variant:small-caps;
  letter-spacing:1px;
  font-weight:400;
  color:#f3e0aa;
  text-shadow:0 2px 0 #795426,0 -1px 0 #fff0bf,2px 3px 5px #302c25,0 0 24px #f4eadb;
}
.crest {
  display:block;
  color:#886932;
  font-size:28px;
  line-height:1;
}
.wordmark-rule {
  font-size:8px;
  letter-spacing:4px;
  color:#343d35;
  display:block;
  margin-top:3px;
}
.opening-seal {
  border:1px solid #81734799;
  outline:1px solid #81734744;
  outline-offset:4px;
  width:136px;
  text-align:center;
  padding:14px 10px;
  background:#d9d5bd6e;
  display:grid;
  gap:3px;
}
.opening-seal span {
  font-size:8px;
  letter-spacing:1px;
}
.opening-seal strong {
  font-size:18px;
  letter-spacing:2px;
  font-weight:400;
}
.main-nav {
  display:flex;
  justify-content:center;
  position:relative;
  margin-bottom:22px;
  min-height:57px;
  padding:5px 25px;
  background:linear-gradient(#c4bb9c,#b1a889 50%,#a49979 51%,#bdb396);
  border:1px solid #6e6143;
  box-shadow:inset 0 0 0 3px #d7ceb088,0 4px 12px #353e3333;
}
.main-nav:before,.main-nav:after {
  content:'◆';
  position:absolute;
  top:14px;
  font-size:17px;
  color:#75623e;
  text-shadow:0 1px #e1d1a0;
}
.main-nav:before {
  left:13px;
}
.main-nav:after {
  right:13px;
}
.main-nav a {
  min-width:142px;
  text-align:center;
  display:grid;
  place-items:center;
  font-size:14px;
  letter-spacing:.5px;
  border-right:1px solid #786b4540;
  padding:8px 20px;
  text-shadow:0 1px #efe6ce88;
}
.main-nav a:last-child {
  border:0;
}
.main-nav a:hover,.main-nav a[aria-current=page] {
  background:linear-gradient(90deg,transparent,#f0dfac50,transparent);
  color:#69471e;
  box-shadow:inset 0 -2px #806239;
}
.portal-grid {
  display:grid;
  grid-template-columns:214px minmax(0,1fr) 214px;
  gap:18px;
  align-items:start;
}
.left-rail,.right-rail {
  display:grid;
  gap:18px;
}
.game-panel {
  position:relative;
  background:repeating-linear-gradient(100deg,#ffffff05 0 1px,transparent 1px 4px),radial-gradient(ellipse at 35% 10%,#e0d8bb77,transparent 80%),#bdbda4;
  border:12px solid transparent;
  border-image:url('assets/ornate-frame.webp?v=11660fc1be') 160 / 25px / 3px stretch;
  background-clip:padding-box;
  box-shadow:0 5px 15px #303c3033;
  min-width:0;
}
.navigation-panel,.realm-panel,.launch-panel,.bulletin {
  padding:14px 14px 20px;
}
.realm-panel dl { margin:0; }
.realm-panel dl>div { padding:10px 0; }
.panel-title {
  text-align:center;
  font-size:18px;
  padding:10px 0 14px;
  border-bottom:1px solid var(--line);
  position:relative;
  color:#544a32;
  text-shadow:0 1px #f4e9cd;
}
.panel-title:after {
  content:'◆';
  font-size:8px;
  position:absolute;
  bottom:-6px;
  left:calc(50% - 4px);
  background:#c3c0a5;
  padding:0 3px;
  color:#80643c;
}
.start-button {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:84px;
  padding:14px 10px;
  color:#f6e3b2;
  text-shadow:0 1px 2px #263c3a;
  background:linear-gradient(130deg,#4e7a79,#607f70 50%,#365b5d);
  border:1px solid #8b7e4e;
  outline:1px solid #e0cb8b;
  outline-offset:-5px;
  box-shadow:0 4px 10px #3d423333,inset 0 0 18px #213f4044;
  font-size:18px;
}
.start-button:hover {
  filter:brightness(1.06);
}
.start-button small {
  font:7px/1.5 'Segoe UI',sans-serif;
  letter-spacing:1px;
  display:block;
  margin-top:4px;
}
.start-icon {
  font-size:30px;
  color:#edd28c;
}
.side-menu {
  padding:12px 3px 0;
}
.side-menu a {
  display:flex;
  gap:9px;
  align-items:center;
  min-height:43px;
  border-bottom:1px solid #83795740;
  font-size:12px;
}
.side-menu i {
  font-size:20px;
  width:23px;
  color:#806840;
  font-style:normal;
  text-shadow:0 1px #eee2c3;
}
.side-menu a>span {
  margin-left:auto;
  color:#8d7952;
  font-size:21px;
}
.side-menu a:hover,.side-menu a[aria-current=page] {
  background:#e3d3a633;
  color:#5f461d;
}
.unavailable {
  display:flex;
  flex-direction:column;
  text-align:center;
  margin:12px 0 5px;
  padding:9px;
  border:1px solid #8b826244;
  background:#a1a18b35;
  color:#646754;
}
.unavailable small {
  font:9px 'Segoe UI',sans-serif;
  margin-top:2px;
}
.realm-panel {
  padding-bottom:8px;
}
.status-label {
  font:10px 'Segoe UI',sans-serif;
  text-align:center;
  margin:22px 0 12px;
  color:#436346;
}
.status-label span {
  font-size:8px;
  margin-right:4px;
}
.realm-panel dl {
  margin:0 4px;
}
.realm-panel dl>div {
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:7px 0;
  border-bottom:1px dotted #82785855;
  font-size:11px;
}
.realm-panel dt {
  color:#636453;
}
.realm-panel dd {
  margin:0;
  font-weight:bold;
  font-size:11px;
}
.rail-note {
  font-size:11px;
  text-align:center;
  color:var(--muted);
  font-style:italic;
  padding-top:15px;
}
main {
  min-width:0;
  outline:0;
}
.page-view {
  margin-bottom:20px;
}
.js-ready .page-view {
  margin:0;
}
.showcase {
  padding:8px 8px 12px;
}
.slides {
  height:337px;
  position:relative;
  overflow:hidden;
}
.slide {
  position:absolute;
  inset:0;
}
.slide img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.slide:first-child img {
  object-position:center 25%;
}
.slide:after {
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(transparent 25%,#26332e20 42%,#202f30db);
}
.slide-caption {
  position:absolute;
  bottom:22px;
  left:25px;
  right:24px;
  z-index:1;
  color:#efe5c9;
  text-shadow:0 1px 3px #1d2d31;
}
.eyebrow {
  font:8px/1.5 'Segoe UI',sans-serif;
  letter-spacing:1.8px;
  color:#77623c;
  display:block;
  margin-bottom:7px;
}
.slide-caption .eyebrow {
  color:#e2c790;
  font-size:8px;
}
.slide-caption h2 {
  font-size:29px;
  margin-bottom:8px;
}
.slide-caption p {
  font-size:12px;
  color:#dddccb;
  margin-bottom:10px;
}
.text-link {
  font-size:11px;
  color:#f4dca1;
  border-bottom:1px solid #c8b27670;
  padding-bottom:4px;
}
.text-link span {
  margin-left:12px;
}
.slider-controls {
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 34px;
  position:relative;
  align-items:center;
  gap:10px;
  min-height:56px;
  padding:10px 12px;
  background:linear-gradient(#b8b299,#a4a58e);
  border-top:1px solid #776d4d66;
}
.slider-controls>button {
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  padding:0 0 2px;
  border:1px solid #88765088;
  background:#cdc0a3;
  color:#5a5139;
  font-size:22px;
  line-height:1;
}
.slider-dots {
  display:flex;
  gap:10px;
  justify-content:center;
  margin:0;
  padding:0;
}
.slider-dots button {
  width:10px;
  height:10px;
  padding:0;
  transform:rotate(45deg);
  border:1px solid #756b47;
  background:#d4ccb1;
}
.slider-dots button[aria-pressed=true] {
  background:#776a40;
  box-shadow:inset 0 0 0 2px #c5b382;
}
#slide-count {
  position:absolute;
  right:60px;
  top:50%;
  transform:translateY(-50%);
  font:9px 'Segoe UI',sans-serif;
  color:#52583f;
  letter-spacing:1px;
  margin-right:4px;
}
.shortcut-row {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin:16px 0;
}
.shortcut-row a {
  display:flex;
  align-items:center;
  gap:9px;
  padding:12px 9px;
  background:linear-gradient(120deg,#c5c5ad,#aeb5a1);
  border:1px solid #82775299;
  box-shadow:inset 0 0 0 3px #dad1b24d,0 2px 5px #4d553329;
  font-size:13px;
}
.shortcut-row a:hover {
  background:#cec9ad;
}
.shortcut-row a>span {
  font-size:23px;
  color:#746039;
}
.shortcut-row small {
  font:6px/1.5 'Segoe UI',sans-serif;
  letter-spacing:.7px;
  display:block;
  margin-top:4px;
  color:#606350;
}
.chronicle {
  padding:6px 10px;
}
.board-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  padding:10px 0 17px;
  border-bottom:1px solid var(--line);
}
.board-heading h2 {
  font-size:23px;
}
.board-heading>span {
  font:7px 'Segoe UI',sans-serif;
  letter-spacing:1px;
  color:#797458;
}
.news-entry {
  display:flex;
  align-items:center;
  gap:16px;
  padding:20px 0;
  border-bottom:1px solid #8c805b55;
}
.news-entry:last-child {
  border:0;
}
.news-stamp {
  flex-shrink:0;
  width:48px;
  text-align:center;
  font-size:25px;
  line-height:1;
  color:#826944;
  border:1px solid #97876288;
  padding:10px 2px;
  background:#d4c8a677;
  box-shadow:inset 0 0 0 3px #bba67e33;
}
.news-stamp small {
  font:6px 'Segoe UI',sans-serif;
  display:block;
  letter-spacing:.4px;
  margin-top:8px;
}
.news-entry .eyebrow {
  font-size:7px;
  margin-bottom:4px;
}
.news-entry h3 {
  font-size:18px;
  margin:0 0 7px;
}
.news-entry p {
  font-size:11px;
  line-height:1.65;
  color:#595f4e;
}
.entry-arrow {
  font-size:27px;
  color:#8b774f;
  margin-left:auto;
}
.news-entry h3 a:hover {
  text-decoration:underline;
}
.launch-panel {
  text-align:center;
  padding-bottom:8px;
}
.sun-dial {
  width:100px;
  height:100px;
  border:1px solid #958058;
  margin:22px auto 10px;
  border-radius:50%;
  outline:1px solid #99875a77;
  outline-offset:5px;
  display:grid;
  place-items:center;
  background:radial-gradient(#ece0b98c,#b8b396);
  position:relative;
}
.sun-dial:before {
  content:'';
  position:absolute;
  inset:8px;
  border:1px dashed #8b784d;
  border-radius:50%;
}
.sun-dial span {
  font-size:65px;
  line-height:1;
  color:#a47d42;
  text-shadow:0 1px #fae9b2;
}
.launch-month {
  font-size:23px;
  margin:18px 0 2px;
  color:#665330;
}
.launch-month b {
  font-weight:400;
}
.launch-panel>p:not(.launch-month) {
  font-size:10px;
  color:var(--muted);
  margin-bottom:17px;
}
.bronze-button {
  display:block;
  text-align:center;
  padding:11px 15px;
  background:linear-gradient(#d5c098,#ac9164);
  border:1px solid #806941;
  box-shadow:inset 0 0 0 3px #e6d1a34d;
  text-shadow:0 1px #ead8af77;
  color:#493b22;
  font-size:12px;
}
.bronze-button:hover {
  filter:brightness(1.06);
}
.war-note {
  text-align:center;
  padding:14px 4px 8px;
}
.war-note>span {
  font-size:37px;
  color:#856d43;
}
.war-note h3 {
  font-size:22px;
}
.war-note p {
  font-size:11px;
  color:var(--muted);
  padding:8px 0 12px;
}
.war-note a {
  font-size:10px;
  color:#725735;
}
.race-promo {
  position:relative;
  height:161px;
  border:3px double #a48b5b;
  box-shadow:0 4px 10px #46513d55;
  overflow:hidden;
}
.race-promo img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.race-promo>span {
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  background:linear-gradient(transparent,#243a3de8);
  padding:25px 8px 12px;
  color:#f2e3be;
  text-align:center;
  font-size:19px;
  text-shadow:0 1px #283839;
}
.race-promo small {
  font:6px 'Segoe UI',sans-serif;
  letter-spacing:1px;
  display:block;
  margin-top:7px;
}
.community-note {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  padding:10px 5px;
  color:#3f4f3f;
  text-shadow:0 1px #eee5c677;
  font-size:14px;
}
.community-note>span {
  font-size:28px;
  color:#866d42;
}
.community-note small {
  display:block;
  font-size:10px;
  color:#56624f;
}
.inner-page {
  padding:14px 15px 20px;
  min-height:640px;
}
.page-heading {
  border-bottom:1px solid var(--line);
  padding:4px 0 17px;
  margin-bottom:18px;
}
.page-heading h2 {
  font-size:32px;
  color:#4c4834;
  margin-bottom:12px;
}
.page-heading p:last-child {
  font-size:12px;
  color:var(--muted);
  max-width:540px;
}
.character-scene {
  height:265px;
  position:relative;
  margin:0 -5px 18px;
  overflow:hidden;
  border:1px solid #8e7d58;
}
.character-scene img {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 30%;
}
.character-caption {
  position:absolute;
  inset:auto 0 0;
  padding:30px 20px 15px;
  background:linear-gradient(transparent,#263a3cde);
  color:#eee2bd;
}
.character-caption>span {
  font:8px 'Segoe UI',sans-serif;
  letter-spacing:2px;
}
.character-caption h3 {
  font-size:29px;
  margin:4px 0;
}
.character-caption p {
  font-size:11px;
}
.class-roster {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-bottom:20px;
}
.class-group h3 {
  text-align:center;
  font-size:19px;
  margin-bottom:12px;
  border-bottom:1px solid var(--line);
  padding-bottom:10px;
}
.class-button {
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  text-align:left;
  border:1px solid #92856455;
  margin-bottom:7px;
  padding:7px;
  background:#cac6ad;
  font-size:11px;
  color:#414933;
  min-height:39px;
}
.class-button[aria-pressed=true] {
  background:#738879;
  color:#fff0c9;
  border-color:#8b7143;
  box-shadow:inset 0 0 0 2px #d1c09266;
}
.class-rune {
  font-size:20px;
  line-height:1;
  min-width:23px;
  text-align:center;
  color:#806942;
}
.class-button[aria-pressed=true] .class-rune {
  color:#f3d89b;
}
.world-panorama {
  width:100%;
  height:185px;
  object-fit:cover;
  border:1px solid #948564;
  margin-bottom:16px;
}
.cols {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-bottom:14px;
}
.card {
  padding:13px;
  background:#d8cfb14d;
  border:1px solid #978a6566;
}
.card h3 {
  font-size:20px;
  margin-bottom:12px;
  color:#665235;
}
.chips {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.chip {
  font-size:10px;
  border-bottom:1px dotted #8c815c;
  padding:4px 2px;
}
.chip:before {
  content:'◇';
  color:#89734b;
  margin-right:5px;
}
.chip.off {
  color:#777765;
}
.chip.off:before {
  content:'×';
  color:#8a6954;
}
.card p {
  font-size:12px;
  color:#59604d;
}
.war-art {
  height:220px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  color:#eddfbe;
  background:linear-gradient(#253e4266,#253e4299),url('assets/three-heroes.webp?v=26e7d2dcdd') center 38%/cover;
  text-shadow:0 2px 5px #202f2c;
  border:1px solid #938059;
}
.war-art>span {
  font-size:55px;
}
.war-art h3 {
  font-size:35px;
}
.war-ledger article {
  display:flex;
  gap:20px;
  padding:21px 5px;
  border-bottom:1px solid var(--line);
}
.war-ledger article>span {
  font-size:27px;
  color:#8a734a;
  min-width:25px;
}
.war-ledger h3 {
  font-size:22px;
  margin:0 0 7px;
}
.war-ledger p {
  font-size:12px;
  color:var(--muted);
}
.war-ledger {
  margin-bottom:20px;
}
footer {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:25px;
  margin:22px 0;
  padding:20px 10px;
  border-top:1px solid #7b7d5d66;
  color:#455040;
  text-shadow:0 1px #e1dec277;
  font-size:9px;
}
.footer-mark {
  font-size:17px;
  letter-spacing:1px;
  color:#6e5834;
}
footer>a {
  font-size:10px;
}
@media(min-width:1500px) {
  .site-shell {
    padding:0 20px;
  }
  .masthead {
    height:195px;
  }
  .portal-grid {
    grid-template-columns:230px minmax(0,1fr) 230px;
  }
  .slides {
    height:365px;
  }
}
@media(max-width:1150px) {
  .site-shell {
    padding:0 20px;
  }
  .portal-grid {
    grid-template-columns:185px minmax(0,1fr);
    gap:16px;
  }
  .right-rail {
    grid-column:1/-1;
    grid-template-columns:1fr 1fr 1fr;
  }
  .right-rail .community-note {
    display:none;
  }
  .right-rail .sun-dial {
    display:none;
  }
  .right-rail .launch-month {
    margin-top:14px;
  }
  .right-rail .race-promo {
    height:100%;
    min-height:180px;
  }
  .main-nav a {
    min-width:120px;
  }
  .start-button {
    font-size:15px;
  }
  .start-icon {
    font-size:22px;
  }
  .start-button small {
    font-size:6px;
  }
  .panel-title {
    font-size:17px;
  }
  .side-menu a {
    font-size:11px;
  }
  .board-heading h2 {
    font-size:21px;
  }
  .masthead-note {
    font-size:9px;
  }
  .masthead-note small {
    font-size:6px;
  }
}
@media(max-width:760px) {
  body {
    background-attachment:scroll;
    background-size:auto 1100px;
  }
  .site-shell {
    padding:0 14px;
  }
  .masthead {
    height:143px;
    justify-content:center;
    padding:0;
  }
  .masthead-note,.opening-seal {
    display:none;
  }
  .wordmark h1 {
    font-size:59px;
  }
  .main-nav {
    padding:4px 8px;
    margin-bottom:16px;
    min-height:49px;
  }
  .main-nav:before,.main-nav:after {
    display:none;
  }
  .main-nav a {
    min-width:0;
    flex:1;
    padding:9px 4px;
    font-size:11px;
    letter-spacing:0;
  }
  .portal-grid {
    grid-template-columns:1fr;
    gap:18px;
  }
  .left-rail {
    display:none;
  }
  .right-rail {
    grid-template-columns:1fr 1fr;
    gap:14px;
  }
  .right-rail .race-promo {
    display:none;
  }
  .slides {
    height:335px;
  }
  .slide-caption h2 {
    font-size:28px;
  }
  .shortcut-row {
    gap:8px;
  }
  .shortcut-row a {
    padding:10px 7px;
    font-size:12px;
    gap:6px;
  }
  .shortcut-row a>span {
    font-size:21px;
  }
  .shortcut-row small {
    font-size:6px;
    letter-spacing:0;
  }
  .inner-page {
    min-height:0;
    padding:12px 10px 18px;
  }
  .character-scene {
    height:260px;
  }
  .class-roster {
    gap:8px;
  }
  .class-button {
    font-size:10px;
    gap:5px;
    padding:7px 4px;
  }
  .class-rune {
    font-size:16px;
    min-width:18px;
  }
  .class-group h3 {
    font-size:18px;
  }
  footer {
    flex-wrap:wrap;
    gap:12px;
    text-align:center;
    padding:18px 10px;
  }
  .footer-mark {
    width:100%;
  }
  .page-heading h2 {
    font-size:29px;
  }
}
@media(max-width:420px) {
  .site-shell {
    padding:0 10px;
  }
  .wordmark h1 {
    font-size:54px;
  }
  .wordmark-rule {
    font-size:7px;
    letter-spacing:3px;
  }
  .game-panel {
    border-width:10px;
    border-image-width:21px;
  }
  .slides {
    height:305px;
  }
  .slide-caption {
    left:15px;
    right:12px;
    bottom:18px;
  }
  .slide-caption h2 {
    font-size:25px;
  }
  .slide-caption p {
    font-size:11px;
  }
  .shortcut-row {
    gap:6px;
  }
  .shortcut-row a {
    flex-direction:column;
    text-align:center;
    font-size:12px;
    gap:3px;
  }
  .shortcut-row small {
    font-size:5px;
  }
  .board-heading {
    align-items:start;
    gap:6px;
  }
  .board-heading h2 {
    font-size:20px;
  }
  .board-heading>span {
    font-size:6px;
    margin-top:6px;
  }
  .chronicle {
    padding:4px 5px;
  }
  .news-entry {
    gap:10px;
    padding:17px 0;
  }
  .news-entry h3 {
    font-size:17px;
  }
  .news-entry p {
    font-size:11px;
  }
  .news-stamp {
    width:37px;
    font-size:22px;
  }
  .news-stamp small {
    font-size:5px;
  }
  .entry-arrow {
    display:none;
  }
  .class-roster {
    grid-template-columns:1fr;
  }
  .class-group {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:6px 10px;
  }
  .class-group h3 {
    grid-column:1/-1;
    text-align:left;
    margin:8px 0 3px;
  }
  .class-button {
    font-size:12px;
  }
  .character-scene {
    height:230px;
  }
  .cols {
    grid-template-columns:1fr;
  }
  .prereg form {
    grid-template-columns:1fr;
  }
  .prereg h2 {
    font-size:30px;
  }
  .panel-title {
    font-size:16px;
  }
  .launch-month {
    font-size:19px;
  }
  .bronze-button {
    padding:10px 7px;
    font-size:11px;
  }
  .war-note h3 {
    font-size:19px;
  }
  .war-note>span {
    font-size:28px;
  }
}
@media(prefers-reduced-motion:reduce) {
  * {
    scroll-behavior:auto!important;
  }
}
.main-nav>[data-discord] {
  min-width:142px;
  border:0;
  background:transparent;
  color:#4c513b;
  font-size:14px;
  padding:8px 20px;
  text-shadow:0 1px #efe6ce88;
  letter-spacing:.5px;
}
[data-discord]:disabled {
  opacity:1;
  cursor:not-allowed;
}
button.text-link {
  background:transparent;
  border:0;
  border-bottom:1px solid #c8b27670;
  padding:0 0 4px;
}
button.bronze-button {
  width:100%;
}
.invite-note {
  display:block;
  font-size:9px;
  color:#66664f;
  margin-top:8px;
}
.footer-discord {
  border:1px solid #8c815f;
  background:#b8b9a0;
  padding:8px 12px;
  color:#404c3f;
  font-size:11px;
}
@media(max-width:760px) {
  .main-nav>[data-discord] {
    min-width:0;
    flex:1;
    padding:9px 4px;
    font-size:11px;
    letter-spacing:0;
  }
}
/* Shared spacing and branded masthead. */
.wordmark { flex:0 1 480px; padding:0 18px; min-width:0; }
.site-logo { display:block; width:100%; height:auto; max-height:146px; object-fit:contain; }
.wordmark-rule { margin-top:4px; }
.opening-seal { flex-shrink:0; width:154px; }
.opening-seal strong { font-size:17px; letter-spacing:1px; }
.navigation-panel,.realm-panel,.launch-panel,.bulletin { padding:14px 14px 20px; }
.realm-panel dl { margin:0; }
.realm-panel dl>div { padding:10px 0; }
.realm-panel dt { min-width:0; }
.realm-panel dd { text-align:right; }
.chronicle { padding:18px 22px 22px; }
.inner-page { padding:22px 24px 26px; }
.launch-month { font-size:23px; line-height:1.3; }
.launch-month b { display:block; font-size:18px; margin-top:4px; }
.launch-panel>.launch-time { font-size:13px; margin-top:7px; }
.beta-info { border-top:1px solid var(--line); padding:16px 0 20px; display:grid; gap:8px; }
.beta-info>span { font:8px 'Segoe UI',sans-serif; letter-spacing:1.5px; color:#77623c; }
.beta-info time { font-size:12px; }
.beta-info small { font-size:10px; color:var(--muted); }
.concept-intro { padding:20px 0 10px; font-size:14px; line-height:1.75; }
.concept-story { padding:0 0 14px; font-size:14px; line-height:1.75; color:#4c5544; }
.concept-ledger { display:grid; grid-template-columns:1fr 1fr; gap:0 26px; margin:0; }
.concept-ledger>div { padding:20px 0; border-bottom:1px solid #8c805b55; }
.concept-ledger dt { font-size:20px; margin-bottom:10px; color:#514832; }
.concept-ledger dt span { color:#8b7044; padding-right:6px; }
.concept-ledger dd { margin:0; font-size:12px; line-height:1.8; color:#4c5544; }
.concept-foot { display:flex; flex-wrap:wrap; gap:12px 24px; padding-top:20px; font-size:12px; color:#725735; }
@media(max-width:1150px) { .navigation-panel,.realm-panel,.launch-panel,.bulletin { padding:12px 10px 17px; } .side-menu a { gap:5px; } .side-menu i { width:18px; } }
@media(max-width:760px) { .wordmark { flex-basis:370px; padding:0 10px; } .site-logo { max-height:112px; } .wordmark-rule { font-size:7px; letter-spacing:2px; } .chronicle { padding:15px 16px 20px; } .inner-page { padding:18px 16px 22px; } .board-heading { flex-wrap:wrap; } .concept-ledger { grid-template-columns:1fr; } .concept-intro { font-size:13px; } }
@media(max-width:420px) { .slider-controls { padding:10px 8px; gap:8px; } .showcase { padding:6px 6px 10px; } .slide-caption { left:12px; } .concept-ledger dt { font-size:21px; } .navigation-panel,.realm-panel,.launch-panel,.bulletin { padding:12px 10px 17px; } }
.opening-countdown { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; margin:17px 0 22px; }
.opening-countdown>span { padding:9px 2px 7px; border:1px solid #91825d80; background:linear-gradient(#dfd0aa66,#ad9d7855); box-shadow:inset 0 0 0 2px #ead8ad33; text-align:center; }
.opening-countdown b { display:block; font:21px/1.2 Georgia,serif; font-variant-numeric:tabular-nums; color:#5d4a2c; }
.opening-countdown small { display:block; font:6px/1.5 'Segoe UI',sans-serif; letter-spacing:.5px; margin-top:5px; color:#64614a; }
.launch-panel>.countdown-ended { margin:15px 0 20px; line-height:1.6; }
.beta-info a,.community-note a { text-decoration:underline; text-underline-offset:3px; }
@media(max-width:760px) { body:before { height:1100px; background-position:center top; } }
@media(max-width:420px) { .opening-countdown { gap:3px; } .opening-countdown b { font-size:18px; } .opening-countdown small { font-size:5px; letter-spacing:0; } }

.race-assignment { margin:10px 0 12px; padding-left:18px; }
.race-assignment li { padding:3px 0; }
.race-world { margin-top:28px; padding:22px 24px 26px; }
.race-world .board-heading { flex-wrap:wrap; }
.races-intro { padding:20px 0 8px; font-size:14px; line-height:1.8; color:#4c5544; }
.race-profile { display:grid; grid-template-columns:145px minmax(0,1fr); gap:24px; padding:26px 0; border-bottom:1px solid var(--line); }
.race-portrait { min-height:205px; align-self:stretch; border:3px double #93774d; background:url('assets/three-heroes.webp?v=26e7d2dcdd') 10% center/auto 100% no-repeat; box-shadow:inset 0 0 18px #283f3a33; }
.elves .race-portrait { background-position:50% center; }
.untamed .race-portrait { background-position:90% center; }
.race-story h3 { font-size:24px; line-height:1.3; color:#514832; margin:0 0 12px; }
.race-story>p:not(.eyebrow) { font-size:13px; line-height:1.8; color:#4c5544; margin-bottom:12px; }
.race-paths { margin:15px 0 0; display:grid; gap:7px; font-size:12px; }
.race-paths>div { display:flex; flex-wrap:wrap; gap:4px 14px; }
.race-paths dt { min-width:78px; color:#6e654a; }
.race-paths dd { margin:0; color:#463b27; font-weight:bold; }
@media(max-width:1100px) { .race-profile { grid-template-columns:110px minmax(0,1fr); gap:18px; } }
@media(max-width:760px) { .race-world { padding:18px 16px 22px; } .race-profile { grid-template-columns:100px minmax(0,1fr); gap:16px; } }
@media(max-width:540px) { .race-profile { grid-template-columns:1fr; gap:18px; } .race-portrait { width:132px; height:160px; min-height:0; } .race-story h3 { font-size:24px; } }
