/* Complete shared navigation. Tokens and icons do not depend on homepage assets. */
body.meow-modern-chrome .header.site-header {
  --mn-bg:#0b1521f5; --mn-panel:#111e2d; --mn-soft:#192a3e; --mn-ink:#edf4fd;
  --mn-muted:#b2c2d5; --mn-line:#ffffff26; --mn-accent:#90d9f3; --mn-shadow:0 15px 45px #0005;
  --mn-height:82px;
  box-sizing:border-box; position:sticky!important; inset:0 0 auto!important;
  width:100%; height:var(--mn-height)!important; min-height:0; margin:0!important; padding:0!important;
  border:0!important; border-bottom:1px solid var(--mn-line)!important; border-radius:0!important;
  background:var(--mn-bg)!important; color:var(--mn-ink)!important; box-shadow:none!important;
  z-index:1000; font-family:var(--meow-font-ui,'Microsoft JhengHei',sans-serif)!important;
  line-height:1.45; text-align:left; letter-spacing:0; overflow:visible!important;
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
}
html[data-meow-theme="light"] body.meow-modern-chrome .header.site-header {
  --mn-bg:#f9fbfef5; --mn-panel:#fff; --mn-soft:#eaf2fa; --mn-ink:#263d55;
  --mn-muted:#536f8b; --mn-line:#31547d26; --mn-accent:#286bad; --mn-shadow:0 15px 45px #31547d20;
}
body.meow-modern-chrome .header.site-header::before,
body.meow-modern-chrome .header.site-header::after { content:none!important; display:none!important; }
body.meow-modern-chrome .site-header *,body.meow-modern-chrome .site-header *::before,body.meow-modern-chrome .site-header *::after { box-sizing:border-box; }
body.meow-modern-chrome .site-header .header-inner {
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  width:100%; height:100%; max-width:1520px; margin:0 auto; padding:0 32px;
}
body.meow-modern-chrome .site-header a { text-decoration:none; color:inherit; -webkit-tap-highlight-color:transparent; }
body.meow-modern-chrome .site-header :is(a,button,summary):focus-visible { outline:2px solid var(--mn-accent); outline-offset:4px; }
body.meow-modern-chrome .site-header .brand { display:flex; flex:none; align-items:center; margin:0; padding:0; line-height:0; }
body.meow-modern-chrome .site-header .brand img { display:block; width:140px; height:59px; max-width:none; object-fit:contain; }
body.meow-modern-chrome .site-header .desktop-nav { display:flex; align-items:center; gap:7px; margin:0; padding:0; min-width:0; }
body.meow-modern-chrome .site-header .desktop-nav>a {
  display:flex; align-items:center; position:relative; padding:12px 8px; min-height:44px;
  font-size:17px; font-weight:700; color:var(--mn-muted); white-space:nowrap; line-height:1.45;
}
body.meow-modern-chrome .site-header .desktop-nav>a::after { content:none; }
body.meow-modern-chrome .site-header .desktop-nav>a:is(:hover,[aria-current="page"]) { color:var(--mn-accent); }
body.meow-modern-chrome .site-header .desktop-nav>a[aria-current="page"]::after {
  content:''; display:block; position:absolute; left:8px; right:8px; bottom:3px; height:2px; background:var(--mn-accent); border-radius:2px;
}
body.meow-modern-chrome .site-header .header-actions,
body.meow-modern-chrome .site-header .nav-auth-actions { display:flex; align-items:center; flex:none; gap:10px; width:auto; margin:0; padding:0; }
body.meow-modern-chrome .site-header :is(button,summary) { font:inherit; cursor:pointer; }
body.meow-modern-chrome .site-header .icon-button,
body.meow-modern-chrome .site-header .meow-theme-toggle {
  display:inline-flex; align-items:center; justify-content:center; position:static!important; inset:auto!important;
  width:38px; height:38px; min-height:0; margin:0; padding:0; flex:none; border-radius:50%;
  border:1px solid var(--mn-line); color:var(--mn-muted); background:transparent; box-shadow:none; z-index:auto;
}
body.meow-modern-chrome .site-header .icon-button:hover { background:var(--mn-soft); color:var(--mn-ink); }
body.meow-modern-chrome .site-header .icon-button svg { display:block; width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; }
body.meow-modern-chrome .site-header .meow-theme-icon { font-size:20px; line-height:1; }
body.meow-modern-chrome .site-header :is(.login-button,.home-register-button) {
  display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:38px; padding:8px 11px;
  border:1px solid var(--mn-line); border-radius:8px; background:transparent; color:var(--mn-ink);
  font:inherit; font-size:14px; font-weight:700; white-space:nowrap;
}
body.meow-modern-chrome .site-header .home-register-button { background:var(--mn-soft); }
body.meow-modern-chrome .site-header :is(.login-button,.home-register-button):hover { border-color:var(--mn-accent); color:var(--mn-accent); }
body.meow-modern-chrome .site-header .home-username { display:block; max-width:95px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
body.meow-modern-chrome .site-header :is(.nav-more,.home-account) { position:relative; margin:0; padding:0; }
body.meow-modern-chrome .site-header summary { list-style:none; user-select:none; }
body.meow-modern-chrome .site-header summary::-webkit-details-marker { display:none; }
body.meow-modern-chrome .site-header .nav-more>summary { display:flex; align-items:center; gap:6px; min-height:44px; padding:8px 4px; color:var(--mn-muted); font-size:16px; font-weight:700; }
body.meow-modern-chrome .site-header .nav-more[open]>summary { color:var(--mn-accent); }
body.meow-modern-chrome .site-header :is(.home-explore-menu,.home-account-menu) {
  display:block; position:absolute; top:calc(100% + 6px); right:0; left:auto; bottom:auto;
  width:250px; height:auto; max-height:calc(100dvh - 110px); overflow:auto; overscroll-behavior:contain;
  margin:0; padding:8px; border:1px solid var(--mn-line); border-radius:12px;
  background:var(--mn-panel)!important; color:var(--mn-ink)!important; box-shadow:var(--mn-shadow); z-index:4;
}
body.meow-modern-chrome .site-header :is(.home-explore-menu,.home-account-menu)::before {
  content:''; position:absolute; top:-9px; left:0; right:0; height:9px;
}
body.meow-modern-chrome .site-header :is(.home-explore-menu,.home-account-menu) a,
body.meow-modern-chrome .site-header .home-guide-categories>summary {
  display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:43px;
  margin:0; padding:10px 12px; border:0; border-radius:7px; color:var(--mn-ink); background:transparent;
  font:inherit; font-size:16px; font-weight:700; line-height:1.5; white-space:normal; overflow-wrap:anywhere;
}
body.meow-modern-chrome .site-header :is(.home-explore-menu,.home-account-menu) a:hover,
body.meow-modern-chrome .site-header .home-guide-categories>summary:hover { background:var(--mn-soft); color:var(--mn-accent); }
body.meow-modern-chrome .site-header .home-guide-categories>div { margin:0 0 4px 10px; padding-left:7px; border-left:1px solid var(--mn-line); }
body.meow-modern-chrome .site-header .home-guide-categories[open]>summary { color:var(--mn-accent); }
body.meow-modern-chrome .site-header .home-menu-label { display:block; padding:10px 12px 3px; font-size:12px; color:var(--mn-muted); }
body.meow-modern-chrome .site-header .home-menu-divider { display:block; height:1px; margin:6px; background:var(--mn-line); }
body.meow-modern-chrome .site-header details:not([open])>div,
body.meow-modern-chrome .site-header [hidden] { display:none!important; }
body.meow-modern-chrome .site-header .mobile-menu-button,
body.meow-modern-chrome .site-header .mobile-nav { display:none!important; }
body.meow-modern-chrome .meow-nav-skip {
  position:fixed; top:-80px; left:16px; z-index:5100; border-radius:6px; padding:10px 16px;
  background:#fff; color:#263d55; font-size:16px;
}
body.meow-modern-chrome .meow-nav-skip:focus { top:10px; }
body.meow-modern-chrome:not(.page-salon) > .main-content { margin-top:0!important; }
/* The salon's existing reveal control and inert/transform lifecycle stay in charge. */
body.meow-modern-chrome.page-salon > .header.site-header { position:fixed!important; inset:0 0 auto!important; z-index:5000!important; }
/* XenForo embeds its header outside the content wrapper and expects a fixed bar. */
body.meow-modern-chrome.meow-bbs-chrome .header.site-header { position:fixed!important; z-index:1000!important; }
html body.meow-modern-chrome.meow-bbs-chrome .p-body { margin-top:82px!important; }
body.meow-modern-chrome.meow-bbs-chrome:has(.p-staffBar) .header.site-header { top:28px!important; }
html body.meow-modern-chrome.meow-bbs-chrome:has(.p-staffBar) .p-body { margin-top:110px!important; }
@media(min-width:1181px) and (max-width:1350px) {
  body.meow-modern-chrome .site-header .header-inner { gap:12px; padding-inline:22px; }
  body.meow-modern-chrome .site-header .desktop-nav { gap:2px; }
  body.meow-modern-chrome .site-header .desktop-nav>a { padding-inline:6px; font-size:16px; }
  body.meow-modern-chrome .site-header .home-register-button { display:none; }
}
@media(max-width:1180px) {
  html.meow-mobile-nav-open,html.meow-mobile-nav-open body.meow-modern-chrome { overflow:hidden; }
  body.meow-modern-chrome .header.site-header { background:var(--mn-panel)!important; backdrop-filter:none; -webkit-backdrop-filter:none; }
  body.meow-modern-chrome .site-header .desktop-nav { display:none!important; }
  body.meow-modern-chrome .site-header .nav-more { display:none!important; }
  body.meow-modern-chrome .site-header .mobile-menu-button { display:inline-flex!important; }
  body.meow-modern-chrome .site-header :is(.icon-button,.meow-theme-toggle) { width:44px; height:44px; }
  body.meow-modern-chrome .site-header .login-button { min-height:44px; }
  body.meow-modern-chrome .site-header .header-inner { gap:12px; padding-inline:24px; }
  body.meow-modern-chrome .site-header .home-register-button {
    display:inline-flex; min-height:44px; background:#70c5ff; color:#102136;
    border-color:#70c5ff; box-shadow:0 3px 12px #55b5f526;
  }
  html[data-meow-theme="light"] body.meow-modern-chrome .site-header .home-register-button {
    background:#2474b5; border-color:#2474b5; color:#fff;
  }
  body.meow-modern-chrome .site-header .mobile-nav:not([hidden]) {
    display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px;
    position:absolute; top:100%; left:0; right:0; width:100%; height:auto;
    max-height:calc(100vh - var(--mn-height)); max-height:calc(100dvh - var(--mn-height)); overflow:auto; overscroll-behavior:contain;
    margin:0; padding:18px 24px calc(18px + env(safe-area-inset-bottom,0px)); border:0; border-bottom:1px solid var(--mn-line);
    background:var(--mn-panel); color:var(--mn-ink); box-shadow:var(--mn-shadow);
  }
  body.meow-modern-chrome .site-header .mobile-nav>:is(a,button) {
    display:flex; align-items:center; min-height:46px; margin:0; padding:10px 14px; border:1px solid var(--mn-line);
    border-radius:8px; background:var(--mn-soft); color:var(--mn-ink); font:inherit; font-size:16px; font-weight:700; line-height:1.45; text-align:left;
  }
  body.meow-modern-chrome .site-header .mobile-nav>:is(a,button):is(:hover,[aria-current="page"]) { border-color:var(--mn-accent); color:var(--mn-accent); }
  body.meow-modern-chrome .site-header .mobile-nav-heading { grid-column:1/-1; margin:12px 0 2px; color:var(--mn-muted); font-size:13px; font-weight:700; line-height:1.6; }
  body.meow-modern-chrome .site-header .mobile-nav-heading:first-child { margin-top:0; }
  body.meow-modern-chrome .site-header .mobile-nav-hint { grid-column:1/-1; margin:6px 0 2px; color:var(--mn-muted); font-size:13px; line-height:1.7; }
}
@media(max-width:600px) {
  body.meow-modern-chrome .header.site-header { --mn-height:68px; }
  body.meow-modern-chrome .site-header .header-inner { padding-inline:14px; gap:9px; }
  body.meow-modern-chrome .site-header .brand img { width:116px; height:49px; }
  body.meow-modern-chrome .site-header .header-actions,body.meow-modern-chrome .site-header .nav-auth-actions { gap:7px; }
  body.meow-modern-chrome .site-header .icon-button,body.meow-modern-chrome .site-header .meow-theme-toggle { width:44px; height:44px; }
  body.meow-modern-chrome .site-header .nav-more>summary { font-size:15px; gap:3px; }
  body.meow-modern-chrome .site-header .login-button { font-size:14px; padding:7px 8px; min-height:44px; }
  body.meow-modern-chrome .site-header .home-username { max-width:50px; }
  body.meow-modern-chrome .site-header :is(.home-explore-menu,.home-account-menu) { width:min(270px,calc(100vw - 28px)); max-height:calc(100dvh - 92px); }
  body.meow-modern-chrome .site-header .home-explore-menu { right:-82px; }
  body.meow-modern-chrome .site-header .mobile-nav:not([hidden]) { padding:14px 14px calc(20px + env(safe-area-inset-bottom,0px)); }
  html body.meow-modern-chrome.meow-bbs-chrome .p-body { margin-top:68px!important; }
  html body.meow-modern-chrome.meow-bbs-chrome:has(.p-staffBar) .p-body { margin-top:96px!important; }
}
@media(max-width:390px) {
  body.meow-modern-chrome .site-header .header-inner { padding-inline:10px; gap:5px; }
  body.meow-modern-chrome .site-header .brand img { width:99px; height:44px; }
  body.meow-modern-chrome .site-header .header-actions { gap:5px; }
  body.meow-modern-chrome .site-header .nav-auth-actions>.login-button { font-size:14px; padding-inline:6px; }
  body.meow-modern-chrome .site-header .home-username { max-width:40px; }
}
@media(prefers-reduced-motion:reduce) {
  body.meow-modern-chrome .site-header,body.meow-modern-chrome .site-header * { scroll-behavior:auto!important; animation:none!important; transition:none!important; }
}
@media(max-width:360px) {
  body.meow-modern-chrome .site-header .brand img { width:88px; }
  body.meow-modern-chrome .site-header .home-username { max-width:28px; }
}
@media(max-width:600px) {
  /* 手機訪客可直接看見註冊，登入與註冊各有獨立的完整按鈕。 */
  /* 註冊視窗位於主要內容內，開啟時需連同父層一起高於固定頁首。 */
  body.meow-modern-chrome > .main-content:has(> #register-modal[style*="display: flex"]) { z-index:10001!important; }
  body.meow-modern-chrome .header.site-header:has(.home-register-button) { --mn-height:120px; }
  body.meow-modern-chrome .site-header:has(.home-register-button) .header-inner {
    display:grid; grid-template-columns:minmax(0,1fr) 44px 44px;
    grid-template-rows:minmax(0,1fr) 44px; gap:8px; padding:8px 14px;
  }
  body.meow-modern-chrome .site-header:has(.home-register-button) .brand { grid-column:1; grid-row:1; }
  body.meow-modern-chrome .site-header:has(.home-register-button) .brand img { width:116px; height:49px; }
  body.meow-modern-chrome .site-header:has(.home-register-button) .header-actions { display:contents; }
  body.meow-modern-chrome .site-header:has(.home-register-button) .meow-theme-toggle { grid-column:2; grid-row:1; }
  body.meow-modern-chrome .site-header:has(.home-register-button) .mobile-menu-button { grid-column:3; grid-row:1; }
  body.meow-modern-chrome .site-header:has(.home-register-button) .nav-auth-actions {
    display:grid; grid-column:1/-1; grid-row:2; grid-template-columns:1fr 1.35fr; gap:8px; width:100%; min-width:0;
  }
  body.meow-modern-chrome .site-header:has(.home-register-button) .nav-auth-actions>:is(.login-button,.home-register-button) {
    width:100%; min-width:0; min-height:44px; padding:8px 12px; font-size:16px;
  }
  html body.meow-modern-chrome.meow-bbs-chrome:has(.home-register-button) .p-body { margin-top:120px!important; }
  html body.meow-modern-chrome.meow-bbs-chrome:has(.p-staffBar):has(.home-register-button) .p-body { margin-top:148px!important; }
  /* Keep XenForo's native account/message/notification nodes and handlers.
     On phones their existing mount becomes a toolbar above the open menu. */
  body.meow-modern-chrome.meow-bbs-chrome.meow-xf-account-mounted .site-header .nav-auth-actions--xf {
    display:none!important;
  }
  body.meow-modern-chrome.meow-bbs-chrome.meow-xf-account-mounted .site-header:has(#mobile-nav:not([hidden])) .nav-auth-actions--xf {
    display:flex!important; position:absolute; top:calc(var(--mn-height) + 14px); right:14px;
    left:auto; width:auto; max-width:calc(100vw - 28px); min-height:44px; margin:0; z-index:6;
  }
  body.meow-modern-chrome.meow-bbs-chrome.meow-xf-account-mounted .site-header .mobile-nav:not([hidden]) {
    padding-top:72px;
  }
  body.meow-modern-chrome.meow-bbs-chrome:has(.p-staffBar) .site-header .mobile-nav:not([hidden]) { max-height:calc(100dvh - var(--mn-height) - 28px); }
}
