/* Riptide Supplies — styles shared by every page.
   Load this BEFORE each page's own <style> block so page-level tokens
   (--radius, --shadow, --danger, --panel, …) can still override these. */

:root{
  /* ---- RIPTIDE BRAND PALETTE (sampled from logo) ---- */
  --navy:#0d3b5c;      /* deep ocean blue */
  --deep:#082a41;      /* darkest navy */
  --teal:#2f9fb0;      /* primary teal */
  --teal-dark:#1f7c8a; /* deep teal */
  --aqua:#6fd0d6;      /* foam aqua */
  --foam:#eaf7f8;      /* light foam */
  --sunset:#ef8a3c;    /* sunset orange accent */
  --gold:#f5c451;      /* sun gold accent */
  --plum:#8a5a9e;      /* sunset purple accent */
  --coral:#e2795f;     /* warm coral accent */
  --sand:#eef4f6;      /* page background (ocean tint) */
  --ink:#0c2233;
  --paper:#ffffff;
  --muted:#5f7585;
  --line:#dbe6ea;
  --ok:#1f9d55;
}

/* ---------- AGE / RESEARCH DISCLAIMER GATE ---------- */
#ageGate{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;
  padding:calc(24px + env(safe-area-inset-top,0px)) 24px calc(24px + env(safe-area-inset-bottom,0px));background:linear-gradient(160deg,rgba(8,42,65,.975),rgba(13,59,92,.975));
  backdrop-filter:blur(7px);overflow-y:auto}
#ageGate.hidden{display:none}
.gate-card{background:var(--paper);max-width:530px;width:100%;border-radius:20px;padding:36px 32px;
  box-shadow:var(--shadow-lg);text-align:center;margin:auto}
.gate-mark{width:66px;height:66px;margin:0 auto 16px;display:block}
.gate-card h2{font-size:25px;font-weight:800;color:var(--ink);letter-spacing:-.3px}
.gate-card .gsub{color:var(--muted);font-size:14px;margin-top:10px;line-height:1.55}
.gate-checks{text-align:left;margin:22px 0 6px;display:flex;flex-direction:column;gap:13px}
.gate-check{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--ink);cursor:pointer;
  background:var(--sand);border:1px solid var(--line);border-radius:12px;padding:14px 16px;transition:.18s}
.gate-check:hover{border-color:var(--teal)}
.gate-check input{width:20px;height:20px;margin-top:1px;accent-color:var(--teal);flex-shrink:0;cursor:pointer}
.gate-check b{color:var(--ink)}
.gate-enter{width:100%;margin-top:20px;background:var(--teal);color:#012;border:0;border-radius:12px;
  padding:15px;font-weight:800;font-size:15px;cursor:pointer;transition:.2s}
.gate-enter:hover:not(:disabled){background:var(--aqua)}
.gate-enter:disabled{opacity:.42;cursor:not-allowed}
.gate-exit{display:inline-block;margin-top:14px;color:var(--muted);font-size:13px;cursor:pointer;
  background:none;border:0;text-decoration:underline}
.gate-fine{font-size:11.5px;color:var(--muted);margin-top:18px;line-height:1.5}