.section { padding: var(--space-eight) 0 0; }

.sec-head {
    display: flex;
    align-items: center;
    gap: var(--space-two);
    border-bottom: var(--border-w) solid var(--border-rule);
    padding-bottom: var(--space-two);
}
.sec-bar {
    width: var(--tick-w);
    align-self: center;
    height: var(--tick-h);
    background: var(--brand-blue);
    flex: none;
}
[data-theme="dark"] .sec-bar { background: var(--highlighter); }
.sec-title {
    font-family: var(--font-ui);
    font-weight: 600;
    font-size: var(--fs-caption);
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--accent-text);
    flex: 1;
    min-width: 0;
}
.sec-count {
    font-family: var(--font-mono);
    font-size: var(--fs-small);
    color: var(--text-muted);
    letter-spacing: 0.01em;
    white-space: nowrap;
}
.sec-blurb {
    margin-top: var(--space-three);
    max-width: var(--blurb-measure);
    font-size: var(--fs-small);
    color: var(--text-muted);
    line-height: 1.5;
}

.segmented {
    display: inline-flex;
    padding: var(--space-one);
    border: var(--border-w) solid var(--border-hairline);
    border-radius: var(--radius-chip);
    background: var(--bg-canvas);
    gap: var(--space-one);
    flex: none;
    align-self: center;
}
.seg-btn {
    font-family: var(--font-ui);
    font-size: var(--fs-caption);
    font-weight: 600;
    letter-spacing: var(--tracking-caps);
    text-transform: uppercase;
    padding: var(--space-one) var(--space-three);
    border: none;
    border-radius: var(--radius-chip);
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
}
.seg-btn.is-active { background: var(--navy); color: var(--on-navy); }
[data-theme="dark"] .seg-btn.is-active { background: var(--highlighter); color: var(--ink); }

.rows { margin-top: var(--space-five); }
.row {
    display: flex;
    align-items: center;
    gap: var(--space-four);
    padding: var(--space-three) 0 var(--space-three) var(--space-four);
    border-top: var(--border-w) solid var(--border-subtle);
    border-left: var(--edge-subject) solid transparent;
    transition: background var(--t-fast) var(--e-standard);
}
.row:first-child { border-top: none; }
.row:hover { background: var(--bg-sunken); }
.row.is-urgent { border-left-color: var(--specialist-red); }

.row-mark {
    width: var(--mark-row);
    height: var(--mark-row);
    flex: none;
    display: block;
}
.row-mark canvas { display: block; width: var(--fill); height: var(--fill); }

.row-body { flex: 1 1 auto; min-width: 0; }
.row-title {
    display: block;
    font-family: var(--font-ui);
    font-size: var(--fs-small);
    font-weight: 600;
    line-height: var(--lh-compact);
    color: var(--text-primary);
    text-decoration: none;
}
a.row-title:hover { color: var(--text-primary); text-decoration: underline; text-underline-offset: 0.18em; }
.row-sub {
    display: block;
    margin-top: var(--space-one);
    font-family: var(--font-body);
    font-size: var(--fs-caption);
    line-height: var(--lh-compact);
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}
.row-meta {
    width: var(--meta-w);
    flex: none;
    text-align: right;
    font-family: var(--font-ui);
    font-size: var(--fs-caption);
    font-weight: 600;
    letter-spacing: var(--tracking-caps);
    text-transform: uppercase;
    color: var(--text-muted);
}
.row-action { flex: none; display: flex; align-items: center; gap: var(--space-four); }

.linkout {
    font-family: var(--font-ui);
    font-size: var(--fs-small);
    font-weight: 600;
    color: var(--accent-text);
    text-decoration: none;
    white-space: nowrap;
}
.linkout:hover { color: var(--accent-text); text-decoration: underline; text-underline-offset: 0.18em; }

.brief {
    margin-top: var(--space-five);
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--space-two) var(--space-five);
    align-items: end;
    padding: var(--space-four);
    background: var(--bg-sunken);
    border-top: var(--border-w) solid var(--border-hairline);
    border-bottom: var(--border-w) solid var(--border-hairline);
    border-left: var(--edge-subject) solid var(--accent-strong);
}
.brief-key {
    grid-column: 1 / -1;
    font-family: var(--font-mono);
    font-size: var(--fs-caption);
    letter-spacing: 0.01em;
    color: var(--text-muted);
}
.brief-text {
    font-family: var(--font-body);
    font-size: var(--fs-small);
    line-height: var(--lh-body);
    color: var(--text-body);
    max-width: var(--blurb-measure);
}
.brief-act { align-self: end; }

.doorway {
    margin-top: var(--space-six);
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--meta-w);
    align-items: center;
    gap: var(--space-four);
    padding: var(--space-five) 0;
    border-top: var(--border-w) solid var(--border-hairline);
    border-bottom: var(--border-w) solid var(--border-hairline);
    border-left: var(--edge-subject) solid transparent;
    text-decoration: none;
    transition: background var(--t-fast) var(--e-standard);
}
.doorway:hover { background: var(--bg-sunken); }
.doorway-body { min-width: 0; padding-left: var(--space-four); }
.doorway-title {
    display: block;
    font-family: var(--font-ui);
    font-size: var(--fs-small);
    font-weight: 600;
    line-height: var(--lh-compact);
    color: var(--text-primary);
}
.doorway:hover .doorway-title { text-decoration: underline; text-underline-offset: 0.18em; }
.doorway-sub {
    display: block;
    margin-top: var(--space-one);
    font-family: var(--font-body);
    font-size: var(--fs-caption);
    line-height: var(--lh-compact);
    color: var(--text-muted);
}
.doorway-meta {
    text-align: right;
    padding-right: var(--space-four);
    font-family: var(--font-ui);
    font-size: var(--fs-caption);
    font-weight: 600;
    letter-spacing: var(--tracking-caps);
    text-transform: uppercase;
    color: var(--accent-text);
}

.section-open { padding-top: var(--space-nine); }

.dest {
    margin-top: var(--space-six);
    padding: var(--space-seven) var(--space-six);
    background: var(--bg-sunken);
    border-top: var(--rule-accent) solid var(--accent-strong);
    border-bottom: var(--border-w) solid var(--border-hairline);
}
.dest-name {
    font-family: var(--font-display);
    font-weight: normal;
    font-size: var(--fs-display-m);
    line-height: var(--lh-hero);
    letter-spacing: var(--tracking-display);
    color: var(--text-primary);
}
.dest-line {
    margin-top: var(--space-four);
    max-width: var(--blurb-measure);
    font-family: var(--font-body);
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    color: var(--text-body);
}
.dest-act {
    margin-top: var(--space-six);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-five);
}
.dest-meta {
    font-family: var(--font-ui);
    font-size: var(--fs-caption);
    font-weight: 600;
    letter-spacing: var(--tracking-caps);
    text-transform: uppercase;
    color: var(--text-muted);
}
.dest-note {
    margin-top: var(--space-five);
    max-width: var(--blurb-measure);
    font-family: var(--font-body);
    font-size: var(--fs-small);
    line-height: var(--lh-body);
    color: var(--text-muted);
}

@media (max-width: 52rem) {
    .row { flex-wrap: wrap; }
    .row-meta { text-align: left; }
}
