:root {
  --ed-ink: #171313;
  --ed-paper: #f7f2ed;
  --ed-cream: #fffaf4;
  --ed-muted: #756b66;
  --ed-line: #d9cfc7;
  --ed-pink: #c92f7d;
  --ed-pink-dark: #9e205f;
  --ed-pink-soft: #f0d7e4;
  --ed-display: Georgia, "Times New Roman", serif;
  --ed-body: "Avenir Next", Avenir, "Segoe UI", sans-serif;
}

:root[data-theme="night"] {
  --ed-ink: #f4ece5;
  --ed-paper: #12100f;
  --ed-cream: #1b1715;
  --ed-muted: #a89c94;
  --ed-line: #3c332e;
  --ed-pink: #e14b9d;
  --ed-pink-dark: #f06caf;
  --ed-pink-soft: #3b202e;
}

body {
  background: var(--ed-paper) !important;
  color: var(--ed-ink) !important;
  font-family: var(--ed-body);
}

body:not(.landing-page):not(.preview-page) main {
  width: min(1380px, 100%);
  padding: 54px 42px 110px;
}

h1, h2, h3, .feed-title, .post-title {
  font-family: var(--ed-display);
  font-weight: 400;
}

button, .button {
  min-height: 48px;
  border-radius: 2px;
  background: var(--ed-pink);
  color: #fff;
  box-shadow: none;
}

button:hover, .button:hover { background: var(--ed-pink-dark); box-shadow: none; }

/* Entrance: faithful split-screen reference */
body.landing-page {
  min-height: 100dvh;
  overflow: hidden;
  background: #11100f;
}

.landing-page main {
  width: 100% !important;
  max-width: none !important;
  min-height: 100dvh;
  padding: 0 !important;
}

.landing-page .join-gate {
  position: relative;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  width: 100%;
  min-height: 100dvh !important;
  padding: 0 !important;
  overflow: hidden;
  background: #11100f !important;
}

.landing-page .join-gate::before,
.landing-page .join-gate::after { display: none !important; }

.landing-page .join-bg {
  position: relative !important;
  inset: auto !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 100%;
  min-height: 100dvh;
  opacity: 1 !important;
  overflow: hidden;
}

.landing-page .join-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(90deg, rgba(17,16,15,.28), transparent 22%), linear-gradient(0deg, rgba(17,16,15,.18), transparent 34%);
}

.landing-page .join-bg span {
  inset: 0 !important;
  background-position: center !important;
  background-size: cover !important;
  filter: sepia(.2) saturate(.66) contrast(1.05) brightness(.82) !important;
}

.landing-page .join-editorial {
  position: relative;
  z-index: 3;
  grid-column: 1 !important;
  grid-row: 1 !important;
  display: grid;
  grid-template-rows: auto 1fr;
  min-width: 0;
  min-height: 100dvh;
  padding: clamp(32px, 4vw, 62px);
  background: #11100f;
}

.landing-page .join-logo-wrap {
  display: flex;
  justify-content: flex-start;
  min-height: 0 !important;
}

.landing-page .join-logo {
  width: 150px !important;
  height: 74px !important;
  object-fit: contain;
  object-position: left center;
  filter: brightness(0) invert(1);
}

.landing-page .join-copy-login-only {
  align-self: center;
  width: min(650px, 100%) !important;
  margin: 0 !important;
  padding: 0 0 8vh !important;
  text-align: left !important;
}

.landing-page .join-copy-login-only h1 {
  max-width: 9ch;
  margin: 0 0 30px;
  color: #f7eee5;
  font-family: var(--ed-display);
  font-size: clamp(68px, 7.2vw, 132px);
  font-weight: 400;
  line-height: .91;
  letter-spacing: -.065em;
}

.landing-page .join-intro {
  max-width: 43ch !important;
  margin: 0 0 38px !important;
  color: rgba(247,238,229,.68) !important;
  font-size: clamp(16px, 1.45vw, 21px) !important;
  line-height: 1.55 !important;
}

.landing-page .join-actions-login {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 18px !important;
  width: min(530px, 100%) !important;
  margin: 0 !important;
}

.landing-page .join-actions-login .button {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 60px !important;
  border-radius: 0 !important;
}

.landing-page .join-primary { background: var(--ed-pink) !important; }
.landing-page .join-preview-button {
  border: 1px solid rgba(247,238,229,.52) !important;
  background: transparent !important;
  color: #f7eee5 !important;
  backdrop-filter: none !important;
}

.landing-page .join-copy-login-only small {
  margin-top: 19px;
  color: rgba(247,238,229,.43);
  text-align: left !important;
}

/* Public preview: faithful asymmetric gallery */
body.preview-page { background: #12100f !important; color: #f7eee5; }
.preview-page main {
  width: 100% !important;
  max-width: none !important;
  padding: 0 44px 120px !important;
  background: radial-gradient(circle at 82% 4%, rgba(201,47,125,.12), transparent 31rem), #12100f !important;
}
.preview-page .preview-nav {
  width: min(1370px, 100%) !important;
  min-height: 86px !important;
  padding: 0 !important;
  border-color: rgba(247,238,229,.2) !important;
  background: rgba(18,16,15,.88) !important;
}
.preview-page .preview-wordmark { color: #f7eee5; font-size: 42px; }
.preview-page .preview-nav .button {
  width: auto !important;
  min-width: 150px !important;
  min-height: 42px !important;
  border: 0;
  background: transparent !important;
  color: #f7eee5 !important;
}
.preview-page .preview-hero {
  width: min(1370px, 100%) !important;
  margin: 0 auto !important;
  padding: 92px 0 78px !important;
  text-align: left !important;
}
.preview-page .preview-hero .eyebrow { display: none; }
.preview-page .preview-hero h1 {
  max-width: none !important;
  margin: 0 0 20px;
  color: #f7eee5;
  font-family: var(--ed-display);
  font-size: clamp(76px, 9vw, 146px) !important;
  font-weight: 400;
  line-height: .92;
  letter-spacing: -.065em;
}
.preview-page .preview-hero > p:last-child {
  max-width: 50ch !important;
  margin: 0 !important;
  color: rgba(247,238,229,.56) !important;
  font-size: 20px;
}
.preview-page .preview-grid {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  grid-auto-flow: dense !important;
  gap: 18px !important;
  width: min(1370px, 100%) !important;
  align-items: start;
}
.preview-page .preview-card {
  grid-column: span 5 !important;
  margin: 0 !important;
  overflow: hidden;
  border: 1px solid rgba(247,238,229,.19) !important;
  border-radius: 3px !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: none !important;
}
.preview-page .preview-card:nth-child(4n+1),
.preview-page .preview-card:nth-child(4n+4) { grid-column: span 7 !important; }
.preview-page .preview-card:nth-child(3n+2) { margin-top: 86px !important; }
.preview-page .preview-media { aspect-ratio: 4 / 5 !important; }
.preview-page .preview-card:nth-child(4n+1) .preview-media { aspect-ratio: 6 / 7 !important; }
.preview-page .preview-card-copy { padding: 18px 20px 24px !important; }
.preview-page .preview-card-copy span { color: var(--ed-pink); }
.preview-page .preview-card-copy h2 {
  margin-top: 8px;
  color: #f7eee5;
  font-family: var(--ed-display);
  font-size: clamp(25px, 2.8vw, 40px);
  font-weight: 400;
}
.preview-page .preview-free-badge { border-radius: 2px !important; }
.preview-page .preview-cta {
  width: min(1050px, 100%) !important;
  margin-top: 190px !important;
  padding: 92px 0 !important;
  border-block: 1px solid rgba(247,238,229,.18);
}
.preview-page .preview-cta h2 { max-width: 11ch; color: #f7eee5; }
.preview-page .preview-cta .button { border-radius: 2px !important; }

/* Member feed: image-led reading column with fixed utility rail */
.member-feed-heading {
  margin-bottom: 34px !important;
  padding-bottom: 24px !important;
}
.member-feed-heading .feed-title {
  max-width: 12ch;
  margin: 0;
  color: var(--ed-ink) !important;
  font-family: var(--ed-display);
  font-size: clamp(64px, 8vw, 116px) !important;
  font-weight: 400;
  line-height: .88;
  letter-spacing: -.065em;
  text-transform: none !important;
}
.feed-stories {
  max-width: none !important;
  margin: 0 0 46px !important;
  padding: 0 0 26px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ed-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.member-feed-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: clamp(50px, 7vw, 105px);
  align-items: start;
}
.member-feed-main { min-width: 0; }
.member-feed-main .feed { width: 100% !important; max-width: none !important; gap: 78px !important; }
.member-feed-main .post {
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.member-feed-main .post + .post { padding-top: 76px; border-top: 1px solid var(--ed-line) !important; }
.member-feed-main .post-media { border-radius: 3px !important; }
.member-feed-main .post-body { padding: 26px 0 0 !important; }
.member-feed-main .post-title,
.member-feed-main .post-body h2 {
  max-width: 15ch;
  color: var(--ed-ink);
  font-family: var(--ed-display);
  font-size: clamp(35px, 4vw, 58px) !important;
  font-weight: 400;
  line-height: .98;
}
.member-feed-main .post-copy { max-width: 62ch; line-height: 1.75; }
.member-feed-rail {
  position: sticky;
  top: 118px;
  border-top: 1px solid var(--ed-line);
}
.rail-intro { margin: 0; padding: 24px 0; color: var(--ed-muted); line-height: 1.6; }
.rail-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 112px;
  border-top: 1px solid var(--ed-line);
  color: var(--ed-ink) !important;
  transition: color .2s, padding .25s;
}
.rail-link:last-child { border-bottom: 1px solid var(--ed-line); }
.rail-link:hover { padding-left: 10px; color: var(--ed-pink); }
.rail-link span { display: grid; gap: 5px; }
.rail-link strong { font-family: var(--ed-display); font-size: 22px; font-weight: 400; }
.rail-link small { color: var(--ed-muted); }
.rail-link b { color: var(--ed-pink); font-size: 23px; font-weight: 400; }

/* Admin editor: writing canvas and publishing inspector */
.admin-topbar { background: color-mix(in srgb, var(--ed-paper) 96%, transparent) !important; }
.edit-panel {
  max-width: 1380px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.edit-panel > .feed-header { padding-inline: 0 !important; }
.editorial-editor {
  display: grid !important;
  grid-template-columns: minmax(0, 1.65fr) minmax(340px, .75fr) !important;
  column-gap: clamp(52px, 6vw, 94px) !important;
  align-items: start;
}
.editorial-editor > h1,
.editorial-editor > input[type="hidden"] { grid-column: 1 / -1 !important; }
.editorial-editor > h1 {
  margin: 12px 0 38px;
  color: var(--ed-ink);
  font-family: var(--ed-display);
  font-size: clamp(62px, 8vw, 112px);
  font-weight: 400;
  line-height: .9;
}
.editorial-editor > .form-section {
  margin: 0 !important;
  padding: 30px 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--ed-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.editorial-editor > .form-section:nth-of-type(1),
.editorial-editor > .form-section:nth-of-type(2) { grid-column: 1 !important; }
.editorial-editor > .form-section:nth-of-type(3),
.editorial-editor > .form-section:nth-of-type(4),
.editorial-editor > .form-section:nth-of-type(n+5),
.editorial-editor > label,
.editorial-editor > .schedule-fields,
.editorial-editor > .row-actions { grid-column: 2 !important; }
.editorial-editor > .form-section:nth-of-type(3) { grid-row: 2 / span 2 !important; }
.editorial-editor .form-section h2 {
  color: var(--ed-ink);
  font-family: var(--ed-display);
  font-size: 30px;
  font-weight: 400;
}
.editorial-editor input,
.editorial-editor textarea,
.editorial-editor select {
  border: 1px solid var(--ed-line) !important;
  border-radius: 2px !important;
  background: var(--ed-cream) !important;
}
.editorial-editor textarea[name="body"] { min-height: 280px; }
.editorial-editor .upload-preview-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.editorial-editor .upload-preview-item { border-radius: 2px !important; }
.editorial-editor .check-row { min-height: 48px; border-bottom: 1px solid var(--ed-line); }
.editorial-editor .preview-warning { background: #eee6df !important; }
.editorial-editor .post-actions,
.editorial-editor > .row-actions { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }

/* Shared authenticated surfaces */
body:not(.landing-page):not(.preview-page) .topbar {
  min-height: 76px;
  border-color: var(--ed-line);
  background: color-mix(in srgb, var(--ed-paper) 93%, transparent) !important;
  color: var(--ed-ink) !important;
}
body:not(.landing-page):not(.preview-page) .topbar a,
body:not(.landing-page):not(.preview-page) .topbar span { color: var(--ed-ink); }
body:not(.landing-page):not(.preview-page) .panel,
body:not(.landing-page):not(.preview-page) .message-panel,
body:not(.landing-page):not(.preview-page) .legal {
  border-color: var(--ed-line);
  border-radius: 3px;
  background: var(--ed-cream);
  box-shadow: none;
}
body:not(.landing-page):not(.preview-page) input,
body:not(.landing-page):not(.preview-page) textarea,
body:not(.landing-page):not(.preview-page) select { border-color: var(--ed-line); }

/* Admin dashboard and management pages */
.admin-page {
  background: var(--ed-paper) !important;
  color: var(--ed-ink) !important;
}
.admin-page main { width: min(1380px, 100%); }
.admin-page .admin-topbar nav a { color: var(--ed-ink) !important; }
.admin-page .stats-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0 !important;
  margin: 0 0 32px !important;
  border-block: 1px solid var(--ed-line);
}
.admin-page .stat {
  min-height: 104px !important;
  display: flex;
  align-items: flex-end;
  gap: 9px;
  padding: 22px 18px !important;
  overflow: visible;
  border: 0 !important;
  border-right: 1px solid var(--ed-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--ed-ink) !important;
  box-shadow: none !important;
}
.admin-page .stat:last-child { border-right: 0 !important; }
.admin-page .stat::after { display: none !important; }
.admin-page .stat strong {
  margin: 0 !important;
  color: var(--ed-pink) !important;
  font-family: var(--ed-display);
  font-size: clamp(32px, 3vw, 48px) !important;
  font-weight: 400;
  line-height: .85;
}
.admin-page .stat span {
  color: var(--ed-muted) !important;
  font-size: 10px !important;
  font-weight: 650;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.admin-page .dashboard-task-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0 !important;
  margin: 0 0 54px !important;
  border-block: 1px solid var(--ed-line);
  background: transparent !important;
}
.admin-page .dashboard-task-grid .button {
  min-height: 66px;
  border: 0 !important;
  border-right: 1px solid var(--ed-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--ed-ink) !important;
}
.admin-page .dashboard-task-grid .button:hover { background: var(--ed-pink) !important; color: #fff !important; }
.admin-page #posts {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
.admin-page #posts > .feed-header {
  margin-bottom: 26px !important;
  padding: 0 0 24px !important;
  border-bottom: 1px solid var(--ed-line);
}
.admin-page #posts > .feed-header h2 {
  margin: 0;
  color: var(--ed-ink);
  font-family: var(--ed-display);
  font-size: clamp(48px, 6vw, 82px);
  font-weight: 400;
}
.admin-page .bulk-actions {
  display: grid;
  grid-template-columns: minmax(220px, .7fr) minmax(220px, 1fr);
  gap: 18px;
  margin: 0 0 18px !important;
  padding: 18px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ed-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.admin-page .bulk-actions select { color: var(--ed-ink) !important; background: var(--ed-cream) !important; }
.admin-page .admin-post {
  margin: 0 !important;
  padding: 20px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ed-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--ed-ink) !important;
}
.admin-page .admin-post:hover { background: color-mix(in srgb, var(--ed-pink) 6%, transparent) !important; }
.admin-page .admin-post-link { color: var(--ed-ink) !important; }
.admin-page .media-preview { border-radius: 2px !important; }
.admin-page .post-metrics span,
.admin-page .status-pill { border-color: var(--ed-line) !important; background: var(--ed-pink-soft) !important; color: var(--ed-pink) !important; }
.admin-page .danger { background: #582336 !important; color: #fff !important; }

:root[data-theme="night"] .admin-page .brand-logo,
:root[data-theme="night"] body:not(.landing-page):not(.preview-page) .brand-logo {
  filter: brightness(0) invert(1);
}
:root[data-theme="night"] .theme-toggle,
:root[data-theme="night"] .install-app-button,
:root[data-theme="night"] .notification-center-button {
  border-color: var(--ed-line) !important;
  background: var(--ed-cream) !important;
  color: var(--ed-ink) !important;
}

@media (max-width: 980px) {
  .landing-page .join-gate { grid-template-columns: minmax(0, 1.12fr) minmax(340px, .88fr) !important; }
  .member-feed-layout { grid-template-columns: minmax(0, 1fr) 270px; gap: 42px; }
  .editorial-editor { grid-template-columns: 1fr !important; }
  .editorial-editor > *, .editorial-editor > .form-section:nth-of-type(n) { grid-column: 1 !important; grid-row: auto !important; }
  .admin-page .stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .admin-page .dashboard-task-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  body:not(.landing-page):not(.preview-page) main { padding: 28px 14px 48px !important; }
  .landing-page { overflow: auto; }
  .landing-page .join-gate { display: block !important; }
  .landing-page .join-bg { position: absolute !important; inset: 0 !important; min-height: 100dvh; }
  .landing-page .join-bg::after { background: linear-gradient(90deg, rgba(17,16,15,.96), rgba(17,16,15,.64) 78%, rgba(17,16,15,.3)); }
  .landing-page .join-editorial { min-height: 100dvh; padding: 24px 20px; background: transparent; }
  .landing-page .join-logo { width: 126px !important; height: 58px !important; }
  .landing-page .join-copy-login-only { padding-bottom: 2vh !important; }
  .landing-page .join-copy-login-only h1 { max-width: 8ch; font-size: clamp(64px, 20vw, 98px); }
  .landing-page .join-actions-login { grid-template-columns: 1fr !important; }
  .preview-page main { padding: 0 15px 90px !important; }
  .preview-page .preview-nav { min-height: 66px !important; }
  .preview-page .preview-wordmark { font-size: 29px; }
  .preview-page .preview-nav .button { width: auto !important; min-width: 0 !important; padding: 0 8px !important; font-size: 12px; }
  .preview-page .preview-hero { padding: 68px 0 54px !important; }
  .preview-page .preview-hero h1 { font-size: clamp(64px, 20vw, 100px) !important; }
  .preview-page .preview-hero > p:last-child { font-size: 16px; }
  .preview-page .preview-grid { grid-template-columns: 1fr !important; }
  .preview-page .preview-card,
  .preview-page .preview-card:nth-child(n) { grid-column: 1 !important; margin: 0 0 18px !important; }
  .preview-page .preview-card:nth-child(even) { margin-left: 13vw !important; }
  .preview-page .preview-card:nth-child(odd) { margin-right: 8vw !important; }
  .preview-page .preview-cta { margin-top: 100px !important; padding: 70px 0 !important; }
  .member-feed-heading .feed-title { font-size: clamp(56px, 17vw, 82px) !important; }
  .member-feed-layout { grid-template-columns: 1fr; }
  .member-feed-rail { position: static; margin-top: 70px; }
  .member-feed-main .post + .post { padding-top: 48px; }
  .editorial-editor .upload-preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .editorial-editor .post-actions,
  .editorial-editor > .row-actions { grid-template-columns: 1fr; }
  .admin-page .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-page .stat { min-height: 84px !important; }
  .admin-page .dashboard-task-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-page .bulk-actions { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
  .landing-page .join-copy-login-only h1 { font-size: 60px; }
  .preview-page .preview-card:nth-child(n) { margin-inline: 0 !important; }
  .editorial-editor .upload-preview-grid { grid-template-columns: 1fr; }
}
