/* Website refinements retain the original atlas typography and palette. */
html { scroll-padding-top: 120px; }
body { margin: 0; }
main { min-height: calc(100vh - 115px); outline: none; }
.top .wrap { gap: 16px; }
.tabs { width: 100%; min-width: 0; }
.brand { flex-direction: row; align-items: center; gap: 10px; }
.brand > div { min-width: 0; display: flex; flex-direction: column; }
.brand-mark { flex-shrink: 0; border-radius: 8px; }
.card, .stack, .split > *, .statue > *, .picrow > * { min-width: 0; }
.card { overflow-wrap: anywhere; }
.chip, .cat, .verdict { max-width: 100%; white-space: normal; line-height: 1.35; }
.sg-ret { color: var(--bg) !important; }
.hero h1 { max-width: 1100px; }
.hero { padding-top: 8px; }
.tabs button, .iconbtn, .btn { transition: background-color .16s ease, border-color .16s ease; }
.tabs button { min-height: 42px; }
.tl:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.part[role="button"]:focus-visible { stroke: var(--gold); stroke-width: 3; outline: none; }
.skip-link { position: fixed; top: -100px; left: 16px; z-index: 100; background: var(--gold); color: var(--bg); padding: 10px 16px; border-radius: 8px; font-weight: 600; }
.skip-link:focus { top: 12px; }
body.dialog-open { overflow: hidden; }
.results button:focus-visible { outline-offset: -2px; background: var(--panel2); }
@media (max-width: 820px) {
  .top > .wrap:first-child { flex-wrap: wrap; padding-block: 12px; gap: 10px; }
  .brand { flex: 1 1 calc(100% - 60px); }
  .brand b { font-size: 1.25rem; }
  .search { order: 3; flex: 1 1 100%; }
  .search input { min-height: 44px; }
  .results { width: 100%; max-height: 50vh; }
  .iconbtn { width: 42px; height: 42px; }
  .top .wrap:last-child { padding-block: 0; }
  html { scroll-padding-top: 170px; }
  .dsec { scroll-margin-top: 180px; }
  main section { padding-block: 24px 44px; }
  .hero h1 { font-size: clamp(2rem, 6.2vw, 3rem); }
}
@media (max-width: 560px) {
  .brand b { font-size: 1.12rem; letter-spacing: .015em; }
  .brand-mark { width: 30px; height: 30px; }
  .brand span { display: none; }
  .hero h1 { letter-spacing: .025em; font-size: 2.25rem; }
  .hero .sub { margin-block: 5px; }
  .seg button { min-height: 42px; padding-inline: 11px; }
  .btn { min-height: 38px; }
  .ctl .sep { display: none; }
  .ctl { gap: 8px; margin-block: 14px; }
  #eraJump { flex: 1; }
  .card { padding: 16px; }
  .legend { row-gap: 10px; }
  .phead { padding-top: 16px; }
  .phead > .row:first-child { padding-right: 40px; }
  .ref { white-space: normal; text-align: left; }
  .rbar .mk { font-size: .6rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; scroll-behavior: auto !important; }
}