/* page: people. Shared tokens and classes live in ../styles.css. */
[data-page='people'] .pp-ledger { margin-top: 28px; }
[data-page='people'] > .sheet { margin-top: 24px; }

.pp-split { display: flex; flex-wrap: wrap; gap: 24px; margin-top: 20px; align-items: flex-start; }
.pp-mapbox { flex: 999 1 640px; min-width: 0; overflow-x: auto; border: 1px solid var(--rule); background: var(--sheet-hi); }
.pp-map { display: block; width: 100%; min-width: 640px; height: auto; }
.pp-node { cursor: pointer; outline: none; }
.pp-node:focus-visible .pp-dot { stroke: var(--stamp); stroke-width: 3; }
.pp-label { font: 500 12px var(--sans); }
.pp-hover { font: 500 12px var(--mono); fill: var(--ink-3); }
.pp-side { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.pp-lbl { margin-bottom: 6px; }
.pp-sw { display: inline-block; width: 10px; height: 10px; flex: none; margin-right: 6px; }
.pp-sw.round { border-radius: 50%; }
.pp-sw.big { width: 14px; height: 14px; margin-right: 0; }
.pp-chip-t { flex: 1 1 auto; font-size: 14px; line-height: 1.35; }
.pp-chip-s { display: block; font-size: 12px; color: var(--ink-3); }
.pp-why { margin: 8px 0 0; font-size: 13px; line-height: 1.5; color: var(--ink-2); }
.pp-note { margin: 6px 0 0; font-size: 12px; color: var(--ink-3); }
.pp-matches { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.pp-match { min-height: 36px; padding: 4px 10px; border: 1px solid var(--rule-strong); border-radius: 4px; background: var(--input-bg); font: 400 13px var(--sans); color: var(--ink); cursor: pointer; }
.pp-match:hover { border-color: var(--ink); }
.pp-card { border: 1px solid var(--ink); background: var(--input-bg); padding: 16px 18px 12px; min-width: 0; }
.pp-card-name { font: 600 24px/1.2 var(--cond); margin-top: 4px; overflow-wrap: anywhere; }
.pp-card-handle { font: 400 13px/1.5 var(--mono); color: var(--ink-2); overflow-wrap: anywhere; }
.pp-pills { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 6px; }
.pp-pill { display: inline-flex; align-items: center; padding: 2px 8px; border: 1px solid var(--rule-strong); border-radius: 3px; font-size: 12px; line-height: 1.5; }
.pp-k { color: var(--ink-2); }
.pp-notes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); gap: 12px 32px; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--rule); font-size: 14px; line-height: 1.55; color: var(--ink-2); }
.pp-notes p { margin: 0; }
.pp-notes b { color: var(--ink); }

.pp-split.archs { gap: 28px; margin-top: 18px; }
.pp-archs { flex: 3 1 520px; min-width: 0; border-top: 2px solid var(--ink); }
.pp-split.archs > .pp-card { flex: 2 1 320px; padding: 18px 20px; }
.pp-arch-n { flex: 0 0 170px; font-size: 15px; font-weight: 600; }
.pp-track { flex: 1 1 auto; height: 10px; background: var(--rule-soft); border-radius: 0 3px 3px 0; }
.pp-track.on { background: var(--ink-2); }
.pp-fill { display: block; height: 10px; background: var(--data); border-radius: 0 3px 3px 0; }
.pp-track.on .pp-fill { background: var(--sheet); }
.pp-arch-c { flex: 0 0 64px; text-align: right; font-size: 14px; }
.pp-rule { margin: 10px 0 0; font: 400 13px/1.6 var(--mono); color: var(--ink-2); }

.pp-table table { min-width: 900px; }
.pp-table { margin-top: 18px; }
.pp-bars { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(420px, 100%), 1fr)); gap: 32px; margin-top: 28px; }
.pp-src { margin: 20px 0 0; font: 400 12px/1.6 var(--mono); color: var(--ink-3); }

@media (max-width: 720px) {
  .pp-arch-n { flex-basis: 110px; font-size: 14px; }
}

.pp-skip { position: absolute; left: -9999px; }
.pp-skip:focus { position: static; display: inline-block; margin-top: 12px; padding: 6px 12px; border: 1px solid var(--ink); background: var(--input-bg); font: 500 13px var(--sans); color: var(--ink); cursor: pointer; }
.pp-side:focus { outline: none; }