/* Isolated comparison navigation; original template files remain unchanged. */
:root { --comparison-space: calc(76px + env(safe-area-inset-bottom, 0px)); }
.comparison-switch {
  position: fixed;
  z-index: 25;
  right: max(16px, env(safe-area-inset-right, 0px));
  bottom: max(16px, env(safe-area-inset-bottom, 0px));
  display: flex;
  gap: 4px;
  padding: 5px;
  margin: 0;
  border: 1px solid #796b5c;
  border-radius: 12px;
  background: #f4f0e9;
  box-shadow: 0 4px 18px #0003;
  font: 500 14px/1.4 "Microsoft YaHei", "PingFang SC", sans-serif;
}
.comparison-switch .comparison-switch__link {
  display: inline-flex;
  min-width: 72px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: #3b332a;
  text-decoration: none;
}
.comparison-switch .comparison-switch__link:hover { background: #e4dace; }
.comparison-switch .comparison-switch__link[aria-current="page"] {
  border-color: #29231e;
  background: #29231e;
  color: #fffaf2;
  font-weight: 700;
}
.comparison-switch .comparison-switch__link:focus-visible {
  outline: 3px solid #a83816;
  outline-offset: 3px;
}
body.comparison-one { overflow-y: auto; }
.comparison-one .stage { height: calc(100dvh - 80px - 120px - var(--comparison-space)); }
.comparison-one .strip { height: calc(120px + var(--comparison-space)); padding-bottom: var(--comparison-space); }
.comparison-two .site-footer { padding-bottom: calc(32px + var(--comparison-space)); }
.comparison-one.is-intro .comparison-switch,
.comparison-one:has(#lightbox:not([hidden])) .comparison-switch,
.comparison-one:has(#overview:not([hidden])) .comparison-switch,
.comparison-two:has(dialog[open]) .comparison-switch { visibility: hidden; }
@media (max-width: 760px) {
  .comparison-one .stage { height: auto; }
  .comparison-switch { right: max(12px, env(safe-area-inset-right, 0px)); bottom: max(12px, env(safe-area-inset-bottom, 0px)); }
}
@media (min-width: 768px) {
  .comparison-two .site-footer { padding-bottom: calc(36px + var(--comparison-space)); }
  .comparison-two .thumbnail-rail { margin-right: 180px; justify-content: flex-start; }
}