@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600;700&family=DM+Serif+Display:ital@0;1&family=Lora:ital,wght@0,400;0,500;1,400;1,500&display=swap");

/* Final interface cleanup. Invitation artwork keeps its own intentional rules. */

/* One explicit product hierarchy: page, section, item. */
.product-view:not([hidden]) > .view-header h1 {
  font-size: clamp(3.5rem, 5.4vw, 5.4rem) !important;
  font-weight: 800;
  line-height: 0.9;
}

.product-view:not([hidden]) h2 {
  font-size: clamp(1.8rem, 2.7vw, 2.65rem) !important;
  font-weight: 750;
  line-height: 1;
}

.product-view:not([hidden]) h3:not(.invite-preview h3):not(.three-invitation h3) {
  font-size: 1.15rem !important;
  font-weight: 650;
  line-height: 1.15;
}

.product-view:not([hidden]) :is(.program-panel-heading, .template-browser-heading) h2 {
  font-size: 1.25rem !important;
  line-height: 1.1;
}

.sidebar {
  border-bottom: 0;
  box-shadow: 0 12px 30px rgba(17, 17, 17, 0.055);
}

.nav-list a::before,
.nav-list a::after {
  display: none;
}

.product-view > .view-header,
[data-view="studio"] > .view-header {
  min-height: 72px;
  margin-bottom: 30px;
  padding-bottom: 0;
  border: 0;
}

/* Home: use spacing and tone instead of table rules. */
[data-view="dashboard"] .stats-grid {
  gap: 10px;
  background: transparent;
  border: 0;
}

[data-view="dashboard"] .stat-card,
[data-view="dashboard"] .stat-card:nth-child(n),
[data-view="dashboard"] .stat-card.accent {
  border: 0;
  border-radius: 8px;
}

[data-view="dashboard"] .calendar-panel .panel-heading,
[data-view="dashboard"] .people-strip-heading,
[data-view="dashboard"] .directory-heading,
[data-view="dashboard"] .program-panel-heading {
  border: 0;
}

.people-table-head {
  padding-bottom: 5px;
  border: 0;
}

.people-table {
  gap: 7px;
}

.person-row {
  border: 0;
  border-radius: 7px;
  background: #f5f5f0;
}

.person-row:hover,
.person-row.selected {
  background: var(--p-blue-soft);
}

/* Studio: replace progress underlines and control dividers with clear states. */
[data-view="studio"] .studio-progress {
  display: inline-flex;
  width: auto;
  gap: 5px;
  padding: 4px;
  background: #e9e9e4;
  border: 0;
  border-radius: 8px;
}

[data-view="studio"] .studio-progress button {
  min-height: 36px;
  padding: 8px 14px;
  border-radius: 5px;
  box-shadow: none;
}

[data-view="studio"] .studio-progress button.active {
  color: #fff;
  background: var(--p-blue);
  box-shadow: none;
}

[data-view="studio"] .template-browser .template-rail {
  border-top: 0;
}

[data-view="studio"] .template-mini {
  border-bottom: 0;
}

[data-view="studio"] .studio-look-brief,
[data-view="studio"] .control-section {
  border: 0;
}

[data-view="studio"] .ai-designer,
[data-view="studio"] .control-section > summary {
  border: 0;
}

[data-view="studio"] .studio-look-brief {
  padding-bottom: 16px;
}

[data-view="studio"] .control-section {
  margin: 5px 10px;
}

[data-view="studio"] .control-section > summary {
  min-height: 46px;
  padding: 12px 14px;
  background: #f3f3ee;
  border-radius: 6px;
}

[data-view="studio"] .control-section[open] > summary {
  color: #fff;
  background: var(--p-ink);
}

[data-view="studio"] .control-section-body {
  padding: 16px 10px 22px;
}

[data-view="studio"] .designer-tools :is(input:not([type="color"]):not([type="range"]):not([type="checkbox"]):not([type="file"]), select, textarea),
[data-view="gifts"] :is(input:not([type="checkbox"]):not([type="file"]), select, textarea),
[data-view="reminders"] :is(input:not([type="checkbox"]):not([type="file"]), select, textarea) {
  background: #f3f3ee;
  border: 1px solid rgba(17, 17, 17, 0.14);
  border-radius: 6px;
}

/* Gifts: sections and records no longer look ruled like a document. */
[data-view="gifts"] .gift-discovery,
[data-view="gifts"] .gift-journal,
[data-view="gifts"] .gift-shortlist,
[data-view="gifts"] .gift-list-section {
  padding-top: 0;
  border: 0;
}

[data-view="gifts"] :is(.gift-discovery-heading, .journal-heading, .shortlist-heading) {
  border: 0;
}

[data-view="gifts"] .gift-assistant-heading,
[data-view="gifts"] .gift-chat-prompts {
  border: 0;
}

[data-view="gifts"] .gift-chat-prompts {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  padding: 14px 16px;
}

[data-view="gifts"] .gift-top-grid .gift-chat-prompts button,
[data-view="gifts"] .gift-top-grid .gift-chat-prompts button:nth-child(n) {
  flex: 0 1 auto;
  min-height: 34px;
  padding: 7px 12px;
  background: #f3f3ee;
  border: 0;
  border-radius: 999px;
}

.best-gift-read {
  padding: 18px;
  background: rgba(255, 255, 255, 0.5);
  border: 0;
  border-radius: 7px;
}

.gift-form {
  gap: 10px;
  padding: 20px;
  background: #f1f1ec;
  border: 0;
  border-radius: 8px;
}

.gift-entry,
.item-card {
  margin-bottom: 7px;
  padding: 16px;
  background: #f5f5f0;
  border: 0;
  border-radius: 7px;
}

[data-view="gifts"] .gift-shortlist,
[data-view="gifts"] .gift-shortlist .shortlist-heading,
[data-view="gifts"] .gift-shortlist .comparison-empty,
[data-view="gifts"] .gift-list-section > h2,
[data-view="gifts"] .journal-heading,
[data-view="gifts"] .journal-entry-drawer {
  border: 0;
}

[data-view="gifts"] .comparison-empty {
  padding: 18px;
  background: #f5f5f0;
  border-radius: 7px;
}

[data-view="gifts"] .journal-summary {
  gap: 7px;
}

[data-view="gifts"] .journal-summary > div,
[data-view="gifts"] .journal-timeline,
[data-view="gifts"] .journal-layout > * {
  border: 0;
}

[data-view="gifts"] .journal-layout::before,
[data-view="gifts"] .journal-layout::after,
[data-view="gifts"] .journal-timeline::before,
[data-view="gifts"] .journal-timeline::after {
  display: none;
}

[data-view="gifts"] .journal-summary > div {
  border-radius: 6px;
}

[data-view="gifts"] .journal-entry-drawer {
  margin-top: 10px;
}

[data-view="gifts"] .journal-entry-drawer > summary {
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.42);
  border: 0;
  border-radius: 6px;
}

/* Reminders: keep the overview scannable without a ruled grid. */
[data-view="reminders"] .reminder-overview {
  gap: 7px;
  padding: 7px;
  border: 0;
}

[data-view="reminders"] .reminder-overview > div,
[data-view="reminders"] .reminder-overview > div:nth-child(n) {
  border: 0;
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.075);
}

[data-view="reminders"] .panel-heading {
  border: 0;
}

[data-view="reminders"] .inline-form,
[data-view="reminders"] .quick-task-row {
  border: 0;
}

[data-view="reminders"] .inline-form {
  margin-top: 8px;
  padding: 18px;
  background: #f5f5f0;
  border-radius: 7px;
}

[data-view="reminders"] .quick-task-row {
  padding-block: 16px 6px;
}

[data-view="reminders"] .timeline,
[data-view="reminders"] .task-list {
  gap: 7px;
}

[data-view="reminders"] .timeline-item,
[data-view="reminders"] .task-list .item-card {
  padding: 15px;
  background: rgba(255, 255, 255, 0.55);
  border: 0;
  border-radius: 7px;
}

@media (max-width: 700px) {
  .product-view:not([hidden]) > .view-header h1 {
    font-size: clamp(3rem, 13vw, 3.6rem) !important;
  }

  .product-view:not([hidden]) h2 {
    font-size: 1.8rem !important;
  }

  .product-view:not([hidden]) h3:not(.invite-preview h3):not(.three-invitation h3) {
    font-size: 1rem !important;
  }

  .product-view:not([hidden]) :is(.program-panel-heading, .template-browser-heading) h2 {
    font-size: 1.2rem !important;
  }

  .product-view > .view-header,
  [data-view="studio"] > .view-header {
    padding-bottom: 0;
  }

  [data-view="dashboard"] .stat-card,
  [data-view="dashboard"] .stat-card:nth-child(n),
  [data-view="reminders"] .reminder-overview > div,
  [data-view="reminders"] .reminder-overview > div:nth-child(n) {
    border: 0;
  }

  [data-view="studio"] .studio-progress {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
  }

  .people-table-head {
    display: none;
  }
}

/* Invitation flow: one calm decision at a time. */
[data-view="studio"] > .view-header #newInvitation {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 8px 18px 8px 10px;
  border-radius: 999px;
  box-shadow: 0 8px 20px rgba(47, 73, 84, 0.14);
}

[data-view="studio"] > .view-header #newInvitation::before {
  position: static !important;
  display: grid !important;
  width: 30px;
  height: 30px;
  margin: 0 !important;
  place-items: center;
  color: var(--p-blue);
  content: "+" !important;
  font: 400 1.35rem/1 "DM Sans", sans-serif;
  background: #fffaf7;
  border: 0;
  border-radius: 50%;
  transform: none !important;
}

[data-view="studio"] .studio-progress {
  justify-content: center;
  gap: clamp(20px, 7vw, 72px);
  margin-bottom: 20px;
  padding: 0;
  background: transparent;
  border: 0;
}

[data-view="studio"] .studio-progress button,
#invitationPanel[data-studio-stage] .studio-progress [data-studio-stage] {
  min-height: 42px;
  padding: 4px 8px;
  color: rgba(47, 73, 84, 0.52);
  font-family: "Lora", serif;
  font-size: 1rem;
  font-style: italic;
  font-weight: 500;
  background: transparent !important;
  border: 0;
}

[data-view="studio"] .studio-progress button::before,
[data-view="studio"] .studio-progress button::after {
  display: none !important;
  content: none !important;
}

#invitationPanel[data-studio-stage="look"] .studio-progress [data-studio-stage="look"],
#invitationPanel[data-studio-stage="details"] .studio-progress [data-studio-stage="details"],
#invitationPanel[data-studio-stage="share"] .studio-progress [data-studio-stage="share"] {
  color: var(--p-blue);
  background: #dceaf0 !important;
  border-radius: 999px;
}

[data-view="studio"] .studio-mode-bar {
  display: block;
  width: 100%;
  margin: 0 0 18px;
  padding: 0;
}

[data-view="studio"] .studio-mode-bar .segmented-control {
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 100%;
  padding: 5px;
  background: #dceaf0;
  border: 0;
  border-radius: 12px;
}

[data-view="studio"] .studio-mode-bar .segmented-control button {
  min-height: 48px;
  font-family: "DM Serif Display", serif;
  font-size: 1.08rem;
  border-radius: 8px;
}

[data-view="studio"] .studio-mode-bar .segmented-control button.active {
  color: #fffaf7;
  background: #2f4954;
  box-shadow: 0 5px 14px rgba(47, 73, 84, 0.14);
}

[data-view="studio"] .invitation-draft-bar {
  display: flex;
  justify-content: center;
  gap: 7px;
  margin: 0 auto 24px;
  padding: 0;
  text-align: center;
  border: 0;
}

[data-view="studio"] .invitation-draft-bar > span {
  align-self: center;
  margin-right: 4px;
  color: var(--muted);
  font-family: "Lora", serif;
  font-size: 0.82rem;
  font-style: italic;
}

[data-view="studio"] .invitation-draft-bar button {
  min-height: 36px;
  padding: 7px 12px;
  border: 0;
  border-radius: 999px;
  background: #f1ebe7;
}

[data-view="studio"] .invitation-draft-bar button.active {
  color: #fffaf7;
  background: #526d67;
}

[data-view="studio"] .template-browser-heading,
[data-view="studio"] .template-filters {
  justify-content: center;
  text-align: center;
}

[data-view="studio"] .template-browser-heading {
  display: block;
}

[data-view="studio"] .template-browser-heading p {
  margin: 7px 0 0;
}

[data-view="studio"] .template-rail {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0 12px;
  padding: 16px;
  overflow: visible;
  background: #dceaf0;
  border: 0;
  border-radius: 12px;
}

[data-view="studio"] .template-choice {
  min-width: 0;
  width: 100%;
  transform: none;
}

[data-view="studio"] .template-more {
  display: block;
  margin: 0 auto 26px;
  padding: 9px 15px;
  color: var(--p-blue);
  background: transparent;
  border: 1px solid rgba(47, 73, 84, 0.25);
  border-radius: 999px;
}

/* Gift search begins with a person, while still allowing a free description. */
[data-view="gifts"] .gift-assistant-heading {
  align-items: start;
}

[data-view="gifts"] .gift-assistant-heading h2 {
  white-space: nowrap;
}

[data-view="gifts"] .gift-recipient-picker {
  display: grid;
  grid-template-columns: auto minmax(180px, 1fr) auto;
  gap: 8px;
  align-items: center;
  margin: 18px 0 14px;
  padding: 8px;
  background: #dceaf0;
  border-radius: 12px;
}

[data-view="gifts"] .gift-recipient-picker label {
  padding-left: 8px;
  color: var(--p-blue);
  font-family: "Lora", serif;
  font-style: italic;
}

[data-view="gifts"] .gift-recipient-picker select,
[data-view="gifts"] .gift-recipient-picker button {
  min-height: 44px;
  border: 0;
  border-radius: 8px;
  background: #fffaf7;
}

[data-view="gifts"] .gift-recipient-picker select {
  padding-inline: 12px;
}

[data-view="gifts"] .gift-recipient-picker button {
  padding-inline: 14px;
  color: #fffaf7;
  background: #526d67;
}

/* Reminder rows use hierarchy and spacing instead of urgency stripes. */
[data-view="reminders"] .task-entry {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin: 0 0 9px;
  padding: 17px 18px;
  background: rgba(255, 250, 247, 0.8);
  border: 1px solid rgba(47, 73, 84, 0.12);
  border-radius: 10px;
  box-shadow: 0 8px 18px rgba(47, 73, 84, 0.045);
}

[data-view="reminders"] .task-entry::before {
  display: none !important;
  content: none !important;
}

[data-view="reminders"] .task-entry > div:first-child > strong {
  font-size: 1.08rem;
}

[data-view="reminders"] .task-entry > div:first-child > p {
  margin: 5px 0 0;
}

[data-view="reminders"] .task-entry .task-state {
  align-self: flex-start;
  width: max-content;
  margin-top: 10px;
  padding: 5px 9px;
  color: var(--p-blue);
  font-size: 0.65rem;
  text-transform: none;
  background: #dceaf0;
  border-radius: 999px;
}

[data-view="reminders"] .task-entry.overdue .task-state {
  color: #714858;
  background: #f1dce3;
}

[data-view="reminders"] .task-entry .item-actions {
  display: flex;
  gap: 5px;
}

[data-view="reminders"] .task-entry .item-actions button {
  min-height: 34px;
  padding: 6px 10px;
  background: #fffaf7;
  border: 1px solid rgba(47, 73, 84, 0.16);
  border-radius: 7px;
}

@media (max-width: 900px) {
  [data-view="studio"] .template-rail {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  [data-view="studio"] > .view-header #newInvitation {
    min-height: 44px;
    padding-right: 14px;
  }

  [data-view="studio"] .studio-progress {
    gap: 5px;
  }

  [data-view="studio"] .studio-progress button,
  #invitationPanel[data-studio-stage] .studio-progress [data-studio-stage] {
    flex: 1;
    font-size: 0.9rem;
  }

  [data-view="studio"] .template-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 10px;
  }

  [data-view="studio"] .invitation-draft-bar {
    justify-content: flex-start;
    overflow-x: auto;
  }

  [data-view="gifts"] .gift-assistant-heading {
    display: block;
  }

  [data-view="gifts"] .gift-assistant-heading > button {
    margin-top: 12px;
  }

  [data-view="gifts"] .gift-recipient-picker {
    grid-template-columns: 1fr;
  }

  [data-view="gifts"] .gift-recipient-picker label {
    padding: 4px 4px 0;
  }

  [data-view="reminders"] .task-entry {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  [data-view="reminders"] .task-entry .item-actions {
    justify-content: flex-start;
  }
}

/* Person profiles and the gift-memory deck */
.person-dialog {
  width: min(940px, calc(100vw - 32px));
  max-height: min(900px, calc(100vh - 32px));
  color: var(--p-ink);
  background: var(--p-paper);
  border: 1px solid rgba(47, 73, 84, 0.28);
  border-radius: 10px;
  box-shadow: 0 28px 70px rgba(47, 73, 84, 0.24);
}

.person-dialog::backdrop {
  background: rgba(47, 73, 84, 0.48);
  backdrop-filter: blur(8px);
}

.person-sheet {
  display: flex;
  flex-direction: column;
  background: var(--p-paper);
}

.person-sheet-header {
  order: 0;
  padding: clamp(24px, 4vw, 42px);
  color: #fffaf7;
  background: #2f4954;
  border: 0;
}

.person-sheet-header > div > span {
  width: 76px;
  height: 76px;
  flex-basis: 76px;
  color: var(--p-ink);
  background: #e8c4d1;
  border: 1px solid rgba(255, 250, 247, 0.68);
  font-family: "DM Serif Display", Georgia, serif;
}

.person-sheet-header h2 {
  color: #fffaf7;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: clamp(3rem, 7vw, 5rem);
  font-weight: 400;
  letter-spacing: 0;
}

.person-sheet-header p {
  max-width: 62ch;
  color: rgba(255, 250, 247, 0.7);
  font-family: "DM Sans", sans-serif;
  font-size: 0.72rem;
}

.person-sheet-header > button {
  width: 46px;
  min-height: 46px;
  color: var(--p-ink);
  background: #e8c4d1;
  border: 1px solid rgba(255, 250, 247, 0.58);
  border-radius: 50%;
}

.person-sheet-brief {
  order: 1;
  padding: clamp(24px, 4vw, 38px);
  background: #f1e3e7;
  border: 0;
}

.person-sheet h3,
.past-gift-form h3 {
  color: var(--p-ink);
  font-family: "DM Serif Display", Georgia, serif;
  font-size: clamp(1.65rem, 3vw, 2.3rem);
  font-weight: 400;
  letter-spacing: 0;
}

.person-sheet-brief > p {
  max-width: 50ch;
  color: var(--p-ink);
  font-family: "Lora", Georgia, serif;
  font-size: clamp(1.15rem, 2.2vw, 1.6rem);
  line-height: 1.48;
}

.person-signal-list span {
  color: var(--p-ink);
  background: rgba(255, 250, 247, 0.64);
  border: 1px solid rgba(47, 73, 84, 0.18);
  border-radius: 999px;
  font-size: 0.65rem;
}

.person-profile-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  margin-top: 28px;
  overflow: hidden;
  background: rgba(47, 73, 84, 0.18);
  border: 1px solid rgba(47, 73, 84, 0.18);
  border-radius: 8px;
}

.person-profile-stats > div {
  min-width: 0;
  padding: 18px;
  background: rgba(255, 250, 247, 0.76);
}

.person-profile-stats strong,
.person-profile-stats span {
  display: block;
}

.person-profile-stats strong {
  overflow-wrap: anywhere;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: clamp(1.4rem, 3vw, 2rem);
  font-weight: 400;
  line-height: 1;
}

.person-profile-stats span {
  margin-top: 8px;
  color: #697e84;
  font-size: 0.62rem;
}

.person-history-section {
  order: 2;
  padding: clamp(24px, 4vw, 38px);
  background: #dceaf0;
  border: 0;
}

.person-history-heading {
  margin-bottom: 18px;
}

.person-history-heading h3 {
  margin-bottom: 0;
}

.person-history-heading > span {
  color: #697e84;
  font-family: "DM Sans", sans-serif;
  font-size: 0.68rem;
}

.person-history-deck {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  align-items: center;
  gap: 14px;
}

.person-history-deck:has(.person-history-nav[hidden]) {
  grid-template-columns: minmax(0, 1fr);
}

.person-history-nav {
  width: 44px;
  height: 44px;
  padding: 0;
  color: var(--p-ink);
  background: rgba(255, 250, 247, 0.76);
  border: 1px solid rgba(47, 73, 84, 0.25);
  border-radius: 50%;
  font-size: 1.15rem;
}

.person-history-nav:hover {
  color: #fffaf7;
  background: #526d67;
  border-color: #526d67;
}

.person-history {
  min-width: 0;
}

.person-history-card,
.person-history-empty {
  min-height: 260px;
  padding: clamp(22px, 4vw, 34px);
  color: var(--p-ink);
  background: rgba(255, 250, 247, 0.9);
  border: 1px solid rgba(47, 73, 84, 0.2);
  border-radius: 8px;
}

.person-history-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.person-history-card > header,
.person-history-card > footer,
.person-history-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.person-history-card time {
  color: #697e84;
  font-family: "Lora", Georgia, serif;
  font-size: 0.76rem;
  font-style: italic;
}

.person-history-card-copy > span {
  display: block;
  margin-bottom: 7px;
  color: #697e84;
  font-size: 0.65rem;
}

.person-history-card-copy > strong {
  display: block;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 400;
  line-height: 1;
}

.person-history-card-copy > p {
  max-width: 52ch;
  margin: 14px 0 0;
  color: #52666d;
  font-family: "Lora", Georgia, serif;
  font-size: 0.85rem;
  line-height: 1.55;
}

.person-history-card > footer {
  margin-top: 24px;
  color: #697e84;
  font-size: 0.66rem;
}

.person-history-delete {
  width: auto;
  height: auto;
  padding: 7px 10px;
  color: #8b5e68;
  background: transparent;
  border: 1px solid rgba(139, 94, 104, 0.28);
  border-radius: 999px;
  font-size: 0.62rem;
}

.person-history-empty {
  display: grid;
  align-content: center;
  justify-items: center;
  text-align: center;
}

.person-history-empty strong {
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.8rem;
  font-weight: 400;
}

.person-history-empty p {
  max-width: 42ch;
  margin: 10px 0 0;
  color: #697e84;
  font-size: 0.72rem;
}

.person-history-pagination {
  margin-top: 14px;
  color: #697e84;
  font-size: 0.64rem;
}

.person-history-dots {
  display: flex;
  align-items: center;
  gap: 7px;
}

.person-history-dots button {
  width: 7px;
  height: 7px;
  min-height: 7px;
  padding: 0;
  background: rgba(47, 73, 84, 0.24);
  border: 0;
  border-radius: 50%;
}

.person-history-dots button.active {
  width: 22px;
  background: #526d67;
  border-radius: 999px;
}

.person-profile-editor {
  order: 3;
  background: rgba(255, 250, 247, 0.76);
}

.person-gift-logger {
  order: 4;
  background: #f3e2e7;
}

.person-profile-editor > summary,
.person-gift-logger > summary {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 22px clamp(24px, 4vw, 38px);
  color: var(--p-ink);
  cursor: pointer;
  list-style: none;
  border-bottom: 1px solid rgba(47, 73, 84, 0.16);
}

.person-profile-editor > summary::-webkit-details-marker,
.person-gift-logger > summary::-webkit-details-marker {
  display: none;
}

.person-profile-editor > summary::after,
.person-gift-logger > summary::after {
  content: "+";
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  color: #fffaf7;
  background: #526d67;
  border-radius: 50%;
  font-size: 1rem;
}

.person-profile-editor[open] > summary::after,
.person-gift-logger[open] > summary::after {
  content: "−";
}

.person-profile-editor > summary span,
.person-gift-logger > summary span {
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.35rem;
}

.person-profile-editor > summary small,
.person-gift-logger > summary small {
  margin-left: auto;
  color: #697e84;
  font-size: 0.64rem;
}

.person-company-form {
  padding: clamp(24px, 4vw, 38px);
  background: transparent;
  border: 0;
}

.person-important-dates {
  padding: clamp(24px, 4vw, 38px);
  background: #e9f0e9;
  border: 0;
}

.past-gift-form {
  grid-template-columns: minmax(170px, 1.3fr) minmax(140px, 1fr) 80px 90px minmax(120px, 0.8fr);
  background: transparent;
  border: 0;
}

.person-sheet-footer {
  order: 5;
  background: var(--p-paper);
}

@media (max-width: 620px) {
  .person-dialog {
    width: calc(100vw - 16px);
    max-height: calc(100vh - 16px);
  }

  .person-sheet-header,
  .person-sheet-brief,
  .person-history-section,
  .person-company-form,
  .person-important-dates,
  .past-gift-form,
  .person-sheet-footer {
    padding: 22px 18px;
  }

  .person-sheet-header > div {
    align-items: flex-start;
  }

  .person-sheet-header > div > span {
    width: 52px;
    height: 52px;
    flex-basis: 52px;
  }

  .person-profile-stats {
    grid-template-columns: 1fr 1fr;
  }

  .person-profile-editor > summary,
  .person-gift-logger > summary {
    padding: 18px;
  }

  .person-profile-editor > summary small,
  .person-gift-logger > summary small {
    display: none;
  }

  .person-history-deck {
    position: relative;
    display: block;
  }

  .person-history-nav {
    position: absolute;
    z-index: 2;
    top: 50%;
    width: 38px;
    height: 38px;
    transform: translateY(-50%);
  }

  #personHistoryPrevious { left: -8px; }
  #personHistoryNext { right: -8px; }

  .person-history-card,
  .person-history-empty {
    min-height: 300px;
    padding: 24px;
  }

  .past-gift-form {
    grid-template-columns: 1fr;
  }

  .past-gift-form > * {
    grid-column: 1;
  }

  .person-history-deck:has(.person-history-nav:not([hidden])) .person-history-card {
    padding-inline: 40px;
  }
}

/* Rolling navigation and the relationship-first home */
.nav-list {
  gap: 7px;
  padding: 0;
  background: transparent;
  border-radius: 0;
  perspective: 600px;
}

.nav-list a,
.nav-list a:hover,
.nav-list a.active {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 40px;
  padding: 0 17px;
  overflow: hidden;
  color: #617881;
  background: #e4eff3;
  border: 1px solid rgba(47, 73, 84, 0.12);
  border-radius: 7px;
  box-shadow: none;
  text-decoration: none !important;
}

.nav-list a::before,
.nav-list a::after {
  display: none !important;
  content: none !important;
}

.nav-list a > span {
  position: relative;
  display: block;
  width: 100%;
  color: inherit;
  font-family: "DM Sans", sans-serif;
  font-size: 0.72rem;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  transform-style: preserve-3d;
  transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.nav-list a > span::after {
  position: absolute;
  top: calc(100% + 14px);
  left: 0;
  width: 100%;
  content: attr(data-label);
  color: inherit;
  transform: rotateX(-55deg);
  transform-origin: 50% 0;
}

.nav-list a:hover > span,
.nav-list a:focus-visible > span {
  transform: translateY(calc(-100% - 14px)) rotateX(8deg);
}

.nav-list a.active {
  color: #fffaf7;
  background: #526d67;
  border-color: #526d67;
}

[data-view="dashboard"] .stats-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  padding: 0;
  background: transparent;
  border: 0;
}

[data-view="dashboard"] .stats-grid::before,
[data-view="dashboard"] .stats-grid::after {
  display: none !important;
  content: none !important;
}

.stat-collection {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(47, 73, 84, 0.18);
  border-radius: 8px;
}

.personal-stats { background: #efdce2; }
.business-stats { background: #dceaf0; }

.stat-collection > header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 20px 14px;
}

.stat-collection > header h2 {
  margin: 0;
  font-size: clamp(1.65rem, 2.8vw, 2.25rem);
  line-height: 1;
}

.stat-collection > header span {
  color: #697e84;
  font-size: 0.64rem;
}

.stat-collection-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  background: rgba(47, 73, 84, 0.15);
  gap: 1px;
  border-top: 1px solid rgba(47, 73, 84, 0.15);
}

.stat-collection-grid > div {
  min-width: 0;
  padding: 17px 18px 19px;
  background: rgba(255, 250, 247, 0.68);
}

.stat-collection-grid strong,
.stat-collection-grid span {
  display: block;
}

.stat-collection-grid strong {
  color: var(--p-ink);
  font-family: "DM Serif Display", Georgia, serif;
  font-size: clamp(1.65rem, 3vw, 2.3rem);
  font-weight: 400;
  line-height: 1;
  overflow-wrap: anywhere;
}

.stat-collection-grid span {
  margin-top: 8px;
  color: #697e84;
  font-size: 0.6rem;
  line-height: 1.3;
}

[data-view="dashboard"] .focus-panel {
  color: var(--p-ink);
  background: #dceaf0;
  border-color: rgba(47, 73, 84, 0.22);
}

[data-view="dashboard"] .focus-panel :is(h2, strong) {
  color: var(--p-ink);
}

[data-view="dashboard"] .focus-panel :is(p, span, small) {
  color: #617881;
}

.occasion-orbit,
.next-up-list {
  display: grid;
  gap: 8px;
  width: 100%;
}

.next-up-card {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  width: 100%;
  min-height: 76px;
  padding: 11px 13px;
  color: var(--p-ink);
  text-align: left;
  background: rgba(255, 250, 247, 0.76);
  border: 1px solid rgba(47, 73, 84, 0.14);
  border-radius: 7px;
  box-shadow: none;
}

.next-up-card:nth-child(2n) { background: rgba(241, 227, 231, 0.86); }
.next-up-card:hover,
.next-up-card.selected {
  color: var(--p-ink);
  background: #fffaf7;
  border-color: #8ba2aa;
  transform: translateX(3px);
}

.next-up-card > time {
  display: grid;
  place-items: center;
  align-self: stretch;
  color: var(--p-ink);
  background: #e8c4d1;
  border-radius: 6px;
}

.next-up-card > time strong,
.next-up-card > time span {
  display: block;
  color: inherit !important;
  line-height: 1;
}

.next-up-card > time strong {
  align-self: end;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.55rem;
  font-weight: 400;
}

.next-up-card > time span {
  align-self: start;
  margin-top: 4px;
  font-size: 0.54rem;
}

.next-up-copy,
.next-up-status {
  min-width: 0;
}

.next-up-copy strong,
.next-up-copy small,
.next-up-status strong,
.next-up-status small,
.next-up-status em {
  display: block;
}

.next-up-copy strong {
  overflow: hidden;
  font-family: "DM Sans", sans-serif;
  font-size: 0.76rem;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.next-up-copy small {
  margin-top: 5px;
  color: #697e84;
  font-size: 0.57rem;
}

.next-up-status {
  text-align: right;
}

.next-up-status strong {
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.35rem;
  font-weight: 400;
  line-height: 1;
}

.next-up-status small {
  margin-top: 2px;
  font-size: 0.52rem;
}

.next-up-status em {
  margin-top: 7px;
  color: #526d67;
  font-size: 0.52rem;
  font-style: normal;
}

.risk-queue {
  display: grid;
  gap: 8px;
}

.risk-row,
.risk-row:hover,
.risk-row:last-child {
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  min-height: 72px;
  padding: 10px 12px;
  color: var(--p-ink);
  text-align: left;
  background: rgba(255, 250, 247, 0.76);
  border: 1px solid rgba(47, 73, 84, 0.13);
  border-radius: 7px;
}

.risk-row:hover {
  background: #fffaf7;
  border-color: #8ba2aa;
  transform: translateX(3px);
}

.risk-mark {
  display: none !important;
}

.risk-when {
  display: grid;
  place-items: center;
  align-self: stretch;
  background: #f1e3e7;
  border-radius: 6px;
}

.risk-when strong,
.risk-when small,
.risk-copy strong,
.risk-copy small {
  display: block;
}

.risk-when strong {
  align-self: end;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1;
}

.risk-when small {
  align-self: start;
  margin-top: 4px;
  color: #8b5e68;
  font-size: 0.5rem;
}

.risk-copy strong {
  color: var(--p-ink);
  font-family: "DM Sans", sans-serif;
  font-size: 0.72rem;
  font-weight: 650;
}

.risk-copy small {
  margin-top: 5px;
  color: #697e84;
  font-size: 0.56rem;
}

.risk-scope {
  padding: 6px 8px;
  color: var(--p-ink);
  background: #dceaf0;
  border-radius: 999px;
  font-size: 0.54rem;
}

.add-person-drawer {
  margin: 0 16px 14px;
  overflow: hidden;
  background: #f1e3e7;
  border: 1px solid rgba(47, 73, 84, 0.16);
  border-radius: 8px;
}

.add-person-drawer:not([open]) {
  display: none;
}

.add-person-drawer > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  color: var(--p-ink);
  cursor: pointer;
  list-style: none;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.25rem;
}

.add-person-drawer > summary::-webkit-details-marker { display: none; }
.add-person-drawer > summary::after { content: "×"; font-family: "DM Sans", sans-serif; }

.add-person-drawer form {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr)) auto;
  gap: 10px;
  align-items: end;
  padding: 0 16px 16px;
}

.add-person-drawer label {
  min-width: 0;
  color: #617881;
  font-size: 0.58rem;
}

.add-person-drawer input {
  width: 100%;
  min-width: 0;
  margin-top: 6px;
}

.directory-tools #addPersonToggle {
  color: #fffaf7;
  background: #526d67;
  border-color: #526d67;
}

@media (max-width: 900px) {
  .stat-collection-grid {
    grid-template-columns: 1fr 1fr;
  }

  .add-person-drawer form {
    grid-template-columns: 1fr 1fr;
  }

  .add-person-drawer form > button {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  .nav-list {
    gap: 5px;
    background: transparent;
  }

  .nav-list a,
  .nav-list a:hover,
  .nav-list a.active {
    min-height: 42px;
    padding-inline: 5px;
  }

  .nav-list a > span {
    font-size: 0.64rem;
  }

  [data-view="dashboard"] .stats-grid {
    grid-template-columns: 1fr;
  }

  .stat-collection > header {
    padding: 16px;
  }

  .stat-collection-grid > div {
    padding: 15px 16px;
  }

  .next-up-card {
    grid-template-columns: 48px minmax(0, 1fr) 48px;
  }

  .risk-row,
  .risk-row:hover,
  .risk-row:last-child {
    grid-template-columns: 58px minmax(0, 1fr);
  }

  .risk-scope {
    grid-column: 2;
    justify-self: start;
  }

  .add-person-drawer {
    margin-inline: 12px;
  }

  .add-person-drawer form {
    grid-template-columns: 1fr;
  }

  .add-person-drawer form > button {
    grid-column: 1;
  }
}

/* Calm editorial structure with the product's own palette. */
:root {
  --p-bg: #f8f2ee;
  --p-surface: #fffaf7;
  --p-ink: #2f4954;
  --p-muted: #77868a;
  --p-line: #c9dce3;
  --p-blue: #5e8190;
  --p-blue-soft: #dceaf0;
  --p-acid: #e8c4d1;
  --p-coral: #c97f89;
  --p-pink: #efd4dd;
  --p-mint: #dce7dc;
  --p-lilac: #e7dfea;
  --paper: #f8f2ee;
  --paper-soft: #f1e8e3;
  --paper-bright: #fffaf7;
  --cream: #fffaf7;
  --ink: #2f4954;
  --muted: #77868a;
  --quiet: #9aabb0;
  --line: rgba(92, 126, 140, 0.18);
  --line-strong: rgba(92, 126, 140, 0.34);
  --moss: #8aa090;
  --moss-deep: #526d67;
  --sage: #dce7dc;
  --sage-wash: #e9f0e9;
  --blush: #e8c4d1;
  --rose: #b87586;
  --butter: #ecd8aa;
  --sky: #c9dce3;
  --sky-wash: #e4eff3;
  --chapter-wine: #2f4954;
  --chapter-butter: #ecd8aa;
  --chapter-sage: #dce7dc;
  --editorial-cream: #fffaf7;
  --editorial-blue: #dceaf0;
  --editorial-green: #dce7dc;
  --editorial-pink: #efd4dd;
  --editorial-wine: #526d67;
  --editorial-gold: #c7a66a;
  --shell-blue: #dceaf0;
  --shell-coral: #efd4dd;
  --shell-lilac: #e7dfea;
  --shell-lime: #dce7dc;
  --control-paper: #fffaf7;
  --control-mist: #edf3f4;
  --control-ink: #2f4954;
  --control-wine: #9d6174;
  --control-line: rgba(92, 126, 140, 0.2);
  --control-line-strong: rgba(92, 126, 140, 0.38);
  --control-shadow: 0 16px 44px rgba(47, 73, 84, 0.08);
  --shadow: 0 18px 56px rgba(47, 73, 84, 0.08);
}

html,
body {
  color: var(--p-ink);
  background: var(--p-bg);
}

body,
button,
input,
select,
textarea {
  font-family: "DM Sans", "Helvetica Neue", Arial, sans-serif;
}

.sidebar {
  min-height: 72px;
  padding-inline: clamp(20px, 4vw, 64px);
  color: var(--p-ink);
  background: rgba(248, 242, 238, 0.94);
  border-bottom: 1px solid rgba(126, 161, 175, 0.3);
  box-shadow: 0 12px 34px rgba(47, 73, 84, 0.045);
  backdrop-filter: blur(22px);
}

.brand {
  gap: 11px;
}

.brand-mark {
  position: relative;
  width: 27px;
  height: 27px;
  flex-basis: 27px;
  background: transparent;
  border: 1px solid #b87586;
  border-radius: 58% 42% 55% 45%;
  transform: rotate(18deg);
}

.brand-mark::before {
  position: absolute;
  inset: 5px;
  content: "";
  border: 1px solid #8ba9b5;
  border-radius: 43% 57% 46% 54%;
  transform: rotate(34deg);
}

.brand-mark::after {
  display: none;
}

.brand strong {
  color: var(--p-ink);
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.65rem;
  font-style: italic;
  font-weight: 400;
}

.nav-list {
  gap: 4px;
  padding: 4px;
  background: rgba(220, 234, 240, 0.55);
  border: 0;
  border-radius: 7px;
}

.nav-list a {
  min-height: 34px;
  padding: 8px 15px;
  color: #617881;
  font-size: 0.72rem;
  font-weight: 500;
  background: transparent;
  border: 0;
  border-radius: 5px;
}

.nav-list a:hover {
  color: var(--p-ink);
  background: rgba(255, 250, 247, 0.64);
}

.nav-list a.active {
  color: var(--p-ink);
  background: var(--p-surface);
  box-shadow: 0 2px 10px rgba(47, 73, 84, 0.07);
}

.mini-panel {
  color: var(--p-ink);
}

.mini-panel select {
  color: var(--p-ink);
  background: rgba(255, 250, 247, 0.72);
  border-color: rgba(92, 126, 140, 0.24);
}

.workspace {
  width: min(100%, 1500px);
  padding-top: clamp(34px, 4.2vw, 64px);
}

.product-view:not([hidden]) > .view-header {
  min-height: 82px;
  margin-bottom: clamp(28px, 4vw, 44px);
}

.product-view:not([hidden]) > .view-header h1 {
  color: var(--p-ink);
  font-family: "DM Serif Display", Georgia, serif;
  font-size: clamp(4rem, 6.2vw, 6.3rem) !important;
  font-weight: 400;
  line-height: 0.88;
}

.product-view:not([hidden]) h2 {
  color: var(--p-ink);
  font-family: "DM Serif Display", Georgia, serif !important;
  font-weight: 400;
}

.product-view:not([hidden]) h3:not(.invite-preview h3):not(.three-invitation h3) {
  color: var(--p-ink);
  font-family: "DM Sans", sans-serif;
  font-weight: 600;
}

[data-view="gifts"] .recipient-workbench {
  display: grid !important;
  grid-template-columns: minmax(190px, 0.72fr) minmax(0, 1.28fr) !important;
  gap: 10px !important;
  align-items: start !important;
}

[data-view="gifts"] .recipient-profile-form,
[data-view="gifts"] .gift-readout {
  min-height: 0 !important;
}

[data-view="gifts"] .recipient-profile-form:not([open]) {
  align-self: start !important;
  height: auto !important;
}

[data-view="gifts"] #recipientProfilePanel > summary {
  min-height: 72px;
  padding: 16px !important;
}

[data-view="gifts"] .gift-readout {
  padding: 18px !important;
}

@media (max-width: 1050px) {
  [data-view="dashboard"] .visual-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
  }

  [data-view="dashboard"] .calendar-panel,
  [data-view="dashboard"] .focus-panel {
    width: 100%;
    border: 1px solid rgba(47, 73, 84, 0.24) !important;
    border-radius: 10px !important;
  }

  [data-view="dashboard"] .focus-panel {
    min-height: 260px;
  }
}

.product-view:not([hidden]) :is(p, dd, .comparison-empty) {
  line-height: 1.55;
}

.view-header .primary-action,
.view-header > button,
.view-header #newInvitation,
.primary-action {
  color: #fffaf7;
  background: var(--p-ink);
  border: 1px solid var(--p-ink);
  border-radius: 5px;
  box-shadow: none;
}

.view-header .primary-action:hover,
.view-header > button:hover,
.view-header #newInvitation:hover,
.primary-action:hover {
  color: var(--p-ink);
  background: var(--p-pink);
  border-color: #b87586;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 2px solid #b87586;
  outline-offset: 3px;
}

.product-view:not([hidden]) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), select, textarea) {
  color: var(--p-ink);
  background: rgba(255, 250, 247, 0.76);
  border: 1px solid rgba(92, 126, 140, 0.22);
  border-radius: 6px;
}

.product-view:not([hidden]) :is(input, textarea)::placeholder {
  color: #9babad;
}

.panel,
.program-panel,
.people-directory,
.gift-feed-card,
.comparison-card,
.recipient-profile-form,
.gift-readout {
  border-color: rgba(92, 126, 140, 0.22);
  box-shadow: 0 12px 34px rgba(47, 73, 84, 0.045);
}

/* Home */
[data-view="dashboard"] .calendar-panel {
  background: var(--p-surface);
}

[data-view="dashboard"] .focus-panel {
  color: #fffaf7;
  background: #526d67;
  border-color: #526d67;
}

[data-view="dashboard"] .focus-panel :is(h2, strong) {
  color: #fffaf7;
}

[data-view="dashboard"] .focus-panel :is(p, span) {
  color: rgba(255, 250, 247, 0.72);
}

[data-view="dashboard"] .stat-card:nth-child(1) { background: #e6eff2; }
[data-view="dashboard"] .stat-card:nth-child(2) { background: #efdce2; }
[data-view="dashboard"] .stat-card:nth-child(3) { background: #e7eee7; }
[data-view="dashboard"] .stat-card:nth-child(4) { background: #f2e5c8; }

[data-view="dashboard"] .stat-card :is(strong, span),
[data-view="dashboard"] .stat-card.accent :is(strong, span) {
  color: var(--p-ink);
}

[data-view="dashboard"] .people-directory {
  background: rgba(255, 250, 247, 0.54);
}

.person-row,
.person-row:hover {
  background: rgba(255, 250, 247, 0.8);
}

.person-row.selected {
  background: #dceaf0;
}

[data-view="dashboard"] .coverage-panel { background: #dce7dc !important; }
[data-view="dashboard"] .spend-panel { background: #f3e2e7 !important; }
[data-view="dashboard"] .risk-panel { background: #dceaf0 !important; }

[data-view="dashboard"] .event-room-drawer > summary {
  color: #fffaf7;
  background: #2f4954;
  border-color: #2f4954;
}

[data-view="dashboard"] .event-room-drawer > summary::after {
  color: var(--p-ink);
  background: #e8c4d1;
}

[data-view="dashboard"] .planner-panel {
  background: rgba(255, 250, 247, 0.72);
}

[data-view="dashboard"] .form-panel {
  background: #e4eff3;
}

/* Invitation studio */
[data-view="studio"] .studio-progress {
  background: #e4eff3;
}

[data-view="studio"] .studio-progress button.active {
  color: #fffaf7;
  background: #526d67;
}

[data-view="studio"] #newInvitation,
[data-view="studio"] #generateDraft,
[data-view="studio"] .studio-progress button.active,
[data-view="studio"] .studio-mode-bar .segmented-control button.active {
  color: #fffaf7 !important;
  background: #526d67 !important;
  border-color: #526d67 !important;
  box-shadow: none !important;
}

[data-view="studio"] #newInvitation:hover,
[data-view="studio"] #generateDraft:hover {
  color: var(--p-ink) !important;
  background: #e8c4d1 !important;
  border-color: #b87586 !important;
}

[data-view="studio"] .template-browser,
[data-view="studio"] .designer-tools {
  background: rgba(255, 250, 247, 0.72);
}

[data-view="studio"] .template-rail {
  background: #eef3f4;
}

[data-view="studio"] .canvas-stage {
  background: #dceaf0;
}

[data-view="studio"] .studio-look-brief {
  background: #f1e3e7;
}

[data-view="studio"] .control-section > summary {
  color: var(--p-ink);
  background: #edf3f4;
}

[data-view="studio"] .control-section[open] > summary {
  color: #fffaf7;
  background: #526d67;
}

[data-view="studio"] .template-option.active {
  background: #fffaf7;
  box-shadow: inset 0 -3px #b87586;
}

/* Gifts */
[data-view="gifts"] .gift-assistant-heading,
[data-view="gifts"] .gift-chat-form {
  color: #fffaf7;
  background-color: #2f4954;
}

[data-view="gifts"] .gift-chat-prompts,
[data-view="gifts"] .gift-chat {
  background: rgba(255, 250, 247, 0.78);
}

[data-view="gifts"] .recipient-profile-form {
  background: #f1e8e3;
}

[data-view="gifts"] .gift-readout {
  color: var(--p-ink);
  background: #dceaf0;
}

[data-view="gifts"] .gift-readout :is(h2, strong, p, span) {
  color: inherit;
}

[data-view="gifts"] .gift-feed-card {
  background: #fffaf7;
  border: 1px solid rgba(92, 126, 140, 0.22);
  border-radius: 8px;
}

[data-view="gifts"] .gift-feed-card:nth-child(3n + 2) { background: #dceaf0; }
[data-view="gifts"] .gift-feed-card:nth-child(3n) { background: #dce7dc; }

[data-view="gifts"] .comparison-card:nth-child(1) { background: #fffaf7; }
[data-view="gifts"] .comparison-card:nth-child(2) { background: #e9f0e9; }
[data-view="gifts"] .comparison-card:nth-child(3) { background: #f1e3e7; }

[data-view="gifts"] .gift-entry,
[data-view="gifts"] .item-card {
  background: rgba(255, 250, 247, 0.62);
}

[data-view="gifts"] .gift-journal {
  background: #efdce2;
}

[data-view="gifts"] .manual-gift-drawer {
  color: #fffaf7;
  background: #526d67;
}

[data-view="gifts"] .inspiration-inbox {
  background: #dceaf0;
}

/* Reminders */
[data-view="reminders"] .reminder-overview {
  background: #2f4954;
  border-color: #2f4954;
}

[data-view="reminders"] .reminder-overview :is(strong, span) {
  color: #fffaf7;
}

[data-view="reminders"] .reminder-layout {
  border-color: rgba(92, 126, 140, 0.24);
  box-shadow: 0 16px 40px rgba(47, 73, 84, 0.055);
}

[data-view="reminders"] .reminder-layout .people-panel {
  background: #fffaf7;
  border-color: rgba(92, 126, 140, 0.22);
}

[data-view="reminders"] .reminder-layout .reminder-panel {
  color: var(--p-ink);
  background: #dceaf0;
}

[data-view="reminders"] .timeline-item {
  background: rgba(255, 250, 247, 0.68);
}

@media (max-width: 700px) {
  .sidebar {
    padding: 10px 14px 8px;
    background: rgba(248, 242, 238, 0.97);
  }

  .brand strong {
    font-size: 1.35rem;
  }

  .nav-list {
    width: 100%;
    gap: 3px;
    background: #dceaf0;
  }

  .nav-list a {
    flex: 1 1 0;
    padding-inline: 5px;
    text-align: center;
  }

  .product-view:not([hidden]) > .view-header h1 {
    font-size: clamp(3.2rem, 14vw, 4.15rem) !important;
  }

  [data-view="dashboard"] .focus-panel {
    background: #526d67;
  }
}
/* Gift ideas read like products: name, explanation, then price. */
[data-view="gifts"] .gift-feed-card-copy > strong {
  order: 1;
  margin: 0;
  font-size: 1.4rem;
  line-height: 1.08;
}

[data-view="gifts"] .gift-feed-card-copy > p {
  order: 2;
  margin: 0.55rem 0 0.8rem;
}

[data-view="gifts"] .gift-feed-card-copy > .gift-feed-price {
  order: 3;
  margin: 0 0 0.9rem;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 600;
}

[data-view="gifts"] .gift-feed-card-copy > div {
  order: 4;
}

/* Product-wide rhythm and record hierarchy. */
.product-view:not([hidden]) {
  overflow-x: clip;
}

.product-view:not([hidden]) > * {
  min-width: 0;
}

.product-view:not([hidden]) :is(h1, h2, h3) {
  overflow-wrap: break-word;
}

[data-view="dashboard"] .dashboard-planner {
  align-items: start;
  margin-bottom: 0;
}

[data-view="dashboard"] .dashboard-planner > :is(.planner-panel, .form-panel) {
  align-self: start;
  height: auto;
  min-height: 0;
}

/* Every content card starts with its subject, then explanation, then metadata. */
.best-gift-read,
.inspiration-copy,
.gift-entry-copy,
.task-entry > div:first-child {
  display: flex;
  flex-direction: column;
}

.best-gift-read > strong,
.inspiration-copy > strong,
.gift-entry-copy > strong,
.task-entry > div:first-child > strong {
  order: 1;
  margin-top: 0;
}

.best-gift-read > p,
.inspiration-copy > p,
.gift-entry-copy > p,
.task-entry > div:first-child > p {
  order: 2;
}

.gift-entry-copy > .personalization-line {
  order: 3;
}

.best-gift-read > span,
.inspiration-copy > span,
.gift-entry-copy > .gift-entry-meta,
.task-entry .task-state {
  order: 4;
  margin: 0.65rem 0 0;
  color: var(--muted);
  font-size: 0.66rem;
  line-height: 1.35;
}

.task-entry .task-state {
  display: block;
  margin-bottom: 0;
}

[data-view="gifts"] .comparison-title strong {
  display: block;
  margin: 0;
}

[data-view="gifts"] .comparison-facts {
  margin-top: 0.8rem;
}

[data-view="gifts"] .gift-shortlist,
[data-view="gifts"] .gift-list-section,
[data-view="gifts"] .gift-journal {
  margin-top: clamp(1.75rem, 3vw, 2.25rem);
}

[data-view="gifts"] .gift-shortlist {
  padding-bottom: 0;
}

[data-view="gifts"] .shortlist-heading {
  margin-bottom: 0.75rem;
}

[data-view="gifts"] .comparison-empty {
  padding: 14px 16px;
}

[data-view="gifts"] .gift-list-section > h2 {
  padding-bottom: 12px;
}

[data-view="gifts"] .gift-entry {
  min-height: 0;
  padding-block: 18px;
}

[data-view="gifts"] .gift-entry-copy > strong {
  margin-bottom: 0.45rem;
}

[data-view="gifts"] .gift-entry-copy > p {
  margin-bottom: 0.35rem;
}

[data-view="gifts"] .manual-gift-drawer,
[data-view="gifts"] .inspiration-inbox {
  min-width: 0;
}

@media (max-width: 700px) {
  [data-view="gifts"] .gift-panel {
    gap: 0;
  }

  [data-view="gifts"] :is(.gift-shortlist, .gift-list-section, .gift-journal) {
    margin-top: 1.75rem;
  }

  [data-view="gifts"] :is(.manual-gift-drawer, .inspiration-inbox) {
    align-self: stretch;
    width: 100%;
  }

  [data-view="studio"] .invite-preview h3 {
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: clamp(2.8rem, 15vw, 3.75rem) !important;
  }
}

/* Final workflow overrides: keep these after the inherited design layers. */
[data-view="studio"] > .view-header #newInvitation {
  display: inline-flex !important;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 8px 18px 8px 10px !important;
  border-radius: 999px !important;
}

[data-view="studio"] > .view-header #newInvitation::before {
  position: static !important;
  display: grid !important;
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
  place-items: center;
  color: var(--p-blue) !important;
  content: "+" !important;
  font: 400 1.35rem/1 "DM Sans", sans-serif !important;
  background: #fffaf7 !important;
  border: 0 !important;
  border-radius: 50% !important;
  transform: none !important;
}

[data-view="studio"] .studio-progress {
  display: flex !important;
  width: 100% !important;
  justify-content: center !important;
  gap: clamp(18px, 7vw, 72px) !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

[data-view="studio"] .studio-progress button,
#invitationPanel[data-studio-stage] .studio-progress [data-studio-stage] {
  min-height: 42px !important;
  padding: 6px 12px !important;
  color: rgba(47, 73, 84, 0.52) !important;
  font-family: "Lora", serif !important;
  font-size: 1rem !important;
  font-style: italic;
  font-weight: 500 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 999px !important;
}

[data-view="studio"] .studio-progress button::before,
[data-view="studio"] .studio-progress button::after {
  display: none !important;
  content: none !important;
}

#invitationPanel[data-studio-stage="look"] .studio-progress [data-studio-stage="look"],
#invitationPanel[data-studio-stage="details"] .studio-progress [data-studio-stage="details"],
#invitationPanel[data-studio-stage="share"] .studio-progress [data-studio-stage="share"] {
  color: var(--p-blue) !important;
  background: #dceaf0 !important;
}

[data-view="studio"] .studio-mode-bar {
  display: block !important;
  width: 100% !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  border: 0 !important;
}

[data-view="studio"] .studio-mode-bar .segmented-control {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  width: 100% !important;
  padding: 5px !important;
  background: #dceaf0 !important;
  border: 0 !important;
  border-radius: 12px !important;
}

[data-view="studio"] .studio-mode-bar .segmented-control button {
  min-height: 48px !important;
  font-family: "DM Serif Display", serif;
  font-size: 1.08rem;
  border-radius: 8px !important;
}

[data-view="studio"] .invitation-draft-bar {
  display: flex !important;
  justify-content: center !important;
  gap: 7px !important;
  width: 100% !important;
  margin: 0 auto 24px !important;
  padding: 5px !important;
  text-align: center;
  color: var(--p-blue) !important;
  background: transparent !important;
  border: 0 !important;
}

[data-view="studio"] .invitation-draft-bar > span {
  align-self: center;
  margin-right: 3px;
  color: var(--muted) !important;
  font-family: "Lora", serif;
  font-size: 0.8rem;
  font-style: italic;
}

[data-view="studio"] .invitation-draft-bar button {
  min-height: 36px;
  padding: 7px 12px !important;
  background: #f1ebe7 !important;
  border: 0 !important;
  border-radius: 999px !important;
}

[data-view="studio"] .invitation-draft-bar button.active {
  color: #fffaf7 !important;
  background: #526d67 !important;
}

[data-view="studio"] .template-browser-heading,
[data-view="studio"] .template-filters {
  justify-content: center !important;
  text-align: center;
}

[data-view="studio"] .template-rail {
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-flow: row !important;
  grid-auto-columns: auto !important;
  gap: 10px !important;
  margin: 16px 0 12px !important;
  padding: 16px !important;
  overflow: visible !important;
  background: #dceaf0 !important;
  border: 0 !important;
  border-radius: 12px !important;
}

[data-view="studio"] .template-choice {
  min-width: 0 !important;
  width: 100% !important;
  transform: none !important;
}

[data-view="studio"] .template-more {
  display: block;
  margin: 0 auto 26px;
  padding: 9px 15px;
  color: var(--p-blue);
  background: transparent;
  border: 1px solid rgba(47, 73, 84, 0.25);
  border-radius: 999px;
}

[data-view="studio"] .template-more[hidden] { display: none; }

[data-view="gifts"] .gift-assistant-heading h2 { white-space: nowrap; }

[data-view="gifts"] .gift-recipient-picker {
  display: grid;
  grid-template-columns: auto minmax(180px, 1fr) auto;
  gap: 8px;
  align-items: center;
  margin: 18px 0 14px;
  padding: 8px;
  background: #dceaf0;
  border-radius: 12px;
}

[data-view="gifts"] .gift-recipient-picker label {
  padding-left: 8px;
  color: var(--p-blue);
  font-family: "Lora", serif;
  font-style: italic;
}

[data-view="gifts"] .gift-recipient-picker :is(select, button) {
  min-height: 44px;
  border: 0;
  border-radius: 8px;
}

[data-view="gifts"] .gift-recipient-picker select { padding-inline: 12px; background: #fffaf7; }
[data-view="gifts"] .gift-recipient-picker button { padding-inline: 14px; color: #fffaf7; background: #526d67; }

[data-view="reminders"] .task-entry {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin: 0 0 9px;
  padding: 17px 18px !important;
  background: rgba(255, 250, 247, 0.82);
  border: 1px solid rgba(47, 73, 84, 0.12) !important;
  border-radius: 10px;
  box-shadow: 0 8px 18px rgba(47, 73, 84, 0.045);
}

[data-view="reminders"] .task-entry::before { display: none !important; content: none !important; }
[data-view="reminders"] .task-entry > div:first-child > p { margin: 5px 0 0; }

[data-view="reminders"] .task-entry .task-state {
  width: max-content;
  margin-top: 10px;
  padding: 5px 9px;
  color: var(--p-blue);
  font-size: 0.65rem;
  text-transform: none;
  background: #dceaf0;
  border-radius: 999px;
}

[data-view="reminders"] .task-entry.overdue .task-state { color: #714858; background: #f1dce3; }
[data-view="reminders"] .task-entry .item-actions { display: flex; gap: 5px; }
[data-view="reminders"] .task-entry .item-actions button { min-height: 34px; padding: 6px 10px; background: #fffaf7; border: 1px solid rgba(47, 73, 84, 0.16); border-radius: 7px; }

@media (max-width: 900px) {
  [data-view="studio"] .template-rail { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  [data-view="studio"] .studio-progress { gap: 4px !important; }
  [data-view="studio"] .studio-progress button,
  #invitationPanel[data-studio-stage] .studio-progress [data-studio-stage] { flex: 1; font-size: 0.88rem !important; padding-inline: 5px !important; }
  [data-view="studio"] .template-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 10px !important; }
  [data-view="studio"] .template-filters { justify-content: flex-start !important; overflow-x: auto; padding: 2px 4px 8px; }
  [data-view="studio"] .invitation-draft-bar { justify-content: center !important; overflow-x: auto; }
  [data-view="gifts"] .gift-assistant-heading { display: block; }
  [data-view="gifts"] .gift-assistant-heading > button { margin-top: 12px; }
  [data-view="gifts"] .gift-recipient-picker { grid-template-columns: 1fr; }
  [data-view="reminders"] .task-entry { grid-template-columns: 1fr !important; gap: 12px; }
}

/* Per-event delivery preferences. */
[data-view="reminders"] .reminder-delivery {
  margin: 14px 0;
  padding: clamp(20px, 3vw, 30px);
  color: var(--p-ink);
  background: #f1e3e7;
  border: 1px solid rgba(47, 73, 84, 0.18);
  border-radius: 12px;
  box-shadow: 0 12px 30px rgba(47, 73, 84, 0.05);
}

[data-view="reminders"] .reminder-delivery-heading {
  display: flex;
  gap: 20px;
  align-items: start;
  justify-content: space-between;
  margin-bottom: 20px;
}

[data-view="reminders"] .reminder-delivery-heading h2 {
  margin: 0;
  font-family: "DM Serif Display", serif;
  font-weight: 400;
}

[data-view="reminders"] .reminder-delivery-heading p {
  margin: 7px 0 0;
  color: var(--muted);
}

[data-view="reminders"] #reminderDeliveryStatus {
  max-width: 44%;
  padding: 7px 11px;
  color: var(--p-blue);
  font-size: 0.72rem;
  text-align: right;
  background: rgba(255, 250, 247, 0.7);
  border-radius: 999px;
}

[data-view="reminders"] .reminder-delivery-form {
  display: grid;
  grid-template-columns: minmax(220px, 1.35fr) minmax(180px, 1fr) minmax(150px, 0.75fr) minmax(110px, 0.55fr) auto;
  gap: 10px;
  align-items: end;
}

[data-view="reminders"] .reminder-delivery-form > label,
[data-view="reminders"] .delivery-channels {
  display: grid;
  gap: 7px;
  min-width: 0;
  margin: 0;
  color: var(--p-blue);
  font-size: 0.68rem;
  font-weight: 600;
  border: 0;
}

[data-view="reminders"] .reminder-delivery-form > label[hidden] {
  display: none !important;
}

[data-view="reminders"] .delivery-channels {
  grid-template-columns: repeat(3, 1fr);
  padding: 0;
}

[data-view="reminders"] .delivery-channels legend {
  margin-bottom: 7px;
}

[data-view="reminders"] .delivery-channels label {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 10px;
  color: var(--p-blue);
  font-size: 0.76rem;
  font-weight: 600;
  background: rgba(255, 250, 247, 0.76);
  border: 1px solid rgba(47, 73, 84, 0.15);
  border-radius: 8px;
  cursor: pointer;
}

[data-view="reminders"] .delivery-channels label:has(input:checked) {
  color: #fffaf7;
  background: #526d67;
  border-color: #526d67;
}

[data-view="reminders"] .delivery-channels input {
  width: 15px;
  height: 15px;
  margin: 0;
  accent-color: #e8c4d1;
}

[data-view="reminders"] .reminder-delivery-form :is(input[type="email"], input[type="tel"], input[type="time"], select) {
  width: 100%;
  min-height: 44px;
  padding-inline: 11px;
  color: var(--p-ink);
  background: rgba(255, 250, 247, 0.82);
  border: 1px solid rgba(47, 73, 84, 0.15);
  border-radius: 8px;
}

[data-view="reminders"] .delivery-actions {
  display: flex;
  gap: 7px;
}

[data-view="reminders"] .delivery-actions button {
  min-height: 44px;
  padding: 8px 13px;
  white-space: nowrap;
  border-radius: 8px;
}

[data-view="reminders"] #testReminderDelivery {
  color: var(--p-blue);
  background: rgba(255, 250, 247, 0.76);
  border: 1px solid rgba(47, 73, 84, 0.18);
}

@media (max-width: 1100px) {
  [data-view="reminders"] .reminder-delivery-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  [data-view="reminders"] .delivery-actions {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  [data-view="reminders"] .reminder-delivery-heading {
    display: block;
  }

  [data-view="reminders"] #reminderDeliveryStatus {
    display: inline-block;
    max-width: 100%;
    margin-top: 14px;
    text-align: left;
  }

  [data-view="reminders"] .reminder-delivery-form {
    grid-template-columns: 1fr;
  }

  [data-view="reminders"] .delivery-actions {
    grid-column: auto;
  }

  [data-view="reminders"] .delivery-actions button {
    flex: 1;
  }
}

/* Profile-led layout and final spacing pass. */
.nav-list a,
.nav-list a:hover,
.nav-list a.active {
  color: var(--p-ink) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
}

.nav-list a > span,
.nav-list a > span::after {
  color: inherit;
  font-family: "DM Serif Display", Georgia, serif !important;
  font-size: 0.9rem !important;
  font-style: normal !important;
  font-weight: 400 !important;
  letter-spacing: 0;
}

/* A complete flip always settles back onto the undistorted text face. */
.nav-list a > span::after {
  display: none !important;
  content: none !important;
}

.nav-list a:hover > span,
.nav-list a:focus-visible > span {
  transform: none !important;
  animation: nav-dice-flip 520ms cubic-bezier(0.22, 1, 0.36, 1);
  transform-origin: 50% 50%;
}

@keyframes nav-dice-flip {
  0% { transform: perspective(240px) rotateX(0deg); }
  46% { transform: perspective(240px) rotateX(88deg) scaleX(0.98); opacity: 0.72; }
  47% { transform: perspective(240px) rotateX(-88deg) scaleX(0.98); opacity: 0.72; }
  100% { transform: perspective(240px) rotateX(0deg) scaleX(1); opacity: 1; }
}

.nav-list a:hover {
  background: rgba(255, 250, 247, 0.56) !important;
}

.nav-list a.active {
  background: #fffaf7 !important;
  border-color: rgba(47, 73, 84, 0.18) !important;
  box-shadow: 0 4px 14px rgba(47, 73, 84, 0.06) !important;
}

.product-view:not([hidden]) {
  padding-bottom: clamp(48px, 7vw, 88px);
}

.product-view:not([hidden]) > .view-header {
  margin-bottom: clamp(24px, 4vw, 42px);
}

/* People are profiles, not spreadsheet rows. */
.people-table-head {
  display: none !important;
}

[data-view="dashboard"] .people-directory {
  padding: clamp(18px, 2.6vw, 28px);
  border-radius: 12px;
}

[data-view="dashboard"] .people-table {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px !important;
  padding: 0 !important;
}

[data-view="dashboard"] .people-table::before {
  display: none !important;
}

.person-row,
.person-row:hover,
.person-row.selected {
  position: relative;
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  grid-template-areas:
    "identity status"
    "date date"
    "gift gift"
    "taste taste" !important;
  gap: 14px 12px !important;
  min-height: 228px;
  align-content: start;
  padding: 18px !important;
  overflow: hidden;
  text-align: left;
  background: rgba(255, 250, 247, 0.88) !important;
  border: 1px solid rgba(47, 73, 84, 0.12) !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 26px rgba(47, 73, 84, 0.045);
}

.person-row:hover,
.person-row.selected {
  border-color: rgba(47, 73, 84, 0.28) !important;
  transform: translateY(-2px);
}

.person-identity {
  grid-area: identity;
  display: flex !important;
  min-width: 0;
  align-items: center;
  gap: 12px;
}

.person-directory-photo,
.journal-profile-photo,
.person-photo-preview {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  overflow: hidden;
  color: var(--p-blue);
  background: #dceaf0;
  border: 1px solid rgba(47, 73, 84, 0.13);
  border-radius: 50%;
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.35rem;
}

.person-directory-photo {
  width: 58px;
  height: 58px;
}

.person-directory-photo img,
.journal-profile-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.person-identity > span:last-child {
  min-width: 0;
}

.person-identity strong {
  display: block;
  margin-bottom: 3px;
  color: var(--p-ink);
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.35rem;
  font-weight: 400;
  line-height: 1;
}

.person-identity small {
  display: block;
  overflow: hidden;
  color: var(--p-muted);
  font-size: 0.68rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.person-occasion { grid-area: date; }
.person-gift-memory { grid-area: gift; }
.person-preferences { grid-area: taste; }
.person-status { grid-area: status; align-self: start; }

.person-occasion,
.person-gift-memory,
.person-preferences {
  display: grid !important;
  gap: 3px;
  min-width: 0;
  padding-top: 10px;
  border-top: 1px solid rgba(47, 73, 84, 0.1);
}

.person-occasion strong,
.person-gift-memory strong {
  color: var(--p-ink);
  font-size: 0.8rem;
}

.person-occasion small,
.person-gift-memory small,
.person-preferences {
  color: var(--p-muted);
  font-size: 0.68rem;
  line-height: 1.35;
}

.person-status {
  width: max-content;
  padding: 5px 8px;
  color: var(--p-blue) !important;
  background: #e6eff2 !important;
  border: 0 !important;
  border-radius: 999px;
  font-size: 0.6rem;
}

.person-photo-field {
  grid-column: 1 / -1;
}

.person-photo-picker {
  position: relative;
  display: flex;
  min-height: 76px;
  align-items: center;
  gap: 12px;
  margin-top: 6px;
  padding: 10px 12px;
  color: var(--p-ink);
  background: rgba(255, 250, 247, 0.68);
  border: 1px solid rgba(47, 73, 84, 0.14);
  border-radius: 10px;
  cursor: pointer;
}

.person-photo-picker .person-photo-preview {
  width: 54px;
  height: 54px;
  background-position: center;
  background-size: cover;
}

.person-photo-picker strong,
.person-photo-picker small {
  display: block;
}

.person-photo-picker strong { font-size: 0.76rem; }
.person-photo-picker small { margin-top: 3px; color: var(--p-muted); font-size: 0.62rem; }
.person-photo-picker input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

.add-person-drawer form {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.add-person-drawer form > button {
  min-height: 46px;
}

.person-photo-editor {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  background: #f1e3e7;
  border-radius: 10px;
}

.person-photo-editor .person-photo-preview {
  width: 72px;
  height: 72px;
  background-position: center;
  background-size: cover;
}

.person-photo-editor label { display: grid; gap: 6px; }
.person-photo-editor label > span { position: relative; display: block; padding: 10px 12px; background: #fffaf7; border-radius: 7px; cursor: pointer; }
.person-photo-editor input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.person-photo-editor button { min-height: 40px; padding: 8px 11px; background: transparent; border: 1px solid rgba(47, 73, 84, 0.18); border-radius: 7px; }

.person-sheet-header > div > span.has-photo {
  background-position: center;
  background-size: cover;
}

/* Gift journal: profiles first, compact records, deliberate spacing. */
[data-view="gifts"] .gift-panel {
  gap: clamp(18px, 2.4vw, 28px) !important;
}

[data-view="gifts"] .gift-journal {
  min-height: 0 !important;
  margin: 0 !important;
  padding: clamp(20px, 3vw, 30px) !important;
  background: #f1e3e7;
  border-radius: 12px;
}

[data-view="gifts"] .journal-heading {
  display: flex !important;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 18px !important;
  padding: 0 !important;
  border: 0 !important;
}

[data-view="gifts"] .journal-heading h2 {
  margin: 0;
  color: var(--p-ink);
  font-family: "DM Serif Display", Georgia, serif !important;
  font-size: clamp(2rem, 3.3vw, 3.25rem) !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}

.journal-person-select {
  display: grid;
  gap: 5px;
  min-width: 180px;
  color: var(--p-muted) !important;
  font-family: "DM Sans", sans-serif !important;
  font-size: 0.62rem !important;
  font-style: normal !important;
  font-weight: 600;
}

.journal-person-select select {
  min-height: 40px;
  padding: 7px 34px 7px 11px;
  color: var(--p-ink);
  background: rgba(255, 250, 247, 0.86) !important;
  border: 1px solid rgba(47, 73, 84, 0.14) !important;
  border-radius: 8px !important;
}

.journal-profile-strip {
  display: flex;
  gap: 10px;
  margin: 0 0 16px;
  padding: 2px 0 8px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.journal-profile-card {
  display: grid;
  grid-template-columns: 48px minmax(105px, 1fr) auto;
  flex: 0 0 auto;
  min-width: 245px;
  align-items: center;
  gap: 10px;
  padding: 10px;
  color: var(--p-ink);
  text-align: left;
  background: rgba(255, 250, 247, 0.5);
  border: 1px solid transparent;
  border-radius: 10px;
}

.journal-profile-card:hover,
.journal-profile-card.active {
  background: #fffaf7;
  border-color: rgba(47, 73, 84, 0.18);
  box-shadow: 0 6px 16px rgba(47, 73, 84, 0.05);
}

.journal-profile-photo { width: 48px; height: 48px; }
.journal-profile-card > span:nth-child(2) { min-width: 0; }
.journal-profile-card strong,
.journal-profile-card small { display: block; }
.journal-profile-card strong { font-family: "DM Serif Display", Georgia, serif; font-size: 1.05rem; font-weight: 400; }
.journal-profile-card small { margin-top: 2px; overflow: hidden; color: var(--p-muted); font-size: 0.62rem; text-overflow: ellipsis; white-space: nowrap; }
.journal-profile-card em { color: var(--p-blue); font-size: 0.62rem; font-style: normal; white-space: nowrap; }

[data-view="gifts"] .journal-layout {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 14px !important;
  min-height: 0 !important;
}

[data-view="gifts"] .journal-summary {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

[data-view="gifts"] .journal-summary > div {
  min-height: 92px !important;
  padding: 14px !important;
  background: rgba(255, 250, 247, 0.6) !important;
  border-radius: 9px !important;
}

[data-view="gifts"] .journal-summary strong {
  font-family: "DM Serif Display", Georgia, serif;
  font-size: 1.55rem;
  font-weight: 400;
}

[data-view="gifts"] .journal-summary span {
  margin-top: 6px;
  color: var(--p-muted);
  font-size: 0.64rem;
}

[data-view="gifts"] .journal-timeline {
  min-height: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

[data-view="gifts"] .journal-empty {
  display: grid;
  min-height: 0 !important;
  place-items: start;
  gap: 7px;
  padding: 22px !important;
  background: rgba(255, 250, 247, 0.5);
  border-radius: 9px;
}

[data-view="gifts"] .journal-empty strong { font-family: "DM Serif Display", Georgia, serif; font-size: 1.35rem; font-weight: 400; }
[data-view="gifts"] .journal-empty p { max-width: 540px; margin: 0; color: var(--p-muted); font-size: 0.76rem; }
[data-view="gifts"] .journal-empty button { margin-top: 6px; padding: 9px 12px; color: #fffaf7; background: #526d67; border: 0; border-radius: 7px; }

[data-view="gifts"] .journal-entry-drawer {
  margin: 14px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

[data-view="gifts"] .journal-entry-drawer > summary {
  min-height: 50px;
  padding: 14px 46px 14px 16px !important;
  color: var(--p-ink);
  background: rgba(255, 250, 247, 0.62) !important;
  border-radius: 8px !important;
}

[data-view="gifts"] :is(.manual-gift-drawer, .inspiration-inbox) {
  margin: 0 !important;
  border-radius: 10px !important;
}

[data-view="gifts"] .gift-recipient-picker {
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 8px !important;
  margin: 14px 0 16px !important;
  padding: 12px !important;
}

[data-view="gifts"] .gift-recipient-picker label {
  grid-column: 1 / -1;
  padding: 0 !important;
  color: var(--p-ink) !important;
  font-family: "DM Sans", sans-serif !important;
  font-size: 0.68rem;
  font-style: normal !important;
  font-weight: 600;
}

@media (max-width: 900px) {
  .add-person-drawer form { grid-template-columns: 1fr 1fr !important; }
  .person-photo-field,
  .add-person-drawer form > button { grid-column: 1 / -1 !important; }

  [data-view="gifts"] .journal-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  .nav-list a > span,
  .nav-list a > span::after { font-size: 0.78rem !important; }

  [data-view="dashboard"] .people-directory { padding: 14px; }
  [data-view="dashboard"] .people-table { grid-template-columns: 1fr; }
  .person-row, .person-row:hover, .person-row.selected { min-height: 0; }

  .add-person-drawer form { grid-template-columns: 1fr !important; }
  .person-photo-field,
  .add-person-drawer form > button { grid-column: 1 !important; }

  .person-photo-editor {
    grid-template-columns: 64px minmax(0, 1fr);
  }

  .person-photo-editor .person-photo-preview { width: 64px; height: 64px; }
  .person-photo-editor button { grid-column: 2; justify-self: start; }

  [data-view="gifts"] .gift-panel { gap: 18px !important; }
  [data-view="gifts"] .gift-journal { padding: 18px !important; }
  [data-view="gifts"] .journal-heading { display: block !important; }
  [data-view="gifts"] .journal-person-select { margin-top: 14px; }
  [data-view="gifts"] .journal-profile-card { min-width: 220px; }
  [data-view="gifts"] .journal-summary > div { min-height: 82px !important; }
  [data-view="gifts"] .journal-empty { padding: 18px !important; }
  [data-view="gifts"] .gift-recipient-picker { grid-template-columns: 1fr !important; }
  [data-view="gifts"] .gift-recipient-picker button { width: 100%; }
  [data-view="gifts"] .recipient-workbench { grid-template-columns: 1fr !important; }
}

/* Coming up is a list of cards, not a timeline. */
[data-view="dashboard"] .event-list {
  padding-left: 0 !important;
}

[data-view="dashboard"] .event-list::before,
[data-view="dashboard"] .event-card::before,
[data-view="dashboard"] .event-card.selected::before {
  display: none !important;
  content: none !important;
}

/* Keep invitation names in a distinct text area below their artwork. */
[data-view="studio"] .template-choice {
  grid-template-rows: 178px auto auto !important;
  align-content: start !important;
  row-gap: 10px !important;
}

[data-view="studio"] .template-mini {
  height: 178px !important;
  min-height: 0 !important;
  margin: 0 !important;
}

[data-view="studio"] .template-choice strong {
  min-height: 0 !important;
  margin: 0 !important;
  padding: 2px 12px 0 !important;
  line-height: 1.2 !important;
}

[data-view="studio"] .template-choice .template-kind {
  margin: 0 !important;
  padding: 0 12px 12px !important;
}

@media (max-width: 700px) {
  [data-view="studio"] .template-choice {
    grid-template-rows: 145px auto auto !important;
  }

  [data-view="studio"] .template-mini {
    height: 145px !important;
  }
}

/* Keep the studio controls in one calm, linear editing path. */
[data-view="studio"] .designer-tools {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 10px !important;
}

[data-view="studio"] .designer-tools > * {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}

[data-view="studio"] .studio-look-brief,
[data-view="studio"] .control-section {
  grid-column: auto !important;
}

[data-view="studio"] .studio-look-brief {
  padding: 18px !important;
}

[data-view="studio"] .control-section > summary {
  width: 100%;
  min-height: 52px;
  box-sizing: border-box;
}

[data-view="studio"] .image-library-field {
  width: 100%;
  min-width: 0;
  margin: 14px 0 4px;
  padding: 0;
  border: 0;
}

[data-view="studio"] .image-library-field legend {
  padding: 0 0 9px;
}

[data-view="studio"] .image-library {
  display: flex !important;
  grid-template-columns: none !important;
  width: 100% !important;
  max-width: 100%;
  max-height: none !important;
  gap: 10px !important;
  padding: 2px 2px 11px;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x proximity;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

[data-view="studio"] .image-library button {
  flex: 0 0 132px !important;
  width: 132px !important;
  min-width: 132px !important;
  aspect-ratio: 4 / 3 !important;
  scroll-snap-align: start;
}

[data-view="studio"] .image-library button img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 700px) {
  [data-view="studio"] .designer-tools {
    gap: 8px !important;
  }

  [data-view="studio"] .image-library button {
    flex-basis: 144px !important;
    width: 144px !important;
    min-width: 144px !important;
  }
}

/* Gift concierge: quiet product shelf with isolated, swipeable objects. */
[data-view="gifts"] .gift-top-grid .gift-assistant-heading {
  position: relative;
  display: flex !important;
  flex-direction: column;
  align-items: stretch !important;
  min-height: 0 !important;
  padding: 28px 28px 20px !important;
  color: #242522 !important;
  background: #ebe9e4 !important;
  border-bottom: 1px solid rgba(36, 37, 34, 0.12);
}

[data-view="gifts"] .gift-top-grid .gift-assistant-heading::after {
  display: none !important;
  content: none !important;
}

[data-view="gifts"] .gift-top-grid .gift-assistant-heading > .gift-assistant-copy {
  width: 100% !important;
  padding-right: 150px;
}

[data-view="gifts"] .gift-top-grid .gift-assistant-heading h2 {
  max-width: none !important;
  margin: 0;
  color: #242522 !important;
  font-family: "Manrope", sans-serif !important;
  font-size: clamp(2rem, 4vw, 3.2rem) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

[data-view="gifts"] .gift-top-grid .gift-assistant-heading p {
  margin: 9px 0 0;
  color: rgba(36, 37, 34, 0.62) !important;
  font-family: "Manrope", sans-serif !important;
  font-size: 0.78rem !important;
  font-style: normal !important;
}

[data-view="gifts"] .gift-top-grid .gift-assistant-heading > #clearGiftChat {
  position: absolute !important;
  top: 28px !important;
  right: 28px !important;
  bottom: auto !important;
  min-height: 38px;
  padding: 8px 14px;
  color: #242522 !important;
  background: rgba(255, 255, 255, 0.62) !important;
  border: 1px solid rgba(36, 37, 34, 0.16) !important;
  border-radius: 999px !important;
  backdrop-filter: blur(12px);
}

[data-view="gifts"] .gift-product-shelf {
  display: flex;
  width: 100% !important;
  min-width: 0;
  gap: 10px;
  margin-top: 22px;
  padding: 0 2px 8px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

[data-view="gifts"] .gift-product-shelf::-webkit-scrollbar {
  display: none;
}

[data-view="gifts"] .gift-product-shelf > button {
  display: grid;
  flex: 0 0 206px;
  grid-template-rows: 165px auto auto;
  align-content: start;
  min-width: 206px;
  padding: 0 6px 4px;
  color: #242522;
  text-align: left;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  scroll-snap-align: start;
  transition: transform 180ms ease;
}

[data-view="gifts"] .gift-product-shelf > button:hover,
[data-view="gifts"] .gift-product-shelf > button:focus-visible {
  color: #242522;
  background: transparent !important;
  transform: translateY(-4px);
}

[data-view="gifts"] .gift-product-shelf img {
  width: 100%;
  height: 165px;
  object-fit: contain;
  filter: drop-shadow(0 12px 12px rgba(35, 34, 31, 0.09));
}

[data-view="gifts"] .gift-product-shelf span {
  margin-top: 6px;
  font-family: "Manrope", sans-serif;
  font-size: 0.84rem;
  font-weight: 650;
  line-height: 1.25;
}

[data-view="gifts"] .gift-product-shelf small {
  margin-top: 3px;
  color: rgba(36, 37, 34, 0.5);
  font-family: "Manrope", sans-serif;
  font-size: 0.68rem;
  font-weight: 500;
}

@media (max-width: 700px) {
  [data-view="gifts"] .gift-top-grid .gift-assistant-heading {
    padding: 22px 18px 16px !important;
  }

  [data-view="gifts"] .gift-top-grid .gift-assistant-heading > .gift-assistant-copy {
    padding-right: 0;
  }

  [data-view="gifts"] .gift-top-grid .gift-assistant-heading > #clearGiftChat {
    position: static !important;
    align-self: flex-start;
    order: 3;
    margin-top: 12px;
  }

  [data-view="gifts"] .gift-product-shelf {
    margin-top: 18px;
  }

  [data-view="gifts"] .gift-product-shelf > button {
    flex-basis: 164px;
    min-width: 164px;
    grid-template-rows: 138px auto auto;
  }

  [data-view="gifts"] .gift-product-shelf img {
    height: 138px;
  }
}

/* Event context belongs inside the workspace, not in the global navigation. */
.sidebar .mini-panel {
  display: none !important;
}

/* oh, dearly identity */
.brand {
  min-width: max-content;
}

.brand-mark::after {
  content: "o";
  font-size: 1.12rem;
}

.brand strong {
  display: block;
  color: var(--chapter-wine);
  font-family: "Bodoni Moda", Georgia, serif;
  font-size: clamp(1.48rem, 2.2vw, 1.82rem);
  font-style: italic;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  white-space: nowrap;
}

@media (max-width: 700px) {
  .brand strong {
    font-size: 1.42rem;
  }
}