:root {
  --bg: #f6f7fb;
  --surface: #ffffff;
  --surface-soft: #eef0ff;
  --ink: #17172a;
  --muted: #73758b;
  --primary: #4f46e5;
  --primary-dark: #3730a3;
  --success: #17845b;
  --border: #e5e7ef;
  --shadow: 0 12px 30px rgba(38, 40, 70, .09);
  --radius-xl: 26px;
  --radius-lg: 20px;
  --radius-md: 15px;
}

* { box-sizing: border-box; }
html { background: var(--bg); }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: Inter, ui-rounded, "SF Pro Rounded", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-tap-highlight-color: transparent;
}
button, input, select { font: inherit; }
button { cursor: pointer; }

.app-shell {
  min-height: 100dvh;
  max-width: 560px;
  margin: 0 auto;
  padding: env(safe-area-inset-top) 18px calc(94px + env(safe-area-inset-bottom));
}

.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 22px 2px 14px;
}
.topbar h1 { margin: 2px 0 0; font-size: 28px; letter-spacing: -.04em; }
.eyebrow {
  margin: 0;
  color: var(--primary);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .13em;
}
.icon-button {
  border: 0;
  background: var(--surface);
  width: 42px;
  height: 42px;
  border-radius: 50%;
  box-shadow: 0 5px 16px rgba(40,40,70,.08);
}

.affirmation-card {
  padding: 22px;
  border-radius: var(--radius-xl);
  color: white;
  background:
    radial-gradient(circle at 90% 10%, rgba(255,255,255,.2), transparent 32%),
    linear-gradient(140deg, #6d5efc, #4f46e5 55%, #3530a8);
  box-shadow: var(--shadow);
}
.affirmation-label { font-size: 10px; font-weight: 900; letter-spacing: .14em; opacity: .78; }
blockquote { margin: 12px 0 10px; font-size: 21px; font-weight: 720; line-height: 1.35; letter-spacing: -.02em; }
.text-button { border: 0; padding: 0; background: transparent; color: white; font-weight: 750; opacity: .82; }

.level-card {
  margin-top: 14px;
  background: var(--surface);
  border-radius: var(--radius-lg);
  padding: 18px;
  box-shadow: 0 8px 24px rgba(38,40,70,.06);
}
.level-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.level-row h2 { margin: 3px 0 12px; font-size: 22px; }
.muted { color: var(--muted); font-size: 13px; }
.streak-badge { background: #fff3dd; color: #9b5b00; padding: 9px 12px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.progress-track { height: 10px; background: #ececf4; border-radius: 999px; overflow: hidden; }
.progress-track.slim { height: 7px; }
.progress-fill { height: 100%; width: 0; background: linear-gradient(90deg, #6d5efc, #4f46e5); border-radius: inherit; transition: width .35s ease; }
.progress-caption { margin: 8px 0 0; color: var(--muted); font-size: 12px; }

.section-block { margin-top: 28px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
.section-heading h2 { margin: 3px 0 0; font-size: 22px; letter-spacing: -.025em; }
.primary-small, .secondary-small {
  border: 0; border-radius: 999px; padding: 10px 15px; font-weight: 800;
}
.primary-small { color: white; background: var(--primary); }
.secondary-small { color: var(--primary); background: var(--surface-soft); }

.completion-summary { display: flex; justify-content: space-between; color: var(--muted); font-size: 12px; font-weight: 700; margin-bottom: 7px; }
.bucket-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 15px;
}
.goal-bucket-button {
  min-height: 154px;
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface);
  padding: 16px;
  text-align: left;
  color: var(--ink);
  box-shadow: 0 6px 19px rgba(38,40,70,.055);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.goal-bucket-button:active { transform: scale(.985); }
.bucket-topline { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.bucket-icon { font-size: 25px; line-height: 1; }
.bucket-count-badge {
  min-width: 31px; height: 31px; display: grid; place-items: center;
  border-radius: 999px; background: var(--surface-soft); color: var(--primary-dark);
  font-size: 12px; font-weight: 900;
}
.goal-bucket-button h3 { margin: 16px 0 4px; font-size: 17px; line-height: 1.15; }
.bucket-completion-text { margin: 0; color: var(--muted); font-size: 11px; font-weight: 700; line-height: 1.3; }
.bucket-card-progress { width: 100%; margin-top: auto; padding-top: 12px; }
.bucket-card-progress-row { display: flex; justify-content: space-between; margin-bottom: 6px; font-size: 11px; font-weight: 850; color: var(--muted); }
.bucket-card-progress-row strong { color: var(--primary); }
.dialog-task-list { display: grid; gap: 10px; margin-top: 16px; }
.dialog-task-card {
  display: grid;
  grid-template-columns: 48px 1fr auto;
  align-items: center;
  gap: 12px;
  border: 1px solid var(--border);
  border-radius: 17px;
  padding: 13px;
  background: #fff;
}
.dialog-task-card.completed { opacity: .7; background: #f8fcfa; border-color: #b9ead5; }
.complete-button {
  width: 46px; height: 46px; border-radius: 16px;
  border: 2px solid #d9dbe7; background: white; font-size: 20px;
}
.dialog-task-card.completed .complete-button { background: #dff6ec; border-color: #67c89d; }
.task-name { margin: 0 0 5px; font-size: 15px; font-weight: 800; }
.dialog-task-card.completed .task-name { text-decoration: line-through; }
.task-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; color: var(--muted); font-size: 11px; }
.xp-pill { background: var(--surface-soft); color: var(--primary-dark); padding: 5px 8px; border-radius: 999px; font-size: 11px; font-weight: 850; }
.task-menu { border: 0; background: transparent; font-size: 20px; color: var(--muted); }
.bucket-dialog-summary { display: flex; justify-content: space-between; color: var(--muted); font-size: 12px; font-weight: 750; }
.bucket-dialog-summary strong { color: var(--primary); }
.bucket-add-button { margin-top: 16px; }

.empty-state { text-align: center; padding: 35px 22px; background: var(--surface); border-radius: var(--radius-xl); margin-top: 15px; }
.empty-icon { font-size: 35px; }
.empty-state h3 { margin-bottom: 6px; }
.empty-state p { color: var(--muted); line-height: 1.5; }

.tomorrow-preview { display: grid; gap: 9px; }
.preview-row { background: var(--surface); border-radius: 15px; padding: 13px 15px; display: flex; justify-content: space-between; gap: 10px; font-size: 13px; }
.preview-empty { color: var(--muted); background: var(--surface); border-radius: 15px; padding: 18px; line-height: 1.45; }

.bottom-nav {
  position: fixed;
  z-index: 10;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: min(560px, 100%);
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  padding: 9px 10px calc(8px + env(safe-area-inset-bottom));
  background: rgba(255,255,255,.94);
  border-top: 1px solid var(--border);
  backdrop-filter: blur(16px);
}
.nav-item { border: 0; background: transparent; color: var(--muted); font-size: 10px; font-weight: 750; padding: 6px; }
.nav-item span { display: block; font-size: 20px; margin-bottom: 3px; }
.nav-item.active { color: var(--primary); }

.primary-button, .secondary-button {
  width: 100%; border: 0; border-radius: 15px; padding: 14px 16px; font-weight: 850;
}
.primary-button { background: var(--primary); color: white; }
.secondary-button { background: var(--surface-soft); color: var(--primary-dark); }

dialog { border: 0; padding: 0; }
dialog::backdrop { background: rgba(18,18,35,.56); backdrop-filter: blur(3px); }
.sheet-dialog {
  width: min(560px, 100%);
  max-height: 91dvh;
  margin: auto auto 0;
  border-radius: 28px 28px 0 0;
  overflow: auto;
}
.sheet-dialog form, .sheet-panel { padding: 10px 20px calc(26px + env(safe-area-inset-bottom)); background: white; }
.sheet-handle { width: 42px; height: 5px; border-radius: 999px; background: #d8d9e2; margin: 0 auto 18px; }
.dialog-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 22px; }
.dialog-heading h2 { margin: 4px 0 0; }
label { display: block; margin-bottom: 16px; color: var(--ink); font-size: 13px; font-weight: 800; }
input, select {
  width: 100%; margin-top: 7px; padding: 13px 14px; border: 1px solid var(--border); border-radius: 13px; background: #fbfbfd; color: var(--ink);
}
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.check-row { display: flex; align-items: center; gap: 10px; }
.check-row input { width: 20px; height: 20px; margin: 0; }

.library-list { display: grid; gap: 11px; }
.library-item { border: 1px solid var(--border); border-radius: 17px; padding: 15px; }
.library-item h3 { margin: 0 0 5px; font-size: 15px; }
.library-item p { margin: 0 0 12px; color: var(--muted); font-size: 12px; }
.library-actions { display: flex; gap: 8px; }
.library-actions button { flex: 1; border: 0; border-radius: 11px; padding: 10px; font-weight: 800; }
.bucket-card { padding: 16px; border-radius: 18px; background: var(--surface-soft); margin-bottom: 11px; }
.bucket-card h3 { margin: 0 0 4px; }
.bucket-card p { margin: 0; color: var(--muted); font-size: 12px; }

.celebration-dialog { width: min(340px, calc(100% - 38px)); border-radius: 26px; }
.celebration-content { padding: 30px 24px 24px; text-align: center; }
.celebration-icon { font-size: 54px; animation: pop .45s ease; }
.celebration-content h2 { margin: 8px 0; }
.celebration-content > p:not(.eyebrow) { color: var(--primary); font-size: 18px; font-weight: 900; }
@keyframes pop { 0% { transform: scale(.2) rotate(-20deg); } 75% { transform: scale(1.15) rotate(5deg); } 100% { transform: scale(1); } }

.settings-group { padding: 17px 0; border-top: 1px solid var(--border); }
.settings-group h3 { margin: 0 0 7px; }
.settings-group p { color: var(--muted); line-height: 1.45; font-size: 13px; }
.status-text { font-size: 12px !important; }
.hidden { display: none !important; }

@media (min-width: 600px) {
  body { padding-top: 20px; }
  .app-shell { min-height: calc(100dvh - 20px); border-radius: 32px 32px 0 0; box-shadow: 0 0 50px rgba(30,30,60,.10); }
}

.bucket-icon-button { border: 0; background: transparent; padding: 0; font-size: 27px; line-height: 1; border-radius: 10px; }
.bucket-icon-button:active { transform: scale(.9); }
.bucket-open-area { display: flex; flex: 1; width: 100%; flex-direction: column; border: 0; padding: 0; background: transparent; text-align: left; color: inherit; }
.bucket-open-area h3 { margin: 16px 0 4px; font-size: 17px; line-height: 1.15; }
.task-actions { display: grid; grid-template-columns: auto auto; gap: 5px; justify-items: end; align-items: center; }
.task-actions .xp-pill { grid-column: 1 / -1; }
.task-edit-button, .task-delete-button, .tomorrow-edit, .tomorrow-delete { border: 0; background: transparent; padding: 5px; border-radius: 8px; font-size: 15px; }
.tomorrow-preview { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.tomorrow-bucket-card { min-width: 0; border: 1px solid var(--border); border-radius: 17px; padding: 13px; background: rgba(255,255,255,.72); box-shadow: 0 4px 14px rgba(38,40,70,.035); }
.tomorrow-card-heading span { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.tomorrow-card-heading strong { font-size: 14px; }
.tomorrow-card-heading small { color: var(--muted); font-size: 10px; white-space: nowrap; }
.tomorrow-task-list { margin-top: 10px; display: grid; gap: 7px; }
.tomorrow-task-row { border-top: 1px solid var(--border); padding-top: 7px; font-size: 11px; line-height: 1.3; display: grid; gap: 5px; }
.tomorrow-task-actions { display: flex; align-items: center; justify-content: flex-end; gap: 2px; color: var(--primary-dark); }
.tomorrow-task-actions strong { margin-right: auto; font-size: 10px; }
.calendar-toolbar { display: grid; grid-template-columns: 42px 1fr 42px; align-items: center; gap: 8px; margin-bottom: 14px; }
.calendar-toolbar h3 { text-align: center; margin: 0; }
.calendar-toolbar button { border: 0; border-radius: 12px; background: var(--surface-soft); color: var(--primary); font-size: 25px; height: 40px; }
.month-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-bottom: 15px; }
.month-summary div { background: var(--surface-soft); border-radius: 14px; padding: 11px 6px; text-align: center; }
.month-summary strong, .month-summary span { display: block; }
.month-summary strong { font-size: 18px; }
.month-summary span { color: var(--muted); font-size: 9px; margin-top: 3px; }
.calendar-weekdays, .calendar-grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 5px; }
.calendar-weekdays { margin-bottom: 6px; color: var(--muted); font-size: 10px; font-weight: 850; text-align: center; }
.calendar-cell { min-height: 48px; border: 0; border-radius: 11px; background: #f4f4f8; color: var(--ink); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; }
.calendar-cell span { font-size: 12px; font-weight: 800; }
.calendar-cell small { font-size: 9px; }
.calendar-cell.perfect { background: #dff6ec; color: #126b4a; }
.calendar-cell.partial { background: #fff3dd; color: #8d5600; }
.calendar-cell.planned { background: #eeeefe; color: var(--primary-dark); }
.calendar-cell.empty { visibility: hidden; }
.calendar-day-details { margin-top: 14px; border: 1px solid var(--border); border-radius: 14px; padding: 13px; display: grid; gap: 4px; font-size: 12px; color: var(--muted); }
.calendar-day-details strong { color: var(--ink); }
@media (max-width: 390px) { .tomorrow-preview { grid-template-columns: 1fr; } }


textarea {
  width: 100%; margin-top: 7px; padding: 13px 14px; border: 1px solid var(--border);
  border-radius: 13px; background: #fbfbfd; color: var(--ink); font: inherit; resize: vertical;
}

.morning-briefing {
  width: min(560px, 100%); height: 100dvh; max-height: none; margin: 0 auto; border: 0;
  background: transparent; overflow: hidden;
}
.morning-briefing::backdrop { background: rgba(21, 20, 48, .82); backdrop-filter: blur(8px); }
.briefing-screen {
  position: relative; min-height: 100dvh; display: flex; flex-direction: column; overflow: hidden; color: white;
  padding: calc(26px + env(safe-area-inset-top)) 22px calc(22px + env(safe-area-inset-bottom));
  background:
    radial-gradient(circle at 12% 12%, rgba(255, 215, 119, .33), transparent 25%),
    radial-gradient(circle at 92% 70%, rgba(157, 140, 255, .27), transparent 34%),
    linear-gradient(155deg, #7668ff 0%, #4f46e5 48%, #292477 100%);
}
.briefing-screen::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .2;
  background-image: radial-gradient(circle, rgba(255,255,255,.8) 1px, transparent 1px);
  background-size: 33px 33px; mask-image: linear-gradient(to bottom, black, transparent 65%);
}
.briefing-close {
  position: relative; z-index: 2; align-self: flex-end; width: 42px; height: 42px; border: 1px solid rgba(255,255,255,.22);
  border-radius: 50%; background: rgba(255,255,255,.12); color: white; font-size: 18px;
}
.briefing-content { position: relative; z-index: 1; flex: 1; display: flex; flex-direction: column; justify-content: center; text-align: center; padding: 8px 0 18px; }
.briefing-sun { font-size: 42px; margin-bottom: 8px; filter: drop-shadow(0 5px 14px rgba(20,10,70,.2)); }
.briefing-date { margin: 0 0 5px; font-size: 11px; font-weight: 900; letter-spacing: .16em; opacity: .7; }
.briefing-content > h1 { margin: 0 0 25px; font-size: clamp(28px, 8vw, 39px); letter-spacing: -.045em; }
.briefing-quest { margin: 0 auto 19px; width: 100%; padding: 20px 18px; border: 1px solid rgba(255,255,255,.22); border-radius: 22px; background: rgba(255,255,255,.11); backdrop-filter: blur(8px); }
.briefing-label { display: block; font-size: 10px; font-weight: 900; letter-spacing: .15em; opacity: .72; }
.briefing-quest p { margin: 11px 0 0; font-size: clamp(18px, 5vw, 23px); font-weight: 800; line-height: 1.35; letter-spacing: -.02em; }
.briefing-affirmation { padding: 3px 9px 15px; }
.briefing-affirmation blockquote { margin: 10px auto 0; max-width: 460px; font-size: clamp(16px, 4.5vw, 20px); line-height: 1.5; font-weight: 600; }
.briefing-yesterday { margin: 5px auto 0; font-size: 12px; opacity: .82; }
.briefing-yesterday > span { display: block; margin-bottom: 7px; font-size: 9px; font-weight: 900; letter-spacing: .15em; opacity: .65; }
.briefing-yesterday div { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; align-items: center; }
.briefing-yesterday b, .briefing-yesterday em { font-style: normal; padding: 5px 8px; border-radius: 999px; background: rgba(255,255,255,.13); }
.briefing-footer { position: relative; z-index: 1; display: grid; gap: 6px; }
.briefing-start { width: 100%; border: 0; border-radius: 17px; padding: 16px; background: white; color: var(--primary-dark); font-weight: 900; box-shadow: 0 12px 30px rgba(20,15,80,.24); }
.briefing-settings-link { border: 0; padding: 10px; color: rgba(255,255,255,.72); background: transparent; font-size: 12px; font-weight: 750; }
@media (max-height: 690px) {
  .briefing-content { justify-content: flex-start; padding-top: 0; }
  .briefing-sun { font-size: 30px; margin-bottom: 2px; }
  .briefing-content > h1 { margin-bottom: 13px; font-size: 27px; }
  .briefing-quest { padding: 14px; margin-bottom: 11px; }
  .briefing-quest p { font-size: 17px; }
  .briefing-affirmation blockquote { font-size: 15px; margin-top: 6px; }
}

/* First-launch purpose onboarding */
.onboarding-dialog {
  width: min(560px, 100%);
  height: 100dvh;
  max-height: none;
  margin: 0 auto;
  border: 0;
  background: #f6f7fb;
  overflow: hidden;
}
.onboarding-dialog::backdrop { background: #292477; }
.onboarding-screen {
  min-height: 100dvh;
  max-height: 100dvh;
  overflow-y: auto;
  padding: calc(30px + env(safe-area-inset-top)) 18px calc(28px + env(safe-area-inset-bottom));
  background:
    radial-gradient(circle at 92% 2%, rgba(109,94,252,.12), transparent 28%),
    #f6f7fb;
}
.onboarding-header { text-align: center; max-width: 470px; margin: 0 auto 22px; }
.onboarding-mark { font-size: 36px; margin-bottom: 5px; }
.onboarding-kicker { margin: 0; color: var(--primary); font-size: 10px; font-weight: 900; letter-spacing: .17em; }
.onboarding-header h1 { margin: 8px 0 9px; font-size: clamp(28px, 8vw, 38px); letter-spacing: -.045em; line-height: 1.05; }
.onboarding-header > p:last-child { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.onboarding-main-quest { padding: 17px; margin-bottom: 24px; border-radius: 20px; background: white; box-shadow: 0 8px 24px rgba(38,40,70,.06); }
.onboarding-main-quest label { margin-bottom: 0; font-size: 15px; }
.onboarding-main-quest small { display: block; margin-top: 7px; color: var(--muted); font-size: 11px; line-height: 1.4; }
.onboarding-section-title { display: flex; align-items: end; justify-content: space-between; gap: 10px; margin: 0 2px 12px; }
.onboarding-section-title span { color: var(--primary); font-size: 9px; font-weight: 900; letter-spacing: .15em; }
.onboarding-section-title h2 { margin: 3px 0 0; font-size: 20px; }
.onboarding-section-title strong { flex: none; color: var(--muted); font-size: 11px; }
.onboarding-bucket-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 11px; }
.onboarding-bucket-card { position: relative; min-width: 0; border: 2px solid transparent; border-radius: 20px; padding: 14px; background: white; box-shadow: 0 6px 19px rgba(38,40,70,.05); transition: border-color .18s ease, transform .18s ease; }
.onboarding-bucket-card.selected { border-color: var(--primary); background: #f8f7ff; }
.onboarding-bucket-toggle { width: 100%; border: 0; padding: 0; background: transparent; color: inherit; text-align: left; }
.onboarding-bucket-top { display: flex; align-items: center; justify-content: space-between; gap: 7px; }
.onboarding-bucket-icon { font-size: 27px; }
.onboarding-check { display: grid; place-items: center; width: 23px; height: 23px; border: 2px solid #d7d8e3; border-radius: 50%; color: white; font-size: 13px; font-weight: 900; }
.onboarding-bucket-card.selected .onboarding-check { border-color: var(--primary); background: var(--primary); }
.onboarding-bucket-card h3 { margin: 11px 0 3px; font-size: 16px; }
.onboarding-bucket-card .bucket-prompt { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.35; }
.onboarding-goal-wrap { display: none; margin-top: 11px; }
.onboarding-bucket-card.selected .onboarding-goal-wrap { display: block; }
.onboarding-goal-wrap textarea { min-height: 72px; margin: 0; padding: 10px; font-size: 12px; resize: none; }
.onboarding-error { min-height: 18px; margin: 10px 2px 0; color: #b42318; font-size: 12px; font-weight: 750; }
.onboarding-footer { position: sticky; bottom: calc(-28px - env(safe-area-inset-bottom)); margin: 10px -18px calc(-28px - env(safe-area-inset-bottom)); padding: 14px 18px calc(20px + env(safe-area-inset-bottom)); background: linear-gradient(to top, #f6f7fb 75%, rgba(246,247,251,0)); }
.onboarding-start-button { width: 100%; border: 0; border-radius: 17px; padding: 16px; background: var(--primary); color: white; font-weight: 900; box-shadow: 0 10px 25px rgba(79,70,229,.22); }
.onboarding-footer p { margin: 8px 0 0; color: var(--muted); text-align: center; font-size: 10px; }
.settings-bucket-goals { display: grid; gap: 10px; margin: 13px 0; }
.settings-bucket-goal { padding: 12px; border: 1px solid var(--border); border-radius: 15px; background: #fbfbfd; }
.settings-bucket-goal label { margin: 0; }
.settings-bucket-goal textarea { min-height: 62px; resize: vertical; }
@media (max-width: 355px) { .onboarding-bucket-grid { grid-template-columns: 1fr; } }

/* Profile-first settings redesign */
.profile-avatar-button {
  width: 44px; height: 44px; border: 0; border-radius: 15px;
  background: linear-gradient(145deg, #ecebff, #ffffff); color: var(--primary);
  display: grid; place-items: center; font-size: 20px;
  box-shadow: 0 6px 18px rgba(38,40,70,.08);
}
.profile-panel { background: #f7f7fb !important; }
.profile-heading { margin-bottom: 16px; }
.profile-hero {
  display: flex; align-items: center; gap: 14px; padding: 17px;
  border-radius: 22px; color: white;
  background: linear-gradient(145deg, #6658f5, #4037bd);
  box-shadow: 0 12px 26px rgba(79,70,229,.21);
}
.profile-avatar-large {
  width: 58px; height: 58px; display: grid; place-items: center;
  border-radius: 19px; background: rgba(255,255,255,.16); font-size: 29px;
}
.profile-hero h3 { margin: 2px 0 3px; font-size: 24px; }
.profile-hero p { margin: 0; font-size: 12px; opacity: .82; }
.profile-level { font-size: 10px !important; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.profile-main-quest {
  width: 100%; margin-top: 12px; display: grid; grid-template-columns: 42px 1fr auto;
  align-items: center; gap: 11px; padding: 15px; border: 0; border-radius: 19px;
  background: white; color: var(--ink); text-align: left;
  box-shadow: 0 5px 16px rgba(38,40,70,.05);
}
.profile-row-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 13px; background: var(--surface-soft); font-size: 19px; }
.profile-row-copy { min-width: 0; display: grid; gap: 3px; }
.profile-row-copy small { color: var(--muted); font-size: 10px; line-height: 1.25; }
.profile-row-copy strong { font-size: 13px; line-height: 1.35; }
.profile-row-copy em { color: var(--primary); font-style: normal; font-size: 9px; font-weight: 800; }
.profile-main-quest .profile-row-copy small { color: var(--primary); font-weight: 900; letter-spacing: .11em; }
.profile-chevron { color: #aaaabd; font-size: 26px; font-weight: 400; }
.profile-section { margin-top: 24px; }
.profile-section-heading { display: flex; align-items: end; justify-content: space-between; margin: 0 2px 10px; }
.profile-section-heading h3 { margin: 3px 0 0; font-size: 19px; }
.profile-section-heading > span { color: var(--muted); font-size: 10px; font-weight: 800; }
.profile-focus-list, .profile-preference-list { overflow: hidden; border-radius: 19px; background: white; box-shadow: 0 5px 16px rgba(38,40,70,.045); }
.profile-focus-row, .profile-preference-row {
  width: 100%; display: grid; grid-template-columns: 42px 1fr auto; align-items: center;
  gap: 11px; padding: 13px 14px; border: 0; border-bottom: 1px solid var(--border);
  background: white; color: var(--ink); text-align: left;
}
.profile-focus-row:last-child, .profile-preference-row:last-child { border-bottom: 0; }
.profile-focus-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 13px; background: #f4f4fa; font-size: 20px; }
.profile-add-focus { width: 100%; margin-top: 9px; border: 0; border-radius: 14px; padding: 12px; background: #ebeafe; color: var(--primary-dark); font-weight: 850; }
.profile-empty-focus { padding: 18px; color: var(--muted); text-align: center; font-size: 12px; }
.profile-preference-row input[type="time"] { width: 98px; margin: 0; padding: 8px; font-size: 12px; }
.goal-editor-icon { width: 64px; height: 64px; display: grid; place-items: center; margin: 0 auto 14px; border-radius: 21px; background: var(--surface-soft); font-size: 32px; }
.goal-editor-prompt { margin: 0 auto 14px; max-width: 390px; color: var(--muted); text-align: center; line-height: 1.5; font-size: 13px; }
#goalEditorInput { min-height: 132px; margin-bottom: 14px; font-size: 15px; line-height: 1.5; }
.goal-editor-disable { width: 100%; margin-top: 8px; padding: 12px; border: 0; background: transparent; color: #b42318; font-weight: 750; }
.focus-manager-intro { color: var(--muted); line-height: 1.5; font-size: 13px; }
.focus-manager-list { display: grid; gap: 9px; margin-top: 16px; }
.focus-manager-row { display: grid; grid-template-columns: 42px 1fr 32px; align-items: center; gap: 10px; padding: 13px; border: 1px solid var(--border); border-radius: 16px; background: white; color: var(--ink); text-align: left; }
.focus-manager-row > span:first-child { font-size: 22px; }
.focus-manager-check { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: #efeff5; color: var(--muted); font-weight: 900; }
.focus-manager-row.active { border-color: #b9b4ff; background: #f8f7ff; }
.focus-manager-row.active .focus-manager-check { background: var(--primary); color: white; }

/* Goals & growth dashboard */
.main-quest-goal-card {
  width: 100%; border: 0; border-radius: 21px; padding: 17px;
  display: grid; grid-template-columns: 43px 1fr auto; align-items: center; gap: 12px;
  color: white; text-align: left; background: linear-gradient(135deg, #6458f5, #4338ca);
  box-shadow: 0 10px 24px rgba(79,70,229,.20);
}
.main-quest-goal-icon { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 14px; background: rgba(255,255,255,.16); font-size: 22px; }
.main-quest-goal-card small { display: block; margin-bottom: 4px; font-size: 9px; font-weight: 900; letter-spacing: .13em; opacity: .76; }
.main-quest-goal-card strong { display: block; font-size: 14px; line-height: 1.38; }
.goals-view-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 22px 2px 11px; }
.goals-view-heading span { min-width: 0; }
.goals-view-heading strong, .goals-view-heading small { display: block; }
.goals-view-heading strong { font-size: 16px; }
.goals-view-heading small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.goals-view-heading button { border: 0; border-radius: 999px; padding: 8px 12px; background: var(--surface-soft); color: var(--primary-dark); font-size: 11px; font-weight: 850; }
.goal-progress-list { display: grid; gap: 12px; }
.goal-progress-card {
  width: 100%; border: 1px solid var(--border); border-radius: 20px; padding: 15px;
  background: #fff; color: var(--ink); text-align: left; box-shadow: 0 5px 18px rgba(38,40,70,.045);
}
.goal-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.goal-card-identity { display: flex; align-items: center; gap: 11px; min-width: 0; }
.goal-card-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 13px; background: var(--surface-soft); font-size: 21px; }
.goal-card-identity strong, .goal-card-identity small { display: block; }
.goal-card-identity strong { font-size: 16px; }
.goal-card-identity small { margin-top: 2px; color: var(--primary); font-size: 10px; font-weight: 850; }
.goal-card-chevron { font-size: 25px; line-height: 1; opacity: .68; }
.goal-card-purpose { display: -webkit-box; margin: 12px 1px 14px; overflow: hidden; color: var(--muted); font-size: 12px; line-height: 1.45; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.goal-card-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-bottom: 13px; }
.goal-card-stats > span { padding: 9px 5px; border-radius: 12px; background: #f7f7fb; text-align: center; }
.goal-card-stats strong, .goal-card-stats small { display: block; }
.goal-card-stats strong { font-size: 15px; }
.goal-card-stats small { margin-top: 2px; color: var(--muted); font-size: 8px; font-weight: 750; }
.goal-card-level-row { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 6px; color: var(--muted); font-size: 9px; }
.goal-card-level-row strong { color: var(--primary); }
.goals-empty-state { padding: 24px; border-radius: 18px; background: var(--surface-soft); color: var(--muted); text-align: center; font-size: 12px; line-height: 1.5; }


/* My Journey */
.journey-summary {
  display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 12px;
  margin: 14px 0 18px; padding: 14px 15px; border-radius: 18px;
  background: linear-gradient(135deg, #f4f2ff, #f8f8fc); border: 1px solid #e5e1ff;
}
.journey-summary-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; background: white; font-size: 21px; }
.journey-summary strong, .journey-summary small { display: block; }
.journey-summary strong { font-size: 14px; line-height: 1.25; }
.journey-summary small { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.4; }
.journey-card-list { display: grid; gap: 11px; }
.journey-card {
  width: 100%; padding: 14px; border: 1px solid var(--border); border-radius: 19px;
  background: white; color: var(--ink); text-align: left; box-shadow: 0 5px 16px rgba(38,40,70,.04);
}
.journey-card-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.journey-card-identity { display: grid; grid-template-columns: 39px 1fr; align-items: start; gap: 10px; min-width: 0; }
.journey-card-icon { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 13px; background: var(--surface-soft); font-size: 20px; }
.journey-card-identity small, .journey-card-identity strong { display: block; }
.journey-card-identity small { margin-bottom: 3px; color: var(--muted); font-size: 8px; font-weight: 900; letter-spacing: .11em; }
.journey-card-identity strong { display: -webkit-box; overflow: hidden; font-size: 13px; line-height: 1.35; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.journey-momentum-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin: 12px 0 6px; }
.journey-status { display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 900; }
.journey-status b { font-size: 11px; }
.journey-action { padding: 5px 8px; border-radius: 999px; background: #f4f4f8; color: var(--muted); font-size: 8px; font-weight: 850; }
.journey-coach { display: block; color: var(--muted); font-size: 10px; line-height: 1.4; }
.journey-card.strong { border-color: #b9ead5; background: linear-gradient(180deg, #fff, #f8fffb); }
.journey-card.strong .journey-status { color: #13704e; }
.journey-card.growing { border-color: #d8d2ff; background: linear-gradient(180deg, #fff, #faf9ff); }
.journey-card.growing .journey-status { color: var(--primary); }
.journey-card.steady .journey-status { color: #7a6a23; }
.journey-card.attention { border-color: #f0dfb7; background: linear-gradient(180deg, #fff, #fffdf7); }
.journey-card.attention .journey-status { color: #9a6500; }
.bottom-nav .nav-item[data-view="goals"] { line-height: 1.05; }


/* Chapters — the living journey book */
.chapter-toolbar { display:grid; grid-template-columns:40px 1fr 40px; align-items:center; gap:10px; margin-bottom:14px; }
.chapter-toolbar button { width:40px; height:40px; border:0; border-radius:50%; background:var(--surface-soft); color:var(--primary-dark); font-size:24px; }
.chapter-toolbar button:disabled { opacity:.28; }
.chapter-toolbar span { text-align:center; }
.chapter-toolbar small,.chapter-toolbar strong { display:block; }
.chapter-toolbar small { color:var(--primary); font-size:9px; font-weight:900; letter-spacing:.14em; }
.chapter-toolbar strong { margin-top:3px; font-size:14px; }
.chapter-page { position:relative; overflow:hidden; padding:22px 18px 20px; border:1px solid #e6e0d5; border-radius:8px 22px 22px 8px; background:linear-gradient(90deg,#eee7da 0,#fffdf8 3%,#fff 100%); box-shadow:0 16px 34px rgba(64,51,34,.10); }
.chapter-page::before { content:""; position:absolute; left:8px; top:0; bottom:0; width:1px; background:#ebe1d1; box-shadow:3px 0 #f4eee4; }
.chapter-page.current { border-color:#d9d4ff; background:linear-gradient(90deg,#ece9ff 0,#fbfaff 3%,#fff 100%); }
.chapter-page-heading { text-align:center; padding:2px 9px 17px; }
.chapter-bookmark { display:inline-block; padding:5px 9px; border-radius:999px; background:#f0edff; color:var(--primary-dark); font-size:8px; font-weight:900; letter-spacing:.15em; }
.chapter-page-heading h3 { margin:12px 0 7px; font-family:Georgia,"Times New Roman",serif; font-size:25px; letter-spacing:-.025em; }
.chapter-page-heading p { margin:0 auto; max-width:390px; color:var(--muted); font-size:11px; line-height:1.5; }
.chapter-affirmation { margin:0 0 16px; padding:16px; border-top:1px solid #eee9df; border-bottom:1px solid #eee9df; color:#444155; font-family:Georgia,"Times New Roman",serif; font-size:15px; font-weight:500; text-align:center; line-height:1.5; }
.chapter-totals { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:18px; }
.chapter-totals span { padding:10px 5px; border-radius:13px; background:#f7f5f1; text-align:center; }
.chapter-totals strong,.chapter-totals small { display:block; }
.chapter-totals strong { font-size:17px; }
.chapter-totals small { margin-top:2px; color:var(--muted); font-size:8px; }
.chapter-section { margin-top:15px; }
.chapter-section-title { display:grid; grid-template-columns:26px 1fr auto; align-items:center; gap:7px; margin-bottom:7px; }
.chapter-section-title strong { font-size:12px; }
.chapter-section-title small { color:var(--muted); font-size:9px; }
.chapter-task-list { display:grid; gap:6px; }
.chapter-task { display:grid; grid-template-columns:22px 1fr auto; align-items:center; gap:7px; padding:9px 10px; border-radius:11px; background:#f8f7f3; }
.chapter-task > span { color:#aaa5b2; font-weight:900; }
.chapter-task.complete > span { color:var(--success); }
.chapter-task p { margin:0; font-size:11px; line-height:1.35; }
.chapter-task.open p { color:var(--muted); }
.chapter-task small { color:var(--primary); font-size:8px; font-weight:850; }
.chapter-empty { padding:24px 15px; border:1px dashed #ded9cf; border-radius:15px; color:var(--muted); text-align:center; font-size:11px; line-height:1.5; }
.chapter-closing { margin-top:22px; padding:22px 14px 6px; border-top:1px solid #e9e3d9; text-align:center; }
.chapter-closing > span { color:var(--primary); font-size:24px; }
.chapter-closing h3 { margin:7px 0 6px; font-family:Georgia,"Times New Roman",serif; font-size:20px; }
.chapter-closing p { margin:0; color:var(--muted); font-size:11px; line-height:1.5; }
.chapter-closing.complete > span { color:#c58b16; }
.chapter-premium-card { width:100%; display:grid; grid-template-columns:42px 1fr auto; align-items:center; gap:11px; margin-top:14px; padding:14px; border:0; border-radius:18px; background:linear-gradient(135deg,#25243c,#423d70); color:white; text-align:left; }
.chapter-premium-card > span:first-child { width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:rgba(255,255,255,.12); font-size:21px; }
.chapter-premium-card strong,.chapter-premium-card small { display:block; }
.chapter-premium-card strong { font-size:12px; }
.chapter-premium-card small { margin-top:3px; opacity:.72; font-size:9px; line-height:1.35; }
.chapter-premium-card b { font-size:23px; }
.journey-personal-status { display:inline-flex; align-items:center; gap:5px; margin-bottom:6px; color:#55546a; font-size:9px; font-weight:800; }
.goal-status-wrap { padding:12px; border-radius:15px; background:#f7f7fb; }
.premium-panel { padding-bottom:calc(28px + env(safe-area-inset-bottom)); }
.premium-hero { padding:20px 16px; border-radius:21px; background:linear-gradient(140deg,#f0edff,#fff); text-align:center; }
.premium-hero > span { font-size:42px; }
.premium-hero h3 { margin:8px 0 6px; font-size:20px; }
.premium-hero p { margin:0; color:var(--muted); font-size:12px; line-height:1.5; }
.premium-feature-list { display:grid; gap:9px; margin:16px 0; }
.premium-feature-list > div { display:grid; grid-template-columns:38px 1fr; gap:10px; padding:12px; border:1px solid var(--border); border-radius:15px; }
.premium-feature-list > div > span { font-size:21px; }
.premium-feature-list p { margin:0; }
.premium-feature-list strong,.premium-feature-list small { display:block; }
.premium-feature-list strong { font-size:12px; }
.premium-feature-list small { margin-top:3px; color:var(--muted); font-size:9px; line-height:1.4; }
.premium-note { color:var(--muted); text-align:center; font-size:9px; line-height:1.4; }
.bottom-nav .nav-item { min-width:0; }
.bottom-nav .nav-item span { font-size:18px; }

/* First-use guided tour */
.guide-overlay { position:fixed; inset:0; z-index:3000; pointer-events:none; }
.guide-scrim { position:absolute; inset:0; background:rgba(15,15,29,.72); backdrop-filter:blur(2px); pointer-events:auto; }
.guide-target { position:relative !important; z-index:3002 !important; border-radius:18px; box-shadow:0 0 0 5px rgba(255,255,255,.98),0 0 0 9px rgba(111,99,255,.9) !important; pointer-events:none !important; }
.bottom-nav.guide-parent-lift { z-index:3002 !important; pointer-events:none; }
.bottom-nav.guide-parent-lift .nav-item { opacity:.32; filter:saturate(.45); }
.bottom-nav.guide-parent-lift .nav-item.guide-target { opacity:1; filter:none; background:#fff; color:var(--primary); }
.guide-card { position:fixed; z-index:3010; left:16px; right:16px; bottom:calc(18px + env(safe-area-inset-bottom)); max-width:430px; margin:auto; padding:18px; border-radius:22px; background:#fff; box-shadow:0 24px 70px rgba(0,0,0,.28); pointer-events:auto; transition:top .2s ease,bottom .2s ease; }
.guide-card.above { top:calc(18px + env(safe-area-inset-top)); bottom:auto; }
.guide-card-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.guide-card-top span { color:var(--primary); font-size:10px; font-weight:900; letter-spacing:.12em; }
.guide-card-top button { border:0; background:transparent; color:var(--muted); font-size:11px; font-weight:800; }
.guide-icon { margin-top:13px; font-size:29px; }
.guide-card h2 { margin:7px 0 6px; font-size:20px; letter-spacing:-.025em; }
.guide-card p { margin:0; color:var(--muted); font-size:13px; line-height:1.5; }
.guide-actions { display:grid; grid-template-columns:auto 1fr; gap:9px; margin-top:17px; }
.guide-actions button { border:0; border-radius:13px; padding:12px 14px; font-weight:850; }
.guide-back { background:#f1f1f6; color:var(--muted); }
.guide-next { background:var(--primary); color:#fff; opacity:1 !important; filter:none !important; box-shadow:0 8px 20px rgba(79,70,229,.28); }
.guide-next:hover,.guide-next:focus-visible { background:var(--primary-dark); color:#fff; }
.guide-next:disabled { opacity:.45 !important; box-shadow:none; cursor:not-allowed; }
.guide-actions .guide-back:disabled { visibility:hidden; }
@media (min-width:600px) { .guide-card { left:50%; right:auto; width:390px; transform:translateX(-50%); } }

/* =========================================================
   MOMENTUM DARK BRAND SYSTEM — My Motivational Results
   ========================================================= */
:root {
  --bg: #070816;
  --surface: #101326;
  --surface-soft: #181b35;
  --surface-raised: #15192f;
  --ink: #f7f7ff;
  --muted: #989db6;
  --primary: #6d5dfc;
  --primary-bright: #8b7cff;
  --primary-dark: #b7adff;
  --success: #42d69a;
  --warning: #ffbd5c;
  --border: rgba(255,255,255,.09);
  --shadow: 0 18px 50px rgba(0,0,0,.34);
}
html, body { background: var(--bg); color: var(--ink); }
body {
  background:
    radial-gradient(circle at 10% 3%, rgba(88,53,194,.25), transparent 24rem),
    radial-gradient(circle at 92% 22%, rgba(33,104,255,.13), transparent 25rem),
    #070816;
}
body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: -1;
  background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size: 28px 28px; mask-image: linear-gradient(to bottom, #000, transparent 80%);
}
.app-shell { background: transparent; }
.topbar { padding-top: 20px; }
.topbar h1 { color: #fff; font-weight: 900; }
.eyebrow { color: var(--primary-bright); }
.icon-button, .profile-avatar-button {
  background: rgba(255,255,255,.06); color: #fff; border: 1px solid var(--border); box-shadow: 0 10px 28px rgba(0,0,0,.25);
}
.profile-avatar-button span { display: grid; place-items: center; }
.app-icon { width: 21px; height: 21px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.affirmation-card {
  background: radial-gradient(circle at 90% 8%, rgba(255,255,255,.14), transparent 32%), linear-gradient(135deg,#7768ff,#5546ef 52%,#30298f);
  border: 1px solid rgba(255,255,255,.14); box-shadow: 0 22px 55px rgba(55,42,170,.3);
}
.level-card, .goal-bucket-button, .empty-state, .preview-row, .preview-empty,
.tomorrow-bucket-card, .library-item, .bucket-card, .dialog-task-card,
.profile-main-quest, .profile-section, .profile-hero, .profile-preference-row,
.journey-card, .calendar-shell, .chapter-page, .premium-feature-list > div {
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.025));
  border-color: var(--border); color: var(--ink); box-shadow: var(--shadow);
}
.level-card { border: 1px solid var(--border); }
.muted, .progress-caption, .completion-summary, .bucket-completion-text, .task-meta,
.preview-empty, .library-item p, .bucket-card p, .settings-group p, .status-text,
.focus-manager-intro, .profile-row-copy small, .premium-note { color: var(--muted); }
.streak-badge { background: rgba(255,183,77,.12); color: #ffc56d; border: 1px solid rgba(255,183,77,.18); }
.progress-track { background: rgba(255,255,255,.08); }
.progress-fill { background: linear-gradient(90deg,#8b7cff,#5aa8ff,#ee6ecb); }
.primary-small, .primary-button, .briefing-start, .onboarding-start-button {
  background: linear-gradient(90deg,#6d5dfc,#4c8dff); color: #fff; box-shadow: 0 14px 35px rgba(83,71,239,.28);
}
.secondary-small, .secondary-button, .profile-add-focus {
  background: rgba(109,93,252,.14); color: #c5beff; border: 1px solid rgba(139,124,255,.2);
}
.goal-bucket-button { border: 1px solid var(--border); }
.goal-bucket-button:hover { border-color: rgba(139,124,255,.4); }
.bucket-count-badge, .xp-pill { background: rgba(109,93,252,.14); color: #c5beff; }
.bucket-card-progress-row strong, .bucket-dialog-summary strong { color: #9c91ff; }
.bucket-icon-button, .task-menu { color: var(--ink); }
.dialog-task-card.completed { background: rgba(66,214,154,.06); border-color: rgba(66,214,154,.28); }
.complete-button { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.18); color: #fff; }
.dialog-task-card.completed .complete-button { background: rgba(66,214,154,.16); border-color: rgba(66,214,154,.55); color: #72e5b5; }
.bottom-nav {
  background: rgba(7,8,22,.9); border-color: var(--border); backdrop-filter: blur(22px); box-shadow: 0 -18px 50px rgba(0,0,0,.28);
}
.nav-item { color: #747a95; }
.nav-item.active { color: #a99fff; }
.nav-item .app-icon { display: block; margin: 0 auto 4px; }
.nav-item.active .app-icon { filter: drop-shadow(0 0 8px rgba(139,124,255,.55)); }
dialog::backdrop { background: rgba(2,3,11,.76); backdrop-filter: blur(8px); }
.sheet-dialog form, .sheet-panel, .celebration-content {
  background: #0d1020; color: var(--ink); border: 1px solid var(--border); border-bottom: 0;
}
.sheet-handle { background: rgba(255,255,255,.18); }
label { color: #e8e9f5; }
input, select, textarea {
  background: rgba(255,255,255,.055) !important; color: #fff !important; border-color: rgba(255,255,255,.11) !important;
}
input::placeholder, textarea::placeholder { color: #737993; }
select option { background: #12152a; color: #fff; }
.celebration-dialog { background: transparent; }
.celebration-content > p:not(.eyebrow) { color: #a99fff; }
.onboarding-dialog, .morning-briefing { background: #070816; color: #fff; }
.onboarding-screen, .briefing-screen {
  background: radial-gradient(circle at 50% 0%,rgba(86,66,224,.28),transparent 24rem),#070816; color: #fff;
}
.onboarding-header p, .onboarding-main-quest small, .onboarding-footer p { color: var(--muted); }
.onboarding-mark { background: linear-gradient(135deg,#6d5dfc,#4c8dff); box-shadow: 0 14px 40px rgba(83,71,239,.35); }
.onboarding-bucket-card { background: rgba(255,255,255,.045); border-color: var(--border); color: #fff; box-shadow: none; }
.onboarding-bucket-card.selected { background: rgba(109,93,252,.11); border-color: #796cff; }
.onboarding-bucket-card textarea { background: rgba(0,0,0,.17) !important; }
.briefing-screen { background: radial-gradient(circle at 50% 12%,rgba(89,69,228,.42),transparent 26rem),linear-gradient(155deg,#14122d,#070816 65%); }
.briefing-quest, .briefing-affirmation, .briefing-yesterday { background: rgba(255,255,255,.065); border-color: rgba(255,255,255,.11); color: #fff; }
.briefing-settings-link { color: #b9b1ff; }
.profile-panel { background: #0d1020; }
.profile-hero { background: linear-gradient(135deg,rgba(109,93,252,.22),rgba(52,112,255,.08)); }
.profile-avatar-large, .profile-row-icon { background: rgba(109,93,252,.13); color: #c2bbff; }
.profile-main-quest, .profile-preference-row, .profile-focus-row { border-color: var(--border); }
.profile-focus-row, .focus-manager-row { background: rgba(255,255,255,.035); color: #fff; border-color: var(--border); }
.focus-manager-row.active { background: rgba(109,93,252,.12); border-color: rgba(139,124,255,.4); }
.guide-scrim { background: rgba(1,2,8,.77); }
.guide-card { background: #11152a; color: #fff; border: 1px solid rgba(255,255,255,.12); box-shadow: 0 30px 90px rgba(0,0,0,.6); }
.guide-card p, .guide-card-top { color: var(--muted); }
.guide-back { color: #c5beff; background: rgba(109,93,252,.12); }
.guide-next { background: linear-gradient(90deg,#6d5dfc,#4c8dff); }
.guide-target { outline-color: #9e94ff !important; }
.premium-hero { background: linear-gradient(135deg,rgba(109,93,252,.18),rgba(238,110,203,.08)); border: 1px solid var(--border); }
.premium-feature-list > div { box-shadow: none; }
.calendar-day, .chapter-task-row, .goals-view-heading, .journey-overview { border-color: var(--border) !important; }
.calendar-day { background: rgba(255,255,255,.035) !important; color: #fff; }
.calendar-day.has-tasks { background: rgba(109,93,252,.09) !important; }
.calendar-day.perfect { background: rgba(66,214,154,.12) !important; }
.chapter-page { background: linear-gradient(145deg,#15182d,#0e1020); }
.chapter-page, .chapter-page * { color: inherit; }
.chapter-task-row { background: rgba(255,255,255,.035) !important; }
.journey-card { border-color: var(--border) !important; }
.journey-card-status, .journey-card-coach { color: var(--muted) !important; }

@media (min-width:600px) {
  body { padding-top: 20px; }
  .app-shell { background: rgba(7,8,22,.8); border: 1px solid var(--border); box-shadow: 0 0 80px rgba(0,0,0,.45); }
}

/* =========================================================
   MOMENTUM V18 — COMPLETE DARK COMPONENT PASS
   Applies the final brand system to every sheet, popup and view.
   ========================================================= */

/* Universal dialog shell */
dialog, dialog[open] { color: var(--ink); }
.sheet-dialog,
.celebration-dialog,
.profile-dialog {
  background: transparent !important;
  color: var(--ink) !important;
  box-shadow: none !important;
}
.sheet-dialog form,
.sheet-dialog .sheet-panel,
.profile-dialog .profile-panel,
.celebration-dialog .celebration-content {
  background:
    radial-gradient(circle at 88% 0%, rgba(83,70,239,.16), transparent 18rem),
    linear-gradient(180deg,#11152a,#0b0e1d) !important;
  color: var(--ink) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: 0 -24px 70px rgba(0,0,0,.52) !important;
}
.sheet-dialog form,
.sheet-dialog .sheet-panel { border-radius: 28px 28px 0 0 !important; }
.dialog-heading { border-bottom: 1px solid rgba(255,255,255,.08); padding-bottom: 16px; }
.dialog-heading h2, .sheet-panel h2, .sheet-panel h3, .sheet-panel strong,
.sheet-dialog form h2, .sheet-dialog form h3 { color: #fff !important; }
.sheet-handle { background: rgba(255,255,255,.22) !important; }

/* Form controls */
.sheet-dialog label, .sheet-dialog legend { color: #f0f1ff !important; }
.sheet-dialog input:not([type="checkbox"]):not([type="radio"]),
.sheet-dialog select,
.sheet-dialog textarea {
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}
.sheet-dialog input:focus,
.sheet-dialog select:focus,
.sheet-dialog textarea:focus {
  outline: 2px solid rgba(139,124,255,.46) !important;
  outline-offset: 1px;
  border-color: #8b7cff !important;
}
.sheet-dialog input::placeholder, .sheet-dialog textarea::placeholder { color: #747b98 !important; }
.check-row input[type="checkbox"] { accent-color: #7567ff; }

/* Reusable dark cards inside every popup */
.library-item,
.bucket-card,
.dialog-task-card,
.settings-group,
.settings-bucket-goal,
.focus-manager-row,
.profile-main-quest,
.profile-focus-row,
.profile-preference-row,
.profile-focus-list,
.profile-preference-list,
.premium-feature-list > div,
.calendar-day-details,
.month-summary > div,
.journey-card,
.main-quest-goal-card,
.chapter-page,
.preview-row,
.preview-empty {
  background: linear-gradient(145deg,rgba(255,255,255,.06),rgba(255,255,255,.025)) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  color: #f7f7ff !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.22) !important;
}
.library-item p, .bucket-card p, .dialog-task-card p,
.settings-group p, .focus-manager-intro, .profile-row-copy small,
.goal-editor-prompt, .premium-note, .calendar-day-details,
.chapter-page-heading p, .chapter-ending p { color: #9da3bd !important; }
.library-actions button, .task-edit-button, .tomorrow-edit {
  background: rgba(109,93,252,.13) !important;
  color: #c7c1ff !important;
}
.task-delete-button, .tomorrow-delete, .goal-editor-disable { color: #ff8290 !important; }

/* Profile */
.profile-panel { background: linear-gradient(180deg,#11152a,#0b0e1d) !important; }
.profile-hero {
  background: linear-gradient(135deg,#302970,#171c42) !important;
  border: 1px solid rgba(139,124,255,.3) !important;
  box-shadow: 0 22px 50px rgba(24,17,91,.38) !important;
}
.profile-avatar-large,
.profile-row-icon,
.profile-focus-icon,
.goal-editor-icon {
  background: linear-gradient(145deg,rgba(109,93,252,.2),rgba(90,168,255,.08)) !important;
  border: 1px solid rgba(139,124,255,.22) !important;
  color: #d0cbff !important;
}
.profile-main-quest,
.profile-focus-row,
.profile-preference-row { background: rgba(255,255,255,.035) !important; }
.profile-focus-list, .profile-preference-list { background: rgba(255,255,255,.018) !important; }
.profile-section-heading h3, .profile-row-copy strong { color: #fff !important; }
.profile-chevron { color: #7f87a8 !important; }
.profile-add-focus {
  background: linear-gradient(90deg,rgba(109,93,252,.22),rgba(76,141,255,.14)) !important;
  border: 1px solid rgba(139,124,255,.24) !important;
  color: #c9c3ff !important;
}

/* Focus manager and goal editor */
.focus-manager-row { background: rgba(255,255,255,.035) !important; }
.focus-manager-row.active {
  background: linear-gradient(135deg,rgba(109,93,252,.18),rgba(76,141,255,.08)) !important;
  border-color: rgba(139,124,255,.48) !important;
}
.focus-manager-check { background: rgba(255,255,255,.08) !important; color: #8c93ad !important; }
.focus-manager-row.active .focus-manager-check { background: linear-gradient(135deg,#7567ff,#4c8dff) !important; color:#fff !important; }

/* Task bucket popup */
.bucket-dialog-summary { color: #959cb8 !important; }
.dialog-task-card { grid-template-columns:48px 1fr auto; }
.dialog-task-card.completed { background: rgba(66,214,154,.075) !important; border-color: rgba(66,214,154,.3) !important; }
.complete-button { background: rgba(255,255,255,.04) !important; color:#fff !important; border-color:rgba(255,255,255,.2) !important; }
.dialog-task-card.completed .complete-button { background:rgba(66,214,154,.17) !important; color:#75e9b8 !important; }

/* Presets and history */
.library-actions button { border:1px solid rgba(139,124,255,.18) !important; }
.calendar-toolbar button, .chapter-toolbar button {
  background: rgba(109,93,252,.14) !important;
  color:#bdb6ff !important;
  border:1px solid rgba(139,124,255,.18) !important;
}
.month-summary > div { box-shadow:none !important; }
.calendar-cell {
  background: rgba(255,255,255,.045) !important;
  color:#f4f5ff !important;
  border:1px solid rgba(255,255,255,.055) !important;
}
.calendar-cell.perfect { background:rgba(66,214,154,.14) !important; color:#91efc8 !important; }
.calendar-cell.partial { background:rgba(255,189,92,.13) !important; color:#ffd28d !important; }
.calendar-cell.planned { background:rgba(109,93,252,.15) !important; color:#c7c1ff !important; }

/* Chapters */
.chapter-page,
.chapter-page.current {
  background:
    radial-gradient(circle at 100% 0%,rgba(109,93,252,.12),transparent 17rem),
    linear-gradient(145deg,#171a31,#0e1121) !important;
  border-color:rgba(255,255,255,.09) !important;
}
.chapter-page::before { background:rgba(139,124,255,.18) !important; box-shadow:3px 0 rgba(255,255,255,.025) !important; }
.chapter-bookmark { background:rgba(109,93,252,.16) !important; color:#c8c2ff !important; }
.chapter-affirmation { color:#e1e2f2 !important; border-color:rgba(255,255,255,.08) !important; }
.chapter-totals span, .chapter-task-row { background:rgba(255,255,255,.04) !important; border-color:rgba(255,255,255,.07) !important; }
.chapter-ending { border-color:rgba(255,255,255,.08) !important; }

/* Premium */
.premium-panel { background:linear-gradient(180deg,#11152a,#090b17) !important; }
.premium-hero {
  background:radial-gradient(circle at 50% 0%,rgba(109,93,252,.28),transparent 15rem),linear-gradient(145deg,#171a36,#101326) !important;
  border:1px solid rgba(139,124,255,.24) !important;
}
.premium-feature-list > div { background:rgba(255,255,255,.035) !important; box-shadow:none !important; }

/* Celebration */
.celebration-content {
  border-radius:26px !important;
  background:radial-gradient(circle at 50% 0%,rgba(109,93,252,.3),transparent 12rem),linear-gradient(145deg,#171a34,#0c0f20) !important;
}
.celebration-icon { filter:drop-shadow(0 0 20px rgba(139,124,255,.5)); }

/* Tour */
.guide-card { background:linear-gradient(145deg,#171a31,#0e1121) !important; }
.guide-card h2 { color:#fff !important; }
.guide-card p, .guide-card-top button { color:#9da3bd !important; }
.bottom-nav.guide-parent-lift .nav-item.guide-target {
  background:linear-gradient(145deg,rgba(109,93,252,.28),rgba(76,141,255,.15)) !important;
  color:#fff !important;
  border:1px solid rgba(139,124,255,.36) !important;
}

/* Onboarding */
.onboarding-dialog { background:#070816 !important; }
.onboarding-screen {
  background:radial-gradient(circle at 80% 0%,rgba(88,53,194,.25),transparent 25rem),#070816 !important;
}
.onboarding-main-quest,
.onboarding-bucket-card { background:rgba(255,255,255,.045) !important; border:1px solid rgba(255,255,255,.09) !important; color:#fff !important; }
.onboarding-bucket-card.selected { background:rgba(109,93,252,.14) !important; border-color:#8175ff !important; }
.onboarding-check { border-color:rgba(255,255,255,.22) !important; }
.onboarding-footer { background:linear-gradient(to top,#070816 75%,rgba(7,8,22,0)) !important; }

/* Buttons and accessible focus */
.primary-button, .primary-small, .briefing-start, .onboarding-start-button, .guide-next {
  background:linear-gradient(90deg,#7567ff,#4c8dff) !important;
  color:#fff !important;
}
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline:2px solid #9b91ff !important;
  outline-offset:3px;
}

/* Ensure native white surfaces never leak into dialogs */
.sheet-dialog *, .celebration-dialog * { scrollbar-color:#4f5570 transparent; }
.sheet-dialog hr { border-color:rgba(255,255,255,.08) !important; }

@media (max-width:420px) {
  .sheet-dialog form, .sheet-dialog .sheet-panel { padding-left:16px !important; padding-right:16px !important; }
  .profile-hero { padding:15px !important; }
}

/* v19 Chapters polish */
.chapter-page,
.chapter-page.current {
  border-radius: 26px !important;
  padding: 26px 18px 22px !important;
  background:
    radial-gradient(circle at 92% 0%,rgba(109,93,252,.18),transparent 16rem),
    linear-gradient(155deg,#171a33 0%,#11142a 52%,#0b0e1c 100%) !important;
  border:1px solid rgba(139,124,255,.22) !important;
  box-shadow:0 28px 70px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.035) !important;
}
.chapter-page::before { display:none !important; }
.chapter-page-heading { padding:4px 10px 20px !important; }
.chapter-page-heading h3 {
  margin:14px 0 8px !important;
  color:#fff !important;
  font-size:28px !important;
  line-height:1.08 !important;
}
.chapter-page-heading p { color:#a9aec6 !important; font-size:11px !important; }
.chapter-bookmark {
  background:linear-gradient(90deg,rgba(109,93,252,.28),rgba(76,141,255,.18)) !important;
  border:1px solid rgba(139,124,255,.25) !important;
  color:#d5d1ff !important;
  padding:6px 11px !important;
}
.chapter-affirmation {
  margin:0 0 20px !important;
  padding:22px 13px !important;
  border-color:rgba(255,255,255,.09) !important;
  color:#f3f1ff !important;
  font-size:16px !important;
  line-height:1.62 !important;
}
.chapter-totals { gap:10px !important; margin-bottom:22px !important; }
.chapter-totals span {
  min-height:78px;
  display:flex !important;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:11px 5px !important;
  border:1px solid rgba(255,255,255,.07) !important;
  background:linear-gradient(145deg,rgba(255,255,255,.065),rgba(255,255,255,.025)) !important;
}
.chapter-totals i { margin-bottom:4px; font-size:15px; font-style:normal; }
.chapter-totals strong { color:#fff !important; font-size:18px !important; }
.chapter-totals small { color:#969db8 !important; font-size:8px !important; }
.chapter-section { margin-top:22px !important; }
.chapter-section-title {
  display:grid !important;
  grid-template-columns:38px 1fr auto !important;
  align-items:center !important;
  gap:10px !important;
  margin-bottom:9px !important;
}
.chapter-section-icon {
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:linear-gradient(145deg,rgba(109,93,252,.2),rgba(76,141,255,.08));
  border:1px solid rgba(139,124,255,.2);
  font-size:19px;
}
.chapter-section-copy { min-width:0; }
.chapter-section-copy small,
.chapter-section-copy strong,
.chapter-section-copy em { display:block; }
.chapter-section-copy small { color:#8277ff !important; font-size:7px !important; font-weight:900; letter-spacing:.16em; }
.chapter-section-copy strong { margin-top:2px; color:#fff !important; font-size:13px !important; }
.chapter-section-copy em { margin-top:2px; color:#8f96b1 !important; font-size:8px; font-style:normal; }
.chapter-section-title > b { color:#bcb6ff; font-size:10px; }
.chapter-section-progress {
  height:4px;
  margin:0 0 10px 48px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.06);
}
.chapter-section-progress span {
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#7567ff,#4c8dff);
}
.chapter-task-list { gap:8px !important; }
.chapter-task {
  min-height:56px;
  display:grid !important;
  grid-template-columns:34px 1fr auto !important;
  align-items:center !important;
  gap:10px !important;
  padding:10px 12px !important;
  border-radius:15px !important;
  border:1px solid rgba(255,255,255,.075) !important;
  background:linear-gradient(145deg,rgba(255,255,255,.06),rgba(255,255,255,.025)) !important;
  color:#fff !important;
  box-shadow:inset 0 1px rgba(255,255,255,.025) !important;
}
.chapter-task.complete {
  border-color:rgba(66,214,154,.24) !important;
  background:linear-gradient(145deg,rgba(66,214,154,.09),rgba(255,255,255,.025)) !important;
}
.chapter-task-status {
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:11px;
  color:#8990aa !important;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  font-size:18px;
}
.chapter-task.complete .chapter-task-status {
  color:#6fe8b4 !important;
  background:rgba(66,214,154,.12);
  border-color:rgba(66,214,154,.22);
}
.chapter-task-copy { min-width:0; }
.chapter-task-copy strong,
.chapter-task-copy small { display:block; }
.chapter-task-copy strong {
  overflow:hidden;
  color:#f8f8ff !important;
  font-size:11px;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.chapter-task-copy small { margin-top:3px; color:#858da9 !important; font-size:8px !important; }
.chapter-xp-pill {
  padding:6px 8px;
  border-radius:999px;
  background:rgba(109,93,252,.16);
  border:1px solid rgba(139,124,255,.2);
  color:#c6c0ff !important;
  font-size:8px;
  white-space:nowrap;
}
.chapter-closing {
  margin-top:26px !important;
  padding:24px 12px 5px !important;
  border-color:rgba(255,255,255,.09) !important;
}
.chapter-closing > span { color:#9b91ff !important; }
.chapter-closing.complete > span { color:#ffd175 !important; }
.chapter-closing h3 { color:#fff !important; }
.chapter-closing p { color:#989fb9 !important; }
.chapter-premium-card {
  border:1px solid rgba(139,124,255,.24) !important;
  background:linear-gradient(135deg,#1a1d3b,#342d72) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.26) !important;
}


/* ============================================================
   MOMENTUM V20 COMPLETE COMPONENT AUDIT
   Normalizes every sheet, editor, form, state, and native control.
   ============================================================ */

:root {
  --v20-bg: #070816;
  --v20-panel: #101329;
  --v20-panel-2: #161a35;
  --v20-card: rgba(255,255,255,.055);
  --v20-card-hover: rgba(255,255,255,.085);
  --v20-line: rgba(255,255,255,.11);
  --v20-text: #f8f8ff;
  --v20-muted: #9da4bf;
  --v20-purple: #7868ff;
  --v20-blue: #4c8dff;
  --v20-pink: #ef6bc8;
  --v20-green: #4ee0aa;
  --v20-red: #ff7c91;
}

/* All dialogs and panels */
dialog.sheet-dialog,
dialog.celebration-dialog,
dialog.confirm-dialog {
  color: var(--v20-text) !important;
  background: transparent !important;
}

.sheet-dialog form,
.sheet-dialog .sheet-panel,
.profile-panel,
.premium-panel {
  background:
    radial-gradient(circle at 90% 0%, rgba(92,72,230,.16), transparent 18rem),
    linear-gradient(180deg, #121631 0%, #0c0f21 100%) !important;
  color: var(--v20-text) !important;
  border: 1px solid var(--v20-line) !important;
  box-shadow: 0 -22px 75px rgba(0,0,0,.58) !important;
}

.sheet-dialog .sheet-handle { background: rgba(255,255,255,.25) !important; }
.dialog-heading { border-bottom: 1px solid var(--v20-line); padding-bottom: 18px; }
.dialog-heading h2 { color: var(--v20-text) !important; letter-spacing: -.025em; }
.dialog-heading .eyebrow { color: #8f80ff !important; }
.icon-button { background: rgba(255,255,255,.055) !important; border: 1px solid var(--v20-line) !important; color: #fff !important; box-shadow: 0 12px 30px rgba(0,0,0,.25) !important; }
.icon-button:hover { background: rgba(255,255,255,.1) !important; }

/* Every native field */
.sheet-dialog label,
.onboarding-dialog label { color: #dfe2f3 !important; }
.sheet-dialog input:not([type="checkbox"]):not([type="hidden"]),
.sheet-dialog textarea,
.sheet-dialog select,
.onboarding-dialog input:not([type="checkbox"]),
.onboarding-dialog textarea,
.onboarding-dialog select {
  display: block;
  width: 100%;
  color: var(--v20-text) !important;
  caret-color: #8b7cff;
  background: #171b31 !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 15px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
  outline: none !important;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.sheet-dialog textarea { min-height: 118px !important; max-height: 210px; resize: vertical; line-height: 1.55; }
.sheet-dialog input::placeholder,
.sheet-dialog textarea::placeholder,
.onboarding-dialog input::placeholder,
.onboarding-dialog textarea::placeholder { color: #7f879f !important; opacity: 1; }
.sheet-dialog input:focus,
.sheet-dialog textarea:focus,
.sheet-dialog select:focus,
.onboarding-dialog input:focus,
.onboarding-dialog textarea:focus,
.onboarding-dialog select:focus {
  background: #1a1f39 !important;
  border-color: #8b7cff !important;
  box-shadow: 0 0 0 3px rgba(139,124,255,.16), 0 14px 35px rgba(0,0,0,.2) !important;
}
.sheet-dialog select,
.onboarding-dialog select {
  appearance: none;
  padding-right: 46px !important;
  background-image: linear-gradient(45deg,transparent 50%,#a8afff 50%),linear-gradient(135deg,#a8afff 50%,transparent 50%) !important;
  background-position: calc(100% - 20px) 53%,calc(100% - 14px) 53% !important;
  background-size: 6px 6px,6px 6px !important;
  background-repeat: no-repeat !important;
}
.sheet-dialog select option { color: #fff !important; background: #15192f !important; }
input[type="time"] { color-scheme: dark; }
input[type="time"]::-webkit-calendar-picker-indicator { filter: invert(1); opacity:.75; }
input[type="checkbox"] { accent-color: #7868ff; }

/* Buttons */
.primary-button,
.primary-small,
.onboarding-start-button,
.briefing-start {
  color: #fff !important;
  background: linear-gradient(100deg,#7868ff,#4c8dff) !important;
  border: 0 !important;
  box-shadow: 0 14px 35px rgba(83,71,239,.28) !important;
}
.primary-button:hover,
.primary-small:hover { transform: translateY(-1px); filter: brightness(1.07); }
.secondary-button,
.secondary-small {
  color: #e8e9ff !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid var(--v20-line) !important;
}
.primary-button.danger,
.confirm-actions .primary-button.danger { background: linear-gradient(100deg,#e85070,#ff7c91) !important; }

/* Goal editor */
.goal-editor-icon {
  width: 68px !important;
  height: 68px !important;
  margin: 22px auto 14px !important;
  border-radius: 22px !important;
  background: linear-gradient(145deg,rgba(120,104,255,.24),rgba(76,141,255,.1)) !important;
  border: 1px solid rgba(139,124,255,.3) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.28) !important;
}
.goal-editor-prompt { color: #abb1c9 !important; font-size: 14px !important; line-height: 1.65 !important; }
.goal-status-wrap {
  display: block;
  padding: 14px !important;
  border: 1px solid var(--v20-line) !important;
  border-radius: 17px !important;
  background: rgba(255,255,255,.035) !important;
}
.goal-status-wrap .field-label { display:block; margin-bottom:8px; color:#b8bfd7; font-size:11px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; }
.goal-editor-disable {
  color: #aeb4ca !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 13px;
  padding: 12px;
}
.goal-editor-disable:hover { color:#fff !important; background:rgba(255,255,255,.045) !important; border-color:var(--v20-line) !important; }

/* Profile and focus manager */
.profile-hero,
.profile-main-quest,
.profile-focus-list,
.profile-preference-list,
.profile-section,
.focus-manager-row,
.profile-focus-row,
.profile-preference-row,
.profile-add-focus {
  color: var(--v20-text) !important;
  border-color: var(--v20-line) !important;
  box-shadow: none !important;
}
.profile-main-quest:hover,
.profile-focus-row:hover,
.profile-preference-row:hover,
.focus-manager-row:hover { background: rgba(255,255,255,.075) !important; }
.profile-focus-list,
.profile-preference-list { border:1px solid var(--v20-line) !important; }
.profile-focus-row + .profile-focus-row,
.profile-preference-row + .profile-preference-row { border-top:1px solid rgba(255,255,255,.07) !important; }
.profile-row-copy small,
.profile-focus-row small,
.profile-preference-row small,
.focus-manager-intro { color: var(--v20-muted) !important; }
.profile-focus-row em { color:#8b7cff !important; }
.profile-add-focus { color:#b7adff !important; }
.profile-section-heading h3 { color:#fff !important; }
.profile-row-icon,
.profile-focus-icon,
.focus-manager-row > span:first-child {
  background: rgba(120,104,255,.12) !important;
  border:1px solid rgba(139,124,255,.16);
}

/* Task sheets, lists, presets and tomorrow */
.dialog-task-card,
.library-item,
.tomorrow-bucket-card,
.tomorrow-task-row,
.preview-empty,
.bucket-dialog-summary,
.empty-state {
  background: rgba(255,255,255,.045) !important;
  border: 1px solid var(--v20-line) !important;
  color: var(--v20-text) !important;
  box-shadow: none !important;
}
.dialog-task-card.completed { background: linear-gradient(135deg,rgba(78,224,170,.085),rgba(255,255,255,.035)) !important; border-color:rgba(78,224,170,.22) !important; }
.task-name,
.library-item h3,
.tomorrow-card-heading strong,
.tomorrow-task-row > span:first-child { color:#fff !important; }
.task-meta,
.library-item p,
.tomorrow-card-heading small { color:var(--v20-muted) !important; }
.library-actions button,
.tomorrow-edit,
.tomorrow-delete,
.task-edit-button,
.task-delete-button {
  color:#dfe2ff !important;
  background:rgba(255,255,255,.055) !important;
  border:1px solid var(--v20-line) !important;
}
.task-delete-button:hover,
.tomorrow-delete:hover { color:#ff9aad !important; border-color:rgba(255,124,145,.35) !important; }
.mini-icon { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.xp-pill { color:#c8c1ff !important; background:rgba(120,104,255,.14) !important; border:1px solid rgba(139,124,255,.2); }

/* Calendar, journey and chapters */
.calendar-toolbar button,
.calendar-cell,
.calendar-day-details,
.journey-summary,
.main-quest-goal-card,
.journey-card,
.goals-empty-state {
  color:var(--v20-text) !important;
  background:rgba(255,255,255,.045) !important;
  border-color:var(--v20-line) !important;
  box-shadow:none !important;
}
.calendar-cell.partial { background:rgba(255,188,73,.11) !important; color:#ffd38a !important; }
.calendar-cell.complete { background:rgba(78,224,170,.11) !important; color:#8ff0ca !important; }
.calendar-cell.planned { background:rgba(120,104,255,.12) !important; color:#b7adff !important; }
.calendar-day-details span,
.journey-summary small,
.journey-coach,
.journey-personal-status { color:var(--v20-muted) !important; }
.journey-card strong,
.main-quest-goal-card strong,
.journey-summary strong { color:#fff !important; }
.chapter-page,
.chapter-page.current { background:linear-gradient(145deg,#171a35,#0e1125) !important; border-color:rgba(139,124,255,.22) !important; color:#fff !important; box-shadow:0 28px 70px rgba(0,0,0,.35) !important; }

/* Premium */
.premium-hero,
.premium-feature-list > div {
  color:var(--v20-text) !important;
  background:rgba(255,255,255,.045) !important;
  border:1px solid var(--v20-line) !important;
  box-shadow:none !important;
}
.premium-hero h3,
.premium-feature-list strong { color:#fff !important; }
.premium-hero p,
.premium-feature-list small,
.premium-note { color:var(--v20-muted) !important; }

/* Celebration */
.celebration-dialog { border-radius:28px !important; background:transparent !important; }
.celebration-content {
  color:#fff !important;
  background:radial-gradient(circle at 50% 0%,rgba(120,104,255,.24),transparent 18rem),linear-gradient(180deg,#151932,#0c0f20) !important;
  border:1px solid var(--v20-line) !important;
  border-radius:28px !important;
  box-shadow:0 30px 90px rgba(0,0,0,.6) !important;
}

/* Custom confirmation and toast */
.confirm-dialog { width:min(390px,calc(100% - 32px)); border:0; padding:0; border-radius:28px; }
.confirm-dialog::backdrop { background:rgba(3,4,12,.78); backdrop-filter:blur(7px); }
.confirm-panel {
  padding:28px;
  text-align:center;
  border-radius:28px;
  color:#fff;
  background:radial-gradient(circle at 50% 0%,rgba(120,104,255,.22),transparent 15rem),linear-gradient(180deg,#151932,#0d1021);
  border:1px solid var(--v20-line);
  box-shadow:0 32px 100px rgba(0,0,0,.68);
}
.confirm-icon { width:58px;height:58px;margin:0 auto 16px;display:grid;place-items:center;border-radius:20px;background:rgba(120,104,255,.14);border:1px solid rgba(139,124,255,.25);font-size:25px; }
.confirm-panel h2 { margin:7px 0 8px;color:#fff;font-size:23px; }
.confirm-panel > p:not(.eyebrow) { margin:0;color:var(--v20-muted);font-size:14px;line-height:1.55; }
.confirm-actions { display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:23px; }
.confirm-actions button { width:100%; }
.app-toast {
  position:fixed;z-index:5000;left:50%;bottom:calc(96px + env(safe-area-inset-bottom));transform:translate(-50%,18px);display:flex;align-items:center;gap:10px;min-width:min(340px,calc(100% - 32px));max-width:430px;padding:13px 16px;border-radius:16px;color:#fff;background:rgba(17,21,42,.96);border:1px solid rgba(255,255,255,.13);box-shadow:0 22px 65px rgba(0,0,0,.52);opacity:0;pointer-events:none;transition:.22s ease;
}
.app-toast.show { opacity:1;transform:translate(-50%,0); }
.app-toast > span:first-child { width:28px;height:28px;display:grid;place-items:center;border-radius:10px;background:rgba(78,224,170,.14);color:var(--v20-green);font-weight:900; }
.app-toast > span:last-child { font-size:13px;font-weight:800; }

/* Guided tour remains above all dialogs and uses the same system */
.guide-card { background:linear-gradient(180deg,#171a35,#101329) !important; border-color:var(--v20-line) !important; }
.guide-back { color:#c5c9dc !important; background:rgba(255,255,255,.055) !important; }
.guide-next { background:linear-gradient(100deg,#7868ff,#4c8dff) !important; }

/* Prevent any old literal white panel from surviving */
.sheet-dialog [style*="background: white"],
.sheet-dialog [style*="background:#fff"],
.sheet-dialog [style*="background: #fff"] { background:rgba(255,255,255,.045) !important; }


/* v21 preset Focus Area filters */
.preset-filter-section {
  margin-bottom: 18px;
}
.preset-filter-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
  color: var(--v20-muted);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.preset-filter-heading small {
  color: rgba(223,226,255,.55);
  font-size: 10px;
  letter-spacing: .04em;
  text-transform: none;
  white-space: nowrap;
}
.preset-filter-scroll {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 2px 1px 8px;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.preset-filter-scroll::-webkit-scrollbar {
  display: none;
}
.preset-filter-chip {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 40px;
  padding: 9px 12px;
  scroll-snap-align: start;
  border: 1px solid var(--v20-line);
  border-radius: 999px;
  color: var(--v20-muted);
  background: rgba(255,255,255,.045);
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease;
}
.preset-filter-chip strong {
  display: grid;
  min-width: 22px;
  height: 22px;
  place-items: center;
  padding: 0 6px;
  border-radius: 999px;
  color: #cbc6ff;
  background: rgba(120,104,255,.14);
  font-size: 10px;
}
.preset-filter-chip:hover {
  color: #fff;
  border-color: rgba(139,124,255,.35);
  transform: translateY(-1px);
}
.preset-filter-chip.active {
  color: #fff;
  border-color: rgba(139,124,255,.6);
  background: linear-gradient(135deg, rgba(109,93,252,.28), rgba(67,53,204,.18));
  box-shadow: 0 8px 24px rgba(70,54,200,.18);
}
.preset-filter-chip.active strong {
  color: #fff;
  background: rgba(255,255,255,.14);
}
.preset-filter-empty {
  display: grid;
  justify-items: center;
  gap: 7px;
  padding: 34px 20px;
  border: 1px dashed rgba(139,124,255,.24);
  border-radius: 22px;
  color: var(--v20-muted);
  background: rgba(255,255,255,.025);
  text-align: center;
}
.preset-filter-empty > span {
  font-size: 28px;
}
.preset-filter-empty strong {
  color: #fff;
  font-size: 14px;
}
.preset-filter-empty p {
  max-width: 270px;
  margin: 0;
  color: var(--v20-muted) !important;
  font-size: 12px;
  line-height: 1.55;
}


/* v22 account and login interface */
.profile-account-badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 5px 9px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 999px;
  color: rgba(223,226,255,.58);
  background: rgba(255,255,255,.04);
  font-size: 10px;
  font-weight: 850;
  white-space: nowrap;
}
.profile-account-badge.protected {
  color: #9af0c5;
  border-color: rgba(76,225,154,.24);
  background: rgba(76,225,154,.08);
}
.profile-account-card {
  width: 100%;
  display: grid;
  grid-template-columns: 48px minmax(0,1fr) 18px;
  align-items: center;
  gap: 13px;
  padding: 15px;
  border: 1px solid rgba(139,124,255,.22);
  border-radius: 20px;
  color: #fff;
  background:
    radial-gradient(circle at 100% 0, rgba(67,118,255,.12), transparent 42%),
    linear-gradient(135deg, rgba(109,93,252,.16), rgba(255,255,255,.035));
  text-align: left;
  box-shadow: 0 12px 34px rgba(0,0,0,.18);
}
.profile-account-icon,
.account-protection-icon {
  display: grid;
  place-items: center;
  border: 1px solid rgba(139,124,255,.28);
  color: #c7c0ff;
  background: rgba(109,93,252,.16);
}
.profile-account-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
}
.profile-account-icon .app-icon,
.account-protection-icon .app-icon {
  width: 24px;
  height: 24px;
}
.profile-account-card em {
  display: block;
  margin-top: 4px;
  color: var(--v20-muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.45;
}
.account-panel,
.account-form-panel {
  background:
    radial-gradient(circle at 88% 0, rgba(109,93,252,.16), transparent 28%),
    linear-gradient(180deg, #171a3c, #0d1021 55%, #090b17) !important;
}
.account-protection-hero {
  display: grid;
  justify-items: center;
  padding: 6px 4px 20px;
  text-align: center;
}
.account-protection-icon {
  width: 72px;
  height: 72px;
  margin-bottom: 17px;
  border-radius: 24px;
  box-shadow: 0 18px 45px rgba(55,42,180,.25);
}
.account-protection-icon .app-icon {
  width: 34px;
  height: 34px;
}
.account-protection-hero h3 {
  max-width: 430px;
  margin: 8px 0 0;
  color: #fff;
  font-size: clamp(21px, 5vw, 28px);
  line-height: 1.16;
}
.account-protection-hero > p:last-child {
  max-width: 470px;
  margin: 13px 0 0;
  color: var(--v20-muted);
  font-size: 13px;
  line-height: 1.65;
}
.account-benefit-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin-top: 3px;
}
.account-benefit-grid > div {
  min-width: 0;
  padding: 15px;
  border: 1px solid var(--v20-line);
  border-radius: 18px;
  background: rgba(255,255,255,.035);
}
.account-benefit-grid span {
  font-size: 22px;
}
.account-benefit-grid strong,
.account-benefit-grid small {
  display: block;
}
.account-benefit-grid strong {
  margin-top: 10px;
  color: #fff;
  font-size: 12px;
}
.account-benefit-grid small {
  margin-top: 5px;
  color: var(--v20-muted);
  font-size: 10px;
  line-height: 1.45;
}
.account-primary-actions {
  display: grid;
  gap: 10px;
  margin-top: 18px;
}
.account-primary-actions .primary-button,
.account-primary-actions .secondary-button,
.account-signed-in-hero + .account-status-card ~ .primary-button,
.account-signed-in-hero + .account-status-card ~ .secondary-button {
  width: 100%;
}
.account-restore-link {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-top: 12px;
  padding: 15px;
  border: 1px solid var(--v20-line);
  border-radius: 18px;
  color: #fff;
  background: rgba(255,255,255,.025);
  text-align: left;
}
.account-restore-link strong,
.account-restore-link small {
  display: block;
}
.account-restore-link strong {
  font-size: 12px;
}
.account-restore-link small {
  margin-top: 3px;
  color: var(--v20-muted);
  font-size: 10px;
}
.account-free-note {
  margin: 15px 0 0;
  color: rgba(223,226,255,.48);
  font-size: 10px;
  text-align: center;
}
.account-form-intro {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 18px;
  padding: 14px;
  border: 1px solid rgba(139,124,255,.2);
  border-radius: 18px;
  background: rgba(109,93,252,.08);
}
.account-form-intro span {
  font-size: 25px;
}
.account-form-intro p {
  margin: 0;
  color: var(--v20-muted);
  font-size: 12px;
  line-height: 1.5;
}
.account-field {
  display: grid;
  gap: 8px;
  margin-top: 13px;
}
.account-field > span {
  color: #e5e6ff;
  font-size: 11px;
  font-weight: 850;
}
.account-field input {
  width: 100%;
  min-height: 52px;
  padding: 13px 14px;
  border: 1px solid var(--v20-line) !important;
  border-radius: 15px;
  color: #fff !important;
  background: rgba(255,255,255,.045) !important;
  font: inherit;
  outline: none;
}
.account-field input:focus {
  border-color: rgba(139,124,255,.75) !important;
  box-shadow: 0 0 0 3px rgba(109,93,252,.14);
}
.password-field {
  position: relative;
}
.password-field input {
  padding-right: 62px;
}
.password-field button {
  position: absolute;
  right: 8px;
  top: 50%;
  min-height: 36px;
  padding: 7px 10px;
  transform: translateY(-50%);
  border: 0;
  border-radius: 10px;
  color: #c6c1ff;
  background: rgba(109,93,252,.12);
  font-size: 10px;
  font-weight: 850;
}
.account-consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 16px 0;
  color: var(--v20-muted);
  font-size: 10px;
  line-height: 1.5;
}
.account-consent input {
  width: 18px;
  height: 18px;
  margin-top: 1px;
  accent-color: #6d5dfc;
}
.account-text-button,
.account-signout-button {
  width: 100%;
  margin-top: 10px;
  padding: 10px;
  border: 0;
  color: #aaa4e8;
  background: transparent;
  font-size: 11px;
  font-weight: 800;
}
.form-error {
  min-height: 18px;
  margin: 10px 0 0;
  color: #ff8798;
  font-size: 11px;
  font-weight: 750;
}
.verification-icon {
  display: grid;
  width: 70px;
  height: 70px;
  margin: 6px auto 14px;
  place-items: center;
  border: 1px solid rgba(139,124,255,.25);
  border-radius: 24px;
  color: #c8c2ff;
  background: rgba(109,93,252,.13);
  font-size: 30px;
}
.verification-copy,
.account-recovery-copy {
  max-width: 430px;
  margin: 0 auto 18px;
  color: var(--v20-muted);
  font-size: 12px;
  line-height: 1.6;
  text-align: center;
}
.verification-code {
  text-align: center;
  letter-spacing: .38em;
  font-size: 22px !important;
  font-weight: 900;
}
.account-signed-in-hero {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 8px 0 19px;
}
.account-avatar {
  display: grid;
  width: 58px;
  height: 58px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgba(139,124,255,.3);
  border-radius: 19px;
  color: #fff;
  background: linear-gradient(135deg, #6d5dfc, #337fff);
  font-size: 22px;
  font-weight: 950;
  box-shadow: 0 15px 36px rgba(61,49,190,.25);
}
.account-signed-in-hero h3 {
  margin: 4px 0;
  color: #fff;
  font-size: 18px;
  overflow-wrap: anywhere;
}
.account-signed-in-hero p:last-child {
  margin: 0;
  color: var(--v20-muted);
  font-size: 11px;
}
.account-status-card {
  display: grid;
  gap: 1px;
  margin-bottom: 17px;
  overflow: hidden;
  border: 1px solid var(--v20-line);
  border-radius: 19px;
  background: var(--v20-line);
}
.account-status-row {
  display: grid;
  grid-template-columns: 12px minmax(0,1fr);
  align-items: center;
  gap: 12px;
  padding: 15px;
  background: rgba(19,22,46,.98);
}
.status-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
}
.status-dot.local {
  background: #58de9c;
  box-shadow: 0 0 15px rgba(88,222,156,.5);
}
.status-dot.pending {
  background: #f5b75f;
  box-shadow: 0 0 15px rgba(245,183,95,.4);
}
.account-status-row strong,
.account-status-row small {
  display: block;
}
.account-status-row strong {
  color: #fff;
  font-size: 12px;
}
.account-status-row small {
  margin-top: 4px;
  color: var(--v20-muted);
  font-size: 10px;
}
@media (max-width: 420px) {
  .account-benefit-grid {
    grid-template-columns: 1fr;
  }
}

/* v23 AW brand identity */
.topbar-brand {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
}
.topbar-brand-icon {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
  border-radius: 13px;
  box-shadow: 0 10px 28px rgba(77, 61, 220, .28);
}
.topbar-brand > div {
  min-width: 0;
}

/* v24 My Story account experience */
.my-story-path { display:grid; gap:10px; margin:4px 0 18px; }
.my-story-path-step { display:grid; grid-template-columns:34px minmax(0,1fr); gap:12px; align-items:center; padding:13px 14px; border:1px solid var(--v20-line); border-radius:17px; background:rgba(255,255,255,.025); }
.my-story-path-step > span { display:grid; width:34px; height:34px; place-items:center; border-radius:12px; color:#bcb6ff; background:rgba(109,93,252,.12); font-size:12px; font-weight:900; }
.my-story-path-step.active { border-color:rgba(139,124,255,.28); background:linear-gradient(135deg,rgba(109,93,252,.12),rgba(255,255,255,.025)); }
.my-story-path-step.active > span { color:#fff; background:linear-gradient(135deg,#6d5dfc,#397dff); box-shadow:0 8px 22px rgba(62,51,190,.24); }
.my-story-path-step strong,.my-story-path-step small { display:block; }
.my-story-path-step strong { color:#fff; font-size:12px; }
.my-story-path-step small { margin-top:4px; color:var(--v20-muted); font-size:10px; line-height:1.45; }


/* v25 live Cognito authentication */
.account-field input:disabled,
.primary-button:disabled,
.secondary-button:disabled,
.account-text-button:disabled {
  cursor: wait;
  opacity: .65;
}
#recoveryConfirmStep {
  display: grid;
  gap: 0;
}
#recoveryConfirmStep.hidden {
  display: none;
}

/* v26 encrypted cloud backup */
.status-dot.protected{background:#58de9c;box-shadow:0 0 15px rgba(88,222,156,.5)}
.cloud-backup-card{margin:16px 0 8px;padding:17px;border:1px solid rgba(139,124,255,.24);border-radius:21px;background:radial-gradient(circle at 100% 0,rgba(60,118,255,.13),transparent 42%),linear-gradient(145deg,rgba(109,93,252,.12),rgba(255,255,255,.025))}
.cloud-backup-heading{display:flex;align-items:center;gap:12px}.cloud-backup-icon{display:grid;width:45px;height:45px;place-items:center;border:1px solid rgba(139,124,255,.25);border-radius:15px;background:rgba(109,93,252,.12);font-size:21px}
.cloud-backup-heading h3{margin:3px 0 0;color:#fff;font-size:17px}.cloud-backup-card>p{margin:13px 0;color:var(--v20-muted);font-size:11px;line-height:1.6}
.cloud-backup-meta{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:13px 0;padding:11px 12px;border:1px solid var(--v20-line);border-radius:14px;background:rgba(255,255,255,.025);color:var(--v20-muted);font-size:10px}.cloud-backup-meta strong{color:#fff;font-size:11px;text-align:right}
.cloud-backup-actions{display:grid;gap:9px}.cloud-backup-actions button{width:100%}.backup-delete-button{padding:10px;border:0;color:#ff91a0;background:transparent;font-size:10px;font-weight:850}.backup-delete-button:disabled{color:rgba(223,226,255,.28)}
.backup-security-message{display:grid;grid-template-columns:42px minmax(0,1fr);gap:12px;align-items:start;margin-bottom:16px;padding:14px;border:1px solid rgba(245,183,95,.22);border-radius:18px;background:rgba(245,183,95,.065)}.backup-security-message>span{font-size:24px}.backup-security-message strong{color:#fff;font-size:12px}.backup-security-message p{margin:5px 0 0;color:var(--v20-muted);font-size:10px;line-height:1.5}


/* v28 premium Morning Briefing redesign */
.morning-briefing {
  width: 100%;
  max-width: none;
  height: 100%;
  max-height: none;
  margin: 0;
  border: 0;
  padding: 0;
  background: #060713;
}
.morning-briefing::backdrop {
  background: #060713;
}
.briefing-screen {
  min-height: 100dvh;
  padding: max(18px, env(safe-area-inset-top)) 20px max(22px, env(safe-area-inset-bottom));
  overflow-y: auto;
  background:
    radial-gradient(circle at 50% -4%, rgba(105, 82, 255, .30), transparent 38%),
    radial-gradient(circle at 86% 72%, rgba(42, 103, 255, .12), transparent 32%),
    linear-gradient(180deg, #13142f 0%, #090a19 56%, #050610 100%);
}
.briefing-screen::before {
  opacity: .24;
  background-size: 30px 30px;
}
.briefing-close {
  top: max(17px, env(safe-area-inset-top));
  right: 18px;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 15px;
  background: rgba(255,255,255,.055);
  box-shadow: none;
  backdrop-filter: blur(18px);
}
.briefing-content {
  width: min(100%, 520px);
  min-height: calc(100dvh - 42px);
  margin: 0 auto;
  padding: 46px 0 8px;
  justify-content: center;
}
.briefing-brand-mark {
  width: 62px;
  height: 62px;
  margin: 0 auto 16px;
  overflow: hidden;
  border: 1px solid rgba(143,130,255,.35);
  border-radius: 20px;
  box-shadow:
    0 18px 50px rgba(43,31,160,.34),
    0 0 0 7px rgba(109,93,252,.06);
}
.briefing-brand-mark img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.briefing-kicker {
  margin: 0 0 8px;
  color: #9f95ff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.briefing-date {
  margin: 0 0 7px;
  color: rgba(226,228,255,.56);
  font-size: 10px;
  letter-spacing: .15em;
}
.briefing-content > h1 {
  margin: 0 0 24px;
  color: #fff;
  font-size: clamp(31px, 9vw, 44px);
  line-height: 1.02;
  letter-spacing: -.055em;
}
.briefing-card-stack {
  display: grid;
  gap: 12px;
  width: 100%;
}
.briefing-quest {
  display: grid;
  grid-template-columns: 44px minmax(0,1fr);
  align-items: center;
  gap: 13px;
  width: 100%;
  margin: 0;
  padding: 16px;
  border: 1px solid rgba(139,124,255,.24);
  border-radius: 20px;
  background:
    linear-gradient(135deg, rgba(109,93,252,.16), rgba(255,255,255,.035));
  text-align: left;
  box-shadow: 0 14px 40px rgba(0,0,0,.18);
}
.briefing-card-icon {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid rgba(139,124,255,.22);
  border-radius: 14px;
  background: rgba(109,93,252,.13);
  font-size: 20px;
}
.briefing-label {
  color: #a89fff;
  font-size: 9px;
  letter-spacing: .17em;
  opacity: 1;
}
.briefing-quest p {
  margin: 5px 0 0;
  color: #fff;
  font-size: clamp(16px, 4.6vw, 20px);
  line-height: 1.32;
}
.briefing-affirmation {
  position: relative;
  overflow: hidden;
  padding: 22px 19px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 20px;
  background:
    radial-gradient(circle at 100% 0%, rgba(78,115,255,.15), transparent 38%),
    rgba(255,255,255,.045);
  box-shadow: 0 14px 38px rgba(0,0,0,.18);
}
.briefing-affirmation::before {
  content: "“";
  position: absolute;
  top: -20px;
  left: 11px;
  color: rgba(139,124,255,.13);
  font-family: Georgia, serif;
  font-size: 110px;
  line-height: 1;
}
.briefing-affirmation blockquote {
  position: relative;
  margin: 11px auto 0;
  max-width: 430px;
  color: #fff;
  font-size: clamp(16px, 4.5vw, 20px);
  font-weight: 750;
  line-height: 1.48;
  letter-spacing: -.018em;
}
.briefing-yesterday {
  margin: 0;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 16px;
  color: rgba(226,228,255,.66);
  background: rgba(255,255,255,.025);
  font-size: 11px;
}
.briefing-yesterday > span {
  margin-bottom: 5px;
  color: #9188dc;
  opacity: 1;
}
.briefing-footer {
  width: 100%;
  margin-top: 17px;
  gap: 5px;
}
.briefing-start {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  min-height: 54px;
  padding: 15px 18px;
  border-radius: 17px;
  color: #fff;
  background: linear-gradient(105deg, #745dff, #397eff);
  box-shadow: 0 16px 38px rgba(63,58,222,.27);
}
.briefing-start span {
  font-size: 18px;
  transition: transform .18s ease;
}
.briefing-start:hover span {
  transform: translateX(3px);
}
.briefing-settings-link {
  padding: 10px;
  color: rgba(191,185,255,.76);
  font-size: 11px;
}
@media (max-height: 700px) {
  .briefing-content {
    justify-content: flex-start;
    padding-top: 42px;
  }
  .briefing-brand-mark {
    width: 48px;
    height: 48px;
    margin-bottom: 10px;
    border-radius: 16px;
  }
  .briefing-kicker {
    display: none;
  }
  .briefing-content > h1 {
    margin-bottom: 15px;
    font-size: 29px;
  }
  .briefing-quest {
    padding: 13px;
  }
  .briefing-affirmation {
    padding: 17px 15px;
  }
  .briefing-affirmation blockquote {
    font-size: 15px;
  }
  .briefing-footer {
    margin-top: 12px;
  }
}


/* v29 display-name personalization */
.display-name-card {
  padding: 15px;
  border: 1px solid rgba(139,124,255,.20);
  border-radius: 19px;
  background:
    radial-gradient(circle at 100% 0, rgba(67,118,255,.09), transparent 38%),
    rgba(255,255,255,.03);
}
.display-name-card > label {
  display: block;
  margin-bottom: 8px;
  color: #e7e8ff;
  font-size: 11px;
  font-weight: 850;
}
.display-name-input-row {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 9px;
}
.display-name-input-row input {
  min-width: 0;
  min-height: 48px;
  padding: 12px 13px;
  border: 1px solid var(--v20-line);
  border-radius: 14px;
  color: #fff;
  background: rgba(255,255,255,.045);
  font: inherit;
  outline: none;
}
.display-name-input-row input:focus {
  border-color: rgba(139,124,255,.72);
  box-shadow: 0 0 0 3px rgba(109,93,252,.13);
}
.display-name-input-row button {
  min-width: 72px;
  padding: 0 16px;
  border: 1px solid rgba(139,124,255,.28);
  border-radius: 14px;
  color: #fff;
  background: linear-gradient(135deg, rgba(109,93,252,.9), rgba(57,126,255,.9));
  font-size: 11px;
  font-weight: 900;
}
.display-name-card > p {
  margin: 9px 0 0;
  color: var(--v20-muted);
  font-size: 10px;
  line-height: 1.5;
}
.account-email-line {
  margin: 3px 0 0 !important;
  color: var(--v20-muted) !important;
  font-size: 10px !important;
  overflow-wrap: anywhere;
}


/* v30 Momentum+ membership aura */
.topbar-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.topbar-plus-badge {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid rgba(247,198,100,.65);
  border-radius: 8px;
  color: #ffe7a7;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.30), transparent 30%),
    linear-gradient(135deg, #8f55e8, #c58b43);
  box-shadow:
    0 0 0 4px rgba(199,137,70,.07),
    0 0 20px rgba(213,153,72,.28);
  font-size: 16px;
  font-weight: 900;
  line-height: 1;
}
.momentum-plus-member .topbar-brand-icon {
  border-radius: 15px;
  box-shadow:
    0 0 0 2px rgba(246,199,105,.72),
    0 0 0 7px rgba(127,82,222,.13),
    0 0 27px rgba(204,142,79,.30);
}
.momentum-plus-member .profile-avatar-button {
  position: relative;
  border-color: rgba(246,199,105,.56);
  color: #fff2c7;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.16), transparent 32%),
    linear-gradient(145deg, rgba(117,73,214,.48), rgba(184,124,54,.30));
  box-shadow:
    0 0 0 3px rgba(136,91,220,.10),
    0 0 23px rgba(230,171,83,.25);
}
.momentum-plus-member .profile-avatar-button::after {
  content: "+";
  position: absolute;
  right: -4px;
  bottom: -4px;
  display: grid;
  width: 17px;
  height: 17px;
  place-items: center;
  border: 2px solid #090a17;
  border-radius: 7px;
  color: #2b1b08;
  background: linear-gradient(135deg, #fff0ae, #d59a48);
  font-size: 11px;
  font-weight: 1000;
}
.profile-account-badge.plus {
  border-color: rgba(246,199,105,.32);
  color: #ffe2a0;
  background: linear-gradient(135deg, rgba(125,75,212,.22), rgba(205,143,70,.18));
  box-shadow: 0 0 16px rgba(215,153,75,.12);
}
.momentum-plus-member [data-membership-card] {
  position: relative;
  overflow: hidden;
  border-color: rgba(244,197,102,.30);
  background:
    radial-gradient(circle at 100% 0, rgba(226,163,78,.12), transparent 36%),
    linear-gradient(145deg, rgba(112,70,205,.12), rgba(255,255,255,.028));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 13px 34px rgba(42,24,93,.18),
    0 0 22px rgba(211,151,77,.07);
}
.momentum-plus-member [data-membership-card]::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    110deg,
    transparent 20%,
    rgba(255,230,161,.08) 43%,
    transparent 62%
  );
  transform: translateX(-100%);
  animation: momentumPlusSheen 7s ease-in-out infinite;
}
@keyframes momentumPlusSheen {
  0%, 68% { transform: translateX(-110%); }
  82%, 100% { transform: translateX(110%); }
}
.account-membership-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
}
.account-membership-line .eyebrow {
  margin: 0;
}
.membership-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 4px 8px;
  border: 1px solid rgba(246,199,105,.42);
  border-radius: 999px;
  color: #ffe5a1;
  background:
    linear-gradient(135deg, rgba(119,72,205,.42), rgba(191,126,54,.31));
  box-shadow: 0 0 17px rgba(216,155,76,.15);
  font-size: 8px;
  font-weight: 950;
  letter-spacing: .12em;
}
.momentum-plus-member #accountSignedInHero {
  position: relative;
  border: 1px solid rgba(244,197,102,.22);
  border-radius: 20px;
  background:
    radial-gradient(circle at 0 0, rgba(125,76,219,.18), transparent 42%),
    radial-gradient(circle at 100% 100%, rgba(213,147,67,.10), transparent 44%);
  box-shadow: 0 0 30px rgba(109,69,190,.10);
}
.momentum-plus-member #accountAvatar {
  color: #fff6d9;
  background:
    radial-gradient(circle at 35% 25%, rgba(255,255,255,.22), transparent 28%),
    linear-gradient(145deg, #7047d6, #c38943);
  box-shadow:
    0 0 0 2px rgba(246,199,105,.40),
    0 0 20px rgba(203,142,70,.23);
}
.momentum-plus-status-card {
  display: grid;
  grid-template-columns: 48px minmax(0,1fr) auto;
  align-items: center;
  gap: 13px;
  margin: 14px 0;
  padding: 15px;
  border: 1px solid rgba(246,199,105,.31);
  border-radius: 20px;
  background:
    radial-gradient(circle at 0 0, rgba(130,78,222,.19), transparent 43%),
    linear-gradient(135deg, rgba(119,70,207,.10), rgba(199,135,61,.08));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 12px 34px rgba(0,0,0,.18),
    0 0 22px rgba(209,146,70,.08);
}
.momentum-plus-emblem {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid rgba(255,223,145,.42);
  border-radius: 16px;
  color: #fff1bd;
  background:
    radial-gradient(circle at 32% 23%, rgba(255,255,255,.25), transparent 27%),
    linear-gradient(145deg, #7549dc, #bd7f3c);
  box-shadow: 0 0 22px rgba(209,146,70,.23);
}
.momentum-plus-emblem span {
  font-size: 25px;
  font-weight: 900;
  line-height: 1;
}
.momentum-plus-status-copy {
  min-width: 0;
}
.momentum-plus-status-copy h3 {
  margin: 3px 0 0;
  color: #fff8e4;
  font-size: 15px;
}
.momentum-plus-status-copy > p:last-child {
  margin: 5px 0 0;
  color: rgba(231,225,255,.62);
  font-size: 9px;
  line-height: 1.45;
}
.momentum-plus-status-card > button {
  min-height: 36px;
  padding: 0 11px;
  border: 1px solid rgba(246,199,105,.27);
  border-radius: 12px;
  color: #ffe3a0;
  background: rgba(255,255,255,.045);
  font-size: 9px;
  font-weight: 900;
}
@media (prefers-reduced-motion: reduce) {
  .momentum-plus-member [data-membership-card]::before {
    animation: none;
  }
}


/* v32 Display Case and Momentum Coins */
.display-case-hero{display:grid;grid-template-columns:50px minmax(0,1fr);gap:14px;align-items:center;padding:17px;border:1px solid rgba(145,126,255,.22);border-radius:22px;background:radial-gradient(circle at 0 0,rgba(111,76,225,.18),transparent 42%),rgba(255,255,255,.025)}
.display-case-hero-mark{display:grid;width:50px;height:50px;place-items:center;border-radius:17px;color:#ffe6a5;background:linear-gradient(145deg,#6842cd,#a86e35);box-shadow:0 0 25px rgba(157,101,215,.22);font-size:23px}.display-case-hero h3{margin:4px 0;color:#fff;font-size:17px}.display-case-hero p:last-child{margin:5px 0 0;color:var(--v20-muted);font-size:10px;line-height:1.5}
.next-coin-card{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center;margin:13px 0;padding:13px 15px;border:1px solid var(--v20-line);border-radius:17px;background:rgba(255,255,255,.025)}.next-coin-card span{grid-row:1/3;color:#9b91ff;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.12em}.next-coin-card strong{color:#fff;font-size:12px}.next-coin-card small{color:var(--v20-muted);font-size:9px}.next-coin-card.complete{border-color:rgba(246,199,105,.22)}
.display-case-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.display-case-item{position:relative;overflow:hidden;display:flex;min-height:218px;padding:18px 12px 13px;border:1px solid rgba(255,255,255,.08);border-radius:21px;flex-direction:column;align-items:center;color:inherit;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018));text-align:center}.display-case-item.earned{border-color:rgba(158,125,255,.23);background:radial-gradient(circle at 50% 12%,rgba(112,71,218,.16),transparent 47%),rgba(255,255,255,.025)}.display-case-item.locked{opacity:.62}.display-case-shelf-light{position:absolute;top:-45px;left:50%;width:150px;height:120px;transform:translateX(-50%);background:radial-gradient(ellipse,rgba(205,181,255,.13),transparent 66%)}
.collectible-coin{position:relative;display:grid;width:92px;height:92px;place-items:center;border:6px solid rgba(255,224,155,.62);border-radius:50%;color:#fff4c8;background:linear-gradient(145deg,#cfaa65,#7746d0 62%,#211044);box-shadow:inset 0 0 0 3px rgba(255,255,255,.22),0 13px 28px rgba(0,0,0,.28),0 0 22px rgba(125,82,220,.16)}.collectible-coin::before{content:"";position:absolute;inset:9px;border:1px solid rgba(255,247,213,.43);border-radius:50%}.collectible-coin b,.collectible-coin span{position:relative;font-size:27px;font-weight:1000}.collectible-coin.locked{filter:grayscale(.75);border-color:rgba(185,185,205,.34);color:rgba(255,255,255,.62);background:linear-gradient(145deg,#565565,#252532)}.coin-consistency_30{background:linear-gradient(145deg,#e5e9f1,#868ea2 46%,#44326f)}.coin-consistency_100{background:linear-gradient(145deg,#fff0a9,#d59b35 50%,#6c3acb)}.coin-consistency_365{background:linear-gradient(145deg,#e9fbff,#6dd9e6 35%,#7451e2 72%,#24164e)}
.display-case-copy{display:grid;gap:5px;margin-top:12px}.display-case-copy strong{color:#fff;font-size:13px}.display-case-copy small{display:-webkit-box;overflow:hidden;color:var(--v20-muted);font-size:9px;line-height:1.4;-webkit-line-clamp:2;-webkit-box-orient:vertical}.collectible-rarity{margin-top:auto;padding-top:9px;color:#aa9fff;font-size:8px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.display-case-note{margin:15px 4px 0;color:var(--v20-muted);font-size:9px;line-height:1.5;text-align:center}
.collectible-panel{position:relative;overflow:hidden;text-align:center;background:radial-gradient(circle at 50% 4%,rgba(112,74,224,.26),transparent 38%),linear-gradient(180deg,#11122b,#080914)}.collectible-close{position:absolute;top:18px;right:17px;z-index:2}.collectible-spotlight{display:grid;min-height:270px;place-items:center;margin:-10px -20px 4px;background:radial-gradient(ellipse at center,rgba(227,207,255,.17),transparent 58%)}.collectible-coin.large{width:190px;height:190px;border-width:11px;animation:coinArrival .7s cubic-bezier(.2,.8,.2,1)}.collectible-coin.large::before{inset:17px;border-width:2px}.collectible-coin.large span{font-size:58px}.collectible-panel h2{margin:7px 0;color:#fff;font-size:28px;letter-spacing:-.04em}.collectible-inscription{max-width:390px;margin:10px auto;color:#d5d2ec;font-size:13px;line-height:1.55}.collectible-earned-date{margin:0 0 18px;color:#948dae;font-size:10px}.collectible-dialog-actions{display:grid;gap:9px}.collectible-privacy-note{margin:13px auto 0;max-width:400px;color:rgba(209,208,232,.44);font-size:8px;line-height:1.45}@keyframes coinArrival{0%{opacity:0;transform:translateY(30px) rotateY(-120deg) scale(.72)}100%{opacity:1;transform:none}}
@media(max-width:370px){.display-case-grid{grid-template-columns:1fr}.display-case-item{min-height:190px}}
@media(prefers-reduced-motion:reduce){.collectible-coin.large{animation:none}}


/* v33 final mobile-sheet polish */

/*
 * Preserve natural touch scrolling while removing the browser-style
 * scrollbar that makes the PWA feel like a conventional webpage.
 */
.sheet-dialog,
.onboarding-screen,
.briefing-screen,
.collectible-dialog,
.profile-panel,
.account-form-panel {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.sheet-dialog::-webkit-scrollbar,
.onboarding-screen::-webkit-scrollbar,
.briefing-screen::-webkit-scrollbar,
.collectible-dialog::-webkit-scrollbar,
.profile-panel::-webkit-scrollbar,
.account-form-panel::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

/* Keep the My Story heading and close control available while scrolling. */
.profile-dialog .profile-heading {
  position: sticky;
  top: 0;
  z-index: 12;
  margin: -2px -20px 16px;
  padding: 10px 20px 15px;
  border-bottom: 1px solid rgba(139,124,255,.14);
  background:
    linear-gradient(
      180deg,
      rgba(24,25,68,.98) 0%,
      rgba(24,25,68,.94) 78%,
      rgba(24,25,68,.82) 100%
    );
  box-shadow: 0 10px 24px rgba(5,6,20,.12);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

/*
 * A soft lower-edge fade suggests that more content is available without
 * displaying a permanent scrollbar.
 */
.profile-dialog .profile-panel::after {
  content: "";
  position: sticky;
  z-index: 8;
  bottom: calc(-26px - env(safe-area-inset-bottom));
  display: block;
  height: 34px;
  margin: 0 -20px calc(-26px - env(safe-area-inset-bottom));
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(8,9,25,0),
    rgba(8,9,25,.72)
  );
}

@media (prefers-reduced-transparency: reduce) {
  .profile-dialog .profile-heading {
    background: #181944;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}


/* v34 profile clarity: Momentum areas and membership */
.momentum-map-section,
.plan-overview-section {
  position: relative;
}
.momentum-area-grid {
  display: grid;
  gap: 9px;
}
.momentum-area-card {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr);
  align-items: start;
  gap: 12px;
  padding: 13px;
  border: 1px solid rgba(139,124,255,.14);
  border-radius: 17px;
  background: rgba(255,255,255,.028);
}
.momentum-area-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(139,124,255,.19);
  border-radius: 13px;
  background: rgba(109,93,252,.10);
  font-size: 19px;
}
.momentum-area-card strong {
  display: block;
  margin-top: 1px;
  color: #f7f7ff;
  font-size: 12px;
}
.momentum-area-card p {
  margin: 4px 0 0;
  color: rgba(225,227,255,.56);
  font-size: 9px;
  line-height: 1.48;
}
.profile-plan-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 8px;
  font-weight: 950;
  letter-spacing: .11em;
}
.profile-plan-badge.basic {
  border: 1px solid rgba(146,152,200,.22);
  color: rgba(225,228,255,.72);
  background: rgba(255,255,255,.04);
}
.profile-plan-badge.plus {
  border: 1px solid rgba(246,199,105,.42);
  color: #ffe5a1;
  background: linear-gradient(135deg, rgba(119,72,205,.42), rgba(191,126,54,.31));
  box-shadow: 0 0 17px rgba(216,155,76,.15);
}
.profile-plan-card {
  display: grid;
  grid-template-columns: 50px minmax(0,1fr);
  gap: 13px;
  padding: 15px;
  border-radius: 20px;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.profile-plan-card.basic {
  border: 1px solid rgba(139,124,255,.17);
  background:
    radial-gradient(circle at 100% 0, rgba(75,105,212,.08), transparent 42%),
    rgba(255,255,255,.027);
}
.profile-plan-card.plus {
  border: 1px solid rgba(246,199,105,.31);
  background:
    radial-gradient(circle at 0 0, rgba(130,78,222,.20), transparent 43%),
    linear-gradient(135deg, rgba(119,70,207,.11), rgba(199,135,61,.09));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 12px 34px rgba(0,0,0,.15),
    0 0 22px rgba(209,146,70,.08);
}
.profile-plan-symbol {
  display: grid;
  width: 50px;
  height: 50px;
  place-items: center;
  border-radius: 16px;
  color: #e8e9ff;
  background: linear-gradient(145deg, #6352d4, #4679e2);
  font-size: 19px;
  font-weight: 950;
}
.profile-plan-card.plus .profile-plan-symbol {
  color: #fff1bd;
  border: 1px solid rgba(255,223,145,.38);
  background:
    radial-gradient(circle at 32% 23%, rgba(255,255,255,.25), transparent 27%),
    linear-gradient(145deg, #7549dc, #bd7f3c);
  box-shadow: 0 0 22px rgba(209,146,70,.22);
}
.profile-plan-copy small {
  display: block;
  color: #9f95ff;
  font-size: 8px;
  font-weight: 950;
  letter-spacing: .14em;
}
.profile-plan-card.plus .profile-plan-copy small {
  color: #f5cf82;
}
.profile-plan-copy strong {
  display: block;
  margin-top: 4px;
  color: #fff;
  font-size: 15px;
}
.profile-plan-copy > p {
  margin: 6px 0 0;
  color: rgba(226,228,255,.58);
  font-size: 9px;
  line-height: 1.5;
}
.profile-plan-benefits {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 11px;
}
.profile-plan-benefits span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 8px;
  border: 1px solid rgba(139,124,255,.13);
  border-radius: 999px;
  color: rgba(229,231,255,.66);
  background: rgba(255,255,255,.025);
  font-size: 8px;
  font-weight: 800;
}
.profile-plan-card.plus .profile-plan-benefits span {
  border-color: rgba(246,199,105,.15);
  color: rgba(255,235,188,.78);
  background: rgba(255,219,139,.035);
}


/* v35 membership section and upgrade choices */
.plan-overview-section {
  padding: 14px !important;
  border: 1px solid rgba(139,124,255,.14) !important;
  border-radius: 22px !important;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0, rgba(81,75,208,.08), transparent 38%),
    rgba(255,255,255,.026) !important;
}

.plan-overview-section .profile-section-heading {
  margin: 0 0 11px;
}

.plan-overview-section .profile-plan-card {
  border-radius: 19px;
}

.profile-upgrade-choices {
  margin-top: 15px;
  padding-top: 14px;
  border-top: 1px solid rgba(139,124,255,.13);
}

.profile-upgrade-choices > p {
  margin: 0 0 11px;
  color: rgba(228,230,255,.63);
  font-size: 10px;
  line-height: 1.5;
}

.profile-upgrade-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}

.profile-upgrade-option {
  min-width: 0;
  min-height: 116px;
  padding: 12px;
  border: 1px solid rgba(139,124,255,.25);
  border-radius: 16px;
  color: #fff;
  background:
    radial-gradient(circle at 100% 0, rgba(73,119,255,.12), transparent 44%),
    rgba(255,255,255,.035);
  text-align: left;
  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease;
}

.profile-upgrade-option:hover,
.profile-upgrade-option:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(139,124,255,.58);
  background:
    radial-gradient(circle at 100% 0, rgba(73,119,255,.19), transparent 44%),
    rgba(255,255,255,.055);
  box-shadow: 0 12px 28px rgba(20,15,68,.20);
  outline: none;
}

.profile-upgrade-option.annual {
  border-color: rgba(246,199,105,.34);
  background:
    radial-gradient(circle at 100% 0, rgba(229,166,73,.15), transparent 44%),
    linear-gradient(145deg, rgba(110,70,200,.11), rgba(255,255,255,.035));
}

.profile-upgrade-option > span {
  display: block;
}

.profile-upgrade-option small {
  display: block;
  color: #9f95ff;
  font-size: 8px;
  font-weight: 950;
  letter-spacing: .14em;
}

.profile-upgrade-option.annual small {
  color: #f4cb79;
}

.profile-upgrade-option strong {
  display: block;
  margin-top: 7px;
  color: #fff;
  font-size: 22px;
  line-height: 1;
}

.profile-upgrade-option em {
  display: block;
  margin-top: 4px;
  color: rgba(226,228,255,.55);
  font-size: 9px;
  font-style: normal;
}

.profile-upgrade-option b {
  display: block;
  margin-top: 12px;
  color: #bdb6ff;
  font-size: 9px;
  font-weight: 900;
}

.profile-upgrade-option.annual b {
  color: #f3cf87;
}

.profile-upgrade-note {
  display: block;
  margin-top: 10px;
  color: rgba(226,228,255,.42);
  font-size: 8px;
  line-height: 1.45;
  text-align: center;
}

.profile-manage-plan {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(246,199,105,.15);
}

.profile-manage-plan button {
  width: 100%;
  min-height: 46px;
  border: 1px solid rgba(246,199,105,.30);
  border-radius: 14px;
  color: #ffe3a0;
  background:
    linear-gradient(135deg, rgba(111,67,202,.29), rgba(194,127,52,.21));
  font-size: 11px;
  font-weight: 900;
}

.profile-upgrade-option:disabled,
.profile-manage-plan button:disabled {
  cursor: wait;
  opacity: .65;
  transform: none;
}

@media (max-width: 390px) {
  .profile-upgrade-grid {
    grid-template-columns: 1fr;
  }

  .profile-upgrade-option {
    min-height: 98px;
  }
}


/* v36 launch candidate: Journey / Membership tabs */
.profile-tabs {
  position: sticky;
  top: 76px;
  z-index: 11;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  margin: -5px 0 16px;
  padding: 6px;
  border: 1px solid rgba(139,124,255,.15);
  border-radius: 17px;
  background: rgba(11,12,34,.90);
  box-shadow: 0 10px 24px rgba(4,5,18,.16);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.profile-tab {
  min-height: 43px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 0;
  border-radius: 12px;
  color: rgba(224,225,255,.54);
  background: transparent;
  font-size: 10px;
  font-weight: 900;
}

.profile-tab.active {
  color: #fff;
  background: linear-gradient(135deg, rgba(109,93,252,.32), rgba(57,126,255,.20));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 8px 20px rgba(37,28,128,.18);
}

.profile-tab-panel {
  animation: profileTabIn .18s ease;
}

@keyframes profileTabIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}

.membership-intro {
  margin-bottom: 13px;
  padding: 17px;
  border: 1px solid rgba(139,124,255,.16);
  border-radius: 21px;
  background:
    radial-gradient(circle at 100% 0, rgba(95,77,218,.12), transparent 43%),
    rgba(255,255,255,.026);
}

.membership-intro h3 {
  margin: 5px 0 7px;
  color: #fff;
  font-size: 17px;
}

.membership-intro > p:last-child {
  margin: 0;
  color: rgba(226,228,255,.60);
  font-size: 10px;
  line-height: 1.55;
}

/* Supporter option */
.supporter-option {
  width: 100%;
  min-height: 88px;
  display: grid;
  grid-template-columns: 42px minmax(0,1fr) auto;
  align-items: center;
  gap: 11px;
  margin: 0 0 10px;
  padding: 12px;
  border: 1px solid rgba(241,130,169,.29);
  border-radius: 17px;
  color: #fff;
  background:
    radial-gradient(circle at 0 0, rgba(211,77,139,.16), transparent 45%),
    rgba(255,255,255,.035);
  text-align: left;
}

.supporter-option-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(255,173,204,.34);
  border-radius: 14px;
  color: #ffd1e2;
  background: linear-gradient(145deg, #823f8e, #c65b7f);
  box-shadow: 0 0 19px rgba(205,80,139,.18);
  font-size: 18px;
}

.supporter-option-copy {
  min-width: 0;
}

.supporter-option-copy small {
  display: block;
  color: #ff9fc3;
  font-size: 7px;
  font-weight: 950;
  letter-spacing: .11em;
}

.supporter-option-copy strong {
  display: block;
  margin-top: 4px;
  font-size: 14px;
}

.supporter-option-copy em {
  display: block;
  margin-top: 4px;
  color: rgba(230,226,255,.57);
  font-size: 8px;
  font-style: normal;
  line-height: 1.4;
}

.supporter-option > b {
  color: #ffc4d9;
  font-size: 8px;
  text-align: right;
}

.supporter-option:disabled {
  opacity: .62;
}

.profile-plan-card.supporter {
  border-color: rgba(240,128,169,.29);
  background:
    radial-gradient(circle at 0 0, rgba(211,77,139,.14), transparent 43%),
    rgba(255,255,255,.032);
}

.profile-plan-card.supporter .profile-plan-symbol {
  color: #ffe0eb;
  background: linear-gradient(145deg, #7640a2, #c4597b);
  box-shadow: 0 0 20px rgba(211,77,139,.20);
}

.profile-plan-badge.supporter {
  border-color: rgba(240,128,169,.31);
  color: #ffc3d9;
  background: rgba(211,77,139,.10);
}

.profile-account-badge.supporter {
  border-color: rgba(240,128,169,.30);
  color: #ffc3d9;
  background: rgba(211,77,139,.10);
}

.membership-backup-card {
  border-radius: 22px;
}

.membership-backup-card > p {
  margin: 0;
  color: rgba(226,228,255,.60);
  font-size: 10px;
  line-height: 1.55;
}

.membership-backup-meta {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  margin-top: 14px;
  padding: 11px 12px;
  border: 1px solid rgba(139,124,255,.14);
  border-radius: 13px;
  color: rgba(226,228,255,.52);
  font-size: 9px;
}

.membership-backup-meta strong {
  color: #fff;
}

.membership-backup-actions {
  display: grid;
  gap: 8px;
  margin-top: 11px;
}

.membership-attention {
  animation: membershipAttention 1.2s ease;
}

@keyframes membershipAttention {
  0%,100% { box-shadow: none; }
  35% {
    box-shadow:
      0 0 0 3px rgba(139,124,255,.20),
      0 0 30px rgba(109,93,252,.22);
  }
}


/* ==========================================================
   MOMENTUM 1.5: THE FIRST SENTENCE UPDATE
   ========================================================== */

.coach-intake-card {
  display: grid;
  gap: 13px;
}

.coach-intake-card label {
  margin: 0;
}

.coach-intake-card textarea,
.coach-intake-card select,
#momentumCoachDialog textarea {
  width: 100%;
  margin-top: 7px;
  padding: 13px 14px;
  border: 1px solid rgba(139,124,255,.22);
  border-radius: 14px;
  outline: none;
  resize: vertical;
  color: #fff;
  background: rgba(7,8,22,.70);
  font-size: 13px;
  line-height: 1.5;
}

.coach-intake-card textarea:focus,
.coach-intake-card select:focus,
#momentumCoachDialog textarea:focus {
  border-color: rgba(139,124,255,.62);
  box-shadow: 0 0 0 3px rgba(139,124,255,.08);
}

.coach-philosophy-note {
  display: grid;
  gap: 5px;
  margin-top: 13px;
  padding: 13px 14px;
  border: 1px solid rgba(225,190,111,.18);
  border-radius: 15px;
  background:
    radial-gradient(circle at 100% 0, rgba(220,166,69,.09), transparent 48%),
    rgba(255,255,255,.024);
  text-align: center;
}

.coach-philosophy-note strong {
  color: #fff2c9;
  font-size: 10px;
}

.coach-philosophy-note span {
  color: rgba(239,230,207,.54);
  font-size: 8px;
  line-height: 1.45;
}

.coach-suggestion-panel {
  padding: 15px;
  border: 1px solid rgba(139,124,255,.17);
  border-radius: 19px;
  background:
    radial-gradient(circle at 100% 0, rgba(109,93,252,.13), transparent 45%),
    rgba(255,255,255,.027);
}

.coach-direction-copy {
  display: grid;
  gap: 4px;
  margin-bottom: 12px;
}

.coach-direction-copy span {
  color: #aaa2ff;
  font-size: 7px;
  font-weight: 950;
  letter-spacing: .13em;
}

.coach-direction-copy strong {
  color: #fff;
  font-size: 14px;
  line-height: 1.35;
}

.coach-direction-copy small {
  color: rgba(227,229,255,.48);
  font-size: 8px;
  line-height: 1.4;
}

.coach-suggestion-list {
  display: grid;
  gap: 9px;
}

.coach-suggestion-row {
  position: relative;
  display: grid;
  grid-template-columns: 23px minmax(0,1fr);
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 10px;
  border: 1px solid rgba(139,124,255,.15);
  border-radius: 14px;
  background: rgba(255,255,255,.024);
}

.coach-suggestion-row > input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.coach-suggestion-check {
  display: grid;
  width: 23px;
  height: 23px;
  place-items: center;
  border: 1px solid rgba(139,124,255,.30);
  border-radius: 8px;
  color: transparent;
  background: rgba(7,8,22,.42);
  font-size: 10px;
  font-weight: 950;
}

.coach-suggestion-row:has([data-coach-suggestion-toggle]:checked) {
  border-color: rgba(139,124,255,.44);
  background: rgba(109,93,252,.075);
}

.coach-suggestion-row:has([data-coach-suggestion-toggle]:checked)
.coach-suggestion-check {
  color: #fff;
  border-color: rgba(139,124,255,.68);
  background: linear-gradient(145deg, #6d5efc, #4f46e5);
}

.coach-suggestion-copy {
  min-width: 0;
}

.coach-suggestion-copy small {
  display: block;
  margin-bottom: 5px;
  color: #aaa2ff;
  font-size: 7px;
  font-weight: 900;
}

.coach-suggestion-copy input {
  width: 100%;
  min-height: 39px;
  margin: 0;
  padding: 8px 10px;
  border: 1px solid rgba(139,124,255,.14);
  border-radius: 10px;
  color: #fff;
  background: rgba(5,6,18,.48);
  font-size: 10px;
  line-height: 1.35;
}

.momentum-coach-card {
  display: grid;
  grid-template-columns: 43px minmax(0,1fr);
  gap: 11px;
  margin: 0 0 13px;
  padding: 15px;
  border: 1px solid rgba(225,190,111,.22);
  border-radius: 19px;
  background:
    radial-gradient(circle at 100% 0, rgba(220,166,69,.12), transparent 43%),
    linear-gradient(145deg, rgba(83,59,129,.14), rgba(255,255,255,.026));
}

.momentum-coach-card-icon {
  display: grid;
  width: 43px;
  height: 43px;
  place-items: center;
  border: 1px solid rgba(236,198,116,.28);
  border-radius: 14px;
  color: #fff1c9;
  background: linear-gradient(145deg, rgba(118,78,190,.55), rgba(176,117,45,.44));
  font-size: 19px;
}

.momentum-coach-card-copy {
  min-width: 0;
}

.momentum-coach-card-copy small,
.momentum-coach-card-copy strong {
  display: block;
}

.momentum-coach-card-copy small {
  color: #e7c983;
  font-size: 7px;
  font-weight: 950;
  letter-spacing: .12em;
}

.momentum-coach-card-copy strong {
  margin-top: 4px;
  color: #fff;
  font-size: 13px;
}

.momentum-coach-card-copy p {
  margin: 6px 0 0;
  color: rgba(235,229,211,.53);
  font-size: 8px;
  line-height: 1.5;
}

.momentum-coach-card > button {
  grid-column: 1 / -1;
  min-height: 42px;
  border: 1px solid rgba(236,198,116,.25);
  border-radius: 12px;
  color: #fff1c9;
  background: rgba(161,105,47,.11);
  font-size: 9px;
  font-weight: 900;
}

.coach-dialog-intro {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr);
  align-items: center;
  gap: 11px;
  margin-bottom: 15px;
  padding: 13px;
  border: 1px solid rgba(139,124,255,.16);
  border-radius: 15px;
  background: rgba(255,255,255,.026);
}

.coach-dialog-intro > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 13px;
  background: rgba(109,93,252,.15);
  font-size: 18px;
}

.coach-dialog-intro strong,
.coach-dialog-intro small {
  display: block;
}

.coach-dialog-intro strong {
  color: #fff;
  font-size: 10px;
}

.coach-dialog-intro small {
  margin-top: 4px;
  color: rgba(226,228,255,.47);
  font-size: 8px;
  line-height: 1.4;
}

.coach-dialog-actions {
  margin: 3px 0 13px;
}

.chapter-pulse-panel {
  margin-bottom: 14px;
  padding: 14px;
  border: 1px solid rgba(139,124,255,.17);
  border-radius: 17px;
  background:
    radial-gradient(circle at 100% 0, rgba(109,93,252,.12), transparent 44%),
    rgba(255,255,255,.026);
}

.chapter-pulse-label {
  color: #aaa2ff;
  font-size: 7px;
  font-weight: 950;
  letter-spacing: .13em;
}

.chapter-pulse-panel h3 {
  margin: 5px 0 11px;
  color: #fff;
  font-size: 14px;
}

.chapter-pulse-options {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 7px;
}

.chapter-pulse-options button {
  display: grid;
  min-height: 67px;
  place-items: center;
  align-content: center;
  gap: 5px;
  padding: 8px 5px;
  border: 1px solid rgba(139,124,255,.16);
  border-radius: 13px;
  color: rgba(238,239,255,.64);
  background: rgba(255,255,255,.025);
}

.chapter-pulse-options button span {
  font-size: 20px;
}

.chapter-pulse-options button strong {
  font-size: 8px;
  line-height: 1.2;
}

.chapter-pulse-options button.active {
  border-color: rgba(139,124,255,.62);
  color: #fff;
  background: rgba(109,93,252,.13);
  box-shadow: 0 0 0 1px rgba(139,124,255,.08);
}

#chapterPulseResponse {
  min-height: 30px;
  margin: 10px 1px 0;
  color: rgba(227,229,255,.50);
  font-size: 8px;
  line-height: 1.45;
}

.reflection-writing-label {
  margin: 0 0 8px;
  color: rgba(244,245,255,.88);
  font-size: 12px;
  font-weight: 900;
}

@media (max-width: 390px) {
  .chapter-pulse-options {
    gap: 5px;
  }

  .chapter-pulse-options button {
    min-height: 62px;
    padding-inline: 3px;
  }

  .chapter-pulse-options button strong {
    font-size: 7px;
  }
}


/* ==========================================================
   Send Feedback
   ========================================================== */

.feedback-dialog {
  z-index: 1500;
}

.feedback-panel {
  width: min(100%, 620px);
}

.feedback-intro {
  display: flex;
  align-items: flex-start;
  gap: 13px;
  margin-bottom: 18px;
  padding: 16px;
  border: 1px solid rgba(139,124,255,.18);
  border-radius: 18px;
  background:
    radial-gradient(circle at 100% 0, rgba(109,93,252,.12), transparent 42%),
    rgba(255,255,255,.026);
}

.feedback-intro-icon {
  display: grid;
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(139,124,255,.24);
  border-radius: 14px;
  background: rgba(109,93,252,.13);
  font-size: 20px;
}

.feedback-intro h3 {
  margin: 0;
  color: #fff;
  font-size: 15px;
}

.feedback-intro p {
  margin: 5px 0 0;
  color: rgba(228,230,255,.54);
  font-size: 10px;
  line-height: 1.55;
}

.feedback-type-fieldset {
  margin: 0;
  padding: 0;
  border: 0;
}

.feedback-type-fieldset legend,
.feedback-message-field > span {
  display: block;
  margin-bottom: 10px;
  color: rgba(247,247,255,.88);
  font-size: 11px;
  font-weight: 900;
}

.feedback-type-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.feedback-type-option {
  position: relative;
  display: grid;
  min-height: 82px;
  place-items: center;
  gap: 5px;
  padding: 12px 8px;
  border: 1px solid rgba(139,124,255,.14);
  border-radius: 16px;
  color: rgba(232,233,255,.58);
  background: rgba(255,255,255,.025);
  text-align: center;
  cursor: pointer;
}

.feedback-type-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.feedback-type-option > span {
  font-size: 19px;
}

.feedback-type-option strong {
  font-size: 9px;
  line-height: 1.25;
}

.feedback-type-option:has(input:checked) {
  border-color: rgba(139,124,255,.52);
  color: #fff;
  background:
    linear-gradient(135deg, rgba(109,93,252,.25), rgba(57,126,255,.12));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 28px rgba(23,17,80,.14);
}

.feedback-type-option:has(input:focus-visible) {
  outline: 2px solid rgba(139,124,255,.78);
  outline-offset: 2px;
}

.feedback-message-field {
  display: block;
  margin-top: 18px;
}

.feedback-message-field textarea {
  width: 100%;
  min-height: 150px;
  resize: vertical;
  margin: 0;
  padding: 14px;
  border: 1px solid rgba(139,124,255,.18);
  border-radius: 16px;
  color: #fff;
  background: rgba(4,5,16,.34);
  font: inherit;
  font-size: 12px;
  line-height: 1.55;
}

.feedback-message-field textarea::placeholder {
  color: rgba(222,224,255,.30);
}

.feedback-message-field textarea:focus {
  border-color: rgba(139,124,255,.55);
  outline: none;
  box-shadow: 0 0 0 4px rgba(109,93,252,.10);
}

.feedback-character-row {
  display: flex;
  min-height: 22px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 6px;
  color: rgba(225,227,255,.34);
  font-size: 9px;
}

#feedbackFormError {
  color: #ff9baa;
  font-weight: 800;
}

.feedback-context-option {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  margin-top: 13px;
  padding: 13px;
  border: 1px solid rgba(139,124,255,.12);
  border-radius: 15px;
  background: rgba(255,255,255,.022);
}

.feedback-context-option input {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  margin: 1px 0 0;
  accent-color: #7668ff;
}

.feedback-context-option span {
  display: grid;
  gap: 3px;
}

.feedback-context-option strong {
  color: rgba(244,245,255,.82);
  font-size: 10px;
}

.feedback-context-option small {
  color: rgba(224,226,255,.42);
  font-size: 8px;
  line-height: 1.5;
}

.feedback-send-button {
  width: 100%;
  min-height: 50px;
  margin-top: 16px;
}

.feedback-email-note {
  margin: 11px 10px 0;
  color: rgba(222,224,255,.36);
  font-size: 8px;
  line-height: 1.5;
  text-align: center;
}

.feedback-email-note strong {
  color: rgba(234,235,255,.60);
}

@media (max-width: 390px) {
  .feedback-type-option {
    min-height: 76px;
    padding-inline: 5px;
  }

  .feedback-type-option strong {
    font-size: 8px;
  }

  .feedback-message-field textarea {
    min-height: 132px;
  }
}




/* ==========================================================
   Active Chapter Shelf
   ========================================================== */

.chapter-shelf-home {
  display: grid;
  gap: 18px;
}

.chapter-shelf-home.hidden,
.chapter-workspace.hidden {
  display: none !important;
}

.chapter-shelf-section {
  min-width: 0;
  margin-top: 1px;
}

.chapter-shelf-heading {
  align-items: center;
}

.chapter-shelf-add-button {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(139,124,255,.26);
  border-radius: 14px;
  color: #fff;
  background:
    linear-gradient(
      135deg,
      rgba(109,93,252,.88),
      rgba(71,111,241,.78)
    );
  box-shadow: 0 10px 28px rgba(57,43,172,.20);
  font-size: 22px;
  font-weight: 700;
}

.chapter-shelf-intro {
  margin: 8px 0 13px;
  color: rgba(229,231,255,.48);
  font-size: 9px;
  line-height: 1.5;
}

.chapter-carousel {
  display: flex;
  gap: 12px;
  margin-right: -18px;
  padding: 2px 18px 7px 0;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.chapter-carousel::-webkit-scrollbar {
  display: none;
}

.chapter-cover-card {
  position: relative;
  display: flex;
  flex: 0 0 min(88%, 360px);
  min-height: 252px;
  flex-direction: column;
  align-items: stretch;
  scroll-snap-align: start;
  overflow: hidden;
  padding: 20px 19px 18px 24px;
  border: 1px solid rgba(139,124,255,.21);
  border-radius: 15px 24px 24px 15px;
  color: #fff;
  background:
    radial-gradient(
      circle at 100% 0,
      rgba(109,93,252,.22),
      transparent 43%
    ),
    linear-gradient(
      145deg,
      rgba(40,43,86,.98),
      rgba(15,17,39,.99) 74%
    );
  box-shadow:
    0 18px 42px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.05);
  text-align: left;
}

.chapter-cover-card:nth-child(3n + 2) {
  background:
    radial-gradient(
      circle at 100% 0,
      rgba(61,130,255,.20),
      transparent 45%
    ),
    linear-gradient(
      145deg,
      rgba(29,46,83,.98),
      rgba(13,18,37,.99) 74%
    );
}

.chapter-cover-card:nth-child(3n + 3) {
  background:
    radial-gradient(
      circle at 100% 0,
      rgba(226,93,190,.16),
      transparent 45%
    ),
    linear-gradient(
      145deg,
      rgba(59,34,73,.98),
      rgba(18,14,36,.99) 74%
    );
}

.chapter-cover-spine {
  position: absolute;
  inset: 0 auto 0 0;
  width: 8px;
  background:
    linear-gradient(
      180deg,
      #8b7cff,
      #4a67de
    );
  box-shadow: 4px 0 12px rgba(0,0,0,.24);
}

.chapter-cover-card.current {
  border-color: rgba(139,124,255,.50);
  box-shadow:
    0 20px 48px rgba(0,0,0,.28),
    0 0 0 1px rgba(139,124,255,.14),
    0 0 38px rgba(109,93,252,.10);
}

.chapter-cover-top,
.chapter-cover-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.chapter-cover-kicker {
  color: #a99fff;
  font-size: 7px;
  font-weight: 950;
  letter-spacing: .14em;
}

.chapter-cover-book {
  font-size: 22px;
}

/* Silent progress ring: the current chapter shows today's completion
   visually without displaying a percentage or score. */
.chapter-cover-progress {
  --chapter-progress: 0;
  position: relative;
  display: grid;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  place-items: center;
  border-radius: 50%;
  background:
    conic-gradient(
      #7f8cff calc(var(--chapter-progress) * 1%),
      rgba(220,222,255,.16) 0
    );
  box-shadow:
    0 0 0 1px rgba(139,124,255,.12),
    0 0 18px rgba(109,93,252,.10);
}

.chapter-cover-progress::after {
  position: absolute;
  inset: 5px;
  border-radius: 50%;
  background: #191a3d;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.025);
  content: "";
}

.chapter-cover-progress .chapter-cover-book {
  position: relative;
  z-index: 1;
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
  font-size: 20px;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.26));
}

.chapter-cover-card.current .chapter-cover-progress {
  box-shadow:
    0 0 0 1px rgba(139,124,255,.18),
    0 0 22px rgba(109,93,252,.14);
}

.chapter-cover-title {
  display: block;
  max-width: 86%;
  margin-top: 40px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(23px, 6vw, 31px);
  line-height: 1.06;
  letter-spacing: -.025em;
}

.chapter-cover-status {
  display: block;
  margin-top: 10px;
  color: rgba(232,233,255,.56);
  font-size: 9px;
  line-height: 1.5;
}

.chapter-cover-bottom {
  margin-top: auto;
  padding-top: 26px;
  border-top: 1px solid rgba(139,124,255,.13);
}

.chapter-cover-bottom > span:first-child {
  display: grid;
  gap: 1px;
}

.chapter-cover-bottom small {
  color: rgba(229,231,255,.35);
  font-size: 5.5px;
  font-weight: 950;
  letter-spacing: .13em;
}

.chapter-cover-bottom b {
  font-size: 16px;
}

.chapter-cover-started {
  color: rgba(229,231,255,.34);
  font-size: 7px;
}

.chapter-cover-continue {
  color: #c9c3ff;
  font-size: 8px;
  font-weight: 950;
}

.chapter-cover-add {
  align-items: center;
  justify-content: center;
  border-style: dashed;
  background:
    radial-gradient(
      circle at 50% 18%,
      rgba(109,93,252,.15),
      transparent 42%
    ),
    rgba(255,255,255,.018);
  text-align: center;
}

.chapter-cover-add .chapter-add-icon {
  display: grid;
  width: 58px;
  height: 58px;
  place-items: center;
  border: 1px solid rgba(139,124,255,.26);
  border-radius: 18px;
  color: #c8c2ff;
  background: rgba(109,93,252,.10);
  font-size: 29px;
}

.chapter-cover-add strong {
  margin-top: 18px;
  font-family: inherit;
  font-size: 16px;
}

.chapter-cover-add > span:not(.chapter-add-icon) {
  max-width: 230px;
  margin-top: 7px;
  color: rgba(229,231,255,.46);
  font-size: 9px;
  line-height: 1.5;
}

.chapter-cover-add > b {
  margin-top: 18px;
  color: #bcb4ff;
  font-size: 9px;
}

.chapter-carousel-dots {
  display: flex;
  min-height: 15px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 7px;
}

.chapter-carousel-dots span {
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: rgba(220,222,255,.22);
}

.chapter-carousel-dots span.active {
  width: 15px;
  background: #8577ff;
}

.chapter-carousel-dots span.add {
  display: grid;
  width: 12px;
  height: 12px;
  place-items: center;
  color: rgba(220,222,255,.30);
  background: transparent;
  font-size: 9px;
}

.chapter-shelf-hint {
  margin: 0;
  color: rgba(226,228,255,.28);
  font-size: 7px;
  font-weight: 800;
  text-align: center;
}

.active-chapter-workspace-header {
  position: relative;
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) auto;
  gap: 11px;
  align-items: center;
  margin-bottom: 14px;
  padding: 4px 0 11px;
  border-bottom: 1px solid rgba(139,124,255,.10);
}

.chapter-workspace-back {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid rgba(139,124,255,.17);
  border-radius: 12px;
  color: rgba(238,239,255,.72);
  background: rgba(255,255,255,.025);
  font-size: 25px;
  line-height: 1;
}

.active-chapter-workspace-header h2 {
  margin: 3px 0 0;
  color: #fff;
  font-size: 17px;
  line-height: 1.15;
}

#activeChapterWorkspacePage {
  display: block;
  margin-top: 4px;
  color: rgba(226,228,255,.38);
  font-size: 7px;
  font-weight: 800;
}

.chapter-workspace-book {
  font-size: 24px;
}

.chapter-workspace > .daily-reflection-card {
  margin-top: 3px;
}

.new-chapter-intro {
  display: flex;
  gap: 12px;
  margin-bottom: 18px;
  padding: 14px;
  border: 1px solid rgba(139,124,255,.15);
  border-radius: 16px;
  background: rgba(255,255,255,.024);
}

.new-chapter-intro > span {
  display: grid;
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(139,124,255,.20);
  border-radius: 13px;
  background: rgba(109,93,252,.10);
  font-size: 19px;
}

.new-chapter-intro strong,
.new-chapter-intro p {
  display: block;
}

.new-chapter-intro strong {
  color: #f5f3ff;
  font-size: 11px;
}

.new-chapter-intro p {
  margin: 4px 0 0;
  color: rgba(227,229,255,.48);
  font-size: 8px;
  line-height: 1.5;
}

.new-chapter-why-label {
  display: flex !important;
  justify-content: space-between;
  gap: 10px;
}

.new-chapter-why-label span {
  color: rgba(226,228,255,.30);
  font-size: 7px;
  font-weight: 700;
}

.new-chapter-focus-fieldset {
  margin: 18px 0 0;
  padding: 0;
  border: 0;
}

.new-chapter-focus-fieldset legend {
  margin-bottom: 9px;
  color: rgba(245,246,255,.80);
  font-size: 10px;
  font-weight: 900;
}

.new-chapter-focus-grid {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 8px;
}

.new-chapter-focus-option {
  position: relative;
  display: flex;
  min-height: 48px;
  align-items: center;
  gap: 9px;
  padding: 10px;
  border: 1px solid rgba(139,124,255,.14);
  border-radius: 13px;
  color: rgba(232,233,255,.54);
  background: rgba(255,255,255,.022);
}

.new-chapter-focus-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.new-chapter-focus-option span {
  font-size: 17px;
}

.new-chapter-focus-option strong {
  font-size: 9px;
}

.new-chapter-focus-option:has(input:checked) {
  border-color: rgba(139,124,255,.45);
  color: #fff;
  background:
    linear-gradient(
      135deg,
      rgba(109,93,252,.20),
      rgba(57,126,255,.10)
    );
}

@media (max-width: 390px) {
  .chapter-cover-card {
    flex-basis: 91%;
    min-height: 238px;
  }

  .chapter-cover-title {
    margin-top: 32px;
    font-size: 24px;
  }

  .chapter-cover-started {
    display: none;
  }
}


/* Desktop chapter shelf interaction */
@media (hover: hover) and (pointer: fine) {
  .chapter-carousel {
    cursor: grab;
  }

  .chapter-carousel.is-dragging {
    cursor: grabbing;
    scroll-snap-type: none;
    user-select: none;
  }

  .chapter-carousel.is-dragging .chapter-cover-card {
    pointer-events: none;
  }
}
\n\n/* =========================================================\n   PHASE 2 — MOMENTUM PROGRESS ON TODAY / CHAPTER SHELF\n   Momentum's own evolution is told as chapters rather than\n   a conventional software changelog.\n   ========================================================= */\n.momentum-progress-home {\n  margin-top: 26px;\n  padding: 22px 0 34px;\n  border-top: 1px solid rgba(139,124,255,.14);\n}\n\n.momentum-progress-home-heading {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: 18px;\n  padding: 0 2px 14px;\n}\n\n.momentum-progress-home-heading h2 {\n  margin: 4px 0 0;\n}\n\n.momentum-progress-home-intro {\n  max-width: 520px;\n  margin: 8px 0 0;\n  color: rgba(232,233,255,.48);\n  font-size: 10px;\n  line-height: 1.55;\n}\n\n.momentum-progress-home-book {\n  display: grid;\n  width: 42px;\n  height: 42px;\n  flex: 0 0 42px;\n  place-items: center;\n  border: 1px solid rgba(139,124,255,.22);\n  border-radius: 14px;\n  background: linear-gradient(145deg, rgba(109,93,252,.20), rgba(31,35,75,.36));\n  box-shadow: 0 12px 30px rgba(0,0,0,.18);\n  font-size: 20px;\n}\n\n.momentum-progress-home-rail {\n  display: grid;\n  grid-auto-columns: min(86%, 330px);\n  grid-auto-flow: column;\n  gap: 12px;\n  overflow-x: auto;\n  padding: 4px 2px 12px;\n  scroll-snap-type: x mandatory;\n  scrollbar-width: none;\n  overscroll-behavior-inline: contain;\n}\n\n.momentum-progress-home-rail::-webkit-scrollbar { display: none; }\n\n.momentum-progress-home-card {\n  position: relative;\n  min-height: 190px;\n  padding: 18px;\n  overflow: hidden;\n  scroll-snap-align: start;\n  border: 1px solid rgba(139,124,255,.18);\n  border-radius: 22px;\n  background:\n    radial-gradient(circle at 100% 0%, rgba(109,93,252,.16), transparent 38%),\n    linear-gradient(145deg, rgba(26,28,64,.96), rgba(12,13,31,.98));\n  box-shadow: 0 16px 34px rgba(0,0,0,.22);\n}\n\n.momentum-progress-home-card.latest {\n  border-color: rgba(139,124,255,.44);\n  box-shadow: 0 16px 38px rgba(0,0,0,.24), 0 0 26px rgba(109,93,252,.08);\n}\n\n.momentum-progress-home-meta {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 10px;\n  color: rgba(199,201,255,.48);\n  font-size: 7px;\n  font-weight: 950;\n  letter-spacing: .13em;\n}\n\n.momentum-progress-home-kind {\n  display: inline-flex;\n  margin-top: 13px;\n  padding: 5px 8px;\n  border: 1px solid rgba(139,124,255,.18);\n  border-radius: 999px;\n  background: rgba(139,124,255,.09);\n  color: #c5c0ff;\n  font-size: 7px;\n  font-weight: 950;\n  letter-spacing: .08em;\n  text-transform: uppercase;\n}\n\n.momentum-progress-home-kind.possibility { color: #b9b5ff; }\n.momentum-progress-home-kind.refined { color: #b8d5ff; }\n.momentum-progress-home-kind.correction { color: #f2c8ff; }\n.momentum-progress-home-kind.milestone { color: #e7dcff; }\n\n.momentum-progress-home-card h3 {\n  margin: 14px 0 8px;\n  font-family: Georgia, "Times New Roman", serif;\n  font-size: 21px;\n  line-height: 1.08;\n  letter-spacing: -.02em;\n}\n\n.momentum-progress-home-card p {\n  margin: 0;\n  color: rgba(232,233,255,.54);\n  font-size: 9px;\n  line-height: 1.55;\n}\n\n.momentum-progress-home-now {\n  display: inline-flex;\n  margin-top: 14px;\n  color: #a99fff;\n  font-size: 8px;\n  font-weight: 900;\n}\n\n.momentum-progress-home-hint {\n  margin: 0;\n  color: rgba(232,233,255,.28);\n  font-size: 7px;\n  font-weight: 800;\n  text-align: center;\n}\n\n@media (min-width: 760px) {\n  .momentum-progress-home-rail {\n    grid-auto-columns: min(48%, 360px);\n  }\n  .momentum-progress-home-card {\n    min-height: 210px;\n  }\n}\n

/* =========================================================
   PHASE 2 v4 — MOMENTUM PROGRESS: CHAPTER CARDS + TOPICS
   ========================================================= */
.momentum-progress-home {
  margin-top: 28px;
  padding: 24px 0 30px;
  border-top: 1px solid rgba(139,124,255,.16);
}
.momentum-progress-home-heading {
  display:flex; align-items:flex-start; justify-content:space-between; gap:16px;
  padding:0 0 12px;
}
.momentum-progress-home-heading h2 { margin:4px 0 0; }
.momentum-progress-home-intro {
  max-width:430px; margin:8px 0 0; color:rgba(232,233,255,.5); font-size:9px; line-height:1.55;
}
.momentum-progress-home-book {
  width:40px; height:40px; flex:0 0 40px; display:grid; place-items:center;
  border:1px solid rgba(139,124,255,.24); border-radius:13px;
  background:linear-gradient(145deg,rgba(109,93,252,.2),rgba(31,35,75,.38)); font-size:18px;
}
.momentum-progress-topics {
  display:flex; gap:7px; overflow-x:auto; padding:3px 0 13px; scrollbar-width:none;
  scroll-snap-type:x proximity;
}
.momentum-progress-topics::-webkit-scrollbar { display:none; }
.momentum-topic {
  flex:0 0 auto; scroll-snap-align:start; min-height:30px; padding:7px 10px;
  border:1px solid rgba(139,124,255,.18); border-radius:999px;
  background:rgba(255,255,255,.025); color:rgba(232,233,255,.54);
  font:800 7px/1 var(--font-sans,Arial,sans-serif); letter-spacing:.045em; white-space:nowrap;
}
.momentum-topic.active {
  color:#fff; border-color:rgba(139,124,255,.55);
  background:linear-gradient(135deg,rgba(109,93,252,.34),rgba(57,126,255,.18));
  box-shadow:0 0 20px rgba(109,93,252,.08);
}
.momentum-progress-home-rail {
  display:grid !important; grid-auto-flow:column; grid-auto-columns:min(84%,310px); gap:11px;
  overflow-x:auto !important; overflow-y:hidden; padding:2px 1px 10px;
  scroll-snap-type:x mandatory; scrollbar-width:none; overscroll-behavior-inline:contain;
}
.momentum-progress-home-rail::-webkit-scrollbar { display:none; }
.momentum-progress-home-card {
  display:block; position:relative; box-sizing:border-box; min-height:205px; padding:17px 17px 16px 22px;
  scroll-snap-align:start; overflow:hidden; border:1px solid rgba(139,124,255,.24); border-radius:22px;
  background:radial-gradient(circle at 100% 0%,rgba(109,93,252,.18),transparent 38%),linear-gradient(145deg,#1a1c40,#0c0d1f 76%);
  box-shadow:0 16px 32px rgba(0,0,0,.24);
}
.momentum-progress-home-card::before {
  content:""; position:absolute; inset:0 auto 0 0; width:6px;
  background:linear-gradient(180deg,#8b7cff,#5c52ff);
}
.momentum-progress-home-card[hidden] { display:none !important; }
.momentum-progress-home-card.latest { border-color:rgba(139,124,255,.52); }
.momentum-progress-home-meta {
  display:flex; justify-content:space-between; gap:8px; color:rgba(199,201,255,.48);
  font-size:7px; font-weight:950; letter-spacing:.13em;
}
.momentum-progress-home-kind {
  display:inline-flex; margin-top:12px; padding:5px 8px; border:1px solid rgba(139,124,255,.2);
  border-radius:999px; background:rgba(139,124,255,.09); color:#c5c0ff;
  font-size:7px; font-weight:950; letter-spacing:.08em; text-transform:uppercase;
}
.momentum-progress-home-kind.refined{color:#b8d5ff}.momentum-progress-home-kind.correction{color:#f2c8ff}.momentum-progress-home-kind.milestone{color:#e7dcff}
.momentum-progress-home-card h3 {
  margin:15px 0 8px; font-family:Georgia,"Times New Roman",serif; font-size:21px; line-height:1.08; letter-spacing:-.02em;
}
.momentum-progress-home-card p { margin:0; color:rgba(232,233,255,.56); font-size:9px; line-height:1.55; }
.momentum-progress-home-now { display:inline-flex; margin-top:13px; color:#aaa0ff; font-size:8px; font-weight:900; }
.momentum-progress-footer { display:flex; justify-content:space-between; align-items:center; gap:12px; padding-top:1px; }
.momentum-progress-home-hint { margin:0; color:rgba(232,233,255,.28); font-size:7px; font-weight:800; }
.momentum-progress-read-all { color:#a99fff; font-size:8px; font-weight:900; text-decoration:none; white-space:nowrap; }
@media (min-width:760px){
 .momentum-progress-home-rail{grid-auto-columns:min(47%,350px)}
 .momentum-progress-home-card{min-height:215px}
}

/* =========================================================
   PHASE 2 — OUR STORY / MOMENTUM PROGRESS BOOKSHELF
   Home stays intentionally small: latest four cards only.
   The library is release-scoped so it never becomes a feed.
   ========================================================= */
.momentum-progress-home-rail{grid-auto-columns:min(84%,310px)!important;max-width:100%}
.momentum-progress-home-card{cursor:pointer;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.momentum-progress-home-card:hover,.momentum-progress-home-card:focus-visible{transform:translateY(-2px);border-color:rgba(139,124,255,.5);box-shadow:0 18px 38px rgba(0,0,0,.28),0 0 24px rgba(109,93,252,.08);outline:none}
.momentum-progress-home-card.compact{min-height:210px}
.momentum-progress-home-card.community::before{background:linear-gradient(180deg,#ef7a9b,#b64b72)}
.momentum-progress-home-card.experience::before{background:linear-gradient(180deg,#b698ff,#7466ee)}
.momentum-progress-home-card.improvement::before{background:linear-gradient(180deg,#7dc7ff,#4a74e8)}
.momentum-progress-home-card.design::before{background:linear-gradient(180deg,#e6a7ff,#8b7cff)}
.momentum-progress-home-card.milestone::before{background:linear-gradient(180deg,#f4d47a,#b98f38)}
.momentum-progress-home-card.learned::before{background:linear-gradient(180deg,#7be0cc,#439b92)}
.momentum-progress-home-kind.community{color:#ffb4c8}.momentum-progress-home-kind.experience{color:#c7baff}.momentum-progress-home-kind.improvement{color:#a9d7ff}.momentum-progress-home-kind.design{color:#e4c3ff}.momentum-progress-home-kind.milestone{color:#f0d98e}.momentum-progress-home-kind.learned{color:#9fe7d8}
.momentum-story-read{display:inline-flex;margin-top:14px;color:#aaa0ff;font-size:8px;font-weight:900}
.momentum-story-badge{position:absolute;z-index:3;top:42px;right:14px;display:inline-flex;align-items:center;min-height:20px;padding:0 7px;border:1px solid rgba(159,231,216,.34);border-radius:999px;color:#bdf5e9;background:rgba(57,137,126,.18);font-size:6.5px;font-weight:950;letter-spacing:.1em;box-shadow:0 0 18px rgba(57,137,126,.08)}
.momentum-story-badge.updated{color:#e8dcff;border-color:rgba(169,159,255,.38);background:rgba(109,93,252,.18)}
.momentum-story-badge.detail{position:static;margin-top:14px}
.momentum-progress-read-all{appearance:none;border:0;background:transparent;cursor:pointer;padding:6px 0}
.momentum-progress-empty{padding:22px;border:1px dashed rgba(139,124,255,.18);border-radius:18px;color:rgba(232,233,255,.44);font-size:9px;text-align:center}

.momentum-story-dialog{width:min(92vw,760px);max-height:88dvh;padding:0;border:1px solid rgba(139,124,255,.24);border-radius:24px;color:#f5f4ff;background:#111328;box-shadow:0 28px 90px rgba(0,0,0,.55);overflow:hidden}
.momentum-story-dialog::backdrop{background:rgba(3,4,14,.72);backdrop-filter:blur(8px)}
.momentum-story-dialog-shell{position:relative;max-height:88dvh;overflow-y:auto;padding:28px}
.momentum-story-close{position:absolute;z-index:4;top:14px;right:14px;display:grid;width:34px;height:34px;place-items:center;border:1px solid rgba(139,124,255,.22);border-radius:50%;color:#fff;background:rgba(255,255,255,.035);font-size:20px;cursor:pointer}
.momentum-story-detail-meta{display:flex;flex-wrap:wrap;gap:8px;color:rgba(226,228,255,.4);font-size:7px;font-weight:950;letter-spacing:.11em;text-transform:uppercase}
.momentum-story-detail-thread{margin-top:18px;color:#c9c4ff;font-size:9px;font-weight:900}
.momentum-story-dialog h2{max-width:620px;margin:12px 44px 8px 0;font-family:Georgia,"Times New Roman",serif;font-size:clamp(27px,6vw,42px);line-height:1.05}
.momentum-story-detail-summary{max-width:610px;margin:0;color:rgba(236,237,255,.58);font-size:11px;line-height:1.6}
.momentum-story-copy{max-width:620px;margin-top:24px;padding-top:20px;border-top:1px solid rgba(139,124,255,.14);color:rgba(244,244,255,.78);font-size:12px;line-height:1.75}
.momentum-story-learned{margin-top:24px;padding:16px;border:1px solid rgba(123,224,204,.18);border-radius:16px;background:rgba(67,155,146,.07)}
.momentum-story-learned span{color:#9fe7d8;font-size:7px;font-weight:950;letter-spacing:.1em}.momentum-story-learned p{margin:8px 0 0;color:rgba(236,255,251,.68);font-size:10px;line-height:1.65}
.momentum-story-updated{margin-top:18px;color:rgba(232,233,255,.35);font-size:7px;font-weight:850}
.momentum-library-intro{max-width:560px;margin:8px 0 18px;color:rgba(232,233,255,.5);font-size:10px;line-height:1.55}
.momentum-release-tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 0 16px;scrollbar-width:none}.momentum-release-tabs::-webkit-scrollbar{display:none}
.momentum-release-tab{flex:0 0 auto;min-height:32px;padding:7px 12px;border:1px solid rgba(139,124,255,.18);border-radius:999px;color:rgba(232,233,255,.52);background:rgba(255,255,255,.025);font-size:8px;font-weight:900;cursor:pointer}.momentum-release-tab.active{color:#fff;border-color:rgba(139,124,255,.5);background:rgba(109,93,252,.2)}
.momentum-library-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.momentum-library-grid .momentum-progress-home-card{min-height:220px}
@media(max-width:620px){.momentum-library-grid{grid-template-columns:1fr}.momentum-story-dialog-shell{padding:24px 18px}.momentum-story-dialog h2{font-size:30px}.momentum-progress-footer{align-items:flex-end}}
@media(min-width:760px){.momentum-progress-home-rail{grid-auto-columns:min(47%,350px)!important}}


/* =========================================================
   PHASE 2 v6 — MOMENTUM PROGRESS DESKTOP CONTAINMENT + INPUT
   Keep Our Story inside the app shell and give its bookshelf
   the same mouse-wheel / drag behavior as Your Chapters.
   ========================================================= */
.chapter-shelf-home,
.momentum-progress-home {
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.momentum-progress-home {
  overflow: hidden;
}

.momentum-progress-home-heading {
  min-width: 0;
  max-width: 100%;
}

.momentum-progress-home-heading > div:first-child {
  min-width: 0;
  flex: 1 1 auto;
}

.momentum-progress-home-intro {
  max-width: 100%;
}

.momentum-progress-home-book {
  flex: 0 0 40px;
  margin-left: auto;
}

.momentum-progress-topics,
.momentum-progress-home-rail,
.momentum-progress-footer {
  min-width: 0;
  width: 100%;
  max-width: 100%;
}

.momentum-progress-home-rail {
  touch-action: pan-y;
  cursor: default;
}

@media (hover: hover) and (pointer: fine) {
  .momentum-progress-home-rail {
    cursor: grab;
  }

  .momentum-progress-home-rail.is-dragging {
    cursor: grabbing;
    scroll-snap-type: none;
    user-select: none;
  }

  .momentum-progress-home-rail.is-dragging .momentum-progress-home-card {
    pointer-events: none;
  }
}

/* =========================================================
   PHASE 2 v7 — THREE LARGE MOMENTUM PROGRESS COLLECTIONS
   Mobile-first: no tiny horizontal filter strip. Detailed
   story types remain on cards, while navigation stays simple.
   ========================================================= */
.momentum-progress-topics {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
  max-width: 100%;
  overflow: visible !important;
  padding: 2px 0 14px;
}
.momentum-topic {
  min-width: 0 !important;
  width: 100%;
  min-height: 52px;
  padding: 8px 5px !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border-radius: 14px !important;
  font-size: 11px !important;
  line-height: 1.12;
  letter-spacing: 0 !important;
  text-transform: none !important;
  white-space: normal !important;
  text-align: center;
}
.momentum-topic-icon {
  display: block;
  font-size: 16px;
  line-height: 1;
}
.momentum-topic.active {
  border-color: rgba(139,124,255,.62) !important;
  background: rgba(109,93,252,.22) !important;
  color: #fff !important;
}
.momentum-progress-home-card.community::before{background:linear-gradient(180deg,#ef7a9b,#b64b72)}
.momentum-progress-home-card.experience::before{background:linear-gradient(180deg,#b698ff,#7466ee)}
.momentum-progress-home-card.progress::before{background:linear-gradient(180deg,#7dc7ff,#5f63ef)}
.momentum-progress-home-kind.community{color:#ffb4c8}
.momentum-progress-home-kind.experience{color:#c7baff}
.momentum-progress-home-kind.progress{color:#a9d7ff}
.momentum-progress-home-type {
  display: block;
  margin-top: 6px;
  color: rgba(232,233,255,.46);
  font-size: 7px;
  font-weight: 850;
  letter-spacing: .055em;
  text-transform: uppercase;
}
@media (max-width: 390px) {
  .momentum-progress-topics { gap: 6px; }
  .momentum-topic { min-height: 54px; font-size: 10.5px !important; padding-inline: 3px !important; }
  .momentum-topic-icon { font-size: 17px; }
}


/* =========================================================
   CHAPTER TWO — FINAL HOME BOOKSHELF POLISH
   One visual rhythm for Your Story and Our Story.
   ========================================================= */
:root {
  --momentum-story-card-height: 210px;
}

/* Your Story: match the compact Momentum Progress card footprint. */
.chapter-cover-card {
  min-height: var(--momentum-story-card-height) !important;
  height: var(--momentum-story-card-height);
  padding: 16px 17px 15px 22px;
}
.chapter-cover-card.current {
  min-height: var(--momentum-story-card-height) !important;
  height: var(--momentum-story-card-height);
}
.chapter-cover-title {
  margin-top: 20px;
  font-size: clamp(21px, 5.4vw, 27px);
  line-height: 1.05;
}
.chapter-cover-status {
  margin-top: 7px;
  font-size: 8.5px;
}
.chapter-cover-bottom {
  padding-top: 14px;
}
.chapter-cover-progress {
  width: 44px;
  height: 44px;
  flex-basis: 44px;
}
.chapter-cover-progress .chapter-cover-book {
  font-size: 18px;
}
.chapter-cover-add .chapter-add-icon {
  width: 48px;
  height: 48px;
  font-size: 25px;
}
.chapter-cover-add strong {
  margin-top: 12px;
}
.chapter-cover-add > b {
  margin-top: 12px;
}

/* Our Story: same height and internal vertical rhythm. */
.momentum-progress-home-card,
.momentum-progress-home-card.compact {
  display: flex;
  min-height: var(--momentum-story-card-height) !important;
  height: var(--momentum-story-card-height);
  flex-direction: column;
  padding: 16px 17px 15px 20px;
}
.momentum-progress-home-card h3 {
  margin: 10px 0 7px;
  font-size: 20px;
  line-height: 1.06;
}
.momentum-progress-home-card p {
  display: -webkit-box;
  overflow: hidden;
  font-size: 8.5px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}
.momentum-progress-home-kind {
  margin-top: 10px;
}
.momentum-progress-home-type {
  margin-top: 4px;
}
.momentum-story-read {
  margin-top: auto !important;
  padding-top: 10px;
}

/* Give both shelves the same card width and next-card peek. */
.chapter-cover-card,
.momentum-progress-home-rail {
  scroll-padding-inline: 0;
}
.momentum-progress-home-rail {
  grid-auto-columns: min(88%, 360px) !important;
}

@media (max-width: 390px) {
  :root { --momentum-story-card-height: 204px; }
  .chapter-cover-card { flex-basis: 91%; }
  .chapter-cover-title {
    margin-top: 17px;
    font-size: 22px;
  }
  .chapter-cover-started { display: none; }
  .momentum-progress-home-rail { grid-auto-columns: 91% !important; }
}

@media (min-width: 760px) {
  .momentum-progress-home-card,
  .momentum-progress-home-card.compact {
    min-height: var(--momentum-story-card-height) !important;
    height: var(--momentum-story-card-height);
  }
}

/* =========================================================
   CHAPTER TWO — FINAL BOOKSHELF GEOMETRY FIX (v2)
   Your Story and Our Story now use the same desktop footprint,
   containment, peek, and end padding. The compact Our Story
   card size is the source of truth.
   ========================================================= */
.chapter-carousel,
.momentum-progress-home-rail {
  width: 100% !important;
  max-width: 100% !important;
  margin-right: 0 !important;
  padding: 4px 0 12px !important;
  gap: 12px !important;
  scroll-padding-inline: 0 !important;
}

.chapter-cover-card,
.momentum-progress-home-card,
.momentum-progress-home-card.compact {
  min-height: var(--momentum-story-card-height) !important;
  height: var(--momentum-story-card-height) !important;
}

/* Mobile: one readable cover with a consistent next-card peek. */
@media (max-width: 759px) {
  .chapter-cover-card {
    flex: 0 0 91% !important;
  }
  .momentum-progress-home-rail {
    grid-auto-columns: 91% !important;
  }
}

/* Desktop: compact two-up bookshelf, matching Momentum Progress. */
@media (min-width: 760px) {
  .chapter-cover-card {
    flex: 0 0 min(47%, 350px) !important;
  }
  .momentum-progress-home-rail {
    grid-auto-columns: min(47%, 350px) !important;
  }
}


/* Chapter Two final polish: keep page headers available while long sheets scroll. */
.sheet-dialog .sheet-panel > .dialog-heading {
  position: sticky;
  top: 0;
  z-index: 12;
  margin-left: -20px;
  margin-right: -20px;
  padding: 10px 20px 15px;
  background: linear-gradient(180deg, rgba(24,25,68,.985) 0%, rgba(24,25,68,.955) 82%, rgba(24,25,68,.90) 100%);
  box-shadow: 0 10px 24px rgba(5,6,20,.12);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

@media (prefers-reduced-transparency: reduce) {
  .sheet-dialog .sheet-panel > .dialog-heading {
    background: #181944;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}