/* Layout: one site, thirteen pages swapped by hash; a sticky review bar sits above every page. */
:root { --ink: #16202A; --ground: #F3F4F1; --accent: #E8641B; --slate: #4A5560; --stone: #C9CFCB; color-scheme: light; }
html, body { background: var(--ground); color: var(--ink); }
body { margin: 0; }
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 30; background: var(--ink); }
a { color: var(--ink); } a:hover { color: var(--slate); }
[id] { scroll-margin-top: 72px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.review-bar { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 25; background: var(--ink); color: #F3F4F1; font-family: 'Arimo', Arial, Helvetica, sans-serif; font-size: 14px; border-bottom: 3px solid var(--accent); }
.review-inner { max-width: 1200px; margin: 0 auto; box-sizing: border-box; padding-inline: max(16px, env(safe-area-inset-left, 0px)) max(16px, env(safe-area-inset-right, 0px)); padding-block: 10px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.review-chip { font-family: 'Arimo', Arial, Helvetica, sans-serif; font-size: 11px; letter-spacing: 0.14em; padding: 4px 8px; background: var(--accent); color: var(--ink); font-weight: 500; }
.review-note { flex: 1 1 260px; min-width: 0; color: #C9CFCB; }
.review-note b { color: #F3F4F1; font-weight: 600; }
.review-controls { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.review-controls label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.review-controls select, .review-controls button { min-height: 40px; border-radius: 3px; font: inherit; font-size: 14px; font-weight: 600; }
.review-controls select { padding: 0 10px; border: 1px solid #4A5560; background: #26323D; color: #F3F4F1; }
.review-controls button { padding: 0 14px; border: 0; background: #F3F4F1; color: var(--ink); cursor: pointer; }
.review-hint { width: 100%; color: #F2B705; font-weight: 600; }
.picking [data-page] { cursor: crosshair; }
.pick-target { outline: 2px dashed var(--accent) !important; outline-offset: 3px; }
.form-note { margin: 0; font-size: 14px; font-weight: 600; color: #8C4A12; }
@media (max-width: 640px) { .xs-label { padding: 2px 6px !important; gap: 0 !important; } .xs-label > span:first-child { font-size: 9.5px !important; } .xs-label-line { font-size: 10px !important; } .gap-li { grid-template-columns: 36px minmax(0, 1fr) !important; padding-inline: 16px !important; } .gap-li > span:last-child { grid-column: 2; } }

/* Global header and footer */
.wrap { max-width: 1200px; margin: 0 auto; box-sizing: border-box; padding-inline: max(16px, env(safe-area-inset-left, 0px)) max(16px, env(safe-area-inset-right, 0px)); }
.gh { background: #FFFFFF; border-bottom: 1px solid var(--stone); font-family: 'Arimo', Arial, Helvetica, sans-serif; position: relative; z-index: 20; }
.gh .wrap { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 16px 28px; padding-block: 10px; }
.gh-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--ink); }
.gh-brand img { display: block; width: 40px; height: 40px; }
.gh-word { display: flex; flex-direction: column; line-height: 1; }
.gh-word b { font-size: 21px; letter-spacing: 0.16em; }
.gh-word span { font-size: 11px; letter-spacing: 0.24em; color: var(--slate); margin-top: 3px; }
.gh-nav { display: flex; align-items: center; gap: 26px; font-size: 16px; font-weight: 600; }
.gh-nav > a, .gh-svc > summary { color: var(--ink); text-decoration: none; padding-block: 8px; cursor: pointer; }
.gh-nav > a[aria-current="page"], .gh-svc.on > summary { box-shadow: inset 0 -2px 0 var(--accent); }
.gh-svc { position: relative; }
.gh-svc > summary { list-style: none; display: flex; align-items: center; gap: 6px; }
.gh-svc > summary::-webkit-details-marker { display: none; }
.gh-svc > summary::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.gh-menu { position: absolute; top: calc(100% + 12px); left: -20px; width: 340px; background: #FFFFFF; border: 1px solid var(--stone); border-radius: 4px; box-shadow: 0 18px 40px rgba(22, 32, 42, 0.12); padding: 10px; display: flex; flex-direction: column; }
.gh-menu a { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 3px; text-decoration: none; color: var(--ink); }
.gh-menu a:hover { background: var(--ground); }
.gh-menu a span { font-size: 14px; font-weight: 400; color: var(--slate); }
.gh-cta { display: inline-flex; align-items: center; min-height: 46px; padding: 0 20px; background: var(--accent); color: var(--ink); font-weight: 700; font-size: 15px; text-decoration: none; border-radius: 3px; white-space: nowrap; }
.gh-cta:hover { color: var(--ink); filter: brightness(1.05); }
.pc-tab { font: inherit; font-weight: 700; min-height: 46px; padding: 0 18px; border: 2px solid var(--ink); border-radius: 3px; background: transparent; color: var(--ink); cursor: pointer; }
.pc-tab[aria-pressed="true"] { background: var(--ink); color: #F3F4F1; }
[hidden] { display: none !important; }
#jha-print { display: none; }
@media print {
  @page { size: Letter landscape; margin: 0.5in; }
  body > *:not(#jha-print) { display: none !important; }
  #jha-print { display: block !important; }
  html, body { background: #FFFFFF !important; }
}
#gate { position: fixed; inset: 0; z-index: 200; font-family: 'Arimo', Arial, Helvetica, sans-serif; font-size: 17px; line-height: 1.5; background: rgba(22, 32, 42, 0.62); display: flex; align-items: center; justify-content: center; padding: 16px max(16px, env(safe-area-inset-right, 0px)) 16px max(16px, env(safe-area-inset-left, 0px)); }
#gate .gate-box { width: 100%; max-width: 520px; background: #FFFFFF; color: var(--ink); padding: 28px; border-top: 6px solid var(--accent); display: flex; flex-direction: column; gap: 14px; max-height: 100%; overflow: auto; box-sizing: border-box; }
#gate input { font: inherit; min-height: 50px; padding: 0 14px; border: 1px solid var(--slate); border-radius: 3px; min-width: 0; }
#gate label { display: flex; flex-direction: column; gap: 6px; font-size: 15px; font-weight: 600; }
#gate .gate-go { min-height: 52px; border: 0; border-radius: 3px; background: var(--accent); color: var(--ink); font: inherit; font-weight: 700; cursor: pointer; }
#gate .gate-x { align-self: flex-end; border: 0; background: transparent; font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; color: var(--slate); min-height: 40px; }
.gh-mobile { display: none; }
.gh-mobile > summary { list-style: none; min-height: 44px; display: inline-flex; align-items: center; padding: 0 16px; border: 2px solid var(--ink); border-radius: 3px; font-weight: 700; cursor: pointer; }
.gh-mobile > summary::-webkit-details-marker { display: none; }
.gh-mobile .gh-sheet { position: absolute; left: 0; right: 0; top: 100%; background: #FFFFFF; border-bottom: 1px solid var(--stone); box-shadow: 0 18px 30px rgba(22, 32, 42, 0.12); padding: 8px max(16px, env(safe-area-inset-right, 0px)) 16px max(16px, env(safe-area-inset-left, 0px)); display: flex; flex-direction: column; }
.gh-sheet a { padding: 12px 4px; border-bottom: 1px solid var(--ground); text-decoration: none; font-weight: 600; color: var(--ink); }
.gh-sub > summary { list-style: none; padding: 12px 4px; border-bottom: 1px solid var(--ground); font-weight: 600; cursor: pointer; display: flex; justify-content: space-between; }
.gh-sub > summary::-webkit-details-marker { display: none; }
.gh-sub > summary::after { content: "+"; font-weight: 700; }
.gh-sub[open] > summary::after { content: "\2212"; }
.gh-sub > div { display: flex; flex-direction: column; padding-left: 14px; }
.gh-sub a { font-weight: 400; }
.gh-sheet .gh-cta { margin-top: 12px; justify-content: center; border: 0; }
@media (max-width: 1080px) { .gh-nav, .gh .wrap > .gh-cta { display: none; } .gh-mobile { display: block; } }
.crumb { font-family: 'Arimo', Arial, Helvetica, sans-serif; font-size: 14px; color: var(--slate); padding-top: 22px; }
.crumb a { color: var(--slate); }
.gf { background: var(--ink); color: #C9CFCB; font-family: 'Arimo', Arial, Helvetica, sans-serif; font-size: 15px; }
.gf .wrap { padding-block: 56px 32px; display: flex; flex-direction: column; gap: 40px; }
.gf-top { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 32px 40px; }
.gf-brand { display: flex; flex-direction: column; gap: 14px; }
.gf-brand b { color: #F3F4F1; font-size: 19px; letter-spacing: 0.16em; }
.gf h2 { margin: 0 0 12px; font-size: 12px; letter-spacing: 0.16em; color: #F3F4F1; font-weight: 700; }
.gf ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 9px; }
.gf a { color: #C9CFCB; text-decoration: none; }
.gf a:hover { color: #FFFFFF; text-decoration: underline; }
.gf-bottom { border-top: 1px solid #2E3A45; padding-top: 22px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 32px; font-size: 13px; color: #A9B1B6; }
.gf-bottom p { margin: 0; max-width: 62em; }
@media (max-width: 860px) { .gf-top { grid-template-columns: repeat(2, minmax(0, 1fr)); } .gf-brand { grid-column: 1 / -1; } }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }

.review-bar { display: none !important; }