.space-walk-page {
  width: min(1120px, calc(100% - 32px));
  margin: .9rem auto 1.25rem;
  min-height: auto;
  color: #0f172a;
  overflow-x: clip;
  --walk-card-height: clamp(500px, calc(100dvh - 235px), 680px);
}
.space-walk-header {
  position: relative;
  z-index: 5;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-end;
  margin: 0 auto .9rem;
  padding: .65rem 0 .55rem;
  max-width: 980px;
  background: transparent;
}
.space-walk-back {
  display: inline-flex;
  margin-bottom: .4rem;
  color: #2563eb;
  font-weight: 760;
  text-decoration: none;
}
.space-walk-header h1 {
  margin: .15rem 0 .24rem;
  font-size: clamp(1.85rem, 3vw, 2.75rem);
  line-height: 1;
  letter-spacing: -.045em;
}
.space-walk-header p:not(.eyebrow) {
  margin: 0;
  color: #475569;
  font-size: .98rem;
  line-height: 1.35;
  max-width: 58ch;
}
.space-walk-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .65rem;
  flex-wrap: wrap;
  flex: 0 0 auto;
}
.space-walk-count {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  min-height: 42px;
  padding: .56rem .86rem;
  border: 1px solid rgba(147, 197, 253, .55);
  border-radius: 999px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 12px 30px rgba(15,23,42,.055);
  font-weight: 850;
  color: #475569;
}
.space-walk-count strong { color: #0f172a; }
.space-walk-rail {
  display: grid;
  max-width: 980px;
  height: var(--walk-card-height);
  margin: 0 auto;
  position: relative;
  isolation: isolate;
  touch-action: none;
}
.space-walk-card {
  grid-area: 1 / 1;
  height: var(--walk-card-height);
  display: grid;
  grid-template-columns: minmax(320px, 1.02fr) minmax(300px, .98fr);
  overflow: hidden;
  border: 1px solid rgba(147, 197, 253, .62);
  border-radius: 30px;
  background: rgba(255,255,255,.9);
  box-shadow: 0 24px 68px rgba(15,23,42,.085);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(18px) scale(.985);
  transition: opacity .18s ease, transform .22s cubic-bezier(.2,.8,.2,1), visibility 0s linear .22s;
}
.space-walk-card.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0) scale(1);
  transition-delay: 0s;
}
.space-walk-page[data-walk-direction="next"] .space-walk-card.is-active {
  animation: walkPopNext .22s cubic-bezier(.18,.84,.3,1) both;
}
.space-walk-page[data-walk-direction="prev"] .space-walk-card.is-active {
  animation: walkPopPrev .22s cubic-bezier(.18,.84,.3,1) both;
}
@keyframes walkPopNext {
  from { opacity: .3; transform: translateY(38px) scale(.965); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes walkPopPrev {
  from { opacity: .3; transform: translateY(-38px) scale(.965); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.space-walk-media {
  position: relative;
  display: flex;
  min-height: 100%;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: radial-gradient(circle at 25% 15%, rgba(219,234,254,.98), rgba(239,246,255,.72) 36%, rgba(238,242,255,.98) 100%);
  background-size: cover;
  background-position: center;
  color: inherit;
  text-decoration: none;
}
.space-walk-media.has-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(15,23,42,.015), rgba(15,23,42,.28));
}
.space-walk-media.is-text-fallback::before {
  content: "";
  position: absolute;
  width: 68%;
  aspect-ratio: 1;
  border-radius: 999px;
  right: -18%;
  bottom: -28%;
  background: rgba(59,130,246,.08);
}
.space-walk-media.is-text-fallback {
  flex-direction: column;
  gap: 1rem;
  padding: 2rem;
  text-align: center;
}
.space-walk-fallback-icon {
  display: grid;
  place-items: center;
  width: 82px;
  height: 82px;
  border-radius: 26px;
  background: rgba(255,255,255,.76);
  box-shadow: 0 16px 40px rgba(37,99,235,.12);
  font-size: 1.85rem;
}
.space-walk-media strong {
  position: relative;
  z-index: 1;
  max-width: 18ch;
  color: #475569;
  font-size: .9rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.space-walk-card-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .75rem;
  padding: clamp(1.35rem, 2.8vw, 2.25rem);
  min-width: 0;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.space-walk-meta-line {
  display: flex;
  gap: .45rem;
  flex-wrap: wrap;
  align-items: center;
  color: #64748b;
  font-size: .88rem;
  font-weight: 750;
}
.space-walk-meta-line a {
  color: #2563eb;
  text-decoration: none;
}
.space-walk-meta-line > *:not(:last-child)::after {
  content: "·";
  margin-left: .45rem;
  color: #94a3b8;
}
.space-walk-card h2 {
  margin: 0;
  color: #020817;
  font-size: clamp(1.55rem, 2.65vw, 2.35rem);
  line-height: 1.05;
  letter-spacing: -.04em;
}
.space-walk-card h2 a {
  color: inherit;
  text-decoration: none;
}
.space-walk-card p {
  margin: 0;
  color: #475569;
  font-size: 1rem;
  line-height: 1.48;
}
.space-walk-card-foot {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  color: #64748b;
  font-weight: 800;
}
.space-walk-card-foot span {
  display: inline-flex;
  padding: .4rem .68rem;
  border-radius: 999px;
  background: rgba(241,245,249,.9);
}
.space-walk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: .2rem;
}
.space-walk-controls {
  position: fixed;
  right: max(1.2rem, calc((100vw - 1180px) / 2));
  top: 55%;
  z-index: 30;
  display: grid;
  gap: .65rem;
  transform: translateY(-50%);
}
.space-walk-control {
  width: 50px;
  height: 50px;
  border: 1px solid rgba(147,197,253,.72);
  border-radius: 999px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 16px 40px rgba(15,23,42,.12);
  color: #2563eb;
  font-size: 1.4rem;
  font-weight: 900;
  cursor: pointer;
}
.space-walk-control:disabled {
  opacity: .42;
  cursor: not-allowed;
}
.space-walk-empty {
  max-width: 720px;
  margin: 2rem auto;
  padding: 2rem;
  border: 1px solid rgba(147,197,253,.55);
  border-radius: 28px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 20px 50px rgba(15,23,42,.08);
}
.space-walk-empty h2 { margin: .25rem 0 .5rem; }
.space-walk-empty p { color: #475569; }

@media (max-width: 1180px) {
  .space-walk-controls { right: .75rem; }
}

@media (max-width: 920px) {
  .space-walk-page {
    width: min(100% - 22px, 720px);
    margin-top: .5rem;
  }
  .space-walk-header {
    align-items: flex-start;
    flex-direction: column;
    padding-top: .25rem;
    max-width: 100%;
  }
  .space-walk-header h1 {
    font-size: clamp(1.65rem, 6.5vw, 2.45rem);
    letter-spacing: -.04em;
  }
  .space-walk-header-actions { width: 100%; justify-content: space-between; }
  .space-walk-rail { max-width: 100%; }
  .space-walk-card {
    height: var(--walk-card-height);
    min-height: 0;
    grid-template-columns: 1fr;
    grid-template-rows: minmax(220px, 46%) minmax(0, 54%);
    border-radius: 28px;
  }
  .space-walk-media { min-height: 0; }
  .space-walk-card-body { justify-content: flex-start; padding: 1.25rem; }
  .space-walk-card h2 { font-size: clamp(1.45rem, 5.8vw, 2rem); }
  .space-walk-card p { font-size: .98rem; }
  .space-walk-controls { display: none; }
}

@media (max-width: 620px) {
  .space-walk-page {
    width: calc(100% - 20px);
    margin-top: .35rem;
    margin-bottom: calc(.75rem + env(safe-area-inset-bottom));
    --walk-card-height: calc(100dvh - 245px - env(safe-area-inset-bottom));
  }
  .space-walk-header {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: .75rem;
    margin-bottom: .7rem;
    padding: .2rem 0 .35rem;
  }
  .space-walk-back {
    margin: 0;
    font-size: .96rem;
  }
  .space-walk-header .eyebrow {
    display: inline-flex;
    margin: 0 0 0 .35rem;
    vertical-align: middle;
  }
  .space-walk-header h1,
  .space-walk-header p:not(.eyebrow),
  .space-walk-header-actions .button {
    display: none;
  }
  .space-walk-header-actions {
    grid-column: 2;
    grid-row: 1;
    width: auto;
    justify-content: end;
  }
  .space-walk-count {
    min-height: 44px;
    padding: .55rem .8rem;
    font-size: 1rem;
  }
  .space-walk-card {
    min-height: 0;
    grid-template-rows: minmax(185px, 48%) minmax(0, 52%);
  }
  .space-walk-card-body {
    max-height: none;
    padding: .95rem 1rem;
    overflow: hidden;
  }
  .space-walk-meta-line {
    font-size: .82rem;
    line-height: 1.2;
  }
  .space-walk-card p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
  }
  .space-walk-card-foot {
    gap: .4rem;
  }
  .space-walk-card-foot span {
    padding: .34rem .58rem;
    font-size: .86rem;
  }
  .space-walk-actions .button { flex: 1 1 140px; justify-content: center; }
}

.space-walk-page.is-walk-tight .space-walk-header {
  margin-bottom: .5rem;
  padding-bottom: .25rem;
}
.space-walk-page.is-walk-tight .space-walk-card-body {
  gap: .55rem;
}
.space-walk-page.is-walk-tight .space-walk-card h2 {
  font-size: clamp(1.32rem, 4.9vw, 1.8rem);
}
.space-walk-page.is-walk-tight .space-walk-actions {
  gap: .45rem;
  margin-top: 0;
}
@media (max-width: 620px) {
  .space-walk-page.is-walk-tight .space-walk-card {
    grid-template-rows: minmax(165px, 45%) minmax(0, 55%);
  }
  .space-walk-page.is-walk-tight .space-walk-card-body {
    padding: .82rem .9rem;
    gap: .45rem;
  }
  .space-walk-page.is-walk-tight .space-walk-card p {
    -webkit-line-clamp: 2;
  }
  .space-walk-page.is-walk-tight .space-walk-actions .button {
    min-height: 40px;
    padding: .55rem .75rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .space-walk-card,
  .space-walk-page[data-walk-direction="next"] .space-walk-card.is-active,
  .space-walk-page[data-walk-direction="prev"] .space-walk-card.is-active {
    animation: none;
    transition: none;
  }
}

/* 2026-06-30: Post Panel Walk — guided walk through one post and its connected panel. */
.post-panel-walk-page {
  --walk-card-height: clamp(540px, calc(100dvh - 235px), 740px);
}
.post-panel-walk-header h1 {
  max-width: 18ch;
}
.post-panel-walk-card-body {
  justify-content: flex-start;
  gap: .78rem;
}
.post-walk-step-kicker {
  display: inline-flex;
  width: fit-content;
  padding: .38rem .65rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--world-accent, #6aa6ff) 12%, #ffffff);
  border: 1px solid color-mix(in srgb, var(--world-accent, #6aa6ff) 24%, #dbeafe);
  color: #1e3a8a;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.post-walk-content-body {
  color: #475569;
  font-size: 1rem;
  line-height: 1.5;
}
.post-walk-content-body p,
.post-panel-walk-card .post-walk-content-body p {
  display: block;
  margin: 0 0 .55rem;
  color: inherit;
  -webkit-line-clamp: unset;
  overflow: visible;
}
.post-walk-content-body p:last-child { margin-bottom: 0; }
.post-walk-card-foot {
  margin-top: .1rem;
}
.post-walk-conversation-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .8rem;
  align-items: center;
  padding: .9rem;
  border: 1px solid rgba(147,197,253,.52);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(239,246,255,.9), rgba(255,255,255,.88));
}
.post-walk-conversation-card .eyebrow {
  margin-bottom: .22rem;
}
.post-walk-conversation-card h3 {
  margin: 0 0 .18rem;
  color: #0f172a;
  font-size: 1rem;
  line-height: 1.15;
}
.post-walk-conversation-card p,
.post-panel-walk-card .post-walk-conversation-card p {
  display: block;
  margin: 0;
  color: #64748b;
  font-size: .9rem;
  line-height: 1.35;
  -webkit-line-clamp: unset;
  overflow: visible;
}
.post-walk-conversation-actions {
  display: flex;
  gap: .55rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.post-panel-walk-actions {
  margin-top: 0;
}
.post-walk-return-strip {
  max-width: 980px;
  margin: .85rem auto -.25rem;
}

@media (max-width: 920px) {
  .post-panel-walk-page {
    --walk-card-height: calc(100dvh - 225px);
  }
  .post-walk-conversation-card {
    grid-template-columns: 1fr;
    align-items: stretch;
  }
  .post-walk-conversation-actions {
    justify-content: flex-start;
  }
}

@media (max-width: 620px) {
  .post-panel-walk-page {
    --walk-card-height: calc(100dvh - 210px - env(safe-area-inset-bottom));
  }
  .post-panel-walk-card {
    grid-template-rows: minmax(135px, 34%) minmax(0, 66%);
  }
  .post-panel-walk-card-body {
    overflow-y: auto;
    overscroll-behavior: contain;
    gap: .58rem;
  }
  .post-walk-step-kicker {
    font-size: .72rem;
    padding: .3rem .54rem;
  }
  .post-walk-content-body {
    font-size: .94rem;
  }
  .post-walk-conversation-card {
    padding: .72rem;
    border-radius: 17px;
  }
  .post-walk-conversation-actions .button,
  .post-panel-walk-actions .button {
    flex: 1 1 130px;
    justify-content: center;
  }
}

/* 2026-06-30: Keep Post Walk conversations visible by making long post text scroll inside its own section. */
.post-panel-walk-card-body {
  min-height: 0;
}
.post-panel-walk-card .post-walk-content-body {
  flex: 0 1 auto;
  max-height: clamp(8rem, 25dvh, 14rem);
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: .4rem;
  scrollbar-gutter: stable;
}
.post-panel-walk-card .post-walk-content-body:focus-within,
.post-panel-walk-card .post-walk-content-body:focus {
  outline: 2px solid color-mix(in srgb, var(--world-accent, #6aa6ff) 35%, transparent);
  outline-offset: 3px;
  border-radius: 12px;
}
.post-panel-walk-card .post-walk-content-body::-webkit-scrollbar {
  width: 8px;
}
.post-panel-walk-card .post-walk-content-body::-webkit-scrollbar-thumb {
  background: rgba(100, 116, 139, .42);
  border-radius: 999px;
}
.post-panel-walk-card .post-walk-content-body::-webkit-scrollbar-track {
  background: rgba(226, 232, 240, .55);
  border-radius: 999px;
}
.post-panel-walk-card .post-walk-conversation-card {
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: .65rem;
}
.post-panel-walk-card .post-walk-conversation-actions {
  justify-content: flex-start;
}
.post-panel-walk-card .post-walk-conversation-actions .button {
  white-space: nowrap;
}

@media (max-width: 920px) {
  .post-panel-walk-card .post-walk-content-body {
    max-height: clamp(6.5rem, 20dvh, 11rem);
  }
}

@media (max-width: 620px) {
  .post-panel-walk-card .post-walk-content-body {
    max-height: clamp(5.4rem, 18dvh, 8.5rem);
    padding-right: .32rem;
  }
  .post-panel-walk-card .post-walk-conversation-actions .button {
    white-space: normal;
  }
}

/* 2026-06-30: Post Walk full-body fix — make the post text the main area, not an excerpt. */
.post-panel-walk-rail {
  max-width: min(1220px, 100%);
}
.post-panel-walk-card {
  grid-template-columns: minmax(230px, .62fr) minmax(520px, 1.38fr);
}
.post-panel-walk-card-body {
  display: grid;
  grid-template-rows: auto auto auto minmax(190px, 1fr) auto auto auto;
  align-content: stretch;
  justify-content: stretch;
  gap: .72rem;
  overflow: hidden;
}
.post-panel-walk-card .space-walk-meta-line,
.post-panel-walk-card .post-walk-step-kicker,
.post-panel-walk-card h2,
.post-panel-walk-card .post-walk-card-foot,
.post-panel-walk-card .post-walk-conversation-card,
.post-panel-walk-card .post-panel-walk-actions {
  min-width: 0;
}
.post-panel-walk-card .post-walk-content-body {
  flex: none;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: .15rem .65rem .15rem 0;
  scrollbar-gutter: stable;
}
.post-panel-walk-card .post-walk-content-body,
.post-panel-walk-card .post-walk-content-body p,
.post-panel-walk-card .post-walk-content-body li,
.post-panel-walk-card .post-walk-content-body blockquote {
  font-size: clamp(1rem, 1.15vw, 1.08rem);
  line-height: 1.55;
}
.post-panel-walk-card .post-walk-content-body > *:first-child {
  margin-top: 0;
}
.post-panel-walk-card .post-walk-content-body > *:last-child {
  margin-bottom: 0;
}
.post-panel-walk-card .post-walk-conversation-card {
  margin-top: .08rem;
}

@media (max-width: 1080px) {
  .post-panel-walk-card {
    grid-template-columns: minmax(210px, .55fr) minmax(470px, 1.45fr);
  }
}

@media (max-width: 920px) {
  .post-panel-walk-card {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(140px, 28%) minmax(0, 72%);
  }
  .post-panel-walk-card-body {
    grid-template-rows: auto auto auto minmax(170px, 1fr) auto auto auto;
    overflow: hidden;
  }
}

@media (max-width: 620px) {
  .post-panel-walk-card {
    grid-template-rows: minmax(96px, 22%) minmax(0, 78%);
  }
  .post-panel-walk-card-body {
    grid-template-rows: auto auto auto minmax(145px, 1fr) auto auto auto;
    gap: .5rem;
    overflow: hidden;
  }
  .post-panel-walk-card .space-walk-media.is-text-fallback {
    gap: .35rem;
    padding: .8rem;
  }
  .post-panel-walk-card .space-walk-fallback-icon {
    width: 54px;
    height: 54px;
    border-radius: 18px;
    font-size: 1.2rem;
  }
  .post-panel-walk-card .space-walk-media strong {
    font-size: .74rem;
  }
  .post-panel-walk-card .post-walk-content-body {
    max-height: none;
    padding-right: .42rem;
  }
  .post-panel-walk-card .post-walk-content-body,
  .post-panel-walk-card .post-walk-content-body p,
  .post-panel-walk-card .post-walk-content-body li,
  .post-panel-walk-card .post-walk-content-body blockquote {
    font-size: .96rem;
    line-height: 1.5;
  }
}

/* 2026-06-30: Post Walk mobile repair — make the post body the focus while keeping the attached conversation visible. */
@media (max-width: 620px) {
  .post-panel-walk-page {
    width: calc(100% - 18px);
    margin-bottom: calc(86px + env(safe-area-inset-bottom));
  }

  .post-panel-walk-card {
    grid-template-rows: 84px minmax(0, 1fr) !important;
    border-radius: 22px;
  }

  .post-panel-walk-card .space-walk-media {
    min-height: 84px;
  }

  .post-panel-walk-card .space-walk-media.is-text-fallback {
    gap: .22rem;
    padding: .55rem;
  }

  .post-panel-walk-card .space-walk-fallback-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    font-size: 1rem;
  }

  .post-panel-walk-card .space-walk-media strong {
    font-size: .68rem;
    letter-spacing: .08em;
  }

  .post-panel-walk-card-body {
    display: flex !important;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    padding: .82rem .95rem calc(.85rem + env(safe-area-inset-bottom)) !important;
    gap: .44rem;
  }

  .post-panel-walk-card .space-walk-meta-line {
    flex: 0 0 auto;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: .02rem;
    font-size: .78rem;
    line-height: 1.25;
    scrollbar-width: none;
  }

  .post-panel-walk-card .space-walk-meta-line::-webkit-scrollbar {
    display: none;
  }

  .post-panel-walk-card .post-walk-step-kicker {
    flex: 0 0 auto;
    font-size: .68rem;
    padding: .27rem .48rem;
  }

  .post-panel-walk-card h2 {
    flex: 0 0 auto;
    font-size: clamp(1.28rem, 5.8vw, 1.72rem);
    line-height: 1.05;
  }

  .post-panel-walk-card .post-walk-content-body {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: .05rem .42rem .05rem 0;
    scrollbar-gutter: stable;
  }

  .post-panel-walk-card .post-walk-content-body,
  .post-panel-walk-card .post-walk-content-body p,
  .post-panel-walk-card .post-walk-content-body li,
  .post-panel-walk-card .post-walk-content-body blockquote {
    display: block;
    overflow: visible;
    -webkit-line-clamp: unset;
    font-size: .96rem;
    line-height: 1.48;
  }

  .post-panel-walk-card .post-walk-card-foot {
    flex: 0 0 auto;
    flex-wrap: nowrap;
    gap: .35rem;
    overflow-x: auto;
    padding-bottom: .02rem;
    margin-top: 0;
    scrollbar-width: none;
  }

  .post-panel-walk-card .post-walk-card-foot::-webkit-scrollbar {
    display: none;
  }

  .post-panel-walk-card .post-walk-card-foot span {
    flex: 0 0 auto;
    padding: .27rem .48rem;
    font-size: .78rem;
  }

  .post-panel-walk-card .post-walk-conversation-card {
    flex: 0 0 auto;
    margin-top: 0;
    padding: .62rem;
    gap: .46rem;
    border-radius: 16px;
  }

  .post-panel-walk-card .post-walk-conversation-card .eyebrow {
    margin-bottom: .08rem;
    font-size: .72rem;
  }

  .post-panel-walk-card .post-walk-conversation-card h3 {
    margin-bottom: .1rem;
    font-size: .94rem;
  }

  .post-panel-walk-card .post-walk-conversation-card p,
  .post-panel-walk-card .post-walk-conversation-card p * {
    display: inline;
    overflow: visible;
    -webkit-line-clamp: unset;
    font-size: .82rem;
    line-height: 1.28;
  }

  .post-panel-walk-card .post-walk-conversation-actions {
    gap: .42rem;
  }

  .post-panel-walk-card .post-walk-conversation-actions .button,
  .post-panel-walk-card .post-panel-walk-actions .button {
    min-height: 38px;
    padding: .5rem .62rem;
    font-size: .88rem;
    white-space: normal;
  }

  .post-panel-walk-card .post-panel-walk-actions {
    flex: 0 0 auto;
    gap: .42rem;
  }
}

/* 2026-06-30: Post Walk card-scroll repair.
   Mobile should keep the post/card as the main experience: the card body scrolls,
   the full post text is visible, the image gets real room, and actions are compact. */
.post-walk-inline-actions {
  display: flex;
  align-items: center;
  gap: .45rem;
  flex-wrap: wrap;
  margin: .02rem 0 -.08rem;
}
.post-walk-inline-actions .button.compact {
  min-height: 34px;
  padding: .42rem .72rem;
  border-radius: 999px;
  font-size: .88rem;
  line-height: 1;
  font-weight: 850;
}
.post-panel-walk-card-body {
  grid-template-rows: auto auto minmax(160px, 1fr) auto auto;
}
.post-panel-walk-card .post-panel-walk-actions {
  display: none;
}

@media (max-width: 620px) {
  .post-panel-walk-page {
    width: calc(100% - 16px);
    margin-top: .35rem;
    margin-bottom: calc(84px + env(safe-area-inset-bottom));
    --walk-card-height: calc(100dvh - 180px - env(safe-area-inset-bottom));
  }

  .post-panel-walk-card {
    grid-template-rows: 150px minmax(0, 1fr) !important;
    border-radius: 20px;
    overflow: hidden;
  }

  .post-panel-walk-card .space-walk-media {
    min-height: 150px;
  }

  .post-panel-walk-card .space-walk-media.has-image {
    background-size: cover;
    background-position: center;
  }

  .post-panel-walk-card .space-walk-media.is-text-fallback {
    min-height: 150px;
    gap: .35rem;
    padding: .85rem;
  }

  .post-panel-walk-card .space-walk-fallback-icon {
    width: 50px;
    height: 50px;
    border-radius: 16px;
    font-size: 1.15rem;
  }

  .post-panel-walk-card .space-walk-media strong {
    font-size: .72rem;
    letter-spacing: .08em;
  }

  .post-panel-walk-card-body {
    display: block !important;
    min-height: 0;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: .82rem .9rem calc(.9rem + env(safe-area-inset-bottom)) !important;
    scrollbar-gutter: stable;
  }

  .post-panel-walk-card-body > * + * {
    margin-top: .5rem;
  }

  .post-panel-walk-card .space-walk-meta-line {
    display: flex;
    flex-wrap: nowrap;
    gap: .32rem;
    overflow-x: auto;
    padding-bottom: .04rem;
    font-size: .78rem;
    line-height: 1.22;
    scrollbar-width: none;
  }
  .post-panel-walk-card .space-walk-meta-line::-webkit-scrollbar { display: none; }

  .post-walk-inline-actions {
    justify-content: flex-start;
    gap: .38rem;
    margin-top: .42rem;
    margin-bottom: .35rem;
  }
  .post-walk-inline-actions .button.compact {
    flex: 0 0 auto;
    min-height: 32px;
    padding: .38rem .64rem;
    font-size: .82rem;
  }

  .post-panel-walk-card .post-walk-step-kicker {
    display: none !important;
  }

  .post-panel-walk-card h2 {
    margin: .18rem 0 .3rem;
    font-size: clamp(1.35rem, 6vw, 1.76rem);
    line-height: 1.05;
  }

  .post-panel-walk-card .post-walk-content-body {
    max-height: none !important;
    min-height: 0;
    overflow: visible !important;
    padding: 0;
    scrollbar-gutter: auto;
  }

  .post-panel-walk-card .post-walk-content-body,
  .post-panel-walk-card .post-walk-content-body p,
  .post-panel-walk-card .post-walk-content-body li,
  .post-panel-walk-card .post-walk-content-body blockquote {
    display: block !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
    font-size: .96rem;
    line-height: 1.5;
  }

  .post-panel-walk-card .post-walk-card-foot {
    display: flex;
    flex-wrap: nowrap;
    gap: .34rem;
    overflow-x: auto;
    margin-top: .55rem;
    padding-bottom: .02rem;
    scrollbar-width: none;
  }
  .post-panel-walk-card .post-walk-card-foot::-webkit-scrollbar { display: none; }
  .post-panel-walk-card .post-walk-card-foot span {
    flex: 0 0 auto;
    padding: .26rem .48rem;
    font-size: .76rem;
  }

  .post-panel-walk-card .post-walk-conversation-card {
    margin-top: .55rem;
    padding: .62rem;
    gap: .42rem;
    border-radius: 15px;
  }

  .post-panel-walk-card .post-walk-conversation-card .eyebrow {
    margin-bottom: .06rem;
    font-size: .7rem;
  }
  .post-panel-walk-card .post-walk-conversation-card h3 {
    margin: 0 0 .12rem;
    font-size: .95rem;
    line-height: 1.15;
  }
  .post-panel-walk-card .post-walk-conversation-card p,
  .post-panel-walk-card .post-walk-conversation-card p * {
    display: inline !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
    font-size: .8rem;
    line-height: 1.28;
  }

  .post-panel-walk-card .post-walk-conversation-actions {
    display: flex;
    flex-wrap: nowrap;
    gap: .36rem;
    justify-content: flex-start;
    overflow-x: auto;
    padding-bottom: .02rem;
    scrollbar-width: none;
  }
  .post-panel-walk-card .post-walk-conversation-actions::-webkit-scrollbar { display: none; }
  .post-panel-walk-card .post-walk-conversation-actions .button {
    flex: 0 0 auto !important;
    min-height: 34px;
    padding: .4rem .58rem;
    font-size: .8rem;
    white-space: nowrap;
  }
}

/* 2026-06-30: Post Walk image/post switcher for mobile.
   Keeps the whole card scroll behavior, but lets media-heavy cards show the full image
   without competing with the post text and comments. */
.post-walk-view-toggle {
  display: none;
}

@media (max-width: 620px) {
  .post-panel-walk-card.has-post-walk-media {
    display: grid;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    overflow: hidden;
  }

  .post-panel-walk-card.has-post-walk-media .post-walk-view-toggle {
    grid-column: 1;
    grid-row: 1;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: .38rem;
    padding: .56rem .62rem .48rem;
    background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.86));
    border-bottom: 1px solid rgba(191,219,254,.62);
    overflow-x: auto;
    scrollbar-width: none;
  }
  .post-panel-walk-card.has-post-walk-media .post-walk-view-toggle::-webkit-scrollbar {
    display: none;
  }

  .post-walk-view-button {
    appearance: none;
    border: 1px solid rgba(148,163,184,.42);
    border-radius: 999px;
    background: rgba(248,250,252,.95);
    color: #0f172a;
    min-height: 36px;
    padding: .44rem .72rem;
    font: inherit;
    font-size: .84rem;
    line-height: 1;
    font-weight: 850;
    white-space: nowrap;
    cursor: pointer;
  }
  .post-walk-view-button.is-active {
    border-color: rgba(37,99,235,.38);
    background: #2563eb;
    color: #ffffff;
    box-shadow: 0 10px 24px rgba(37,99,235,.2);
  }

  .post-panel-walk-card.has-post-walk-media .post-walk-view-panel {
    grid-column: 1;
    grid-row: 2;
    min-height: 0;
  }

  .post-panel-walk-card.has-post-walk-media[data-active-view="post"] .post-walk-media-panel {
    display: none !important;
  }
  .post-panel-walk-card.has-post-walk-media[data-active-view="media"] .post-walk-post-panel {
    display: none !important;
  }

  .post-panel-walk-card.has-post-walk-media[data-active-view="media"] .post-walk-media-panel.has-image {
    display: flex !important;
    height: 100%;
    min-height: 0 !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-color: #f8fbff;
  }
  .post-panel-walk-card.has-post-walk-media[data-active-view="media"] .post-walk-media-panel.has-image::after {
    display: none;
  }

  .post-panel-walk-card.has-post-walk-media[data-active-view="post"] .post-walk-post-panel {
    display: block !important;
    height: 100%;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
}

/* 2026-06-30: Post Walk desktop/tablet text repair.
   On wider screens the post content should not become a tiny inner scroll box.
   Let the full right-side post panel scroll as one clean card, keeping the post text prominent. */
@media (min-width: 621px) {
  .post-panel-walk-card .post-walk-post-panel {
    display: flex !important;
    flex-direction: column;
    justify-content: flex-start;
    align-content: stretch;
    gap: .72rem;
    min-height: 0;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }

  .post-panel-walk-card .post-walk-content-body {
    flex: 0 0 auto;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding: .05rem .15rem 0 0;
    scrollbar-gutter: auto;
  }

  .post-panel-walk-card .post-walk-content-body:focus,
  .post-panel-walk-card .post-walk-content-body:focus-within {
    outline: none;
  }

  .post-panel-walk-card .post-walk-content-body,
  .post-panel-walk-card .post-walk-content-body p,
  .post-panel-walk-card .post-walk-content-body li,
  .post-panel-walk-card .post-walk-content-body blockquote {
    display: block !important;
    overflow: visible !important;
    -webkit-line-clamp: unset !important;
  }

  .post-panel-walk-card .post-walk-conversation-card {
    flex: 0 0 auto;
  }
}
