/* Approved shared header/footer v1.4. Scoped adapter; TOP wireframe.css stays byte-identical. */
.hf-component {
  --accent:#FFD400; --ink:#111111; --muted:#62625E; --line:#E2E2DC;
  --paper:#fff; --canvas:#F3F3F1; --dark:#171717; --gutter:16px; --focus:#175FCA;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP","Yu Gothic",Meiryo,sans-serif;
  font-size:14px; line-height:1.6; color:var(--ink);
}
:where(.hf-component) button {font:inherit; color:inherit; cursor:pointer}
.hf-component button,.hf-component nav a {min-height:44px}
.hf-component :focus-visible {outline:3px solid var(--focus); outline-offset:3px}
.hf-site-footer :focus-visible {outline-color:#fff}
.hf-common-container {width:min(1200px,calc(100% - var(--gutter)*2)); margin-inline:auto}
.hf-site-header {background:var(--paper); border-bottom:2px solid var(--accent)}
.hf-header-inner {min-height:62px; display:flex; align-items:center; justify-content:space-between; gap:24px}
.hf-header-brand {display:flex; align-items:center; min-height:44px; flex:none}
.hf-logo-window {display:block; width:154px; aspect-ratio:1710/400}
.hf-logo-window svg {display:block; width:100%; height:100%; overflow:hidden}
.hf-quick-nav {display:none; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:0 20px}
.hf-quick-nav a {display:flex; align-items:center; padding-block:8px; font-size:12px; font-weight:700; white-space:nowrap}
.hf-quick-nav a[aria-current="page"] {box-shadow:inset 0 -3px var(--accent)}
.hf-quick-nav a:hover {color:#595018}
.hf-menu-toggle {min-width:92px; display:flex; align-items:center; justify-content:center; gap:8px; padding:8px 12px; border:1px solid #D6B500; border-radius:6px; background:var(--accent); font-size:12px; font-weight:700}
.hf-menu-glyph {font-size:18px; line-height:1}
.hf-site-menu {width:min(520px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:24px 16px 16px; margin:auto; border:1px solid #B8B8B1; border-radius:8px; background:var(--paper); color:var(--ink); overflow:auto}
.hf-site-menu::backdrop {background:rgb(17 17 17 / .40)}
html[data-menu-open="1"] {overflow:hidden}
.hf-menu-heading {display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:20px}
.hf-menu-heading h2 {margin:0; font-size:18px}
.hf-menu-close {padding:8px 12px; min-width:88px; border:1px solid #B8B8B1; border-radius:6px; background:var(--paper); font-size:14px}
.hf-menu-close span:not(.ledger-badge) {font-size:18px; margin-left:6px}
.hf-drawer-nav {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px}
.hf-drawer-nav a {display:flex; align-items:center; padding:10px 8px; min-height:64px; border:1px solid var(--line); border-radius:4px; overflow-wrap:anywhere; font-size:13px; font-weight:600; line-height:1.5}
.hf-drawer-nav a[aria-current="page"] {background:#FFF9D9; box-shadow:inset 3px 0 var(--accent)}
.hf-drawer-nav a:hover {background:var(--canvas)}
.hf-site-footer {background:var(--dark); color:#fff}
.hf-footer-inner {padding-block:8px; display:grid; grid-template-columns:100px minmax(0,1fr); gap:0 8px; align-items:center}
.hf-footer-brand {display:flex; justify-content:center; align-items:center; padding:0; min-height:44px; width:100px; background:transparent}
.hf-footer-brand .hf-logo-window {width:100px}
.hf-policy-nav {display:flex; align-items:center; justify-content:flex-end; flex-direction:row; flex-wrap:wrap; gap:0 8px; min-width:0}
.hf-policy-nav a {display:flex; align-items:center; font-size:11px; font-weight:400; line-height:1.4; padding-block:8px; white-space:nowrap; color:#A6A6A6}
.hf-policy-nav a:hover {text-decoration:underline; text-underline-offset:4px}
.hf-copyright {grid-column:1/-1; font-size:10px; line-height:1.2; color:#A6A6A6}
/* ID annotations only use absolute positioning; they do not participate in layout. */
.hf-component[data-ledger-id],.hf-component [data-ledger-id] {position:relative}
.hf-component .ledger-badge {position:absolute; z-index:2; top:0; left:0; display:block; max-width:none; white-space:nowrap; padding:0 3px; border:1px solid #929BB7; border-radius:2px; background:#F0F3FF; color:#182B57; font:8px/10px Consolas,monospace; pointer-events:none; opacity:0}
.id-mode .hf-component .ledger-badge {opacity:1}
.hf-site-header > .ledger-badge,.hf-site-footer > .ledger-badge {left:2px}
.hf-header-brand > .ledger-badge,.hf-footer-brand > .ledger-badge {top:auto; bottom:-8px}
.hf-site-footer .ledger-badge {font:8px/8px Consolas,monospace}
.hf-footer-brand > .ledger-badge {left:0; bottom:1px}
.hf-footer-brand .hf-logo-window > .ledger-badge {top:-10px; left:40px}
.hf-logo-window > .ledger-badge {top:-9px}
.hf-header-brand .hf-logo-window > .ledger-badge {left:70px}
.hf-quick-nav > .ledger-badge,.hf-policy-nav > .ledger-badge,.hf-drawer-nav > .ledger-badge {top:-12px}
.hf-drawer-nav > .ledger-badge {top:-20px}
.hf-quick-nav a > .ledger-badge {top:auto; bottom:0}
.hf-quick-nav a:nth-child(5) > .ledger-badge {left:-2px}
.hf-menu-toggle > .ledger-badge {top:-10px}
.hf-policy-nav a > .ledger-badge {top:auto; bottom:1px}
.hf-copyright > .ledger-badge {top:-10px}
.hf-policy-nav > .ledger-badge {top:0}
.hf-copyright > .ledger-badge {top:0; left:170px}
.hf-drawer-nav a > .ledger-badge {top:-5px}
.hf-menu-close > .ledger-badge {top:-10px}
.hf-site-menu > .ledger-badge {top:2px}
/* Keep the brand and all three policy links in one row at narrow mobile widths. */
@media(max-width:389px) {
  .hf-policy-nav {display:flex; flex-wrap:nowrap; justify-content:space-between; gap:0 4px}
  .hf-policy-nav a {min-width:44px; flex:none; padding-block:6px; font-size:10px; white-space:nowrap; justify-content:center; text-align:center}
  .hf-policy-nav a wbr {display:none}
  .hf-policy-nav > .ledger-badge {top:-8px}
  .hf-policy-nav a > .ledger-badge {top:-20px; bottom:auto; padding-inline:1px}
}
/* Requested narrow-footer exception. Other content remains at least10px. */
@media(max-width:359px) {
  .hf-policy-nav a {font-size:8px}
}
@media(min-width:768px) {
  .hf-component {--gutter:24px}
  .hf-header-inner {min-height:70px}
  .hf-header-brand .hf-logo-window {width:171px}
  .hf-footer-brand {width:138px}
  .hf-footer-brand .hf-logo-window {width:138px}
  .hf-footer-inner {grid-template-columns:138px auto minmax(0,1fr); gap:0 24px}
  .hf-policy-nav {justify-content:flex-start; gap:0 20px}
  .hf-copyright {grid-column:auto; text-align:right}
  .hf-footer-brand > .ledger-badge {bottom:-7px}
  .hf-copyright > .ledger-badge {top:16px; left:auto; right:0}
}
/* Common navigation threshold; v1.3 checks 959/960/961 and the legacy 1024 boundary. */
@media(min-width:960px) {
  .hf-quick-nav {display:flex}
  .hf-menu-toggle {display:none}
}

/* ID-only adapter: preserve TOP's canonical29 common IDs; close keeps its existing unnumbered control. */
.id-mode .hf-component[data-ledger-id],.id-mode .hf-component [data-ledger-id] {outline:none}
.hf-component .ledger-badge {font:8px/10px Consolas,monospace!important;padding:0 3px!important;border:1px solid #929BB7!important;overflow:visible}
.hf-site-footer .ledger-badge {font:8px/8px Consolas,monospace!important}
/* The page-level annotation uses the existing gap, not the common header's ID location. */
.id-mode .page-shell > .ledger-badge {top:64px}
@media(min-width:768px){.id-mode .page-shell > .ledger-badge {top:72px}}
