.gx-head h1 { font-size: clamp(2.2rem, 1.3rem + 3.6vw, 4.2rem); max-width: 20ch; }
.gx-head .gx-stand { max-width: 60ch; }
.gx-head .gx-date { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.85rem; color: var(--steel-2); margin: 1.2rem 0 0; }
.gx { max-width: 860px; }
.gx > h2 { margin-top: 2.6rem; font-size: clamp(1.7rem, 1.2rem + 2vw, 2.6rem); }
.gx > ul, .gx > ol { max-width: 66ch; padding-left: 1.2rem; }
.gx > ul li, .gx > ol li { margin-bottom: 0.5rem; }
.gx-fig { margin: 1.6rem 0 2rem; }
.gx-fig svg { display: block; width: 100%; height: auto; }
.gx-source, .gx-fig figcaption { font-size: 0.85rem; color: var(--steel); margin-top: 0.6rem; }
.gx-src { display: block; font-size: 0.78rem; letter-spacing: 0.02em; color: var(--steel); margin-top: 0.15rem; }
.gx-refs { margin-top: 2.6rem; border-top: 1px solid var(--line); padding-top: 1.4rem; }
.gx-refs h2 { font-size: 1.4rem; }
.gx-refs ul { padding-left: 1.2rem; font-size: 0.9rem; }
.gx-refs li { margin-bottom: 0.35rem; overflow-wrap: anywhere; }
.gx-refs p { font-size: 0.9rem; color: var(--steel); }
.gx-door { padding: clamp(1.6rem, 1rem + 2vw, 2.6rem) 0; }
.gx-door p { margin: 0; }
.gx-pic img { border-radius: 6px; width: 100%; }
.gx-lead { margin-top: 0; }
@media (max-width: 700px) { figure svg.viz-wide { display: none !important; } }
@media (min-width: 701px) { figure svg.viz-phone { display: none !important; } }
.nc-box { fill: var(--white); stroke: var(--ink); stroke-width: 2; }
.nc-box--key { fill: var(--ink); }
.nc-box-t { fill: var(--ink); font-family: var(--font-body); font-size: 16px; }
.nc-box-t--key { fill: var(--paper); }
.nc-arrow, .nc-link { fill: none; stroke: var(--ink); stroke-width: 2; }
.nc-link { stroke: var(--steel-2); }
.nc-head { fill: var(--ink); }
.nc-note { fill: var(--paper-2); stroke: var(--line); }
.nc-note-bar { fill: var(--water); }
.nc-note-bar--y { fill: var(--signal-deep); }
.nc-note-t { fill: var(--ink); font-family: var(--font-body); font-size: 15px; }
.nc-nsw { fill: var(--signal); opacity: 0.22; }
.nc-row { stroke: var(--line); stroke-width: 1; }
.nc-rowname { fill: var(--ink); font-family: var(--font-display); font-weight: 600; font-size: 16px; }
.nc-rowname--nsw { font-size: 20px; font-weight: 700; }
.nc-guide { stroke: var(--ink); stroke-width: 1.5; stroke-dasharray: 4 4; }
.nc-guide--soft { stroke: var(--steel-2); }
.nc-bracket { fill: none; stroke: var(--water); stroke-width: 2.5; }
.nc-bracket-t { fill: var(--water); font-family: var(--font-display); font-weight: 700; font-size: 16px; text-transform: uppercase; letter-spacing: 0.06em; }
.nc-old { fill: var(--steel); }
.nc-new { fill: var(--signal); }
.nc-temp { fill: var(--signal-deep); }
.nc-bar-t { fill: var(--ink); font-family: var(--font-display); font-weight: 600; font-size: 15px; letter-spacing: 0.02em; }
.nc-bar-t--old { fill: var(--white); }
.nc-small { fill: var(--steel); font-family: var(--font-body); font-size: 14px; }
.nc-off { fill: var(--steel); font-family: var(--font-display); font-weight: 600; font-size: 16px; font-style: italic; }
.nc-axis { stroke: var(--ink); stroke-width: 2; }
.nc-tick { stroke: var(--ink); stroke-width: 2; }
.nc-year { fill: var(--steel-2); font-family: var(--font-display); font-weight: 600; font-size: 14px; }
.nc-date { fill: var(--ink); font-family: var(--font-display); font-weight: 700; font-size: 16px; }
.nc-dot { fill: var(--ink); }
.nc-dot--off { fill: var(--paper); stroke: var(--steel); stroke-width: 2; }
.nc-ev { fill: var(--ink); font-family: var(--font-body); font-size: 15px; }
.fl svg.viz-phone { max-width: 420px; margin-inline: auto; }
.sp-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.6rem; align-items: center; }
.sp-svg { max-width: 460px; }
.sp-ground { fill: #e6e9e3; }
.sp-street { fill: #c9cdd2; }
.sp-street-t { fill: var(--ink); font-family: var(--font-display); font-weight: 600; font-size: 17px; text-transform: uppercase; letter-spacing: 0.2em; }
.sp-lot { fill: #eef0ea; }
.sp-drive { fill: #d9dcd8; }
.sp-bound { fill: none; stroke: var(--ink); stroke-width: 2; stroke-dasharray: 10 5 2 5; }
.sp-front { fill: none; stroke: var(--ink); stroke-width: 2; }
.sp-fence { fill: none; stroke: #8a6a45; stroke-width: 4; }
.sp-paling { stroke: #8a6a45; stroke-width: 2; }
.sp-edge-t { fill: var(--steel); font-family: var(--font-display); font-weight: 600; font-size: 15px; text-transform: uppercase; letter-spacing: 0.1em; }
.sp-house { fill: var(--white); stroke: var(--ink); stroke-width: 4; }
.sp-garage { fill: var(--white); stroke: var(--ink); stroke-width: 3; }
.sp-other { fill: var(--paper); stroke: var(--steel); stroke-width: 2.5; }
.sp-door { stroke: var(--water); stroke-width: 7; }
.sp-carport { fill: var(--paper-2); stroke: var(--ink); stroke-width: 1.5; stroke-dasharray: 6 4; }
.sp-post { fill: var(--ink); }
.sp-label { fill: var(--ink); font-family: var(--font-display); font-weight: 600; font-size: 17px; }
.sp-dim { fill: none; stroke: var(--steel); stroke-width: 2; stroke-dasharray: 5 4; }
.sp-dim-end { fill: none; stroke: var(--steel); stroke-width: 2; }
.sp-tag { fill: var(--steel-2); }
.sp-dim-t { fill: var(--steel); font-family: var(--font-display); font-weight: 600; font-size: 15px; }
.sp-tag-t { fill: var(--white); font-family: var(--font-display); font-weight: 700; font-size: 16px; }
.sp-mark { fill: var(--signal); stroke: var(--ink); stroke-width: 2; }
.sp-mark-t { fill: var(--ink); font-family: var(--font-display); font-weight: 700; font-size: 17px; }
.sp-key { list-style: none; margin: 0; padding: 0; }
.sp-key li { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: 0.75rem; align-items: start; padding: 0.6rem 0; border-bottom: 1px solid var(--line); font-size: 0.95rem; line-height: 1.4; }
.sp-key li:first-child { border-top: 2px solid var(--ink); }
.sp-k { width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--signal); border: 2px solid var(--ink); font-family: var(--font-display); font-weight: 700; line-height: 1.45rem; text-align: center; }
.sp-key--grey { color: var(--steel); }
.sp-k--grey { border-radius: 3px; background: var(--steel-2); border-color: var(--steel-2); color: var(--white); }
.sp-tagline { display: block; font-size: 0.85rem; margin-top: 0.2rem; }
@media (max-width: 760px) {
.sp-grid { grid-template-columns: 1fr; }
.sp-svg { margin-inline: auto; }
}
.dp-svg { max-width: 480px; }
.dp-q { fill: var(--water); font-family: var(--font-display); font-weight: 700; font-size: 18px; }
.dp-t { fill: var(--ink); font-family: var(--font-body); font-size: 15px; }
.dp-no, .dp-yes { fill: var(--steel); font-family: var(--font-display); font-weight: 700; font-size: 15px; text-transform: uppercase; letter-spacing: 0.06em; }
.dp-out--yes { fill: var(--signal); stroke: var(--ink); stroke-width: 2; }
.dp-out--no { fill: var(--white); stroke: var(--ink); stroke-width: 2; stroke-dasharray: 6 4; }
.dp-out-t { fill: var(--ink); font-family: var(--font-display); font-weight: 600; font-size: 18px; }
.dp-note { fill: var(--paper-2); stroke: var(--line); }
.dp-note-t { fill: var(--ink); font-family: var(--font-body); font-size: 15px; }
.st-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0.8rem; }
.st { grid-column: span 2; position: relative; background: var(--white); border: 1px solid #c9cfd6; border-top: 4px solid var(--ink); border-radius: 2px; padding: 0.95rem 1rem 0.8rem; display: flex; flex-direction: column; gap: 0.35rem; }
.st:nth-child(4), .st:nth-child(5) { grid-column: span 3; }
.st::before, .st::after { content: ""; position: absolute; top: 0.45rem; width: 6px; height: 6px; border-radius: 50%; background: #c9cfd6; }
.st::before { left: 0.45rem; } .st::after { right: 0.45rem; }
.st-lab { font-family: var(--font-display); letter-spacing: 0.02em; font-weight: 600; font-size: 1rem; color: var(--steel); line-height: 1.25; }
.st-fig { font-family: var(--font-display); font-weight: 700; font-size: 1.35rem; line-height: 1.15; color: var(--ink); }
@media (max-width: 900px) {
.st-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.st, .st:nth-child(4) { grid-column: auto; }
.st:nth-child(5) { grid-column: 1 / -1; }
}
@media (max-width: 420px) {
.st-grid { grid-template-columns: 1fr; }
.st:nth-child(5) { grid-column: auto; }
}