/* =====================================================================
   Amplify preview — new designs combined into one simulated app.
   Feed (feed.html) · Discover (discover.html) · Gigs (gig_map.html) · Profile (profiles.html, design 2)
   ===================================================================== */
:root{
  /* ---- Site palette (style.css), light by default. Dark applies when the device prefers it unless the
     visitor chose light, or when they chose dark: the same three blocks as the main site. ---- */
  color-scheme:light;
  --bg:#f6f5fb;
  --surface:#ffffff;
  --tint:#ece8fb;
  --tint-2:#e1dbf8;
  --text:#16131f;
  --muted:#5d586b;
  --line:rgba(40,25,90,.1);
  --line-strong:rgba(40,25,90,.22);
  --accent:#6340e0;
  --accent-hi:#7c5cec;
  --on-accent:#ffffff;
  /* Preview extras, in the same spirit: accent text, status colours and the bases of translucent tints */
  --accent-text:#4f30c4;   /* accent used as text/icons on --bg and --surface */
  --accent-soft:#8f7fd0;
  --danger:#b1452a;
  --cat-gig:#8a3a0c;
  --cat-ann:#8a6100;
  --ink-rgb:22 19 31;      /* text colour, for translucent fills and hairlines: rgb(var(--ink-rgb) / .08) */
  --shade-rgb:70 45 160;   /* shadows (the site's light shadows are tinted purple) */
  --accent-rgb:99 64 224;
  --scrim-rgb:255 255 255; /* frosted glass over the app */
  --glow-1:#e4dcff; --glow-2:#ece6ff; --glow-3:#efeafd; /* page background glows */
  --shade-k:.45;           /* light shadows are softer: alpha multiplier for rgb(var(--shade-rgb) / ...) */
  --amber:#a8640f;         /* "saved" icon */
  --spotify-text:#127a3c;
  --field-line:#7f7990;    /* text field borders: 3:1 or more against every surface (WCAG 1.4.11) */
  /* Gig map (drawn in gig-map.js) */
  --map-bg:#ebe7f7; --map-block:#e0daf3; --map-park:#d7cdf3; --map-river-1:#cfc4f1; --map-river-2:#bfb1ec;
  --map-road:rgb(79 48 196 / .12); --map-road-main:rgb(79 48 196 / .22); --map-label:rgb(79 48 196 / .75);

  /* ---- The app's own token names, pointed at the site palette ---- */
  --black:var(--bg);
  --charcoal:var(--surface);
  --panel:var(--tint);
  --cream:var(--text);
  --cream-dim:var(--muted);
  --sage-2:var(--accent-soft);
  --sage-3:var(--accent);
  --sage-4:var(--accent-text);

  --font-display:'Inter', sans-serif;
  --font-body:'Inter', sans-serif;
  --font-mono:'IBM Plex Mono', monospace;
  --font-site:'Outfit', system-ui, sans-serif; /* the main site's font: preview chrome (bar, notices, cookie banner) */
  --ease-spring:cubic-bezier(.34,1.45,.4,1);
  --ease-out:cubic-bezier(.22,.9,.32,1);
  --bar-h:56px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme='light']){
    color-scheme:dark;
    --bg:#0f0d16; --surface:#191623; --tint:#211c33; --tint-2:#2a2442;
    --text:#f1eff7; --muted:#aaa4bb; --line:rgba(200,185,255,.12); --line-strong:rgba(200,185,255,.24);
    --accent:#a78bfa; --accent-hi:#c4b1fd; --on-accent:#120f1b;
    --accent-text:#cbb8f5; --accent-soft:#6f5fa3;
    --danger:#e08a72; --cat-gig:#ffb37a; --cat-ann:#f2c14e;
    --ink-rgb:241 239 247; --shade-rgb:0 0 0; --accent-rgb:167 139 250; --scrim-rgb:20 16 31;
    --glow-1:#2a1f52; --glow-2:#241a48; --glow-3:#201a3d;
    --shade-k:1; --field-line:#77718d; --amber:#e0a35c; --spotify-text:#7ee2a2; --map-bg:#17122a; --map-block:#1d1733; --map-park:#211a3b; --map-river-1:#2c2350; --map-river-2:#33295c; --map-road:rgb(203 184 245 / .10); --map-road-main:rgb(203 184 245 / .18); --map-label:rgb(203 184 245 / .38);
  }
}
:root[data-theme='dark']{
  color-scheme:dark;
  --bg:#0f0d16; --surface:#191623; --tint:#211c33; --tint-2:#2a2442;
  --text:#f1eff7; --muted:#aaa4bb; --line:rgba(200,185,255,.12); --line-strong:rgba(200,185,255,.24);
  --accent:#a78bfa; --accent-hi:#c4b1fd; --on-accent:#120f1b;
  --accent-text:#cbb8f5; --accent-soft:#6f5fa3;
  --danger:#e08a72; --cat-gig:#ffb37a; --cat-ann:#f2c14e;
  --ink-rgb:241 239 247; --shade-rgb:0 0 0; --accent-rgb:167 139 250; --scrim-rgb:20 16 31;
  --glow-1:#2a1f52; --glow-2:#241a48; --glow-3:#201a3d;
  --shade-k:1; --field-line:#77718d; --amber:#e0a35c; --spotify-text:#7ee2a2; --map-bg:#17122a; --map-block:#1d1733; --map-park:#211a3b; --map-river-1:#2c2350; --map-river-2:#33295c; --map-road:rgb(203 184 245 / .10); --map-road-main:rgb(203 184 245 / .18); --map-label:rgb(203 184 245 / .38);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;overflow-x:hidden;}
body{
  background:
    radial-gradient(ellipse 900px 520px at 50% -10%, var(--glow-1) 0%, transparent 60%),
    radial-gradient(ellipse 700px 420px at 100% 40%, var(--glow-2) 0%, transparent 55%),
    radial-gradient(ellipse 700px 420px at 0% 75%, var(--glow-3) 0%, transparent 55%),
    var(--black);
  color:var(--cream); font-family:var(--font-body); min-height:100vh;
  display:flex; flex-direction:column; align-items:center; padding:18px 14px 22px;
}
::selection{background:var(--accent);color:var(--on-accent);}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;}
button:focus-visible,[tabindex]:focus-visible,input:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid var(--sage-4);outline-offset:2px;}
button[disabled]{opacity:.35;cursor:not-allowed;}
img{display:block;max-width:100%;}
mark{background:rgb(var(--accent-rgb) / .28);color:inherit;border-radius:3px;padding:0 1px;}