/* ---- state pages, /karaoke/<state> (build_state_pages.py) ---- */
.towns{padding:28px 0 0}
.towns p{color:var(--muted); font-size:15.5px; line-height:1.9; max-width:none; margin:0}
.towns a{white-space:nowrap; color:var(--text); text-decoration:underline; text-underline-offset:4px;
  text-decoration-thickness:1px; text-decoration-color:var(--accent-800)}
.towns a:hover{color:var(--accent-400); text-decoration-color:var(--accent)}
.towns .sep{color:var(--faint); padding:0 6px}
.towns details summary{display:flex; align-items:center; gap:10px; min-height:44px; cursor:pointer;
  color:var(--text); font-size:15.5px; list-style:none; width:fit-content;
  text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1px;
  text-decoration-color:var(--accent-800)}
.towns details summary::-webkit-details-marker{display:none}
.towns details summary::after{content:"\25BE"; color:var(--accent-400); text-decoration:none}
.towns details[open] summary::after{content:"\25B4"}
.towns details summary:hover{color:var(--accent-400)}
.towns details summary:focus-visible{outline:2px solid var(--accent); outline-offset:4px}
.towns .abc{margin:10px 0 0}
.towns .abc p{display:grid; grid-template-columns:28px minmax(0,1fr); gap:0 6px; line-height:1.9}
.towns .abc b{font-family:var(--mono); font-weight:400; color:var(--faint)}
.town{margin:34px 0 0; scroll-margin-top:88px}
.town h3.tn{font-family:var(--body); font-weight:500; font-size:12px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--kicker, var(--muted)); margin:0 0 6px}
.town h3.tn span{color:var(--faint); letter-spacing:.06em; padding-left:8px}
.slate h4{margin:0; font-family:var(--display); font-weight:400; letter-spacing:0;
  font-size:clamp(22px,2.6vw,26px); line-height:1.1; position:relative; width:fit-content}
.slate h4 a{color:inherit; text-decoration:underline; text-underline-offset:5px;
  text-decoration-thickness:1px; text-decoration-color:var(--accent-800)}
.slate h4 a:hover{color:var(--accent-400); text-decoration-color:var(--accent)}
.slate h4 a::after{content:""; position:absolute; inset:-10px 0}