/* Exploration components. Data colours and school classifications retain their roles. */
.map-context-actions {
  display:flex;
  gap:7px;
  flex-shrink:0;
  pointer-events:auto;
}
.explore-open {
  border-radius:20px;
  background:#315b50;
  color:#fffbe9;
  padding:8px 14px;
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
  box-shadow:0 4px 12px #1b40351c;
}
.explore-open:hover {
  background:#234d42;
}
.region-chip[data-remove-city] {
  color:var(--region-ink);
  background:var(--region-tint);
  border-color:var(--region-ink);
  gap:7px;
}
.region-chip svg {
  width:17px;
  height:17px;
  flex-shrink:0;
}
.region-chips {
  min-width:0;
}
.explore-dialog {
  width:min(720px,calc(100vw - 32px));
}
.explore-dialog[open],#notebook-dialog[open] {
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.explore-dialog .dialog-header,#notebook-dialog .dialog-header {
  flex-shrink:0;
}
.explore-dialog h2 {
  word-break:keep-all;
}
.explore-body {
  padding:0 28px 24px;
  overflow:auto;
  min-height:0;
}
.explore-region {
  display:flex;
  gap:17px;
  align-items:center;
  margin:12px 0 30px;
}
#explore-emblem {
  width:68px;
  height:68px;
  border-radius:22px;
  display:grid;
  place-items:center;
  flex-shrink:0;
  transform:rotate(-5deg);
}
#explore-emblem svg {
  width:38px;
  height:38px;
}
.explore-region small {
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-bottom:5px;
}
.explore-region strong {
  font-size:21px;
  line-height:1.5;
}
.explore-region p {
  font-size:12px;
  color:var(--muted);
  margin:6px 0 0;
}
.experience-heading {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  justify-content:space-between;
  align-items:center;
  margin-bottom:12px;
}
.experience-heading h3 {
  font-size:16px;
  margin:0;
}
.experience-heading>span {
  font-size:12px;
  color:#6c6044;
}
.mood-options {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.mood-options button {
  padding:8px 8px 12px;
  background:#f5f6ef;
  border:2px solid transparent;
  border-radius:15px;
  text-align:left;
  overflow:hidden;
}
.mood-options button[aria-pressed="true"] {
  border-color:#3a705b;
  background:#edf4e8;
}
.mood-options button strong {
  display:block;
  font-size:14px;
  margin:10px 3px 4px;
}
.mood-options button small {
  font-size:12px;
  color:var(--muted);
  display:block;
  margin:0 3px;
  line-height:1.6;
}
.mood-scene {
  display:block;
  position:relative;
  overflow:hidden;
  height:82px;
  border-radius:9px;
  isolation:isolate;
}
.mood-scene::before,.mood-scene::after {
  content:"";
  position:absolute;
  width:130%;
  height:90%;
  border-radius:50%;
  transform:rotate(-12deg);
  top:56%;
  left:-30%;
}
.mood-scene::after {
  left:25%;
  top:71%;
  transform:rotate(15deg);
}
.mood-scene i {
  position:absolute;
  border-radius:50%;
  width:27px;
  height:27px;
  right:22%;
  top:14%;
}
.mood-day {
  background:#d9eae4;
}
.mood-day i {
  background:#fff4ad;
}
.mood-day::before {
  background:#94b794;
}
.mood-day::after {
  background:#4d8074;
}
.mood-sunset {
  background:linear-gradient(#dfa58d,#f7d6a4);
}
.mood-sunset i {
  background:#ffe5a1;
  top:33%;
}
.mood-sunset::before {
  background:#b68e8a;
}
.mood-sunset::after {
  background:#786f81;
}
.mood-night {
  background:radial-gradient(circle at 24% 25%,#d1e4ed 1px,transparent 2px),radial-gradient(circle at 75% 44%,#d1e4ed 1px,transparent 2px),#243c54;
}
.mood-night i {
  background:#f6ecc2;
  box-shadow:-7px -3px 0 #243c54 inset;
}
.mood-night::before {
  background:#375867;
}
.mood-night::after {
  background:#527575;
}
.ambient-toggle {
  display:flex;
  gap:10px;
  align-items:center;
  margin-top:18px;
  font-size:13px;
  font-weight:600;
}
.ambient-toggle input,#saved-only {
  width:17px;
  height:17px;
  accent-color:#315b50;
  flex-shrink:0;
}
.ambient-toggle small {
  display:block;
  font-weight:400;
  font-size:12px;
  margin-top:4px;
  color:var(--muted);
}
.experience-note {
  font-size:12px;
  color:var(--muted);
  line-height:1.8;
  margin:9px 0;
}
.tour-section {
  margin-top:24px;
  border-top:1px solid var(--line);
  padding-top:22px;
}
.tour-preview {
  list-style:none;
  display:grid;
  grid-template-columns:1fr 1fr;
  padding:0;
  gap:8px;
}
.tour-preview li {
  display:flex;
  align-items:center;
  gap:10px;
  padding:9px;
  background:#f4f2e9;
  border-radius:9px;
  font-size:12px;
}
.tour-preview li>span {
  width:23px;
  height:23px;
  display:grid;
  place-items:center;
  background:#e2d7b8;
  color:#574c2e;
  border-radius:50%;
  flex-shrink:0;
}
.tour-preview strong {
  font-size:13px;
  display:block;
  line-height:1.6;
}
.tour-preview small {
  display:block;
  font-size:12px;
  color:var(--muted);
  margin-top:3px;
}
.tour-start {
  background:#315b50;
  color:white;
  padding:12px;
  width:100%;
  border-radius:9px;
  font-size:14px;
  font-weight:600;
}
.tour-start:disabled {
  opacity:.5;
  cursor:default;
}
.notebook-launch {
  display:flex;
  align-items:center;
  gap:15px;
  width:100%;
  border-radius:12px;
  background:#f2e9d3;
  color:#655229;
  padding:18px;
  margin-top:25px;
  text-align:left;
}
.notebook-launch>span {
  font-size:27px;
}
.notebook-launch>span:last-child {
  margin-left:auto;
  font-size:20px;
}
.notebook-launch strong {
  display:block;
  font-size:16px;
  margin-bottom:5px;
}
.notebook-launch small {
  font-size:12px;
}
.notebook-toolbar {
  padding:8px 28px 15px;
  border-bottom:1px solid var(--line);
  flex-shrink:0;
}
.notebook-toolbar>div {
  display:flex;
  gap:12px;
  align-items:center;
}
.notebook-toolbar button {
  padding:8px 10px;
  border-radius:7px;
  font-size:13px;
}
.notebook-toolbar button[aria-pressed="true"] {
  background:#e6eddf;
  color:#315b50;
  font-weight:700;
}
.notebook-toolbar span {
  margin-left:auto;
  font-size:12px;
  color:var(--muted);
}
.notebook-toolbar label {
  display:flex;
  align-items:center;
  gap:7px;
  font-size:13px;
  margin-top:14px;
}
.notebook-toolbar p {
  font-size:12px;
  color:var(--muted);
  line-height:1.7;
  margin-bottom:0;
}
.notebook-list {
  overflow:auto;
  padding:0 28px;
  min-height:0;
}
.notebook-row {
  display:flex;
  gap:8px;
  align-items:center;
  border-bottom:1px solid var(--line);
  padding:12px 0;
}
.notebook-row>button {
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  text-align:left;
  flex:1;
}
.notebook-row>button>span {
  color:#6c744f;
  font-size:21px;
}
.notebook-row strong {
  font-size:14px;
  display:block;
  line-height:1.6;
}
.notebook-row small {
  font-size:12px;
  color:var(--muted);
}
.notebook-row .save-place {
  flex:0 0 auto;
  font-size:12px;
}
.notebook-empty {
  text-align:center;
  padding:32px 18px;
}
.notebook-empty>span {
  display:block;
  font-size:40px;
  color:#8c773e;
}
.notebook-empty strong {
  display:block;
  margin-top:12px;
}
.notebook-empty p {
  font-size:13px;
  color:var(--muted);
  line-height:1.8;
}
.notebook-footer {
  display:flex;
  justify-content:space-between;
  padding:10px 28px 20px;
}
.memory-actions {
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:12px 0;
}
.save-place {
  border:1px solid #cabd99;
  border-radius:8px;
  color:#6b562c;
  background:#f9f4e4;
  padding:7px 10px;
  font-size:12px;
  white-space:nowrap;
}
.save-place[aria-pressed="true"] {
  background:#eee1b7;
  border-color:#9b854a;
  color:#594716;
}
.visited-stamp {
  font-size:12px;
  color:#567464;
}
.row-memory {
  display:block;
  font-size:12px;
  color:#745e2e;
  margin-top:5px;
}
.saved-only-badge {
  border:1px solid #c7b581;
  background:#f6efd9;
  color:#675322;
  font-size:12px;
  padding:8px 12px;
  margin:0 24px 10px;
  border-radius:8px;
}
.saved-only-badge[hidden],.row-memory[hidden] {
  display:none;
}
.parent-note {
  border-left:3px solid #a781b6;
  padding:12px;
  background:#f4edf7;
  border-radius:0 9px 9px 0;
  margin:12px 0;
}
.parent-note strong {
  display:block;
  font-size:14px;
  margin-top:8px;
}
.parent-note p {
  font-size:12px;
}
.tour-player {
  position:absolute;
  z-index:5;
  left:50%;
  bottom:65px;
  transform:translateX(-50%);
  width:min(580px,calc(100% - 110px));
  border:1px solid #c2d0b8;
  border-radius:17px;
  background:#fffff5f5;
  box-shadow:0 8px 32px #1a403133;
  padding:15px 20px;
}
.tour-player[hidden] {
  display:none;
}
.tour-caption {
  display:grid;
  grid-template-columns:auto 1fr;
  gap:5px 12px;
  align-items:center;
}
#tour-step {
  font-size:12px;
  border-radius:8px;
  background:#e8e1cb;
  padding:5px 8px;
  color:#60542c;
}
#tour-place {
  font-size:16px;
  word-break:keep-all;
}
#tour-state {
  grid-column:1/-1;
  font-size:12px;
  color:var(--muted);
  line-height:1.6;
  margin-top:3px;
}
#tour-progress {
  width:100%;
  height:4px;
  accent-color:#57785a;
  display:block;
  margin-top:12px;
}
.tour-controls {
  display:flex;
  gap:8px;
  margin-top:12px;
}
.tour-controls button {
  border:1px solid #bdcbb4;
  border-radius:8px;
  padding:7px 12px;
  font-size:12px;
  background:#eff4e7;
}
.tour-controls button:last-child {
  margin-left:auto;
  background:white;
}
.tour-controls button:disabled {
  opacity:.45;
  cursor:default;
}
body[data-touring="true"] .selection,body[data-touring="true"] .map-caption {
  display:none;
}
body[data-motion="on"] .selection:not([hidden]) h3 {
  animation:atlas-unfold .28s ease-out;
}
body[data-motion="on"] .jurisdiction-city-tags span {
  animation:atlas-unfold .5s ease both;
}
body[data-motion="on"] .jurisdiction-city-tags span:nth-child(2) {
  animation-delay:.45s;
}
.jurisdiction-city-tags {
  position:relative;
  padding-top:12px;
  border-top:1px solid #aac1de;
}
.jurisdiction-city-tags::before {
  content:"";
  position:absolute;
  height:8px;
  left:50%;
  top:-8px;
  border-left:1px solid #aac1de;
}
@keyframes atlas-unfold {
  from {
    opacity:0;
    transform:translateY(7px);
  }
  to {
    opacity:1;
    transform:translateY(0);
  }
}
/* The map and its floating controls share a dark palette. The search sidebar
   and document dialogs intentionally remain a neutral, light reading surface. */
:root[data-theme="night"] {
  background:#192d3b;
}
:root[data-theme="night"] :is(.masthead,.sidebar,dialog) {
  color-scheme:light;
}
:root[data-theme="night"] .map-shell {
  background:#192d3b;
}
:root[data-theme="night"] :is(.selection,.map-tools,.bookmarks,.map-caption,.tour-player,.region-hover,.terrain-status,.appearance-menu) {
  --muted:#bdd0dc;
  --green:#a1dfc4;
  --line:#496372;
  color:#eef6f7;
  background:#1e3444;
  border-color:#496372;
  backdrop-filter:none;
  color-scheme:dark;
}
:root[data-theme="night"] :is(.selection,.map-tools,.bookmarks,.tour-player,.region-hover,.appearance-menu) :is(button,summary,a):focus-visible {
  outline-color:#a1dfc4;
}
:root[data-theme="night"] :is(.map-tools button:hover,.map-tools button[aria-pressed=true],.bookmarks button.active,.bookmarks button:hover) {
  background:#355265;
  color:#ddf8eb;
}
:root[data-theme="night"] .selection :is(.detail-card,.parent-note,.detail-view,.save-place,.detail-badge,.type-tag,.jurisdiction-badge,.jurisdiction-city-tags span,.jurisdiction-card,.colocated-list) {
  background:#2c4556;
  color:#e4f4ef;
  border-color:#728995;
}
:root[data-theme="night"] .selection-close {
  background:#355265;
  color:#eef6f7;
}
:root[data-theme="night"] .selection .save-place[aria-pressed="true"] {
  background:#544b33;
  color:#fff0bb;
  border-color:#b8a578;
}
:root[data-theme="night"] .selection :is(.visited-stamp,.type-tag,.detail-badge) {
  color:#b4dec9;
}
:root[data-theme="night"] :is(.selection,.map-caption,.appearance-menu) :is(p,small,dt,.fineprint,.eyebrow,.legend-note) {
  color:var(--muted);
}
:root[data-theme="night"] .region-hover :is(span,em) {
  color:#c8dced;
}
:root[data-theme="night"] #tour-step {
  background:#544b33;
  color:#fff0bb;
}
:root[data-theme="night"] .tour-controls button {
  background:#355265;
  color:#eef6f7;
  border-color:#728995;
}
:root[data-theme="night"] .tour-controls button:last-child {
  background:#273e4e;
}
:root[data-theme="night"] .maplibregl-ctrl-scale {
  background:#1e3444;
  color:#eef6f7;
  border-color:#bdd0dc;
}
:root[data-theme="night"] .appearance-menu :is(summary,div,select) {
  background:#1e3444;
  color:#eef6f7;
  border-color:#496372;
}
:root[data-theme="night"] .appearance-menu p {
  color:#bdd0dc;
}
:root[data-theme="sunset"] .map-caption {
  background:#fff0ddea;
}
@media(max-width:1050px) {
  .map-context-actions {
    gap:5px;
  }
  .explore-open {
    padding:8px 10px;
  }
}
@media(max-width:700px) {
  .map-region-row {
    padding-right:0;
  }
  .region-chips {
    max-width:calc(100% - 80px);
  }
  .map-context-actions {
    margin-top:3px;
  }
  .map-context-actions .jurisdiction-open {
    margin:0;
  }
  .explore-open {
    padding:6px 10px;
  }
  .explore-body {
    padding:0 18px 20px;
  }
  .explore-dialog .dialog-header {
    padding:20px 18px 12px;
  }
  .explore-dialog h2 {
    font-size:20px;
  }
  .explore-region {
    margin:10px 0 25px;
    gap:12px;
  }
  .explore-region strong {
    font-size:17px;
  }
  #explore-emblem {
    width:50px;
    height:50px;
    border-radius:17px;
  }
  #explore-emblem svg {
    width:30px;
    height:30px;
  }
  .mood-options {
    gap:5px;
  }
  .mood-options button {
    padding:5px 4px 10px;
    border-radius:10px;
  }
  .mood-scene {
    height:60px;
  }
  .mood-options button strong {
    font-size:13px;
  }
  .mood-options button small {
    display:none;
  }
  .tour-preview {
    grid-template-columns:1fr;
  }
  .experience-heading>span {
    font-size:12px;
  }
  .notebook-toolbar,.notebook-list {
    padding-left:18px;
    padding-right:18px;
  }
  .notebook-row {
    flex-wrap:wrap;
  }
  .notebook-row>button:first-child {
    flex-basis:100%;
  }
  .notebook-row .save-place {
    margin-left:32px;
  }
  .notebook-toolbar>div {
    gap:3px;
  }
  .notebook-toolbar button {
    padding:8px 7px;
  }
  .tour-player {
    width:calc(100% - 24px);
    bottom:67px;
    padding:13px 14px;
  }
  .tour-controls {
    gap:5px;
  }
  .tour-controls button {
    padding:8px 9px;
  }
  #tour-place {
    font-size:15px;
  }
}
@media(prefers-reduced-motion:reduce) {
  body[data-motion="on"] .selection:not([hidden]) h3,body[data-motion="on"] .jurisdiction-city-tags span {
    animation:none;
  }
}
.explore-water {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:1;
}
.explore-water[hidden] {
  display:none;
}
.motion-options {
  display:flex;
  flex-wrap:wrap;
  gap:9px 18px;
  margin:14px 0 0 27px;
}
.motion-options label {
  display:flex;
  align-items:center;
  gap:7px;
  font-size:12px;
  color:var(--muted);
}
.motion-options input {
  width:16px;
  height:16px;
  accent-color:#315b50;
}
.motion-options input:disabled+span {
  opacity:.65;
}