/* Modern home page preview */
.home-modern-page {
  --home-gold: #f4c759;
  --home-gold-deep: #9b621b;
  --home-green: #143d2a;
  --home-green-soft: #1e5438;
  --home-brown: #32190f;
  --home-cream: #f7e9c8;
  padding: 16px;
  background: linear-gradient(180deg, #f4e2bd, #e8cea0);
  text-align: left;
}

.home-modern-hero {
  position: relative;
  overflow: hidden;
  padding: 46px clamp(22px, 6vw, 72px) 32px;
  border: 1px solid #a5752d;
  border-radius: 12px;
  background:
    radial-gradient(circle at 82% 32%, rgba(55,174,111,.24), transparent 32%),
    radial-gradient(circle at 12% 0, rgba(244,199,89,.19), transparent 30%),
    linear-gradient(135deg, #102d22 0%, #153c2a 58%, #32180f 100%);
  color: var(--home-cream);
  box-shadow: 0 14px 34px rgba(48,25,12,.26), inset 0 0 0 1px rgba(255,231,160,.09);
}

.home-modern-hero::after {
  content: "⚔";
  position: absolute;
  right: 6%;
  bottom: -70px;
  color: rgba(244,199,89,.075);
  font-size: 270px;
  line-height: 1;
  transform: rotate(-10deg);
  pointer-events: none;
}

.home-modern-language {
  position: absolute;
  top: 16px;
  right: 20px;
  color: #cdbf9e;
  font-size: 13px;
}

.home-modern-language a { color: #ffe29a; }
.home-modern-language span { padding: 0 5px; color: #7c9e84; }

.home-modern-eyebrow,
.home-modern-section-head > span,
.home-modern-purchase-copy > span,
.home-modern-final > span {
  color: var(--home-gold);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .11em;
}

.home-modern-eyebrow i {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 8px;
  border-radius: 50%;
  background: #5ee58c;
  box-shadow: 0 0 10px #5ee58c;
}

.home-modern-hero h1 {
  position: relative;
  z-index: 1;
  max-width: 670px;
  margin: 16px 0 12px;
  color: #fff3ca;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(38px, 6vw, 64px);
  line-height: .98;
  text-shadow: 0 3px 0 #251109, 0 0 22px rgba(244,199,89,.15);
}

.home-modern-hero h1 strong { color: var(--home-gold); }

.home-modern-hero > p {
  position: relative;
  z-index: 1;
  max-width: 590px;
  margin: 0;
  color: #dfd1af;
  font-size: 18px;
  line-height: 1.55;
}

.home-modern-actions {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 24px;
}

.home-modern-button {
  min-height: 46px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 7px;
  font-weight: 800;
  text-decoration: none;
  transition: transform .18s ease, filter .18s ease;
}

.home-modern-button:hover { transform: translateY(-2px); filter: brightness(1.1); }

.home-modern-button-primary,
.home-modern-button-gold {
  border-color: #ffd879;
  background: linear-gradient(#e6aa36, #955617);
  color: #fff7dc;
  box-shadow: inset 0 1px rgba(255,255,255,.3), 0 6px 14px rgba(0,0,0,.3);
}

.home-modern-button-secondary {
  border-color: #5d8a71;
  background: rgba(10,31,23,.62);
  color: #f2dfb2;
}

.home-modern-network {
  position: relative;
  z-index: 1;
  margin-top: 30px;
  padding-top: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  border-top: 1px solid rgba(255,230,168,.14);
  color: #aebfac;
  font-size: 13px;
}

.home-modern-network span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #e2a93d;
}

.home-modern-network b { margin-left: auto; color: #e5d4ac; }

.home-modern-status {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
}

.home-modern-status article {
  min-height: 120px;
  padding: 18px;
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 12px;
  border: 1px solid #9c7035;
  border-radius: 9px;
  background: linear-gradient(145deg, #3d2115, #1d3328);
  color: #eadbb8;
  box-shadow: 0 7px 17px rgba(69,36,14,.18);
}

.home-modern-status article.home-modern-status-featured {
  border-color: #d09b36;
  background: linear-gradient(145deg, #4b2815, #244d34);
}

.home-modern-status-icon { font-size: 30px; }
.home-modern-status small { color: #d8ad50; font-weight: 800; letter-spacing: .08em; }
.home-modern-status h2 { margin: 3px 0 5px; color: #fff0bd; font-size: 18px; }
.home-modern-status p { margin: 0; color: #cdbf9f; font-size: 13px; line-height: 1.45; }

.home-modern-development {
  margin-top: 20px;
  padding: 20px;
  display: grid;
  grid-template-columns: 56px 1fr auto;
  gap: 16px;
  align-items: center;
  border: 1px solid #b48b50;
  border-radius: 10px;
  background: linear-gradient(135deg, #f9e9c7, #e9cea0);
  color: #5d3518;
}

.home-modern-development-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #163a2a;
  font-size: 27px;
}

.home-modern-development span { color: #95621e; font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.home-modern-development h2 { margin: 3px 0 5px; color: #5c2e0d; font-size: 21px; }
.home-modern-development p { margin: 0; line-height: 1.5; }
.home-modern-development > a { color: #704313; font-weight: 800; white-space: nowrap; }

.home-modern-update-flow {
  margin-top: 20px;
  padding: clamp(22px, 4vw, 36px);
  border: 1px solid #98692a;
  border-radius: 12px;
  background:
    radial-gradient(circle at 50% 0, rgba(244,199,89,.18), transparent 42%),
    linear-gradient(145deg, #173e2b, #102d22 60%, #32190f);
  color: #dfd1af;
  box-shadow: 0 11px 26px rgba(45,23,12,.22), inset 0 0 0 1px rgba(255,231,160,.07);
}

.home-modern-flow-head {
  max-width: 680px;
  margin: 0 auto 24px;
  text-align: center;
}

.home-modern-flow-head > span {
  color: var(--home-gold);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .11em;
}

.home-modern-flow-head h2 {
  margin: 6px 0 7px;
  color: #fff0bd;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(27px, 4vw, 38px);
}

.home-modern-flow-head p { margin: 0; line-height: 1.5; }

.home-modern-flow-steps {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr) 24px minmax(0, 1fr) 24px minmax(0, 1fr);
  gap: 7px;
  align-items: stretch;
}

.home-modern-flow-steps article {
  position: relative;
  min-height: 170px;
  padding: 22px 14px 16px;
  border: 1px solid rgba(231,193,102,.28);
  border-radius: 9px;
  background: rgba(7,29,21,.58);
  text-align: center;
}

.home-modern-flow-steps article:last-of-type {
  border-color: rgba(142,196,255,.36);
  background: rgba(40,31,70,.48);
}

.home-modern-flow-steps article > b {
  position: absolute;
  top: 8px;
  left: 10px;
  color: rgba(244,199,89,.55);
  font-size: 11px;
}

.home-modern-flow-steps article > i {
  display: block;
  margin-bottom: 8px;
  font-size: 29px;
  font-style: normal;
}

.home-modern-flow-steps h3 {
  margin: 0 0 7px;
  color: #ffe7a8;
  font-size: 16px;
}

.home-modern-flow-steps p {
  margin: 0;
  color: #c8baa0;
  font-size: 12px;
  line-height: 1.45;
}

.home-modern-flow-steps > span {
  align-self: center;
  color: var(--home-gold);
  font-size: 23px;
  text-align: center;
}

.home-modern-flow-note {
  width: fit-content;
  margin: 20px auto 0;
  padding: 8px 13px;
  border: 1px solid rgba(244,199,89,.25);
  border-radius: 999px;
  background: rgba(244,199,89,.08);
  color: #e7d6ad;
  font-size: 12px;
  text-align: center;
}

.home-modern-purchase {
  margin-top: 20px;
  padding: clamp(22px, 4vw, 40px);
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  gap: 32px;
  align-items: center;
  border: 1px solid #a27027;
  border-radius: 12px;
  background:
    radial-gradient(circle at 90% 20%, rgba(140,83,181,.25), transparent 35%),
    linear-gradient(135deg, #183d2b, #102d22 55%, #3b1d12);
  color: #e7d9b6;
  box-shadow: 0 12px 28px rgba(45,23,12,.23);
}

.home-modern-purchase h2,
.home-modern-section-head h2,
.home-modern-final h2 {
  margin: 7px 0 10px;
  color: #fff0bd;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(28px, 4vw, 40px);
  line-height: 1.08;
}

.home-modern-purchase p { margin: 0; line-height: 1.6; }

.home-modern-purchase ul,
.home-modern-compare ul {
  margin: 18px 0 22px;
  padding: 0;
  list-style: none;
}

.home-modern-purchase li { margin: 9px 0; }
.home-modern-purchase li b { margin-right: 7px; color: #65df91; }

.home-modern-version-visual {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 34px 1fr;
  gap: 8px;
  align-items: stretch;
}

.home-modern-version-visual article {
  min-height: 160px;
  padding: 20px 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,219,130,.36);
  border-radius: 10px;
  background: rgba(5,27,20,.55);
  text-align: center;
}

.home-modern-version-visual article:last-of-type { background: rgba(64,30,72,.42); }
.home-modern-version-visual small { color: #bcaa83; }
.home-modern-version-visual strong { margin: 6px 0; color: var(--home-gold); font-size: 22px; }
.home-modern-version-visual span { color: #d8c9a7; font-size: 13px; }
.home-modern-version-visual > i { align-self: center; color: var(--home-gold); font-size: 28px; font-style: normal; text-align: center; }
.home-modern-version-visual > b { grid-column: 1 / -1; padding: 8px; border-radius: 6px; background: #c18425; color: #fff3cf; text-align: center; }

.home-modern-faq,
.home-modern-gallery {
  margin-top: 20px;
  padding: clamp(22px, 4vw, 40px);
  border: 1px solid #a77939;
  border-radius: 12px;
  background: linear-gradient(180deg, #f7e8c8, #ead1a5);
  color: #5f381c;
}

.home-modern-section-head { max-width: 720px; margin: 0 auto 24px; text-align: center; }
.home-modern-section-head h2 { color: #5c2d0b; text-shadow: none; }
.home-modern-section-head > strong {
  display: inline-block;
  margin: 6px 0;
  padding: 8px 22px;
  border: 1px solid #a1261c;
  border-radius: 999px;
  background: linear-gradient(#c84531, #7e1c15);
  color: #fff1d7;
  font-size: 28px;
  box-shadow: 0 5px 12px rgba(99,27,17,.22);
}

.home-modern-section-head p { margin: 7px 0 0; line-height: 1.5; }

.home-modern-compare {
  display: grid;
  grid-template-columns: 1fr 84px 1fr;
  gap: 12px;
  align-items: stretch;
}

.home-modern-compare article {
  padding: 22px;
  border: 1px solid #845d2c;
  border-radius: 10px;
  background: linear-gradient(145deg, #163e2b, #2e190f);
  color: #e8dab9;
  box-shadow: 0 8px 18px rgba(72,38,16,.19);
}

.home-modern-compare article.home-modern-compare-online { background: linear-gradient(145deg, #29234c, #32180f); }
.home-modern-compare article > span { color: #d9ac4d; font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.home-modern-compare h3 { margin: 7px 0 14px; color: #fff0bd; font-size: 24px; }
.home-modern-compare li { position: relative; margin: 10px 0; padding-left: 20px; }
.home-modern-compare li::before { content: "✓"; position: absolute; left: 0; color: #66dd91; font-weight: 900; }

.home-modern-divider { display: flex; flex-direction: column; align-items: center; justify-content: center; color: #754317; text-align: center; }
.home-modern-divider span { width: 52px; height: 52px; display: grid; place-items: center; border: 2px solid #a46b23; border-radius: 50%; background: #f1d8aa; font-size: 28px; font-weight: 900; }
.home-modern-divider small { margin-top: 7px; font-weight: 800; line-height: 1.2; }
.home-modern-faq-note { max-width: 730px; margin: 22px auto 0; text-align: center; line-height: 1.55; }

.home-modern-gallery .feature-carousel { margin-top: 8px; }

.home-modern-final {
  margin-top: 20px;
  padding: 36px 22px;
  border: 1px solid #a97932;
  border-radius: 12px;
  background: linear-gradient(135deg, #193f2c, #102c21 62%, #371a10);
  color: #d9cbaa;
  text-align: center;
}

.home-modern-final .home-modern-actions { justify-content: center; }
.home-modern-final p { margin: 0; }

@media (max-width: 820px) {
  .home-modern-status { grid-template-columns: 1fr; }
  .home-modern-purchase { grid-template-columns: 1fr; }
  .home-modern-compare { grid-template-columns: 1fr; }
  .home-modern-divider { flex-direction: row; gap: 9px; }
  .home-modern-development { grid-template-columns: 48px 1fr; }
  .home-modern-development > a { grid-column: 2; }
  .home-modern-flow-steps { grid-template-columns: 1fr; }
  .home-modern-flow-steps > span { transform: rotate(90deg); }
}

@media (max-width: 560px) {
  .home-modern-page { padding: 8px; }
  .home-modern-hero { padding: 58px 18px 24px; }
  .home-modern-language { left: 18px; right: auto; }
  .home-modern-hero h1 { font-size: 39px; }
  .home-modern-actions { flex-direction: column; }
  .home-modern-button { width: 100%; box-sizing: border-box; }
  .home-modern-network { align-items: flex-start; flex-wrap: wrap; }
  .home-modern-network b { width: 100%; margin-left: 16px; }
  .home-modern-status article { grid-template-columns: 38px 1fr; }
  .home-modern-development { padding: 16px; }
  .home-modern-development > a { grid-column: 1 / -1; }
  .home-modern-version-visual { grid-template-columns: 1fr; }
  .home-modern-version-visual > i { transform: rotate(0deg); }
  .home-modern-version-visual > b { grid-column: auto; }
  .home-modern-faq,
  .home-modern-gallery { padding: 22px 14px; }
}

@media (max-width: 760px) {
  .support-premium-grid {
    grid-template-columns: 1fr;
  }

  .support-premium-card {
    min-height: 520px;
  }
}

/* Modern item sets, rarity placeholders and centered footer */
.footer {
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}

.items-set-card {
  --set-accent: #8d6842;
  --set-border: #7b5b3a;
  --set-soft: #ead9bd;
  --set-title-a: #4c3625;
  --set-title-b: #261b14;
  position: relative;
  overflow: hidden;
  border: 2px solid var(--set-border);
  border-radius: 11px;
  background:
    radial-gradient(circle at 50% -10%, var(--set-soft), transparent 42%),
    linear-gradient(145deg, #f6e7cb, #dfc69d);
  box-shadow: 0 10px 24px rgba(57,34,18,.14), inset 0 0 0 1px rgba(255,255,255,.35);
}

.items-set-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, transparent, var(--set-accent), transparent);
}

.items-set-card > h3 {
  margin: -4px -4px 14px;
  padding: 12px 14px 11px;
  border: 1px solid var(--set-border);
  border-radius: 7px;
  background: linear-gradient(135deg, var(--set-title-a), var(--set-title-b));
  color: #fff2c9;
  text-shadow: 0 2px 0 rgba(0,0,0,.38);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 5px 12px rgba(45,25,12,.14);
}

.items-set-card .item-slot,
.items-set-card .items-list-entry {
  border-color: color-mix(in srgb, var(--set-accent) 48%, #6b5138);
  border-radius: 7px;
  background: linear-gradient(145deg, rgba(255,255,255,.72), var(--set-soft));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.42), 0 3px 8px rgba(65,39,20,.07);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.items-set-card .item-slot:hover,
.items-set-card .items-list-entry:hover {
  transform: translateY(-2px);
  border-color: var(--set-accent);
  box-shadow: 0 6px 12px rgba(65,39,20,.13);
}

.items-set-card .item-slot img,
.items-set-card .items-list-entry img,
.items-set-card .item-variant-row img {
  border-radius: 6px;
  background: rgba(255,250,239,.8);
  box-shadow: 0 3px 8px rgba(45,25,12,.1);
}

/* Leather */
.items-set-grid > .items-set-card:nth-child(1) { --set-accent:#9b6533; --set-border:#6f4525; --set-soft:#e4c69f; --set-title-a:#704421; --set-title-b:#3b2416; }
/* Studded */
.items-set-grid > .items-set-card:nth-child(2) { --set-accent:#b48245; --set-border:#72512e; --set-soft:#dbc5a7; --set-title-a:#5f4831; --set-title-b:#2c251f; }
/* Iron */
.items-set-grid > .items-set-card:nth-child(3) { --set-accent:#87929c; --set-border:#5f6870; --set-soft:#d7dce0; --set-title-a:#626d76; --set-title-b:#30383f; }
/* Soldier */
.items-set-grid > .items-set-card:nth-child(4) { --set-accent:#7e883f; --set-border:#59602c; --set-soft:#d9d7ae; --set-title-a:#5e662e; --set-title-b:#30351d; }
/* Steel */
.items-set-grid > .items-set-card:nth-child(5) { --set-accent:#658da6; --set-border:#496b80; --set-soft:#c9dce5; --set-title-a:#416d88; --set-title-b:#243b4b; }
/* Lizard */
.items-set-grid > .items-set-card:nth-child(6) { --set-accent:#4e9c4f; --set-border:#37723a; --set-soft:#c4dfb9; --set-title-a:#34753a; --set-title-b:#1d4223; }
/* Cryo */
.items-set-grid > .items-set-card:nth-child(7) { --set-accent:#42b8d5; --set-border:#318aa2; --set-soft:#c4eaf1; --set-title-a:#268ca8; --set-title-b:#174d67; }
/* Dragon */
.items-set-grid > .items-set-card:nth-child(8) { --set-accent:#d35b38; --set-border:#913d2a; --set-soft:#ebc1a9; --set-title-a:#9e3826; --set-title-b:#4c1d17; }
/* Minotaur */
.items-set-grid > .items-set-card:nth-child(9) { --set-accent:#c4923e; --set-border:#85632f; --set-soft:#e6d1a2; --set-title-a:#876126; --set-title-b:#493317; }

/* A colored square replaces every missing item image without changing the layout. */
.item-slot:not(.has-image):not(.item-variant-slot),
.items-list-entry:not(.has-image):not(.item-variant-slot),
.item-variant-row:not(.has-image) {
  --rarity-color: #9a8f7f;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  justify-content: stretch;
  justify-items: stretch;
  gap: 8px;
  text-align: center;
}

.item-slot:not(.has-image):not(.item-variant-slot)::before,
.items-list-entry:not(.has-image):not(.item-variant-slot)::before,
.item-variant-row:not(.has-image)::before {
  content: "◆";
  width: 38px;
  height: 38px;
  box-sizing: border-box;
  display: inline-flex;
  flex: 0 0 38px;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--rarity-color);
  border-radius: 6px;
  background:
    radial-gradient(circle, color-mix(in srgb, var(--rarity-color) 28%, white), rgba(255,255,255,.72) 64%),
    #f4ead7;
  color: var(--rarity-color);
  font-size: 16px;
  text-shadow: 0 1px 0 #fff;
  box-shadow: 0 3px 8px color-mix(in srgb, var(--rarity-color) 22%, transparent);
}

.item-slot:not(.has-image):not(.item-variant-slot)::before,
.items-list-entry:not(.has-image):not(.item-variant-slot)::before,
.item-variant-row:not(.has-image)::before {
  justify-self: start;
}

.item-slot:not(.has-image):not(.item-variant-slot) > span,
.items-list-entry:not(.has-image):not(.item-variant-slot) > span,
.item-variant-row:not(.has-image) > span {
  min-width: 0;
  justify-self: center;
  text-align: center;
}

.item-slot:has(.rarity-name-uncommon),
.items-list-entry:has(.rarity-name-uncommon),
.item-variant-row:has(.rarity-name-uncommon),
.items-list-entry[data-item-name*="Uncommon"] { --rarity-color:#2ABE5F; }
.item-slot:has(.rarity-name-rare),
.items-list-entry:has(.rarity-name-rare),
.item-variant-row:has(.rarity-name-rare),
.items-list-entry[data-item-name*="Rare"] { --rarity-color:#3791FF; }
.item-slot:has(.rarity-name-epic),
.items-list-entry:has(.rarity-name-epic),
.item-variant-row:has(.rarity-name-epic),
.items-list-entry[data-item-name*="Epic"] { --rarity-color:#A55AFF; }
.item-slot:has(.rarity-name-legendary),
.items-list-entry:has(.rarity-name-legendary),
.item-variant-row:has(.rarity-name-legendary),
.items-list-entry[data-item-name*="Legendary"] { --rarity-color:#D7A900; }
.item-slot:has(.rarity-name-mythic),
.items-list-entry:has(.rarity-name-mythic),
.item-variant-row:has(.rarity-name-mythic),
.items-list-entry[data-item-name*="Mythic"] { --rarity-color:#FF8723; }

.shop-item-no-image {
  width: 62px;
  height: 62px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 2px solid #9a8f7f;
  border-radius: 7px;
  background: radial-gradient(circle, #ded5c7, #746b60);
  color: transparent;
  box-shadow: 0 4px 10px rgba(0,0,0,.28);
}

.shop-item-no-image::after {
  content: "◆";
  color: #ece3d5;
  font-size: 22px;
  text-shadow: 0 2px 0 rgba(0,0,0,.28);
}

@media (max-width: 700px) {
  .items-set-card {
    border-radius: 9px;
    padding: 11px;
  }
}

.welcome-faq-card {
  position: relative;
  margin: 0 auto 24px;
  padding: 18px 22px 20px;
  max-width: 860px;
  background: linear-gradient(180deg, #f9e7c2 0%, #efd3a0 100%);
  border: 2px solid #8f5a1f;
  box-shadow: 0 3px 0 #5a2800, inset 0 0 0 1px rgba(255,255,255,.38);
  color: #4f2300;
}

.welcome-faq-card::before {
  content: "";
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(122, 46, 0, .18);
  pointer-events: none;
}

.welcome-faq-card h3 {
  margin: 0 auto 8px;
  padding-bottom: 7px;
  max-width: 620px;
  color: #7a2e00;
  border-bottom: 1px solid rgba(122, 46, 0, .32);
  font-size: 26px;
  text-transform: uppercase;
  text-align: center;
}

.welcome-faq-card h4 {
  margin: 0 0 14px;
  color: #2f1600;
  font-size: 21px;
  text-align: center;
}

.welcome-faq-card p {
  margin: 0 0 10px;
  color: #5a2800;
  line-height: 1.6;
}

.faq-save-summary {
  margin: 14px 0;
  padding: 11px 13px;
  border: 1px solid rgba(95, 77, 65, .48);
  border-left: 4px solid #8f5a1f;
  background: rgba(255, 244, 221, .62);
}

.faq-save-summary p {
  margin-bottom: 7px;
}

.faq-save-summary p:last-child {
  margin-bottom: 0;
}

.faq-save-summary strong {
  color: #7a2e00;
}

.faq-mark {
  font-weight: 800;
  padding: 1px 4px;
  background: rgba(255, 244, 221, .44);
}

.faq-mark-blue { color: #0b62b8; }
.faq-mark-gold { color: #9a6500; }
.faq-mark-green { color: #137a35; }
.faq-mark-red { color: #b32116; }

@media (max-width: 720px) {
  .welcome-faq-card {
    padding: 15px 14px 17px;
  }

  .welcome-faq-card h3 {
    font-size: 21px;
  }

  .welcome-faq-card h4 {
    font-size: 18px;
  }
}

/* Final portal navigation rules: keep the legacy horizontal menu from
   overriding the new desktop sidebar layout. */
@media (min-width: 901px) {
  .portal-shell #mainMenu {
    display: block !important;
    align-items: initial !important;
    justify-content: initial !important;
    overflow: hidden !important;
  }

  .portal-shell #mainMenu .menu-top {
    display: flex !important;
  }

  .portal-shell #mainMenu .menu-top .brand {
    display: block !important;
  }

  .portal-shell #mainMenu .menu-toggle {
    display: none !important;
  }

  .portal-shell #mainMenu .menu-links {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    width: 100% !important;
  }

  .portal-shell #mainMenu .menu-links a,
  .portal-shell #mainMenu .menu-links a.right {
    display: block !important;
    width: 100% !important;
    padding: 10px 9px 10px 25px !important;
    border-top: 0 !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(214,177,99,.2) !important;
    margin: 0 !important;
    white-space: normal !important;
    text-align: left !important;
  }
}

@media (max-width: 900px) {
  .portal-shell #mainMenu {
    display: block !important;
  }

  .portal-shell #mainMenu .menu-top {
    display: flex !important;
  }

  .portal-shell #mainMenu .menu-top .brand,
  .portal-shell #mainMenu .menu-toggle {
    display: inline-flex !important;
  }

  .portal-shell #mainMenu .menu-links {
    display: none !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
  }

  .portal-shell #mainMenu .menu-links.is-open {
    display: flex !important;
  }

  .portal-shell #mainMenu .menu-links a,
  .portal-shell #mainMenu .menu-links a.right {
    display: block !important;
    width: 100% !important;
    padding: 11px 10px 11px 25px !important;
    white-space: normal !important;
    text-align: left !important;
  }
}

.portal-shell #mainMenu .menu-links .portal-menu-submenu a,
.portal-shell #mainMenu .menu-links .portal-menu-submenu a.right {
  min-height: 25px !important;
  margin: 0 !important;
  padding: 5px 7px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(175,213,198,.27) !important;
  color: #f4f5eb !important;
  background: transparent !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

.portal-shell #mainMenu .menu-links .portal-menu-submenu a:hover,
.portal-shell #mainMenu .menu-links .portal-menu-submenu a:focus-visible,
.portal-shell #mainMenu .menu-links .portal-menu-submenu a.active {
  color: #fff3a6 !important;
  background: rgba(15,87,78,.85) !important;
}
.guild-sent-invitations {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(197, 151, 53, 0.35);
}

.guild-sent-invitations h4 {
  margin: 0 0 10px;
  color: #572800;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.05rem;
}

.guild-sent-invitation-list {
  display: grid;
  gap: 8px;
}