.pfad-atlas {
  --atlas-ground:#14261f;
  --atlas-cell:#1b3028;
  --atlas-rule:#486c59;
  --atlas-ink:#e6f1e8;
  --atlas-muted:#b1c9bc;
  --atlas-gold:#dfbd7d;
  --atlas-violet:#b8ace0;
  color:var(--atlas-ink);
  background:var(--atlas-ground);
  border:1px solid var(--atlas-rule);
  border-radius:12px;
  margin:1.4rem 0 .8rem;
  overflow:hidden;
}
.pfad-atlas .pfad-atlas-caption {display:flex;justify-content:space-between;flex-wrap:wrap;gap:.3rem 1rem;padding:1rem 1.2rem 0;font-weight:650}
.pfad-atlas .pfad-atlas-caption span+span {font-size:.85rem;font-weight:400;color:var(--atlas-muted)}
.family-game .pfad-atlas .family-board-scroll.pfad-atlas-scroll {margin:.3rem 0 0;border:0;border-radius:0;background:transparent;scrollbar-color:#7da48d var(--atlas-ground)}
.pfad-atlas-field {position:relative;min-width:600px;max-width:600px;aspect-ratio:1;margin:auto;isolation:isolate}
.pfad-atlas-drawing {position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.pfad-atlas-contours {fill:none;stroke:#7da48d;stroke-width:1;opacity:.35}
.pfad-atlas-hex {fill:var(--atlas-cell);stroke:var(--atlas-rule);stroke-width:.8}
.pfad-atlas-hex.is-placed {stroke:var(--route-color);stroke-width:1.4;fill:#223c30}
.pfad-atlas-hex.is-endpoint {stroke:#b9e8ca;stroke-width:1.6}
.pfad-atlas-empty {fill:#8ba795}
.pfad-atlas-gold {--route-color:var(--atlas-gold)}
.pfad-atlas-violet {--route-color:var(--atlas-violet)}
.pfad-atlas-extra {--route-color:#e5a58e}
.pfad-atlas-route {fill:none;stroke:var(--route-color);stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.pfad-atlas-violet .pfad-atlas-route {stroke-dasharray:9 4}
.pfad-atlas-route.is-disconnected {stroke:#e5a58e;stroke-width:2;stroke-dasharray:3 6}
.pfad-atlas-landmark {fill:var(--atlas-ground);stroke:#c4edd1;stroke-width:1.4}
.family-game .pfad-atlas .pfad-atlas-field .pfad-atlas-cell {
  position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);
  width:calc(86% / var(--columns));aspect-ratio:1.15;min-height:48px;
  display:flex;flex-direction:column;gap:.1rem;justify-content:center;
  padding:.15rem;border:0;border-radius:6px;background:transparent;color:var(--atlas-ink);
  font-size:.8rem;font-weight:600;line-height:1.2;
}
.family-game .pfad-atlas .pfad-atlas-field .pfad-atlas-cell span {max-width:100%;padding:.12rem .15rem;overflow-wrap:anywhere;background:var(--atlas-ground);border-radius:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-height:2.65em}
.family-game .pfad-atlas .pfad-atlas-field .pfad-atlas-cell small {font-size:.65rem;color:var(--atlas-muted);background:var(--atlas-ground);padding:0 .12rem;line-height:1.2}
.family-game .pfad-atlas .pfad-atlas-field .pfad-atlas-cell.is-endpoint {padding-top:1.15rem}
.family-game .pfad-atlas .pfad-atlas-field .pfad-atlas-cell:hover:not(:disabled) {background:#b9e8ca18;color:var(--atlas-ink)}
.family-game .pfad-atlas .pfad-atlas-field .pfad-atlas-cell[aria-pressed=true] {background:transparent;color:var(--atlas-ink)}
.family-game .pfad-atlas .pfad-atlas-field .pfad-atlas-cell:focus-visible {outline:3px solid #efb276;outline-offset:2px;z-index:1}
.family-game .pfad-atlas .pfad-atlas-field .pfad-atlas-cell:disabled {opacity:1;cursor:default}
.pfad-atlas .pfad-atlas-legend {display:flex;flex-wrap:wrap;gap:.85rem 1.8rem;list-style:none;padding:1rem 1.2rem;margin:0;border-top:1px solid var(--atlas-rule);max-width:none}
.pfad-atlas-legend li {display:flex;gap:.6rem;align-items:center;font-size:.9rem;line-height:1.35}
.pfad-atlas-legend .pfad-atlas-key {display:grid;place-items:center;width:1.6rem;height:1.6rem;flex-shrink:0;border:1px solid var(--route-color);color:var(--route-color);border-radius:50%;font-size:.75rem}
.pfad-atlas-legend .pfad-atlas-violet .pfad-atlas-key {border-style:dashed;border-radius:3px}
.family-game .pfad-atlas-legend small {font-size:.8rem;color:var(--atlas-muted)}
.pfad-atlas .pfad-atlas-empty-note {padding:.65rem 1.2rem 1rem;margin:0;font-size:.9rem;color:var(--atlas-muted)}
.pfad-atlas .family-board-pan-hint {padding:0 1.2rem;color:var(--atlas-muted)}
.pfad-atlas .pfad-atlas-visually-hidden {position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:600px) {
  .pfad-atlas .pfad-atlas-caption {padding:.8rem .8rem 0}
  .pfad-atlas .pfad-atlas-legend {padding:.85rem .8rem;gap:.75rem}
  .family-game .pfad-atlas .pfad-atlas-field .pfad-atlas-cell {font-size:.76rem}
}
@media(prefers-reduced-motion:no-preference) {
  .pfad-atlas-route.is-new-segment {animation:pfad-route-arrive .28s cubic-bezier(.16,1,.3,1)}
  @keyframes pfad-route-arrive {from{stroke-opacity:.35;stroke-width:2}to{stroke-opacity:1;stroke-width:5}}
}

.family-game .pfad-atlas .pfad-atlas-field .pfad-atlas-cell.is-endpoint span {-webkit-line-clamp:1;max-height:1.4em}