/* builds.css  -  the Builds page: one row per build idea, its state and its up-vote button (Joey 2026-10-15).
   Everything else is the shell's (page, panel, tag, part, btn). Phone rules at the bottom. */
.builds .start-build { margin: 6px 0 26px; }
.build-list { display: flex; flex-direction: column; gap: 12px; max-width: 860px; }
.build-row { display: flex; align-items: center; gap: 18px; padding: 18px 22px; text-decoration: none; color: inherit; }
.build-row:hover { border-color: var(--line-2); }
.b-main { flex: 1; min-width: 0; }
.b-main h2 { font-family: var(--display); font-weight: 600; font-size: 19px; margin-bottom: 4px; }
.b-main p { color: var(--soft); font-size: 14.5px; }
.b-main .b-note { margin-top: 6px; color: var(--text); }
.b-side { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex: none; }
.b-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 4px 0 6px; }
.builds .b-head .tag, .build-row .tag { font-size: 12.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; border: 1px solid var(--line-2); background: var(--panel); }
.b-voters { color: var(--faint); font-size: 14px; margin-bottom: 18px; }
.builds .tag.state-approved, .builds .tag.state-built { background: var(--accent); color: var(--accent-ink); }
.builds .tag.state-turned-down { opacity: 0.6; }
.build-line { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin: 4px 0 22px; padding: 16px 20px; max-width: 760px; }
.build-line p { flex: 1; min-width: 220px; font-weight: 500; }
@media (max-width: 760px) {
  .build-row { flex-direction: column; align-items: stretch; gap: 12px; padding: 16px 18px; }
  .b-side { flex-direction: row; justify-content: space-between; align-items: center; }
}