/* ===========================================================================
   The community map. A night view from high up: warm lights where real people
   are, thin lines where a church sings a songwriter's songs, and the page's own
   type laid over it. The scroll drives the camera, so the map holds still in
   the viewport while the page runs underneath it.
   =========================================================================== */
.atlas{--atlas-top:72px;background:#0a1115;color:var(--lwp-cream,#f3ead8);position:relative}
.atlas-track{height:calc(100svh * 4.4);position:relative}
.atlas-stick{position:sticky;top:var(--atlas-top);height:calc(100svh - var(--atlas-top));overflow:hidden}
.atlas-map{position:absolute;inset:0;background:#0a1115}
.atlas-map .maplibregl-canvas{outline:none}

/* The copy sits in a pool of shade at the left, so it reads over any
   part of the world the camera happens to be over. */
.atlas-veil{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(10,17,21,.9) 0%,rgba(10,17,21,.62) 30%,rgba(10,17,21,0) 58%),
             linear-gradient(0deg,rgba(10,17,21,.7) 0%,rgba(10,17,21,0) 26%)}
.atlas-copy{position:absolute;left:max(28px,calc((100vw - 1500px)/2 + 28px));top:clamp(36px,9vh,96px);max-width:min(520px,calc(100% - 56px));pointer-events:none}
.atlas-title{font-family:var(--anton);font-weight:400;text-transform:uppercase;font-size:var(--lwp-section,clamp(40px,4.4vw,64px));line-height:.92;letter-spacing:-.018em;color:var(--lwp-cream,#f3ead8);text-wrap:balance;margin:0 0 16px;text-shadow:0 6px 30px rgba(0,0,0,.45)}
.atlas-line{font-size:var(--lwp-lead,18px);line-height:1.55;color:rgba(243,234,216,.8);margin:0 0 18px;max-width:44ch}
.atlas-count{display:inline-block;font-size:12.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ochre);margin:0;padding-top:12px;border-top:1px solid rgba(224,169,78,.4)}

.atlas-stages{position:absolute;left:max(28px,calc((100vw - 1500px)/2 + 28px));bottom:28px;display:flex;gap:2px;background:rgba(10,17,21,.62);border:1px solid rgba(243,234,216,.16);backdrop-filter:blur(8px)}
.atlas-stages button{font-family:var(--anton);font-size:13px;letter-spacing:.07em;text-transform:uppercase;color:rgba(243,234,216,.6);background:none;border:0;padding:12px 16px 11px;cursor:pointer;position:relative;transition:color .2s}
.atlas-stages button:hover{color:var(--lwp-cream,#f3ead8)}
.atlas-stages button.on{color:var(--lwp-cream,#f3ead8)}
.atlas-stages button.on::after{content:"";position:absolute;left:16px;right:16px;bottom:5px;height:2px;background:var(--terracotta)}
.atlas-stages button:focus-visible{outline:2px solid var(--terracotta);outline-offset:-2px}

.atlas-legend{position:absolute;right:max(28px,calc((100vw - 1500px)/2 + 28px));bottom:34px;display:flex;gap:18px;font-size:12px;color:rgba(243,234,216,.7);pointer-events:none}
.atlas-legend span{display:inline-flex;align-items:center;gap:7px}
.atlas-dot{width:9px;height:9px;border-radius:50%;display:inline-block}
.atlas-dot.is-writer{background:var(--ochre);box-shadow:0 0 0 4px rgba(224,169,78,.22)}
.atlas-dot.is-church{background:var(--lwp-cream,#f3ead8);width:7px;height:7px}
.atlas-rule{width:18px;height:0;border-top:1.5px solid var(--ochre);display:inline-block}

.atlas-return{position:absolute;right:max(28px,calc((100vw - 1500px)/2 + 28px));top:24px;font-family:var(--anton);font-size:13px;letter-spacing:.07em;text-transform:uppercase;color:var(--lwp-cream,#f3ead8);background:rgba(10,17,21,.72);border:1px solid rgba(243,234,216,.3);padding:11px 16px;cursor:pointer}
.atlas-return:hover{border-color:var(--lwp-cream,#f3ead8)}

/* One light, opened: a panel at the right on a wide screen, a sheet from the
   bottom on a phone. */
.atlas-sheet{position:absolute;right:max(28px,calc((100vw - 1500px)/2 + 28px));top:76px;width:min(360px,calc(100% - 56px));max-height:calc(100% - 170px);overflow:auto;background:#fffaf1;color:var(--lwp-ink,#19222e);padding:22px 22px 24px;box-shadow:0 24px 60px rgba(0,0,0,.45);display:grid;gap:14px;align-content:start}
.atlas-sheet[hidden]{display:none}
.atlas-x{justify-self:end;font:inherit;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:none;border:0;color:var(--lwp-muted,#52606a);cursor:pointer;padding:2px 0;margin-bottom:-6px}
.atlas-x:hover{color:var(--terracotta)}
.atlas-who{display:flex;gap:14px;align-items:center}
.atlas-who b{display:block;font-family:var(--anton);font-weight:400;text-transform:uppercase;font-size:26px;line-height:1}
.atlas-who small{display:block;color:var(--lwp-muted,#52606a);font-size:13px;margin-top:5px}
.atlas-face{width:56px;height:56px;border-radius:50%;flex:none;background:#2c3a2c center/cover no-repeat;display:grid;place-items:center;font-family:var(--anton);font-size:18px;color:var(--lwp-cream,#f3ead8)}
.atlas-said{margin:0;font-size:14.5px;line-height:1.55;color:var(--lwp-ink,#19222e)}
.atlas-list{display:grid;gap:2px}
.atlas-list span{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--lwp-muted,#52606a);margin-bottom:4px}
.atlas-list a,.atlas-list button{font:inherit;font-size:14.5px;font-weight:600;text-align:left;color:var(--lwp-ink,#19222e);background:none;border:0;border-top:1px solid rgba(25,34,46,.1);padding:9px 0;cursor:pointer;text-decoration:none}
.atlas-list a:hover,.atlas-list button:hover{color:var(--terracotta)}
.atlas-muted{margin:0;color:var(--lwp-muted,#52606a);font-size:14px;line-height:1.5}
.atlas-sheet .sgbtn{justify-self:start}

/* The people, as a list */
.atlas-people .band-head{margin-bottom:26px}
.atlas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:10px}
.atlas-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:14px;align-items:center;background:#fffaf1;border:1px solid rgba(25,34,46,.14);padding:12px 14px}
.atlas-card b{display:block;font-family:var(--anton);font-weight:400;text-transform:uppercase;font-size:20px;line-height:1.05}
.atlas-card small{display:block;color:var(--lwp-muted,#52606a);font-size:13px;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.atlas-card .atlas-face{width:48px;height:48px;font-size:16px}
.atlas-join{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:22px;flex-wrap:wrap;margin-top:18px;padding:26px 28px;background:var(--lwp-night,#090e12);color:var(--lwp-cream,#f3ead8)}
.atlas-join b{display:block;font-family:var(--anton);font-weight:400;text-transform:uppercase;font-size:30px;line-height:1}
.atlas-join span{display:block;color:rgba(243,234,216,.72);font-size:14.5px;margin-top:8px;max-width:52ch;line-height:1.5}
.atlas-joinacts{display:flex;gap:10px;flex-wrap:wrap}
.atlas-join .sgbtn.ink{border-color:rgba(243,234,216,.42);color:var(--lwp-cream,#f3ead8)}

.maplibregl-ctrl-attrib{background:rgba(10,17,21,.6)!important;color:rgba(243,234,216,.55)!important;font-size:10px}
.maplibregl-ctrl-attrib a{color:rgba(243,234,216,.7)!important}
.maplibregl-cooperative-gesture-screen{font-family:var(--sans);color:var(--lwp-cream,#f3ead8);background:rgba(10,17,21,.55)!important}

@media (max-width:820px){
  .atlas-track{height:calc(100svh * 4)}
  .atlas-veil{background:linear-gradient(180deg,rgba(10,17,21,.92) 0%,rgba(10,17,21,.55) 36%,rgba(10,17,21,0) 60%),linear-gradient(0deg,rgba(10,17,21,.75) 0%,rgba(10,17,21,0) 24%)}
  .atlas-copy{left:16px;right:16px;top:22px;max-width:none}
  .atlas-line{font-size:15px;margin-bottom:12px}
  .atlas-stages{left:16px;right:16px;bottom:30px;justify-content:space-between}
  .atlas-stages button{padding:11px 8px 10px;font-size:12px;flex:1}
  .atlas-stages button.on::after{left:8px;right:8px}
  .atlas-legend{display:none}
  .atlas-return{top:auto;bottom:88px;right:16px}
  .atlas-sheet{left:0;right:0;bottom:0;top:auto;width:auto;max-height:62%;box-shadow:0 -18px 40px rgba(0,0,0,.4)}
  .atlas-card{grid-template-columns:auto minmax(0,1fr) auto}
  .atlas-card>a.sgbtn{display:none}
  .atlas-grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  .atlas-track{height:auto}
  .atlas-stick{position:relative;top:0;height:min(720px,calc(100svh - var(--atlas-top)))}
}