/* Legacy/base stylesheet. Current literary product theme selectors live in literary-social.css. */
:root {
  --font-display: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", "Times New Roman", serif;
  --font-body: "Avenir Next", "Segoe UI", "Helvetica Neue", sans-serif;
  --page-ink: #22151b;
  --page-soft-ink: #674c58;
  --page-wine: #71293e;
  --page-rose: #a64359;
  --page-coral: #d36a67;
  --page-gold: #deb179;
  --page-cream: #f7efe5;
  --page-parchment: #fff8f1;
  --page-blush: #f1ddd5;
  --surface: rgba(255, 248, 241, 0.84);
  --surface-strong: #fffaf4;
  --surface-border: rgba(116, 54, 68, 0.14);
  --surface-shadow: 0 24px 60px rgba(56, 22, 32, 0.08);
  --surface-shadow-strong: 0 28px 80px rgba(30, 11, 18, 0.18);
}

* {
  box-sizing: border-box;
}

html {
  background: #130c11;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--font-body);
  color: var(--page-ink);
  background:
    radial-gradient(circle at top left, rgba(166, 67, 89, 0.18), transparent 28%),
    radial-gradient(circle at top right, rgba(222, 177, 121, 0.14), transparent 26%),
    linear-gradient(180deg, #190e14 0 6.25rem, transparent 6.25rem),
    linear-gradient(180deg, var(--page-cream), #f9f2ea 58%, #f2e5db 100%);
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.05), transparent 28%),
    radial-gradient(circle at 18% 10%, rgba(255, 255, 255, 0.12), transparent 16%);
  z-index: -1;
}

a {
  color: var(--page-wine);
  text-decoration-color: rgba(113, 41, 62, 0.35);
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.14em;
  transition: color 140ms ease, text-decoration-color 140ms ease;
}

a:hover {
  color: #57182b;
  text-decoration-color: rgba(87, 24, 43, 0.55);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--page-gold);
  outline-offset: 3px;
}

h1,
h2,
h3,
h4 {
  margin: 0 0 0.6rem;
  color: #170d12;
  font-family: var(--font-display);
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.04;
}

p,
li,
blockquote {
  line-height: 1.6;
}

.wrap {
  max-width: 1180px;
  margin: 0 auto;
  padding: 1.25rem 1.5rem;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  color: white;
  background: linear-gradient(135deg, rgba(24, 13, 18, 0.97), rgba(60, 22, 34, 0.95));
  border-bottom: 1px solid rgba(255, 218, 202, 0.14);
  box-shadow: 0 14px 42px rgba(20, 9, 14, 0.18);
  backdrop-filter: blur(18px);
}

.nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
}

.nav-main {
  flex-wrap: wrap;
}

.nav a,
.brand,
.link-button {
  color: #fff5ee;
  text-decoration: none;
}

.site-nav {
  display: flex;
  gap: 1rem;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.nav-group {
  display: flex;
  gap: 0.85rem;
  align-items: center;
  flex-wrap: wrap;
}

.nav-group-secondary {
  opacity: 0.85;
  font-size: 0.96rem;
}

.nav-group-primary a {
  font-weight: 600;
}

.nav a.nav-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.15rem;
  padding: 0.44rem 0.72rem;
  border: 1px solid rgba(255, 245, 238, 0.5);
  border-radius: 3px;
  background: rgba(255, 245, 238, 0.12);
  font-weight: 800;
}

.site-nav a,
.link-button {
  transition: opacity 140ms ease, color 140ms ease;
}

.site-nav a:hover,
.link-button:hover {
  color: #ffd7bf;
  opacity: 1;
}

.brand {
  font-family: var(--font-display);
  font-size: 1.95rem;
  font-weight: 700;
  letter-spacing: 0;
}

.inline-form {
  display: inline;
}

.primary-action,
.secondary-action,
.tertiary-action,
.danger-action {
  text-align: center;
}

.primary-action {
  font-weight: 700;
}

.secondary-action,
.tertiary-action,
.danger-action,
.danger-link {
  font-weight: 600;
}

.danger-link {
  color: #8a2145;
}

.danger-action {
  background: #8a2145;
  box-shadow: 0 14px 30px rgba(64, 12, 34, 0.2);
}

.action-row .primary-action,
.hero-actions .primary-action,
.stage-card-actions .primary-action,
.story-card-actions .primary-action {
  order: 0;
}

.action-row .secondary-action,
.hero-actions .secondary-action,
.stage-card-actions .secondary-action,
.story-card-actions .secondary-action {
  order: 10;
}

.action-row .tertiary-action,
.hero-actions .tertiary-action,
.stage-card-actions .tertiary-action,
.story-card-actions .tertiary-action {
  order: 20;
}

.action-row .danger-action,
.action-row .danger-link {
  order: 30;
}

.term-note {
  color: var(--page-soft-ink);
  font-size: 0.92em;
  font-weight: 400;
}

.link-button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  font: inherit;
}

.hero {
  padding: 2rem 0 1rem;
}

.grid.two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
}

.context-grid {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr) 280px;
  gap: 1.25rem;
  align-items: start;
}

.card {
  margin-bottom: 1rem;
  padding: 1.15rem;
  border: 1px solid var(--surface-border);
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255, 250, 245, 0.94), rgba(255, 246, 239, 0.9));
  box-shadow: var(--surface-shadow);
}

.card.small {
  padding: 0.9rem;
}

.story-body {
  padding: 1.5rem;
  border: 1px solid var(--surface-border);
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255, 251, 247, 0.98), rgba(255, 247, 241, 0.95));
  box-shadow: var(--surface-shadow);
}

.beginning-card {
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid rgba(113, 41, 62, 0.18);
  border-radius: 18px;
  background: rgba(255, 249, 244, 0.72);
}

.beginning-card h2 {
  font-size: 1.35rem;
}

.form-panel,
.roadmap-step {
  padding: 0.9rem;
  border: 1px solid rgba(126, 69, 79, 0.12);
  border-radius: 16px;
  background: rgba(255, 249, 242, 0.82);
}

.form-panel {
  margin: 1rem 0;
}

.nearby-field {
  margin-top: 1rem;
}

.meta {
  color: var(--page-soft-ink);
  font-size: 0.95rem;
}

blockquote {
  margin: 0.9rem 0;
  padding: 0.95rem 1rem;
  border-left: 3px solid rgba(201, 122, 111, 0.65);
  border-radius: 0 16px 16px 0;
  background: rgba(247, 226, 216, 0.58);
  color: #442932;
}

.stack > * + * {
  margin-top: 0.9rem;
}

.stack-form > * + * {
  margin-top: 0.9rem;
}

.checkbox-row {
  display: inline-flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.checkbox-row input {
  width: auto;
  margin-top: 0.18rem;
}

.messages {
  padding: 0;
  list-style: none;
}

.message {
  padding: 0.85rem 0.95rem;
  border: 1px solid #cbbda0;
  border-radius: 14px;
  background: #f7f3df;
  color: #43311f;
}

.prose {
  line-height: 1.72;
}

.inline-search {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.inline-search input[type="search"],
input[type="text"],
input[type="url"],
input[type="email"],
input[type="password"],
textarea,
select {
  width: 100%;
  max-width: 100%;
  padding: 0.72rem 0.82rem;
  border: 1px solid rgba(126, 69, 79, 0.22);
  border-radius: 12px;
  background: rgba(255, 249, 244, 0.94);
  box-sizing: border-box;
  color: var(--page-ink);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

textarea {
  min-height: 7rem;
}

.story-card textarea {
  min-height: 16rem;
  border-color: rgba(113, 41, 62, 0.28);
  background: #fffdf9;
  font-size: 1.04rem;
  line-height: 1.7;
}

.nav-search {
  min-width: 260px;
  flex: 1;
  max-width: 360px;
}

.nav-search input[type="search"] {
  border-color: rgba(255, 220, 204, 0.28);
  background: rgba(255, 249, 244, 0.97);
  box-shadow: 0 14px 30px rgba(19, 8, 13, 0.18);
}

button,
input[type="submit"] {
  border: none;
  border-radius: 999px;
  padding: 0.75rem 1.05rem;
  color: white;
  cursor: pointer;
  background: linear-gradient(135deg, var(--page-coral), var(--page-wine));
  box-shadow: 0 14px 30px rgba(113, 41, 62, 0.24);
  transition: transform 140ms ease, box-shadow 140ms ease, filter 140ms ease;
}

button:hover,
input[type="submit"]:hover {
  transform: translateY(-1px);
  filter: saturate(1.05);
  box-shadow: 0 18px 32px rgba(113, 41, 62, 0.28);
}

main.wrap {
  position: relative;
  z-index: 1;
  padding-top: 2rem;
  padding-bottom: 3rem;
}

footer.wrap {
  padding-bottom: 2.5rem;
}

.section-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
}

.action-row {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}

.action-rail {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 0.85rem;
  padding: 0.7rem 0;
  border-top: 1px solid var(--surface-border);
  border-bottom: 1px solid var(--surface-border);
}

.action-rail-label {
  color: var(--page-ink);
  font-size: 0.82rem;
  font-weight: 700;
}

.action-rail a,
.action-rail button,
.action-row a,
.action-row button {
  min-height: 1.5rem;
}

.top-sparks-hero {
  margin-bottom: 1.5rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid rgba(126, 69, 79, 0.14);
  border-radius: 24px;
  background:
    linear-gradient(120deg, rgba(255, 252, 248, 0.96), rgba(244, 231, 223, 0.9)),
    linear-gradient(90deg, rgba(47, 111, 99, 0.08), transparent 55%);
  box-shadow: 0 22px 58px rgba(56, 22, 32, 0.08);
}

.top-sparks-hero h1 {
  font-size: clamp(2.3rem, 5vw, 4.2rem);
}

.top-sparks-hero p:not(.section-kicker) {
  max-width: 48rem;
  color: #422a32;
  font-size: 1.08rem;
}

.top-sparks-shelf {
  margin: 0 0 2rem;
}

.empty-state {
  margin: 0 0 1.25rem;
  padding: clamp(1rem, 2vw, 1.35rem);
  border: 1px dashed rgba(126, 69, 79, 0.22);
  border-radius: 18px;
  background: rgba(255, 253, 250, 0.62);
}

.empty-state h2,
.empty-state h3 {
  margin-bottom: 0.4rem;
  letter-spacing: 0;
}

.empty-state p {
  max-width: 44rem;
}

.compact-empty-state {
  min-height: 100%;
}

.top-spark-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
  gap: 1rem;
}

.top-spark-card {
  display: flex;
  min-height: 100%;
  flex-direction: column;
  gap: 0.6rem;
  padding: 1rem;
  border: 1px solid rgba(126, 69, 79, 0.14);
  border-radius: 18px;
  background: rgba(255, 250, 245, 0.88);
  box-shadow: var(--surface-shadow);
}

.top-spark-card h3 {
  margin-bottom: 0;
  font-size: 1.35rem;
  letter-spacing: 0;
}

.top-spark-card blockquote {
  margin: 0;
}

.taste-badge-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.taste-badge {
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
  padding: 0.24rem 0.58rem;
  border: 1px solid rgba(47, 111, 99, 0.18);
  border-radius: 999px;
  color: #25594f;
  background: rgba(224, 242, 232, 0.74);
  font-size: 0.78rem;
  font-weight: 700;
}

.top-spark-actions {
  margin-bottom: 0;
}

.spark-event-hero,
.spark-event-section {
  margin-bottom: 1.25rem;
  padding: clamp(1.1rem, 2.5vw, 1.8rem);
  border: 1px solid rgba(126, 69, 79, 0.14);
  border-radius: 24px;
  background: rgba(255, 250, 245, 0.9);
  box-shadow: var(--surface-shadow);
}

.spark-event-hero h1 {
  max-width: 14ch;
  font-size: clamp(2.15rem, 5vw, 4rem);
}

.spark-event-hero > .section-head p {
  max-width: 44rem;
  color: #422a32;
  font-size: 1.08rem;
}

.spark-badge-list {
  margin: 1rem 0;
}

.spark-event-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 0.9fr) minmax(0, 1fr);
  gap: 1rem;
}

.spark-story-panel {
  padding: 1rem;
  border: 1px solid rgba(126, 69, 79, 0.13);
  border-radius: 18px;
  background: rgba(255, 253, 250, 0.72);
}

.spark-story-panel h2 {
  font-size: 1.45rem;
  letter-spacing: 0;
}

.spark-claim-panel {
  background: rgba(247, 226, 216, 0.48);
}

.spark-signal-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
  gap: 0.75rem;
  padding: 0;
  list-style: none;
}

.spark-signal-list li {
  min-height: 100%;
  padding: 0.85rem;
  border: 1px solid rgba(47, 111, 99, 0.14);
  border-radius: 16px;
  background: rgba(238, 247, 241, 0.62);
}

.spark-note-details {
  margin-top: 0.75rem;
}

.spark-note-details summary {
  cursor: pointer;
  color: var(--page-wine);
  font-weight: 700;
}

.room-square-hero,
.room-square-band,
.salon-occasion-hero,
.salon-occasion-band,
.thread-bridge-hero,
.thread-bridge-panel {
  margin-bottom: 1.25rem;
  padding: clamp(1.1rem, 2.4vw, 1.8rem);
  border: 1px solid rgba(126, 69, 79, 0.14);
  border-radius: 24px;
  background: rgba(255, 250, 245, 0.9);
  box-shadow: var(--surface-shadow);
}

.room-square-hero h1,
.salon-occasion-hero h1,
.thread-bridge-hero h1 {
  font-size: clamp(2.25rem, 5vw, 4rem);
}

.room-square-hero p:not(.meta):not(.section-kicker),
.salon-occasion-hero p:not(.meta):not(.section-kicker),
.thread-bridge-hero p:not(.meta):not(.section-kicker) {
  max-width: 48rem;
  color: #422a32;
  font-size: 1.08rem;
}

.room-door-grid,
.room-thread-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 1rem;
}

.room-door-card,
.room-thread-card {
  min-height: 100%;
  padding: 1rem;
  border: 1px solid rgba(126, 69, 79, 0.14);
  border-radius: 18px;
  background: rgba(255, 253, 250, 0.72);
}

.room-door-card h3,
.room-thread-card h3 {
  font-size: 1.35rem;
  letter-spacing: 0;
}

.room-drawing-list {
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(126, 69, 79, 0.12);
}

.room-drawing-list ul {
  display: grid;
  gap: 0.55rem;
  margin: 0;
  padding-left: 1.1rem;
}

.room-drawing-list span {
  display: block;
}

.salon-response-panel {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  align-items: center;
  justify-content: space-between;
  margin-top: 1.1rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(126, 69, 79, 0.12);
}

.salon-response-panel h2 {
  margin-bottom: 0.2rem;
  font-size: 1.35rem;
  letter-spacing: 0;
}

.salon-metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr));
  gap: 0.75rem;
}

.salon-metric {
  min-height: 100%;
  padding: 0.85rem;
  border: 1px solid rgba(47, 111, 99, 0.14);
  border-radius: 16px;
  background: rgba(238, 247, 241, 0.62);
}

.salon-metric span {
  display: block;
  color: #25594f;
  font-size: 1.8rem;
  font-weight: 800;
  line-height: 1;
}

.salon-metric p {
  margin: 0.35rem 0 0;
  color: #49353d;
}

.salon-open-list {
  margin-top: 1rem;
}

.salon-open-list h3 {
  margin-bottom: 0.4rem;
  font-size: 1.2rem;
  letter-spacing: 0;
}

.salon-open-list ul {
  display: grid;
  gap: 0.45rem;
  margin: 0;
  padding-left: 1.1rem;
}

.editorial-dashboard {
  margin-bottom: 1.25rem;
  padding: clamp(1.1rem, 2.4vw, 1.8rem);
  border: 1px solid rgba(126, 69, 79, 0.14);
  border-radius: 24px;
  background: rgba(255, 250, 245, 0.9);
  box-shadow: var(--surface-shadow);
}

.funnel-health-grid,
.funnel-source-grid,
.funnel-stage-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
  gap: 0.75rem;
}

.funnel-health-card,
.funnel-source-card,
.funnel-stage-card,
.funnel-week-panel {
  padding: 0.9rem;
  border: 1px solid rgba(126, 69, 79, 0.13);
  border-radius: 16px;
  background: rgba(255, 253, 250, 0.72);
}

.funnel-health-card h3,
.funnel-source-card h3 {
  margin-bottom: 0.35rem;
  font-size: 1.35rem;
  letter-spacing: 0;
}

.funnel-week-panel {
  margin-top: 0.85rem;
}

.funnel-stage-card h4 {
  margin-bottom: 0.35rem;
}

.funnel-source-grid,
.editorial-dashboard > h3 {
  margin-top: 1rem;
}

.thread-body {
  max-width: 56rem;
}

.inline-details {
  display: inline-block;
}

.comment-list {
  margin-top: 1rem;
}

.comment,
.moderation-report {
  padding: 0.85rem 0;
  border-top: 1px solid rgba(120, 62, 70, 0.14);
}

.comment:first-child,
.moderation-report:first-child {
  border-top: none;
}

.trail-list {
  padding-left: 1.25rem;
}

.unread {
  border-color: rgba(172, 98, 83, 0.42);
  box-shadow: 0 20px 40px rgba(113, 41, 62, 0.1);
}

.pagination {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 0;
}

fieldset {
  border: 1px solid var(--surface-border);
  border-radius: 18px;
}

legend {
  padding: 0 0.4rem;
}

.button-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.88rem 1.2rem;
  border-radius: 999px;
  color: white;
  text-decoration: none;
  background: linear-gradient(135deg, #bf6071, var(--page-wine));
  box-shadow: 0 14px 28px rgba(93, 28, 47, 0.18);
}

.button-link:hover {
  color: white;
  text-decoration: none;
}

.button-link-secondary {
  color: var(--page-wine);
  background: rgba(255, 252, 249, 0.78);
  border: 1px solid rgba(126, 69, 79, 0.16);
  box-shadow: none;
}

.home-shell {
  display: flex;
  flex-direction: column;
  gap: 1.8rem;
}

.home-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr);
  gap: 2rem;
  padding: clamp(1.6rem, 3vw, 2.5rem);
  border: 1px solid rgba(126, 69, 79, 0.14);
  border-radius: 32px;
  overflow: hidden;
  background:
    radial-gradient(circle at 16% 14%, rgba(222, 177, 121, 0.2), transparent 19%),
    radial-gradient(circle at 86% 12%, rgba(214, 104, 103, 0.16), transparent 22%),
    linear-gradient(180deg, rgba(255, 249, 244, 0.98), rgba(247, 236, 229, 0.95));
  box-shadow: 0 26px 70px rgba(79, 35, 48, 0.09);
}

.home-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(126, 69, 79, 0.05) 0 1px, transparent 1px 100%),
    linear-gradient(rgba(126, 69, 79, 0.03) 0 1px, transparent 1px 100%);
  background-size: 10rem 10rem, 10rem 10rem;
  opacity: 0.28;
  mask-image: linear-gradient(180deg, black, transparent 78%);
}

.home-hero::after {
  content: "";
  position: absolute;
  inset: 1.35rem auto 1.35rem 59%;
  width: 1px;
  border-radius: 999px;
  background: linear-gradient(180deg, transparent, rgba(126, 69, 79, 0.16), transparent);
  filter: none;
}

.home-hero-copy,
.home-graph-panel {
  position: relative;
  z-index: 1;
}

.hero-kicker,
.section-kicker {
  margin: 0 0 0.6rem;
  color: #c77b74;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.home-hero h1 {
  max-width: 10.5ch;
  margin-bottom: 1rem;
  color: #22151b;
  font-size: clamp(2.7rem, 4.9vw, 4.3rem);
  line-height: 0.95;
}

.hero-lede {
  max-width: 33rem;
  margin: 0;
  color: #402a31;
  font-size: clamp(1.03rem, 1.9vw, 1.24rem);
  line-height: 1.68;
}

.hero-actions {
  display: flex;
  gap: 0.85rem;
  flex-wrap: wrap;
  margin: 1.5rem 0 1rem;
}

.hero-link-row {
  margin: 0;
  color: #7e545d;
}

.hero-link-row a {
  color: var(--page-wine);
  text-decoration-color: rgba(113, 41, 62, 0.22);
}

.hero-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  margin-top: 1.55rem;
}

.hero-stat {
  min-width: 10rem;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(126, 69, 79, 0.12);
  border-radius: 18px;
  background: rgba(255, 253, 250, 0.74);
}

.hero-stat strong {
  display: block;
  color: #22151b;
  font-family: var(--font-display);
  font-size: 1.6rem;
  letter-spacing: 0;
}

.hero-stat span {
  color: #7d5a63;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.home-graph-panel {
  padding: 1.25rem;
  border: 1px solid rgba(126, 69, 79, 0.12);
  border-radius: 28px;
  background:
    radial-gradient(circle at 82% 16%, rgba(214, 104, 103, 0.12), transparent 25%),
    linear-gradient(180deg, rgba(255, 252, 248, 0.76), rgba(244, 228, 220, 0.8));
}

.graph-panel-head h2 {
  margin-bottom: 0.45rem;
  color: #22151b;
  font-size: clamp(1.6rem, 2.8vw, 2.1rem);
}

.graph-panel-head .meta {
  color: #6f525c;
}

.graph-stage {
  position: relative;
  min-height: 19.5rem;
  margin-top: 1rem;
  padding: 1rem;
  border: 1px solid rgba(126, 69, 79, 0.1);
  border-radius: 26px;
  overflow: hidden;
  background:
    radial-gradient(circle at 22% 20%, rgba(222, 177, 121, 0.14), transparent 18%),
    radial-gradient(circle at 76% 20%, rgba(214, 104, 103, 0.13), transparent 18%),
    radial-gradient(circle at 50% 78%, rgba(214, 104, 103, 0.08), transparent 18%),
    linear-gradient(180deg, rgba(255, 251, 247, 0.7), rgba(249, 239, 233, 0.66));
}

.graph-stage svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0.82;
}

.graph-node {
  position: absolute;
  width: clamp(8.4rem, 26%, 10.5rem);
  padding: 0.78rem 0.85rem;
  border: 1px solid rgba(126, 69, 79, 0.12);
  border-radius: 20px;
  background: rgba(255, 252, 249, 0.88);
  box-shadow: 0 14px 28px rgba(96, 41, 57, 0.08);
}

.graph-root {
  top: 43%;
  left: 49%;
  width: min(58%, 14rem);
  transform: translate(-50%, -50%);
  background: linear-gradient(180deg, rgba(253, 236, 222, 0.95), rgba(248, 226, 214, 0.92));
}

.graph-branch-1 {
  top: 8%;
  left: 6%;
}

.graph-branch-2 {
  top: 9%;
  right: 6%;
}

.graph-branch-3 {
  bottom: 7%;
  left: 44%;
  transform: translateX(-50%);
}

.node-type {
  display: inline-block;
  margin-bottom: 0.45rem;
  padding: 0.22rem 0.48rem;
  border-radius: 999px;
  background: rgba(113, 41, 62, 0.08);
  color: #8b5060;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.graph-node a {
  display: block;
  color: #2c181f;
  text-decoration: none;
  font-family: var(--font-display);
  font-size: 1.08rem;
  line-height: 1.05;
}

.graph-node p {
  margin: 0.35rem 0 0;
  color: #755a63;
  font-size: 0.84rem;
}

.graph-stage-note {
  margin: 0.95rem 0 0;
  color: #6d4f59;
  font-size: 0.94rem;
}

.graph-link-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 1rem 0 0;
}

.graph-link-chip {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 14rem;
  padding: 0.72rem 0.84rem;
  border: 1px solid rgba(126, 69, 79, 0.1);
  border-radius: 18px;
  background: rgba(255, 252, 249, 0.7);
  color: #2e1b22;
  text-decoration: none;
}

.graph-link-chip strong {
  font-size: 0.98rem;
  font-weight: 600;
}

.graph-link-chip span {
  color: #7d5f68;
  font-size: 0.82rem;
}

.home-manifesto-grid,
.home-stream {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
  gap: 1.25rem;
}

.home-panel {
  position: relative;
  overflow: hidden;
  padding: 1.4rem 1.45rem;
  border: 1px solid var(--surface-border);
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(255, 251, 247, 0.98), rgba(255, 246, 240, 0.94));
  box-shadow: var(--surface-shadow);
}

.home-panel::before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 0.25rem;
  background: linear-gradient(90deg, rgba(211, 106, 103, 0.55), rgba(222, 177, 121, 0.1));
}

.home-panel h2 {
  font-size: clamp(1.75rem, 2.7vw, 2.2rem);
  line-height: 1.02;
}

.home-panel-warm {
  background:
    radial-gradient(circle at top right, rgba(222, 177, 121, 0.18), transparent 28%),
    linear-gradient(180deg, rgba(255, 246, 236, 0.96), rgba(246, 229, 221, 0.95));
}

.home-panel-muted {
  background:
    radial-gradient(circle at top right, rgba(166, 67, 89, 0.1), transparent 24%),
    linear-gradient(180deg, rgba(255, 249, 242, 0.96), rgba(247, 237, 231, 0.93));
}

.home-panel-dark {
  background:
    radial-gradient(circle at top right, rgba(211, 106, 103, 0.14), transparent 24%),
    linear-gradient(180deg, rgba(255, 248, 243, 0.98), rgba(247, 236, 229, 0.95));
  border-color: rgba(126, 69, 79, 0.12);
  box-shadow: var(--surface-shadow);
}

.home-panel-dark h2,
.home-panel-dark h3,
.home-panel-dark a {
  color: #23151b;
}

.home-panel-dark .meta,
.home-panel-dark p,
.home-panel-dark blockquote {
  color: #6c505a;
}

.manifesto-copy {
  margin-bottom: 1rem;
  color: #50343c;
  font-size: 1.02rem;
}

.loop-steps,
.principle-list {
  margin: 1rem 0 0;
  padding: 0;
  list-style: none;
}

.loop-steps {
  counter-reset: loop-steps;
  display: grid;
  gap: 0.8rem;
}

.loop-steps li {
  counter-increment: loop-steps;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.85rem;
  align-items: start;
  padding: 0.92rem 1rem;
  border: 1px solid rgba(126, 69, 79, 0.12);
  border-radius: 18px;
  background: rgba(255, 247, 240, 0.72);
}

.loop-steps li::before {
  content: counter(loop-steps);
  display: grid;
  place-items: center;
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--page-coral), var(--page-wine));
  box-shadow: 0 12px 24px rgba(113, 41, 62, 0.2);
  color: white;
  font-family: var(--font-display);
  font-size: 1.1rem;
}

.principle-list {
  display: grid;
  gap: 0.7rem;
}

.principle-list li {
  display: flex;
  gap: 0.75rem;
  align-items: start;
  color: #50343c;
}

.principle-list li::before {
  content: "•";
  color: var(--page-coral);
  font-size: 1.2rem;
  line-height: 1;
}

.mini-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.draft-card,
.conversation-card {
  padding: 1rem 1.05rem;
  border: 1px solid rgba(126, 69, 79, 0.12);
  border-radius: 20px;
  background: rgba(255, 249, 242, 0.78);
}

.home-stream {
  align-items: start;
}

.home-column-primary,
.home-column-secondary {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.story-stack,
.response-stack,
.conversation-grid {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.story-card {
  position: relative;
  padding: 1.2rem 1.25rem 1.25rem 1.4rem;
  border: 1px solid rgba(126, 69, 79, 0.14);
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(255, 250, 245, 0.98), rgba(255, 244, 236, 0.94));
  box-shadow: var(--surface-shadow);
}

.story-card::before {
  content: "";
  position: absolute;
  inset: 1rem auto 1rem 0.9rem;
  width: 2px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--page-gold), rgba(166, 67, 89, 0.2));
}

.story-card-topline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  align-items: center;
  margin-bottom: 0.6rem;
}

.story-chip {
  display: inline-flex;
  align-items: center;
  padding: 0.28rem 0.56rem;
  border-radius: 999px;
  background: rgba(222, 177, 121, 0.18);
  color: #79482c;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.story-card h3,
.response-card h3,
.conversation-card h3,
.draft-card h3 {
  margin-bottom: 0.45rem;
  font-size: clamp(1.55rem, 2.5vw, 2.05rem);
}

.story-excerpt {
  margin: 0.7rem 0 0;
  font-size: 1.02rem;
  color: #382128;
}

.story-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  margin-top: 1rem;
}

.response-card {
  padding: 1rem 1.05rem;
  border: 1px solid rgba(126, 69, 79, 0.1);
  border-radius: 22px;
  background: rgba(255, 251, 247, 0.78);
}

.response-card blockquote {
  margin-bottom: 0;
  background: rgba(247, 226, 216, 0.48);
  border-left-color: rgba(201, 122, 111, 0.45);
}

.response-pair {
  margin: 0 0 0.5rem;
  color: #8b6470;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.response-pair a {
  color: var(--page-wine);
}

.conversation-grid {
  gap: 0.85rem;
}

.conversation-card {
  background: rgba(255, 249, 242, 0.84);
}

.stats-grid.compact {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
  gap: 0.75rem;
  margin: 1rem 0;
}

.stat {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.78rem;
  border: 1px solid rgba(126, 69, 79, 0.12);
  border-radius: 16px;
  background: rgba(255, 249, 242, 0.88);
}

.stat strong {
  font-size: 1.15rem;
}

.path-list {
  padding-left: 1.25rem;
}

.form-errors {
  margin: 0.5rem 0;
  padding: 0.8rem;
  border: 1px solid #d8a2a9;
  border-radius: 12px;
  background: #fff0f2;
  color: #7a1f31;
}

.note-warnings {
  margin: 0.5rem 0;
  padding: 0.8rem;
  border: 1px solid #e6d2a6;
  border-radius: 12px;
  background: #fff9ed;
  color: #6f5420;
}

.status-badge {
  display: inline-block;
  margin: 0.25rem 0;
  padding: 0.25rem 0.55rem;
  border-radius: 999px;
  font-size: 0.85rem;
  font-weight: 600;
}

.status-missing,
.status-blocked {
  background: #ffe4e4;
  color: #8a1e1e;
}

.status-weak {
  background: #fff2d8;
  color: #7a5214;
}

.status-adequate,
.status-strong {
  background: #e9f6ea;
  color: #245b2c;
}

.stack-list {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

@media (max-width: 1080px) {
  .home-hero,
  .home-manifesto-grid,
  .home-stream,
  .mini-grid {
    grid-template-columns: 1fr;
  }

  .hero-stats {
    max-width: none;
  }
}

@media (max-width: 900px) {
  .grid.two-col,
  .context-grid,
  .spark-event-grid {
    grid-template-columns: 1fr;
  }

  .nav-main {
    align-items: flex-start;
  }

  .site-nav {
    width: 100%;
    justify-content: flex-start;
  }

  .nav-search {
    width: 100%;
    max-width: none;
  }

  .section-head {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 680px) {
  .wrap {
    padding: 1rem;
  }

  .home-hero {
    border-radius: 28px;
  }

  .hero-stats {
    display: grid;
    grid-template-columns: 1fr;
  }

  .graph-stage {
    display: grid;
    gap: 0.85rem;
    min-height: 0;
    padding: 1rem;
  }

  .graph-stage svg {
    display: none;
  }

  .graph-node {
    position: static;
    width: auto;
    transform: none;
  }

  .graph-root {
    width: auto;
  }

  .edge-ledger li {
    grid-template-columns: 1fr;
  }

  .action-rail {
    align-items: stretch;
    flex-direction: column;
  }

  .action-row,
  .hero-actions,
  .stage-card-actions,
  .story-card-actions {
    align-items: stretch;
    flex-direction: column;
    gap: 0.65rem;
    width: 100%;
  }

  .action-row .inline-form,
  .inline-form.primary-action,
  .inline-form.secondary-action,
  .inline-form.tertiary-action,
  .stage-card-actions .inline-form,
  .story-card-actions .inline-form {
    display: block;
    width: 100%;
  }

  .action-rail a,
  .action-rail button,
  .action-row a,
  .action-row button,
  .hero-actions a,
  a.primary-action,
  a.secondary-action,
  a.tertiary-action,
  button.primary-action,
  button.secondary-action,
  button.tertiary-action,
  button.danger-action,
  .stage-card-actions a,
  .stage-card-actions button,
  .story-card-actions a,
  .story-card-actions button,
  .inline-form.primary-action button,
  .inline-form.secondary-action button,
  .inline-form.tertiary-action button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 2.75rem;
    padding: 0.72rem 0.95rem;
    line-height: 1.2;
    text-align: center;
  }

  .action-row .meta,
  .action-rail-label {
    width: 100%;
    text-align: left;
  }
}

/* Home baseline: centered graph field first, everything else subordinate */
.home-shell {
  gap: clamp(2.35rem, 3.2vw, 3.25rem);
}

.home-hero {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(1.45rem, 2.6vw, 2rem);
  padding: 0;
  border: none;
  border-radius: 0;
  background: none;
  box-shadow: none;
  overflow: visible;
}

.home-hero::before,
.home-hero::after {
  content: none;
}

.home-hero-copy {
  max-width: 68rem;
  padding-top: 0.9rem;
  text-align: center;
}

.home-hero-copy,
.conversation-stage-shell,
.conversation-stage,
.home-explore,
.home-alive,
.home-stream {
  max-width: 100%;
  min-width: 0;
}

.hero-kicker {
  max-width: 82rem;
  margin: 0 auto;
  color: #685b56;
  font-size: clamp(1rem, 1.1vw, 1.12rem);
  font-weight: 400;
  line-height: 1.42;
  letter-spacing: 0;
  text-transform: none;
}

.section-kicker {
  color: #6b203a;
  letter-spacing: 0;
}

.home-hero h1 {
  max-width: none;
  margin: 0 auto 0.9rem;
  color: #24161c;
  font-size: clamp(3.2rem, 5.2vw, 5.75rem);
  line-height: 0.93;
  letter-spacing: 0;
  white-space: nowrap;
}

.hero-lede {
  max-width: 26rem;
  margin: 0 auto;
  color: #48343c;
  font-size: clamp(1rem, 1.6vw, 1.1rem);
  line-height: 1.58;
}

.hero-actions {
  display: flex;
  justify-content: center;
  gap: 0.9rem;
  flex-wrap: wrap;
  margin: 0.95rem 0 0.72rem;
}

.button-link {
  padding: 0.82rem 1.2rem;
  border-radius: 3px;
  background: #2b0f1b;
  box-shadow: 0 10px 22px rgba(43, 15, 27, 0.12);
}

.button-link-secondary {
  color: #6b203a;
  background: rgba(255, 253, 249, 0.94);
  border: 1px solid rgba(43, 48, 42, 0.14);
  box-shadow: none;
}

.hero-link-row {
  margin: 0;
  color: #685b56;
}

.conversation-stage-shell {
  width: min(100%, var(--ls-page-measure, 92rem));
  margin-top: 0.25rem;
}

@media (min-width: 1800px) {
  .home-page .home-shell {
    gap: clamp(3rem, 3.1vw, 5.25rem);
  }

  .home-page .home-hero {
    gap: clamp(2rem, 2.8vw, 3.6rem);
  }

  .home-page .home-hero-copy {
    max-width: 100%;
    padding-top: clamp(1.1rem, 1.4vw, 2rem);
  }

  .home-page .home-hero h1 {
    margin-bottom: clamp(0.9rem, 1vw, 1.45rem);
    font-size: calc(5.75rem * var(--ls-optical-scale, 1));
  }

  .home-page .hero-kicker {
    max-width: 82rem;
    font-size: calc(1.18rem * var(--ls-optical-scale, 1));
  }

  .home-page .conversation-stage {
    gap: clamp(1.5rem, 1.5vw, 2.25rem);
    padding: clamp(1.8rem, 2vw, 3rem) clamp(2rem, 4vw, 5.5rem) clamp(2.35rem, 2.8vw, 4rem);
  }

  .home-page .stage-row-focus {
    min-height: clamp(9.5rem, 5.8vw, 12rem);
  }

  .home-page .stage-row-branches {
    min-height: clamp(11.5rem, 6.2vw, 14rem);
  }

  .home-page .stage-row-chains {
    min-height: clamp(10.5rem, 5.8vw, 13rem);
  }

  .home-page .stage-card {
    max-width: 20rem;
    padding: clamp(1.05rem, 1vw, 1.35rem) clamp(1.1rem, 1.1vw, 1.45rem);
  }

  .home-page .stage-card-focus {
    width: min(100%, 23rem);
    max-width: 23rem;
  }

  .home-page .stage-card h3 {
    font-size: calc(1.6rem * var(--ls-optical-scale, 1));
  }

  .home-page .stage-card p {
    font-size: calc(0.96rem * var(--ls-optical-scale, 1));
  }

  .home-page .stage-chip {
    font-size: 0.78rem;
  }

  .home-page .conversation-stage-lines path {
    stroke-width: 2.6;
  }
}

@media (min-width: 2400px) {
  .home-page .home-explore-grid {
    gap: 0.85rem;
  }

  .home-page .home-explore-card {
    min-height: 6.6rem;
    padding: 1.18rem 1.25rem;
  }

  .home-page .home-explore-card span {
    font-size: calc(1.6rem * var(--ls-optical-scale, 1));
  }

  .home-page .home-explore-card small,
  .home-page .home-alive p:not(.section-kicker),
  .home-page .home-alive-grid small {
    font-size: calc(1rem * var(--ls-optical-scale, 1));
  }

  .home-page .home-alive h2 {
    font-size: calc(3.4rem * var(--ls-optical-scale, 1));
  }

  .home-page .home-proof {
    grid-template-columns: minmax(28rem, 0.44fr) minmax(0, 0.9fr);
    gap: clamp(5rem, 6vw, 9rem);
  }

  .home-page .home-proof-copy h2 {
    font-size: calc(3.6rem * var(--ls-optical-scale, 1));
  }

  .home-page .home-proof-item h3 {
    font-size: calc(2rem * var(--ls-optical-scale, 1));
  }

  .home-page .home-proof-copy p:not(.section-kicker),
  .home-page .home-proof-item p:not(.home-proof-pair) {
    font-size: calc(1rem * var(--ls-optical-scale, 1));
  }
}

.conversation-stage-head {
  display: block;
  margin-bottom: 0.85rem;
  text-align: center;
}

.conversation-stage-head .meta {
  text-align: center;
}

.conversation-stage {
  position: relative;
  display: grid;
  gap: clamp(1.1rem, 1.7vw, 1.6rem);
  padding: clamp(1.35rem, 2vw, 2rem) clamp(1.25rem, 3vw, 3.35rem) clamp(1.8rem, 3vw, 2.65rem);
  border: 1px solid rgba(43, 48, 42, 0.12);
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(255, 253, 249, 0.64), rgba(246, 244, 238, 0.56));
  overflow: visible;
}

.conversation-stage.chain-count-0 {
  padding-bottom: 1.8rem;
}

.conversation-stage-lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  z-index: 0;
  pointer-events: none;
}

.conversation-stage-lines path {
  fill: none;
  stroke: rgba(107, 32, 58, 0.28);
  stroke-width: 2.25;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.stage-row {
  position: relative;
  z-index: 1;
}

.stage-row-focus {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  min-height: clamp(8rem, 7.6vw, 9.5rem);
}

.stage-row-branches,
.stage-row-chains {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-items: start;
}

.stage-row-branches {
  gap: 0;
  min-height: clamp(9.5rem, 9.4vw, 11rem);
}

.stage-row-branches-1 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.stage-row-branches-2 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.stage-row-branches-3 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.stage-row-chains {
  gap: 0;
  min-height: clamp(9rem, 8.6vw, 10.5rem);
}

.stage-row-chains-1 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.stage-row-chains-2 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.stage-card {
  position: relative;
  width: 100%;
  max-width: 16.25rem;
  min-width: 0;
  padding: 1rem 1.08rem 1.08rem;
  border: 1px solid rgba(43, 48, 42, 0.13);
  border-radius: 8px;
  background: rgba(255, 253, 249, 0.97);
  box-shadow: 0 14px 30px rgba(37, 30, 25, 0.06);
  overflow-wrap: break-word;
}

.stage-card-focus,
.stage-card-branch,
.stage-card-chain,
.stage-card-branch-empty {
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  transform: none;
  margin: 0 auto;
}

.stage-card-focus {
  grid-column: 3 / span 2;
  width: min(100%, 18rem);
  max-width: 18rem;
  text-align: center;
}

.stage-row-branches-1 .stage-card-branch-1,
.stage-row-branches-1 .stage-card-branch-empty {
  grid-column: 3 / span 2;
}

.stage-row-branches-2 .stage-card-branch-1 {
  grid-column: 2 / span 2;
}

.stage-row-branches-2 .stage-card-branch-2 {
  grid-column: 4 / span 2;
}

.stage-row-branches-3 .stage-card-branch-1 {
  grid-column: 1 / span 2;
}

.stage-row-branches-3 .stage-card-branch-2 {
  grid-column: 3 / span 2;
}

.stage-row-branches-3 .stage-card-branch-3 {
  grid-column: 5 / span 2;
}

.stage-row-chains-1 .stage-card-chain-1 {
  grid-column: 3 / span 2;
}

.stage-row-chains-2 .stage-card-chain-1 {
  grid-column: 2 / span 2;
}

.stage-row-chains-2 .stage-card-chain-2 {
  grid-column: 4 / span 2;
}

.stage-chip {
  display: inline-block;
  margin-bottom: 0.4rem;
  padding: 0.18rem 0.44rem;
  border-radius: 4px;
  background: rgba(92, 117, 104, 0.1);
  color: #536c75;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.stage-card h3 {
  margin-bottom: 0.36rem;
  font-size: clamp(1.18rem, 1.4vw, 1.48rem);
  line-height: 0.98;
}

.stage-card h3 a {
  color: #24161c;
  text-decoration: none;
}

.stage-card p {
  margin: 0;
  color: #554b47;
  font-size: 0.84rem;
  line-height: 1.42;
}

.stage-card-author {
  margin-bottom: 0.52rem;
  color: #71645e;
  font-size: 0.79rem;
  line-height: 1.35;
}

.stage-card-author a {
  color: inherit;
  text-decoration: none;
}

.stage-branch-note {
  color: #554b47;
}

.stage-branch-status {
  margin-top: 0.55rem;
  color: #71645e;
  font-size: 0.78rem;
  line-height: 1.38;
}

.stage-branch-status a {
  color: #6b203a;
  text-decoration: none;
}

.stage-chain-source {
  margin-top: 0.42rem;
  color: #6b203a;
  font-size: 0.76rem;
  letter-spacing: 0;
}

.stage-card-actions {
  display: flex;
  justify-content: center;
  gap: 0.8rem;
  flex-wrap: wrap;
  margin-top: 0.72rem;
}

.home-explore {
  display: grid;
  gap: 0.8rem;
  padding-top: clamp(0.35rem, 1vw, 0.75rem);
  border-top: 1px solid rgba(43, 48, 42, 0.12);
}

.home-explore h2 {
  margin: 0;
  font-family: "Avenir Next", "Gill Sans", "Trebuchet MS", sans-serif;
  font-size: clamp(1rem, 1.7vw, 1.35rem);
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.home-explore-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
}

.home-explore-card {
  display: grid;
  align-content: start;
  gap: 0.18rem;
  min-height: 5.55rem;
  padding: 0.98rem 1rem;
  border: 1px solid rgba(43, 48, 42, 0.13);
  border-radius: 6px;
  background: rgba(255, 253, 249, 0.72);
  color: #24161c;
  text-decoration: none;
  overflow-wrap: break-word;
  transition: border-color 140ms ease, background-color 140ms ease, transform 140ms ease;
}

.home-explore-card span {
  color: #6b203a;
  font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, serif;
  font-size: clamp(1.15rem, 1.7vw, 1.45rem);
  font-weight: 700;
  line-height: 1.04;
}

.home-explore-card small {
  color: #3f3431;
  font-size: 0.92rem;
  line-height: 1.28;
}

.home-explore-card:hover,
.home-explore-card:focus-visible {
  border-color: rgba(107, 32, 58, 0.32);
  background: rgba(255, 253, 249, 0.96);
  transform: translateY(-1px);
}

.home-alive {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(22rem, 0.58fr);
  gap: clamp(1.25rem, 4vw, 3.5rem);
  align-items: end;
  padding: clamp(1rem, 2.2vw, 1.45rem) 0;
  border-top: 1px solid rgba(43, 48, 42, 0.12);
  border-bottom: 1px solid rgba(43, 48, 42, 0.1);
}

.home-alive-copy {
  display: grid;
  gap: 0.45rem;
}

.home-alive h2 {
  max-width: 20ch;
  margin: 0;
  font-size: clamp(1.9rem, 3vw, 3rem);
  letter-spacing: 0;
}

.home-alive p:not(.section-kicker) {
  max-width: 46rem;
  color: #554b47;
}

.home-alive .action-row {
  margin-top: 0.45rem;
}

.home-alive-grid {
  display: grid;
  gap: 0.55rem;
}

.home-alive-grid a {
  display: grid;
  gap: 0.1rem;
  padding: 0.72rem 0.82rem;
  border-top: 1px solid rgba(126, 69, 79, 0.13);
  color: #24161c;
  text-decoration: none;
  overflow-wrap: break-word;
}

.home-alive-grid a:first-child {
  border-top: 0;
}

.home-alive-grid span {
  color: #6b203a;
  font-family: "Avenir Next", "Gill Sans", "Trebuchet MS", sans-serif;
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.home-alive-grid small {
  color: #554b47;
  font-size: 0.92rem;
  line-height: 1.35;
}

.home-proof {
  display: grid;
  grid-template-columns: minmax(18rem, 0.48fr) minmax(0, 0.82fr);
  gap: clamp(2rem, 6vw, 6.5rem);
  align-items: start;
  padding: clamp(1.15rem, 2.4vw, 2rem) 0 0;
  border-top: 1px solid rgba(43, 48, 42, 0.12);
}

.home-proof-copy {
  display: grid;
  gap: 0.45rem;
}

.home-proof-copy h2 {
  max-width: 16ch;
  margin: 0;
  font-size: clamp(2rem, 2.8vw, 3.35rem);
  line-height: 0.98;
}

.home-proof-copy p:not(.section-kicker) {
  max-width: 42rem;
  color: #554b47;
  font-size: 0.98rem;
  line-height: 1.45;
}

.home-proof-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 0.35rem;
  font-family: "Avenir Next", "Gill Sans", "Trebuchet MS", sans-serif;
  font-size: 0.82rem;
  font-weight: 800;
}

.home-proof-list {
  display: grid;
  gap: 0;
}

.home-proof-item {
  display: grid;
  gap: 0.35rem;
  padding: 0.95rem 0 1.05rem;
  border-top: 1px solid rgba(126, 69, 79, 0.12);
}

.home-proof-item:first-child {
  padding-top: 0;
  border-top: 0;
}

.home-proof-pair {
  color: #6b203a;
  font-family: "Avenir Next", "Gill Sans", "Trebuchet MS", sans-serif;
  font-size: 0.74rem;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.home-proof-pair a {
  color: inherit;
}

.home-proof-item h3 {
  margin: 0;
  font-size: clamp(1.45rem, 1.8vw, 2.15rem);
  line-height: 1.02;
}

.home-proof-item h3 a {
  color: #6b203a;
}

.home-proof-item p:not(.home-proof-pair) {
  max-width: 54rem;
  color: #554b47;
  font-size: 0.96rem;
  line-height: 1.42;
}

.home-panel {
  padding: 1rem 0 0;
  border: none;
  border-top: 1px solid rgba(126, 69, 79, 0.1);
  border-radius: 0;
  background: none;
  box-shadow: none;
}

.home-panel::before {
  content: none;
}

.mini-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  align-items: stretch;
}

.draft-card {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  min-height: 12rem;
  padding: 1rem 1.05rem;
  border: 1px solid rgba(126, 69, 79, 0.14);
  border-radius: 8px;
  background: rgba(255, 250, 245, 0.72);
}

.mini-grid > :first-child {
  padding-top: 1rem;
}

.draft-card h3 {
  display: flex;
  align-items: flex-end;
  min-height: 2.35em;
  margin: 0;
}

.draft-card p {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.42;
}

.draft-card p strong {
  font-size: 1.08rem;
}

.draft-card .meta {
  font-size: 1.03rem;
}

.home-stream {
  grid-template-columns: minmax(0, 1.08fr) minmax(24rem, 0.92fr);
  gap: clamp(3rem, 5.8vw, 6.25rem);
  align-items: start;
}

.home-column-primary,
.home-column-secondary {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.story-stack-editorial,
.response-stack-editorial {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.story-card-editorial,
.response-card-editorial {
  padding: 1.25rem 0;
  border: none;
  border-top: 1px solid rgba(126, 69, 79, 0.1);
  border-radius: 0;
  background: none;
  box-shadow: none;
}

.story-stack-editorial > :first-child,
.response-stack-editorial > :first-child {
  padding-top: 1rem;
}

.story-card-editorial::before {
  content: none;
}

.story-card-topline {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  align-items: center;
  margin-bottom: 0.4rem;
}

.story-chip {
  padding: 0.18rem 0.45rem;
  border: 1px solid rgba(43, 48, 42, 0.16);
  border-radius: 4px;
  background: none;
  color: #6d5c51;
}

.story-card-editorial h3,
.response-card-editorial h3 {
  margin-bottom: 0.3rem;
  color: #24161c;
  font-size: clamp(1.95rem, 2.6vw, 2.45rem);
  line-height: 0.98;
}

.story-excerpt {
  max-width: 34rem;
  color: #554b47;
}

.story-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  align-items: center;
  margin-top: 0.85rem;
}

.home-aside-section {
  padding-top: 0.2rem;
}

.home-aside-section::before {
  content: none;
}

.response-pair {
  color: #70635d;
}

.response-pair a {
  color: #6b203a;
}

.response-card-editorial blockquote {
  margin-top: 0.7rem;
  padding: 0.75rem 0 0.75rem 0.95rem;
  border-left: 2px solid rgba(92, 117, 104, 0.36);
  border-radius: 0;
  background: none;
  color: #554b47;
}

@media (max-width: 1080px) {
  .home-hero h1 {
    max-width: 12ch;
    white-space: normal;
  }

  .home-stream,
  .home-alive,
  .home-proof,
  .mini-grid {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .home-explore-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .conversation-stage {
    gap: 1rem;
    padding: 1rem;
  }

  .conversation-stage-lines {
    display: none;
  }

  .stage-row-focus,
  .stage-row-branches,
  .stage-row-chains,
  .stage-row-branches-1,
  .stage-row-branches-2,
  .stage-row-branches-3,
  .stage-row-chains-1,
  .stage-row-chains-2 {
    display: grid;
    grid-template-columns: 1fr;
    justify-content: stretch;
    min-height: 0;
    gap: 1rem;
    padding-inline: 0;
  }

  .stage-card,
  .stage-card-focus {
    width: 100%;
    max-width: none;
  }

  .stage-row-focus .stage-card-focus,
  .stage-row-branches .stage-card-branch,
  .stage-row-branches .stage-card-branch-empty,
  .stage-row-chains .stage-card-chain {
    grid-column: 1 / -1;
  }
}

@media (max-width: 720px) {
  .home-hero h1 {
    font-size: clamp(2.7rem, 11vw, 4rem);
    max-width: 12ch;
  }

  .hero-actions,
  .stage-card-actions {
    justify-content: flex-start;
  }

  .home-hero-copy,
  .conversation-stage-head {
    text-align: center;
  }

  .hero-lede,
  .hero-note,
  .hero-kicker,
  .home-hero h1 {
    margin-left: auto;
    margin-right: auto;
  }

  .home-explore-grid {
    grid-template-columns: 1fr;
  }

  .home-alive {
    align-items: start;
  }
}

@media (max-width: 680px) {
  .site-nav,
  .nav-group,
  .nav-group-secondary {
    width: 100%;
  }

  .nav-group {
    row-gap: 0.45rem;
  }

  .action-row,
  .hero-actions,
  .stage-card-actions,
  .story-card-actions {
    align-items: stretch;
    flex-direction: column;
    justify-content: flex-start;
    gap: 0.65rem;
    width: 100%;
  }

  .action-row .inline-form,
  .inline-form.primary-action,
  .inline-form.secondary-action,
  .inline-form.tertiary-action,
  .stage-card-actions .inline-form,
  .story-card-actions .inline-form {
    display: block;
    width: 100%;
  }

  .action-rail a,
  .action-rail button,
  .action-row a,
  .action-row button,
  .hero-actions a,
  a.primary-action,
  a.secondary-action,
  a.tertiary-action,
  button.primary-action,
  button.secondary-action,
  button.tertiary-action,
  .stage-card-actions a,
  .stage-card-actions button,
  .story-card-actions a,
  .story-card-actions button,
  .inline-form.primary-action button,
  .inline-form.secondary-action button,
  .inline-form.tertiary-action button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 2.75rem;
    padding: 0.72rem 0.95rem;
    line-height: 1.2;
    text-align: center;
  }
}

/* Public house maturation: rooms, salons, and the home entry point */
.home-public-house {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(10rem, auto);
  gap: clamp(1.25rem, 4vw, 3rem);
  align-items: end;
  padding: clamp(1rem, 2.2vw, 1.45rem) 0;
  border-top: 1px solid rgba(43, 48, 42, 0.14);
  border-bottom: 1px solid rgba(43, 48, 42, 0.1);
}

.home-public-house h2 {
  max-width: 18ch;
  margin-bottom: 0.35rem;
  font-size: clamp(1.9rem, 3vw, 3rem);
  letter-spacing: 0;
}

.home-public-house p:not(.section-kicker) {
  max-width: 46rem;
  margin: 0;
  color: #554b47;
}

.room-square-hero,
.room-square-band,
.salon-occasion-hero,
.salon-occasion-band {
  border-radius: 0;
  box-shadow: none;
}

.room-square-hero {
  padding: clamp(1.25rem, 4vw, 3rem) 0 clamp(0.8rem, 2vw, 1.4rem);
  border: none;
  background: none;
}

.room-square-intro {
  align-items: end;
  gap: 1.5rem;
}

.room-square-hero h1 {
  max-width: 12ch;
  font-size: clamp(3rem, 6.6vw, 6.4rem);
  line-height: 0.88;
  letter-spacing: 0;
}

.room-square-hero p:not(.meta):not(.section-kicker) {
  max-width: 42rem;
  color: #5c424c;
  font-size: clamp(1.02rem, 1.5vw, 1.2rem);
}

.room-square-band,
.salon-occasion-band {
  padding: clamp(1.15rem, 2.5vw, 1.7rem) 0;
  border: none;
  border-top: 1px solid rgba(113, 41, 62, 0.12);
  background: none;
}

.house-stage {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, 0.32fr);
  gap: clamp(1rem, 3vw, 2rem);
  align-items: stretch;
  padding: 0;
  border: 1px solid rgba(113, 41, 62, 0.14);
  background: linear-gradient(135deg, rgba(255, 251, 247, 0.92), rgba(245, 231, 220, 0.72));
}

.dominant-moment {
  padding: clamp(1.25rem, 3vw, 2rem);
}

.moment-head {
  display: grid;
  gap: 0.35rem;
}

.dominant-moment h2,
.salon-occasion-hero h1 {
  max-width: 18ch;
  margin: 0;
  font-size: clamp(2.25rem, 4.4vw, 4.6rem);
  line-height: 0.94;
  letter-spacing: 0;
}

.moment-question,
.dominant-moment .lede {
  max-width: 48rem;
  color: #442b34;
  font-size: clamp(1rem, 1.5vw, 1.18rem);
}

.dominant-moment .lede {
  margin-top: 1.1rem;
}

.moment-meta {
  display: grid;
  align-content: start;
  gap: 0.65rem;
  padding: clamp(1rem, 2vw, 1.4rem);
  border-left: 1px solid rgba(113, 41, 62, 0.12);
  background: rgba(255, 252, 248, 0.65);
}

.moment-meta p {
  margin: 0;
}

.triage-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  margin-top: 1rem;
  color: #6c5059;
  font-size: 0.92rem;
}

.triage-row strong {
  color: #24161c;
}

.room-mark {
  display: inline-flex;
  width: fit-content;
  margin: 0 0 0.55rem;
  padding: 0.24rem 0.55rem;
  border: 1px solid rgba(113, 41, 62, 0.14);
  border-radius: 999px;
  background: rgba(255, 250, 245, 0.82);
  color: #7d3547;
  font-size: 0.73rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1.2;
  text-transform: uppercase;
}

.room-mark.reading {
  border-color: rgba(47, 111, 99, 0.2);
  background: rgba(232, 245, 238, 0.86);
  color: #2f6f63;
}

.room-mark.response {
  border-color: rgba(151, 89, 62, 0.22);
  background: rgba(250, 235, 218, 0.9);
  color: #8a4b2f;
}

.room-mark.commons {
  border-color: rgba(83, 88, 143, 0.2);
  background: rgba(238, 239, 250, 0.86);
  color: #4d548f;
}

.room-mark.salon {
  border-color: rgba(166, 67, 89, 0.22);
  background: rgba(249, 230, 235, 0.9);
  color: #96394f;
}

.house-map {
  display: grid;
  gap: 1.25rem;
}

.house-map h2,
.house-ledger h2,
.room-ledger-band h2 {
  max-width: 18ch;
  font-size: clamp(1.9rem, 3vw, 3rem);
  letter-spacing: 0;
}

.room-lines {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid rgba(113, 41, 62, 0.12);
  border-left: 1px solid rgba(113, 41, 62, 0.12);
}

.room-line {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  padding: clamp(1rem, 2vw, 1.25rem);
  border-right: 1px solid rgba(113, 41, 62, 0.12);
  border-bottom: 1px solid rgba(113, 41, 62, 0.12);
  background: rgba(255, 252, 248, 0.52);
}

.room-door-card,
.room-thread-card {
  border-radius: 0;
  box-shadow: none;
}

.room-door-card h3,
.room-line h3 {
  margin-bottom: 0.4rem;
  font-size: clamp(1.45rem, 2vw, 2rem);
  letter-spacing: 0;
}

.entry-copy {
  color: #5b444d;
}

.room-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  margin-top: auto;
  padding-top: 0.85rem;
}

.room-action-row a {
  font-weight: 800;
  text-decoration: none;
}

.room-drawing-list {
  margin-top: 1rem;
  border-top-color: rgba(113, 41, 62, 0.1);
}

.house-ledger .room-thread-grid,
.room-ledger-band .room-thread-grid {
  grid-template-columns: 1fr;
  gap: 0;
  border-top: 1px solid rgba(113, 41, 62, 0.12);
}

.ledger-entry {
  padding: 1rem 0;
  border: none;
  border-bottom: 1px solid rgba(113, 41, 62, 0.12);
  background: none;
}

.ledger-entry h3 {
  max-width: 34rem;
  font-size: clamp(1.55rem, 2.2vw, 2.35rem);
  line-height: 1;
}

.ledger-entry p {
  max-width: 46rem;
}

.entry-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  color: #8a6570;
  font-size: 0.86rem;
}

.salon-occasion-hero {
  padding: clamp(1.2rem, 3vw, 2rem) 0;
  border: none;
  background: none;
}

.salon-response-panel {
  padding: clamp(1rem, 2vw, 1.25rem);
  border: 1px solid rgba(113, 41, 62, 0.12);
  background: rgba(255, 252, 248, 0.66);
}

@media (max-width: 980px) {
  .home-public-house,
  .house-stage {
    grid-template-columns: 1fr;
  }

  .moment-meta {
    border-top: 1px solid rgba(113, 41, 62, 0.12);
    border-left: none;
  }

  .room-lines {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .home-public-house {
    align-items: stretch;
  }

  .room-square-hero h1 {
    max-width: 10ch;
    font-size: clamp(2.8rem, 14vw, 4.4rem);
  }

  .room-lines {
    grid-template-columns: 1fr;
  }

  .triage-row {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* 2026-04-26 literary social baseline parity */
html {
  background: #efe4d7;
}

body {
  color: #1f1717;
  background:
    radial-gradient(circle at top left, rgba(122, 36, 61, 0.11), transparent 22rem),
    linear-gradient(180deg, #f8f1e9, #efe4d7);
  font-family: "Baskerville", "Iowan Old Style", "Palatino Linotype", serif;
}

h1,
h2,
h3,
h4 {
  color: #120b0b;
  font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, serif;
  font-weight: 700;
  letter-spacing: 0;
}

.wrap {
  max-width: 1232px;
  padding-inline: clamp(1rem, 2vw, 1.5rem);
}

.site-header {
  position: static;
  color: #1f1717;
  background: rgba(255, 250, 244, 0.76);
  border-bottom: 1px solid rgba(45, 28, 28, 0.12);
  box-shadow: none;
  backdrop-filter: none;
}

.site-header .wrap {
  padding-block: 1.45rem;
}

.brand,
.nav a.brand {
  color: #120b0b;
  font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, serif;
  font-size: clamp(2rem, 3vw, 2.8rem);
  font-weight: 700;
  letter-spacing: 0;
  text-decoration: none;
}

.site-nav,
.nav a,
.nav button,
.meta,
.kicker,
.section-kicker,
.room-mark,
.entry-foot,
.story-inline,
.filter-row,
.mini-action-row,
.soft-link {
  font-family: "Avenir Next", "Gill Sans", "Trebuchet MS", sans-serif;
}

.nav a,
.nav button {
  color: #2c171b;
  font-size: 0.86rem;
  text-decoration: none;
}

.nav-search,
.nav-group-secondary .nav-group,
.nav-group-secondary a[href*="reading"],
.nav a[href*="top-sparks"] {
  display: none;
}

main.wrap {
  padding-top: clamp(1.5rem, 3vw, 2.4rem);
}

footer.wrap {
  display: none;
}

a.primary-action,
button.primary-action,
.inline-form.primary-action button,
a.secondary-action,
button.secondary-action,
.inline-form.secondary-action button,
a.tertiary-action,
button.tertiary-action,
.inline-form.tertiary-action button {
  border-radius: 0;
  box-shadow: none;
  font-family: "Avenir Next", "Gill Sans", "Trebuchet MS", sans-serif;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0;
}

a.primary-action,
button.primary-action,
.inline-form.primary-action button {
  border-color: #57182b;
  background: #57182b;
  color: #fff;
}

a.secondary-action,
button.secondary-action,
.inline-form.secondary-action button,
a.tertiary-action,
button.tertiary-action,
.inline-form.tertiary-action button {
  border-color: transparent;
  background: transparent;
  color: #57182b;
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.room-square-hero {
  padding: clamp(1.7rem, 4vw, 3.2rem) 0 1rem;
}

.room-square-hero .section-head {
  align-items: start;
}

.room-square-hero h1 {
  max-width: 16ch;
  font-size: clamp(3.1rem, 6vw, 5.5rem);
  line-height: 0.96;
}

.room-square-hero p:not(.meta):not(.section-kicker) {
  max-width: 46rem;
  color: #4a3035;
  font-size: clamp(1rem, 1.5vw, 1.2rem);
}

.room-square-band,
.salon-occasion-band,
.thread-bridge-panel {
  border-top: 1px solid rgba(45, 28, 28, 0.12);
}

.house-stage {
  grid-template-columns: minmax(0, 0.92fr) minmax(18rem, 0.42fr);
  border: none;
  border-top: 1px solid rgba(45, 28, 28, 0.12);
  background: transparent;
}

.dominant-moment {
  padding: clamp(1.25rem, 2.6vw, 2rem) 0;
}

.dominant-moment h2,
.salon-question h1 {
  max-width: 19ch;
  font-size: clamp(2.4rem, 4.8vw, 5rem);
  line-height: 0.95;
}

.moment-question {
  max-width: 13ch;
  color: #160e0e;
  font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, serif;
  font-size: clamp(2rem, 3.7vw, 4rem);
  line-height: 1.02;
}

.dominant-moment .lede,
.host-copy,
.entry-copy,
.margin-copy,
.thread-body,
.reply-copy {
  color: #3d242a;
  font-size: 1.06rem;
  line-height: 1.58;
}

.moment-meta {
  padding: clamp(1.25rem, 2.4vw, 1.8rem) 0 clamp(1.25rem, 2.4vw, 1.8rem) clamp(1rem, 2.4vw, 2rem);
  border-left: none;
  background: transparent;
}

.moment-meta .meta,
.entry-foot,
.meta,
.story-inline {
  color: #8b6663;
  font-size: 0.82rem;
  letter-spacing: 0;
  text-transform: none;
}

.kicker,
.section-kicker {
  color: #6b0018;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: uppercase;
}

.room-mark {
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  color: #6b0018;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0;
  text-transform: none;
}

.room-mark.reading,
.room-mark.response,
.room-mark.commons,
.room-mark.salon {
  border: none;
  background: transparent;
  color: #6b0018;
}

.triage-row,
.mini-action-row,
.room-action-row,
.entry-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  align-items: center;
}

.triage-row a,
.mini-action-row a,
.room-action-row a,
.soft-link {
  color: #57182b;
  font-weight: 800;
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.18em;
}

.house-map {
  gap: 0.9rem;
}

.house-map .section-head h2 {
  display: none;
}

.room-lines {
  grid-template-columns: 10rem minmax(13rem, 0.95fr) minmax(17rem, 1.15fr) 7.5rem;
  border: none;
}

.room-line {
  display: grid;
  grid-template-columns: subgrid;
  grid-column: 1 / -1;
  gap: 1.25rem;
  align-items: baseline;
  padding: 1.1rem 0;
  border-right: none;
  border-bottom: 1px solid rgba(45, 28, 28, 0.12);
  background: transparent;
}

.room-line .room-mark {
  grid-column: 1;
}

.room-line h3 {
  grid-column: 2;
  margin: 0;
  font-size: clamp(1.22rem, 1.8vw, 1.6rem);
}

.room-line .entry-copy,
.room-line p:not(.room-mark):not(.meta) {
  grid-column: 3;
}

.room-line > .meta {
  grid-column: 4;
  text-align: right;
}

.room-line .room-action-row,
.room-line .room-drawing-list {
  display: none;
}

.house-ledger {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(16rem, 0.62fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: start;
}

.ledger-list {
  display: grid;
}

.ledger-entry,
.thread-row,
.working-row,
.reply-row {
  padding: 1.05rem 0;
  border-bottom: 1px solid rgba(45, 28, 28, 0.12);
}

.ledger-entry h2,
.ledger-entry h3,
.thread-row h2,
.thread-row h3,
.thread-row h4,
.working-row h2,
.working-row h4 {
  margin-bottom: 0.35rem;
  font-size: clamp(1.5rem, 2.4vw, 2.35rem);
  line-height: 1.02;
}

.ledger-entry a,
.thread-row a,
.working-row a {
  color: inherit;
}

.margin-stack {
  display: grid;
  gap: 1.25rem;
  align-content: start;
}

.rail-note,
.module-row {
  padding: 0 0 1.25rem;
  border: none;
  border-bottom: 1px solid rgba(45, 28, 28, 0.12);
  background: transparent;
}

.rail-note ul {
  margin: 0.55rem 0 0;
  padding-left: 1.1rem;
}

.rail-note li {
  margin-bottom: 0.35rem;
}

.room-sheet-shell,
.salon-page,
.thread-sheet {
  border: 1px solid rgba(45, 28, 28, 0.14);
  background: rgba(255, 250, 244, 0.58);
  box-shadow: 0 22px 54px rgba(37, 17, 21, 0.08);
}

.room-sheet,
.thread-sheet {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(16rem, 0.62fr);
  gap: clamp(2rem, 5vw, 4.5rem);
  align-items: start;
  padding: clamp(1.25rem, 3vw, 2.4rem);
}

.room-ledge {
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(45, 28, 28, 0.12);
}

.room-topline {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
}

.room-topline h1,
.thread-opening h1 {
  font-size: clamp(2.4rem, 4vw, 4rem);
  line-height: 1;
}

.lede {
  max-width: 46rem;
  margin-top: 0.6rem;
}

.filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.8rem;
}

.filter-row span {
  padding: 0.4rem 0.55rem;
  border: 1px solid rgba(45, 28, 28, 0.12);
  color: #8b6663;
  font-size: 0.78rem;
}

.feature-passage,
.feature-pressure {
  margin-top: 1.5rem;
  padding: 1rem;
  border: 1px solid rgba(45, 28, 28, 0.12);
  background: rgba(255, 250, 244, 0.38);
}

.feature-quote {
  max-width: 28rem;
  margin: 0.35rem 0;
  font-size: clamp(1.65rem, 2.7vw, 2.5rem);
  line-height: 1.08;
}

.thread-list,
.divider-list {
  margin-top: 1rem;
}

.thread-row {
  display: grid;
  grid-template-columns: minmax(8rem, 0.28fr) minmax(0, 1fr);
  column-gap: 1.5rem;
}

.thread-row .room-mark {
  grid-column: 1;
}

.thread-row > *:not(.room-mark) {
  grid-column: 2;
}

.salon-page.dark-salon {
  padding: clamp(1.2rem, 3vw, 2.4rem);
  border-color: rgba(255, 238, 228, 0.18);
  background:
    radial-gradient(circle at 75% 10%, rgba(122, 36, 61, 0.18), transparent 20rem),
    #5a2032;
  color: #f8f1e9;
}

.dark-salon h1,
.dark-salon h2,
.dark-salon h3,
.dark-salon h4,
.dark-salon a,
.dark-salon .kicker,
.dark-salon .room-mark,
.dark-salon .meta {
  color: #fff8ee;
}

.dark-salon .entry-copy,
.dark-salon .margin-copy,
.dark-salon .host-copy,
.dark-salon .moment-question {
  color: #f5e7dc;
}

.dark-salon .rail-note,
.dark-salon .working-row {
  border-bottom-color: rgba(255, 238, 228, 0.18);
}

.salon-opening,
.salon-working {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(16rem, 0.62fr);
  gap: clamp(2rem, 5vw, 4.5rem);
}

.salon-working {
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(255, 238, 228, 0.18);
}

.thread-sheet {
  margin-bottom: 1.5rem;
}

.reply-list {
  margin-top: 1.25rem;
  padding-left: 1rem;
  border-left: 1px solid rgba(45, 28, 28, 0.12);
}

.reply-row p {
  margin: 0.2rem 0 0;
}

.thread-reply-form {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(45, 28, 28, 0.12);
}

@media (max-width: 980px) {
  .house-stage,
  .house-ledger,
  .room-sheet,
  .thread-sheet,
  .salon-opening,
  .salon-working {
    grid-template-columns: 1fr;
  }

  .moment-question {
    max-width: 16ch;
  }

  .room-lines,
  .room-line {
    display: block;
  }

  .room-line > * {
    margin-bottom: 0.45rem;
    text-align: left;
  }

  .room-line > .meta {
    text-align: left;
  }

  .room-topline {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .brand,
  .nav a.brand {
    font-size: 2rem;
  }

  .site-header .wrap,
  .nav,
  .site-nav,
  .nav-group {
    align-items: flex-start;
  }

  .room-square-hero h1,
  .room-topline h1,
  .thread-opening h1,
  .salon-question h1 {
    font-size: clamp(2.4rem, 13vw, 3.6rem);
  }

  .moment-question {
    font-size: clamp(2rem, 10vw, 3.2rem);
  }

  .room-sheet,
  .thread-sheet,
  .salon-page.dark-salon {
    padding: 1rem;
  }

  .thread-row {
    display: block;
  }
}

/* Immediate parity repair: keep the public literary surfaces in the mockup's
   compact ledger rhythm instead of expanding rows into cards. */
.room-square-hero {
  max-width: 72rem;
  margin: 0 auto;
  padding: 1.2rem 0 0.9rem;
  border-left: 1px solid rgba(45, 28, 28, 0.14);
}

.room-square-hero .section-kicker,
.room-square-intro p {
  max-width: 42rem;
  margin-left: 0.8rem;
}

.room-square-hero h1 {
  max-width: none;
  margin-bottom: 0.45rem;
  font-size: clamp(2.35rem, 4vw, 4.1rem);
  line-height: 0.98;
  letter-spacing: 0;
}

.room-square-intro {
  display: block;
}

.room-square-intro .discovery-shortcuts {
  display: none;
}

.house-stage {
  scroll-margin-top: 4rem;
  max-width: 72rem;
  margin: 0 auto;
  padding: clamp(1.35rem, 3vw, 2.25rem) clamp(1.3rem, 3vw, 2.25rem);
  border: 1px solid rgba(45, 28, 28, 0.14);
  background: rgba(255, 250, 244, 0.58);
  box-shadow: 0 22px 54px rgba(37, 17, 21, 0.06);
}

.dominant-moment h2,
.salon-occasion-hero h1 {
  font-size: clamp(2.1rem, 4.4vw, 3.55rem);
  line-height: 1.02;
  letter-spacing: 0;
}

.dominant-moment .moment-question {
  max-width: 14ch;
  font-size: clamp(2rem, 4.3vw, 3.75rem);
  line-height: 1.03;
  color: #120b0b;
}

.dominant-moment .lede {
  max-width: 44rem;
  color: #442b34;
}

.room-mark {
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  font-family: "Avenir Next", "Gill Sans", "Trebuchet MS", sans-serif;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.house-map {
  max-width: 72rem;
  margin: 1.7rem auto 0;
  padding: 0 clamp(1.3rem, 3vw, 2.25rem);
  gap: 0.9rem;
}

.house-map .section-head {
  display: block;
  padding-bottom: 0.8rem;
  border-bottom: 1px solid rgba(45, 28, 28, 0.12);
}

.house-map .section-head h2 {
  display: none;
}

.room-lines {
  display: grid;
  grid-template-columns:
    minmax(7.5rem, 0.22fr)
    minmax(14rem, 0.38fr)
    minmax(18rem, 0.52fr)
    minmax(6.5rem, 0.16fr)
    minmax(8rem, 0.18fr);
  border: none;
}

.room-line {
  display: grid;
  grid-template-columns: subgrid;
  grid-column: 1 / -1;
  gap: 1rem;
  align-items: baseline;
  min-height: 0;
  padding: 1.05rem 0;
  border: none;
  border-bottom: 1px solid rgba(45, 28, 28, 0.12);
  background: transparent;
}

.room-line .room-mark {
  grid-column: 1;
}

.room-line h3 {
  grid-column: 2;
  margin: 0;
  font-size: clamp(1.2rem, 1.65vw, 1.48rem);
  line-height: 1.05;
  letter-spacing: 0;
}

.room-line .entry-copy {
  grid-column: 3;
  margin: 0;
  color: #442b34;
}

.room-line > .meta {
  grid-column: 4;
  margin: 0;
  text-align: right;
}

.room-line .room-action-row {
  display: flex;
  grid-column: 5;
  justify-content: flex-end;
  margin: 0;
  padding: 0;
}

.room-line .room-action-row a {
  color: #57182b;
  font-weight: 800;
  white-space: nowrap;
}

.room-line .room-drawing-list {
  display: none;
}

.house-ledger {
  max-width: 72rem;
  margin: 2.2rem auto 0;
  padding: 0 clamp(1.3rem, 3vw, 2.25rem);
}

.house-ledger .ledger-entry h2,
.house-ledger .ledger-entry h3,
.house-ledger .ledger-entry h4 {
  max-width: 34rem;
  font-size: clamp(1.3rem, 2.1vw, 1.75rem);
  line-height: 1.05;
  letter-spacing: 0;
}

.rail-note,
.margin-note,
.module-row {
  padding: 0 0 1.15rem;
  border: none;
  border-bottom: 1px solid rgba(45, 28, 28, 0.12);
  background: transparent;
  box-shadow: none;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}

@media (max-width: 980px) {
  .room-lines {
    display: block;
  }

  .room-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.35rem;
    padding: 1.15rem 0;
  }

  .room-line .room-mark,
  .room-line h3,
  .room-line .entry-copy,
  .room-line > .meta,
  .room-line .room-action-row {
    grid-column: 1;
    text-align: left;
  }

  .room-line .room-action-row {
    justify-content: flex-start;
  }

  .dominant-moment .moment-question {
    max-width: 16ch;
  }
}

/* Broader literary-social surface repair. These pages were still carrying the
   generic app-card treatment; keep them in the same record/rail language as
   the current mockup scroll. */
.story-body,
.story-card,
.spark-event-hero,
.spark-event-section,
.top-sparks-hero,
.top-sparks-shelf,
.room-sheet-shell,
.thread-sheet,
.salon-page {
  max-width: 72rem;
  margin-right: auto;
  margin-left: auto;
}

.story-body {
  display: block;
  padding: clamp(1.25rem, 3vw, 2.2rem);
  border: 1px solid rgba(45, 28, 28, 0.14);
  background: rgba(255, 250, 244, 0.58);
  box-shadow: 0 22px 54px rgba(37, 17, 21, 0.06);
}

.story-body > h1,
.story-card > h1,
.spark-event-hero h1,
.top-sparks-hero h1 {
  max-width: 12ch;
  margin: 0 0 0.55rem;
  font-size: clamp(3rem, 6vw, 5.8rem);
  line-height: 0.98;
  letter-spacing: 0;
}

.story-body > .meta,
.story-body > .prose,
.story-body > .action-row,
.story-body > .card,
.story-card > *,
.spark-event-hero > *,
.spark-event-section > * {
  max-width: 46rem;
}

.story-body > .prose {
  margin-top: 1.8rem;
  padding-top: 1.2rem;
  border-top: 1px solid rgba(45, 28, 28, 0.12);
  font-size: clamp(1.08rem, 1.7vw, 1.25rem);
  line-height: 1.6;
}

.story-body .card,
.story-card,
.spark-event-section,
.spark-story-panel,
.comments-card,
.empty-state,
.compact-empty-state {
  border-radius: 0;
  border-color: rgba(45, 28, 28, 0.12);
  background: transparent;
  box-shadow: none;
}

.story-body > .card,
.story-card,
.spark-event-section {
  margin-top: 1.3rem;
  padding: 1rem 0;
  border-width: 1px 0 0;
}

.story-body .card h2,
.story-card h2,
.spark-event-section h2 {
  font-size: clamp(1.45rem, 2.4vw, 2.25rem);
  line-height: 1.05;
  letter-spacing: 0;
}

.spark-event-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  border-top: 1px solid rgba(45, 28, 28, 0.12);
}

.spark-story-panel {
  padding: 1rem;
  border-width: 0 0 1px;
}

.spark-story-panel:nth-child(odd) {
  border-right: 1px solid rgba(45, 28, 28, 0.12);
}

.story-card .card.small,
.stack-list .card.small {
  margin-top: 1rem;
  padding: 1rem 0;
  border-width: 1px 0 0;
}

.spark-event-hero {
  padding: clamp(1.25rem, 3vw, 2.2rem);
  border: 1px solid rgba(45, 28, 28, 0.14);
  background:
    radial-gradient(circle at 82% 10%, rgba(122, 36, 61, 0.1), transparent 18rem),
    rgba(255, 250, 244, 0.58);
  box-shadow: 0 22px 54px rgba(37, 17, 21, 0.06);
}

.spark-event-grid {
  max-width: none;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  margin-top: 1.3rem;
  border: 1px solid rgba(255, 238, 228, 0.2);
  background: #6b243a;
  color: #fff8ee;
}

.spark-event-grid h2,
.spark-event-grid a,
.spark-event-grid .meta {
  color: #fff8ee;
}

.spark-claim-panel {
  display: grid;
  align-content: center;
  min-width: 8rem;
  text-align: center;
}

.taste-badge-list,
.spark-badge-list {
  display: none;
}

.top-sparks-hero,
.top-sparks-shelf {
  padding: 1.2rem 0;
  border-top: 1px solid rgba(45, 28, 28, 0.12);
}

@media (max-width: 760px) {
  .story-body,
  .spark-event-hero {
    padding: 1rem;
  }

  .spark-event-grid {
    display: block;
  }

  .spark-story-panel:nth-child(odd) {
    border-right: none;
  }
}