:root,
body.mobile-shell-active{
  color-scheme:light dark;

  /* Single Kevewi colour authority. Layout belongs in the component stylesheets. */
  --ink:#234c52;
  --paper:#f7f2e7;
  --paper2:#eef4f0;
  --line:#789d99;
  --accent:#b84a3a;
  --green:#3f7d70;
  --muted:#4f696a;
  --shadow:0 12px 28px rgba(35,76,82,.12);

  --sea:#c5e1e3;
  --sea-stripe:#f7f2e7;
  --land:#f0e5cc;
  --land-line:#6d9c99;
  --map-label:#486d72;

  --genre-dnb:#d95f52;
  --genre-electronic:#5d7fac;
  --genre-hiphop:#a96690;
  --genre-soul:#388e94;
  --genre-reggae:#4b8a6f;
  --genre-folk:#af8736;
  --genre-alternative:#52727c;
  --genre-pop:#d77c6c;
  --genre-jazz:#6f6098;
  --genre-festival:#825c98;
  --genre-experimental:#61766d;
  --ring-tonight:#d45e50;
  --ring-week:#559ba3;
  --ring-regular:#b57c25;
}

html,body{
  background:var(--paper);
  color:var(--ink);
  color-scheme:light dark;
}

/* All mobile surfaces inherit the same palette. */
body.mobile-shell-active,
body.mobile-shell-active .mobile-shell,
body.mobile-shell-active .mobile-shell-page,
body.mobile-shell-active .mobile-list-page,
body.mobile-shell-active .mobile-editorial-page,
body.mobile-shell-active .mobile-editorial-scroll,
body.mobile-shell-active .mobile-event-overlay{
  background-color:var(--paper)!important;
  color:var(--ink)!important;
}

/* Page 1 - light sea-breeze treatment, authored entirely in CSS so browser
   colour transforms affect foreground and background together. */
body.mobile-shell-active .mobile-shell-page.mobile-map-page{
  background-color:var(--sea)!important;
  background-image:repeating-linear-gradient(45deg,var(--sea-stripe) 0,var(--sea-stripe) 2px,var(--sea) 2px,var(--sea) 4px)!important;
}
body.mobile-shell-active .mobile-map-page .map-shell,
body.mobile-shell-active .mobile-map-page .map-viewport,
body.mobile-shell-active .mobile-map-page .map-canvas{
  background:transparent!important;
  background-image:none!important;
}
body.mobile-shell-active .mobile-map-page .coast{
  fill:var(--land)!important;
  stroke:var(--land-line)!important;
  stroke-width:1.9!important;
}
body.mobile-shell-active .mobile-map-page .coast-texture{opacity:.045!important}
body.mobile-shell-active .mobile-map-page .hatch{stroke:var(--map-label)!important;opacity:.08!important}
body.mobile-shell-active .mobile-map-page .map-labels text{fill:var(--map-label)!important;stroke:none!important;opacity:1!important}
body.mobile-shell-active .mobile-map-page .compass circle{stroke:var(--ink)!important}
body.mobile-shell-active .mobile-map-page .compass path{fill:var(--ink)!important}
body.mobile-shell-active .mobile-map-page .compass text{fill:var(--ink)!important}

body.mobile-shell-active .mobile-map-brand strong{color:var(--ink)!important}
body.mobile-shell-active .mobile-map-brand span{color:var(--accent)!important}
body.mobile-shell-active .mobile-map-submit{
  border-color:var(--accent)!important;
  background:var(--accent)!important;
  color:#fff!important;
}
body.mobile-shell-active .mobile-map-page .map-filter-count{
  border-color:var(--line)!important;
  background:var(--paper)!important;
  color:var(--ink)!important;
}

.mobile-map-key-stack,
.mobile-map-key-stack span,
.mobile-map-key-stack strong,
.mobile-map-key-stack button{color:var(--ink)!important}

/* Pins retain their working geometry; theme owns only colour. */
body.mobile-shell-active .mobile-map-page .pin,
body.mobile-shell-active .mobile-map-page .pin:focus,
body.mobile-shell-active .mobile-map-page .pin:focus-visible{outline:none!important}
body.mobile-shell-active .mobile-map-page .pin:hover circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring),
body.mobile-shell-active .mobile-map-page .pin:focus circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring),
body.mobile-shell-active .mobile-map-page .pin:focus-visible circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){
  transform:none!important;
  filter:none!important;
}
body.mobile-shell-active .mobile-map-page .pin>circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){stroke:var(--paper)!important}
body.mobile-shell-active .mobile-map-page .pin.kind-dnb circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){fill:var(--genre-dnb)!important}
body.mobile-shell-active .mobile-map-page .pin.kind-electronic circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){fill:var(--genre-electronic)!important}
body.mobile-shell-active .mobile-map-page .pin.kind-reggae circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring),
body.mobile-shell-active .mobile-map-page .pin.kind-roots circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){fill:var(--genre-reggae)!important}
body.mobile-shell-active .mobile-map-page .pin.kind-folk circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){fill:var(--genre-folk)!important}
body.mobile-shell-active .mobile-map-page .pin.kind-hiphop circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){fill:var(--genre-hiphop)!important}
body.mobile-shell-active .mobile-map-page .pin.kind-soul circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){fill:var(--genre-soul)!important}
body.mobile-shell-active .mobile-map-page .pin.kind-alternative circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring),
body.mobile-shell-active .mobile-map-page .pin.kind-live circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){fill:var(--genre-alternative)!important}
body.mobile-shell-active .mobile-map-page .pin.kind-pop circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){fill:var(--genre-pop)!important}
body.mobile-shell-active .mobile-map-page .pin.kind-jazz circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){fill:var(--genre-jazz)!important}
body.mobile-shell-active .mobile-map-page .pin.kind-festival circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){fill:var(--genre-festival)!important}
body.mobile-shell-active .mobile-map-page .pin.kind-experimental circle:not(.pin-regular-ring):not(.pin-week-ring):not(.pin-tonight-ring){fill:var(--genre-experimental)!important}
body.mobile-shell-active .mobile-map-page .pin .pin-tonight-ring{stroke:var(--ring-tonight)!important}
body.mobile-shell-active .mobile-map-page .pin .pin-week-ring{stroke:var(--ring-week)!important}
body.mobile-shell-active .mobile-map-page .pin .pin-regular-ring{stroke:var(--ring-regular)!important}

.mobile-map-key-stack .kind-dnb i{background:var(--genre-dnb)!important}
.mobile-map-key-stack .kind-electronic i{background:var(--genre-electronic)!important}
.mobile-map-key-stack .kind-roots i,.mobile-map-key-stack .kind-reggae i{background:var(--genre-reggae)!important}
.mobile-map-key-stack .kind-folk i{background:var(--genre-folk)!important}
.mobile-map-key-stack .kind-hiphop i{background:var(--genre-hiphop)!important}
.mobile-map-key-stack .kind-soul i{background:var(--genre-soul)!important}
.mobile-map-key-stack .kind-live i,.mobile-map-key-stack .kind-alternative i{background:var(--genre-alternative)!important}
.mobile-map-key-stack .kind-pop i{background:var(--genre-pop)!important}
.mobile-map-key-stack .kind-jazz i{background:var(--genre-jazz)!important}
.mobile-map-key-stack .kind-festival i{background:var(--genre-festival)!important}

/* Map popovers are always a light Kevewi card, never the legacy dark olive card. */
body.mobile-shell-active .mobile-map-page .map-popover{
  background:var(--paper)!important;
  color:var(--ink)!important;
  border:1px solid var(--line)!important;
  border-left:4px solid var(--accent)!important;
  box-shadow:0 8px 22px rgba(35,76,82,.16)!important;
}
body.mobile-shell-active .mobile-map-page .map-popover strong,
body.mobile-shell-active .mobile-map-page .map-popover-title,
body.mobile-shell-active .mobile-map-page .map-popover-event-copy strong,
body.mobile-shell-active .mobile-map-page .map-popover-close{color:var(--ink)!important}
body.mobile-shell-active .mobile-map-page .map-popover p,
body.mobile-shell-active .mobile-map-page .map-popover time,
body.mobile-shell-active .mobile-map-page .map-popover .meta,
body.mobile-shell-active .mobile-map-page .map-popover-when,
body.mobile-shell-active .mobile-map-page .map-popover-where,
body.mobile-shell-active .mobile-map-page .map-popover-event-copy span{color:var(--muted)!important}
body.mobile-shell-active .mobile-map-page .map-popover a{color:var(--accent)!important}
body.mobile-shell-active .mobile-map-page .map-popover.map-popover-opposite-west{bottom:58px!important}
body.mobile-shell-active .mobile-map-page .map-popover.kind-dnb{border-left-color:var(--genre-dnb)!important}
body.mobile-shell-active .mobile-map-page .map-popover.kind-electronic{border-left-color:var(--genre-electronic)!important}
body.mobile-shell-active .mobile-map-page .map-popover.kind-reggae,
body.mobile-shell-active .mobile-map-page .map-popover.kind-roots{border-left-color:var(--genre-reggae)!important}
body.mobile-shell-active .mobile-map-page .map-popover.kind-folk{border-left-color:var(--genre-folk)!important}
body.mobile-shell-active .mobile-map-page .map-popover.kind-hiphop{border-left-color:var(--genre-hiphop)!important}
body.mobile-shell-active .mobile-map-page .map-popover.kind-soul{border-left-color:var(--genre-soul)!important}
body.mobile-shell-active .mobile-map-page .map-popover.kind-alternative,
body.mobile-shell-active .mobile-map-page .map-popover.kind-live{border-left-color:var(--genre-alternative)!important}
body.mobile-shell-active .mobile-map-page .map-popover.kind-pop{border-left-color:var(--genre-pop)!important}
body.mobile-shell-active .mobile-map-page .map-popover.kind-jazz{border-left-color:var(--genre-jazz)!important}

/* Pages 2 and 3 - one paper/ink/coral system. */
body.mobile-shell-active .mobile-list-page{background:var(--paper)!important}
body.mobile-shell-active .mobile-editorial-page{background:linear-gradient(180deg,var(--paper),var(--paper2))!important}
body.mobile-shell-active .mobile-page-head,
body.mobile-shell-active .mobile-list-day h3,
body.mobile-shell-active .mobile-list-row,
body.mobile-shell-active .mobile-editorial-group>header,
body.mobile-shell-active .mobile-editorial-card{color:var(--ink)!important}
body.mobile-shell-active .mobile-page-head,
body.mobile-shell-active .mobile-editorial-group>header{border-color:var(--ink)!important}
body.mobile-shell-active .mobile-list-day h3,
body.mobile-shell-active .mobile-list-row,
body.mobile-shell-active .mobile-editorial-card{border-color:var(--line)!important}
body.mobile-shell-active .mobile-editorial-card{background:var(--paper)!important}
body.mobile-shell-active .mobile-editorial-art,
body.mobile-shell-active .mobile-overlay-art{background:var(--paper2)!important}
body.mobile-shell-active .mobile-page-head span,
body.mobile-shell-active .mobile-list-row em,
body.mobile-shell-active .mobile-editorial-group>header span,
body.mobile-shell-active .mobile-editorial-copy span,
body.mobile-shell-active .mobile-overlay-copy>span{color:var(--accent)!important}
body.mobile-shell-active .mobile-page-head em,
body.mobile-shell-active .mobile-list-row span,
body.mobile-shell-active .mobile-list-row time,
body.mobile-shell-active .mobile-editorial-copy em,
body.mobile-shell-active .mobile-editorial-copy p,
body.mobile-shell-active .mobile-overlay-copy p{color:var(--muted)!important}
body.mobile-shell-active .mobile-page-head strong,
body.mobile-shell-active .mobile-list-row strong,
body.mobile-shell-active .mobile-editorial-group h3,
body.mobile-shell-active .mobile-editorial-copy strong,
body.mobile-shell-active .mobile-overlay-copy h1,
body.mobile-shell-active .mobile-overlay-copy dt,
body.mobile-shell-active .mobile-overlay-copy dd{color:var(--ink)!important}

/* In-app event detail overlay. */
body.mobile-shell-active .mobile-event-overlay,
body.mobile-shell-active .mobile-overlay-copy,
body.mobile-shell-active .mobile-overlay-copy dl>div{background:var(--paper)!important;color:var(--ink)!important}
body.mobile-shell-active .mobile-overlay-copy dl{background:var(--line)!important;border-color:var(--line)!important}
body.mobile-shell-active .mobile-overlay-source{
  background:var(--ink)!important;
  border-color:var(--ink)!important;
  color:var(--paper)!important;
}
body.mobile-shell-active .mobile-overlay-close{background:var(--paper)!important;color:var(--ink)!important}

/* Standalone event page uses the same palette - no separate inline theme. */
.event-page,.event-hero,.event-detail,.more-events{background:var(--paper)!important;color:var(--ink)!important}
.event-facts{background:var(--line)!important;border-color:var(--line)!important}
.event-fact,.more-card{background:var(--paper)!important;color:var(--ink)!important}
.event-title,.event-detail h2,.event-fact strong,.more-card strong{color:var(--ink)!important}
.event-deck,.event-detail p,.event-source-note,.event-fact span,.more-card span{color:var(--muted)!important}
.event-kicker,.eyebrow{color:var(--accent)!important}
.primary-action{background:var(--accent)!important;border-color:var(--accent)!important;color:#fff!important}
.secondary-action,.event-back{color:var(--ink)!important}

/* Dark-browser context: still visually light, but deliberately higher contrast.
   Because all colours remain CSS, any browser-level transform affects both text
   and surfaces together instead of producing pale text over a fixed light image. */
@media (prefers-color-scheme:dark){
  :root,
  body.mobile-shell-active{
    --ink:#0e3a41;
    --paper:#fff7e7;
    --paper2:#eef6f2;
    --line:#527f7d;
    --accent:#ad3f31;
    --green:#2f7467;
    --muted:#385a5d;
    --shadow:0 12px 28px rgba(14,58,65,.16);
    --sea:#a8d8dc;
    --sea-stripe:#fff7e7;
    --land:#f1d7a8;
    --land-line:#246e75;
    --map-label:#3a3228;
    --genre-dnb:#cf5145;
    --genre-electronic:#4d72a0;
    --genre-hiphop:#98547f;
    --genre-soul:#2f7f86;
    --genre-reggae:#3f7f65;
    --genre-folk:#9d7628;
    --genre-alternative:#45656f;
    --genre-pop:#c96a5d;
    --genre-jazz:#625487;
    --genre-festival:#745087;
    --genre-experimental:#536a61;
    --ring-tonight:#ca5043;
    --ring-week:#3e8992;
    --ring-regular:#a66e1c;
  }
}