/* RC88 Atlante narrativo · demo locale */
:root {
  --atlas-ink: #172b2a;
  --atlas-muted: #667874;
  --atlas-paper: #f8f5ed;
  --atlas-surface: #fffdf8;
  --atlas-green: #1d4b43;
  --atlas-gold: #c8953f;
  --atlas-line: rgba(29, 75, 67, .16);
  --atlas-red: #b95543;
  --atlas-green-route: #43856a;
  --atlas-orange: #d27835;
  --atlas-blue: #477a92;
  --atlas-violet: #75617e;
  --atlas-shadow: 0 22px 58px rgba(29, 52, 48, .14);
  --atlas-radius: 20px;
}

.narrative-atlas-page[hidden] { display: none !important; }

main#top > .narrative-atlas-home-banner {
  width: min(var(--home-feature-max-width, 1120px), calc(100% - (var(--home-feature-gutter, 24px) * 2)));
  margin: 20px auto 28px;
}

.narrative-atlas-home-banner button {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: clamp(76px, 10vw, 112px);
  padding: 16px 20px;
  border: 1px solid rgba(29, 75, 67, .72);
  border-top: 4px solid rgba(200, 149, 63, .78);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(29, 75, 67, .9), rgba(40, 100, 87, .82));
  color: #fffdf8;
  box-shadow: 0 12px 28px rgba(29, 52, 48, .13);
  font: 900 clamp(1.15rem, 3vw, 2.15rem)/1 Georgia, serif;
  letter-spacing: .08em;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}

.narrative-atlas-home-description {
  display: block;
  max-width: 560px;
  margin-top: 7px;
  color: rgba(255, 253, 248, .74);
  font: 650 clamp(.72rem, 1.25vw, .9rem)/1.3 system-ui, sans-serif;
  letter-spacing: .01em;
  text-align: center;
}

.narrative-atlas-home-banner button:hover {
  filter: brightness(1.05) saturate(1.04);
  transform: translateY(-2px);
  box-shadow: 0 16px 32px rgba(29, 52, 48, .18);
}

.narrative-atlas-home-banner button:focus-visible {
  outline: 3px solid rgba(200, 149, 63, .58);
  outline-offset: 4px;
}

/* L’Atlante vive dentro #top: quando è aperto, nascondiamo solo le altre
   sezioni della Home, lasciando visibile il contenitore che lo ospita. */
html.is-narrative-atlas-open #top > section:not(.narrative-atlas-page) {
  display: none !important;
}

.narrative-atlas-page { min-height: 100vh; padding: 0 0 72px; background: var(--atlas-paper); color: var(--atlas-ink); }
.narrative-atlas-shell { width: min(1360px, calc(100% - 30px)); margin: 0 auto; }
.narrative-atlas-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding: clamp(24px, 5vw, 58px) 0 26px; border-bottom: 1px solid var(--atlas-line); }
.narrative-atlas-eyebrow { margin: 0 0 9px; color: var(--atlas-gold); font: 900 .68rem/1 system-ui, sans-serif; letter-spacing: .18em; }
.narrative-atlas-head h1 { max-width: 750px; margin: 0; color: var(--atlas-green); font: 900 clamp(2.2rem, 6vw, 5.8rem)/.91 Georgia, serif; letter-spacing: -.06em; }
.narrative-atlas-lead { max-width: 600px; margin: 16px 0 0; color: var(--atlas-muted); font-size: clamp(.9rem, 1.5vw, 1.08rem); line-height: 1.5; }
.narrative-atlas-close { flex: 0 0 auto; min-height: 46px; padding: 0 15px; border: 1px solid var(--atlas-line); border-radius: 10px; background: transparent; color: var(--atlas-green); font: 850 .76rem/1 system-ui, sans-serif; cursor: pointer; }
.narrative-atlas-close:hover { background: var(--atlas-green); color: #fff; }
.narrative-atlas-toolbar { display: grid; grid-template-columns: auto minmax(170px, 1fr) repeat(3, minmax(120px, .55fr)) auto; gap: 9px; align-items: center; padding: 16px 0; }
.narrative-atlas-tabs { display: flex; gap: 5px; }
.narrative-atlas-tab, .narrative-atlas-toolbar select, .narrative-atlas-search { min-height: 44px; border: 1px solid var(--atlas-line); border-radius: 9px; background: var(--atlas-surface); color: var(--atlas-ink); font: 750 .76rem/1 system-ui, sans-serif; }
.narrative-atlas-tab { padding: 0 12px; cursor: pointer; }
.narrative-atlas-tab.is-active { border-color: var(--atlas-green); background: var(--atlas-green); color: #fff; }
.narrative-atlas-search { min-width: 0; padding: 0 12px; }
.narrative-atlas-toolbar select { padding: 0 8px; }
.narrative-atlas-surprise { min-height: 44px; padding: 0 13px; border: 1px solid var(--atlas-gold); border-radius: 9px; background: #f4e6c5; color: #704b17; font: 850 .72rem/1 system-ui, sans-serif; cursor: pointer; }
.narrative-atlas-status { min-height: 20px; margin: 0 0 4px; color: var(--atlas-muted); font-size: .74rem; font-weight: 750; }
.narrative-atlas-layout { display: grid; grid-template-columns: minmax(250px, .7fr) minmax(0, 1.7fr); gap: 16px; }
.narrative-atlas-library, .narrative-atlas-stage, .narrative-atlas-adapter { min-width: 0; border: 1px solid var(--atlas-line); border-radius: var(--atlas-radius); background: rgba(255, 253, 248, .82); box-shadow: var(--atlas-shadow); }
.narrative-atlas-library { align-self: start; padding: 15px; }
.narrative-atlas-library-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin: 0 0 12px; }
.narrative-atlas-library h2, .narrative-atlas-adapter h2 { margin: 0; color: var(--atlas-green); font: 850 1.1rem/1.05 Georgia, serif; }
.narrative-atlas-library-count { color: var(--atlas-muted); font-size: .68rem; font-weight: 800; }
.narrative-atlas-route-list { display: grid; gap: 8px; }
.narrative-atlas-route { display: grid; gap: 6px; width: 100%; padding: 13px; border: 1px solid transparent; border-radius: 12px; background: #eef1e9; color: var(--atlas-ink); text-align: left; cursor: pointer; }
.narrative-atlas-route:hover, .narrative-atlas-route.is-active { border-color: var(--atlas-gold); background: #f8efd8; transform: translateY(-1px); }
.narrative-atlas-route-bar { width: 38px; height: 3px; background: var(--atlas-green); }
.narrative-atlas-route[data-color="red"] .narrative-atlas-route-bar { background: var(--atlas-red); }
.narrative-atlas-route[data-color="green"] .narrative-atlas-route-bar { background: #43856a; }
.narrative-atlas-route[data-color="orange"] .narrative-atlas-route-bar { background: #d27835; }
.narrative-atlas-route[data-color="blue"] .narrative-atlas-route-bar { background: #477a92; }
.narrative-atlas-route[data-color="violet"] .narrative-atlas-route-bar { background: #75617e; }
.narrative-atlas-route strong { font: 850 .95rem/1.05 Georgia, serif; }
.narrative-atlas-route small { color: var(--atlas-muted); font-size: .68rem; line-height: 1.3; }
.narrative-atlas-route-meta { display: flex; flex-wrap: wrap; gap: 5px; color: var(--atlas-muted); font-size: .62rem; font-weight: 800; }
.narrative-atlas-stage { overflow: hidden; }
.narrative-atlas-story { padding: clamp(18px, 3vw, 34px); }
.narrative-atlas-story-head { display: flex; justify-content: space-between; gap: 15px; align-items: flex-start; margin-bottom: 22px; }
.narrative-atlas-story-kicker { margin: 0 0 8px; color: var(--atlas-gold); font: 900 .64rem/1 system-ui, sans-serif; letter-spacing: .12em; }
.narrative-atlas-story h2 { max-width: 680px; margin: 0; color: var(--atlas-green); font: 900 clamp(1.8rem, 4vw, 3.8rem)/.96 Georgia, serif; letter-spacing: -.045em; }
.narrative-atlas-story-strap { margin: 10px 0 0; color: var(--atlas-red); font: 850 .85rem/1.3 system-ui, sans-serif; }
.narrative-atlas-story-lead { max-width: 62ch; margin: 12px 0 0; color: var(--atlas-muted); font-size: .88rem; line-height: 1.52; }
.narrative-atlas-route-sources { display: grid; gap: 6px; max-width: 62ch; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--atlas-line); }
.narrative-atlas-route-sources-label { color: var(--atlas-muted); font: 850 .62rem/1 system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.narrative-atlas-route-source-list { display: flex; flex-wrap: wrap; gap: 6px 12px; }
.narrative-atlas-route-source-list a { color: var(--atlas-green); font-size: .68rem; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.narrative-atlas-route-source-list a:hover { color: var(--atlas-red); }
.narrative-atlas-route-source-list a:focus-visible { outline: 2px solid var(--atlas-gold); outline-offset: 3px; border-radius: 3px; }
.narrative-atlas-story-actions { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; }
.narrative-atlas-save, .narrative-atlas-place-close { min-height: 40px; padding: 0 11px; border: 1px solid var(--atlas-line); border-radius: 8px; background: transparent; color: var(--atlas-green); font: 800 .7rem/1 system-ui, sans-serif; cursor: pointer; }
.narrative-atlas-save.is-saved { border-color: #4b8b67; background: #e2f0e4; color: #28613f; }
.narrative-atlas-route-facts { display: flex; flex-wrap: wrap; gap: 6px; margin: 18px 0; }
.narrative-atlas-fact { padding: 7px 9px; border-radius: 999px; background: #e9eee7; color: var(--atlas-green); font-size: .67rem; font-weight: 850; }
.narrative-atlas-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.narrative-atlas-step { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; padding: 13px; border: 1px solid var(--atlas-line); border-radius: 12px; background: var(--atlas-surface); }
.narrative-atlas-step-index { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--atlas-green); color: #fff; font: 850 .75rem/1 system-ui, sans-serif; }
.narrative-atlas-step h3 { margin: 0; color: var(--atlas-green); font: 850 1rem/1.1 Georgia, serif; }
.narrative-atlas-step p { margin: 5px 0 10px; color: var(--atlas-muted); font-size: .71rem; line-height: 1.4; }
.narrative-atlas-step button { min-height: 35px; padding: 0 9px; border: 1px solid var(--atlas-line); border-radius: 7px; background: #f5f0e5; color: var(--atlas-green); font: 850 .66rem/1 system-ui, sans-serif; cursor: pointer; }
.narrative-atlas-place-detail { margin-top: 14px; padding: 16px; border-left: 4px solid var(--atlas-gold); background: #f5eddb; }
.narrative-atlas-place-detail h3 { margin: 0; color: var(--atlas-green); font: 850 1.3rem/1.05 Georgia, serif; }
.narrative-atlas-place-detail p { margin: 7px 0 0; color: var(--atlas-muted); font-size: .78rem; line-height: 1.5; }
.narrative-atlas-place-source { color: #806b4b !important; font-size: .65rem !important; }
.narrative-atlas-place-open { min-height: 42px; margin-top: 14px; padding: 0 13px; border: 1px solid var(--atlas-green); border-radius: 8px; background: var(--atlas-green); color: #fff; font: 850 .72rem/1 system-ui, sans-serif; cursor: pointer; }
.narrative-atlas-place-open:hover { background: #286457; }
.narrative-atlas-place-open:focus-visible { outline: 3px solid rgba(200, 149, 63, .5); outline-offset: 3px; }
.narrative-atlas-map { padding: 16px; }
.narrative-atlas-map[hidden], .narrative-atlas-story[hidden], .narrative-atlas-place-detail[hidden], .narrative-atlas-adaptation[hidden] { display: none !important; }
.narrative-atlas-map-head { display: flex; justify-content: space-between; gap: 12px; align-items: end; margin-bottom: 12px; }
.narrative-atlas-map h2 { margin: 0; color: var(--atlas-green); font: 850 1.3rem/1.05 Georgia, serif; }
.narrative-atlas-map p { margin: 5px 0 0; color: var(--atlas-muted); font-size: .74rem; }
.narrative-atlas-map svg { display: block; width: 100%; min-height: 360px; border: 1px solid rgba(29, 75, 67, .1); border-radius: 15px; background: linear-gradient(145deg, #e9f0e5, #f4e9d2); }
.atlas-map-land { fill: #d7e4d4; stroke: #a5bca7; stroke-width: 1.2; }
.atlas-map-water { fill: #dbe9ed; }
.atlas-map-route { fill: none; stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; opacity: .78; }
.atlas-map-node { fill: var(--atlas-green); stroke: #fffdf8; stroke-width: 2; cursor: pointer; }
.atlas-map-node.is-active { fill: var(--atlas-gold); r: 5.2; }
.atlas-map-label { fill: var(--atlas-ink); font: 700 3.4px system-ui, sans-serif; pointer-events: none; }
.narrative-atlas-map-legend { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; color: var(--atlas-muted); font-size: .65rem; }
.narrative-atlas-map-legend span { display: inline-flex; align-items: center; gap: 5px; }
.narrative-atlas-map-legend i { width: 18px; height: 3px; display: inline-block; background: var(--atlas-green); }
.narrative-atlas-map-legend .atlas-map-legend-other { background: #9eb5a0; }
.narrative-atlas-adapter { display: grid; gap: 14px; margin-top: 16px; padding: 18px; }
.narrative-atlas-adapter > p { margin: -6px 0 0; color: var(--atlas-muted); font-size: .78rem; line-height: 1.4; }
.narrative-atlas-adapter-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 9px; align-items: end; }
.narrative-atlas-adapter label { display: grid; gap: 6px; color: var(--atlas-muted); font: 800 .65rem/1 system-ui, sans-serif; }
.narrative-atlas-adapter select { min-height: 43px; padding: 0 8px; border: 1px solid var(--atlas-line); border-radius: 8px; background: #fff; color: var(--atlas-ink); font: 700 .72rem/1 system-ui, sans-serif; }
.narrative-atlas-adapt-button { min-height: 43px; padding: 0 14px; border: 1px solid var(--atlas-green); border-radius: 8px; background: var(--atlas-green); color: #fff; font: 850 .72rem/1 system-ui, sans-serif; cursor: pointer; }
.narrative-atlas-adaptation { display: grid; gap: 8px; padding: 13px; border: 1px solid #d6bd83; background: #fbf3dd; }
.narrative-atlas-adaptation strong { color: var(--atlas-green); font: 850 1rem/1.15 Georgia, serif; }
.narrative-atlas-adaptation p { margin: 0; color: var(--atlas-muted); font-size: .75rem; line-height: 1.4; }
.narrative-atlas-adaptation-list { display: flex; flex-wrap: wrap; gap: 6px; }
.narrative-atlas-adaptation-list span { padding: 6px 8px; border-radius: 999px; background: #fffdf8; color: var(--atlas-green); font-size: .66rem; font-weight: 800; }
.narrative-atlas-empty { padding: 30px 10px; color: var(--atlas-muted); text-align: center; font-size: .8rem; }
@media (max-width: 1050px) { .narrative-atlas-toolbar { grid-template-columns: 1fr 1fr 1fr; } .narrative-atlas-tabs { grid-column: span 3; } .narrative-atlas-search { grid-column: span 2; } .narrative-atlas-surprise { grid-column: span 1; } .narrative-atlas-adapter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .narrative-atlas-shell { width: min(100% - 18px, 600px); } .narrative-atlas-head { align-items: flex-start; padding-top: 24px; } .narrative-atlas-head h1 { font-size: clamp(2.4rem, 13vw, 4.4rem); } .narrative-atlas-close { padding: 0 10px; } .narrative-atlas-layout { grid-template-columns: 1fr; } .narrative-atlas-library { order: 2; } .narrative-atlas-stage { order: 1; } .narrative-atlas-route-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } .narrative-atlas-steps { grid-template-columns: 1fr; } .narrative-atlas-map svg { min-height: 290px; } }
@media (max-width: 480px) { .narrative-atlas-toolbar { grid-template-columns: 1fr 1fr; } .narrative-atlas-tabs, .narrative-atlas-search, .narrative-atlas-surprise { grid-column: span 2; } .narrative-atlas-toolbar select { min-width: 0; } .narrative-atlas-route-list { grid-template-columns: 1fr; } .narrative-atlas-story-head { display: grid; } .narrative-atlas-story-actions { justify-content: flex-start; } .narrative-atlas-adapter-form { grid-template-columns: 1fr; } }