/* ============================================================
   Surf China — the wave levels' colours, one per tier: a setting's `tier` in
   Assets/sc-surf-calendar.js SETTINGS, and p for the private-only settings.
   Ramp: warm sand → teal → ocean → rust → ink, inside the site palette.
   ============================================================ */
:root{
  --lv-b2-bg:#faf1dc; --lv-b2-br:#e3ca92; --lv-b2-ink:#856327; --lv-b2-dot:#c4a265;
  --lv-b4-bg:#e3f1f2; --lv-b4-br:#a3d0d4; --lv-b4-ink:#1d666e; --lv-b4-dot:#2d8a94;
  --lv-i-bg:#e2edf4;  --lv-i-br:#9fc3d6;  --lv-i-ink:#0a4d68;  --lv-i-dot:#1a7a9b;
  --lv-a-bg:#fbe8e0;  --lv-a-br:#eab9a5;  --lv-a-ink:#a04c2a;  --lv-a-dot:#d4856a;
  --lv-p-bg:#22252b;  --lv-p-br:#3d424c;  --lv-p-ink:#e2c98d;  --lv-p-dot:#c4a265;
}
/* A setting's chip: `<span class="lv lv--{tier}">` plus the page's own sizing class or `.lv`
   rule (with a 1px border); two classes here so the colour wins wherever this file is linked. */
.lv.lv--b2{background:var(--lv-b2-bg);border-color:var(--lv-b2-br);color:var(--lv-b2-ink)}
.lv.lv--b4{background:var(--lv-b4-bg);border-color:var(--lv-b4-br);color:var(--lv-b4-ink)}
.lv.lv--i{background:var(--lv-i-bg);border-color:var(--lv-i-br);color:var(--lv-i-ink)}
.lv.lv--a{background:var(--lv-a-bg);border-color:var(--lv-a-br);color:var(--lv-a-ink)}
.lv.lv--p{background:var(--lv-p-bg);border-color:var(--lv-p-br);color:var(--lv-p-ink)}