/* Sculpted game icons, the clan crest and language share one compact main menu. */
.site-shell > .clan-main-menu {
  position: relative;
  display: grid;
  grid-template-columns: 176px minmax(0,1fr) 130px;
  grid-template-areas: "brand navigation language";
  align-items: center;
  gap: 12px;
  min-height: 132px;
  margin: 19px 0 4px;
  padding: 12px 16px 12px 14px;
  border: 1px solid #aa854c;
  border-top-color: #d9b674;
  border-radius: 6px;
  background: radial-gradient(ellipse at 12% 0,#bd8b3d1c,transparent 46%),var(--game-woodgrain);
  box-shadow: inset 0 0 0 3px #1b161c,inset 0 0 0 4px #d4ad611f,0 5px 18px #0005;
}
.clan-main-menu::before,.clan-main-menu::after {
  position: absolute;
  top: -4px;
  left: -4px;
  width: 31px;
  height: 31px;
  content: '';
  pointer-events: none;
  background: url('/game-ui/gold-corner.svg') center / contain no-repeat;
}
.clan-main-menu::after { left:auto; right:-4px; transform:scaleX(-1); }
.clan-main-menu .brand { grid-area:brand; gap:11px; min-width:0; width:fit-content; outline-offset:6px; }
.clan-main-menu .brand-copy { min-width:0; padding-top:2px; }
.clan-main-menu .brand-name {
  color: #ffe6ae;
  font: 600 28px/1.1 var(--serif);
  letter-spacing: .13em;
  text-shadow: 0 1px 0 #503617,0 3px 5px #000a;
}
.clan-main-menu .brand-subtitle {
  max-width:90px;
  margin-top:7px;
  color:#d3ba88;
  font-size:8px;
  font-weight:600;
  line-height:1.5;
  letter-spacing:.12em;
}
.clan-crest {
  position:relative;
  display:grid;
  place-items:center;
  flex:none;
  width:78px;
  height:78px;
  border:1px solid #f0d28f;
  border-radius:50%;
  background:conic-gradient(from 145deg,#5b391c,#e4bd6c 18%,#ffebae 30%,#956428 47%,#4b2c15 60%,#dbb771 80%,#5b391c);
  box-shadow:inset 0 0 0 3px #2c2019,inset 0 0 0 4px #f2cf855c,0 4px 0 #4d321c,0 7px 0 #171214,0 10px 13px #0009;
  transform:perspective(450px) rotateY(-9deg) rotateX(4deg);
  transition:transform 220ms ease,filter 220ms ease,box-shadow 220ms ease;
}
.clan-crest-face {
  position:relative;
  display:grid;
  place-items:center;
  width:65px;
  height:65px;
  border:1px solid #9e7b3c;
  border-radius:50%;
  background:radial-gradient(ellipse at 40% 25%,#47624b,#1d3327 55%,#101c17);
  box-shadow:inset 0 2px 5px #0009,inset 0 -1px 0 #ffeab83b;
}
.clan-crest-face img { position:relative; width:66px; height:66px; object-fit:contain; filter:drop-shadow(1px 3px 1px #000b); }
.clan-main-menu .brand:focus-visible .clan-crest { transform:perspective(450px) rotateY(4deg) rotateX(-4deg) translateY(-3px) scale(1.07); filter:brightness(1.12); }
.clan-main-menu > .section-navigation {
  grid-area:navigation;
  display:grid;
  grid-template-columns:1fr 1.12fr 1.4fr .86fr .86fr 1fr;
  align-items:stretch;
  justify-content:normal;
  align-self:center;
  flex:none;
  gap:6px;
  width:100%;
  min-width:0;
  margin:0;
  border:0;
}
.clan-main-menu .section-navigation > a,
.clan-main-menu .section-navigation > a[data-page='advanced'] {
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-width:0;
  min-height:104px;
  width:auto;
  margin:0;
  padding:7px 5px 9px;
  border:1px solid #92714670;
  border-radius:4px;
  background:linear-gradient(180deg,#292f26d9,#181c19e8);
  color:#d8c5a5;
  box-shadow:inset 0 1px 0 #e2ce9d12,0 2px 2px #0005;
  font:550 12px/1.3 var(--sans);
  text-align:center;
  text-shadow:0 1px 2px #000;
  overflow-wrap:normal;
  word-break:normal;
  transition:background 160ms ease,border-color 160ms ease,color 160ms ease,transform 160ms ease,box-shadow 160ms ease;
}
.clan-main-menu .section-navigation > a::before { display:none; content:none; }
.clan-main-menu .section-navigation .menu-icon {
  display:block;
  position:relative;
  width:48px;
  height:48px;
  flex:none;
  object-fit:contain;
  filter:drop-shadow(0 3px 2px #000a);
  transform:perspective(260px) rotateY(-7deg);
  transform-origin:center bottom;
  transition:transform 210ms ease,filter 210ms ease;
}
.clan-main-menu .section-navigation .nav-full { display:block; }
.clan-main-menu .section-navigation .nav-short { display:none; }
.clan-main-menu .section-navigation .nav-full,
.clan-main-menu .section-navigation .nav-short { position:relative; max-width:100%; }
.clan-main-menu .section-navigation > a[data-page='sk6'] {
  isolation:isolate;
  border-color:#cba85c;
  background:radial-gradient(ellipse at 50% 24%,#63843f55,transparent 76%),linear-gradient(160deg,#284d3c,#142c26 62%,#1c3023);
  box-shadow:inset 0 0 0 2px #101f18,inset 0 3px 0 2px #bdd9971c,0 0 14px #55b98716,0 2px 3px #0007;
  color:#ffedb9;
}
.clan-main-menu .section-navigation > a[data-page='sk6']::before {
  display:block;
  position:absolute;
  z-index:-1;
  inset:4px;
  width:auto;
  height:auto;
  content:'';
  border:1px solid #d7b56526;
  border-radius:2px;
  pointer-events:none;
}
.clan-main-menu .section-navigation > a[data-page='sk6'] .menu-icon { width:53px; height:53px; margin-top:-2px; filter:drop-shadow(0 2px 3px #000a) drop-shadow(0 0 7px #4de7aa30); }
.menu-seasonal-copy { display:flex; position:relative; flex-direction:column; align-items:center; gap:3px; max-width:100%; }
.menu-seasonal-title { max-width:130px; font-size:12px; line-height:1.2; font-weight:700; }
.menu-seasonal-caption { color:#b8d5bb; font-size:9px; font-weight:450; line-height:1.3; }
.menu-seasonal-seal {
  position:absolute;
  top:6px;
  right:6px;
  display:grid;
  place-items:center;
  width:18px;
  height:21px;
  border:1px solid #efd48d;
  border-radius:3px 3px 7px 7px;
  background:linear-gradient(120deg,#efd281,#9c6a28 70%);
  box-shadow:inset 0 0 0 1px #60411b,0 2px 3px #0007;
  color:#2c2618;
  font:700 10px/1 var(--serif);
  text-shadow:0 1px #ffebb277;
}
.clan-main-menu > .menu-language {
  grid-area:language;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:7px;
  width:100%;
  min-width:0;
  margin:0;
  padding-left:12px;
  border-left:1px solid #caa26035;
}
.menu-language-heading { display:flex; align-items:center; gap:6px; color:#d8c298; font-size:11px; }
.menu-language-heading svg { width:15px; height:15px; color:#cfaa63; }
.clan-main-menu #language-select { width:100%; min-width:0; max-width:none; min-height:38px; padding:7px 19px 7px 8px; border:1px solid #ac844a; border-radius:4px; background:linear-gradient(180deg,#382d22,#201d1a); box-shadow:inset 0 1px 0 #f1d39520,0 2px 3px #0005; color:#f3dcae; font-size:12px; text-overflow:ellipsis; }
.clan-main-menu #language-select option { color:#f3dcae; background:#24211d; }
.clan-main-menu #language-select:hover { border-color:#efd092; }
.clan-main-menu #language-select:focus-visible { outline-color:#ffdfa0; outline-offset:3px; }
/* Moving language into the menu gives attack setups more room below. */
.site-shell > .profile-panel {
  grid-template-columns:minmax(195px,228px) 40px minmax(235px,1fr) auto;
  grid-template-areas:"account edit setup manage" "timers timers identity refresh";
}
.clan-main-menu .section-navigation > a[aria-current='page'],
.clan-main-menu .section-navigation > a[data-page='advanced'][aria-current='page'] {
  border:1px solid #d9b76e;
  border-radius:4px;
  background:linear-gradient(180deg,#426847,#234630 55%,#183322);
  color:#fff0c8;
  box-shadow:inset 0 0 0 2px #122a1d,inset 0 4px 0 2px #e5eec82a,0 0 15px #b8923e16,0 3px 3px #0007;
  font-weight:650;
}
.clan-main-menu .section-navigation > a[aria-current='page'] .menu-icon { color:#ffe1a0; }
.clan-main-menu .section-navigation > a[data-page='sk6'][aria-current='page'] {
  border-color:#ffe49b;
  background:radial-gradient(ellipse at 50% 24%,#8fbe4966,transparent 76%),linear-gradient(160deg,#3e6c47,#1b4934 62%,#21412c);
  box-shadow:inset 0 0 0 2px #162d1d,inset 0 3px 0 2px #d9eead30,0 0 18px #6ce0a52e,0 3px 3px #0007;
}
.clan-main-menu .section-navigation > a[aria-current='page']::after {
  content:'';
  position:absolute;
  bottom:-4px;
  left:calc(50% - 3px);
  width:6px;
  height:6px;
  border:1px solid #fff0b9;
  background:#d5ac55;
  transform:rotate(45deg);
  box-shadow:0 1px 3px #0008;
}
.clan-main-menu .section-navigation > a:focus-visible { outline:2px solid #ffdfa0; outline-offset:3px; }
.clan-main-menu .section-navigation > a:focus-visible .menu-icon { transform:perspective(260px) rotateY(5deg) rotateZ(-4deg) translateY(-4px) scale(1.18); filter:drop-shadow(0 6px 3px #0009) brightness(1.08); }
@media(hover:hover) and (pointer:fine) {
  .clan-main-menu .brand:hover .clan-crest { transform:perspective(450px) rotateY(4deg) rotateX(-4deg) translateY(-3px) scale(1.07); filter:brightness(1.12); }
  .clan-main-menu .section-navigation > a:hover { transform:translateY(-2px); border-color:#d6b16a; color:#ffedc8; background:linear-gradient(180deg,#394834,#242c23); box-shadow:inset 0 1px 0 #e2ce9d24,0 4px 7px #0005; }
  .clan-main-menu .section-navigation > a[aria-current='page']:hover { background:linear-gradient(180deg,#50794e,#2b5236 55%,#1c3b28); }
  .clan-main-menu .section-navigation > a:hover .menu-icon { transform:perspective(260px) rotateY(5deg) rotateZ(-4deg) translateY(-4px) scale(1.18); filter:drop-shadow(0 6px 3px #0009) brightness(1.08); }
  .clan-main-menu .section-navigation > a[data-page='sk6']:hover { background:radial-gradient(ellipse at 50% 24%,#8fbe4966,transparent 76%),linear-gradient(160deg,#3e6c47,#1b4934 62%,#21412c); box-shadow:inset 0 0 0 2px #162d1d,0 0 18px #6ce0a52e,0 4px 7px #0005; }
}
@media(max-width:1150px) {
  .site-shell > .clan-main-menu { grid-template-columns:156px minmax(0,1fr) 118px; gap:10px; padding-inline:13px; }
  .clan-main-menu .brand { gap:9px; }
  .clan-main-menu .brand-name { font-size:27px; }
  .clan-main-menu .brand-subtitle { font-size:7px; max-width:80px; }
  .clan-crest { width:67px; height:67px; }
  .clan-crest-face { width:55px; height:55px; }
  .clan-crest-face img { width:57px; height:57px; }
  .clan-main-menu .section-navigation > a,.clan-main-menu .section-navigation > a[data-page='advanced'] { font-size:11px; padding-inline:5px; }
  .menu-seasonal-caption { display:none; }
  .clan-main-menu > .menu-language { padding-left:8px; }
}
@media(max-width:1000px) {
  .site-shell > .clan-main-menu { grid-template-columns:minmax(0,1fr) 160px; grid-template-areas:"brand language" "navigation navigation"; gap:15px; padding:13px 14px 15px; }
  .clan-main-menu .brand { justify-self:start; }
  .clan-main-menu .brand-copy { display:flex; align-items:center; gap:14px; }
  .clan-main-menu .brand-subtitle { max-width:140px; margin-top:0; font-size:8px; }
  .clan-main-menu > .section-navigation { grid-template-columns:1fr 1.15fr 1.4fr .9fr .9fr 1fr; gap:6px; }
  .clan-main-menu .section-navigation > a,.clan-main-menu .section-navigation > a[data-page='advanced'] { min-height:93px; font-size:11px; }
  .clan-main-menu > .menu-language { border-left:0; padding-left:0; }
  .site-shell > .profile-panel { grid-template-columns:minmax(180px,228px) 40px minmax(0,1fr); grid-template-areas:"account edit manage" "timers timers setup" "identity identity refresh"; }
}
@media(max-width:680px) {
  .site-shell > .clan-main-menu { grid-template-columns:minmax(0,1fr) 132px; gap:13px 10px; margin-top:12px; padding:12px 11px 14px; }
  .clan-main-menu .brand-copy { display:block; }
  .clan-main-menu .brand-name { font-size:26px; }
  .clan-main-menu .brand-subtitle { display:none; }
  .clan-crest { width:58px; height:58px; box-shadow:inset 0 0 0 2px #2c2019,inset 0 0 0 3px #f2cf855c,0 3px 0 #4d321c,0 5px 0 #171214,0 7px 9px #0009; }
  .clan-crest-face { width:48px; height:48px; }
  .clan-crest-face img { width:49px; height:49px; }
  .clan-main-menu > .section-navigation { grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
  .clan-main-menu .section-navigation > a,.clan-main-menu .section-navigation > a[data-page='advanced'] { min-height:83px; gap:3px; padding:7px 4px 8px; font-size:11px; }
  .clan-main-menu .section-navigation .menu-icon { width:41px; height:41px; }
  .clan-main-menu .section-navigation > a[data-page='sk6'] .menu-icon { width:46px; height:46px; }
  .menu-seasonal-title { font-size:11px; max-width:110px; }
  .menu-seasonal-seal { width:15px; height:18px; top:5px; right:4px; font-size:9px; }
  .clan-main-menu .section-navigation .nav-full { display:none; }
  .clan-main-menu .section-navigation .nav-short { display:block; }
  .clan-main-menu > .menu-language { gap:4px; align-self:center; }
  .menu-language-heading { font-size:10px; }
  .clan-main-menu #language-select { min-height:36px; font-size:11px; }
  .site-shell > .profile-panel { grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"account edit" "timers timers" "setup setup" "manage manage" "identity identity" "refresh refresh"; }
  .site-shell > .profile-panel > .profile-management { grid-area:manage; justify-self:end; }
}
@media(max-width:360px) {
  .site-shell > .clan-main-menu { grid-template-columns:minmax(0,1fr) 116px; gap:12px 6px; padding-inline:9px; }
  .clan-main-menu .brand { gap:6px; }
  .clan-main-menu .brand-name { font-size:23px; }
  .clan-crest { width:48px; height:48px; }
  .clan-crest-face { width:40px; height:40px; }
  .clan-crest-face img { width:41px; height:41px; }
  .clan-main-menu .section-navigation > a,.clan-main-menu .section-navigation > a[data-page='advanced'] { font-size:10px; }
  .menu-seasonal-title { font-size:10px; }
}
@media(prefers-reduced-motion:reduce) {
  .clan-crest,.clan-main-menu .section-navigation > a,.clan-main-menu .section-navigation .menu-icon { transition:none; }
  .clan-main-menu .brand:hover .clan-crest,.clan-main-menu .brand:focus-visible .clan-crest { transform:none; }
  .clan-main-menu .section-navigation > a:hover { transform:none; }
  .clan-main-menu .section-navigation > a:hover .menu-icon,.clan-main-menu .section-navigation > a:focus-visible .menu-icon { transform:none; }
}
