/* Main navigation only. Loaded after page styles; no Admin/canvas selectors. */
:root {
  --main-nav-height:64px; --main-nav-top:max(12px,env(safe-area-inset-top,0px)); --main-nav-gap:12px;
  --main-nav-space:calc(var(--main-nav-height) + var(--main-nav-top) + var(--main-nav-gap));
}
html:has([data-floating-navigation]) { scroll-padding-top:var(--main-nav-space); }
.main-navigation-space.is-floating {
  position:sticky; top:0; z-index:90; pointer-events:none;
  padding:var(--main-nav-top) max(clamp(10px,2vw,28px),env(safe-area-inset-right,0px)) var(--main-nav-gap) max(clamp(10px,2vw,28px),env(safe-area-inset-left,0px));
}
.is-floating .site-header.main-header {
  height:var(--main-nav-height); min-height:var(--main-nav-height); max-width:1600px; margin-inline:auto;
  pointer-events:auto; border:1px solid #8c795d55; border-radius:14px;
  background:#0e141af5; box-shadow:0 6px 24px #0005,inset 0 1px #e2cf9b08;
}
@supports(backdrop-filter:blur(10px)) {
  .is-floating .site-header.main-header { background:#0e141ae8; backdrop-filter:blur(10px); }
}
.site-header.main-header {
  height:64px; min-height:64px; padding:0 clamp(16px,3.5vw,56px);
  display:flex; flex-wrap:nowrap; gap:36px; align-items:center;
  background:#0e141a; border-bottom:1px solid #8c795d38; z-index:90;
}
.main-header .brand { flex-shrink:0; font-size:15px; gap:10px; }
.main-header .brand small { font-size:8px; letter-spacing:3.2px; margin-top:5px; }
.main-header .brand-crest { width:30px; height:38px; }
.site-header.main-header .main-nav { display:flex; flex:1; min-width:0; height:100%; gap:0; align-items:center; }
.main-header .main-nav-panel { display:flex; align-items:center; gap:6px; width:100%; height:100%; }
.main-header .main-nav-group { position:relative; min-width:0; }
.main-header .main-nav-trigger {
  display:flex; align-items:center; gap:9px; min-height:44px; padding:8px 13px;
  border:1px solid transparent; border-radius:4px; list-style:none; cursor:pointer;
  font-size:12px; color:#b4bab7; transition:color .16s,background .16s,border-color .16s;
}
.main-header .main-nav-trigger::-webkit-details-marker { display:none; }
.main-header .main-nav-trigger::marker { content:''; }
.main-header .main-nav-trigger>.icon { width:16px; height:16px; color:#a89a7d; }
.main-header .main-nav-trigger:hover,.main-header .main-nav-group[open]>.main-nav-trigger {
  color:#ede9df; background:#b9a4770c; border-color:#8c795d45;
}
.main-header .main-nav-group.is-current>.main-nav-trigger { color:#e4cf9f; border-bottom-color:#b6a079; }
.main-header .main-nav-trigger:focus-visible { outline:2px solid #ceba8f; outline-offset:2px; }
.main-header .main-nav-chevron { width:6px; height:6px; border-right:1px solid currentColor; border-bottom:1px solid currentColor; transform:rotate(45deg); margin:0 2px 4px 5px; flex-shrink:0; }
.main-header [open]>.main-nav-trigger .main-nav-chevron { transform:rotate(225deg); margin-top:5px; margin-bottom:0; }
.main-header .main-nav-dropdown {
  position:absolute; top:calc(100% + 8px); left:0; margin:0; padding:7px;
  list-style:none; width:286px; max-width:calc(100vw - 24px); max-height:min(70dvh,440px);
  overflow-y:auto; overscroll-behavior:contain; background:#141c22; border:1px solid #75684c80;
  border-radius:5px; box-shadow:0 12px 30px #0007;
  transform:translateX(var(--nav-shift,0px)); animation:main-nav-reveal .13s ease-out;
}
.site-header.main-header .main-nav .main-nav-link {
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:3px;
  width:100%; min-height:44px; padding:11px 12px; border:1px solid transparent; border-radius:3px;
  color:#d2d5cc; background:none; font:12px/1.4 var(--sans); text-align:left; overflow-wrap:anywhere;
}
.main-header .main-nav-link small { display:block; color:#9ca6a5; font-size:10px; line-height:1.5; }
.site-header.main-header .main-nav .main-nav-link:hover { color:#f0e5ca; background:#bdab7f0e; border-color:#8c795d30; }
.site-header.main-header .main-nav .main-nav-link[aria-current="page"] { color:#e6d09e; background:#b9a47712; border-left:2px solid #b6a079; }
.main-header .main-nav-profile { margin-left:auto; }
.main-header .main-nav-profile .main-nav-dropdown { left:auto; right:0; width:246px; }
.main-header .main-nav-identity { display:grid; min-width:0; gap:1px; }
.main-header .main-nav-identity>span { font-size:9px; letter-spacing:1.2px; color:#a89a7d; }
.main-header .main-nav-identity strong { display:block; max-width:168px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:500; }
.main-header .main-nav-avatar { width:32px; height:32px; border:1px solid #8c795d80; border-radius:50%; object-fit:cover; flex-shrink:0; }
.main-header .main-nav-logout { border-top:1px solid #8c795d35; margin-top:6px; padding-top:6px; }
.site-header.main-header .main-nav .main-nav-logout .main-nav-link { flex-direction:row; justify-content:flex-start; align-items:center; gap:10px; color:#cdb4ad; }
.main-header .main-nav-logout form { margin:0; }
.main-header .main-nav-toggle { display:none; }
.main-skip-link { position:fixed; top:8px; left:12px; transform:translateY(-160%); padding:10px 16px; background:#e4d1a9; color:#12191c; border-radius:3px; z-index:200; pointer-events:auto; }
.main-skip-link:focus { transform:none; }
#main-content-start { scroll-margin-top:var(--main-nav-space); }
.battle-page { --main-nav-height:44px; --main-nav-top:max(8px,env(safe-area-inset-top,0px)); --main-nav-gap:8px; }
@media(min-width:901px) { .battle-page .battle-shell { height:calc(100dvh - var(--main-nav-space)); } }
.battle-page .site-header.main-header { height:var(--main-nav-height); min-height:var(--main-nav-height); }
.battle-page .main-header .main-nav-trigger { min-height:36px; padding-top:3px; padding-bottom:3px; }
.battle-page .main-header .main-nav-avatar { width:28px; height:28px; }
.battle-page .main-header .brand { font-size:12px; }
.battle-page .main-header .brand-crest { width:26px; height:32px; }
@keyframes main-nav-reveal { from { opacity:0; } to { opacity:1; } }
@media(max-width:1050px) {
  .site-header.main-header { gap:20px; padding-left:20px; padding-right:20px; }
  .main-header .main-nav-trigger { padding-left:9px; padding-right:9px; gap:6px; }
  .main-header .main-nav-trigger>.icon { display:none; }
  .main-header .main-nav-identity strong { max-width:110px; }
}
@media(max-width:720px) {
  :root,.battle-page { --main-nav-height:60px; --main-nav-top:max(8px,env(safe-area-inset-top,0px)); --main-nav-gap:8px; }
  .site-header.main-header,.battle-page .site-header.main-header { height:60px; min-height:60px; padding:0 16px; gap:14px; }
  .main-header .brand,.battle-page .main-header .brand { font-size:13px; }
  .main-header .brand small { font-size:7px; }
  .site-header.main-header .main-nav { width:auto; justify-content:flex-end; order:initial; }
  .main-header .main-nav-toggle { display:flex; align-items:center; justify-content:center; gap:8px; min-height:42px; padding:8px 12px; border:1px solid #8c795d65; border-radius:4px; background:#b9a47708; color:#e0d4ba; font-size:12px; }
  .main-header .main-nav-toggle .icon { width:18px; }
  .main-header .main-nav-panel { position:absolute; top:calc(100% + 7px); left:0; right:0; width:auto; height:auto; padding:8px; display:flex; flex-direction:column; align-items:stretch; gap:2px; background:#10181f; border:1px solid #8c795d70; border-radius:10px; box-shadow:0 14px 28px #0008; max-height:calc(100dvh - var(--main-nav-space) - max(12px,env(safe-area-inset-bottom,0px))); overflow-y:auto; overscroll-behavior:contain; }
  .main-header[data-nav-enhanced] .main-nav-panel:not([data-open]) { display:none; }
  .main-header .main-nav-group { width:100%; }
  .main-header .main-nav-trigger,.battle-page .main-header .main-nav-trigger { min-height:48px; padding:9px 12px; }
  .main-header .main-nav-trigger>.icon { display:block; width:18px; height:18px; }
  .main-header .main-nav-chevron { margin-left:auto; }
  .main-header .main-nav-dropdown,.main-header .main-nav-profile .main-nav-dropdown { position:static; width:100%; max-width:100%; max-height:none; margin:3px 0 9px; padding:0 0 0 14px; border:0; border-radius:0; box-shadow:none; background:none; transform:none; }
  .main-header .main-nav-profile { margin-left:0; }
  .main-header .main-nav-identity strong { max-width:210px; }
  .main-header:not([data-nav-enhanced]),.is-floating .main-header:not([data-nav-enhanced]) { height:auto; flex-wrap:wrap; padding-top:12px; padding-bottom:12px; }
  .main-header:not([data-nav-enhanced]) .main-nav { width:100%; flex-basis:100%; }
  .main-header:not([data-nav-enhanced]) .main-nav-panel { position:static; width:100%; max-height:none; box-shadow:none; }
}
@media(max-height:600px) and (min-width:721px) {
  .main-header .main-nav-dropdown { max-height:calc(100dvh - var(--main-nav-space) - 12px); }
}
@media(prefers-reduced-motion:reduce) { .main-header * { animation:none; transition:none; } }