.shell:has(> .site-chrome) { overflow: clip; }
.site-chrome {
  --chrome-row: 68px;
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--paper-soft, #edeae6);
  isolation: isolate;
}
.site-chrome > .notice {
  height: 28px;
  min-height: 0;
  padding: 5px 26px;
  gap: 12px;
  font-size: 10px;
  line-height: 17px;
  overflow: hidden;
  white-space: nowrap;
  transition: height 180ms ease, padding 180ms ease, opacity 180ms ease;
}
.site-chrome > .notice > div:first-child { overflow: hidden; text-overflow: ellipsis; }
.site-chrome > .notice strong { font-size: 11px; }
.site-chrome > .notice .notice-meta { flex-wrap: nowrap; gap: 10px; font-size: 9px; }
.site-chrome > .site-header {
  position: relative;
  top: auto;
  z-index: 1;
  min-height: var(--chrome-row);
  height: var(--chrome-row);
  padding: 6px 26px;
  background: var(--paper-soft, #edeae6);
  transition: height 180ms ease, min-height 180ms ease;
}
.site-chrome .brand img { width: 56px; height: 56px; max-width: 56px; object-fit: contain; transition: width 180ms ease, height 180ms ease; }
.site-chrome .nav-link { padding: 10px 12px; font-size: 11px; }
.site-chrome.is-compact { --chrome-row: 60px; box-shadow: 0 4px 14px rgba(26,26,26,.08); }
.site-chrome.is-compact > .notice { height: 0; padding-top: 0; padding-bottom: 0; opacity: 0; border-bottom-width: 0; visibility: hidden; }
.site-chrome.is-compact .brand img { width: 44px; height: 44px; max-width: 44px; }
html { scroll-padding-top: 104px; }
@media (max-width: 1180px) and (min-width: 1041px) {
  .site-chrome .nav-link { padding: 10px 8px; font-size: 10px; }
}
@media (max-width: 1040px) {
  .site-chrome { --chrome-row: 56px; }
  .site-chrome > .notice { padding-left: 18px; padding-right: 18px; display: block; font-size: 10px; letter-spacing: .06em; }
  .site-chrome > .notice .notice-meta { display: none; }
  .site-chrome > .site-header { padding: 6px 18px; }
  .site-chrome .brand { width: 54px; height: 44px; }
  .site-chrome .brand img { width: 42px; height: 42px; max-width: 42px; }
  .site-chrome.is-compact { --chrome-row: 52px; }
  .site-chrome.is-compact .brand img { width: 38px; height: 38px; max-width: 38px; }
  .site-chrome > .mobile-menu { position: absolute; top: 100%; left: 0; right: 0; background: var(--paper-soft, #edeae6); overflow-y: auto; overscroll-behavior: contain; }
  .shell.nav-open .site-chrome > .mobile-menu { max-height: calc(100vh - var(--chrome-row) - 28px); max-height: calc(100dvh - var(--chrome-row) - 28px); box-shadow: 0 12px 18px rgba(26,26,26,.12); }
  html { scroll-padding-top: 90px; }
}
@media (prefers-reduced-motion: reduce) {
  .site-chrome > .notice, .site-chrome > .site-header, .site-chrome .brand img { transition: none; }
}