#site-settings{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto;flex-shrink:0}
.discord-connection{margin:0 0 24px}.discord-connection p{margin-bottom:12px}.discord-connection .discord-button{background:#5865f2;color:white}.discord-connection .discord-button:hover{background:#4752c4}html.theme-light .discord-connection .discord-button{color:white}
#site-settings select,#site-settings button{font:600 .78rem/1.2 var(--sans,Arial,sans-serif);color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:9px 11px;cursor:pointer}
#site-settings select{min-width:96px}
#site-settings button{min-width:126px;text-align:center}
#site-settings select:hover,#site-settings button:hover{border-color:var(--accent);color:var(--accent)}
#site-settings select:focus-visible,#site-settings button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
html.theme-light{--bg:#eef2e9;--surface:#ffffff;--text:#172218;--muted:#536255;--accent:#466b2a;--border:#c3d0bf}
html.theme-light body{background:var(--bg);color:var(--text)}
html.theme-light .header{background:#f8faf5;border-bottom-color:var(--border)}
html.theme-light nav a,html.theme-light .nav-group summary{color:#344335}
html.theme-light .hero-shade{background:linear-gradient(90deg,rgba(238,242,233,.94) 0%,rgba(238,242,233,.7) 48%,rgba(238,242,233,.18) 100%),linear-gradient(0deg,#eef2e9 0%,transparent 40%)}
html.theme-light .hero-description{color:#344335}
html.theme-light .tools-dropdown{background:#fff;border-color:var(--border);box-shadow:0 15px 35px #32412b26}
html.theme-light .tools-dropdown a:hover,html.theme-light .tools-dropdown a[aria-current=page]{background:#e4eddc;color:#315321}
html.theme-light .button.primary{color:#fff;background:#466b2a}
html.theme-light .button.primary:hover{background:#36551f}
html.theme-light .subtle-button,html.theme-light .account-page button:not(.primary){color:#243223;background:#fff;border-color:#aebda8}
html.theme-light input,html.theme-light select,html.theme-light textarea,html.theme-light .account-page .guild-panel input,html.theme-light .account-page .guild-panel select,html.theme-light .account-page textarea{color:var(--text);background:#fff;border-color:#b8c6b3}
html.theme-light .account-status{background:#e4efdf;color:#254124;border-color:#a8bf9b}
html.theme-light .account-status.error{background:#fbe9e3;color:#743b2c;border-color:#d59a86}
html.theme-light .guild-panel,html.theme-light .profile-summary,html.theme-light .saved-build-card,html.theme-light .tools-hub-card{background:var(--surface);border-color:var(--border)}
html.theme-light footer{background:#e1e9dc;color:#344335}
.profile-loadout,.talent-panel{margin-top:26px;padding-top:24px;border-top:1px solid var(--border)}
.profile-loadout h3,.talent-panel h3{margin:18px 0 10px;font-size:1.35rem}
.loadout-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
.loadout-heading h3{margin:0}
.small-tag{display:inline-flex;align-items:center;min-height:26px;padding:4px 9px;border:1px solid var(--border);border-radius:999px;color:var(--accent);font-size:.72rem;font-weight:700;letter-spacing:.06em;white-space:nowrap}
.build-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px;margin:18px 0 24px}
.build-slots label,.rune-slots label,.talent-row{display:flex;flex-direction:column;gap:6px;min-width:0;color:var(--muted);font-size:.86rem}
.build-slots select,.rune-slots select,.talent-row input{width:100%;min-width:0}
.rune-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px;margin:14px 0 18px}
.talent-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;margin:16px 0 22px}
.talent-row{display:grid;grid-template-columns:minmax(0,1fr) 70px;align-items:center;gap:12px;padding:9px 10px;border:1px solid var(--border);border-radius:5px;background:color-mix(in srgb,var(--surface) 88%,var(--bg))}
.talent-row span{color:var(--text);line-height:1.3}
.talent-row input{padding:8px;text-align:center}
.build-pieces{margin-top:14px}
@media(max-width:900px){#site-settings{margin-left:0}.header{gap:12px}#site-settings button{min-width:0;padding-inline:9px}.build-slots,.rune-slots,.talent-grid{grid-template-columns:1fr}}
@media(max-width:520px){#site-settings select{min-width:82px;padding-inline:7px}#site-settings button{font-size:.72rem}.loadout-heading{align-items:flex-start;flex-direction:column;gap:8px}}

/* Shared masthead: compact brand, centered navigation, unified controls. */
.header {
  --header-bg:#111e1a;
  --header-rail:#1b2b24;
  --header-line:#33463a;
  --header-hover:#2a3e31;
  position:relative;
  z-index:40;
  display:grid;
  grid-template-columns:minmax(150px,1fr) auto minmax(150px,1fr);
  align-items:center;
  gap:24px;
  height:auto;
  min-height:88px;
  padding:16px max(24px,calc((100% - 1480px)/2));
  background:var(--header-bg);
  border-bottom:1px solid var(--header-line);
  box-shadow:0 6px 22px #07100c12;
}
.header .brand {font-size:30px;letter-spacing:2px;font-weight:400;width:max-content;max-width:100%;color:var(--text)}
.header .brand span {font-size:10px;letter-spacing:1.6px;line-height:1.4;margin-top:6px;color:var(--muted)}
.header .header-link,.header .menu-button {display:none}
.header #navigation,.header #navigation.open {
  display:flex;position:static;inset:auto;align-items:center;gap:4px;
  padding:5px;border:1px solid var(--header-line);border-radius:16px;
  background:var(--header-rail);font-size:14px;max-height:none;overflow:visible;
}
.header .nav-group {padding:0;border:0;position:relative;grid-column:auto}
.header #navigation>a,.header .nav-group>summary {
  display:flex;align-items:center;justify-content:center;gap:10px;
  width:auto;min-height:42px;padding:10px 16px;border:0;border-radius:11px;
  color:var(--muted);font:500 .875rem/1.5 var(--sans);white-space:nowrap;
  transition:background .18s,color .18s;
}
.header #navigation>a:hover,.header .nav-group>summary:hover,.header .nav-group[open]>summary {
  background:var(--header-hover);color:var(--text);
}
.header #navigation>a[aria-current=page],.header .nav-group.current>summary {
  background:var(--accent);color:var(--bg);font-weight:700;
}
.header .nav-group>summary>span {
  display:block;width:7px;height:7px;margin:0 1px 3px 3px;
  font-size:0;line-height:0;color:inherit;
  border:solid currentColor;border-width:0 1.5px 1.5px 0;
  transform:rotate(45deg);transition:transform .18s;
}
.header .nav-group[open]>summary>span {transform:translateY(3px) rotate(225deg)}
.header .tools-dropdown {
  position:absolute;top:calc(100% + 14px);left:0;min-width:228px;
  padding:8px;margin:0;background:var(--header-bg);
  border:1px solid var(--header-line);border-radius:16px;
  box-shadow:0 20px 44px #0005;
}
.header .nav-group:not([open])>.tools-dropdown {display:none}
.header .tools-dropdown a {
  display:block;padding:11px 14px;min-height:44px;border-radius:9px;
  font-size:.875rem;line-height:1.6;color:var(--muted);
}
.header .tools-dropdown a:hover,.header .tools-dropdown a[aria-current=page] {background:var(--header-hover);color:var(--text)}
.header .tools-dropdown a[aria-current=page] {font-weight:700;color:var(--accent)}
.header #site-settings {
  justify-self:end;display:flex;align-items:center;gap:4px;margin:0;
  padding:4px;border:1px solid var(--header-line);border-radius:14px;background:var(--header-rail);
}
.header #site-settings select,.header #site-settings button {
  margin:0;min-height:42px;border:0;border-radius:9px;background:transparent;
  color:var(--text);font:500 .875rem/1.4 var(--sans);
}
.header #site-settings select {min-width:100px;width:auto;padding:9px 10px;cursor:pointer}
.header #site-settings select option {color:var(--text);background:var(--header-bg)}
.header #site-settings button {display:grid;place-items:center;min-width:42px;width:42px;padding:10px;cursor:pointer}
.header #site-settings button svg {width:20px;height:20px}
.header #site-theme[data-theme=dark] .theme-moon,.header #site-theme[data-theme=light] .theme-sun {display:none}
.header #site-settings select:hover,.header #site-settings button:hover {background:var(--header-hover);color:var(--text)}
.header a:focus-visible,.header summary:focus-visible,.header button:focus-visible,.header select:focus-visible {outline:2px solid var(--accent);outline-offset:3px}
.skip:focus {z-index:50}
html.theme-light .header {--header-bg:#f8faf5;--header-rail:#ecf0e6;--header-line:#d3ddce;--header-hover:#dfe8d7;background:var(--header-bg)}
html.theme-light .header #navigation>a[aria-current=page],html.theme-light .header .nav-group.current>summary {color:#fff}
html.theme-light .header .tools-dropdown {background:var(--header-bg);box-shadow:0 20px 44px #27392120}
@media(max-width:1050px) {
  .header {grid-template-columns:minmax(0,1fr) auto auto;gap:12px;padding:14px 24px;min-height:80px}
  .header .brand {grid-column:1;grid-row:1}
  .header #site-settings {grid-column:2;grid-row:1}
  .header .menu-button {
    grid-column:3;grid-row:1;display:flex;align-items:center;justify-content:center;gap:10px;
    min-height:50px;padding:10px 14px;border:1px solid var(--header-line);border-radius:14px;
    background:var(--header-rail);color:var(--text);font-size:14px;cursor:pointer;
  }
  .header .menu-button[aria-expanded=true] {border-color:var(--accent);color:var(--accent)}
  .header #navigation {display:none}
  .header #navigation.open {
    display:flex;flex-direction:column;align-items:stretch;
    position:absolute;top:calc(100% + 8px);left:16px;right:16px;
    padding:10px;gap:4px;background:var(--header-bg);
    max-height:calc(100dvh - 110px);overflow-y:auto;box-shadow:0 18px 44px #0005;
  }
  .header #navigation>a,.header .nav-group>summary {justify-content:space-between;min-height:46px;width:100%}
  .header .tools-dropdown {
    position:static;min-width:0;margin:6px 0 10px 12px;padding:4px 4px 4px 10px;
    border:0;border-left:1px solid var(--header-line);border-radius:0;background:transparent;box-shadow:none;
  }
  html.theme-light .header .tools-dropdown {background:transparent;box-shadow:none}
}
@media(max-width:540px) {
  .header {padding:12px;gap:8px;min-height:74px}
  .header .brand {font-size:22px;letter-spacing:1px}
  .header .brand span {display:none}
  .header .menu-button {min-width:42px;min-height:48px;padding:10px;font-size:0;gap:0}
  .header .menu-button span {font-size:20px;line-height:1}
  .header #site-settings {padding:2px;gap:0;border-radius:12px}
  .header #site-settings select {min-width:90px;width:90px;padding:8px 4px;font-size:14px}
  .header #site-settings button {min-width:38px;width:38px;padding:8px}
}

/* Shared emblem and wordmark, sized independently of page imagery. */
.header .brand,footer .brand {display:flex;align-items:center;gap:12px;flex-shrink:0}
.header .brand .brand-emblem,footer .brand .brand-emblem {display:block;flex:0 0 48px;width:48px;height:48px;object-fit:contain}
.header .brand .brand-copy,footer .brand .brand-copy {min-width:0;white-space:nowrap}
@media(max-width:540px) {
 .header .brand {gap:8px}
 .header .brand .brand-emblem {flex-basis:38px;width:38px;height:38px}
}
@media(max-width:420px) {
 .header .brand .brand-copy {display:none}
 .header .brand .brand-emblem {flex-basis:44px;width:44px;height:44px}
}