/* base — reset + the few things every surface shares.
   If a rule is only used by one layout, it does NOT belong here. */

*{box-sizing:border-box; margin:0; padding:0}
/* form controls do NOT inherit typography by default — without this, any
   unstyled control falls back to the UA's mono/system look (the latent bug
   behind the campaign form review, 06-campaign-ui-fixes §3.1) */
input, textarea, select, button{font:inherit; color:inherit}
/* reserve the scrollbar gutter always, so short vs long pages don't shift the
   centered layout sideways as you navigate */
html{font-size:16px; scroll-behavior:smooth; scrollbar-gutter:stable}

/* default link color — surfaces override locally where they need to */
a{color:var(--accent-soft); text-decoration:none}
a:hover{text-decoration:underline; text-underline-offset:3px}

/* shared pulse: lander dot, dashboard unsaved-dot, ident dot */
@keyframes blink{50%{opacity:.35}}

/* consent banner: rendered by both the `application` and `app` layouts now,
   so it cannot live in lander.css the way it used to */
.consent-banner[hidden]{display:none}
.consent-banner{position:fixed; left:0; right:0; bottom:0; z-index:80;
  display:flex; align-items:center; gap:var(--s4); flex-wrap:wrap;
  background:var(--card); color:var(--ink); border-top:1px solid var(--line);
  box-shadow:0 -10px 40px rgba(0,0,0,.12); padding:var(--s3) var(--s5)}
.consent-banner p{font-size:.875rem; color:var(--muted); margin:0; flex:1; min-width:260px}
.consent-banner p a{text-decoration:underline; text-underline-offset:2px}
.cb-mark{flex:none; color:var(--accent-soft)}
.cb-mark .zzmark{height:16px}
.cb-actions{display:flex; gap:var(--s2); flex:none}
.cb-actions button{font-size:.875rem; font-weight:600; cursor:pointer;
  padding:9px 18px; border-radius:8px}
.cb-allow{background:var(--accent); color:var(--vanilla); border:none}
.cb-allow:hover{background:var(--accent-soft)}
.cb-decline{background:none; color:var(--ink); border:1px solid var(--line)}
.cb-decline:hover{border-color:var(--ink)}
@media (max-width:560px){ .cb-actions{width:100%} .cb-actions button{flex:1} }

/* ZZ mark (toasts, platform-voice, small inline uses) */
.zzmark{height:1.15em; width:auto; display:inline-block; vertical-align:-0.18em}

/* zztapes lockup — golden-block wordmark (shared/_logo, 2026-07-25).
   Colour comes from currentColor: set it on the parent, never inside the SVG. */
.logo{display:inline-flex; align-items:center; gap:9px; text-decoration:none; color:inherit}
.logo:hover{text-decoration:none}
.logo .wm{display:block; height:22px; width:auto}
.logo--sm .wm{height:15px}
.logo--lg .wm{height:34px}
.logo .zz{display:block; height:20px; width:auto}
.logo--accent .zz-ink{fill:var(--zz-accent)} /* amber zz — marketing surfaces only */
.logo .dot{width:8px; height:8px; border-radius:50%; background:var(--signal);
           box-shadow:0 0 10px var(--signal); animation:blink 1.8s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){ .logo .dot{animation:none} }
@media (max-width:600px){ .logo .wm{height:19px} }

/* horizon frame — the gradient ribbon runs around the whole viewport
   (lander + band pages; the white tool gets a single top pinstripe instead).
   Signal run: cyan → violet → ultraviolet → signal pink → pale pink. The
   ribbon is a token-level thing: --ribbon-h / --ribbon-v so the pinstripe in
   dashboard.css reads the same gradient instead of carrying its own copy. */
:root{
  --ribbon-h:linear-gradient(90deg,#5ce6ff,#8a7cff 26%,#3b1e8f 48%,#ff3d7f 74%,#ffb3c9);
  --ribbon-h-rev:linear-gradient(270deg,#5ce6ff,#8a7cff 26%,#3b1e8f 48%,#ff3d7f 74%,#ffb3c9);
  --ribbon-v:linear-gradient(180deg,#ffb3c9,#ff3d7f 26%,#3b1e8f 52%,#8a7cff 74%,#5ce6ff);
  --ribbon-v-rev:linear-gradient(0deg,#ffb3c9,#ff3d7f 26%,#3b1e8f 52%,#8a7cff 74%,#5ce6ff);
}
body:not(.app)::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:60;
  background:
    var(--ribbon-h) top/100% 5px no-repeat,
    var(--ribbon-v) right/5px 100% no-repeat,
    var(--ribbon-h-rev) bottom/100% 5px no-repeat,
    var(--ribbon-v-rev) left/5px 100% no-repeat;
}

/* build stamp in footers */
.ver{font-variant-numeric:tabular-nums; white-space:nowrap; opacity:.65}