/* Eclipse Dominion - Light, Dark, and Paradox theme */

:root{
  --void:#050611;
  --night:#0b1020;
  --panel:#101729;
  --panel-2:#141d32;
  --light:#f7f3df;
  --light-soft:#d8cfa7;
  --gold:#d8b767;
  --solar:#f3d36b;
  --aether:#9fd8ff;
  --umbra:#8b72ff;
  --abyss:#d76bff;
  --muted:#aeb8ca;
  --line:rgba(216,183,103,.25);
  --shadow:0 20px 60px rgba(0,0,0,.42);
  --radius:8px;
  --max:1120px;
}

*{box-sizing:border-box}
html,body{min-height:100%;overflow-x:hidden}
html,
body,
body *{
  scrollbar-width:thin;
  scrollbar-color:rgba(216,183,103,.78) rgba(5,8,18,.88);
}
html::-webkit-scrollbar,
body::-webkit-scrollbar,
body *::-webkit-scrollbar{
  width:12px;
  height:12px;
}
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
body *::-webkit-scrollbar-track{
  background:rgba(5,8,18,.88);
  border-left:1px solid rgba(216,183,103,.12);
}
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
body *::-webkit-scrollbar-thumb{
  min-height:44px;
  border:3px solid rgba(5,8,18,.88);
  border-radius:8px;
  background:rgba(216,183,103,.78);
}
html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover,
body *::-webkit-scrollbar-thumb:hover{
  background:var(--solar);
}
html::-webkit-scrollbar-button,
body::-webkit-scrollbar-button,
body *::-webkit-scrollbar-button{
  display:none;
  width:0;
  height:0;
}
html::-webkit-scrollbar-corner,
body::-webkit-scrollbar-corner,
body *::-webkit-scrollbar-corner{
  background:rgba(5,8,18,.88);
}
body{
  margin:0;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  color:var(--light);
  font-family:Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height:1.55;
  background:
    radial-gradient(900px 520px at 18% 8%, rgba(159,216,255,.16), transparent 60%),
    radial-gradient(760px 520px at 82% 8%, rgba(139,114,255,.18), transparent 62%),
    linear-gradient(115deg, rgba(248,227,132,.10), transparent 22%, rgba(215,107,255,.10) 78%, transparent),
    var(--void);
}

main{flex:1}
a{color:inherit;text-decoration:none}
img{max-width:100%}
a:hover{color:var(--solar)}
.container{width:min(var(--max), calc(100% - 32px));margin:0 auto}

.topbar{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(5,6,17,.86);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}
.topbar .container{
  width:min(100% - 32px, 1680px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:12px 0;
}
.topbar-menu-panel{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  flex:1 1 auto;
  min-width:0;
}
.site-menu-checkbox{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  margin:-1px!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
  opacity:0!important;
  pointer-events:none!important;
  appearance:none!important;
}
.site-menu-button{
  display:none;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border:1px solid rgba(216,183,103,.26);
  border-radius:8px;
  background:rgba(216,183,103,.08);
  color:var(--light);
  cursor:pointer;
}
.site-menu-bars{
  font-size:20px;
  line-height:1;
}
.brand{display:flex;align-items:center;gap:12px;min-width:230px}
.brand-mark{
  display:grid;
  place-items:center;
  width:46px;
  aspect-ratio:1;
  border:1px solid rgba(216,183,103,.55);
  border-radius:50%;
  overflow:hidden;
  background:#050611;
  box-shadow:0 0 28px rgba(216,183,103,.22);
}
.brand-mark img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.brand h1{
  margin:0;
  font-family:Cinzel, serif;
  font-size:18px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.brand small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.nav{
  flex:1 1 auto;
  min-width:0;
}
.nav ul{list-style:none;display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:nowrap;margin:0;padding:0}
.nav > ul > li{flex:0 0 auto}
.navlink,.submenu a{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:9px 11px;
  border:1px solid rgba(216,183,103,.22);
  border-radius:var(--radius);
  background:rgba(255,255,255,.035);
  color:var(--light);
  font-family:Cinzel, serif;
  font-size:12px;
  letter-spacing:.05em;
  text-transform:uppercase;
  white-space:nowrap;
}
.navlink:hover,.navlink:focus,.submenu a:hover,.submenu a:focus{
  outline:none;
  border-color:rgba(216,183,103,.58);
  background:rgba(216,183,103,.10);
}
.topbar .right{
  flex:0 0 auto;
}
.dropdown{position:relative}
.submenu{
  position:absolute;
  top:44px;
  left:0;
  min-width:240px;
  display:none;
  padding:8px;
  background:rgba(8,11,22,.97);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.dropdown:hover .submenu,.dropdown:focus-within .submenu{display:grid;gap:6px}

.hero{
  min-height:calc(100vh - 71px);
  display:flex;
  align-items:center;
  padding:70px 0 54px;
  border-bottom:1px solid rgba(216,183,103,.16);
  background:
    linear-gradient(90deg, rgba(5,6,17,.82) 0%, rgba(5,6,17,.52) 38%, rgba(5,6,17,.38) 62%, rgba(5,6,17,.80) 100%),
    linear-gradient(180deg, rgba(5,6,17,.22) 0%, rgba(5,6,17,.38) 55%, rgba(5,6,17,.92) 100%),
    url("../img/eclipse-dominion-home.c56ce4e3b67e.png") center center / cover no-repeat;
}
.hero .content{max-width:820px}
.hero-kicker{
  margin:0 0 10px;
  color:var(--gold);
  font-family:Cinzel, serif;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:13px;
}
.hero h2,.pageHeader h2{
  margin:0;
  font-family:Cinzel, serif;
  font-size:clamp(32px, 6vw, 64px);
  line-height:1.02;
  letter-spacing:.035em;
  text-transform:uppercase;
}
.hero p{max-width:72ch;font-size:18px;color:#e6eaf4}
.pageHeader{padding:46px 0 16px}
.pageHeader p{max-width:76ch;color:var(--muted);margin:12px 0 0}

.panel,.card,.rankCard,.tier{
  background:linear-gradient(180deg, rgba(20,29,50,.92), rgba(12,17,31,.94));
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.panel{margin:18px 0;padding:0;overflow:hidden}
.panel .inner{padding:22px}
.panel h3,.card h3,.tier button{
  font-family:Cinzel, serif;
  letter-spacing:.045em;
  color:var(--solar);
}
.muted{color:var(--muted)}
.grid{display:grid;gap:16px}
.grid.two{grid-template-columns:repeat(2, minmax(0,1fr))}
.grid.three{grid-template-columns:repeat(3, minmax(0,1fr))}
.card{padding:18px}
.rankExplainer{margin-bottom:16px}
.rankExplainer h3{margin-bottom:6px}
.rankExplainer p{margin:0;max-width:92ch}
.realm-card.light{border-color:rgba(216,183,103,.55)}
.realm-card.conflicted{border-color:rgba(139,114,255,.55)}
.realm-card.dark{border-color:rgba(156,43,52,.62)}
.realm-label{
  display:inline-flex;
  margin-bottom:8px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid var(--line);
  color:var(--muted);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.ctaRow{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:10px 13px;
  border:1px solid rgba(216,183,103,.35);
  border-radius:var(--radius);
  background:rgba(216,183,103,.10);
  color:var(--light);
  font-family:Cinzel, serif;
  font-size:12px;
  letter-spacing:.05em;
  text-transform:uppercase;
  cursor:pointer;
}
.btn:hover{background:rgba(216,183,103,.18);border-color:rgba(216,183,103,.62)}

.tabs{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.accordion{display:grid;gap:10px;margin-top:14px}
.tier{overflow:hidden}
.tier button{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border:0;
  background:rgba(255,255,255,.03);
  color:var(--solar);
  cursor:pointer;
}
.tier .content{display:none;padding:16px;border-top:1px solid rgba(216,183,103,.16)}
.tier.open .content{display:block}
.divisionTitle{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.divisionTitle img{
  width:34px;
  height:34px;
  object-fit:contain;
  flex:0 0 auto;
}
.divisionTitle span{
  min-width:0;
  overflow-wrap:anywhere;
  text-align:left;
}
.rankGrid{display:grid;grid-template-columns:repeat(auto-fit, minmax(190px,1fr));gap:10px}
.rankCard{padding:12px}
.rankName{font-weight:700}
.rankMeta{margin-top:6px;color:var(--muted);font-size:14px}
.rankMeta{color:var(--muted);font-size:13px;margin-top:5px}
.rankMembers{display:grid;gap:8px;margin-top:10px}
.rankMember{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:54px;
  padding:6px 8px;
  border:1px solid rgba(216,183,103,.16);
  border-radius:var(--radius);
  background:rgba(255,255,255,.035);
}
.rankMember img{
  width:42px;
  height:48px;
  object-fit:cover;
  object-position:center top;
  border-radius:6px;
  background:rgba(5,6,17,.8);
}
.rankMember strong{display:block;color:var(--light)}
.rankMember span{display:block;color:var(--muted);font-size:12px}
.highRankMember{
  min-height:156px;
  padding:10px 12px;
  align-items:center;
  justify-content:flex-start;
  flex-direction:row;
  text-align:left;
}
.highRankMember img{
  width:auto;
  height:132px;
  max-width:100%;
  object-fit:contain;
  border-radius:0;
  background:transparent;
  image-rendering:pixelated;
}
.highRankMember .highRankUsername{
  margin-bottom:5px;
}
.highRankMember .highRankIdentity{
  color:var(--light);
  font-size:14px;
  line-height:1.4;
}
.highRankMember .highRankIdentity b{
  color:var(--muted);
}
.metaBadge{
  display:inline-grid;
  gap:2px;
  margin:8px 0;
  padding:8px 10px;
  border:1px solid rgba(159,216,255,.28);
  border-radius:var(--radius);
  background:linear-gradient(90deg, rgba(159,216,255,.08), rgba(139,114,255,.10));
}
.metaBadge span{
  color:var(--muted);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.metaBadge strong{color:var(--solar)}
.teamBadge{
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin:10px 0;
  padding:9px 11px;
  border:1px solid rgba(159,216,255,.28);
  border-radius:var(--radius);
  background:linear-gradient(90deg, rgba(159,216,255,.08), rgba(139,114,255,.10));
}
.teamBadge img{
  width:44px;
  height:44px;
  object-fit:contain;
  flex:0 0 auto;
}
.teamBadge span{
  display:block;
  color:var(--muted);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.teamBadge strong{
  display:block;
  color:var(--solar);
}
.teamLeaders{
  display:grid;
  gap:7px;
  margin:10px 0 12px;
}
.teamLeaders div{
  display:grid;
  gap:2px;
}
.teamLeaders span{
  color:var(--muted);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.teamLeaders strong{
  color:var(--light);
}
.sponsorLevelHeader{
  display:flex;
  align-items:flex-start;
  gap:16px;
  margin-bottom:18px;
}
.sponsorLevelHeader img{
  width:58px;
  height:58px;
  object-fit:contain;
  flex:0 0 auto;
}
.sponsorLevelHeader h3{
  margin-top:0;
}
.sponsorDonorGrid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(150px, 190px));
  gap:14px;
  margin-top:20px;
}
.sponsorDonor{
  display:flex;
  min-height:226px;
  padding:14px 12px;
  align-items:center;
  justify-content:flex-end;
  flex-direction:column;
  text-align:center;
  border:1px solid rgba(216,183,103,.2);
  border-radius:var(--radius);
  background:rgba(5,6,17,.58);
}
.sponsorAvatar{
  display:flex;
  width:100%;
  height:158px;
  align-items:flex-end;
  justify-content:center;
  margin-bottom:8px;
  overflow:hidden;
}
.sponsorAvatar img{
  display:block;
  width:auto;
  height:150px;
  max-width:100%;
  object-fit:contain;
  image-rendering:pixelated;
}
.sponsorDonor strong{
  display:block;
  color:var(--solar);
  font-family:Cinzel, serif;
  font-size:17px;
}
.sponsorDonor span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:12px;
}
.sponsorDonor--nameOnly{
  min-height:0;
  padding:12px 14px;
  align-items:flex-start;
  text-align:left;
}
.sponsorDonor--nameOnly strong{
  font-family:inherit;
  font-size:16px;
}
.searchRow{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.searchRow input,.portal-input{
  width:min(420px,100%);
  padding:11px 12px;
  border-radius:var(--radius);
  border:1px solid rgba(216,183,103,.28);
  background:rgba(4,6,14,.7);
  color:var(--light);
}
.portal-table-wrap{
  max-height:clamp(520px,65vh,760px);
  overflow-x:auto;
  overflow-y:scroll;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable both-edges;
}
.portal-table{width:100%;min-width:640px;border-collapse:collapse}
.portal-table th,.portal-table td{padding:11px;border-bottom:1px solid rgba(216,183,103,.16);text-align:left}
.portal-table th{position:sticky;top:0;z-index:2;background:var(--panel);box-shadow:0 1px 0 rgba(216,183,103,.2);color:var(--solar);font-family:Cinzel, serif;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.realmPunishmentGroups{
  display:grid;
  gap:18px;
  max-height:clamp(560px,68vh,820px);
  overflow-y:scroll;
  padding-right:6px;
  scrollbar-gutter:stable;
}
.realmPunishmentGroup{
  overflow:hidden;
  border:1px solid rgba(216,183,103,.22);
  border-radius:var(--radius);
  background:rgba(7,11,23,.34);
}
.realmPunishmentGroupHeader{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:16px 18px;
  border-bottom:1px solid rgba(216,183,103,.16);
}
.realmPunishmentGroupHeader h3{
  margin:0;
  color:var(--solar);
  font-family:Cinzel, serif;
  font-size:18px;
  letter-spacing:.04em;
}
.realmPunishmentGroupHeader p{margin:5px 0 0}
.realmPunishmentCount{
  flex:0 0 auto;
  color:var(--muted);
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.realmPunishmentTableWrap{border:0}
.realmPunishmentTable{min-width:1040px}
.realmPunishmentTable th,.realmPunishmentTable td{vertical-align:top}
.realmPunishmentName{
  width:18%;
  color:var(--light);
  font-weight:800;
}
.realmPunishmentReason{
  width:30%;
  color:var(--muted);
}
.realmPunishmentAction{
  min-height:34px;
  padding:8px 11px;
  white-space:nowrap;
}
.codeChapter{scroll-margin-top:96px}
.panel h3.chapterLabel{
  display:inline-flex;
  margin:0 0 8px;
  padding:4px 0;
  color:var(--light-soft);
  font-family:Cinzel, serif;
  font-size:18px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.codeRuleList{
  display:grid;
  gap:0;
  margin:14px 0 0;
  padding:0;
  list-style:none;
  counter-reset:code-rule;
  border-top:1px solid rgba(216,183,103,.16);
}
.codeRuleList li{
  counter-increment:code-rule;
  display:grid;
  grid-template-columns:42px minmax(0, 1fr);
  gap:12px;
  padding:12px 0;
  color:var(--light);
  border-bottom:1px solid rgba(216,183,103,.16);
}
.codeRuleList li::before{
  content:counter(code-rule) ".";
  color:var(--solar);
  font-family:Cinzel, serif;
  font-weight:700;
}
.codeNumber,
.codeCommandShort{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:4px 8px;
  border:1px solid rgba(216,183,103,.28);
  border-radius:999px;
  color:var(--solar);
  background:rgba(216,183,103,.08);
  font-size:12px;
  font-weight:700;
}
.codeTable,
.codeSubgrid{margin-top:18px}
.codeWideCard p:first-child{margin-top:0}
.codeWideCard p:last-child{margin-bottom:0}
.codeListCard ul{
  margin:10px 0 0;
  padding-left:20px;
  color:var(--muted);
}
.codeListCard li + li{margin-top:8px}
.codeCommandList{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:14px;
  margin-top:14px;
}
.codeCommandCard{
  display:grid;
  gap:8px;
  align-content:start;
}
.codeCommandCard h3{margin:8px 0 0}
.codeCommandCard p{margin:0;color:var(--muted)}
.codeCommandCard strong{color:var(--light)}
.codeSectionTitle{margin:22px 0 0}
.codeStrikeCard{
  display:grid;
  gap:5px;
}
.codeStrikeCard span{
  color:var(--muted);
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.codeStrikeCard strong{font-size:18px}
.logo{width:54px;height:54px;object-fit:contain;float:right;margin-left:12px}
.logoSmall{width:42px;height:42px;object-fit:contain;float:right;margin-left:10px}

.footer{margin-top:34px;border-top:1px solid var(--line);padding:28px 0;color:var(--muted);background:rgba(5,6,17,.78);text-align:center}
.footer .container{text-align:center}
.footer p{margin:0 auto 8px;max-width:1180px;text-align:center}
.footer-disclaimer{line-height:1.5;text-align:center}
.footer-copyright,
.footer-credit,
.footer-version{color:var(--muted);text-align:center}
.footer a{
  color:var(--gold);
  font-weight:700;
  text-decoration:none;
}
.footer a:hover{text-decoration:underline}
.footer-version-separator{display:inline-block;margin:0 8px;color:var(--muted)}
.footer-heart{
  color:#e94b5f;
  font-weight:800;
}
.footer-credit-link{color:#f0cf70}

@media (max-width: 1100px){
  :root{--max:940px}
  .topbar .container{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    grid-template-areas:
      "brand toggle"
      "menu menu";
    align-items:center;
    gap:12px;
  }
  .brand{grid-area:brand}
  .site-menu-button{
    grid-area:toggle;
    display:flex;
  }
  .topbar-menu-panel{
    grid-area:menu;
    display:none;
    width:100%;
    grid-template-columns:1fr;
    gap:10px;
  }
  .site-menu-checkbox:checked + .site-menu-button + .topbar-menu-panel{
    display:grid;
  }
  .nav{
    width:100%;
    overflow:visible;
    padding-bottom:0;
  }
  .topbar .nav{grid-area:auto}
  .nav ul{
    width:100%;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:stretch;
  }
  .nav > ul > li{flex:0 0 auto}
  .nav > ul > li > .navlink{
    justify-content:center;
    min-width:0;
    width:100%;
  }
  .topbar .right{
    width:100%;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    align-items:stretch;
  }
  .topbar .right .pill,
  .topbar .right .navlink{
    width:100%;
    max-width:none;
    justify-content:center;
  }
  .topbar .right .pill{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .dropdown{position:static}
  .submenu{
    position:static;
    width:100%;
    min-width:0;
    margin-top:6px;
  }
}

@media (max-width: 780px){
  .portal-table-wrap{
    max-height:min(58vh,520px);
  }
  .realmPunishmentGroups,
  .codeRuleList{
    max-height:min(64vh,620px);
  }
  .container{width:min(100% - 24px, var(--max))}
  .realmPunishmentGroupHeader{
    display:grid;
    gap:8px;
  }
  .realmPunishmentTable{min-width:760px}
  .realmPunishmentName,
  .realmPunishmentReason{width:auto}
  .realmPunishmentAction{
    width:100%;
  }
  .brand{min-width:0}
  .brand h1{font-size:16px}
  .brand small{font-size:11px}
  .brand-mark{width:42px}
  .topbar .container{
    grid-template-columns:minmax(0, 1fr) auto;
    grid-template-areas:
      "brand toggle"
      "menu menu";
  }
  .nav ul{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .dropdown{position:static}
  .submenu{
    position:static;
    width:100%;
    min-width:0;
  }
  .grid.two,.grid.three{grid-template-columns:1fr}
  .hero{
    min-height:auto;
    padding:50px 0 42px;
    background-position:center top;
  }
  .hero h2,.pageHeader h2{font-size:clamp(30px, 11vw, 46px)}
  .hero p{font-size:16px}
  .pageHeader{padding:34px 0 12px}
  .panel{margin:14px 0}
  .panel .inner{padding:16px}
  .card{padding:15px}
  .tabs{
    display:grid;
    grid-template-columns:1fr;
  }
  .btn,
  .nav > ul > li > .navlink,
  .submenu a{
    width:100%;
    justify-content:center;
    white-space:normal;
    text-align:center;
  }
  .topbar .right{
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:100%;
    display:grid!important;
  }
  .topbar .right .pill,
  .topbar .right .navlink{
    width:100%;
    max-width:none;
  }
  .ctaRow{display:grid;grid-template-columns:1fr}
  .rankGrid{grid-template-columns:1fr}
  .rankMember:not(.highRankMember){align-items:flex-start}
  .searchRow input,.portal-input{width:100%;min-width:0}
  .footer{font-size:13px}
}

@media (max-width: 480px){
  .container{width:min(100% - 18px, var(--max))}
  .topbar .container{padding:10px 0}
  .site-menu-button{width:40px;height:40px}
  .brand{gap:10px}
  .brand h1{font-size:14px;letter-spacing:.05em}
  .brand small{display:none}
  .brand-mark{width:38px}
  .nav ul{grid-template-columns:1fr 1fr}
  .nav > ul > li > .navlink,
  .submenu a{min-height:42px;padding:9px 8px;font-size:11px}
  .topbar .right{
    grid-template-columns:1fr;
  }
  .hero{padding:42px 0 34px}
  .hero-kicker{font-size:11px;letter-spacing:.08em}
  .hero h2,.pageHeader h2{font-size:30px}
  .panel .inner{padding:14px}
  .portal-table th,.portal-table td{padding:9px}
  .rankMember img{width:38px;height:44px}
  .highRankMember{min-height:148px}
  .highRankMember img{width:auto;height:124px}
  .sponsorDonorGrid{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .sponsorDonor{min-height:206px;padding:12px 8px}
  .sponsorDonor--nameOnly{min-height:0;padding:10px 12px}
  .sponsorAvatar{height:140px}
  .sponsorAvatar img{height:132px}
}