:root {
  color-scheme: light;
  --black: #0b100c;
  --ink: #182019;
  --muted: #647064;
  --cream: #f7f5e9;
  --paper: rgba(255, 255, 248, 0.96);
  --line: rgba(64, 88, 35, 0.2);
  --lime: #9bd400;
  --lime-dark: #5c7e00;
  --orange: #ff6a00;
  --red: #a23a30;
  --shadow: 0 18px 45px rgba(9, 17, 10, 0.16);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  background:
    linear-gradient(180deg, rgba(6, 10, 7, 0.86) 0, rgba(247, 245, 233, 0.92) 430px),
    url("../hay/assets/tractor-field-bg.png") center top / cover fixed;
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body::before {
  content: "";
  position: fixed;
  inset: 120px auto auto 50%;
  width: min(720px, 80vw);
  aspect-ratio: 1;
  background: url("../assets/trailblazer-logo.png") center / contain no-repeat;
  opacity: 0.035;
  transform: translateX(-50%);
  pointer-events: none;
}

button, input, select, textarea { font: inherit; }
button, .file-button { cursor: pointer; }

.site-nav {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  border-bottom: 1px solid rgba(255,255,255,.18);
  background: rgba(5, 5, 5, .92);
  padding: 11px max(16px, calc((100vw - 1320px) / 2));
  backdrop-filter: blur(12px);
}

.brand-link { display:flex; align-items:center; gap:10px; color:#fff9dc; font-weight:950; text-decoration:none; }
.brand-link img { width:42px; height:42px; object-fit:contain; }
.site-links { display:flex; flex-wrap:wrap; gap:7px; }
.site-links a { border:1px solid rgba(255,255,255,.3); border-radius:999px; padding:8px 11px; color:#fff9dc; font-size:.85rem; font-weight:850; text-decoration:none; }
.site-links a:hover, .site-links a:focus-visible, .site-links a.active { background:var(--lime); color:var(--black); outline:0; }

main { position:relative; width:min(1320px, calc(100% - 32px)); margin:auto; padding:30px 0 45px; }
.hero { display:flex; justify-content:space-between; align-items:center; gap:24px; min-height:190px; color:#fffbe0; }
.hero img { width:clamp(110px, 12vw, 165px); filter:drop-shadow(0 18px 24px rgba(0,0,0,.45)); }
.eyebrow, .step { margin:0 0 8px; color:var(--lime-dark); font-size:.78rem; font-weight:950; letter-spacing:.09em; text-transform:uppercase; }
.hero .eyebrow { color:var(--lime); }
h1 { margin:0; font-size:clamp(2.7rem, 6vw, 5.4rem); line-height:.95; }
h2 { margin:0; font-size:clamp(1.35rem, 2vw, 1.9rem); line-height:1.05; }
.intro { max-width:700px; margin:15px 0 0; color:#f6edbe; font-size:clamp(1rem, 2vw, 1.25rem); font-weight:700; }

.privacy-note { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:15px; border-left:5px solid var(--orange); border-radius:8px; background:#111612; padding:14px 17px; color:#f5f0d8; }
.privacy-note strong { color:var(--lime); }

.dashboard-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:15px; }
.content-grid { display:grid; grid-template-columns:minmax(0, 1.4fr) minmax(310px, .6fr); gap:15px; margin-top:15px; }
.side-stack { display:grid; gap:15px; align-content:start; }
.panel { border:1px solid var(--line); border-radius:10px; background:var(--paper); box-shadow:var(--shadow); padding:20px; }
.section-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:14px; margin-bottom:18px; }

.form-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:14px; }
.form-grid.compact { grid-template-columns:repeat(3, minmax(0,1fr)); }
label { display:grid; gap:7px; color:#3f4c40; font-size:.88rem; font-weight:850; }
input, select, textarea { width:100%; border:1px solid #cbd1c5; border-radius:7px; background:#fff; padding:11px 12px; color:var(--ink); }
input:focus, select:focus, textarea:focus { border-color:var(--lime-dark); outline:3px solid rgba(155,212,0,.2); }
textarea { resize:vertical; }
.full-width { grid-column:1 / -1; }
.money-input, .unit-input { display:flex; align-items:center; border:1px solid #cbd1c5; border-radius:7px; background:#fff; overflow:hidden; }
.money-input span, .unit-input span { padding:0 10px; color:var(--muted); font-weight:900; }
.money-input input, .unit-input input { border:0; border-radius:0; outline:0; }

.primary-button, .secondary-button, .danger-button, .file-button { border:0; border-radius:999px; padding:11px 15px; font-weight:950; text-align:center; }
.primary-button { background:var(--lime); color:var(--black); box-shadow:0 12px 24px rgba(123,172,0,.2); }
.secondary-button, .file-button { border:1px solid var(--line); background:#f1f4e4; color:var(--ink); }
.danger-button { width:100%; margin-top:10px; background:#f8e2de; color:var(--red); }
.button-row { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.file-button input { display:none; }

.metric-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:15px; }
.metric-grid div, .price-ladder div { border:1px solid var(--line); border-radius:8px; background:#f6f7ed; padding:14px; }
.metric-grid span, .price-ladder span { display:block; margin-bottom:5px; color:var(--muted); font-size:.78rem; font-weight:850; text-transform:uppercase; }
.metric-grid strong, .price-ladder strong { font-size:clamp(1.4rem, 3vw, 2.1rem); }
.metric-grid .featured { background:var(--black); color:white; }
.metric-grid .featured span { color:var(--lime); }
.confidence { margin-top:12px; border-left:4px solid var(--lime); padding:9px 11px; color:var(--muted); font-weight:750; line-height:1.4; }

.recommendation-panel { display:grid; grid-template-columns:1fr minmax(390px,.7fr); gap:25px; align-items:center; margin-top:15px; border-left:6px solid var(--lime); }
.recommendation-panel p:not(.step) { max-width:700px; color:var(--muted); line-height:1.45; }
.price-ladder { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.price-ladder .recommended { background:var(--lime); color:var(--black); }

.paste-helper { margin-bottom:18px; border:1px dashed #b8c1aa; border-radius:8px; background:#f6f7ed; padding:12px; }
.paste-helper summary { cursor:pointer; font-weight:900; }
.paste-helper label { margin-top:12px; }
.paste-helper button { margin-top:9px; }
.helper-text { margin:10px 0 0; color:var(--muted); font-size:.84rem; line-height:1.45; }
.baseline-list { display:grid; gap:8px; margin-top:14px; }
.baseline-item { display:grid; grid-template-columns:1fr auto; gap:10px; border-bottom:1px solid var(--line); padding:9px 0; }
.baseline-item span { color:var(--muted); font-size:.84rem; }
.baseline-item strong { white-space:nowrap; }
.sources-panel a { display:flex; justify-content:space-between; border-bottom:1px solid var(--line); padding:12px 0; color:var(--ink); font-weight:850; text-decoration:none; }
.sources-panel a:hover { color:var(--lime-dark); }

.listings-panel { margin-top:15px; }
.count-pill { border-radius:999px; background:#e9f5c9; padding:7px 11px; font-size:.82rem; font-weight:900; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; min-width:850px; }
th, td { border-bottom:1px solid var(--line); padding:12px 9px; text-align:left; vertical-align:top; }
th { color:var(--muted); font-size:.75rem; text-transform:uppercase; }
td { font-size:.9rem; }
.listing-title { display:block; font-weight:900; }
.listing-source, .subtext { display:block; margin-top:3px; color:var(--muted); font-size:.78rem; }
.price-cell { font-size:1.05rem; font-weight:950; }
.row-link { color:var(--lime-dark); font-weight:900; }
.delete-row { border:0; background:transparent; color:var(--red); font-weight:900; }
.empty-state { border:1px dashed #c4cab9; border-radius:8px; padding:25px; color:var(--muted); text-align:center; }
.table-wrap:has(tbody:not(:empty)) + .empty-state { display:none; }

footer { display:flex; justify-content:space-between; gap:16px; margin-top:22px; border-top:1px solid rgba(30,40,30,.2); padding-top:18px; color:#4f5d50; font-size:.82rem; font-weight:700; }

@media (max-width: 900px) {
  .dashboard-grid, .content-grid, .recommendation-panel { grid-template-columns:1fr; }
  .form-grid.compact { grid-template-columns:repeat(2,1fr); }
  .recommendation-panel { gap:15px; }
}

@media (max-width: 650px) {
  .site-nav { align-items:flex-start; flex-direction:column; }
  .site-links { flex-wrap:nowrap; width:100%; overflow-x:auto; padding-bottom:3px; }
  .site-links a { flex:0 0 auto; }
  main { width:min(100% - 20px, 1320px); padding-top:18px; }
  .hero { min-height:150px; }
  .hero img { width:90px; }
  .form-grid, .form-grid.compact, .metric-grid { grid-template-columns:1fr; }
  .price-ladder { grid-template-columns:1fr; }
  .privacy-note { display:grid; }
  .panel { padding:16px; }
  footer { flex-direction:column; }
}
