:root {
  --bg: #09090D;
  --panel: #14141B;
  --panel-2: #1D1D27;
  --text: #F7F7FA;
  --muted: #9999AA;
  --pink: #F33FA9;
  --accent-hover: #FF70C3;
  --line: #292933;
  --line-strong: #484854;
  --cyan: var(--pink); /* Legacy accent alias during the staged frontend migration. */
  --danger: #FF8B95;
  --red: var(--danger);
  --control-border: #666676;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-12: 48px; --space-16: 64px;
  --radius-sm: 6px; --radius-md: 10px; --radius-lg: 14px; --radius-pill: 999px;
  --text-caption: .75rem; --text-meta: .8125rem; --text-body: .9375rem;
  --text-card: 1.125rem; --text-section: clamp(1.5rem, 3vw, 2rem); --text-page: clamp(2rem, 5vw, 3.5rem);
  --leading-tight: 1.12; --leading-body: 1.6;
  --shadow-popover: 0 12px 40px #0006;
  --duration-fast: 140ms; --duration-normal: 200ms; --ease: cubic-bezier(.2,.7,.3,1);
  --focus-ring: 2px solid var(--accent-hover); --focus-offset: 4px;
  --layer-header: 40; --layer-dropdown: 50; --layer-bottom-nav: 60; --layer-toast: 100;
  --content-focused: 760px; --content-standard: 1180px; --content-wide: 1440px;
  --header-height: 68px; --bottom-nav-height: 72px;
  /* CSS variables cannot drive media queries. Keep media values aligned with these tokens. */
  --breakpoint-mobile: 768px; --breakpoint-desktop: 1024px; --breakpoint-wide: 1440px;
}


* { box-sizing: border-box; }
html { background: var(--bg); scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; background: var(--bg); color: var(--text); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { color: inherit; }
.shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.topbar { position: sticky; top: 0; z-index: 60; border-bottom: 1px solid rgba(255,255,255,.07); background: rgba(8,9,11,.8); backdrop-filter: blur(22px); }
.topbar-inner { height: 72px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.wordmark { display: inline-flex; align-items: baseline; gap: 5px; font-size: 22px; font-weight: 900; letter-spacing: -.045em; }
.wordmark em { font-style: italic; font-weight: 650; color: var(--pink); }
.desktop-nav { display: flex; gap: 28px; color: #bbc0c8; font-size: 14px; }
.desktop-nav a:hover { color: var(--text); }
.sign-in-pill { font-size: 13px; border: 1px solid var(--line-strong); border-radius: 999px; padding: 9px 14px; }
.home-hero { min-height: 650px; padding: 90px 0 76px; display: grid; grid-template-columns: 1.05fr .95fr; gap: 70px; align-items: center; }
.eyebrow { display: inline-block; color: var(--cyan); font-size: 11px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.hero-copy h1, .page-heading h1, .profile-guest h1 { margin: 16px 0 24px; font-size: clamp(54px, 7vw, 102px); line-height: .89; letter-spacing: -.07em; }
.hero-copy h1 em { color: var(--pink); font-style: normal; }
.hero-copy > p, .page-heading > p, .profile-guest > p { color: var(--muted); max-width: 650px; font-size: 18px; line-height: 1.6; margin: 0; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 31px; }
.primary-button, .secondary-button { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; border-radius: 12px; padding: 0 17px; font-weight: 780; font-size: 14px; border: 0; cursor: pointer; transition: transform .16s ease, opacity .16s ease, border-color .16s ease; }
.primary-button { color: #06100e; background: var(--cyan); }
.secondary-button { color: var(--text); background: #111419; border: 1px solid var(--line-strong); }
.primary-button:hover, .secondary-button:hover { transform: translateY(-1px); }
.primary-button:disabled, .secondary-button:disabled { opacity: .38; cursor: not-allowed; transform: none; }
.full { width: 100%; }
.hero-stack { position: relative; min-height: 450px; perspective: 900px; }
.hero-card { position: absolute; right: 0; width: 78%; aspect-ratio: 4/5; border: 1px solid rgba(255,255,255,.13); border-radius: 28px; padding: 28px; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden; box-shadow: 0 28px 90px rgba(0,0,0,.45); }
.hero-card::before { content: ''; position: absolute; width: 260px; height: 260px; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; top: 10%; left: 12%; box-shadow: 0 0 0 40px rgba(255,255,255,.025), 0 0 0 90px rgba(255,255,255,.02); }
.hero-card > * { position: relative; z-index: 1; }
.hero-card > span { font-size: 10px; letter-spacing: .16em; font-weight: 850; }
.hero-card > strong { font-size: 30px; letter-spacing: -.045em; margin-top: 7px; }
.hero-card > small { color: rgba(255,255,255,.72); margin-top: 6px; }
.hero-card-back { transform: translate(-92px, 4px) rotate(-9deg) scale(.88); opacity: .42; }
.hero-card-mid { transform: translate(-42px, 3px) rotate(-3deg) scale(.95); opacity: .78; }
.hero-card-front { transform: rotate(5deg); }
.art-pink { background: radial-gradient(circle at 72% 22%, rgba(255,75,150,.48), transparent 28%), linear-gradient(145deg, #25111d, #0d0f13 66%); }
.art-cyan { background: radial-gradient(circle at 70% 24%, rgba(68,231,207,.42), transparent 30%), linear-gradient(145deg, #102425, #0d0f13 66%); }
.art-violet { background: radial-gradient(circle at 70% 24%, rgba(150,114,255,.42), transparent 30%), linear-gradient(145deg, #19142d, #0d0f13 66%); }
.art-amber { background: radial-gradient(circle at 70% 24%, rgba(255,199,107,.38), transparent 30%), linear-gradient(145deg, #2a2012, #0d0f13 66%); }
.art-green { background: radial-gradient(circle at 70% 24%, rgba(104,216,145,.38), transparent 30%), linear-gradient(145deg, #142619, #0d0f13 66%); }
.art-red { background: radial-gradient(circle at 70% 24%, rgba(255,111,115,.4), transparent 30%), linear-gradient(145deg, #291417, #0d0f13 66%); }
.ticker { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #0b0d10; }
.ticker-inner { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 14px; color: #c7cbd0; font-size: 11px; font-weight: 850; letter-spacing: .13em; }
.ticker i { color: var(--pink); font-style: normal; }
.content-section { padding: 82px 0; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 28px; }
.section-heading h2 { margin: 8px 0 0; font-size: clamp(34px, 5vw, 58px); letter-spacing: -.055em; line-height: .98; }
.section-heading > a { color: #c7cbd0; display: inline-flex; align-items: center; gap: 8px; font-size: 13px; }
.featured-grid { display: grid; grid-template-columns: 1.35fr .65fr; gap: 14px; }
.side-grid { display: grid; gap: 14px; }
.build-card { display: block; border: 1px solid var(--line); border-radius: 19px; background: var(--panel); overflow: hidden; transition: transform .17s ease, border-color .17s ease; }
.build-card:hover { transform: translateY(-2px); border-color: var(--line-strong); }
.build-art { min-height: 215px; position: relative; padding: 19px; overflow: hidden; display: flex; align-items: flex-start; justify-content: space-between; }
.featured-build .build-art { min-height: 410px; }
.art-label, .art-type { position: relative; z-index: 2; font-size: 10px; letter-spacing: .13em; text-transform: uppercase; font-weight: 850; }
.art-type { color: rgba(255,255,255,.64); }
.art-rings { position: absolute; inset: 0; display: grid; place-items: center; }
.art-rings span { grid-area: 1/1; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; }
.art-rings span:nth-child(1){ width: 115px; height: 115px; }
.art-rings span:nth-child(2){ width: 205px; height: 205px; }
.art-rings span:nth-child(3){ width: 305px; height: 305px; opacity: .55; }
.build-card-body { padding: 20px; }
.build-card-meta, .card-footer-row { display: flex; align-items: center; justify-content: space-between; gap: 15px; color: var(--muted); font-size: 11px; }
.build-card-meta { text-transform: uppercase; letter-spacing: .08em; }
.build-card h3 { margin: 13px 0 7px; font-size: 24px; letter-spacing: -.04em; }
.featured-build h3 { font-size: 34px; }
.build-card p { color: var(--muted); line-height: 1.5; margin: 0 0 21px; font-size: 14px; }
.inline-icon { display: inline-flex; align-items: center; gap: 5px; }
.scan-callout { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #0b0d10; }
.scan-callout-inner { padding: 86px 0; display: grid; grid-template-columns: .85fr 1.15fr; gap: 80px; align-items: center; }
.scan-callout h2 { margin: 10px 0 20px; font-size: clamp(42px, 5.5vw, 74px); line-height: .96; letter-spacing: -.06em; }
.scan-callout p { color: var(--muted); line-height: 1.65; font-size: 16px; }
.scan-frame { min-height: 420px; border: 1px solid var(--line-strong); border-radius: 25px; position: relative; display: grid; place-items: center; background: radial-gradient(circle at 50% 46%, rgba(68,231,207,.08), transparent 35%), #0d1014; overflow: hidden; }
.scan-frame::before { content: ''; width: 210px; height: 210px; border-radius: 50% 50% 38% 62%; border: 1px solid rgba(255,255,255,.12); transform: rotate(23deg); }
.scan-object { position: absolute; font-weight: 900; font-size: 22px; letter-spacing: -.04em; text-align: center; color: rgba(255,255,255,.15); }
.scan-corner { width: 32px; height: 32px; position: absolute; border-color: var(--cyan); opacity: .85; }
.scan-corner.tl { top: 22px; left: 22px; border-left: 2px solid; border-top: 2px solid; }
.scan-corner.tr { top: 22px; right: 22px; border-right: 2px solid; border-top: 2px solid; }
.scan-corner.bl { bottom: 22px; left: 22px; border-left: 2px solid; border-bottom: 2px solid; }
.scan-corner.br { bottom: 22px; right: 22px; border-right: 2px solid; border-bottom: 2px solid; }
.detection-pill { position: absolute; padding: 9px 11px; border: 1px solid var(--line-strong); border-radius: 10px; background: rgba(12,14,18,.86); backdrop-filter: blur(12px); color: #cdd1d7; font-size: 11px; }
.detection-pill b { color: var(--cyan); margin-right: 7px; }
.detection-pill.one { top: 22%; left: 7%; }
.detection-pill.two { right: 5%; top: 48%; }
.detection-pill.three { bottom: 16%; left: 11%; }
.four-up { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.four-up article { border: 1px solid var(--line); border-radius: 16px; padding: 21px; min-height: 180px; }
.four-up b { color: var(--pink); font-size: 11px; }
.four-up h3 { margin: 51px 0 7px; font-size: 24px; letter-spacing: -.04em; }
.four-up p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.page-shell { padding-top: 70px; padding-bottom: 110px; min-height: 72vh; }
.page-heading { padding-bottom: 44px; }
.page-heading.compact h1 { font-size: clamp(50px, 6vw, 82px); max-width: 850px; }
.search-box { height: 54px; border: 1px solid var(--line); border-radius: 13px; background: var(--panel); display: flex; align-items: center; padding: 0 16px; gap: 11px; color: var(--muted); }
.search-box input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 15px; }
.search-box input::placeholder { color: #6e747e; }
.chip-row { display: flex; gap: 8px; overflow-x: auto; padding: 14px 0 26px; scrollbar-width: none; }
.chip-row::-webkit-scrollbar { display: none; }
.chip { border: 1px solid var(--line); background: #0e1013; color: #aeb3bb; border-radius: 999px; padding: 9px 13px; white-space: nowrap; font-size: 12px; cursor: pointer; }
.chip.active { color: #06100e; background: var(--cyan); border-color: var(--cyan); font-weight: 800; }
.discover-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.empty-state { border: 1px dashed var(--line-strong); border-radius: 18px; min-height: 220px; padding: 34px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: var(--muted); }
.empty-state strong { color: var(--text); font-size: 22px; }
.empty-state p { max-width: 520px; line-height: 1.55; }
.scan-workspace { display: grid; gap: 13px; }
.scan-panel { border: 1px solid var(--line); background: var(--panel); border-radius: 19px; padding: 24px; }
.step-label { color: var(--muted); text-transform: uppercase; letter-spacing: .13em; font-weight: 800; font-size: 10px; margin-bottom: 18px; }
.scan-type-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 9px; }
.scan-type { min-height: 112px; text-align: left; border: 1px solid var(--line); background: #0d0f12; border-radius: 14px; padding: 15px; cursor: pointer; }
.scan-type strong { display: block; font-size: 18px; margin-bottom: 7px; }
.scan-type span { color: var(--muted); font-size: 11px; line-height: 1.45; }
.scan-type.active { border-color: rgba(68,231,207,.7); box-shadow: inset 0 0 0 1px rgba(68,231,207,.12); }
.upload-drop { width: 100%; min-height: 215px; border: 1px dashed rgba(68,231,207,.34); background: #0c1012; border-radius: 17px; display: flex; flex-direction: column; justify-content: center; align-items: center; cursor: pointer; color: var(--text); }
.upload-icon { width: 54px; height: 54px; border: 1px solid rgba(68,231,207,.3); background: rgba(68,231,207,.06); color: var(--cyan); border-radius: 50%; display: grid; place-items: center; margin-bottom: 14px; }
.upload-drop strong { font-size: 18px; }
.upload-drop > span:last-child { color: var(--muted); margin-top: 7px; font-size: 12px; }
.sr-only { width: 1px; height: 1px; opacity: 0; position: absolute; pointer-events: none; }
.file-list { display: grid; gap: 6px; margin-top: 13px; color: var(--muted); font-size: 12px; }
.scan-preview-panel { display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: center; }
.scan-preview-panel h2 { margin: 0 0 8px; font-size: 27px; letter-spacing: -.04em; }
.scan-preview-panel p { color: var(--muted); line-height: 1.55; margin: 0; max-width: 680px; }
.scan-preview-panel small { grid-column: 2; color: var(--muted); text-align: right; }
.collection-empty { min-height: 320px; }
.empty-icon { width: 62px; height: 62px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; color: var(--cyan); margin-bottom: 18px; }
.profile-guest { padding-bottom: 62px; }
.profile-guest h1 { overflow-wrap: anywhere; }
.profile-avatar { width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(145deg, var(--pink), var(--violet)); font-weight: 900; margin-bottom: 19px; }
.profile-preview { border: 1px solid var(--line); border-radius: 20px; padding: 22px; background: var(--panel); opacity: .72; }
.preview-top { display: flex; justify-content: space-between; align-items: center; }
.preview-top span { font-weight: 850; }
.preview-top button { border: 1px solid var(--line); background: transparent; color: var(--muted); padding: 8px 11px; border-radius: 9px; }
.profile-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 24px 0; }
.profile-stats div { background: #0d0f12; border: 1px solid var(--line); border-radius: 13px; padding: 15px; }
.profile-stats strong { display: block; font-size: 25px; }
.profile-stats span { color: var(--muted); font-size: 11px; }
.profile-tabs { display: flex; gap: 23px; color: var(--muted); font-size: 12px; border-bottom: 1px solid var(--line); }
.profile-tabs span { padding: 0 0 13px; }
.profile-tabs .active { color: var(--text); border-bottom: 1px solid var(--cyan); }
.profile-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin-top: 15px; }
.profile-grid div { aspect-ratio: 1; border-radius: 13px; background: linear-gradient(145deg,#1a1e24,#0b0d10); }
.back-link { display: inline-block; color: var(--muted); font-size: 13px; margin-bottom: 18px; }
.detail-hero { min-height: 520px; border: 1px solid var(--line); border-radius: 24px; position: relative; padding: 25px; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; }
.detail-hero > span, .detail-hero small { position: relative; z-index: 2; font-size: 10px; letter-spacing: .15em; text-transform: uppercase; font-weight: 850; }
.detail-hero h1 { position: relative; z-index: 2; margin: 7px 0 0; font-size: clamp(44px, 7vw, 94px); max-width: 850px; line-height: .9; letter-spacing: -.07em; }
.detail-rings span:nth-child(1){ width: 210px; height: 210px; }.detail-rings span:nth-child(2){ width: 380px; height: 380px; }.detail-rings span:nth-child(3){ width: 600px; height: 600px; }
.detail-grid { display: grid; grid-template-columns: 1fr 320px; gap: 40px; padding: 29px 0 62px; }
.detail-meta { display: flex; gap: 8px; font-size: 11px; text-transform: uppercase; color: var(--muted); }
.detail-meta span { border: 1px solid var(--line); padding: 6px 8px; border-radius: 999px; }
.detail-summary { color: #c5c9ce; font-size: 18px; line-height: 1.6; max-width: 670px; }
.tag-row { display: flex; gap: 7px; flex-wrap: wrap; }
.tag-row span { color: var(--muted); background: #101318; padding: 7px 9px; border-radius: 7px; font-size: 11px; }
.detail-actions { display: flex; flex-direction: column; gap: 9px; }
.detail-actions small { color: var(--muted); font-size: 11px; line-height: 1.5; padding: 4px; }
.recipe-section { border-top: 1px solid var(--line); padding-top: 57px; }
.confidence-note { color: var(--muted); font-size: 11px; }
.recipe-list { border: 1px solid var(--line); border-radius: 17px; overflow: hidden; }
.recipe-list article { min-height: 83px; display: grid; grid-template-columns: 55px 1fr auto; gap: 17px; align-items: center; padding: 14px 17px; border-bottom: 1px solid var(--line); }
.recipe-list article:last-child { border-bottom: 0; }
.recipe-number { color: #5f6670; font-size: 11px; }
.recipe-list small { display: block; color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; margin-bottom: 4px; }
.recipe-list strong { font-size: 15px; }
.status-pill { display: inline-flex; align-items: center; gap: 6px; border: 1px solid rgba(68,231,207,.26); background: rgba(68,231,207,.05); color: var(--cyan); border-radius: 999px; padding: 7px 9px; font-size: 10px; }
.status-pill.muted { color: var(--muted); border-color: var(--line); background: transparent; }
.auth-shell { min-height: 76vh; padding: 95px 0 120px; display: grid; grid-template-columns: 1fr 440px; gap: 80px; align-items: center; }
.auth-copy h1 { font-size: clamp(48px, 6vw, 82px); line-height: .92; letter-spacing: -.065em; margin: 15px 0 20px; }
.auth-copy p { color: var(--muted); line-height: 1.6; max-width: 590px; }
.auth-card { border: 1px solid var(--line); background: var(--panel); border-radius: 20px; padding: 24px; }
.auth-card h2 { margin: 0 0 8px; font-size: 26px; letter-spacing: -.04em; }
.auth-card > p, .auth-card > small { color: var(--muted); line-height: 1.5; font-size: 12px; }
.auth-provider { width: 100%; min-height: 47px; margin-top: 9px; border: 1px solid var(--line-strong); border-radius: 11px; background: #0d0f12; text-align: left; padding: 0 14px; color: #c7cbd0; display: flex; justify-content: space-between; align-items: center; }
.auth-provider span { color: #676d76; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.auth-divider { display: flex; align-items: center; gap: 10px; color: #676d76; font-size: 10px; margin: 17px 0; }
.auth-divider::before, .auth-divider::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.auth-card label { display: grid; gap: 7px; color: var(--muted); font-size: 11px; }
.auth-card input { height: 44px; border: 1px solid var(--line); background: #0d0f12; border-radius: 10px; padding: 0 12px; color: var(--text); }
.auth-card .primary-button { margin-top: 10px; }
.auth-card > a { display: block; margin-top: 19px; color: #cbd0d5; font-size: 12px; }
.admin-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 13px; }
.admin-grid a { border: 1px solid var(--line); border-radius: 16px; padding: 21px; background: var(--panel); min-height: 200px; }
.admin-grid span { color: var(--pink); font-size: 10px; font-weight: 800; }
.admin-grid h2 { margin: 65px 0 7px; letter-spacing: -.04em; }
.admin-grid p { margin: 0; color: var(--muted); line-height: 1.5; font-size: 13px; }
.catalogue-toolbar { display: flex; gap: 8px; margin-bottom: 14px; }
.catalogue-table { border: 1px solid var(--line); border-radius: 15px; overflow: hidden; }
.catalogue-row { display: grid; grid-template-columns: 1.7fr 1fr 1fr .7fr; gap: 13px; align-items: center; min-height: 62px; padding: 0 15px; border-bottom: 1px solid var(--line); font-size: 12px; }
.catalogue-row:last-child { border-bottom: 0; }
.catalogue-row.header { color: var(--muted); text-transform: uppercase; letter-spacing: .08em; font-size: 9px; background: #0d0f12; }
.evidence-cell { color: var(--cyan); font-size: 10px; }
.footer { min-height: 95px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 20px; align-items: center; color: #686e77; font-size: 10px; }
.footer span:first-child { color: #9ca2aa; font-weight: 800; }
.bottom-nav { display: none; }

@media (max-width: 900px) {
  .desktop-nav { display: none; }
  .home-hero { grid-template-columns: 1fr; padding-top: 65px; }
  .hero-stack { min-height: 390px; width: min(560px, 100%); margin: 0 auto; }
  .featured-grid { grid-template-columns: 1fr; }
  .side-grid { grid-template-columns: 1fr 1fr; }
  .scan-callout-inner { grid-template-columns: 1fr; gap: 42px; }
  .four-up { grid-template-columns: 1fr 1fr; }
  .discover-grid { grid-template-columns: 1fr 1fr; }
  .scan-type-grid { grid-template-columns: 1fr 1fr; }
  .auth-shell { grid-template-columns: 1fr; gap: 45px; }
}

@media (max-width: 680px) {
  body { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
  .shell { width: min(100% - 28px, 1180px); }
  .topbar-inner { height: 62px; }
  .wordmark { font-size: 19px; }
  .sign-in-pill { padding: 7px 11px; font-size: 11px; }
  .home-hero { min-height: auto; padding: 54px 0 50px; gap: 43px; }
  .hero-copy h1, .page-heading h1, .profile-guest h1 { font-size: clamp(48px, 16vw, 68px); }
  .hero-copy > p, .page-heading > p, .profile-guest > p { font-size: 16px; }
  .hero-stack { min-height: 320px; }
  .hero-card { width: 75%; border-radius: 20px; padding: 20px; }
  .hero-card-back { transform: translate(-60px, 4px) rotate(-9deg) scale(.88); }
  .hero-card-mid { transform: translate(-28px, 3px) rotate(-3deg) scale(.95); }
  .hero-card > strong { font-size: 22px; }
  .ticker-inner { min-height: 50px; font-size: 9px; overflow: hidden; }
  .ticker-inner span:nth-of-type(5), .ticker-inner i:nth-of-type(4) { display: none; }
  .content-section { padding: 58px 0; }
  .section-heading { align-items: flex-start; }
  .section-heading h2 { font-size: 38px; }
  .section-heading > a { display: none; }
  .featured-build .build-art { min-height: 300px; }
  .side-grid, .discover-grid { grid-template-columns: 1fr; }
  .scan-callout-inner { padding: 58px 0; }
  .scan-callout h2 { font-size: 48px; }
  .scan-frame { min-height: 330px; }
  .four-up { grid-template-columns: 1fr 1fr; gap: 8px; }
  .four-up article { min-height: 155px; }
  .four-up h3 { margin-top: 35px; font-size: 21px; }
  .page-shell { padding-top: 48px; padding-bottom: 80px; }
  .page-heading { padding-bottom: 30px; }
  .page-heading.compact h1 { font-size: 53px; }
  .build-art { min-height: 245px; }
  .scan-panel { padding: 17px; border-radius: 15px; }
  .scan-type-grid { grid-template-columns: 1fr 1fr; }
  .scan-type { min-height: 105px; padding: 12px; }
  .upload-drop { min-height: 190px; }
  .scan-preview-panel { grid-template-columns: 1fr; }
  .scan-preview-panel .primary-button { width: 100%; }
  .scan-preview-panel small { grid-column: 1; text-align: left; }
  .profile-stats { grid-template-columns: repeat(3,1fr); }
  .profile-grid { grid-template-columns: 1fr 1fr; }
  .detail-hero { min-height: 390px; border-radius: 18px; padding: 18px; }
  .detail-grid { grid-template-columns: 1fr; gap: 25px; padding-bottom: 45px; }
  .recipe-list article { grid-template-columns: 36px 1fr; }
  .status-pill { grid-column: 2; justify-self: start; }
  .confidence-note { display: none; }
  .auth-shell { padding-top: 57px; }
  .auth-copy h1 { font-size: 53px; }
  .admin-grid { grid-template-columns: 1fr; }
  .catalogue-table { overflow-x: auto; }
  .catalogue-row { min-width: 690px; }
  .footer { display: none; }
  .bottom-nav { position: fixed; bottom: 0; left: 0; right: 0; z-index: 80; height: calc(66px + env(safe-area-inset-bottom)); padding: 6px 7px env(safe-area-inset-bottom); background: rgba(8,9,11,.94); border-top: 1px solid var(--line); backdrop-filter: blur(22px); display: grid; grid-template-columns: repeat(5,1fr); }
  .bottom-nav a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; color: #797f88; font-size: 8px; font-weight: 750; }
  .bottom-icon { width: 31px; height: 27px; display: grid; place-items: center; }
  .scan-nav-item .bottom-icon { width: 41px; height: 41px; margin-top: -18px; border-radius: 50%; background: var(--cyan); color: #06100e; border: 4px solid var(--bg); box-shadow: 0 0 0 1px var(--line); }
  .scan-nav-item > span:last-child { margin-top: -2px; }
}

.scan-error { color: #ff8f9f !important; }
.scan-results { border-top: 1px solid var(--line); padding: 56px 0 8px; }
.scan-result-summary { max-width: 700px; color: var(--muted); line-height: 1.6; }
.scan-match-list { display: grid; gap: 8px; margin: 22px 0; }
.scan-match-list article { display: grid; grid-template-columns: 12px 1fr auto; gap: 14px; align-items: start; padding: 16px; border: 1px solid var(--line); border-radius: 13px; background: var(--panel); }
.scan-match-list small { display: block; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; font-size: 9px; margin-bottom: 5px; }
.scan-match-list strong { text-transform: capitalize; }
.scan-match-list p { color: var(--muted); font-size: 12px; margin: 7px 0 0; line-height: 1.45; }
.confidence-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 5px; background: #747b84; }
.confidence-dot.high { background: var(--cyan); box-shadow: 0 0 14px rgba(68,231,207,.45); }
.confidence-dot.review { background: #f1bd58; }
.confidence-dot.low { background: #ff6d82; }
.confidence-score { font-size: 11px; font-weight: 800; padding: 6px 8px; border-radius: 999px; background: #111418; }
.confidence-score.high { color: var(--cyan); }.confidence-score.review { color: #f1bd58; }.confidence-score.low { color: #ff6d82; }
.unresolved-box { border: 1px solid rgba(241,189,88,.22); background: rgba(241,189,88,.04); border-radius: 13px; padding: 16px; margin: 0 0 18px; }
.unresolved-box > strong { font-size: 13px; }
.unresolved-box p { display: grid; grid-template-columns: 120px 1fr; gap: 12px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.unresolved-box p span { color: #f1bd58; text-transform: uppercase; font-size: 9px; letter-spacing: .08em; }
.scan-result-footnote { display: block; margin-top: 10px; color: var(--muted); font-size: 10px; }

.auth-card form { display: grid; gap: 9px; }
.auth-message { margin: 12px 0 0 !important; color: var(--cyan) !important; }

.collection-row { display:grid; grid-template-columns:auto 1fr auto; gap:18px; align-items:center; padding:18px 0; border-bottom:1px solid var(--line); color:inherit; text-decoration:none; }
.collection-row:hover strong { text-decoration:underline; text-underline-offset:4px; }
.collection-row small { display:block; color:var(--muted); text-transform:uppercase; letter-spacing:.12em; margin-bottom:4px; }
.collection-row strong { display:block; }
button:disabled { opacity:.6; cursor:wait; }

.create-shell { max-width: 980px; }
.editor-fields { border: 0; padding: 0; margin: 0; display: grid; gap: 18px; min-width: 0; }
.editor-fields h2 { font-size: 25px; letter-spacing: -.035em; display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin: 0 0 22px; }
.editor-fields h2 small { font-size: 12px; color: var(--muted); font-weight: 400; margin-left: auto; }
.build-type-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.build-type-options .scan-type { min-height: 78px; }
.editor-details, .editor-details label, .editor-search { display: grid; gap: 12px; }
.editor-details label, .editor-search { font-size: 13px; color: #c7cbd0; }
.editor-details input, .editor-details textarea, .editor-search input { width: 100%; min-width: 0; color: var(--text); background: #0b0d10; border: 1px solid var(--line-strong); border-radius: 10px; padding: 13px; font: inherit; font-size: 16px; }
.editor-details textarea { resize: vertical; }
.editor-details small, .editor-help { color: var(--muted); font-size: 12px; line-height: 1.6; }
.editor-images { list-style: none; margin: 20px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.editor-images li { border: 1px solid var(--line-strong); border-radius: 12px; overflow: hidden; min-width: 0; }
.editor-images img { display: block; width: 100%; height: 200px; object-fit: contain; background: #08090b; }
.screenshot-controls { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; padding: 10px; font-size: 12px; }
.screenshot-controls span { margin-right: auto; }
.screenshot-controls button { background: #171b22; border: 1px solid var(--line-strong); border-radius: 6px; min-height: 36px; min-width: 36px; cursor: pointer; }
.editor-search { margin: 18px 0; }
.catalogue-options { display: grid; gap: 9px; max-height: 440px; overflow-y: auto; }
.catalogue-option { display: flex; gap: 14px; align-items: center; padding: 16px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; }
.catalogue-option.selected { border-color: var(--cyan); background: rgba(68,231,207,.04); }
.catalogue-option input { width: 20px; height: 20px; accent-color: var(--cyan); flex-shrink: 0; }
.catalogue-option strong, .catalogue-option small { display: block; overflow-wrap: anywhere; }
.catalogue-option small { margin-top: 5px; color: var(--muted); font-size: 11px; }
.editor-submit { display: flex; gap: 24px; justify-content: space-between; align-items: center; padding: 28px 0; }
.editor-submit p { color: var(--muted); max-width: 450px; font-size: 12px; line-height: 1.6; }
.editor-submit .hero-actions { margin: 0; flex-shrink: 0; }
.editor-feedback { padding: 16px; background: var(--panel); border: 1px solid var(--cyan); border-radius: 12px; overflow-wrap: anywhere; }
.editor-feedback.error { border-color: var(--red); color: #ff9da0; }
.editor-fields:disabled { opacity: .75; }
.build-gallery { display: grid; gap: 12px; margin: 20px 0 30px; }
.detail-title { padding: 24px 0 10px; }
.detail-title > span, .detail-title small { font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); }
.detail-title small { display: block; margin-top: 20px; color: var(--cyan); }
.detail-title h1 { font-size: clamp(36px,6vw,72px); line-height: 1; letter-spacing: -.05em; margin: 12px 0; overflow-wrap: anywhere; }
.build-gallery img { display: block; width: 100%; max-height: 760px; object-fit: contain; background: #0b0d10; border: 1px solid var(--line); border-radius: 18px; }
.build-art > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.build-art:has(> img) .art-label, .build-art:has(> img) .art-type { background: rgba(0,0,0,.8); padding: 7px; border-radius: 6px; }
.creator-builds { margin-top: 35px; }
.creator-build-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.creator-build-row strong { display: block; overflow-wrap: anywhere; }
.creator-build-row small { color: var(--muted); }
@media (max-width:680px) {
  .build-type-options { gap: 6px; }
  .build-type-options .scan-type { padding: 12px 8px; }
  .build-type-options strong { font-size: 15px; }
  .editor-images { grid-template-columns: 1fr; }
  .editor-submit { display: block; }
  .editor-submit .hero-actions { margin-top: 18px; }
  .editor-fields h2 { font-size: 22px; }
}

.scanner-preview { width:100%; max-height:440px; object-fit:contain; margin:16px 0; background:#08090b; border-radius:12px; }
.scan-panel input[type="search"] { display:block; width:100%; padding:12px; margin:8px 0; background:#111318; border:1px solid #373a42; color:#fff; border-radius:8px; }
.scanner-suggestion { padding:16px 0; border-bottom:1px solid #333740; }
.scanner-suggestion button { margin:4px 8px 4px 0; }
.scanner-catalogue { max-height:320px; overflow:auto; margin:12px 0; }
.scanner-catalogue label { display:flex; align-items:center; gap:10px; padding:12px 4px; overflow-wrap:anywhere; }
.scanner-catalogue input { flex-shrink:0; width:20px; height:20px; }
.upload-drop strong { max-width:100%; overflow-wrap:anywhere; }
.scan-panel { min-width:0; overflow-wrap:anywhere; }

.reference-form { display:grid; gap:16px; min-width:0; }
.reference-form label { display:grid; gap:8px; min-width:0; }
.reference-form label:has(input[type=checkbox]) { display:flex; align-items:flex-start; }
.reference-form input:not([type=checkbox]),.reference-form select,.reference-form textarea { width:100%; min-width:0; padding:12px; color:var(--text,#f5f5f5); background:#17191e; border:1px solid #424650; border-radius:8px; font:inherit; }
.reference-form textarea { min-height:90px; resize:vertical; }
.reference-form input[type=checkbox] { flex-shrink:0; margin-top:4px; }
.reference-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:20px; }
.reference-grid figure { margin:0; }
.reference-grid figcaption,.reference-form p,.scan-panel { overflow-wrap:anywhere; }
/* User text and source URLs must not widen the build recipe grid on small screens. */
.detail-grid > * { min-width: 0; }
.detail-summary { overflow-wrap: anywhere; }

.community-form{display:grid;gap:14px;max-width:650px}.community-form label{display:grid;gap:7px}.community-form input,.community-form textarea,.community-form select{width:100%;min-height:44px;padding:10px;background:var(--panel);color:var(--text);border:1px solid var(--control-border);border-radius:5px}.community-form textarea{min-height:100px}.creator-social{padding:20px 0}.creator-social details{margin-top:16px}summary{cursor:pointer;min-height:44px;padding:12px 0} .scan-panel{overflow-wrap:anywhere}.scan-panel input{max-width:100%}

body { font-family: var(--font-inter), Arial, sans-serif; font-size: var(--text-body); line-height: var(--leading-body); }
h1,h2,h3,h4 { font-family: var(--font-space), Arial, sans-serif; font-weight: 700; }
button,input,select,textarea { font: inherit; }
button,a,input,select,textarea,summary { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: var(--focus-ring); outline-offset: var(--focus-offset); }
#main-content:focus { outline: none; }
::selection { background: var(--pink); color: var(--bg); }
html { scroll-padding-top: calc(var(--header-height) + 20px); }
.vs-skip { position: fixed; top: 8px; left: 16px; padding: 12px 16px; background: var(--text); color: var(--bg); z-index: 200; transform: translateY(-200%); border-radius: var(--radius-sm); }
.vs-skip:focus { transform: translateY(0); }
.vs-topbar { position: sticky; top: 0; z-index: var(--layer-header); background: var(--bg); border-bottom: 1px solid var(--line); }
.vs-topbar-inner { width: min(var(--content-wide), calc(100% - 64px)); margin: auto; display: flex; align-items: center; gap: 32px; height: var(--header-height); }
.vs-wordmark { width: 174px; flex-shrink: 0; display: flex; align-items: center; min-height: 44px; }
.vs-wordmark img { display: block; width: 100%; height: auto; }
.vs-desktop-nav { display: flex; align-self: stretch; gap: 28px; }
.vs-desktop-nav a { position: relative; display: flex; align-items: center; font-size: 13px; font-weight: 500; color: var(--muted); }
.vs-desktop-nav a[aria-current], .vs-desktop-nav a:hover { color: var(--text); }
.vs-desktop-nav a[aria-current]::after { content: ''; height: 2px; background: var(--pink); position: absolute; inset: auto 0 0; }
.vs-header-actions { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; }
.vs-header-search { margin-left: auto; width: min(100%, 380px); min-width: 140px; }
.vs-header-search .vs-search { min-height: 40px; border-radius: var(--radius-pill); }
.vs-header-search input { font-size: 12px; }
.vs-icon-link { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; color: var(--muted); }
.vs-icon-link:hover,.vs-icon-link[aria-current] { color: var(--pink); }
.vs-header-create { flex-shrink: 0; }
.vs-mobile-search { display: none; }
.vs-button,.primary-button,.secondary-button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 16px; border-radius: var(--radius-sm); font-weight: 600; font-size: 13px; line-height: 1.4; cursor: pointer; border: 1px solid transparent; transition: background var(--duration-fast) var(--ease), border-color var(--duration-fast) var(--ease), transform var(--duration-fast) var(--ease); text-align: center; }
.vs-button-primary,.primary-button { background: var(--pink); color: #09090D; }
.vs-button-primary:hover,.primary-button:hover { background: var(--accent-hover); transform: none; }
.vs-button-secondary,.secondary-button { border-color: var(--line); background: var(--panel); color: var(--text); }
.vs-button-secondary:hover,.secondary-button:hover { background: var(--panel-2); border-color: var(--line-strong); transform: none; }
.vs-button-ghost,.vs-button-icon { background: transparent; color: var(--text); }
.vs-button-ghost:hover,.vs-button-icon:hover { background: var(--panel-2); }
.vs-button-icon { width: 44px; height: 44px; padding: 8px; font-size: 22px; }
.vs-button-destructive { background: #3b1d27; border-color: #713643; color: #ffb4bc; }
.vs-button-destructive:hover { background: #4a2430; }
.vs-button:active,.primary-button:active,.secondary-button:active { transform: translateY(1px); }
.vs-button:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.vs-avatar { width: 32px; height: 32px; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--panel-2); display: inline-grid; place-items: center; font-size: 11px; font-weight: 600; color: var(--text); overflow: hidden; flex-shrink: 0; vertical-align: middle; }
.vs-avatar img { width: 100%; height: 100%; object-fit: cover; }
.vs-avatar-large { width: 56px; height: 56px; font-size: 18px; }
.vs-dropdown { position: relative; flex-shrink: 0; line-height: 1.4; }
.vs-dropdown > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border-radius: var(--radius-sm); }
.vs-dropdown > summary::-webkit-details-marker { display: none; }
.vs-dropdown[open] > summary,.vs-dropdown > summary:hover { background: var(--panel); }
.vs-dropdown-panel { position: absolute; right: 0; top: calc(100% + 10px); width: 240px; max-width: calc(100vw - 32px); border: 1px solid var(--line); background: var(--panel); border-radius: var(--radius-md); padding: 8px; box-shadow: var(--shadow-popover); z-index: var(--layer-dropdown); }
.vs-dropdown-panel a,.vs-dropdown-panel button { display: flex; align-items: center; min-height: 44px; padding: 10px 12px; border-radius: var(--radius-sm); font-size: 13px; width: 100%; background: transparent; border: 0; color: var(--text); cursor: pointer; text-align: left; }
.vs-dropdown-panel a:hover,.vs-dropdown-panel button:hover { background: var(--panel-2); }
.vs-account-label { padding: 8px 12px 12px; margin-bottom: 4px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.vs-container { width: min(var(--content-standard), calc(100% - 48px)); margin-inline: auto; min-width: 0; }
.vs-container-focused { max-width: var(--content-focused); }
.vs-container-wide { width: min(var(--content-wide), calc(100% - 48px)); }
.vs-container-full { width: 100%; }
.vs-section-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-block: 32px 20px; }
.vs-section-heading h2 { font-size: var(--text-section); line-height: var(--leading-tight); letter-spacing: -.035em; margin: 0; }
.vs-section-heading p { color: var(--muted); margin: 8px 0 0; max-width: 640px; }
.vs-category { display: inline-flex; align-items: center; min-height: 26px; border: 1px solid var(--line); padding: 3px 8px; font-size: 11px; border-radius: var(--radius-pill); color: var(--muted); }
.chip { min-height: 44px; padding: 8px 16px; background: var(--panel); border-color: var(--line); color: var(--muted); }
.chip.active { background: var(--pink); color: var(--bg); border-color: var(--pink); font-weight: 600; }
.chip:not(.active):hover { background: var(--panel-2); color: var(--text); }
.vs-field { display: grid; gap: 8px; min-width: 0; }
.vs-field label { font-size: 13px; font-weight: 500; }
.vs-input { width: 100%; min-height: 46px; border: 1px solid var(--line-strong); background: var(--panel); color: var(--text); border-radius: var(--radius-sm); padding: 11px 12px; min-width: 0; }
textarea.vs-input { min-height: 110px; resize: vertical; }
.vs-input[aria-invalid=true] { border-color: var(--danger); }
.vs-input::placeholder,.vs-search input::placeholder { color: var(--muted); opacity: 1; }
.vs-search { display: flex; gap: 10px; align-items: center; border: 1px solid var(--line); background: var(--panel); border-radius: var(--radius-md); padding: 0 14px; min-height: 48px; color: var(--muted); }
.vs-search:focus-within { outline: var(--focus-ring); outline-offset: 2px; }
.vs-search input { border: 0; outline: none; color: var(--text); background: transparent; width: 100%; min-width: 0; min-height: 38px; }
.vs-feedback { margin: 0; font-size: 12px; color: var(--muted); }
.is-error { color: var(--danger); }
.vs-upload { position: relative; border: 1px dashed var(--line-strong); border-radius: var(--radius-md); }
.vs-upload label { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 10px; padding: 32px 16px; min-height: 200px; text-align: center; }
.vs-upload label svg { color: var(--pink); }
.vs-upload label span { color: var(--muted); font-size: 12px; }
.vs-upload input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.vs-upload:focus-within { outline: var(--focus-ring); outline-offset: var(--focus-offset); }
.vs-loading { padding: 20px; display: grid; gap: 12px; color: var(--muted); font-size: 13px; }
.vs-skeleton { display: block; height: 100px; border-radius: var(--radius-sm); background: var(--panel-2); animation: vs-pulse 1.8s ease-in-out infinite alternate; }
@keyframes vs-pulse { to { opacity: .4; } }
.vs-error { padding: 24px; border: 1px solid #713643; border-radius: var(--radius-md); background: #20141b; }
.vs-error h3 { margin: 0; color: var(--danger); }
.vs-error p { color: var(--muted); }
.vs-dialog { width: min(520px, calc(100% - 32px)); max-height: calc(100dvh - 48px); overflow-y: auto; color: var(--text); background: var(--panel); border: 1px solid var(--line-strong); border-radius: var(--radius-lg); padding: 24px; box-shadow: var(--shadow-popover); }
.vs-dialog::backdrop { background: #000b; }
.vs-overlay-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 20px; }
.vs-overlay-heading h2 { margin: 0; font-size: 22px; }
.vs-sheet-search { display: grid; gap: 20px; }
.vs-toast { position: fixed; bottom: 32px; right: 24px; z-index: var(--layer-toast); display: flex; gap: 16px; align-items: center; background: var(--panel-2); border: 1px solid var(--line-strong); border-radius: var(--radius-md); padding: 8px 8px 8px 16px; max-width: calc(100vw - 32px); box-shadow: var(--shadow-popover); font-size: 13px; }
.build-card { border-radius: var(--radius-md); background: var(--panel); border: 1px solid var(--line); }
.build-card:hover { transform: none; border-color: var(--line-strong); }
.build-card .build-art { padding: 0; min-height: 0; aspect-ratio: var(--card-ratio, 4 / 3); background: var(--panel-2); display: grid; place-items: center; }
.build-card .build-art img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--duration-normal) var(--ease); }
.build-card:hover .build-art img { transform: scale(1.025); }
.vs-card-no-image { color: var(--muted); font-size: 12px; display: grid; place-items: center; gap: 8px; }
.build-card .build-card-body { padding: 14px; }
.build-card h3,.featured-build h3 { font-size: var(--text-card); margin: 8px 0; letter-spacing: -.025em; line-height: 1.3; }
.build-card .card-footer-row { justify-content: flex-start; gap: 8px; font-size: 12px; }
.vs-card-creator { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vs-card-engagement { display: flex; gap: 10px; margin-left: auto; }
.build-card-meta { letter-spacing: 0; text-transform: none; font-size: 11px; }
.page-heading h1,.page-heading.compact h1,.profile-guest h1 { font-size: var(--text-page); line-height: var(--leading-tight); letter-spacing: -.045em; }
.page-heading > p,.profile-guest > p { font-size: 16px; }
.page-shell { padding-top: 40px; }
.section-heading h2 { font-size: var(--text-section); line-height: var(--leading-tight); }
.scan-panel,.profile-preview,.detail-hero,.recipe-list { border-radius: var(--radius-md); }
.profile-avatar { background: var(--panel-2); border: 1px solid var(--line); }
.empty-state { border-radius: var(--radius-md); }
.footer { font-size: 11px; color: var(--muted); padding-block: 24px; }
.footer a { text-decoration: underline; text-underline-offset: 3px; }
.vs-showcase { padding-block: 48px 80px; }
.vs-showcase h1 { font-size: var(--text-page); margin: 12px 0; line-height: var(--leading-tight); letter-spacing: -.045em; }
.vs-showcase-intro { max-width: 620px; color: var(--muted); }
.vs-showcase section { padding-block: 12px 24px; border-bottom: 1px solid var(--line); }
.vs-demo-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.vs-demo-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.vs-demo-stack { display: grid; gap: 20px; min-width: 0; }
.vs-palette { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.vs-swatch { border: 1px solid var(--line); border-radius: var(--radius-sm); overflow: hidden; font-size: 12px; }
.vs-swatch > span { display: block; height: 64px; }
.vs-swatch p { margin: 0; padding: 10px; }
.vs-swatch code { color: var(--muted); display: block; }
@media(min-width:768px) { .bottom-nav { display: none; } body { padding-bottom: 0; } }
@media(max-width:1023px) {
  .vs-topbar-inner { width: calc(100% - 32px); gap: 20px; }
  .vs-wordmark { width: 150px; }
  .vs-desktop-nav { gap: 20px; }
  .vs-header-actions { gap: 6px; }
  .vs-header-search { display: none; }
  .vs-mobile-search { display: block; margin-left: auto; }
}
@media(max-width:767px) {
  :root { --header-height: 60px; }
  body { padding-bottom: calc(var(--bottom-nav-height) + env(safe-area-inset-bottom)); }
  .vs-topbar-inner { gap: 12px; }
  .vs-wordmark { width: 144px; }
  .vs-desktop-nav,.vs-header-create,.vs-header-saved { display: none; }
  .vs-header-actions { justify-content: flex-end; gap: 8px; }
  .vs-mobile-search { margin-left: 0; }
  .vs-mobile-search .vs-button { width: 44px; padding: 8px; background: transparent; border: 0; }
  .bottom-nav { display: grid; position: fixed; inset: auto 0 0; z-index: var(--layer-bottom-nav); height: calc(var(--bottom-nav-height) + env(safe-area-inset-bottom)); background: var(--bg); border-top: 1px solid var(--line); backdrop-filter: none; grid-template-columns: repeat(5,minmax(0,1fr)); padding: 4px 8px calc(4px + env(safe-area-inset-bottom)); }
  .bottom-nav a { min-height: 56px; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 2px; font-size: 10px; font-weight: 500; color: var(--muted); }
  .bottom-nav .bottom-icon { display: grid; place-items: center; width: 38px; height: 32px; background: transparent; border: 0; border-radius: var(--radius-sm); }
  .bottom-nav a[aria-current],.bottom-nav a:hover { color: var(--pink); }
  .bottom-nav .vs-create-nav .bottom-icon { color: var(--bg); background: var(--pink); }
  .bottom-nav .vs-create-nav { color: var(--text); }
  .bottom-nav .vs-create-nav[aria-current] .bottom-icon { outline: 1px solid var(--accent-hover); outline-offset: 3px; }
  .vs-container,.vs-container-wide { width: calc(100% - 32px); }
  .vs-container-full { width: 100%; }
  .vs-section-heading { align-items: flex-start; flex-direction: column; gap: 12px; }
  .vs-demo-grid { grid-template-columns: 1fr; }
  .vs-palette { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .vs-sheet { margin: auto auto 0; width: 100%; max-width: 100%; max-height: 85dvh; border-radius: var(--radius-lg) var(--radius-lg) 0 0; padding: 24px 20px calc(24px + env(safe-area-inset-bottom)); border-bottom: 0; }
  .vs-toast { right: 16px; bottom: calc(var(--bottom-nav-height) + env(safe-area-inset-bottom) + 16px); }
  .vs-search input,.vs-input { font-size: 16px; }
  .page-heading h1,.profile-guest h1 { font-size: var(--text-page); }
  .page-shell { padding-top: 28px; padding-bottom: 48px; }
  .discover-grid { gap: 12px; }
  .build-card .build-card-body { padding: 12px; }
  .build-card h3 { font-size: 16px; }
  .vs-showcase { padding-top: 28px; }
  .vs-dropdown-panel { max-height: calc(100dvh - 150px); overflow-y: auto; }
  .footer { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
  /* Avoid a fixed tab bar competing with the on-screen keyboard. */
  body:has(input:focus,textarea:focus,select:focus) .bottom-nav { display: none; }
}
@media(max-width:389px) { .discover-grid { grid-template-columns: 1fr; } .vs-wordmark { width: 136px; } }
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  *,*::before,*::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .build-card:hover .build-art img,.vs-button:active,.primary-button:active,.secondary-button:active { transform: none; }
}
/* Existing page content keeps its routes and workflows during the phased redesign. */
.home-hero { min-height: 480px; padding-block: 64px; gap: 48px; }
.hero-copy h1 { font-size: clamp(40px, 5vw, 68px); line-height: 1.02; letter-spacing: -.055em; }
.hero-copy > p { font-size: 16px; }
.hero-stack { min-height: 340px; }
.hero-card { border-radius: var(--radius-md); background: var(--panel); box-shadow: none; }
.hero-card::before { display: none; }
.art-pink,.art-cyan,.art-violet,.art-amber,.art-green,.art-red { background: var(--panel-2); }
.ticker,.scan-callout { background: var(--bg); }
.scan-frame { background: var(--panel); border-radius: var(--radius-md); }
.scan-callout h2 { font-size: var(--text-page); line-height: var(--leading-tight); }
@media(max-width:767px) { .home-hero { padding-block: 32px; gap: 32px; } .hero-copy h1 { font-size: clamp(40px,12vw,56px); } .hero-stack { min-height: 300px; } }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap; border: 0; opacity: 1; }
.build-card .build-art { justify-content: center; }
.vs-input,.vs-search,.vs-upload { border-color: var(--control-border); }
.vs-header-search .vs-search { border-color: var(--line); }
.vs-card-engagement .is-saved svg { fill: currentColor; }
.home-hero .hero-stack { min-height: 470px; }
.home-hero .hero-card { width: 70%; max-width: 340px; right: 12px; }
@media(max-width:767px) { .home-hero .hero-stack { min-height: 360px; } }

.auth-fields { border: 0; padding: 0; margin: 0; min-width: 0; display: grid; gap: 18px; }
.auth-fields:disabled { opacity: .65; }
.auth-fields label { min-width: 0; }
.auth-password { display: flex; align-items: center; border: 1px solid var(--control-border); border-radius: var(--radius-sm); overflow: hidden; }
.auth-password input { min-width: 0; width: 100%; border: 0; }
.auth-password button { align-self: stretch; min-width: 64px; padding: 10px; color: var(--text); background: var(--panel-2); border: 0; cursor: pointer; }
.auth-links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; margin: 22px 0; }
.auth-card input { max-width: 100%; }
.auth-card [role=alert] { color: #ffaeb7; }
.auth-card [role=status] { overflow-wrap: anywhere; }

.feed-shell { padding-top: 32px; padding-bottom: 48px; min-height: 70vh; }
.feed-main { min-width: 0; }
.feed-kicker { color: var(--muted); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .13em; }
.home-feed-intro { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-bottom: 24px; }
.home-feed-intro h1 { font-size: clamp(28px,3.5vw,46px); line-height: 1.05; letter-spacing: -.055em; margin: 8px 0 10px; }
.home-feed-intro p { margin: 0; color: var(--muted); font-size: 14px; }
.feed-search-form { display: flex; gap: 8px; align-items: stretch; }
.feed-search-form .vs-search { flex: 1; min-width: 0; border-color: var(--line-strong); border-radius: var(--radius-pill); }
.feed-search-form .vs-button { border-radius: var(--radius-pill); }
.feed-tabs { display: flex; align-items: center; gap: 8px; overflow-x: auto; padding: 16px 2px; scrollbar-width: thin; scrollbar-color: var(--line-strong) transparent; }
.feed-tabs .chip { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; text-align: center; font-size: 12px; flex-shrink: 0; }
.feed-tabs a[aria-current] { background: var(--pink); border-color: var(--pink); color: var(--bg); font-weight: 600; }
.feed-tabs a:hover:not([aria-current]) { color: var(--text); border-color: var(--line-strong); }
.feed-context { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; color: var(--muted); font-size: 12px; }
.feed-context p { margin: 0; }
.feed-context a { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; text-decoration: underline; text-underline-offset: 4px; }
.feed-context > a { flex-shrink: 0; }
.home-feed-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; align-items: start; }
.home-feed-grid .feed-card-featured { grid-column: span 2; }
.feed-card { min-width: 0; break-inside: avoid; margin: 0; position: relative; }
.feed-card-media { position: relative; overflow: hidden; border-radius: var(--radius-md); background: var(--panel); aspect-ratio: var(--feed-ratio); }
.feed-image-link { display: block; width: 100%; height: 100%; }
.feed-card-media img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform var(--duration-normal) var(--ease); }
.feed-image-link:hover img { transform: scale(1.025); }
.feed-card-actions { position: absolute; top: 8px; right: 8px; left: 8px; display: flex; justify-content: space-between; gap: 4px; pointer-events: none; }
.feed-card-actions button { display: flex; align-items: center; justify-content: center; gap: 5px; min-height: 44px; min-width: 44px; padding: 8px; background: #09090de6; border: 1px solid #ffffff26; color: var(--text); border-radius: 8px; cursor: pointer; pointer-events: auto; font-size: 12px; line-height: 1; }
.feed-card-actions button:hover { background: var(--panel-2); border-color: var(--text); }
.feed-card-actions button:disabled { cursor: wait; opacity: .7; }
.feed-card-actions .is-liked { color: var(--accent-hover); }
.feed-card-actions .is-liked svg,.feed-card-actions .is-saved svg { fill: currentColor; }
.feed-card-caption { padding: 10px 2px 16px; }
.feed-card-category { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--muted); font-size: 10px; }
.feed-card-category .vs-category { padding: 0; border: 0; min-height: 20px; font-size: 11px; }
.feed-card-caption h2 { font-size: 16px; line-height: 1.3; letter-spacing: -.025em; margin: 5px 0 9px; overflow-wrap: anywhere; }
.feed-card-caption h2 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.feed-creator { display: flex; align-items: center; gap: 7px; color: var(--muted); min-height: 36px; font-size: 11px; min-width: 0; }
.feed-creator .vs-avatar { width: 26px; height: 26px; font-size: 9px; }
.feed-creator > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.feed-creator:hover { color: var(--text); }
.feed-action-error { color: var(--danger); font-size: 11px; line-height: 1.5; }
.feed-results > .empty-state { min-height: 300px; }
.feed-pagination { display: flex; align-items: center; flex-direction: column; gap: 16px; margin-block: 32px 16px; font-size: 12px; color: var(--muted); text-align: center; }
.feed-pagination p { margin: 0; }
.feed-pagination a { color: var(--text); text-decoration: underline; text-underline-offset: 4px; }
.feed-page + .feed-page { margin-top: 24px; }
.explore-layout { display: grid; grid-template-columns: 176px minmax(0,1fr); gap: 28px; }
.explore-sidebar { position: sticky; top: calc(var(--header-height) + 28px); align-self: start; }
.explore-sidebar .feed-kicker { display: block; padding: 10px 12px; }
.explore-sidebar nav { display: grid; gap: 4px; }
.explore-sidebar nav a { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: var(--radius-sm); color: var(--muted); min-height: 44px; font-size: 12px; }
.explore-sidebar nav a[aria-current] { color: var(--accent-hover); background: var(--panel); box-shadow: inset 2px 0 var(--pink); }
.explore-sidebar nav a:hover { background: var(--panel); color: var(--text); }
.explore-note { margin: 28px 12px; border-top: 1px solid var(--line); padding-top: 20px; color: var(--muted); font-size: 12px; }
.explore-note > span { color: var(--text); font-family: var(--font-space); font-size: 16px; }
.explore-note a { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 8px; min-height: 44px; font-size: 11px; color: var(--text); }
.explore-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 20px; }
.explore-heading h1 { margin: 4px 0 0; font-size: 30px; letter-spacing: -.04em; line-height: 1.1; }
.explore-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.feed-sort { display: flex; align-items: center; gap: 12px; font-size: 11px; color: var(--muted); }
.feed-sort a { display: flex; align-items: center; min-height: 44px; border-bottom: 2px solid transparent; }
.feed-sort a[aria-current] { color: var(--text); border-bottom-color: var(--pink); }
.explore-masonry { column-count: 4; column-gap: 16px; }
.explore-masonry .feed-card { display: inline-block; width: 100%; margin-bottom: 4px; vertical-align: top; }
.public-creator-heading { display: flex; align-items: flex-start; gap: 20px; padding-block: 20px 32px; }
.public-creator-heading h1 { font-size: 32px; margin: 0; overflow-wrap: anywhere; }
.public-creator-heading p { margin: 6px 0 0; color: var(--muted); overflow-wrap: anywhere; }
.public-creator-heading > div { min-width: 0; }
.creator-section-title { font-size: 22px; margin: 0 0 24px; }
@media(min-width:1440px) { .explore-masonry { column-count: 5; } }
@media(max-width:1199px) { .explore-layout { grid-template-columns: 152px minmax(0,1fr); gap: 20px; } .explore-masonry { column-count: 3; } .home-feed-grid { gap: 16px; } }
@media(max-width:1023px) { .explore-sidebar { display: none; } .explore-layout { display: block; } }
@media(max-width:767px) {
 .feed-shell { padding-top: 20px; padding-bottom: 32px; }
 .home-feed-intro { align-items: flex-start; gap: 12px; margin-bottom: 20px; }
 .home-feed-intro h1 { font-size: 29px; margin: 6px 0 8px; }
 .home-feed-intro p { font-size: 12px; max-width: 250px; }
 .home-feed-intro > a { display: none; }
 .feed-kicker { font-size: 9px; }
 .feed-search-form .vs-search { padding-inline: 12px; }
 .feed-search-form input { font-size: 16px; }
 .feed-search-form .vs-button { padding-inline: 12px; font-size: 12px; }
 .feed-context { font-size: 11px; margin-bottom: 14px; }
 .feed-context > a { display: none; }
 .feed-tabs { gap: 6px; padding-block: 12px; }
 .feed-tabs .chip { padding: 8px 13px; font-size: 11px; }
 .home-feed-grid { grid-template-columns: 1fr; gap: 16px; max-width: 560px; margin-inline: auto; }
 .home-feed-grid .feed-card-featured { grid-column: auto; }
 .home-feed-grid .feed-card-featured .feed-card-media { aspect-ratio: 4 / 3; }
 .feed-card-caption h2 { font-size: 16px; }
 .feed-card-caption { padding-top: 8px; }
 .explore-heading { margin-bottom: 16px; }
 .explore-heading h1 { font-size: 26px; }
 .explore-heading > a { padding-inline: 10px; font-size: 11px; }
 .explore-controls { flex-wrap: wrap; gap: 0; margin-bottom: 4px; }
 .explore-controls .feed-tabs { max-width: 100%; }
 .feed-sort { margin-left: 2px; gap: 18px; }
 .feed-sort a { min-height: 36px; }
 .explore-masonry { column-count: 2; column-gap: 12px; }
 .explore-masonry .feed-card-caption h2 { font-size: 13px; }
 .explore-masonry .feed-card-category { gap: 4px; }
 .explore-masonry .feed-card-category time { font-size: 9px; }
 .explore-masonry .feed-creator { font-size: 10px; gap: 5px; }
 .explore-masonry .feed-card-actions { inset: 4px 4px auto; }
 .explore-masonry .feed-card-actions button { padding: 5px; font-size: 10px; }
 .explore-masonry .feed-card-media { border-radius: 8px; }
}
@media(prefers-reduced-motion:reduce) { .feed-image-link:hover img { transform: none; } }
@media(min-width:768px) {
 .explore-masonry[data-count="1"] { column-count: 1; max-width: 380px; }
 .explore-masonry[data-count="2"] { column-count: 2; max-width: 760px; }
 .explore-masonry[data-count="3"] { column-count: 3; }
}
/* Block children avoid inline line-box widow rules leaving unused masonry columns. */
.explore-masonry .feed-card { display: block; }
.feed-search-form .vs-search { border-color: var(--control-border); }
.feed-creator { min-height: 44px; }
.feed-image-link:focus-visible { outline-offset: -4px; }
.feed-card-actions button:focus-visible { outline-offset: -3px; }
@media(max-width:767px) { .feed-sort a { min-height: 44px; } }

/* Keep the footer below the viewport while server-rendered feed content streams. */
.feed-loading{min-height:100svh}

.vehicle-directory,.vehicle-detail{padding-top:34px;padding-bottom:60px}.vehicle-intro{display:flex;justify-content:space-between;gap:32px;align-items:end;margin-bottom:28px}.vehicle-intro h1{font-family:var(--font-space),sans-serif;font-size:clamp(36px,4.3vw,64px);line-height:1.06;letter-spacing:-.055em;max-width:850px;margin:13px 0 16px}.vehicle-intro h1 span{color:var(--pink)}.vehicle-intro p{color:var(--muted);max-width:620px;line-height:1.65;margin:0}.vehicle-intro>a{flex-shrink:0;min-height:44px;display:flex;gap:10px;align-items:center}.vehicle-notice{display:flex;align-items:baseline;gap:14px;border:1px solid var(--line);border-left:3px solid var(--pink);background:var(--panel);padding:14px 18px;font-size:12px;line-height:1.6;margin:22px 0}.vehicle-notice strong{white-space:nowrap;color:var(--text)}.vehicle-notice span{color:var(--muted)}.vehicle-filters{display:grid;grid-template-columns:minmax(180px,1.7fr) repeat(3,minmax(120px,1fr)) auto;gap:12px;align-items:end;border-bottom:1px solid var(--line);padding:14px 0 25px;margin-bottom:28px}.vehicle-filters label{display:grid;gap:8px;min-width:0}.vehicle-filters label>span{font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--muted)}.vehicle-filters input,.vehicle-filters select{width:100%;min-width:0;background:var(--panel);border:1px solid var(--control-border);border-radius:6px;min-height:44px;color:var(--text);padding:9px 12px;font:inherit;font-size:12px}.vehicle-search>div{position:relative}.vehicle-search svg{position:absolute;left:12px;top:13px;color:var(--muted)}.vehicle-search input{padding-left:38px}.vehicle-filters button{min-height:44px}.vehicle-section-heading{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:0 0 18px}.vehicle-section-heading h2{font-size:22px;letter-spacing:-.04em;margin:0}.vehicle-section-heading>span{margin-left:auto;color:var(--muted);font-size:12px}.vehicle-section-heading>a{font-size:12px;color:var(--pink);min-height:44px;display:flex;align-items:center}.vehicle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.vehicle-card{min-width:0;background:var(--panel);border:1px solid var(--line);border-radius:9px;overflow:hidden;transition:border-color .15s}.vehicle-card:hover{border-color:var(--pink)}.vehicle-card-link{display:block;color:inherit;text-decoration:none}.vehicle-card-link:focus-visible{outline:2px solid var(--pink);outline-offset:-3px}.vehicle-media{position:relative;background:#101016;aspect-ratio:3/2;overflow:hidden;width:100%}.vehicle-media img{width:100%;height:100%;object-fit:cover;display:block}.vehicle-image-label{position:absolute;bottom:10px;left:12px;background:#09090ded;border:1px solid #666676;color:#f7f7fa;padding:5px 8px;border-radius:4px;font-size:10px}.vehicle-placeholder{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;color:var(--muted);height:100%;font-size:11px}.vehicle-placeholder svg{opacity:.65}.vehicle-card-copy{padding:16px 18px 18px}.vehicle-make{display:flex;justify-content:space-between;color:var(--muted);text-transform:uppercase;letter-spacing:.09em;font-size:10px;font-weight:600}.vehicle-make>span{font-size:17px;color:var(--pink)}.vehicle-card h3{font-family:var(--font-space),sans-serif;font-size:24px;letter-spacing:-.04em;line-height:1.2;margin:7px 0 16px}.vehicle-card-meta{display:flex;gap:8px;justify-content:space-between;align-items:center;flex-wrap:wrap}.vehicle-card-meta>span:first-child{font-size:11px;color:var(--muted);text-transform:capitalize}.vehicle-verification{display:inline-flex;align-items:center;width:fit-content;gap:5px;font-size:10px;font-weight:500;padding:5px 7px;border:1px solid #666676;border-radius:4px;color:var(--text);line-height:1.3}.vehicle-verification.confirmed{border-color:var(--pink);color:#ff91d1}.vehicle-verification.identified{border-color:#6e7c91;color:#c4d0e1}.vehicle-verification.potential{color:#c9c9d2}.vehicle-pagination{display:flex;justify-content:center;gap:20px;align-items:center;margin:36px 0}.vehicle-pagination>span{font-size:12px;color:var(--muted)}.vehicle-pagination>a{min-height:44px;display:flex;gap:10px;align-items:center}.vehicle-research-footer{font-size:11px;line-height:1.8;color:var(--muted);border-top:1px solid var(--line);padding:22px 0}.vehicle-research-footer a{color:var(--text);text-decoration:underline}.vehicle-back{display:inline-flex;min-height:44px;align-items:center;color:var(--muted);font-size:13px;margin-bottom:14px}.vehicle-detail-top{display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:start}.vehicle-detail-visual{min-width:0}.vehicle-detail-visual .vehicle-media{border:1px solid var(--line);border-radius:10px}.vehicle-image-caption{font-size:11px;color:var(--muted);line-height:1.7;margin:12px 4px}.vehicle-detail-title h1{font-family:var(--font-space),sans-serif;font-size:clamp(34px,4vw,55px);line-height:1.05;letter-spacing:-.05em;margin:12px 0 18px}.vehicle-detail-title>p{color:var(--muted);line-height:1.8;font-size:13px}.vehicle-detail-title>.primary-button{display:inline-flex;align-items:center;min-height:44px;margin:5px 0 15px}.vehicle-detail dl{margin:8px 0}.vehicle-detail dl>div{display:grid;grid-template-columns:1fr 1.3fr;gap:20px;border-bottom:1px solid var(--line);padding:12px 0;font-size:12px}.vehicle-detail dt{color:var(--muted)}.vehicle-detail dd{margin:0;overflow-wrap:anywhere}.vehicle-unknown{font-size:11px!important}.vehicle-evidence{display:grid;grid-template-columns:1fr 1.4fr;gap:60px;border-top:1px solid var(--line);padding:36px 0;margin-top:36px}.vehicle-evidence h2,.vehicle-related h2{font-family:var(--font-space),sans-serif;font-size:28px;letter-spacing:-.04em}.vehicle-evidence p,.vehicle-related p{font-size:13px;color:var(--muted);line-height:1.8}.vehicle-evidence ol{list-style:none;padding:0;margin:0;display:grid;gap:12px}.vehicle-evidence li{border:1px solid var(--line);border-radius:6px;padding:18px}.vehicle-evidence strong{font-size:12px;text-transform:capitalize}.vehicle-evidence small{margin-left:14px;color:var(--muted);font-size:10px}.vehicle-evidence a{display:inline-flex;align-items:center;min-height:44px;font-size:12px;color:var(--pink)}.vehicle-related{border-top:1px solid var(--line);padding:32px 0;scroll-margin-top:90px}.vehicle-related-list{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0}.vehicle-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.vehicle-gallery figure{margin:0;min-width:0}.vehicle-gallery figcaption{font-size:11px;line-height:1.8;padding:10px;color:var(--muted)}
.vehicle-admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.vehicle-admin-grid section{border:1px solid var(--line);padding:20px;border-radius:8px;min-width:0}.vehicle-admin-grid label{display:grid;gap:7px;font-size:12px;margin:14px 0}.vehicle-admin-grid input,.vehicle-admin-grid select,.vehicle-admin-grid textarea{width:100%;min-height:44px;background:var(--panel);color:var(--text);border:1px solid var(--control-border);padding:10px;border-radius:5px}.vehicle-admin-grid textarea{min-height:180px;font-family:monospace;font-size:12px}.vehicle-admin-grid p{color:var(--muted);font-size:12px;line-height:1.7}.vehicle-admin-grid button{margin:5px 10px 5px 0;min-height:44px}.vehicle-admin-list{max-height:450px;overflow:auto;display:grid;gap:8px}.vehicle-admin-list button{text-align:left;border:1px solid var(--control-border);background:var(--panel);color:var(--text);padding:10px;border-radius:5px}.vehicle-admin-status{border:1px solid var(--line);padding:16px;margin:18px 0;overflow-wrap:anywhere;font-size:13px}.vehicle-admin-preview{overflow:auto;max-height:400px;font-size:12px}.vehicle-admin-preview td,.vehicle-admin-preview th{padding:10px;text-align:left;border-bottom:1px solid var(--line)}
@media(min-width:1500px){.vehicle-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:1000px){.vehicle-filters{grid-template-columns:2fr 1fr 1fr}.vehicle-filters .vehicle-search{grid-column:1/-1}.vehicle-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.vehicle-detail-top{gap:24px;grid-template-columns:1.2fr 1fr}.vehicle-intro{align-items:start}.vehicle-intro>a{display:none}}@media(max-width:650px){.vehicle-directory,.vehicle-detail{padding-top:24px}.vehicle-intro{margin-bottom:22px}.vehicle-intro h1{font-size:40px}.vehicle-intro p{font-size:12px}.vehicle-notice{flex-direction:column;gap:4px;padding:12px}.vehicle-filters{grid-template-columns:1fr 1fr;gap:13px;padding-top:8px}.vehicle-filters label:last-of-type{grid-column:1}.vehicle-filters button{grid-column:2}.vehicle-grid{gap:13px}.vehicle-card-copy{padding:13px 11px}.vehicle-card h3{font-size:19px;margin:6px 0 12px}.vehicle-make{font-size:9px;letter-spacing:.04em}.vehicle-card-meta{align-items:start;flex-direction:column;gap:8px}.vehicle-verification{font-size:9px;max-width:100%}.vehicle-image-label{bottom:6px;left:6px;padding:4px 5px;font-size:8px}.vehicle-section-heading{gap:12px}.vehicle-section-heading h2{font-size:20px}.vehicle-section-heading>span{font-size:11px}.vehicle-placeholder{gap:8px;font-size:9px}.vehicle-detail-top,.vehicle-evidence,.vehicle-admin-grid{grid-template-columns:1fr;gap:24px}.vehicle-detail-title h1{font-size:40px}.vehicle-evidence{margin-top:25px;padding-top:25px}.vehicle-gallery{grid-template-columns:1fr 1fr}.vehicle-research-footer{font-size:10px}}
@media(prefers-reduced-motion:reduce){.vehicle-card{transition:none}}

.vehicle-placeholder{position:relative;overflow:hidden;min-height:200px;gap:10px;background:#0e1118;border-bottom:1px solid #28202c}.vehicle-placeholder-mark{position:absolute;right:20px;bottom:-35px;font-size:180px;font-weight:900;line-height:1;color:#191820;letter-spacing:-20px;pointer-events:none}.vehicle-placeholder>svg,.vehicle-placeholder>span:not(.vehicle-placeholder-mark),.vehicle-placeholder>small{position:relative}.vehicle-placeholder small{font-size:11px;color:#777682}.vehicle-filters{grid-template-columns:minmax(180px,2fr) repeat(4,minmax(110px,1fr)) auto}.vehicle-related .feed-pagination{display:none}@media(max-width:1100px){.vehicle-filters{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:600px){.vehicle-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.vehicle-search{grid-column:1/-1}.vehicle-placeholder{min-height:155px}.vehicle-placeholder-mark{font-size:140px}}
@media(max-width:600px){.vehicle-filters label:last-of-type{grid-column:auto}.vehicle-filters button{grid-column:1/-1}}

@font-face{font-family:Inter;src:url('/fonts/inter.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:Space Grotesk;src:url('/fonts/space-grotesk.woff2') format('woff2');font-weight:300 700;font-display:swap}
:root{--font-inter:Inter;--font-space:'Space Grotesk'}
.public-status{margin-left:auto;color:var(--accent-hover);border:1px solid var(--line-strong);border-radius:var(--radius-pill);padding:5px 12px;font-size:11px;white-space:nowrap}
.home-feed-intro p{max-width:650px;line-height:1.7}
.feed-tabs{border-bottom:1px solid var(--line)}
section[id]{scroll-margin-top:calc(var(--header-height) + 20px)}
.public-evidence{display:flex;align-items:center;gap:8px;min-height:44px;font-size:12px;color:var(--accent-hover);width:fit-content;text-decoration:underline;text-underline-offset:4px;margin-top:8px}
.public-source-note{font-size:11px;color:var(--muted);margin:0;line-height:1.6}
.public-community-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.public-community-grid .scan-panel{padding:24px}
.public-community-grid svg{color:var(--pink);display:block;margin-bottom:20px}
.public-community-grid h3{font-size:19px;letter-spacing:-.035em;line-height:1.3}
.public-community-grid p,.public-about p{color:var(--muted);font-size:13px;line-height:1.8}
.public-about{border-top:1px solid var(--line);margin-top:40px;padding-block:32px 8px}
.public-about h2{font-size:clamp(24px,3vw,32px);letter-spacing:-.04em;margin:8px 0}
.public-about p{max-width:650px;margin-bottom:22px}
.footer p{margin:0;max-width:700px;line-height:1.7}
.public-bottom-nav{grid-template-columns:repeat(3,minmax(0,1fr))}
.vehicle-placeholder{min-height:0;height:100%;padding:16px;text-align:center}
.vehicle-placeholder small{color:var(--muted)}
@media(max-width:767px){.public-status{padding:5px 9px;font-size:10px}.home-feed-intro p{max-width:100%}.public-community-grid{grid-template-columns:1fr;gap:13px}.vehicle-grid{grid-template-columns:1fr}.vehicle-placeholder-mark{font-size:180px}.vehicle-card h3{font-size:24px}.public-bottom-nav{grid-template-columns:repeat(3,minmax(0,1fr))}.public-community-grid .scan-panel{padding:20px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}