/* EXITFEED 2.1. One visual system;
   existing interaction foundations are retained. */
:root {
  --bg:#141619;
  --panel:#1c1f23;
  --panel-high:#25292e;
  --line:#ffffff18;
  --text:#f2f1ed;
  --muted:#b2b5ba;
  --accent:#ff795e;
  --font:Exitfeed,Arial,sans-serif;
  --heading:Manrope,Exitfeed,Arial,sans-serif}

body {
  background:var(--bg);
  font-size:15px;
  line-height:1.6}

body:before,body:after {
  display:none}

[hidden] {
  display:none!important}

h1,h2,h3 {
  font-family:var(--heading);
  color:var(--text);
  line-height:1.15;
  text-wrap:balance}

p {
  color:var(--muted)}

a,button {
  transition:background-color .18s,border-color .18s,color .18s}

:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:4px}

.eyebrow,.nav-label,.settings-kicker {
  font-size:12px;
  font-weight:700;
  letter-spacing:.12em;
  color:var(--muted)}

.button {
  font-size:14px;
  min-height:44px;
  padding:11px 18px;
  line-height:1.35;
  border-radius:7px;
  font-weight:650;
  gap:9px}

.button.primary {
  color:#171719;
  background:var(--accent);
  border-color:var(--accent);
  box-shadow:none}

.button.primary:hover {
  background:#ff927b;
  border-color:#ff927b}

.button.secondary {
  color:var(--text);
  border-color:#ffffff30;
  background:#ffffff04}

.button.secondary:hover {
  background:#ffffff0c;
  border-color:#ffffff55}

.button.quiet {
  color:var(--muted);
  background:transparent}

.button.small {
  min-height:40px;
  padding:9px 13px;
  font-size:13px}

.icon-button {
  min-height:44px;
  min-width:44px}
.icon {
  width:20px;
  height:20px}

.top-inner,.app-layout,#footer {
  width:100%;
  max-width:1600px;
  margin-inline:auto}

#header {
  background:#141619f5;
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line)}

.top-inner {
  height:76px;
  padding-inline:32px;
  gap:24px}

.wordmark {
  font-size:30px;
  letter-spacing:-1.6px;
  font-weight:800}
.brand-dot {
  background:var(--accent)}

.brand-note {
  font-size:12px;
  color:var(--muted);
  letter-spacing:.1em;
  max-width:112px}

#global-search {
  max-width:420px;
  background:#1c1f23;
  border:1px solid var(--line);
  border-radius:7px;
  height:44px}

#global-search input {
  font-size:14px}
.header-actions {
  gap:10px}

.app-layout {
  grid-template-columns:184px minmax(0,1fr);
  padding-inline:32px;
  gap:32px}

#sidebar {
  padding-right:22px;
  border-color:var(--line)}

.sidebar-inner {
  top:100px;
  padding-top:30px}

.nav-label {
  margin-bottom:12px}
.nav-link {
  font-size:14px;
  min-height:44px;
  padding:10px 12px;
  border-radius:6px;
  gap:12px;
  color:var(--muted)}

.nav-link.active {
  background:#ff795e10;
  color:var(--text);
  border-color:transparent}
.nav-indicator {
  background:var(--accent)}

.nav-link:hover,.lane:hover {
  background:#ffffff08;
  color:var(--text)}

.lane {
  font-size:13px;
  min-height:38px;
  padding:7px 12px}
.lane.active {
  color:var(--accent)}

.side-divider {
  margin-block:24px}
.side-note {
  background:none;
  border-left:2px solid var(--accent);
  border-radius:0;
  padding:0 0 0 14px;
  margin-block:26px}
.side-note p {
  font-size:13px;
  line-height:1.65}
.side-note a {
  font-size:13px}
.side-bottom {
  gap:5px}

#main {
  padding:30px 0 64px;
  min-width:0}

.page-heading {
  margin:0 0 30px;
  padding:0;
  max-width:none}

.page-heading h1,.member-welcome h1,.journal-heading h1 {
  font-size:clamp(30px,3.3vw,46px);
  font-weight:750;
  letter-spacing:-.045em;
  margin:10px 0 14px}

.page-heading p {
  font-size:16px;
  line-height:1.7;
  max-width:58ch;
  margin:0}

.release-banner {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  padding:12px 16px;
  margin:0 0 24px;
  background:#1c1f23;
  border:1px solid var(--line);
  border-radius:7px;
  gap:12px;
  font-size:13px;
  box-shadow:none}

.release-banner>span {
  color:var(--accent);
  font-size:12px;
  letter-spacing:.06em}
.release-banner strong {
  font-size:14px}
.release-banner a {
  margin-left:auto;
  font-size:13px;
  color:var(--text)}
.release-banner button {
  width:36px;
  height:36px;
  min-height:36px;
  color:var(--muted)}

.road-hero {
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.15fr);
  gap:36px;
  align-items:center;
  margin-bottom:32px}

.road-hero-copy {
  padding:18px 0}
.road-hero h1 {
  font-size:clamp(40px,4.3vw,66px);
  font-weight:800;
  letter-spacing:-.055em;
  margin:20px 0;
  line-height:1.05}

.road-hero p {
  font-size:16px;
  line-height:1.75;
  max-width:40ch;
  margin:0 0 26px}
.hero-buttons {
  display:flex;
  flex-wrap:wrap;
  gap:10px}

.road-sign {
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  border-top:1px solid var(--line);
  padding-top:20px;
  margin-top:30px;
  color:var(--muted);
  font-size:12px;
  letter-spacing:.06em;
  font-weight:600}

.road-hero-image {
  margin:0;
  position:relative;
  border-radius:9px;
  overflow:hidden;
  background:var(--panel)}

.road-hero-image img {
  display:block;
  width:100%;
  aspect-ratio:1.08;
  object-fit:cover;
  object-position:60% center}

.road-hero-image figcaption {
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  padding:13px 16px;
  font-size:12px;
  color:var(--muted)}
.road-hero-image figcaption a {
  color:var(--text)}

.member-welcome {
  grid-template-columns:minmax(0,1fr) 270px;
  gap:30px;
  padding:8px 0 28px;
  margin-bottom:26px}
.member-welcome h1 {
  margin-top:12px}
.member-welcome p {
  font-size:16px;
  margin-bottom:22px}
.welcome-garage {
  border-radius:9px;
  background:var(--panel);
  border-color:var(--line)}
.welcome-garage-label {
  padding:15px}
.welcome-garage-photo {
  height:98px}

.discovery-strip {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin:28px 0 36px}

.discovery-tile {
  min-height:100px;
  background:var(--panel)!important;
  border:1px solid var(--line);
  border-radius:8px;
  box-shadow:none;
  padding:18px 20px;
  position:relative;
  overflow:hidden}

.discovery-tile:before,.discovery-tile:after {
  display:none}
.discovery-tile span {
  font-size:12px;
  color:var(--muted);
  letter-spacing:.06em}
.discovery-tile strong {
  font-size:19px;
  letter-spacing:-.03em;
  margin-top:10px;
  color:var(--text)}
.discovery-tile .icon {
  color:var(--accent);
  width:18px;
  height:18px}
.discovery-tile:hover {
  border-color:#ff795e70;
  transform:none}

.section-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  margin:30px 0 20px}
.section-head h2 {
  font-size:21px;
  letter-spacing:-.03em;
  margin:0}
.section-head>span {
  font-size:12px;
  color:var(--muted)}

.live-point {
  background:var(--accent);
  box-shadow:none}

.feed-toolbar {
  margin-bottom:16px;
  border-bottom:1px solid var(--line);
  padding-bottom:16px;
  gap:16px}
.feed-tabs {
  gap:20px}
.feed-tabs a {
  font-size:14px;
  min-height:44px}
.feed-tabs a.selected {
  color:var(--text);
  border-color:var(--accent)}

.chips {
  gap:8px;
  margin-bottom:18px}
.chip {
  min-height:38px;
  font-size:13px;
  padding:8px 13px;
  border-radius:6px;
  background:#1c1f23;
  border-color:var(--line);
  color:var(--muted)}
.chip.selected {
  background:#ff795e15;
  color:#ff9d87;
  border-color:#ff795e55}

.feed-utilities {
  margin:0 0 20px}
.view-switch {
  border-radius:6px}
.view-switch button {
  font-size:12px;
  min-height:36px}
.view-switch button[aria-pressed=true] {
  background:#33373d;
  color:var(--text)}

.feed-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 210px;
  gap:24px}
.feed-aside {
  display:block}
.manifesto {
  padding:22px 18px;
  background:var(--panel);
  border-radius:8px;
  border:1px solid var(--line);
  position:sticky;
  top:100px}
.manifesto h3 {
  font-size:24px;
  line-height:1.2;
  letter-spacing:-.04em}
.manifesto p,.manifesto a {
  font-size:13px;
  line-height:1.75}
.manifesto .eyebrow {
  font-size:12px}

.posts-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:22px}
.post-card {
  border:1px solid var(--line);
  background:var(--panel);
  border-radius:9px;
  box-shadow:none;
  min-width:0}
.post-head {
  padding:14px 16px;
  gap:10px}
.post-head strong {
  font-size:14px}
.post-head small {
  font-size:12px}
.post-photo {
  aspect-ratio:4/3}
.post-photo img {
  object-fit:cover}
.post-car {
  padding:16px 18px 0}
.post-car h2 {
  font-size:21px;
  letter-spacing:-.035em}
.post-car span {
  font-size:12px}
.post-actions {
  padding:10px 14px 6px}
.post-actions .icon-button {
  font-size:13px}
.caption {
  font-size:14px;
  line-height:1.7;
  padding-inline:18px}
.caption strong {
  font-size:14px}
.caption-more {
  font-size:13px;
  margin-left:18px}
.post-style {
  font-size:12px}
.post-footer {
  font-size:13px}

html[data-feed-view=large] .posts-grid {
  max-width:820px;
  grid-template-columns:minmax(0,1fr)}

.empty-state {
  background:#1c1f23;
  border:1px dashed #ffffff26;
  border-radius:9px;
  padding:48px 24px;
  margin:0;
  min-height:220px}
.empty-state h2,.empty-state h3 {
  font-size:24px;
  letter-spacing:-.03em}
.empty-state p {
  font-size:15px;
  max-width:44ch;
  line-height:1.7}
.empty-state>.icon {
  width:32px;
  height:32px;
  color:var(--accent);
  margin-bottom:14px}
.empty-state .button {
  margin-top:10px}

.photo-heading {
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  column-gap:36px;
  align-content:center;
  position:relative;
  min-height:200px;
  padding:24px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--panel)}
.photo-heading>.eyebrow,.photo-heading>h1,.photo-heading>p {
  grid-column:1}
.photo-heading h1 {
  font-size:36px}
.photo-heading p {
  font-size:15px}
.page-heading-image {
  grid-column:2;
  grid-row:1/4;
  position:relative;
  margin:0;
  align-self:stretch;
  overflow:hidden;
  border-radius:6px;
  min-height:160px}
.page-heading-image img {
  position:absolute;
  width:100%;
  height:100%;
  object-fit:cover}
.page-heading-image figcaption {
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  background:#141619d9;
  padding:8px 12px;
  font-size:12px}

.search-wide {
  margin:24px 0;
  background:var(--panel);
  border-radius:7px;
  padding:10px 14px;
  gap:12px}
.search-wide input {
  font-size:15px}
.active-filters {
  gap:8px}
.active-filters span {
  font-size:13px;
  background:#ff795e15}

.member-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px}
.member-card {
  padding:24px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:9px}
.member-card h3 {
  font-size:20px}
.member-card .member-bio {
  font-size:14px;
  line-height:1.7;
  min-height:48px}
.member-card-bottom {
  border-color:var(--line);
  gap:12px;
  flex-wrap:wrap}
.member-card-bottom>span {
  font-size:13px}

.garage-header {
  background:var(--panel);
  border-radius:9px;
  border-color:var(--line);
  overflow:hidden}
.garage-cover {
  height:clamp(150px,18vw,250px)}
.garage-cover img {
  opacity:1;
  object-position:center 55%}
.garage-cover:after {
  background:linear-gradient(180deg,#0008,transparent 60%)}
.garage-cover .eyebrow {
  font-size:12px;
  top:20px;
  left:24px;
  color:#fff;
  max-width:calc(100% - 48px);
  overflow-wrap:anywhere}

.garage-body {
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  gap:20px;
  padding:0 24px 26px}
.avatar.garage-avatar {
  width:88px;
  height:88px;
  border:5px solid var(--panel);
  margin-top:-28px;
  font-size:26px}
.garage-info {
  padding-top:22px;
  min-width:0}
.garage-title {
  gap:12px;
  flex-wrap:wrap}
.garage-info h1 {
  font-size:30px;
  letter-spacing:-.045em;
  font-weight:750;
  overflow-wrap:anywhere}
.garage-handle {
  font-size:14px;
  margin-bottom:14px}
.garage-info>p:not(.garage-handle) {
  font-size:15px;
  max-width:60ch;
  line-height:1.7}
.garage-stats {
  gap:24px;
  flex-wrap:wrap;
  margin-top:22px;
  font-size:13px}
.garage-stats span {
  display:flex;
  flex-direction:column;
  gap:2px}
.garage-stats strong {
  font-size:21px;
  font-weight:700;
  margin:0}
.garage-controls {
  grid-column:2;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-start;
  padding:0;
  margin-top:4px;
  gap:10px}
.garage-controls .button {
  font-size:14px}
.garage-title .rank-tag {
  flex-shrink:0}

.garage-collection {
  padding:0;
  margin:34px 0;
  background:transparent;
  border:0}
.garage-collection-head {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:18px}
.garage-collection-head .section-head {
  margin:0}
.garage-collection-head h2 {
  font-size:21px}
.garage-collection-actions {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:16px;
  position:static}
.vehicle-count {
  font-size:12px;
  color:var(--muted);
  position:static;
  white-space:nowrap}
.garage-collection .add-vehicle {
  position:static;
  font-size:14px;
  min-height:44px}
.vehicle-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:20px}
.vehicle-card {
  background:var(--panel);
  border-color:var(--line);
  border-radius:9px}
.vehicle-card.featured {
  border-color:#ff795e55}
.vehicle-cover {
  aspect-ratio:16/10}
.vehicle-copy {
  padding:18px}
.vehicle-copy h3 {
  font-size:21px;
  letter-spacing:-.03em}
.vehicle-copy>span,.vehicle-specs b {
  font-size:12px}
.vehicle-specs {
  gap:8px}
.vehicle-empty {
  padding:30px;
  background:var(--panel);
  border:1px dashed var(--line);
  border-radius:8px}
.vehicle-empty h3 {
  font-size:20px}
.vehicle-empty p {
  font-size:14px}
.featured-mark {
  background:var(--accent);
  color:#151719}

.rank-tag {
  font-size:12px;
  min-height:27px;
  border-radius:5px;
  padding:4px 8px;
  gap:5px}
.rank-tag .icon {
  width:15px;
  height:15px}
.rank-tag-member {
  background:#ffffff07;
  color:#c8cbd0}
.rank-tag-admin {
  background:#ff795e15;
  color:#ffb5a5;
  border-color:#ff795e45}

.post-page {
  max-width:1100px}
.detail-layout {
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--panel)}
.detail-copy {
  padding:24px}
.detail-copy h1 {
  font-size:28px;
  letter-spacing:-.04em}
.comment {
  font-size:14px}
.comment p {
  color:var(--text)}

.settings-quick {
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:0 0 28px}
.workspace-layout {
  display:grid;
  grid-template-columns:188px minmax(0,1fr);
  gap:28px;
  align-items:start;
  max-width:1080px}
.workspace-nav {
  display:flex;
  flex-direction:column;
  gap:5px;
  position:sticky;
  top:100px;
  padding:8px;
  border:1px solid var(--line);
  background:var(--panel);
  border-radius:8px}
.workspace-nav button {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:12px;
  min-height:46px;
  font-size:14px;
  text-align:left;
  border-radius:5px;
  color:var(--muted);
  background:transparent}
.workspace-nav button>span {
  display:flex}
.workspace-nav button .icon {
  width:16px;
  height:16px;
  opacity:0}
.workspace-nav button[aria-selected=true] {
  background:#ff795e15;
  color:var(--text)}
.workspace-nav button[aria-selected=true] .icon {
  opacity:1;
  color:var(--accent)}
.workspace-nav button:hover {
  background:#ffffff08}
.workspace-body {
  min-width:0}
.workspace-panel {
  display:flex;
  flex-direction:column;
  gap:22px;
  outline:none}
.settings-card {
  display:flex;
  flex-direction:column;
  gap:20px;
  padding:28px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:9px;
  margin:0;
  min-width:0}
.settings-card h2 {
  font-size:23px;
  letter-spacing:-.035em;
  margin:0}
.settings-card h3 {
  font-size:18px;
  margin:0}
.settings-card p {
  font-size:15px;
  line-height:1.7;
  margin:0}
.settings-card-heading {
  gap:20px;
  align-items:center}
.settings-card-heading h2 {
  margin-top:7px}
.settings-card .button {
  align-self:flex-start}
.settings-avatar {
  margin:0;
  gap:16px}
.settings-avatar strong {
  font-size:20px}
.settings-avatar p {
  margin-top:6px}
.settings-subsection {
  margin:4px 0 0;
  padding-top:24px;
  gap:18px;
  border-top:1px solid var(--line)}
.settings-subsection>p {
  margin-top:12px}
.settings-subsection>.form-stack {
  margin-top:20px}
.settings-card.danger {
  border-color:#ec716345}
.settings-card .form-note {
  font-size:13px}
.profile-image-forms {
  gap:24px;
  padding-top:24px;
  border-color:var(--line)}

.form-stack {
  display:flex;
  flex-direction:column;
  gap:20px}
.form-stack label,.form-row label {
  font-size:14px;
  line-height:1.5;
  display:flex;
  flex-direction:column;
  gap:8px;
  font-weight:600;
  color:var(--text)}
input,select,textarea {
  font-size:16px!important;
  line-height:1.45;
  border:1px solid #ffffff26;
  background:#141619;
  color:var(--text);
  border-radius:6px;
  padding:12px 14px;
  min-height:46px}
input:focus,select:focus,textarea:focus {
  border-color:var(--accent);
  box-shadow:none}
.form-row {
  gap:18px}
.form-error:empty {
  display:none}
.form-note {
  font-size:13px;
  line-height:1.7}
.checkbox-row {
  flex-direction:row!important;
  gap:12px!important;
  align-items:flex-start}
.checkbox-row input {
  min-height:0;
  flex-shrink:0;
  margin-top:5px}
input[type=file] {
  font-size:14px!important;
  max-width:100%;
  padding:10px}
.password-toggle {
  min-height:44px;
  min-width:44px;
  color:var(--muted)}

.session-row {
  padding:18px 0;
  gap:20px;
  border-color:var(--line)}
.session-row strong {
  font-size:15px}
.session-row small {
  font-size:13px;
  line-height:1.6;
  display:block;
  margin-top:6px}
.status-chip {
  font-size:12px}
.account-email {
  overflow-wrap:anywhere;
  color:var(--text)!important}

.control-overview {
  display:flex;
  flex-direction:column;
  gap:24px}
.control-intro {
  padding:30px;
  background:var(--panel);
  border-radius:9px;
  border:1px solid var(--line)}
.control-intro h2 {
  font-size:28px;
  letter-spacing:-.04em;
  margin:14px 0}
.control-intro p {
  font-size:15px;
  line-height:1.7;
  margin:0 0 24px;
  max-width:60ch}
.admin-stats {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin:0}
.admin-stats>div {
  padding:24px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:8px}
.admin-stats strong {
  font-size:32px;
  letter-spacing:-.03em}
.admin-stats span {
  font-size:13px;
  text-transform:capitalize;
  color:var(--muted)}
.admin-section {
  margin:0}
.report-row {
  padding:22px 0;
  gap:18px;
  display:flex;
  flex-wrap:wrap;
  border-color:var(--line)}
.report-row strong {
  font-size:16px}
.report-row p {
  margin:10px 0;
  white-space:pre-wrap;
  overflow-wrap:anywhere}
.report-row small {
  font-size:13px;
  overflow-wrap:anywhere}
.report-actions {
  display:flex;
  gap:8px;
  flex-wrap:wrap}
.admin-users>div {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px;
  padding:18px 0}
.admin-users>div>span {
  flex:1;
  min-width:140px;
  overflow-wrap:anywhere;
  font-size:15px}
.admin-users small {
  font-size:13px;
  display:block;
  margin-top:4px}
.member-filter {
  display:flex;
  flex-direction:column;
  gap:8px;
  font-size:14px;
  font-weight:600}
.decision-history article {
  padding:20px 0;
  border-bottom:1px solid var(--line)}
.decision-history p {
  margin:10px 0}
.decision-history small {
  font-size:13px}
.operation-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px}
.operation-grid article {
  background:#141619;
  border:1px solid var(--line);
  padding:20px;
  border-radius:7px;
  min-width:0}
.operation-grid h3 {
  font-size:15px;
  line-height:1.5;
  margin-bottom:10px}
.operation-grid strong {
  font-size:17px;
  overflow-wrap:anywhere}
.operation-grid small {
  font-size:13px;
  line-height:1.7;
  overflow-wrap:anywhere}

.content-page {
  max-width:1060px;
  margin:0}
.content-page .page-heading {
  padding:8px 0 28px;
  border-bottom:1px solid var(--line)}
.document-layout {
  display:grid;
  grid-template-columns:200px minmax(0,1fr);
  gap:38px;
  margin:28px 0 36px}
.document-layout:not(:has(.document-nav)) {
  grid-template-columns:minmax(0,1fr)}
.document-nav {
  display:flex;
  flex-direction:column;
  gap:12px;
  position:sticky;
  top:100px;
  align-self:start;
  padding-right:20px}
.document-nav a {
  color:var(--muted);
  font-size:13px;
  line-height:1.6;
  padding-block:4px}
.document-nav a:hover {
  color:var(--accent)}
.prose {
  max-width:68ch;
  padding:0;
  font-size:16px;
  line-height:1.8}
.prose p {
  color:#c7c9cc;
  margin:0 0 22px;
  font-size:16px;
  line-height:1.8}
.prose h2 {
  font-size:24px;
  letter-spacing:-.03em;
  margin:36px 0 16px;
  scroll-margin-top:100px}
.prose h2:first-child {
  margin-top:0}
.prose a {
  color:#ff9d87;
  text-decoration:underline;
  text-underline-offset:3px}
.credit-images {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin:24px 0}
.credit-images figure {
  margin:0}
.credit-images img {
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  border-radius:7px}
.credit-images figcaption {
  font-size:13px;
  color:var(--muted);
  margin-top:8px}
.contact-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 270px;
  gap:32px;
  margin-top:28px}
.contact-layout>form {
  padding:28px;
  border:1px solid var(--line);
  background:var(--panel);
  border-radius:9px}
.contact-layout aside {
  padding:24px;
  background:var(--panel);
  border-top:2px solid var(--accent);
  border-radius:7px;
  align-self:start}
.contact-layout h2 {
  font-size:23px;
  letter-spacing:-.04em;
  margin:16px 0}
.contact-layout p {
  font-size:14px;
  line-height:1.8}
.contact-layout a {
  font-size:14px;
  color:var(--accent)}

.activity-list {
  max-width:900px}
.activity-item {
  padding:20px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:8px;
  margin-bottom:12px;
  gap:16px;
  font-size:15px}
.activity-item small {
  font-size:13px;
  margin-top:7px}

.journal-heading,.new-release,.release-archive {
  max-width:1040px;
  margin-inline:auto}
.journal-heading {
  padding:12px 0 8px}
.new-release {
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:9px;
  overflow:hidden}
.new-release>figure {
  margin:0;
  position:relative}
.new-release>figure>img {
  display:block;
  width:100%;
  aspect-ratio:2.7;
  object-fit:cover;
  object-position:center 60%}
.new-release figcaption {
  position:absolute;
  bottom:12px;
  right:16px;
  background:#141619df;
  padding:6px 10px;
  border-radius:4px;
  font-size:12px}
.new-release-intro {
  padding:32px 36px 12px;
  max-width:78ch}
.new-release-intro h2 {
  font-size:36px;
  letter-spacing:-.045em;
  margin:16px 0}
.new-release-intro p {
  font-size:16px;
  line-height:1.8}
.release-changes {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  padding:12px 36px 28px;
  gap:0 32px}
.release-changes article {
  display:flex;
  gap:18px;
  padding:24px 0;
  border-top:1px solid var(--line)}
.release-changes article>span {
  color:var(--accent);
  font-size:13px;
  font-weight:700}
.release-changes h3 {
  font-size:20px;
  letter-spacing:-.03em;
  margin:0 0 12px}
.release-changes p {
  font-size:14px;
  line-height:1.75;
  margin:0}
.release-next {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  padding:0 36px 32px}
.release-archive {
  margin-top:36px}
.release-archive article,.archive-entry {
  display:flex;
  align-items:center;
  gap:24px;
  padding:24px 0;
  border-bottom:1px solid var(--line);
  background:none;
  grid-template-columns:none}
.archive-entry>div,.release-archive article>div {
  flex:1;
  min-width:0}
.archive-entry h3,.release-archive h3 {
  font-size:21px;
  margin:0 0 8px}
.archive-entry p,.release-archive p {
  font-size:14px;
  margin:0}
.archive-entry>span,.release-archive time {
  font-size:13px;
  color:var(--muted)}
.archive-entry>span:first-child,.release-archive article>span:first-child {
  color:var(--accent);
  font-weight:700}

.big-one {
  max-width:1040px}
.big-one-cover {
  height:380px;
  border-radius:9px}
.big-one-cover h1 {
  font-size:clamp(46px,6vw,84px);
  margin:16px 0 22px;
  letter-spacing:-.04em}
.big-one-cover p {
  font-size:16px;
  max-width:47ch;
  line-height:1.7}
.big-one-cover>strong {
  font-size:100px;
  color:#fff5}
.big-one-intro {
  padding:32px 24px;
  gap:32px}
.big-one-intro .lead {
  font-size:19px;
  line-height:1.8}
.release-facts strong {
  font-size:28px}
.release-facts span {
  font-size:13px}
.feature-manifest {
  padding:0 24px}
.feature-manifest article {
  padding:26px 0;
  gap:24px}
.feature-manifest h2 {
  font-size:24px}
.feature-manifest p {
  font-size:15px;
  line-height:1.8}
.release-note {
  width:calc(100% - 48px);
  max-width:960px;
  min-height:0;
  margin:28px auto 0;
  padding:36px;
  border-radius:9px;
  background:#1c1f23;
  display:block}
.release-note:before {
  background-image:linear-gradient(90deg,#141619f5,#141619bd),url('/assets/detail.webp');
  opacity:1}
.release-note>.release-note-copy {
  position:relative;
  display:block;
  max-width:66ch}
.release-note h2 {
  font-size:28px;
  max-width:25ch;
  color:#fff;
  margin:16px 0 22px}
.release-note p {
  font-size:15px;
  line-height:1.8;
  color:#e6e0d8;
  margin:0 0 28px}
.release-note-actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px}
.release-note-actions .button {
  min-height:44px;
  max-height:52px}
.release-note-mark {
  display:none}

#footer {
  padding:36px 32px 28px;
  border-top:1px solid var(--line)}
.footer-main {
  gap:30px}
.footer-main .wordmark {
  font-size:27px}
.footer-main p {
  font-size:14px}
.footer-links {
  gap:16px;
  flex-wrap:wrap}
.footer-links a {
  font-size:13px}
.footer-sign {
  font-size:12px}
.footer-small {
  font-size:12px;
  line-height:1.8;
  gap:16px}

.modal {
  border-radius:10px;
  border-color:#ffffff26;
  background:#1c1f23}
.modal h2 {
  font-size:28px}
.modal-intro {
  font-size:15px;
  line-height:1.7}
.modal-overlay {
  z-index:100;
  backdrop-filter:blur(6px)}
.sheet-avatar {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  text-align:center;
  line-height:1;
  flex-shrink:0}
.action-sheet {
  max-height:calc(100dvh - 32px);
  overflow:auto}
.sheet-identity {
  align-items:center;
  gap:16px}
.sheet-identity strong {
  font-size:20px}
.sheet-identity small {
  font-size:14px}
.action-list button {
  min-height:54px;
  font-size:15px}

@media(min-width:1700px) {
  .app-layout {
  gap:40px}
.road-hero {
  gap:44px}
.posts-grid {
  gap:26px}
}

@media(max-width:1200px) {
  .app-layout {
  grid-template-columns:164px minmax(0,1fr);
  gap:24px;
  padding-inline:24px}
.top-inner {
  padding-inline:24px;
  gap:18px}
.brand-note {
  display:none}
.feed-layout {
  grid-template-columns:minmax(0,1fr)}
.feed-aside {
  display:none}
.road-hero {
  gap:24px}
.road-hero h1 {
  font-size:50px}
.hero-buttons .button {
  padding-inline:14px}
.member-grid {
  grid-template-columns:repeat(2,minmax(0,1fr))}
.vehicle-grid {
  grid-template-columns:repeat(2,minmax(0,1fr))}
.workspace-layout {
  grid-template-columns:166px minmax(0,1fr);
  gap:22px}
.photo-heading {
  grid-template-columns:minmax(0,1fr) 260px}
}

@media(max-width:960px) {
  .app-layout {
  display:block;
  padding-inline:24px}
#sidebar {
  display:none}
.top-inner {
  height:68px}
.header-actions .button.primary,.header-actions>[data-action=activity] {
  display:none}
.mobile-search-button,.mobile-menu-button {
  display:inline-flex}
#global-search {
  display:none}
.header-actions {
  margin-left:auto}
.road-hero h1 {
  font-size:52px}
.road-hero-image img {
  aspect-ratio:1.15}
#mobile-nav {
  display:flex;
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  background:#1c1f23f8;
  backdrop-filter:blur(12px);
  padding:8px 12px calc(8px + env(safe-area-inset-bottom));
  border-top:1px solid var(--line);
  z-index:40;
  justify-content:space-around;
  gap:5px}
#mobile-nav a,#mobile-nav button {
  min-height:48px;
  font-size:12px;
  gap:5px;
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:var(--muted)}
#mobile-nav .active {
  color:var(--accent)}
#mobile-nav .icon {
  width:21px;
  height:21px}
#footer {
  padding-bottom:108px}
.footer-sign {
  display:none}
.footer-main {
  flex-wrap:wrap}
.footer-links {
  justify-content:flex-start}
.contact-layout {
  grid-template-columns:minmax(0,1fr) 240px}
}

@media(max-width:640px) {
  body {
  font-size:15px}
.top-inner {
  padding-inline:18px;
  gap:12px;
  height:64px}
.wordmark {
  font-size:28px}
.header-actions {
  gap:3px}
.header-actions .profile-link .avatar {
  width:34px;
  height:34px}
.header-actions>.button.quiet {
  font-size:13px;
  padding:10px 7px}
.header-actions .icon-button {
  min-width:40px}
.app-layout {
  padding-inline:18px}
#main {
  padding-top:22px;
  padding-bottom:42px}
.release-banner {
  padding:10px 12px;
  gap:6px 10px;
  margin-bottom:24px}
.release-banner>strong {
  font-size:13px}
.release-banner>a {
  margin-left:0;
  flex:1;
  font-size:12px}
.release-banner>button {
  margin-left:auto}
.road-hero {
  grid-template-columns:minmax(0,1fr);
  gap:26px;
  margin-bottom:26px}
.road-hero-copy {
  padding:0}
.road-hero h1 {
  font-size:46px;
  margin:16px 0 18px}
.road-hero p {
  font-size:15px;
  max-width:42ch;
  line-height:1.75;
  margin-bottom:24px}
.road-sign {
  margin-top:24px;
  padding-top:18px;
  font-size:12px;
  gap:14px}
.road-hero-image img {
  aspect-ratio:1.6;
  object-position:center}
.road-hero-image figcaption {
  font-size:12px;
  padding:11px 12px}
.hero-buttons {
  gap:10px}
.hero-buttons .button {
  font-size:13px;
  padding-inline:14px}
.discovery-strip {
  grid-template-columns:minmax(0,1fr);
  gap:10px;
  margin:26px 0}
.discovery-tile {
  min-height:76px;
  padding:15px 18px}
.discovery-tile strong {
  font-size:18px;
  margin-top:7px}
.discovery-tile span {
  font-size:12px}
.section-head {
  margin:26px 0 16px;
  gap:8px}
.section-head h2 {
  font-size:20px}
.section-head>span {
  font-size:12px}
.feed-toolbar {
  gap:10px;
  padding-bottom:12px}
.feed-tabs {
  gap:18px;
  max-width:100%;
  overflow:auto}
.feed-tabs a {
  white-space:nowrap}
.chips {
  gap:7px;
  margin-bottom:16px}
.chip {
  font-size:12px;
  min-height:36px;
  padding:7px 11px}
.posts-grid {
  grid-template-columns:minmax(0,1fr);
  gap:20px}
.post-photo {
  aspect-ratio:4/3}
.post-car h2 {
  font-size:22px}
.post-head {
  padding:13px 14px}
.caption {
  font-size:15px}
.feed-utilities {
  gap:12px}
.view-switch button {
  padding:8px;
  gap:5px}
.member-welcome {
  grid-template-columns:minmax(0,1fr);
  gap:22px;
  margin:0 0 24px;
  padding:0 0 26px}
.member-welcome h1 {
  font-size:34px}
.member-welcome p {
  font-size:15px}
.welcome-garage {
  display:flex;
  align-items:stretch}
.welcome-garage-photo {
  width:86px;
  height:auto;
  min-height:80px;
  flex:none}
.welcome-garage-label {
  flex:1;
  min-width:0;
  padding:14px;
  gap:10px}
.welcome-garage-label .avatar {
  width:34px;
  height:34px}
.welcome-garage-label strong {
  font-size:13px}
.welcome-actions .button {
  font-size:13px;
  padding-inline:14px}
.page-heading h1,.journal-heading h1 {
  font-size:32px;
  margin-bottom:14px}
.page-heading p {
  font-size:15px}
.photo-heading {
  display:block;
  padding:22px}
.photo-heading h1 {
  font-size:32px}
.page-heading-image {
  margin-top:22px;
  height:150px;
  min-height:0}
.photo-heading p {
  max-width:40ch}
.search-wide {
  flex-wrap:wrap;
  gap:10px;
  padding:12px;
  margin-block:22px}
.search-wide>input {
  flex:1;
  min-width:150px}
.advanced-search .button {
  flex:1}
.member-grid {
  grid-template-columns:minmax(0,1fr);
  gap:16px}
.member-card {
  padding:22px}
.garage-cover {
  height:155px}
.garage-cover .eyebrow {
  top:16px;
  left:18px;
  max-width:calc(100% - 36px);
  line-height:1.6}
.garage-body {
  grid-template-columns:64px minmax(0,1fr);
  gap:16px;
  padding:0 18px 22px}
.avatar.garage-avatar {
  width:64px;
  height:64px;
  border-width:4px;
  margin-top:-20px;
  font-size:22px}
.garage-info {
  padding-top:18px}
.garage-info h1 {
  font-size:26px;
  line-height:1.2}
.garage-title {
  gap:8px}
.garage-handle {
  font-size:13px;
  margin-top:7px}
.garage-info>p:not(.garage-handle) {
  font-size:14px;
  line-height:1.75}
.garage-stats {
  gap:18px 22px;
  margin-top:18px}
.garage-stats strong {
  font-size:20px}
.garage-stats span {
  font-size:12px}
.garage-controls {
  grid-column:1/-1;
  margin-top:6px;
  gap:10px}
.garage-controls-public {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.garage-controls-public .button {
  padding-inline:10px;
  font-size:13px}
.garage-controls .garage-menu .icon {
  width:18px;
  height:18px}
.garage-collection {
  margin:28px 0}
.garage-collection-head {
  gap:16px}
.garage-collection-head h2 {
  font-size:20px}
.garage-collection-actions {
  gap:16px;
  justify-content:space-between;
  width:100%}
.vehicle-grid {
  grid-template-columns:minmax(0,1fr);
  gap:18px}
.vehicle-cover {
  aspect-ratio:16/9}
.vehicle-empty {
  padding:24px}
.settings-quick {
  margin-bottom:24px}
.workspace-layout {
  display:block}
.workspace-nav {
  flex-direction:row;
  position:static;
  overflow-x:auto;
  padding:5px;
  gap:4px;
  margin-bottom:22px;
  border-radius:7px;
  scrollbar-width:thin}
.workspace-nav button {
  flex:none;
  padding:11px 14px;
  min-height:44px;
  font-size:13px;
  white-space:nowrap}
.workspace-nav button>span {
  display:none}
.workspace-panel {
  gap:20px}
.settings-card {
  padding:22px;
  gap:20px}
.settings-card h2 {
  font-size:22px}
.settings-card p {
  font-size:14px}
.settings-avatar strong {
  font-size:18px}
.settings-card-heading {
  gap:14px;
  flex-wrap:wrap}
.settings-avatar {
  gap:14px}
.settings-avatar .avatar.large {
  width:60px;
  height:60px}
.profile-image-forms {
  grid-template-columns:minmax(0,1fr);
  gap:22px}
.form-row {
  display:flex;
  flex-direction:column;
  gap:20px}
.form-stack {
  gap:20px}
.session-row {
  display:flex;
  flex-wrap:wrap;
  padding:16px 0;
  gap:14px}
.session-row .button {
  min-height:40px;
  padding:9px 13px}
.control-intro {
  padding:24px}
.control-intro h2 {
  font-size:26px}
.control-intro p {
  font-size:14px}
.admin-stats {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px}
.admin-stats>div {
  padding:20px}
.admin-stats strong {
  font-size:28px}
.admin-users>div>.button {
  font-size:12px}
.operation-grid {
  grid-template-columns:minmax(0,1fr)}
.document-layout {
  display:block;
  margin:24px 0}
.document-nav {
  position:static;
  display:flex;
  flex-wrap:wrap;
  flex-direction:row;
  gap:8px 18px;
  margin:0 0 28px;
  padding:0 0 20px;
  border-bottom:1px solid var(--line)}
.document-nav .eyebrow {
  width:100%}
.document-nav a {
  font-size:13px}
.content-page .page-heading {
  padding-bottom:24px}
.prose,.prose p {
  font-size:15px;
  line-height:1.85}
.prose h2 {
  font-size:22px;
  margin-top:30px}
.credit-images {
  grid-template-columns:minmax(0,1fr);
  gap:20px}
.contact-layout {
  grid-template-columns:minmax(0,1fr);
  gap:24px}
.contact-layout>form {
  padding:22px}
.contact-layout aside {
  padding:22px}
.new-release>figure>img {
  aspect-ratio:1.65}
.new-release-intro {
  padding:24px 22px 8px}
.new-release-intro h2 {
  font-size:30px}
.new-release-intro p {
  font-size:15px}
.release-changes {
  grid-template-columns:minmax(0,1fr);
  padding:8px 22px 20px}
.release-changes article {
  gap:14px;
  padding:22px 0}
.release-changes h3 {
  font-size:20px}
.release-changes p {
  font-size:14px}
.release-next {
  padding:0 22px 26px;
  gap:10px}
.archive-entry,.release-archive article {
  flex-wrap:wrap;
  gap:16px}
.archive-entry>span:last-child,.release-archive time {
  width:100%;
  padding-left:46px}
.release-archive h3 {
  font-size:20px}
.big-one-cover {
  height:345px}
.big-one-cover>div {
  padding:24px}
.big-one-cover h1 {
  font-size:58px}
.big-one-cover p {
  font-size:14px;
  line-height:1.8}
.big-one-cover>strong {
  display:none}
.big-one-intro {
  padding:26px 4px;
  display:block}
.big-one-intro .lead {
  font-size:17px}
.release-facts {
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  margin-top:24px}
.feature-manifest {
  padding:0 4px}
.feature-manifest article {
  gap:16px;
  padding:24px 0}
.feature-manifest h2 {
  font-size:22px}
.feature-manifest p {
  font-size:14px}
.release-note {
  width:100%;
  padding:26px 22px;
  margin-top:24px}
.release-note h2 {
  font-size:26px;
  line-height:1.2}
.release-note p {
  font-size:14px;
  line-height:1.8}
.release-note-actions {
  gap:10px}
.release-note-actions .button {
  font-size:13px;
  padding-inline:14px}
.detail-copy {
  padding:22px}
.detail-copy h1 {
  font-size:26px}
.modal h2 {
  font-size:25px}
.modal-intro {
  font-size:14px}
.action-sheet {
  max-height:calc(100dvh - 16px);
  border-radius:14px 14px 0 0;
  margin:0;
  width:100%}
.modal-overlay:has(.action-sheet) {
  padding:0;
  align-items:flex-end}
.footer-main {
  display:block}
.footer-links {
  margin:24px 0;
  gap:14px 18px}
.footer-small {
  display:flex;
  flex-direction:column;
  gap:12px}
#footer {
  padding-inline:18px}
.activity-item {
  padding:18px;
  font-size:14px}
.activity-item .avatar {
  flex-shrink:0}
}

@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
  animation:none!important;
  transition:none!important;
  scroll-behavior:auto!important}
}

/* Keep signed-in feeds focused on the captures and remove inherited mobile spans. */
.member-welcome~.discovery-strip {
  display:none}

.big-one-cover {
  min-height:380px;
  padding:36px}
.big-one-cover h1 {
  line-height:.92}

.release-note>.release-note-copy>.release-note-actions {
  flex-direction:row;
  align-items:center;
  margin-top:0}

@media(max-width:800px) {
  .garage-stats {
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0}
.garage-stats span {
  padding-inline:6px;
  border-right:1px solid var(--line)}
.garage-stats span:last-child {
  border-right:0}
.garage-info {
  display:contents}
.garage-title {
  padding-top:14px}
.garage-bio {
  margin-top:0}
.garage-body {
  row-gap:22px}
.garage-collection-head {
  align-items:flex-start}
.garage-collection-head .section-head {
  justify-content:flex-start}
.garage-collection-actions {
  flex-direction:row;
  align-items:center}
.garage-collection .add-vehicle {
  width:auto}
.garage-controls-own {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr))}
.garage-controls-own>.button {
  grid-column:auto;
  grid-row:auto}
.garage-controls-public .garage-menu span {
  position:static;
  width:auto;
  height:auto;
  overflow:visible;
  clip-path:none}
.garage-controls-public .garage-menu {
  padding:11px 10px}
}

@media(max-width:640px) {
  .release-banner {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) 32px;
  gap:6px 10px}
.release-banner>span {
  grid-column:1;
  grid-row:1}
.release-banner>strong {
  grid-column:2;
  grid-row:1}
.release-banner>button {
  grid-column:3;
  grid-row:1/3}
.release-banner>a {
  grid-column:1/3;
  grid-row:2;
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap}
.release-banner>a .icon {
  width:16px;
  height:16px}
.garage-stats {
  font-size:12px;
  padding-block:14px;
  gap:0}
.garage-stats strong {
  font-size:20px}
.garage-stats span {
  font-size:12px;
  padding-inline:5px}
.garage-collection-head .section-head {
  width:100%}
.garage-collection-actions {
  gap:12px}
.garage-collection .add-vehicle {
  padding-inline:13px;
  min-height:42px}
.garage-controls-own .button {
  font-size:13px;
  padding-inline:10px}
.big-one-cover {
  min-height:345px;
  padding:24px}
.big-one-cover>div {
  padding:0}
.release-note>.release-note-copy>.release-note-actions {
  gap:10px;
  flex-direction:row}
.release-note-actions .button {
  width:auto}
}

.admin-users>div>.rank-tag {
  flex:0 0 auto;
  min-width:0;
  width:auto}

.chip.active {
  background:#ff795e15;
  color:#ff9d87;
  border-color:#ff795e55}

@media(max-width:640px) {
  .road-hero .hero-buttons {
  flex-direction:row;
  align-items:center}
.road-hero .hero-buttons .button {
  font-size:13px;
  padding-inline:12px}
}

/* Explicit image heights override HTML dimension hints while retaining reserved aspect ratios. */
.road-hero-image img,.new-release>figure>img {
  height:auto}

@media(max-width:640px) {
  .workspace-nav {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  overflow:visible}
.workspace-nav button {
  justify-content:center;
  padding:11px 6px;
  min-width:0}
}

@media(min-width:641px){.road-hero-image img{aspect-ratio:1.35;max-height:520px}}
/* 2.1.2: The gallery follows its content, independently of the conversation. */
.detail-layout {
  align-items: start;
  gap: 24px;
  border: 0;
  background: transparent;
  overflow: visible;
}
.detail-media {
  align-self: start;
  border: 1px solid var(--line);
  border-radius: 9px;
  overflow: hidden;
  background: var(--panel);
}
.detail-media .detail-image {
  display: block;
  aspect-ratio: auto;
  height: auto;
  min-height: 0;
  max-height: none;
}
.detail-media .detail-image > img {
  display: block;
  width: 100%;
  height: auto;
  max-height: min(76dvh, 760px);
  object-fit: contain;
}
.detail-copy {
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--panel);
}
.detail-media .photo-thumbs {
  padding: 12px;
  gap: 10px;
  border-top: 1px solid var(--line);
}
.detail-media .photo-controls {
  bottom: 12px;
  left: 12px;
  right: 12px;
}
.detail-media .photo-controls button {
  min-width: 44px;
  min-height: 44px;
}
@media(max-width:800px) {
  .detail-layout { gap: 20px; }
  .detail-media .detail-image > img { max-height: 70dvh; }
}