/* Public requests share the builder launch tokens. Component contract: DESIGN.md. */
.roadmap-surface { color: var(--on-surface); font-family: var(--launch-font-body); }
.roadmap-surface *, .roadmap-surface *::before, .roadmap-surface *::after { box-sizing: border-box; }
.roadmap-surface [hidden] { display: none; }
.roadmap-page .launch-hero { padding-bottom: var(--space-page-lg); }
.roadmap-page .launch-hero-top { margin-bottom: 0; }
.roadmap-heading { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: end; gap: var(--space-page); margin-bottom: var(--space-section); }
.roadmap-heading .launch-lead { margin-bottom: 0; font-size: var(--launch-reading-size, var(--space-2xl)); }
.roadmap-heading h2 { margin-bottom: var(--space-xl); }
.roadmap-surface .roadmap-note { margin: var(--space-lg) 0 0; color: var(--on-surface-muted); font-size: var(--launch-detail-size, var(--space-2xl)); line-height: 1.5; }
.roadmap-filters { border-block: 1px solid var(--border); padding-block: var(--space-2xl); margin-bottom: var(--space-section); }
.roadmap-status-filters { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-bottom: var(--space-2xl); }
.roadmap-status-filters button, .roadmap-retry, .roadmap-more { min-height: var(--space-touch-target); padding: var(--space-lg) var(--space-2xl); border: 1px solid var(--border); border-radius: var(--rounded-xs); background: var(--surface); color: var(--on-surface); font: 500 var(--launch-menu-size, var(--space-2xl))/1.4 var(--launch-font-body); cursor: pointer; }
.roadmap-status-filters button { background: transparent; border-color: transparent; }
.roadmap-status-filters button[aria-pressed="true"] { background: var(--accent-tint); border-color: var(--accent-border); color: var(--accent); }
.roadmap-status-filters button:hover, .roadmap-retry:hover, .roadmap-more:hover { border-color: var(--accent-border); color: var(--accent); }
.roadmap-search-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: var(--space-3xl); }
.roadmap-search { display: flex; align-items: end; flex-wrap: wrap; gap: var(--space-xl); min-width: 0; margin: 0; }
.roadmap-search label { flex: 1; min-width: 0; }
.roadmap-surface label { display: grid; gap: var(--space-lg); font-size: var(--launch-detail-size, var(--space-2xl)); color: var(--on-surface-muted); }
.roadmap-surface input, .roadmap-surface select { width: 100%; min-height: var(--space-touch-target); min-width: 0; border: 1px solid var(--border-hover); border-radius: var(--rounded-xs); padding: var(--space-lg) var(--space-xl); background: var(--surface); color: var(--on-surface); font: 400 var(--launch-menu-size, var(--space-2xl))/1.4 var(--launch-font-body); }
.roadmap-surface input::placeholder { color: var(--on-surface-muted); }
.roadmap-surface :is(a, button, input, select):focus-visible { outline: var(--space-xs) solid var(--accent); outline-offset: var(--space-sm); }
.roadmap-surface button:disabled { cursor: wait; color: var(--on-surface-muted); }
.roadmap-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--border); }
.roadmap-item { display: grid; grid-template-columns: minmax(var(--space-touch-target), max-content) minmax(0, 1fr) auto; align-items: start; gap: var(--space-2xl); padding-block: var(--space-3xl); border-bottom: 1px solid var(--border); }
.roadmap-rank { padding-top: var(--space-lg); color: var(--accent); font: 500 var(--space-3xl)/1.25 var(--font-mono); font-variant-numeric: tabular-nums; }
.roadmap-item > div { min-width: 0; }
.roadmap-meta { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-xl); margin-bottom: var(--space-xl); color: var(--on-surface-muted); font-size: var(--launch-detail-size, var(--space-2xl)); }
.roadmap-status { display: inline-flex; gap: var(--space-lg); align-items: center; color: var(--on-surface); }
.roadmap-status::before { content: ""; width: var(--space-lg); height: var(--space-lg); background: var(--on-surface-muted); border-radius: var(--rounded-xs); }
.roadmap-status[data-status="planned"]::before { background: var(--info); }
.roadmap-status[data-status="in_progress"]::before { background: var(--accent); }
.roadmap-status[data-status="shipped"]::before { background: var(--success); }
.roadmap-surface .roadmap-item h3 { font-family: var(--font-display); font-size: var(--space-3xl); line-height: 1.25; margin: 0 0 var(--space-xl); overflow-wrap: anywhere; }
.roadmap-item h3 a { display: inline-flex; align-items: center; min-height: var(--space-touch-target); color: var(--on-surface); text-decoration: none; }
.roadmap-item h3 a:hover { color: var(--accent); text-decoration: underline; text-underline-offset: var(--space-sm); }
.roadmap-surface .roadmap-description { margin: 0; color: var(--on-surface-muted); font-size: var(--launch-reading-size, var(--space-2xl)); line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.roadmap-vote { display: flex; align-items: center; justify-content: center; min-width: var(--space-touch-target); min-height: var(--space-touch-target); padding: var(--space-lg) var(--space-xl); border: 1px solid var(--border-hover); border-radius: var(--rounded-md); background: var(--surface); color: var(--accent); text-decoration: none; font-size: var(--launch-detail-size, var(--space-2xl)); line-height: 1.4; }
.roadmap-vote:hover { border-color: var(--accent-border); background: var(--accent-tint); }
.roadmap-message { min-height: var(--space-touch-target); display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-xl); margin-block: var(--space-2xl); }
.roadmap-message p { margin: 0; color: var(--on-surface-muted); font-size: var(--launch-detail-size, var(--space-2xl)); }
.roadmap-more { display: block; margin: var(--space-3xl) auto 0; }
.roadmap-policy { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-page); padding-block: var(--space-section); }
.roadmap-policy h3 { margin-bottom: var(--space-xl); }
.roadmap-policy p { font-size: var(--launch-reading-size, var(--space-2xl)); line-height: 1.6; color: var(--on-surface-muted); }
.roadmap-compact .roadmap-item { gap: var(--space-2xl); }
.roadmap-compact .roadmap-description { font-size: var(--launch-detail-size, var(--space-2xl)); }
.roadmap-compact .roadmap-item h3 { font-size: var(--space-3xl); }
.roadmap-dev { border-top: 1px solid var(--border); }
.roadmap-dev .roadmap-note { max-width: none; }
.roadmap-dev .actions { margin-top: var(--space-3xl); }
@media (max-width: 820px) {
  .roadmap-heading, .roadmap-policy { grid-template-columns: minmax(0, 1fr); gap: var(--space-3xl); }
  .roadmap-search-row { grid-template-columns: minmax(0, 1fr); gap: var(--space-2xl); }
  .roadmap-search-row > label { max-width: 100%; }
}
@media (max-width: 600px) {
  .roadmap-item, .roadmap-compact .roadmap-item { grid-template-columns: minmax(var(--space-section), max-content) minmax(0, 1fr); gap: var(--space-xl); }
  .roadmap-vote { grid-column: 2; justify-self: start; }
  .roadmap-surface .roadmap-item h3 { font-size: var(--space-2xl); line-height: 1.4; }
  .roadmap-surface .roadmap-description { font-size: var(--launch-detail-size, var(--space-2xl)); }
  .roadmap-meta { gap: var(--space-lg); font-size: var(--launch-detail-size, var(--space-2xl)); }
}
