/* BUILD 208 (P7) — Family Parks: the pieces BUILD 131's page and the area pages don't style (panel "nearby" lines, area-card lines,
   the map layer switches and their markers + popups, the licence line). STRUCTURAL BASE ONLY — the visual rules come from Gemini's
   design round (gemini/design/), appended below verbatim. */
.d-links[hidden], .nbp-layers-status:empty{ display:none; }
.nbp-layers:not(.is-ready){ display:none; }
.nbp-links{ list-style:none; margin:0; padding:0; }
.nbp-link{ display:flex; gap:.8rem; justify-content:space-between; align-items:flex-start; }
.nbp-link-body{ display:flex; flex-direction:column; min-width:0; }
.nbp-link-sub{ display:block; }
.nbp-lm{ display:block; width:14px; height:14px; box-sizing:border-box; }
/* Deep links to an area card (/family-parks/<area>/#<park>) land below the sticky site header (87 px at 390 and 1440 px), not under it:
   BUILD 131's 16 px margin put the card's name behind the header (iOS rig, 2026-09-24). parks.js keeps the card there after its lines load. */
.hub-parks > li.hub-park[id]{ scroll-margin-top:103px; }

/* Gemini 3.8 Flash design r1 (gemini/design/design-r1.json "css"), verbatim */
.d-links { margin-top: .4rem; }
.d-links .nbp-links { display: flex; flex-direction: column; }
.nbp-link { padding: .7rem 0; border-bottom: 1px solid var(--rule); align-items: center; gap: .8rem; }
.nbp-link:last-child { border-bottom: 0; }
.nbp-link-text { font-family: var(--body); font-size: 13.5px; font-weight: 500; line-height: 1.35; color: var(--ink); }
.nbp-link-sub { font-family: var(--body); font-size: 12px; line-height: 1.35; color: var(--muted); margin-top: .25rem; }
.nbp-link-badge { display: inline-block; font-family: var(--body); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; color: var(--brass); border: 1px solid var(--brass); padding: 1px 5px; margin-left: 6px; vertical-align: middle; }
.nbp-link-go { flex: 0 0 auto; font-family: var(--body); font-size: 11.5px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--brass-ink); text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; justify-content: flex-end; text-align: right; padding: 0 .25rem; transition: color .2s var(--ease); }
.nbp-link-go:hover { color: var(--ink); text-decoration: underline; }
@media (max-width: 520px) {
  .nbp-link { flex-direction: column; align-items: flex-start; gap: .25rem; }
  .nbp-link-go { align-self: flex-start; justify-content: flex-start; text-align: left; min-height: 44px; padding: 0; }
}
.hp-links { margin: 1rem 0 .75rem; padding-top: .85rem; border-top: 1px solid var(--rule); }
.hp-links-h { font-family: var(--body); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.2px; color: var(--muted); margin: 0 0 .5rem; }
.nbp-links--card .nbp-link { flex-direction: column; align-items: flex-start; gap: .25rem; padding: .55rem 0; border-bottom: 1px solid var(--rule); }
.nbp-links--card .nbp-link:last-child { border-bottom: 0; padding-bottom: .2rem; }
.nbp-links--card .nbp-link-text { font-size: 13px; line-height: 1.35; }
.nbp-links--card .nbp-link-sub { font-size: 11.5px; margin-top: .2rem; }
.nbp-links--card .nbp-link-go { min-height: 44px; align-self: flex-start; text-align: left; font-size: 11.5px; padding: 0; }
.nbp-layers { display: flex; align-items: center; flex-wrap: wrap; gap: .55rem .75rem; margin: .85rem 0 .4rem; }
.nbp-layers-label { font-family: var(--body); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.2px; color: var(--muted); margin-right: .25rem; }
.nbp-layer { font-family: var(--body); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.1px; min-height: 44px; padding: 0 14px; border-radius: 0; border: 1px solid var(--rule-strong); background: var(--cotton); color: var(--ink); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background .2s ease, border-color .2s ease, color .2s ease; }
.nbp-layer:hover { border-color: var(--ink); background: #ede9e0; }
.nbp-layer[aria-pressed="true"] { background: var(--ink); color: var(--cotton); border-color: var(--ink); }
.nbp-layer[data-layer="washrooms"]::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 8px; background: var(--brass); border: 1px solid currentColor; }
.nbp-layer[data-layer="fountains"]::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: #2E799E; border: 1px solid currentColor; }
.nbp-layers-status { font-family: var(--body); font-size: 11.5px; color: var(--muted); font-style: italic; }
.nbp-lm { box-shadow: 0 1px 3px rgba(15,26,61,.3); transition: transform .15s ease; }
.nbp-lm:hover { transform: scale(1.25); }
.nbp-lm--washrooms { width: 12px; height: 12px; margin: 1px; background: var(--brass); border: 1.5px solid var(--ink); border-radius: 0; }
.nbp-lm--fountains { width: 12px; height: 12px; margin: 1px; border-radius: 50%; background: #2E799E; border: 1.5px solid var(--ink); }
.nbp-pop { font-family: var(--body); }
.nbp-pop-kicker { display: block; font-family: var(--body); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 1.4px; color: var(--muted); margin-bottom: .25rem; }
.nbp-pop--washrooms .nbp-pop-kicker { color: var(--brass-ink); }
.nbp-pop--fountains .nbp-pop-kicker { color: #2E799E; }
.nbp-pop-row { font-family: var(--body); font-size: 12px; line-height: 1.45; color: var(--ink); margin: 0 0 .35rem; white-space: pre-line; }
.nbp-pop-notice { font-family: var(--body); font-size: 11.5px; line-height: 1.4; color: #8B2500; background: rgba(168,72,42,.08); border-left: 2px solid var(--brass); padding: .35rem .55rem; margin: .45rem 0; }
.nbp-pop-src { font-family: var(--body); font-size: 10.5px; line-height: 1.35; color: var(--muted-2); font-style: italic; margin: .6rem 0 .25rem; }
.nbp-pop-city { display: inline-flex; align-items: center; font-family: var(--body); font-size: 11.5px; font-weight: 600; color: var(--brass-ink); text-decoration: underline; text-underline-offset: 3px; min-height: 44px; transition: color .2s ease; }
.nbp-pop-city:hover { color: var(--ink); }
.nbp-licence { display: block; margin-top: .4rem; }
.nbp-licence a { color: rgba(224,210,184,.55); text-decoration: underline; text-underline-offset: 2px; transition: color .2s ease; }
.nbp-licence a:hover { color: var(--linen); }
