@import url("/static/fonts/fonts.css");
/* Songpot design tokens: the vinyl look (steel page, dot-matrix display type, mono labels). One palette for every
   page: festival planner, list pages and the city guide. data-theme="light|dark" overrides the OS.
   Dark is a night shift, not an inversion ("Graphite", 2026-10-13): graphite page, rules and outlines in a soft --sp-edge
   instead of white, sleeves and vinyl stay black so records read as objects, ticket colours a little dimmer.
   Buttons keep the bright ink fill, so the action is still the brightest thing on the page. */
:root {
  color-scheme: light;
  --sp-paper: #eceef1;
  --sp-card: #f7f8fa;
  --sp-ink: #12151b;
  --sp-mute: #5c6472;
  --sp-rule: #d6dae1;
  --sp-signal: #4636ff;
  --sp-warn: #c2364f;
  --sp-ok: #1f8a5b;
  --sp-accent: #12151b;
  --sp-on-accent: #eceef1;
  --sp-led: #101217;
  --sp-led-off: #262a33;
  --sp-led-text: #aab1bd;
  --sp-lit: #8e84ff;
  --sp-vinyl: #0c0d10;
  --sp-groove: #c9ced6;
  --sp-edge: #12151b;          /* rules and outlines: ink by day, a softer line at night */
  --sp-sleeve: #12151b;        /* record sleeves stay black in both themes */
  --sp-on-sleeve: #eceef1;
  --sp-sleeve-edge: transparent;
  --sp-space-1: 4px;
  --sp-space-2: 8px;
  --sp-space-3: 12px;
  --sp-space-4: 16px;
  --sp-space-6: 24px;
  --sp-radius: 2px;
  --sp-motion: 220ms;
  --sp-sans: "Hanken Grotesk", "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
  --sp-mono: "Martian Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --sp-dot: "Doto", "Martian Mono", ui-monospace, monospace;
  --paper: var(--sp-paper);
  --card: var(--sp-card);
  --ink: var(--sp-ink);
  --mute: var(--sp-mute);
  --rule: var(--sp-edge);
  --line: var(--sp-rule);
  --accent: var(--sp-accent);
  --onaccent: var(--sp-on-accent);
  --signal: var(--sp-signal);
  --warn: var(--sp-warn);
  --mono: var(--sp-mono);
  --sans: var(--sp-sans);
  --dot: var(--sp-dot);
  --record-house: #c2e9da; --record-house-deep: #16795a;
  --record-techno: #d3caf6; --record-techno-deep: #5b3fd4;
  --record-live: #f1dcc5; --record-live-deep: #9a4f17;
  --record-talk: #dde2ea; --record-talk-deep: #3f4b60;
  --record-art: #c7e8ee; --record-art-deep: #0f7686;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --sp-paper: #16181c; --sp-card: #1d2025; --sp-ink: #e3e6eb; --sp-mute: #99a0ac; --sp-rule: #30343c; --sp-edge: #4a4f59;
    --sp-signal: #8e84ff; --sp-warn: #ff8396; --sp-ok: #5fd19c; --sp-accent: #e3e6eb; --sp-on-accent: #121417;
    --sp-led: #07080a; --sp-led-off: #1d2027; --sp-vinyl: #08090b; --sp-groove: #3a3e47;
    --sp-sleeve: #0a0b0d; --sp-on-sleeve: #e3e6eb; --sp-sleeve-edge: #3b3f48;
    --record-house: #9fbfb4; --record-house-deep: #9fbfb4; --record-techno: #ada6ca; --record-techno-deep: #ada6ca;
    --record-live: #c5b5a3; --record-live-deep: #c5b5a3; --record-talk: #b5bac1; --record-talk-deep: #b5bac1;
    --record-art: #a4bec4; --record-art-deep: #a4bec4;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --sp-paper: #16181c; --sp-card: #1d2025; --sp-ink: #e3e6eb; --sp-mute: #99a0ac; --sp-rule: #30343c; --sp-edge: #4a4f59;
  --sp-signal: #8e84ff; --sp-warn: #ff8396; --sp-ok: #5fd19c; --sp-accent: #e3e6eb; --sp-on-accent: #121417;
  --sp-led: #07080a; --sp-led-off: #1d2027; --sp-vinyl: #08090b; --sp-groove: #3a3e47;
  --sp-sleeve: #0a0b0d; --sp-on-sleeve: #e3e6eb; --sp-sleeve-edge: #3b3f48;
  --record-house: #9fbfb4; --record-house-deep: #9fbfb4; --record-techno: #ada6ca; --record-techno-deep: #ada6ca;
  --record-live: #c5b5a3; --record-live-deep: #c5b5a3; --record-talk: #b5bac1; --record-talk-deep: #b5bac1;
  --record-art: #a4bec4; --record-art-deep: #a4bec4;
}
:root[data-theme="light"] { color-scheme: light; }
.ds-theme[data-theme="light"] {
  color-scheme: light; --sp-paper:#eceef1; --sp-card:#f7f8fa; --sp-ink:#12151b; --sp-mute:#5c6472; --sp-rule:#d6dae1;
  --sp-edge:#12151b; --sp-sleeve:#12151b; --sp-on-sleeve:#eceef1; --sp-sleeve-edge:transparent; --sp-vinyl:#0c0d10;
  --sp-signal:#4636ff; --sp-warn:#c2364f; --sp-accent:#12151b; --sp-on-accent:#eceef1;
  --paper:var(--sp-paper); --card:var(--sp-card); --ink:var(--sp-ink); --mute:var(--sp-mute); --rule:var(--sp-edge);
  --line:var(--sp-rule); --accent:var(--sp-accent); --onaccent:var(--sp-on-accent); --signal:var(--sp-signal);
}
.ds-theme[data-theme="dark"] {
  color-scheme: dark;
  --sp-paper: #16181c; --sp-card: #1d2025; --sp-ink: #e3e6eb; --sp-mute: #99a0ac; --sp-rule: #30343c; --sp-edge: #4a4f59;
  --sp-signal: #8e84ff; --sp-warn: #ff8396; --sp-ok: #5fd19c; --sp-accent: #e3e6eb; --sp-on-accent: #121417;
  --sp-led: #07080a; --sp-led-off: #1d2027; --sp-vinyl: #08090b; --sp-groove: #3a3e47;
  --sp-sleeve: #0a0b0d; --sp-on-sleeve: #e3e6eb; --sp-sleeve-edge: #3b3f48;
  --record-house: #9fbfb4; --record-house-deep: #9fbfb4; --record-techno: #ada6ca; --record-techno-deep: #ada6ca;
  --record-live: #c5b5a3; --record-live-deep: #c5b5a3; --record-talk: #b5bac1; --record-talk-deep: #b5bac1;
  --record-art: #a4bec4; --record-art-deep: #a4bec4;
  --paper:var(--sp-paper); --card:var(--sp-card); --ink:var(--sp-ink); --mute:var(--sp-mute); --rule:var(--sp-edge);
  --line:var(--sp-rule); --accent:var(--sp-accent); --onaccent:var(--sp-on-accent); --signal:var(--sp-signal);
}

/* the day/night switch: a sun in night mode, a moon in day mode */
.sp-theme{all:unset;cursor:pointer;display:inline-grid;place-items:center;width:30px;height:30px;border:1px solid var(--sp-rule);color:var(--sp-ink)}
.sp-theme:focus-visible{outline:2px solid var(--sp-signal);outline-offset:2px}
.sp-theme svg{width:15px;height:15px}.sp-theme .sun{display:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .sp-theme .sun{display:block}:root:not([data-theme="light"]) .sp-theme .moon{display:none}}
:root[data-theme="dark"] .sp-theme .sun{display:block}:root[data-theme="dark"] .sp-theme .moon{display:none}