/* cargo round 2 — the confirmed look: B (Sea Lane) in RideGY's tokens */
:root {
  --brand:#0F8F50; --brand-deep:#0B6F3E; --brand-soft:#DCEFE3; --brand-fade:#F0F8F3;
  --gold:#F4B400; --gold-deep:#C99700; --gold-soft:#FCEFC2;
  --red:#D72638; --red-deep:#A41A28; --red-soft:#F9DBDF;
  --ink:#0E1311; --ink-soft:#2A2F2D; --mute:#686B62; --line:#E7E1D2;
  --cream:#FBF8F2; --cream-soft:#F4EFE5; --card:#FFFFFF;
  --water:#073F24; --water2:#0B6F3E;
}
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:"Hanken Grotesk", system-ui, sans-serif; font-size:16px; line-height:1.5; }
h1, h2, h3, .display { font-family:"Bricolage Grotesque", system-ui, sans-serif; letter-spacing:-0.02em; }
.wave { height:4px; background:linear-gradient(90deg, var(--brand) 0 56%, var(--gold) 56% 88%, var(--red) 88% 100%); }
.card { background:var(--card); border:1px solid var(--line); border-radius:18px; }
.pill { display:inline-block; font-size:13px; font-weight:600; padding:4px 10px; border-radius:999px; background:var(--brand-soft); color:var(--brand-deep); }
.pill.gold { background:var(--gold-soft); color:var(--ink); }
.pill.red { background:var(--red-soft); color:var(--red-deep); }
.pill.mute { background:var(--cream-soft); color:var(--mute); }
.btn { font:inherit; font-weight:700; padding:13px 18px; border-radius:999px; border:1.5px solid var(--ink); background:transparent; color:var(--ink); cursor:pointer; }
.btn.primary { background:var(--gold); border-color:var(--gold); color:var(--ink); }
.btn.quiet { border-color:var(--line); color:var(--ink); }
.btn:focus-visible, button:focus-visible, a:focus-visible, input:focus-visible { outline:3px solid var(--brand); outline-offset:3px; }
.num { font-variant-numeric:tabular-nums; }
.mute { color:var(--mute); }