:root {
  color-scheme: dark;
  --page: #090a0c;
  --surface: #202328;
  --raised: #2d3136;
  --line: #41444a;
  --text: #f5f1e8;
  --muted: #b6b7ba;
  --gold: #ffcf61;
  --home: #d8b78d;
  --health: #a4c5a3;
  --work: #aebfe5;
  --wealth: #ffcf61;
  --visible-height: 100dvh;
  font-size: 16px;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  background: var(--page);
  color: var(--text);
  font-family:
    Inter,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
  line-height: 1.5;
}
button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}
button,
a,
input,
select,
summary {
  -webkit-tap-highlight-color: transparent;
}
button {
  cursor: pointer;
  border: 0;
  background: none;
}
button:disabled {
  opacity: 0.45;
  cursor: default;
}
a {
  color: var(--gold);
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
button:focus-visible,
a:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 4px;
}
input,
textarea,
select {
  border: 1px solid var(--line);
  border-radius: 11px;
  background: #202226;
  min-height: 46px;
  padding: 11px 13px;
  max-width: 100%;
  font-size: 1rem;
}
input:focus,
textarea:focus,
select:focus {
  outline: 2px solid #e4be7070;
  outline-offset: 1px;
}
input[type="checkbox"] {
  accent-color: var(--gold);
  width: 22px;
  height: 22px;
  min-height: 22px;
}
textarea {
  resize: vertical;
  min-height: 100px;
}
svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex-shrink: 0;
}
h1,
h2,
h3,
h4,
p {
  margin: 0;
}
h1 {
  font-size: 1.7rem;
  line-height: 1.18;
  letter-spacing: -0.045em;
  font-weight: 850;
}
h2 {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.035em;
}
h3 {
  font-size: 1.15rem;
  line-height: 1.4;
}
h4 {
  margin: 20px 0 8px;
}
small,
.subtle {
  font-size: 0.85rem;
  color: var(--muted);
  line-height: 1.6;
}
.subtle {
  margin: 12px 0;
}
.hidden,
[hidden] {
  display: none !important;
}
.row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.app-shell {
  width: min(1120px, 100%);
  margin: auto;
  padding: 24px 32px 120px;
}
.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 4px 0 26px;
}
.brand {
  text-align: left;
  padding: 0;
  min-height: 48px;
}
.brand > span {
  font-size: 1.9rem;
  font-weight: 750;
  letter-spacing: -0.06em;
  line-height: 1.1;
}
.brand b {
  color: var(--gold);
  font-weight: 900;
}
.brand small {
  display: block;
  font-size: 0.72rem;
  letter-spacing: 0.18em;
  margin-top: 9px;
  color: #c2b9a9;
  font-weight: 650;
}
.icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  border-radius: 12px;
  color: var(--muted);
  padding: 8px;
}
.icon-btn:hover {
  background: var(--raised);
  color: var(--text);
}
.settings-button {
  border: 1px solid #ffffff13;
}
.command-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--muted);
  font-size: 0.83rem;
  gap: 12px;
  margin-bottom: 15px;
}
.command-label > span:first-child {
  font-size: 0.75rem;
  letter-spacing: 0.13em;
  font-weight: 750;
  color: #d0c8bb;
}
.rating-control {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}
.rating-control > span {
  margin-left: auto;
  font-size: 0.95rem;
}
.segmented {
  display: inline-flex;
  background: #111315;
  padding: 4px;
  border-radius: 12px;
  flex-shrink: 0;
  gap: 2px;
}
.segmented button {
  min-height: 40px;
  padding: 7px 16px;
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  border-radius: 9px;
}
.segmented .active {
  color: var(--gold);
  background: var(--raised);
  box-shadow: 0 2px 8px #0003;
}
.history-link {
  min-width: 44px;
}
.area-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
.area-card {
  position: relative;
  height: 208px;
  border-radius: 18px;
  overflow: hidden;
  text-align: left;
  background: var(--raised);
  box-shadow: 0 6px 20px #0002;
  isolation: isolate;
}
.cover-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
  transition: transform 0.3s;
}
.image-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    #07090b05 10%,
    #07090b35 38%,
    #07090bcf 100%
  );
  z-index: -1;
}
.area-name {
  position: absolute;
  left: 17px;
  bottom: 18px;
  font-size: 1.4rem;
  letter-spacing: -0.055em;
  font-weight: 900;
  color: #fff6e7;
  text-shadow: 0 1px 6px #000;
}
.ring {
  position: relative;
  width: 75px;
  height: 75px;
  flex-shrink: 0;
  color: var(--gold);
  border-radius: 100%;
  background: #121518d9;
  box-shadow: 0 2px 16px #0002;
}
.ring > svg {
  width: 100%;
  height: 100%;
  stroke-width: 3.6;
  transform: rotate(-90deg);
}
.ring-track {
  stroke: #eee2c52d;
}
.ring-fill {
  stroke: var(--gold);
  transition: stroke-dashoffset 0.5s ease;
}
.ring > div {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  line-height: 1;
}
.ring strong {
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -0.04em;
}
.ring small {
  font-size: 0.5rem;
  letter-spacing: 0.14em;
  font-weight: 800;
  color: #ecdbb7;
  margin-top: 4px;
}
.ring.large {
  width: 96px;
  height: 96px;
}
.ring.large strong {
  font-size: 1.85rem;
}
.area-card .ring {
  position: absolute;
  right: 12px;
  top: 12px;
}
.area-card:hover .cover-img {
  transform: scale(1.04) !important;
}
.section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 28px 0 12px;
}
.section-heading .subtle {
  margin: 0;
}
.today-heading {
  margin: 12px 0 14px;
}
.today-date-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 12px;
  min-width: 0;
}
.today-date-heading time {
  color: var(--muted);
  font-size: 0.875rem;
  line-height: 1.4;
}
.today-heading > .text-btn {
  flex-shrink: 0;
}
.today-heading h1 {
  font-size: 1.5rem;
  letter-spacing: -0.025em;
}
.today-columns {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 28px;
}
.primary-panel {
  border-radius: 16px;
  padding: 15px 14px 8px;
  background: linear-gradient(110deg, #e4be7017, #e4be7006);
  border: 1px solid #e4be7033;
}
.eyebrow {
  font-size: 0.73rem;
  letter-spacing: 0.11em;
  font-weight: 800;
  color: var(--gold);
  display: flex;
  align-items: center;
  gap: 8px;
}
.eyebrow svg {
  width: 16px;
  height: 16px;
}
.primary-empty {
  display: flex;
  width: 100%;
  min-height: 56px;
  text-align: left;
  align-items: center;
  gap: 15px;
  font-size: 1rem;
  color: #d2cec5;
  justify-content: space-between;
}
.primary-empty span {
  color: var(--gold);
  font-size: 1.5rem;
}
.primary-panel .task-row {
  background: none;
  border: 0;
  margin: 7px -8px 0;
}
.text-btn {
  color: var(--gold);
  font-size: 0.87rem;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 5px 4px;
}
.text-btn svg {
  width: 18px;
  height: 18px;
}
.task-list {
  background: var(--surface);
  border-radius: 16px;
  overflow: hidden;
}
.task-row {
  display: flex;
  align-items: center;
  gap: 3px;
  min-height: 78px;
  padding: 10px 8px;
  position: relative;
  border-bottom: 1px solid #ffffff08;
  transition: background 0.15s;
}
.task-row:last-child {
  border: 0;
}
.task-row.done .task-title {
  text-decoration: line-through;
  color: #b3afa7;
}
.task-row.done {
  background: #ffffff02;
}
.check-btn {
  width: 44px;
  height: 48px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  padding: 0;
}
.check-circle {
  border: 1.7px solid #949797;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  transition:
    background 0.18s,
    transform 0.18s;
}
.done .check-circle {
  background: var(--gold);
  border-color: var(--gold);
  color: #161a1e;
  animation: check-pop 0.23s ease;
}
.check-circle svg {
  width: 16px;
  height: 16px;
  stroke-width: 2.5;
}
.task-content {
  flex: 1;
  min-width: 0;
  text-align: left;
  padding: 3px 2px;
  min-height: 44px;
}
.task-title {
  font-size: 1rem;
  line-height: 1.45;
  display: block;
  overflow-wrap: anywhere;
  font-weight: 500;
}
.task-meta {
  color: var(--muted);
  font-size: 0.8rem;
  display: block;
  margin-top: 4px;
  line-height: 1.5;
}
.task-menu {
  width: 38px;
  min-width: 44px;
  color: #c1c0ba;
  font-size: 1.4rem;
}
.add-inline {
  margin-top: 7px;
}
.todo-heading {
  margin-top: 0;
}
.empty {
  padding: 32px 18px;
  color: var(--muted);
  text-align: center;
  background: var(--surface);
  border-radius: 15px;
  font-size: 0.95rem;
}
.empty.compact {
  padding: 23px 18px;
}
.quiet-note {
  color: #b0aba0;
  font-size: 0.94rem;
  line-height: 1.8;
  margin: 28px 12px;
  border-left: 2px solid #e4be7040;
  padding-left: 18px;
}
.event-card {
  width: 100%;
  display: flex;
  align-items: center;
  text-align: left;
  gap: 12px;
  background: var(--surface);
  border-radius: 14px;
  padding: 15px;
  margin: 12px 0;
}
.event-card > span:nth-child(2) {
  flex: 1;
}
.event-card small {
  display: block;
  font-size: 0.8rem;
}
.event-card strong {
  font-size: 1rem;
  display: block;
  font-weight: 600;
  margin: 2px 0;
}
.event-icon {
  background: #aebfe517;
  color: var(--work);
  width: 40px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 10px;
}
.event-card > svg {
  width: 16px;
  color: var(--muted);
}
.next-event {
  margin-top: 16px;
}
.completed {
  margin-top: 8px;
}
.completed summary {
  color: var(--muted);
  font-size: 0.87rem;
}
.completed summary span,
summary > span {
  margin-left: auto;
  color: var(--muted);
  font-size: 0.82rem;
}
summary {
  cursor: pointer;
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 10px 4px;
  list-style: none;
}
summary:before {
  content: "›";
  font-size: 1.3rem;
  color: var(--muted);
  line-height: 1;
  margin-right: 4px;
}
details[open] > summary:before {
  transform: rotate(90deg);
}
summary::-webkit-details-marker {
  display: none;
}
.attention {
  background: #e4be700b;
  border-radius: 14px;
  margin-top: 16px;
  padding: 4px 10px;
}
.attention summary {
  color: var(--gold);
  font-size: 0.85rem;
}
.status-strip {
  margin: 35px 0 0;
  text-align: center;
}
.status-strip button {
  color: #a7a7a8;
  font-size: 0.8rem;
  min-height: 44px;
}
.bottom-nav {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 30;
  background: #1c1f22f5;
  backdrop-filter: blur(20px);
  border-top: 1px solid #ffffff12;
  padding: 7px 12px max(7px, env(safe-area-inset-bottom));
}
.bottom-nav > div {
  display: flex;
  justify-content: center;
  max-width: 650px;
  margin: auto;
  gap: 12px;
}
.bottom-nav button {
  flex: 1;
  max-width: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 50px;
  color: #b1b3b6;
  font-size: 0.73rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  border-radius: 11px;
}
.bottom-nav button.active {
  color: var(--gold);
  background: #e4be700b;
}
.fab {
  position: fixed;
  right: max(24px, calc((100vw - 1160px) / 2));
  bottom: 95px;
  z-index: 25;
  width: 55px;
  height: 55px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background: var(--gold);
  color: #202327;
  box-shadow: 0 7px 24px #0005;
}
.fab svg {
  width: 28px;
  height: 28px;
}
.page-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 30px 0 22px;
}
.page-heading h1 {
  font-size: 1.9rem;
}
.page-heading p {
  color: var(--muted);
  font-size: 1rem;
  margin-top: 8px;
}
.week-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 22px 0 14px;
}
.weekly-focus {
  background: var(--surface);
  border-radius: 15px;
  padding: 6px 14px;
}
.weekly-focus > summary {
  font-size: 0.95rem;
  font-weight: 600;
}
.focus-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  padding-bottom: 10px;
}
.focus-card {
  display: flex;
  text-align: left;
  align-items: center;
  gap: 12px;
  padding: 12px 8px;
  border-radius: 12px;
  background: var(--raised);
  position: relative;
}
.focus-card .cover-img {
  position: static;
  width: 52px;
  height: 52px;
  border-radius: 9px;
  z-index: auto;
}
.focus-card > span {
  flex: 1;
  min-width: 0;
}
.focus-card b {
  font-weight: 800;
  color: var(--gold);
  display: block;
  font-size: 0.88rem;
}
.focus-card > span > span {
  display: block;
  font-size: 0.9rem;
  color: var(--text);
  margin-top: 2px;
}
.focus-card > svg {
  width: 16px;
}
.filters {
  display: flex;
  gap: 9px;
  flex-wrap: wrap;
  margin: 14px 0;
}
.filters select {
  font-size: 0.88rem;
  min-height: 44px;
}
.day-strip {
  display: flex;
  gap: 7px;
  margin: 16px 0 22px;
}
.day-strip button {
  flex: 1;
  border-radius: 12px;
  padding: 9px 4px;
  color: var(--muted);
  background: var(--surface);
  min-width: 44px;
}
.day-strip small {
  display: block;
  font-size: 0.77rem;
}
.day-strip b {
  display: block;
  font-size: 1.08rem;
}
.day-strip .active {
  background: var(--gold);
  color: #1c2023;
}
.day-strip .active small {
  color: #363330;
}
.board {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  padding: 3px 4px 24px;
  scroll-snap-type: x proximity;
  scroll-padding-left: 4px;
  align-items: flex-start;
  scrollbar-color: #746344 #25282d;
}
.day-column {
  flex: 0 0 275px;
  background: #11141666;
  border-radius: 17px;
  padding: 13px;
  min-height: 250px;
  scroll-snap-align: start;
  border: 2px solid transparent;
  transition: border-color 0.15s;
}
.day-column.is-today {
  border-top-color: var(--gold);
}
.day-column-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 4px 0 20px;
}
.day-column-head > b {
  font-size: 0.8rem;
  letter-spacing: 0.08em;
}
.day-column-head > span {
  font-size: 0.84rem;
  color: var(--muted);
}
.day-column .task-list {
  background: none;
  overflow: visible;
}
.board-card {
  background: var(--raised);
  border: 1px solid #ffffff08 !important;
  border-radius: 12px;
  flex-wrap: wrap;
  padding: 8px 4px 9px;
  margin-bottom: 10px;
  box-shadow: 0 4px 12px #0001;
}
.board-card .task-content {
  order: 0;
  flex-basis: calc(100% - 78px);
}
.board-card .check-btn {
  width: 38px;
}
.board-card .task-menu {
  position: absolute;
  right: 2px;
  bottom: 0;
  min-height: 35px;
}
.board-card .task-title {
  font-size: 0.96rem;
  padding-right: 3px;
}
.board-card .task-meta {
  font-size: 0.79rem;
  padding-right: 20px;
}
.board-card .drag-handle {
  width: 44px;
  min-width: 44px;
  min-height: 44px;
  touch-action: none;
  cursor: grab;
  color: #a4a5a6;
  align-self: stretch;
  font-size: 1.4rem;
  order: -1;
}
.board-card .check-btn {
  order: 2;
  position: absolute;
  right: 0;
  top: 4px;
}
.board-card .task-content {
  padding-right: 38px;
  min-height: 62px;
  flex-basis: calc(100% - 50px);
}
.board-card .task-menu {
  right: 1px;
  bottom: 2px;
}
.board-card.dragging {
  opacity: 0.4;
  transform: rotate(-2deg);
  box-shadow: 0 10px 25px #0006;
  pointer-events: none;
}
.drop-target {
  border-color: var(--gold);
  background: #e4be7010;
}
.drop-before {
  box-shadow: 0 -4px 0 var(--gold);
}
.routine-group {
  margin-top: 14px;
}
.routine-group > summary {
  font-size: 0.86rem;
  color: var(--muted);
}
.day-column .event-card {
  padding: 10px;
  gap: 6px;
}
.day-column .event-icon {
  display: none;
}
.unscheduled {
  background: var(--surface);
  border-radius: 13px;
  padding: 4px 14px;
}
.week-list {
  max-width: 760px;
}
.search-box {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--surface);
  border-radius: 14px;
  padding: 4px 12px;
  color: var(--muted);
  margin-bottom: 14px;
}
.search-box input {
  border: 0;
  background: none;
  flex: 1;
  min-width: 0;
}
.chips {
  display: flex;
  gap: 8px;
  overflow: auto;
  white-space: nowrap;
  padding: 4px 0 12px;
}
.chip {
  min-height: 44px;
  border-radius: 11px;
  background: var(--surface);
  color: var(--muted);
  padding: 8px 14px;
  font-size: 0.86rem;
  flex-shrink: 0;
}
.chip.active {
  background: #e4be7020;
  color: var(--gold);
}
.notes-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 14px 0;
}
.note-card {
  text-align: left;
  display: flex;
  flex-direction: column;
  padding: 24px;
  background: var(--surface);
  border-radius: 16px;
  min-height: 165px;
  border-top: 2px solid #e4be7040;
  gap: 8px;
}
.note-title {
  font-size: 1.2rem;
  font-weight: 650;
  line-height: 1.4;
  display: flex;
  gap: 7px;
  overflow-wrap: anywhere;
}
.note-title svg {
  width: 16px;
  color: var(--gold);
}
.note-preview {
  font-size: 0.95rem;
  color: #c2c1bd;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.note-card small {
  font-size: 0.8rem;
  margin-top: auto;
}
.note-empty {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 70px 20px;
}
.calendar-layout {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 28px;
}
.month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 4px;
  align-self: start;
}
.weekday {
  text-align: center;
  font-size: 0.8rem;
  padding: 12px 0;
  color: var(--muted);
}
.calendar-day {
  min-height: 92px;
  background: var(--surface);
  border-radius: 10px;
  padding: 10px 6px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  border: 1px solid transparent;
}
.calendar-day b {
  font-weight: 550;
  font-size: 0.95rem;
}
.calendar-day.active {
  background: #e4be7022;
  border-color: var(--gold);
}
.calendar-day.is-today b {
  color: var(--gold);
}
.calendar-day.other-month {
  opacity: 0.42;
}
.calendar-dots {
  display: flex;
  gap: 3px;
}
.dot {
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--gold);
}
.dot.home {
  background: var(--home);
}
.dot.health {
  background: var(--health);
}
.dot.work {
  background: var(--work);
}
.dot.wealth {
  background: var(--wealth);
}
.desktop-agenda {
  font-size: 0.63rem;
  max-width: 100%;
  color: var(--muted);
  line-height: 1.5;
}
.desktop-agenda span {
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  max-width: 100%;
}
.day-agenda .section-heading {
  margin-top: 6px;
}
.area-header {
  isolation: isolate;
  position: relative;
  height: 220px;
  border-radius: 18px;
  overflow: hidden;
  margin: 12px 0 18px;
}
.area-header-content {
  position: absolute;
  bottom: 24px;
  left: 28px;
  right: 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.area-header h1 {
  font-size: 2.5rem;
  color: #fff5e2;
}
.area-header small {
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  color: #fff5e2;
  font-weight: 700;
}
.change-image {
  position: absolute;
  right: 12px;
  top: 12px;
  background: #16191ddd;
  color: var(--text);
  border-radius: 10px;
  display: flex;
  gap: 8px;
  align-items: center;
  min-height: 44px;
  padding: 8px 12px;
  font-size: 0.8rem;
}
.change-image svg {
  width: 16px;
}
.ring-button {
  padding: 0;
  border-radius: 50%;
}
.tabs {
  display: flex;
  gap: 20px;
  margin: 20px 0 26px;
  border-bottom: 1px solid #ffffff10;
}
.tabs button {
  min-height: 48px;
  font-size: 0.85rem;
  font-weight: 800;
  color: var(--muted);
  border-bottom: 2px solid transparent;
}
.tabs .active {
  color: var(--gold);
  border-bottom-color: var(--gold);
}
.card {
  background: var(--surface);
  border-radius: 15px;
  padding: 22px;
}
.area-focus {
  display: grid;
  width: 100%;
  grid-template-columns: 1fr 22px;
  text-align: left;
  gap: 7px;
}
.area-focus small {
  color: var(--gold);
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.1em;
}
.area-focus > span {
  font-size: 1.1rem;
  grid-row: 2;
  line-height: 1.5;
}
.area-focus > svg {
  grid-row: 1/3;
  grid-column: 2;
  align-self: center;
  width: 18px;
  color: var(--muted);
}
.connection-line {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 10px;
  align-items: center;
  border-radius: 12px;
  background: #ffffff03;
  padding: 15px 16px;
  margin: 16px 0;
  font-size: 0.88rem;
  color: var(--muted);
}
.connection-line a {
  display: flex;
  align-items: center;
  gap: 8px;
}
.connection-line svg {
  width: 15px;
}
.goal-grid,
.list-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.goal-card {
  text-align: left;
}
.goal-number {
  font-size: 2.2rem;
  letter-spacing: -0.05em;
  font-weight: 750;
  margin: 24px 0 12px;
  color: var(--gold);
}
.goal-number small {
  font-size: 0.95rem;
  letter-spacing: 0;
  font-weight: 500;
}
.progress {
  height: 5px;
  background: #ffffff10;
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: 12px;
}
.progress > span {
  display: block;
  height: 100%;
  background: var(--gold);
}
.list-card {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 18px;
  text-align: left;
}
.list-card > span {
  flex: 1;
}
.list-card small {
  display: block;
}
.list-card svg {
  color: var(--gold);
  width: 20px;
}
.budget-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.budget-grid .card {
  padding: 18px;
}
.budget-grid strong {
  display: block;
  color: var(--gold);
  font-size: 1.4rem;
  margin-top: 8px;
}
.budget-grid small {
  font-size: 0.8rem;
}
.back-link {
  margin-top: -8px;
}
.setup-banner,
.migration-banner {
  display: flex;
  gap: 14px;
  justify-content: space-between;
  align-items: center;
  background: #e4be7015;
  border: 1px solid #e4be7030;
  border-radius: 12px;
  margin: 0 0 18px;
  padding: 10px 15px;
  font-size: 0.84rem;
}
.setup-banner button,
.migration-banner button {
  color: var(--gold);
  min-height: 44px;
  font-weight: 650;
  flex-shrink: 0;
}
.opening {
  padding: 80px;
  text-align: center;
  font-size: 2rem;
  color: var(--gold);
}
.opening p {
  font-size: 1rem;
  color: var(--muted);
}
/* Editors use native dialogs for focus, keyboard navigation, and Escape. */
dialog {
  color: var(--text);
  border: 1px solid #ffffff18;
  background: var(--surface);
  padding: 0;
  width: min(570px, calc(100% - 28px));
  max-height: calc(var(--visible-height) - 40px);
  border-radius: 22px;
  box-shadow: 0 25px 100px #0008;
}
dialog::backdrop {
  background: #06080bac;
  backdrop-filter: blur(5px);
}
.sheet {
  padding: 24px;
}
.sheet > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 18px;
}
.sheet > header h2 {
  font-size: 1.4rem;
  line-height: 1.3;
}
#modal-body > h3 {
  margin-bottom: 18px;
}
.field {
  display: flex;
  flex-direction: column;
  gap: 7px;
  margin-bottom: 17px;
  min-width: 0;
}
.field > span {
  font-size: 0.86rem;
  color: #cccac4;
}
.field textarea {
  width: 100%;
}
.fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.form-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 24px;
}
.btn {
  border-radius: 11px;
  background: var(--raised);
  border: 1px solid #ffffff14;
  min-height: 46px;
  padding: 11px 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  font-weight: 600;
  font-size: 0.95rem;
  text-align: center;
}
.btn.gold,
.icon-btn.gold {
  background: var(--gold);
  color: #202327;
  border-color: transparent;
}
.btn.danger {
  color: #f2b9ad;
}
.danger-text,
.form-error {
  color: #f0b4a6;
  font-size: 0.9rem;
  margin-top: 12px;
}
.stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.stack .btn {
  width: 100%;
}
.notice {
  background: #e4be7011;
  border-radius: 12px;
  padding: 16px;
  border: 1px solid #e4be7028;
  font-size: 0.94rem;
  line-height: 1.7;
  margin-bottom: 16px;
}
.notice p {
  margin-top: 8px;
}
.tick {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  font-size: 0.95rem;
  margin: 12px 0;
}
.task-extras {
  display: flex;
  flex-direction: column;
  border-top: 1px solid #ffffff10;
  border-bottom: 1px solid #ffffff10;
  margin: 18px 0;
}
.task-extras > details + details {
  border-top: 1px solid #ffffff08;
}
.task-extras summary {
  color: var(--gold);
  font-size: 0.9rem;
}
.weekday-picks {
  display: flex;
  justify-content: space-between;
  gap: 7px;
  margin: 12px 0 18px;
}
.weekday-picks label {
  position: relative;
  flex: 1;
}
.weekday-picks input {
  position: absolute;
  opacity: 0;
}
.weekday-picks span {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 10px;
  cursor: pointer;
}
.weekday-picks input:checked + span {
  background: var(--gold);
  color: #202327;
  border-color: var(--gold);
}
.weekday-picks input:focus-visible + span {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}
.date-hint {
  margin-top: -10px;
}
.detail-title {
  font-size: 1.45rem;
  margin-top: 12px;
}
.detail-note {
  white-space: pre-wrap;
  margin: 20px 0;
  font-size: 1rem;
}
.external-link {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.95rem;
  margin: 14px 0;
}
.file-button {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.file-button input {
  position: absolute;
  inset: 0;
  opacity: 0;
  width: 100%;
  cursor: pointer;
}
.capture-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.list-item,
.label-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}
.list-item > span,
.label-row > span {
  flex: 1;
}
.list-item.done > span {
  text-decoration: line-through;
  color: var(--muted);
}
.list-item.done .check-circle {
  background: var(--gold);
  border-color: var(--gold);
  color: #202327;
}
.small-note {
  font-size: 0.85rem;
  color: var(--muted);
  margin: 12px 0;
  line-height: 1.7;
}
.no-margin {
  margin: 0;
}
.wide {
  width: 100%;
}
.routine-manager {
  display: flex;
  gap: 8px;
  align-items: center;
  border-bottom: 1px solid #ffffff0d;
  padding: 13px 0;
}
.routine-manager > span {
  flex: 1;
}
.routine-manager b {
  display: block;
  font-size: 0.95rem;
  font-weight: 500;
}
.routine-manager small {
  display: block;
  font-size: 0.8rem;
}
.rating-detail {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px solid #ffffff0d;
  font-weight: 750;
}
.rating-detail small {
  display: block;
  font-size: 0.82rem;
  font-weight: 400;
}
.period-status {
  color: var(--gold);
  font-size: 0.85rem;
}
.chart-heading {
  margin: 25px 0 18px;
}
.history-chart {
  display: flex;
  gap: 10px;
  height: 150px;
  align-items: flex-end;
}
.chart-column {
  flex: 1;
  text-align: center;
  min-width: 0;
}
.chart-bars {
  height: 118px;
  display: flex;
  align-items: flex-end;
  gap: 3px;
  padding-top: 20px;
}
.chart-bar {
  height: max(3px, var(--bar));
  background: var(--color);
  flex: 1;
  position: relative;
  border-radius: 4px 4px 0 0;
  min-width: 4px;
}
.chart-bar.partial {
  background: repeating-linear-gradient(
    135deg,
    var(--color) 0 4px,
    #ffffff25 4px 7px
  );
}
.chart-bar span {
  position: absolute;
  bottom: calc(100% + 5px);
  font-size: 0.56rem;
  left: 50%;
  transform: translateX(-50%);
  color: var(--muted);
}
.chart-column small {
  font-size: 0.69rem;
  display: block;
  margin-top: 5px;
}
.legend {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin: 15px 0;
}
.legend > span {
  display: flex;
  align-items: center;
  gap: 5px;
  color: var(--muted);
  font-size: 0.73rem;
}
.history-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid #ffffff08;
  font-size: 0.88rem;
}
.history-item small {
  display: block;
  font-size: 0.76rem;
}
.history-item > b {
  font-size: 0.75rem;
  color: var(--gold);
  flex-shrink: 0;
}
.audit-list {
  max-height: 250px;
  overflow: auto;
}
.audit-list p {
  font-size: 0.8rem;
  margin: 10px 0;
}
.audit-list small {
  display: block;
  font-size: 0.72rem;
}
.toast {
  position: fixed;
  bottom: 160px;
  left: 50%;
  transform: translate(-50%, 15px);
  background: #37352f;
  color: #fff4dd;
  border: 1px solid #e4be7040;
  padding: 12px 17px;
  border-radius: 14px;
  z-index: 100;
  box-shadow: 0 10px 35px #0007;
  max-width: min(560px, 90vw);
  width: max-content;
  opacity: 0;
  pointer-events: none;
  transition:
    opacity 0.2s,
    transform 0.2s;
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 0.9rem;
}
.toast.show {
  opacity: 1;
  transform: translate(-50%, 0);
  pointer-events: auto;
}
.toast button {
  min-height: 44px;
  color: var(--gold);
  font-weight: 700;
}
.cover-preview {
  position: relative;
  isolation: isolate;
  height: 235px;
  border-radius: 16px;
  overflow: hidden;
  background: var(--page);
  width: 70%;
  margin: auto;
}
.cover-preview.header-crop {
  width: 100%;
  height: 180px;
}
.cover-preview > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  z-index: -2;
}
.cover-preview > strong {
  position: absolute;
  bottom: 15px;
  left: 18px;
  font-size: 1.7rem;
  letter-spacing: -0.04em;
}
.cover-preview .ring {
  position: absolute;
  top: 12px;
  right: 12px;
}
.crop-tabs {
  margin: 18px auto 10px;
  display: flex;
  width: max-content;
  max-width: 100%;
}
.crop-tabs button {
  font-size: 0.73rem;
  padding: 7px 10px;
}
.crop-controls label {
  display: flex;
  align-items: center;
  gap: 16px;
  font-size: 0.85rem;
  color: var(--muted);
  min-height: 44px;
}
.crop-controls input {
  flex: 1;
  padding: 0;
  accent-color: var(--gold);
  border: 0;
  min-width: 0;
  min-height: 44px;
}
.preset-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 9px;
  margin: 14px 0;
}
.preset-grid button {
  padding: 0;
  min-height: 60px;
  border-radius: 10px;
  overflow: hidden;
}
.preset-grid img {
  width: 100%;
  height: 70px;
  object-fit: cover;
}
.crop-controls {
  margin-bottom: 16px;
}
#note-screen {
  width: min(900px, 100%);
  height: var(--visible-height);
  max-height: var(--visible-height);
  border-radius: 0;
  border: 0;
  background: #23262a;
  margin: 0 auto;
  max-width: 100%;
  overflow: hidden;
}
#note-screen::backdrop {
  background: #121417;
}
.note-shell {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding-top: env(safe-area-inset-top);
}
.note-topbar {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 9px 14px;
  border-bottom: 1px solid #ffffff0b;
  flex-shrink: 0;
}
.note-topbar select {
  max-width: 145px;
  border: 0;
  background: none;
  font-size: 0.85rem;
  padding: 8px 4px;
}
.note-topbar #note-save-status {
  font-size: 0.72rem;
  color: var(--muted);
  margin-left: auto;
  max-width: 100px;
  line-height: 1.4;
}
.note-work-fields {
  display: flex;
  gap: 8px;
  padding: 8px 23px;
  flex-shrink: 0;
}
.note-work-fields select {
  font-size: 0.82rem;
  min-width: 0;
  flex: 1;
}
#note-body {
  outline: none;
  flex: 1;
  overflow-y: auto;
  font-size: 1.0625rem;
  line-height: 1.85;
  padding: 25px 35px 80px;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
  -webkit-user-select: text;
  user-select: text;
  caret-color: var(--gold);
}
#note-body:empty:before {
  content: attr(data-placeholder);
  color: #aaa8a1;
  pointer-events: none;
  font-size: 1.6rem;
  font-weight: 650;
}
#note-body h2 {
  font-size: 1.5rem;
  line-height: 1.5;
  margin: 10px 0;
}
#note-body h3 {
  font-size: 1.2rem;
}
#note-body a {
  text-decoration: underline;
  color: var(--gold);
}
#note-body input[type="checkbox"] {
  vertical-align: middle;
  margin: 0 8px 0 0;
  width: 24px;
  height: 24px;
}
#note-body p,
#note-body div {
  min-height: 1.85em;
}
.note-formatbar {
  display: flex;
  justify-content: space-around;
  gap: 7px;
  background: #292c31;
  border-top: 1px solid #ffffff0b;
  padding: 7px 16px max(7px, env(safe-area-inset-bottom));
  flex-shrink: 0;
}
.note-formatbar button {
  min-width: 44px;
  min-height: 44px;
  color: var(--gold);
  display: grid;
  place-items: center;
  font-size: 1.1rem;
}
@keyframes check-pop {
  50% {
    transform: scale(1.15);
  }
}
@media (min-width: 1300px) {
  .app-shell {
    padding-top: 38px;
  }
  .area-card {
    height: 225px;
  }
  .today-columns {
    gap: 36px;
  }
}
@media (max-width: 1000px) {
  .area-grid {
    gap: 12px;
  }
  .area-card {
    height: 195px;
  }
  .area-name {
    font-size: 1.22rem;
    left: 13px;
  }
  .area-card .ring {
    width: 66px;
    height: 66px;
  }
  .budget-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .calendar-layout {
    grid-template-columns: 1fr;
  }
  .calendar-day {
    min-height: 105px;
  }
  .desktop-agenda {
    font-size: 0.7rem;
  }
}
@media (max-width: 760px) {
  .app-shell {
    padding: 20px 19px 125px;
  }
  .topbar {
    margin: 0 0 20px;
  }
  .brand > span {
    font-size: 1.8rem;
  }
  .brand small {
    font-size: 0.61rem;
    letter-spacing: 0.14em;
    margin-top: 8px;
  }
  .command-label {
    display: block;
    margin-bottom: 12px;
  }
  .command-label > span {
    display: block;
  }
  .command-label > span:first-child {
    font-size: 0.64rem;
    letter-spacing: 0.13em;
    margin-bottom: 3px;
  }
  .command-label > span:last-child {
    font-size: 0.87rem;
  }
  .rating-control {
    gap: 5px;
    margin: 0 0 13px;
  }
  .rating-control > span {
    font-size: 0.83rem;
    white-space: normal;
    line-height: 1.4;
  }
  .segmented button {
    min-height: 38px;
    padding: 6px 13px;
    font-size: 0.68rem;
  }
  .history-link {
    min-width: 38px;
    padding: 7px;
  }
  .area-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
  }
  .area-card {
    height: 145px;
    border-radius: 15px;
  }
  .area-name {
    bottom: 14px;
    left: 13px;
    font-size: 1.4rem;
  }
  .area-card .ring {
    width: 61px;
    height: 61px;
    right: 9px;
    top: 9px;
  }
  .ring strong {
    font-size: 1.2rem;
  }
  .ring small {
    font-size: 0.43rem;
    margin-top: 3px;
  }
  .today-heading {
    margin: 10px 0 12px;
  }
  .today-heading h1 {
    font-size: 1.4rem;
  }
  .today-columns {
    display: block;
  }
  .todo-heading {
    margin-top: 25px;
  }
  .section-heading h2 {
    font-size: 1.18rem;
  }
  .section-heading {
    margin-top: 24px;
  }
  .section-heading .subtle {
    font-size: 0.78rem;
  }
  .task-row {
    min-height: 77px;
    padding: 8px 5px;
  }
  .task-title {
    font-size: 1.02rem;
  }
  .task-meta {
    font-size: 0.79rem;
  }
  .primary-panel {
    padding: 13px 12px 5px;
  }
  .primary-empty {
    min-height: 54px;
    font-size: 0.98rem;
  }
  .primary-panel .eyebrow {
    font-size: 0.66rem;
  }
  .quiet-note {
    display: none;
  }
  .bottom-nav {
    padding: 5px 11px max(9px, env(safe-area-inset-bottom));
  }
  .bottom-nav > div {
    gap: 3px;
  }
  .bottom-nav button {
    flex-direction: column;
    gap: 5px;
    font-size: 0.61rem;
    min-height: 54px;
    letter-spacing: 0.025em;
  }
  .bottom-nav svg {
    width: 22px;
    height: 22px;
  }
  .fab {
    right: 20px;
    bottom: 94px;
    width: 53px;
    height: 53px;
  }
  .status-strip {
    margin-top: 26px;
  }
  .page-heading {
    margin-top: 25px;
  }
  .page-heading h1 {
    font-size: 1.7rem;
  }
  .page-heading p {
    font-size: 0.95rem;
  }
  .week-toolbar {
    flex-wrap: wrap;
    gap: 10px;
  }
  .week-toolbar > .row {
    gap: 0;
  }
  .week-toolbar > .row > b {
    font-size: 0.88rem;
  }
  .week-toolbar .segmented {
    margin-left: auto;
  }
  .focus-grid {
    grid-template-columns: 1fr;
  }
  .weekly-focus {
    padding: 4px 12px;
  }
  .weekly-focus > summary {
    font-size: 0.86rem;
  }
  .day-strip {
    gap: 5px;
  }
  .day-strip button {
    min-width: 0;
  }
  .day-strip small {
    font-size: 0.67rem;
  }
  .day-strip b {
    font-size: 1rem;
  }
  .board {
    margin-left: -5px;
    margin-right: -19px;
    padding-right: 35px;
  }
  .day-column {
    flex-basis: calc(100vw - 86px);
    max-width: 320px;
  }
  .notes-list {
    grid-template-columns: 1fr;
    gap: 0;
    background: var(--surface);
    border-radius: 14px;
    overflow: hidden;
  }
  .note-card {
    border-top: 0;
    border-bottom: 1px solid #ffffff10;
    border-radius: 0;
    min-height: 135px;
    padding: 19px;
  }
  .note-card:last-child {
    border-bottom: 0;
  }
  .note-title {
    font-size: 1.12rem;
  }
  .note-preview {
    font-size: 0.92rem;
    -webkit-line-clamp: 2;
  }
  .calendar-day {
    min-height: 61px;
    padding: 8px 4px;
    align-items: center;
    gap: 6px;
    border-radius: 8px;
  }
  .calendar-day b {
    font-size: 0.86rem;
  }
  .desktop-agenda {
    display: none;
  }
  .weekday {
    font-size: 0.69rem;
    padding: 8px 0;
  }
  .calendar-layout {
    gap: 20px;
  }
  .day-agenda .section-heading {
    margin-top: 0;
  }
  .area-header {
    height: 186px;
  }
  .area-header-content {
    left: 20px;
    right: 18px;
    bottom: 19px;
  }
  .area-header h1 {
    font-size: 2.05rem;
  }
  .area-header .ring {
    width: 80px;
    height: 80px;
  }
  .area-header .ring strong {
    font-size: 1.55rem;
  }
  .area-header small {
    font-size: 0.58rem;
  }
  .change-image {
    min-height: 44px;
    top: 7px;
    right: 7px;
    font-size: 0.72rem;
    padding: 7px 9px;
  }
  .tabs {
    gap: 24px;
    margin: 14px 0 20px;
  }
  .tabs button {
    font-size: 0.78rem;
  }
  .goal-grid,
  .list-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .card {
    padding: 19px;
  }
  .goal-number {
    font-size: 2.2rem;
  }
  .area-focus > span {
    font-size: 1rem;
  }
  .budget-grid {
    gap: 10px;
  }
  .budget-grid strong {
    font-size: 1.28rem;
  }
  .budget-grid .card {
    padding: 15px;
  }
  .setup-banner,
  .migration-banner {
    font-size: 0.79rem;
    padding: 8px 12px;
    line-height: 1.5;
    margin-bottom: 15px;
  }
  .sheet {
    padding: 20px;
  }
  .sheet > header h2 {
    font-size: 1.3rem;
  }
  dialog {
    max-height: calc(var(--visible-height) - 22px);
    width: calc(100% - 22px);
    border-radius: 19px;
  }
  .form-actions {
    gap: 8px;
  }
  .form-actions .btn {
    flex: 1;
  }
  .fields {
    gap: 10px;
  }
  .notice {
    font-size: 0.91rem;
  }
  .note-topbar {
    padding: 7px 7px;
    gap: 0;
  }
  .note-topbar select {
    max-width: 106px;
    font-size: 0.78rem;
  }
  .note-topbar #note-save-status {
    font-size: 0.62rem;
    max-width: 75px;
  }
  .note-topbar .text-btn {
    font-size: 0.91rem;
  }
  .note-work-fields {
    padding: 8px 18px;
  }
  #note-body {
    padding: 20px 22px 60px;
    font-size: 1.0625rem;
  }
  .note-formatbar {
    padding-left: 9px;
    padding-right: 9px;
  }
  .note-topbar .icon-btn {
    min-width: 44px;
  }
  .cover-preview {
    width: 80%;
    height: 220px;
  }
  .cover-preview.header-crop {
    height: 170px;
  }
  .toast {
    font-size: 0.83rem;
    bottom: 153px;
    padding: 10px 14px;
  }
  .capture-grid {
    grid-template-columns: 1fr;
  }
  .chart-bar span {
    font-size: 0.51rem;
  }
  .ring.large strong {
    font-size: 1.55rem;
  }
}
@media (max-width: 370px) {
  .app-shell {
    padding-left: 14px;
    padding-right: 14px;
  }
  .brand > span {
    font-size: 1.63rem;
  }
  .area-card {
    height: 138px;
  }
  .area-name {
    font-size: 1.23rem;
  }
  .rating-control > span {
    font-size: 0.77rem;
  }
  .rating-control .segmented button {
    padding: 6px 10px;
  }
  .note-topbar select {
    max-width: 94px;
  }
  .note-topbar #note-save-status {
    max-width: 62px;
  }
  .week-toolbar .segmented {
    margin-left: 0;
  }
  .fields {
    grid-template-columns: 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *:before,
  *:after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}

/* Ring captions and every custom target stay legible and touchable. */
.ring small {
  font-size: 0.75rem;
  letter-spacing: 0;
  margin-top: 2px;
}
.ring strong {
  font-size: 1.4rem;
}
.area-card .ring {
  min-width: 68px;
  min-height: 68px;
}
.board-card .task-menu {
  min-height: 44px;
  bottom: 0;
}
.board-card .check-btn {
  min-width: 44px;
}
.segmented button {
  min-height: 44px;
}
.history-link {
  min-width: 44px;
}
.ring.large strong {
  font-size: 1.85rem;
}
@media (max-width: 760px) {
  .area-card .ring {
    width: 68px;
    height: 68px;
  }
  .ring strong {
    font-size: 1.35rem;
  }
  .ring small {
    font-size: 0.75rem;
  }
  .board-card .task-content {
    min-height: 82px;
  }
  .rating-control > span {
    font-size: 0.81rem;
  }
}
@media (min-resolution: 1dppx) {
  .area-card {
    min-height: 9.1rem;
  }
  .area-card .area-name {
    max-width: calc(100% - 24px);
    line-height: 1.25;
  }
}

/* Let larger text grow instead of forcing the ordinary-density phone layout. */
.brand {
  min-width: 0;
}
.brand > span {
  display: block;
}
.settings-button {
  flex-shrink: 0;
}
.rating-control {
  flex-wrap: wrap;
}
.ring {
  width: 4.6rem;
  height: 4.6rem;
}
.ring.large {
  width: 6rem;
  height: 6rem;
}
.area-card .ring {
  width: 4.25rem;
  height: 4.25rem;
}
.area-name {
  overflow-wrap: anywhere;
}
.area-header {
  min-height: 13rem;
}
.area-header .ring {
  width: 5rem;
  height: 5rem;
}
.area-card {
  min-height: 9.1rem;
}

/* Black canvas, distinct charcoal surfaces, and a restrained luminous gold. */
.ring {
  background: #111316e8;
  box-shadow:
    0 2px 16px #0008,
    0 0 14px #ffcf6120;
}
.ring-fill {
  filter: drop-shadow(0 0 3px #ffcf61) drop-shadow(0 0 5px #f3a72b8a);
}
.ring strong {
  font-size: 1.32rem;
  text-shadow: 0 0 10px #ffcf6170;
}
.ring small {
  font-size: 0.57rem;
  font-weight: 750;
  letter-spacing: 0.035em;
  margin-top: 3px;
}
.ring.large strong {
  font-size: 1.65rem;
}
.fab,
.btn.gold,
.icon-btn.gold {
  box-shadow:
    0 6px 24px #ffcf615c,
    0 0 10px #ffcf612d;
}
.bottom-nav button.active,
.segmented .active,
.tabs button.active {
  text-shadow: 0 0 13px #ffcf6170;
}
.cadence-section {
  margin: 12px 0 20px;
}
.cadence-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.cadence-heading h3 {
  font-size: 1.04rem;
  font-weight: 750;
}
.cadence-section .empty {
  margin: 0;
  background: var(--surface);
}
.monthly-routine {
  margin: 10px 0;
}
@media (max-width: 760px) {
  .ring strong {
    font-size: 1.27rem;
  }
  .ring small {
    font-size: 0.52rem;
  }
}
/* Daily rhythm, search, and focused capture */
.top-tools {
  display: flex;
  align-items: center;
  gap: 2px;
}
.top-tools .icon-btn {
  font-size: 24px;
}
.rhythm-section {
  margin: 0 0 26px;
}
.rhythm-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.rhythm-card {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px;
  text-align: left;
  color: var(--text, #f6f0e3);
  background: linear-gradient(130deg, #303032, #202328);
  border: 1px solid #ffcf6130;
  border-radius: 16px;
  min-height: 100px;
}
.rhythm-card strong {
  display: block;
  font-size: 17px;
}
.rhythm-card small {
  display: block;
  color: #b9b8b4;
  margin-top: 7px;
  line-height: 1.5;
}
.rhythm-card > span:nth-child(2) {
  flex: 1;
}
.rhythm-symbol {
  color: #ffcf61;
  font-size: 30px;
  text-shadow: 0 0 18px #ffcf6140;
}
.rhythm-card.is-complete {
  border-color: #ffcf6170;
}
.sunday-panel {
  padding: 18px;
  background: #202328;
  border-radius: 16px;
  margin: 16px 0;
}
.sunday-panel summary {
  cursor: pointer;
  min-height: 44px;
  font-weight: 700;
}
.sunday-panel summary span {
  font-size: 13px;
  font-weight: 400;
  color: #b9b8b4;
  display: block;
  margin-top: 6px;
}
.sunday-panel .rhythm-grid {
  margin-top: 16px;
}
.review-steps .tick {
  padding: 14px 0;
  line-height: 1.5;
  align-items: flex-start;
  min-height: 48px;
}
.review-steps input {
  min-width: 22px;
  min-height: 22px;
  margin-top: 2px;
  accent-color: #ffcf61;
}
.linked-actions {
  margin: 20px 0;
  padding: 16px;
  background: #202328;
  border-radius: 12px;
}
.linked-actions > .btn {
  display: block;
  width: 100%;
  text-align: left;
  margin: 8px 0;
}
.search-results {
  display: grid;
  gap: 8px;
  max-height: 65vh;
  overflow: auto;
}
.search-result {
  display: grid;
  text-align: left;
  gap: 6px;
  border: 0;
  background: #2d3136;
  color: #f6f0e3;
  padding: 16px;
  border-radius: 10px;
  min-height: 60px;
}
.search-result small {
  color: #ffcf61;
}
.search-result strong {
  font-weight: 500;
  font-size: 16px;
  overflow-wrap: anywhere;
}
.capture-options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.reminder-row {
  padding: 16px;
  background: #202328;
  border-radius: 12px;
}
.reminder-row strong,
.reminder-row small {
  display: block;
  margin-bottom: 10px;
}
.reminder-row .btn {
  margin: 4px;
}
.agos-plan {
  padding-left: 25px;
}
.agos-plan li {
  padding: 10px 0;
}
.agos-plan p {
  color: #b9b8b4;
  line-height: 1.6;
}
.rhythm-section .section-heading h2 {
  font-size: 17px;
}
.rhythm-section .section-heading .btn {
  font-size: 13px;
  padding: 8px 12px;
}
@media (max-width: 560px) {
  .topbar {
    gap: 6px;
  }
  .top-tools {
    gap: 0;
  }
  .top-tools .icon-btn {
    width: 44px;
    min-width: 44px;
  }
  .brand span {
    font-size: 22px;
  }
  .brand small {
    font-size: 9px;
  }
  .rhythm-grid {
    gap: 8px;
  }
  .rhythm-card {
    padding: 13px;
    gap: 8px;
    align-items: flex-start;
  }
  .rhythm-symbol {
    font-size: 24px;
  }
  .rhythm-card strong {
    font-size: 16px;
  }
  .rhythm-card small {
    font-size: 13px;
  }
  .rhythm-card > span:last-child {
    display: none;
  }
}
@media (max-width: 350px) {
  .topbar {
    flex-wrap: wrap;
  }
  .rhythm-grid {
    grid-template-columns: 1fr;
  }
}
/* Compact planning and capture screens */
.app-shell:not(.today-shell) .topbar {
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 12px;
}
.app-shell:not(.today-shell) .brand small {
  display: none;
}
.page-heading {
  margin: 12px 0;
  gap: 10px;
}
.page-heading h1 {
  font-size: 1.4rem;
  line-height: 1.2;
}
.page-heading p {
  margin: 4px 0;
}
.week-toolbar {
  margin: 10px 0;
  gap: 8px;
}
.week-toolbar .row {
  gap: 4px;
}
.week-toolbar h2 {
  font-size: 1.15rem;
  white-space: nowrap;
}
.weekly-focus {
  margin: 8px 0;
}
.weekly-focus summary {
  padding-top: 10px;
  padding-bottom: 10px;
}
.filters {
  margin: 8px 0;
}
.day-strip {
  margin-top: 8px;
  margin-bottom: 10px;
}
.calendar-layout {
  gap: 16px;
}
.calendar-day {
  min-height: 48px;
  padding: 4px;
  align-items: center;
  gap: 3px;
}
.calendar-day .desktop-agenda {
  display: none;
}
.calendar-dots {
  min-height: 5px;
}
.weekday {
  padding: 4px 0;
}
.day-agenda .section-heading {
  margin: 10px 0;
}
.day-agenda h2 {
  font-size: 1.1rem;
}
.month-grid {
  gap: 3px;
}
.routine-steps-editor {
  margin: 10px 0;
}
.voice-recording {
  text-align: center;
  padding: 12px 0;
}
.mic-orb {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 82px;
  height: 82px;
  margin: 12px auto;
  border-radius: 50%;
  background: #ffcf611a;
  color: #ffcf61;
  box-shadow: 0 0 24px #ffcf6128;
  font-size: 30px;
}
#live-transcript {
  min-height: 48px;
  max-height: 200px;
  overflow: auto;
  line-height: 1.5;
}
.voice-recording .btn {
  margin: 4px;
  min-width: 120px;
}
[data-feature="capture-review"] .fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
[data-feature="capture-review"] .field {
  margin-bottom: 10px;
}
[data-feature="capture-review"] textarea {
  min-height: 76px;
}
.board-card {
  -webkit-touch-callout: none;
}
.board-card .task-content {
  -webkit-user-select: none;
  user-select: none;
}
.board-card.dragging {
  opacity: 0.85;
  transform: translate(var(--drag-x, 0), var(--drag-y, 0)) rotate(-2deg);
  position: relative;
  z-index: 20;
  pointer-events: none;
  box-shadow: 0 12px 35px #0008;
  outline: 2px solid #ffcf61;
}
.board-card.dragging * {
  pointer-events: none;
}
.day-column.drop-target {
  box-shadow: inset 0 0 0 2px #ffcf61;
}
.board-card.drop-before {
  border-top: 4px solid #ffcf61;
}
@media (max-width: 600px) {
  .calendar-layout {
    display: block;
  }
  .calendar-day {
    min-height: 44px;
  }
  .calendar-day b {
    font-size: 15px;
  }
  .day-agenda {
    margin-top: 14px;
  }
  .week-toolbar {
    flex-wrap: nowrap;
  }
  .week-toolbar b {
    font-size: 14px;
  }
  .week-toolbar .segmented button {
    padding: 8px;
    font-size: 12px;
  }
  .app-shell:not(.today-shell) .topbar {
    margin-bottom: 8px;
  }
  .page-heading .text-btn {
    white-space: nowrap;
  }
  .day-strip button {
    min-width: 40px;
  }
  .field input,
  .field textarea,
  .field select {
    font-size: 16px;
  }
}
.app-shell:not(.today-shell) {
  padding-top: 10px;
}
.app-shell:not(.today-shell) .topbar {
  padding: 0;
  margin: 0 0 6px;
}
.app-shell:not(.today-shell) .brand {
  min-height: 44px;
}
.app-shell:not(.today-shell) .page-heading {
  margin: 6px 0;
}
.app-shell:not(.today-shell) .week-toolbar {
  margin: 6px 0;
}
.app-shell:not(.today-shell) .filters {
  margin: 6px 0;
}
/* KingdomARMR light: a steady gold glow around meaningful actions. */
:root {
  --gold: #ffd66e;
  --royal-glow: 0 0 18px #ffc94b30, 0 0 40px #ffc94b0d;
}
.brand b {
  color: #ffda78;
  text-shadow: 0 0 16px #ffcc5560;
}
.ring-fill {
  filter: drop-shadow(0 0 4px #ffd15c99);
}
.ring strong {
  color: #ffe099;
  text-shadow: 0 0 14px #ffd15c70;
}
.area-card {
  box-shadow:
    0 0 0 1px #ffcf6130,
    0 8px 28px #0005,
    0 0 24px #ffd15c12;
}
.area-card:hover,
.area-card:focus-visible {
  box-shadow:
    0 0 0 1px #ffda78,
    0 0 26px #ffd15c40;
}
.segmented button.active,
.bottom-nav button.active,
.area-tabs button.active {
  box-shadow: var(--royal-glow);
  text-shadow: 0 0 12px #ffd15c70;
}
.btn.gold,
.fab {
  background: linear-gradient(135deg, #ffe598, #ffd060);
  color: #201700;
  box-shadow:
    0 0 18px #ffd15c55,
    0 5px 24px #0006;
}
.primary-panel {
  border-color: #ffd66e66;
  box-shadow:
    inset 0 1px 0 #ffdd8033,
    0 0 24px #ffce5b15;
}
.primary-panel .eyebrow {
  color: #ffe099;
}
.rhythm-card {
  border-color: #ffd66e55;
  box-shadow: 0 0 22px #ffd15c15;
}
.rhythm-symbol {
  color: #ffdc7e;
  text-shadow: 0 0 20px #ffd15c90;
}
.check-btn[aria-pressed="true"] .check-circle {
  box-shadow: 0 0 14px #ffcf6166;
}
.goal-card {
  position: relative;
  border: 1px solid #ffd66e40;
  box-shadow:
    inset 0 1px 0 #ffe49c20,
    0 0 24px #ffcf6112;
}
.goal-emblem {
  font-size: 24px;
  display: block;
  margin-bottom: 10px;
}
.progress > span {
  background: linear-gradient(90deg, #d49b2b, #ffe49b);
  box-shadow: 0 0 12px #ffd15c66;
}
.royal-symbol {
  display: inline-block;
  font-size: 0.95em;
  margin-right: 3px;
}
.calendar-day.active {
  box-shadow: 0 0 15px #ffd15c35;
  border-color: #ffda78;
}
.text-btn:hover {
  color: #ffe6a1;
  text-shadow: 0 0 12px #ffd15c66;
}
/* A black writing surface, with clear gold controls and no decorative glow. */
body:has(.notes-shell) {
  background: #000;
}
.notes-shell,
.notes-shell .notes-list,
.notes-shell .note-card,
#note-screen,
#note-screen::backdrop,
.note-shell,
.note-topbar,
.note-work-fields,
#note-body,
.note-formatbar {
  background: #000 !important;
}
.notes-shell .note-card {
  box-shadow: none;
  border-color: #ffffff18;
}
.note-formatbar {
  border-top: 1px solid #ffffff20;
}
.note-topbar .text-btn,
.note-formatbar button {
  color: #ffd66e;
}
.note-topbar .text-btn:hover {
  text-shadow: none;
}
/* Date and time each use one full-width row, including on narrow phones. */
[data-feature="capture-review"] .capture-schedule {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
[data-feature="capture-review"] .capture-schedule .field {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  margin: 0;
}
[data-feature="capture-review"] .capture-schedule .field > span {
  margin: 0;
  white-space: nowrap;
}
[data-feature="capture-review"] .capture-schedule input {
  min-width: 0;
  width: 100%;
  min-height: 44px;
}
[data-feature="capture-review"] .form-actions {
  margin-top: 18px;
}
@media (prefers-reduced-motion: reduce) {
  .ring-fill,
  .check-circle,
  .area-card,
  .btn.gold,
  .fab {
    animation: none !important;
    transition: none !important;
  }
}

/* V3.5 · one planning calendar and a vision-led goals destination. */
.calendar-heading,
.goals-heading { align-items: center; }
.calendar-mode {
  width: min(340px, 100%); margin: 4px auto 12px; padding: 4px;
  background: #1a1d20; border: 1px solid #ffd66e26; box-shadow: 0 0 22px #ffd15c0d;
}
.calendar-mode button { flex: 1; min-height: 42px; letter-spacing: .1em; }
.vision-goals-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px; margin-top: 14px;
}
.vision-goal-area {
  min-width: 0; overflow: hidden; border: 1px solid #ffd66e26; border-radius: 20px;
  background: #171a1d; box-shadow: 0 12px 34px #0005, 0 0 28px #ffd15c0b;
}
.vision-goal-cover {
  isolation: isolate; position: relative; display: block; width: 100%; min-height: 144px;
  padding: 20px; overflow: hidden; text-align: left; color: var(--text);
}
.vision-goal-cover > svg {
  position: absolute; width: 22px; right: 18px; bottom: 20px;
  filter: drop-shadow(0 0 8px #ffd15c80);
}
.vision-goal-title { position: absolute; left: 20px; right: 52px; bottom: 18px; }
.vision-goal-title small {
  display: block; color: #ffe39a; font-weight: 850; letter-spacing: .09em;
  text-shadow: 0 0 14px #000;
}
.vision-goal-title strong {
  display: block; margin-top: 5px; font-size: 1.05rem; line-height: 1.3;
  text-shadow: 0 2px 12px #000;
}
.vision-goal-list { display: grid; gap: 12px; padding: 14px; }
.goal-card { padding: 0; overflow: hidden; }
.goal-card-main { display: block; width: 100%; padding: 0 14px 10px; color: var(--text); text-align: left; }
.goal-card-heading {
  display: grid; grid-template-columns: 30px minmax(0, 1fr) auto;
  gap: 10px; align-items: start;
}
.goal-card-heading h3 { margin: 1px 0 3px; font-size: 1.05rem; line-height: 1.25; }
.goal-card-heading small { color: var(--muted); }
.goal-card-heading > b { color: #ffe29a; font-size: 1.25rem; text-shadow: 0 0 14px #ffd15c65; }
.goal-card .goal-emblem { margin: 0; font-size: 21px; }
.goal-progress-row {
  display: flex; justify-content: space-between; gap: 10px; margin: 8px 0 6px;
  color: #e7e0d3; font-size: .84rem;
}
.goal-progress-row small { color: var(--muted); }
.gold-goal-track {
  position: relative; height: 16px; overflow: hidden; border: 1px solid #ffdc7940;
  border-radius: 5px; background: #050607;
  box-shadow: inset 0 2px 5px #000b, 0 0 14px #ffd15c13;
}
.gold-goal-fill {
  display: block; height: 100%; min-width: 0; border-radius: 4px;
  background: linear-gradient(90deg, #b87408 0%, #f5bd35 42%, #fff0a6 78%, #e5a916 100%);
  box-shadow: 0 0 10px #ffd15ca0, 0 0 24px #ffd15c4d;
  transition: width .45s ease;
}
.goal-marker {
  position: absolute; top: 0; bottom: 0; width: 1px;
  background: #fff8d680; box-shadow: 0 0 5px #000;
}
.goal-next { padding: 0 10px 10px; }
.goal-next button {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; width: 100%; min-height: 44px;
  padding: 9px 10px; border-radius: 10px; background: #23272b; color: var(--text);
  text-align: left; align-items: center;
}
.goal-next button small {
  grid-column: 1 / -1; color: #e8bb55; font-size: .64rem; letter-spacing: .1em;
}
.goal-next button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.goal-next button em { margin-left: 8px; color: var(--muted); font-size: .75rem; font-style: normal; }
.goal-next button > svg { width: 17px; color: var(--gold); }
.goals-footnote { margin: 18px 2px 0; text-align: center; }
@media (max-width: 760px) {
  .vision-goals-grid { grid-template-columns: 1fr; gap: 14px; }
  .vision-goal-cover { min-height: 124px; }
  .vision-goal-list { padding: 11px; }
  .goal-card-main { padding: 0 12px 10px; }
  .goal-progress-row { margin-top: 8px; }
  .gold-goal-track { height: 15px; }
}
@media (prefers-reduced-motion: reduce) { .gold-goal-fill { transition: none; } }

/* Compact capture, notes, and planning controls. */
[data-feature="capture-review"] .capture-schedule {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px;
}
[data-feature="capture-review"] .capture-schedule .field {
  display: block; min-width: 0;
}
[data-feature="capture-review"] .capture-schedule .field > span { display: block; margin-bottom: 4px; }
[data-feature="capture-review"] .capture-schedule input { padding: 10px 8px; font-size: 16px; }
.notes-shell .note-card { min-height: 0; padding: 13px 16px; gap: 3px; }
.notes-shell .note-preview { display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; line-height: 1.35; }
.notes-shell .note-card small { margin-top: 1px; line-height: 1.3; }
.notes-shell .notes-list { gap: 8px; }
.calendar-heading { display: flex; min-height: 44px; gap: 8px; }
.calendar-heading .text-btn { margin-left: auto; }
.calendar-mode { position: static; width: 150px; flex-shrink: 0; margin: 0; }
.calendar-mode button { min-height: 36px; padding: 5px 8px; }
.weekly-focus summary { padding-top: 4px; padding-bottom: 4px; min-height: 44px; }
.day-column-head { margin: 2px 0 10px; }
.day-column { padding-top: 8px; }
@media (max-width: 760px) {
 .calendar-mode { width: 146px; }
 .calendar-heading h1 { font-size: 1.15rem; }
 .calendar-heading .text-btn { font-size: 0; gap: 0; min-width: 44px; }
 .calendar-heading .text-btn svg { width: 20px; }
 .day-strip { margin-top: 4px; margin-bottom: 6px; }
}

/* Board-only week navigation: one date row, arrows at the edges. */
.week-day-navigation { display: flex; align-items: center; gap: 6px; margin: 6px 0 10px; }
.week-day-navigation .week-arrow { flex: 0 0 44px; min-height: 44px; padding: 8px; }
.week-day-navigation .day-strip { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); flex: 1; min-width: 0; gap: 3px; margin: 0; }
.week-day-navigation .day-strip button { min-width: 0; min-height: 52px; padding: 5px 1px; }
@media (max-width: 760px) {
 .week-day-navigation { gap: 2px; }
 .week-day-navigation .day-strip { gap: 1px; }
 .week-day-navigation .day-strip small { font-size: .65rem; }
 .week-day-navigation .day-strip b { font-size: 1rem; }
}

/* Dense board cards with full-size touch controls. */
.board-card {
  min-height: 88px;
  padding: 0 2px;
  margin-bottom: 6px;
  border-radius: 10px;
  gap: 0;
}
.board-card .task-content {
  min-height: 44px;
  padding: 6px 42px 6px 0;
  flex-basis: calc(100% - 44px);
}
.board-card .task-title { line-height: 1.25; padding-right: 0; }
.board-card .task-meta { line-height: 1.25; margin-top: 3px; padding-right: 0; font-size: .75rem; }
.board-card .check-btn { top: 0; right: 0; height: 44px; }
.board-card .task-menu { bottom: 0; right: 0; height: 44px; }
.board-card .drag-handle { width: 44px; min-width: 44px; padding: 0; }
.day-column .routine-group { margin-top: 6px; }
.day-column .routine-group > summary { padding-top: 4px; padding-bottom: 4px; }

/* Compact board row: checkbox, content, combined options/drag control. */
.board-card { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; min-height: 60px; padding: 2px 0; margin-bottom: 4px; align-items: center; }
.board-card .check-btn { position: static; grid-column: 1; grid-row: 1; width: 44px; padding: 0; }
.board-card .task-content { grid-column: 2; grid-row: 1; min-height: 44px; padding: 4px 0; }
.board-card .drag-handle { grid-column: 3; grid-row: 1; min-height: 44px; align-self: center; font-size: 1.2rem; order: 0; }
.board-card .task-title { font-size: .94rem; line-height: 1.2; }
.board-card .task-meta { margin-top: 2px; font-size: .74rem; line-height: 1.2; }
/* MyLIFE and notebook preview: focused actions, visual collections. */
.today-columns{display:block;max-width:860px;margin-inline:auto}.today-shell .rhythm-section{margin-bottom:16px}.today-shell .rhythm-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.today-shell .rhythm-card{min-height:112px;padding:14px;position:relative;background-size:cover;background-position:center;gap:0;align-items:flex-end;box-shadow:inset 0 0 24px #ffd05c15}.rhythm-card.rhythm-morning{background-image:linear-gradient(0deg,#080808f2,#08080865),url('./assets/health.webp')}.rhythm-card.rhythm-night{background-image:linear-gradient(0deg,#080808f2,#08080885),url('./assets/home.webp')}.today-shell .rhythm-symbol{display:none}.today-shell .rhythm-card strong{font-size:16px;line-height:1.35}.today-shell .rhythm-card small{font-size:13px;color:#e3dfd6;margin-top:4px}.life-routines{margin:20px 0}.life-routine-row{display:flex;width:100%;align-items:center;justify-content:space-between;gap:14px;min-height:50px;padding:12px;text-align:left;background:#202023;border-radius:10px;margin:6px 0}.life-routine-row small{color:#d6bb79}.notebook-tabs{margin-top:0}.reflection-prompts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:20px 0}.reflection-prompts button{background:linear-gradient(140deg,#302a1b,#191817);border:1px solid #ffc95530;border-radius:14px;text-align:left;padding:14px 12px}.reflection-prompts span,.reflection-prompts b,.reflection-prompts small{display:block}.reflection-prompts span{font-size:23px;margin-bottom:10px}.reflection-prompts b{font-size:15px;color:#ffda77}.reflection-prompts small{font-size:13px;line-height:1.5;color:#c6c1b6;margin-top:6px}.reflection-entry{display:block;width:100%;text-align:left;padding:18px 0;border-bottom:1px solid #ffffff20;background:#000}.reflection-entry small{font-size:13px;color:#d2b76e}.reflection-entry h3{font-size:19px;margin:9px 0}.reflection-entry p{color:#bdbdbd;line-height:1.55;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.sample-label{font-size:12px;letter-spacing:.08em;color:#b9af95;margin:24px 0 12px}.reflection-body{white-space:pre-wrap;line-height:1.8}.library-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.library-collection{position:relative;min-height:205px;border-radius:18px;overflow:hidden;text-align:left;box-shadow:0 5px 24px #efbc3610;border:1px solid #f4c14b36}.library-collection img{position:absolute;width:100%;height:100%;inset:0;object-fit:cover}.library-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:17px;background:linear-gradient(0deg,#000f 0%,#000b 45%,#0000 100%)}.library-overlay h2{font-size:21px;margin:7px 0}.library-overlay small{font-size:13px;color:#ffdc89}.library-overlay>span{color:#ddd4c2;font-size:13px;line-height:1.4}.resource-card{padding:0;align-self:start;background:#202022;border-radius:14px;overflow:hidden;text-align:left}.resource-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}.resource-card>div{padding:10px 12px}.resource-card small{font-size:12px;color:#d1b67b}.resource-card h3{font-size:13px;line-height:1.4;margin:5px 0 0;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.resource-card p{font-size:12px;line-height:1.45;margin:5px 0 0;color:#c5c5c5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.resource-card p:empty{display:none}.resource-card small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.resource-detail-image{width:100%;max-height:220px;object-fit:cover;border-radius:12px}.collection-title{margin:16px 0}.notes-shell .page-heading h1{font-size:clamp(22px,6vw,30px)}
@media(min-width:760px){.library-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.reflection-entry,.reflection-prompts{max-width:850px}.library-collection{min-height:260px}.today-shell .rhythm-section{max-width:860px;margin-inline:auto}.today-shell .rhythm-card{min-height:120px}}
@media(max-width:360px){.library-grid{gap:8px}.library-overlay{padding:12px}.library-overlay h2{font-size:18px}.reflection-prompts{grid-template-columns:1fr}.reflection-prompts small{margin-top:2px}.reflection-prompts span{float:left;margin-right:10px}.today-shell .rhythm-card{padding:10px}}
/* Daily rhythm, richer checklists, and an honest progress scorecard. */
.rhythm-card.rhythm-morning{background-image:linear-gradient(0deg,#080808df,#08080818),url('./assets/morning.webp')}.rhythm-card.rhythm-night{background-image:linear-gradient(0deg,#080808df,#08080818),url('./assets/night.webp')}.today-shell .rhythm-card{min-height:140px;align-items:flex-end}.today-shell .rhythm-card strong{font-size:17px;line-height:1.3;letter-spacing:.025em}.today-shell .rhythm-card>span:last-child{align-self:center}.steps-builder{margin:14px 0}.step-edit-row{background:#202023;border:1px solid #ffffff14;padding:10px;border-radius:12px;margin:10px 0}.step-title-row{display:flex;gap:8px;align-items:center}.step-title-row input[data-step-title]{min-width:0;flex:1;background:#151517;border:0;font-size:16px}.step-title-row input[type=checkbox]{width:22px;height:22px}.step-circle{color:#ffd777;font-size:24px}.step-edit-row textarea{width:100%;resize:vertical;min-height:65px;margin-top:8px;font-size:16px;background:#151517;line-height:1.5}.step-order{display:flex;justify-content:flex-end}.step-order button{min-height:44px;min-width:44px;color:#ddc283;background:transparent}.step-detail{white-space:pre-wrap;font-size:15px;line-height:1.55;color:#c6c4bf;margin:0 0 14px 36px;overflow-wrap:anywhere}.step-detail a,.detail-note a{color:#ffdc80;text-decoration:underline}.guided-step .tick{margin-bottom:7px}.list-item-text{text-align:left;background:none;color:inherit;min-height:44px}.scorecard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.area-scorecard{padding:20px;background:linear-gradient(135deg,#29292b,#161618);border:1px solid #eec45630;border-radius:16px;min-width:0}.area-scorecard h3{font-size:20px}.score-number{font-size:32px;color:#ffdb79;text-shadow:0 0 22px #e7b84735;text-align:right}.score-number small{display:block;font-size:11px;letter-spacing:.06em}.scorecard-counts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:22px 0}.scorecard-counts b{display:block;font-size:23px}.scorecard-counts span{display:block;font-size:13px;color:#bfbfbd;margin-top:4px}.progress-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0}.progress-stats>div{background:#242426;border-radius:12px;padding:17px}.progress-stats small,.progress-stats span{display:block;font-size:13px;color:#c2bfb8}.progress-stats strong{display:block;font-size:32px;color:#ffda78;margin:8px 0}.progress-stats em{font-style:normal;font-size:20px;color:#c2bfb8}.progress-bars{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.progress-bars>div{min-width:0;text-align:center}.progress-bars small{font-size:11px;color:#c6c3bb;white-space:nowrap}.progress-bar-slot{height:80px;background:#080809;border-radius:4px;position:relative;overflow:hidden}.progress-bar-slot span{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(0deg,#ae7620,#ffe29b)}.progress-bar-slot span.partial{background:repeating-linear-gradient(135deg,#ffe29b,#ffe29b 4px,#b18135 4px,#b18135 7px)}.progress-bar-slot b{position:relative;display:block;background:#080809bf;font-size:12px;color:#fff;padding:3px}.rhythm-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.journal-today{padding:24px;background:linear-gradient(135deg,#2a2518,#0c0c0d);border:1px solid #dfb14b40;border-radius:18px;margin-top:18px}.journal-today>small{color:#d3bd88}.journal-today h2{font-size:24px;margin:12px 0 20px}.journal-week{display:flex;gap:16px;margin-top:20px}.journal-week span{text-align:center;color:#aaa}.journal-week i{font-style:normal;display:block;border:1px solid #ffffff22;border-radius:50%;width:26px;height:26px;line-height:24px}.journal-week .written{color:#ffda78}.journal-week .written i{background:#80601c44;border-color:#d5ab58}.journal-week small{font-size:11px}.journal-prompts{margin:16px 0;color:#d6c188}.youtube-preview{display:flex;gap:12px;background:#202022;border-radius:10px;padding:10px;margin:12px 0}.youtube-preview img{width:110px;object-fit:cover;border-radius:6px}.youtube-preview strong{font-size:15px;display:block}.youtube-preview small{font-size:12px;color:#c5c3bc;display:block;margin-top:8px}.progress-scorecard>.section-heading{margin-top:24px}
@media(max-width:600px){.scorecard-grid{grid-template-columns:1fr}.progress-stats{gap:7px}.progress-stats>div{padding:12px 9px}.progress-stats strong{font-size:27px}.progress-stats span{font-size:12px}.progress-stats small{font-size:12px}.tabs button[data-act=life-tab]{padding:12px 8px;font-size:13px}.journal-today{padding:18px}.journal-week{gap:12px}}

#link-preview:empty{display:none}#link-preview{display:flex;align-items:center}#link-preview .youtube-preview{margin:0;width:100%;min-height:100px;align-items:center}#link-preview .youtube-preview img{height:80px}#link-preview .youtube-preview strong{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.library-unassigned:not(:empty){margin-top:20px}.resource-card{min-width:0;max-width:100%}

.today-shell .rhythm-card{background-image:none;isolation:isolate;overflow:hidden}.today-shell .rhythm-symbol{display:block;position:absolute;inset:0;z-index:-1;border-radius:inherit;overflow:hidden}.rhythm-symbol img{width:100%;height:100%;object-fit:cover;object-position:center}.rhythm-symbol::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#080808df,#08080818)}

.life-guidance{font-size:14px;line-height:1.5;color:var(--muted);margin:0 0 10px}.fab.fab-labeled{display:flex;width:auto;gap:7px;padding:0 17px;font-size:14px;font-weight:700}.fab-labeled svg{width:23px;height:23px}

/* Notebook actions stay discoverable without sacrificing the writing surface. */
.record-row{position:relative;display:flex;align-items:stretch;min-width:0}.record-row>.note-card,.record-row>.reflection-entry{flex:1;min-width:0;padding-right:48px}.record-row .record-menu{position:absolute;right:0;top:6px;color:#d8bb6c;min-width:44px;min-height:44px}.record-row [data-act="note"]{-webkit-touch-callout:none;user-select:none}.library-record{position:relative;min-width:0;align-self:start}.library-record>.resource-card{width:100%}.library-record .record-menu{position:absolute;right:3px;top:3px;border-radius:50%;background:#111d;color:#ffdb7a}.library-record:has(.resource-card:not(:has(img))) .resource-card>div{padding-top:40px}.photo-previews{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.photo-previews:empty{display:none}.photo-previews img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px}.library-photo-full{display:block;width:100%;max-height:65dvh;object-fit:contain;background:#000}.photo-caption{white-space:pre-wrap;overflow-wrap:anywhere}.photo-unavailable{display:grid;place-items:center;aspect-ratio:16/9;color:#d4bb7d}.trash-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid #ffffff14}.trash-row>span{flex:1;min-width:0}.trash-row b{display:block;overflow-wrap:anywhere}.trash-row small{display:block;color:#bcbcbc;margin-top:4px}.progress-period{margin:8px 0 12px;display:flex}.progress-period button{flex:1;min-height:44px}.progress-bars.year-bars{grid-template-columns:repeat(12,minmax(30px,1fr));overflow-x:auto}.photo-picker{min-height:54px}.record-menu{font-size:19px;letter-spacing:1px}

.shared-item{display:flex;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid #ffffff15}.shared-item>div{flex:1;min-width:0}.shared-item strong{font-size:16px;overflow-wrap:anywhere}.shared-item small{display:block;font-size:12px;color:#aaa;margin-top:3px}.pinned-list{display:flex;gap:10px;justify-content:space-between;margin:12px 0}.pinned-list small{color:#b8ac91}.top-tools{gap:2px}.top-tools .icon-btn{min-width:44px}

/* The longer brand can wrap its header at narrow widths and larger text sizes. */
.topbar{flex-wrap:wrap;gap:8px}.brand{flex:1 1 205px}.brand>span{font-size:clamp(1.3rem,4.9vw,1.9rem)}.top-tools{margin-left:auto;flex-shrink:0}

/* Kingdom navigation and focused goal targets. */
.brand>span{display:flex;align-items:center;gap:5px;font-size:clamp(1.15rem,4.5vw,1.75rem)}
.brand-crown{display:inline-flex;transform:rotate(-17deg);color:var(--gold,#f4c95d);filter:drop-shadow(0 0 6px #e8b44388)}
.brand-crown svg{width:25px;height:25px}
.today-block{margin:14px 0}.today-block>h3{margin:0 0 5px;font-size:14px;letter-spacing:.04em;color:var(--gold,#f4c95d)}
.routine-score-chip{flex:0 0 48px;min-height:44px;padding:3px;background:#27231b;border:1px solid #e5b84b44;border-radius:10px;color:#f8d777;font-size:15px;font-weight:700;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.routine-score-chip small{font-size:8px;letter-spacing:.05em;color:#d9c9a1}.routine-directory-row{display:flex;gap:10px;align-items:center;padding:10px 12px;background:#242424;border-radius:12px;margin:6px 0}.routine-directory-row .task-content{flex:1;min-width:0}
.kingdom-vision{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;background:#242424;border:0;border-radius:12px;padding:13px 15px;margin:12px 0;color:#f5efdf}.kingdom-vision span{display:grid;gap:5px}.kingdom-vision small{color:#c9b987;font-size:11px}.kingdom-vision strong{font-size:15px;font-weight:500;white-space:pre-wrap}.kingdom-vision svg{flex-shrink:0}
.kingdom-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}.kingdom-tabs button{padding:10px 4px;font-size:12px;min-height:44px;white-space:nowrap}
.calendar-heading{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-bottom:8px}.calendar-heading h1{margin-right:auto}.calendar-heading .calendar-mode{width:auto;flex:0 0 auto;margin:0}.calendar-heading .filters{display:flex;flex:1;min-width:130px;gap:6px;margin:0}.calendar-heading .filters select{min-width:0;width:100%;padding:8px;min-height:44px}.calendar-heading>.text-btn{margin-left:auto}.calendar-heading .calendar-mode{margin-left:auto}
.goal-detail-count{color:#f4d175;font-weight:600}.goal-targets{margin:12px 0}.goal-targets .task-row{padding:5px 0}.goal-targets .task-content{text-align:left}.routine-score-summary{display:flex;align-items:center;gap:20px;margin:20px 0}.routine-score-summary p{margin:6px 0}.score-history-row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #ffffff12}
@media(max-width:540px){.calendar-heading h1{flex:1}.calendar-heading>.text-btn{flex:0 0 auto}.calendar-heading .calendar-mode{margin-left:0}.calendar-heading .filters{flex:1 1 140px}.task-row .task-menu{width:44px;min-width:44px}.task-row{gap:4px}.routine-score-chip{flex-basis:44px}.brand{flex-basis:190px}}
/* Build together is a shared MyHOME space; personal blocks stay personal. */
.brand-crown{transform:none;filter:drop-shadow(0 0 5px #ffcf5260);width:49px;height:38px;margin-left:-5px;margin-right:4px;align-items:center;justify-content:center;flex-shrink:0}
.brand-crown img{width:57px;height:38px;object-fit:contain;mix-blend-mode:screen}
.build-together-card{display:flex;align-items:center;gap:14px;text-align:left;width:100%;max-width:760px;padding:18px 20px;margin:20px auto;background:linear-gradient(115deg,#282419,#171717 75%);border:1px solid #b68b324a;border-radius:16px;color:#f5eedf;box-shadow:0 0 25px #ca9c2410}
.build-together-card>span:nth-child(2){display:grid;gap:4px;flex:1}.build-together-card small{color:#d8b45e;letter-spacing:.08em;font-size:10px}.build-together-card strong{font-size:19px}.build-together-card span span{font-size:13px;color:#bcb8af}.together-mark{font-size:29px}.build-together-card>svg{width:22px;flex-shrink:0;color:#efc864}
.together-intro{text-align:center;padding:16px 8px}.together-intro>span{font-size:40px}.together-intro h3{margin:10px 0}.together-intro p{color:#bab6ac}.together-heading{display:flex;gap:12px;align-items:center}.together-heading>span{font-size:30px}.together-heading>div{flex:1}.together-heading h3{margin:0 0 4px}.together-heading small{font-size:12px;color:#bcb8af}.together-heading>.btn{padding:8px;font-size:12px}
.together-stats{display:flex;gap:12px;margin:18px 0}.together-stats>span{flex:1;padding:12px;background:#262626;border-radius:12px;font-size:12px;color:#bcb8af}.together-stats b{display:block;font-size:24px;color:#f4ce6e;margin-bottom:4px}.together-lists{display:grid;gap:8px;margin-bottom:20px}.together-list{width:100%;text-align:left;padding:15px;background:#252525;border:1px solid #ffffff08;border-radius:12px;color:#f5efdf;display:grid;gap:9px}.together-list>span{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:#bfbab0}.together-list small,.access-badge{color:#e0bf73;font-size:12px}.access-badge{padding:9px 12px;background:#28231a;border-radius:9px;line-height:1.5}.shared-list-toolbar{display:flex;justify-content:space-between;gap:8px}.shared-list-toolbar .btn{padding:8px;font-size:12px}.member-permission{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:8px 0}.member-permission select{max-width:160px;min-height:44px}.shared-details{margin-bottom:12px}.shared-details>summary{font-size:13px}.shared-item-details{font-size:13px;white-space:pre-wrap;margin:5px 0;color:#bcb8af}.shared-item>div{min-width:0;overflow-wrap:anywhere}.selected-access[hidden]{display:none}
@media(max-width:540px){.brand>span{gap:3px;font-size:1.25rem}.brand-crown{width:38px;height:34px}.brand-crown img{width:46px;height:34px}.build-together-card{padding:14px;gap:10px}.build-together-card strong{font-size:17px}.together-heading{flex-wrap:wrap}}

/* Near-full-width phone planning, with a small next-day cue. */
@media(max-width:600px){
 .board{margin-left:-10px;margin-right:-18px;gap:10px;padding-left:4px;padding-right:18px;scroll-snap-type:x mandatory}
 .day-column{flex-basis:calc(100vw - 44px);max-width:none;padding:10px 8px}
 .day-column .task-list{gap:8px}.board-card{margin-bottom:4px}
 .week-day-navigation{margin-left:-16px;margin-right:-16px;gap:0}
 .week-day-navigation .week-arrow{flex-basis:44px;min-width:44px;padding:6px}
 .week-day-navigation .day-strip{gap:3px}
}
.goal-card-labels{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:0;padding:0 8px 0 12px}
.goal-block-label{display:inline-block;background:#eee9dd;color:#151515;border-radius:5px;padding:5px 9px;font-size:12px;font-weight:800;letter-spacing:.03em}
.goal-primary{width:44px;height:44px;background:transparent;font-size:24px;color:#a7a398}.goal-primary[aria-pressed=true]{color:#ffd56b}
.scorecard-link{display:flex;align-items:center;gap:7px;padding:10px 13px;min-height:44px;border:1px solid #b38b36;border-radius:12px;background:linear-gradient(125deg,#48391c,#201b12);color:#ffdc80;font-size:14px;font-weight:700;box-shadow:0 0 18px #d8a93720}.scorecard-link svg{width:18px}
.scorecard-period{display:flex;max-width:440px}.scorecard-period button{flex:1;min-height:44px}
.scorecard-block{background:#202124;border:1px solid #ffffff18;border-radius:14px;padding:14px;margin:12px 0}.scorecard-block>summary{display:flex;align-items:center;gap:16px;min-height:64px;cursor:pointer}.scorecard-grade{color:#ffdc80;font-size:34px;font-weight:800}.scorecard-block summary small{display:block;color:#bdbbb5;font-size:12px;margin-top:4px}
.scorecard-routine{margin:12px 0;padding:14px;background:#151619;border:1px solid #ffffff16;border-radius:12px;min-width:0}.scorecard-routine-heading{width:100%;display:flex;justify-content:space-between;gap:12px;align-items:center;text-align:left;background:none;color:#f6f1e7;padding:0;min-height:44px;font-size:16px}.scorecard-routine-heading small{display:block;font-size:12px;color:#bcb6a9;margin-top:4px}.scorecard-routine-heading strong{color:#ffda7c;font-size:24px;white-space:nowrap;text-align:right}
.consistency-grid{display:flex;gap:5px;overflow-x:auto;margin-top:13px;padding-bottom:6px}.day-result{flex:0 0 36px;text-align:center;background:#23252a;border-radius:6px;padding:6px 0;color:#c5c1b8}.day-result small,.day-result b{display:block;font-size:12px;line-height:1.6}.day-result.complete{background:#c49b3b;color:#111}.day-result.missed{background:#30282a;color:#e5a99e}.day-result.progress{border:1px solid #d9b65c}.day-result.future,.day-result.empty{opacity:.6}.scorecard-key{font-size:13px;color:#b8b5ad;line-height:1.6}.scorecard-explanation{margin:20px 0;color:#bdb8ad;font-size:14px}.personal-rhythm-scores{margin-top:24px}
@media(min-width:760px){.goals-in-motion .goal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.scorecard-trend{margin:18px 0 6px;color:#c9c0aa;font-size:14px}.score-trend-bars{display:flex;gap:5px;overflow-x:auto;padding:8px 0 28px;margin-top:12px}.score-trend-bars>div{height:80px;min-width:28px;flex:1;position:relative;background:#101113;border-radius:4px;text-align:center}.score-trend-bars i{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(#f8d979,#826322);border-radius:4px}.score-trend-bars b{position:relative;z-index:1;background:#111c;color:#eee;font-size:10px}.score-trend-bars small{position:absolute;top:84px;left:0;right:0;font-size:10px}
.scorecard-blocks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.scorecard-blocks .scorecard-block{margin:0;min-width:0}.scorecard-blocks .scorecard-block[open]{grid-column:1/-1}.scorecard-block>summary{display:grid;grid-template-columns:14px minmax(80px,1fr) 42px minmax(100px,1fr);gap:10px}.scorecard-block>summary>span{margin:0}.scorecard-block>summary>.scorecard-grade{font-size:32px;font-weight:800;color:#ffdc80;text-align:center}.scorecard-block>summary>.goal-block-label{justify-self:start}.scorecard-block>summary>span:last-child{font-size:14px}.scorecard-block>summary::before{margin:0}.personal-rhythm-scores .scorecard-routine>.text-btn{display:block;margin-top:8px}@media(max-width:700px){.scorecard-blocks{grid-template-columns:1fr}.scorecard-block>summary{grid-template-columns:12px minmax(74px,1fr) 32px minmax(96px,1.2fr);gap:7px}.scorecard-block{padding:12px}}

/* Goal cards fit their content; keep actions touch-friendly. */
.goal-grid { align-items:start; gap:12px; }
.goal-card .goal-next button:has(>svg) { display:flex; gap:8px; padding:6px 10px; }
.goal-card .goal-next button:has(>svg) svg { flex-shrink:0; }


/* HOME featured goals: premium Kingdom labels. */
.goals-in-motion .goal-block-label {
  background: linear-gradient(135deg, #8d6517 0%, #d5a636 48%, #8b6318 100%);
  color: #fffaf0;
  border: 1px solid #f4ce6a;
  box-shadow:
    inset 0 1px 0 #fff3bb55,
    0 0 10px #e9b83b70,
    0 0 22px #c8932738;
  text-shadow: 0 1px 2px #4b330f;
}

/* Keep the app name together while the tools can wrap on small screens. */
.brand > span > .brand-name { display:inline; font:inherit; letter-spacing:inherit; white-space:nowrap; }

.today-routines-heading{align-items:center;gap:10px}
.today-routine-tools{display:flex;align-items:center;gap:7px;margin-left:auto;min-width:0}
.today-routine-tabs{display:grid;grid-template-columns:1fr 1fr;width:142px;min-width:142px;height:38px;padding:3px;gap:2px;border-radius:11px}
.today-routine-tabs button{position:relative;display:flex;align-items:center;justify-content:center;width:100%;min-width:0;min-height:0;height:32px;padding:0 8px;border-radius:8px;font-size:10px;font-weight:800;line-height:1;letter-spacing:.035em}
.today-routine-tabs button.active{box-shadow:inset 0 0 0 1px #dfb95a55,0 2px 8px #0004}
.today-routine-tabs button i{position:absolute;width:5px;height:5px;border-radius:50%;background:#ffd66b;right:5px;top:4px;box-shadow:0 0 7px #ffd66b99}
.today-add-routine{display:inline-flex;align-items:center;gap:3px;flex:0 0 auto;min-height:38px;padding:0 3px;font-size:13px;white-space:nowrap}
.today-add-routine svg{width:16px;height:16px}
@media(max-width:420px){
  .today-routines-heading{flex-wrap:nowrap}
  .today-routine-tools{gap:4px}
  .today-routine-tabs{width:128px;min-width:128px;height:36px;padding:3px}
  .today-routine-tabs button{height:30px;padding:0 6px;font-size:9px}
  .today-add-routine{min-height:36px;font-size:12px}
}

.today-shell .routine-score-chip{flex:0 0 52px;min-height:46px;padding:4px 5px;border-radius:10px}
.today-shell .routine-score-chip strong{display:block;font-size:14px;line-height:1.05;color:#f8d777}
.today-shell .routine-score-chip small{display:block;margin-top:3px;font-size:8px;line-height:1;letter-spacing:.055em;color:#cdbb91}
.today-shell .today-weekly-score small{font-size:9px;letter-spacing:.02em}

.primary-choice-list{display:grid;gap:8px}
.primary-choice-row{display:grid;grid-template-columns:minmax(0,1fr) 30px 22px;align-items:center;gap:9px;width:100%;min-height:66px;padding:10px 12px;border-radius:13px;background:#222428;border:1px solid #ffffff13;text-align:left}
.primary-choice-row:active{background:#2a2b2e;transform:scale(.995)}
.primary-choice-mark{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;border:1px solid #e4bc5c55;color:#f4cf73;font-size:18px}
.primary-choice-row strong{display:block;font-size:15px;line-height:1.3;color:#f5f2eb}
.primary-choice-row small{display:block;margin-top:4px;font-size:11px;line-height:1.35;color:#aaa69d}
.primary-choice-arrow{color:#e3c46f;font-size:22px;text-align:right}

.life-block-mark{display:grid;place-items:center;flex:0 0 30px;width:30px;height:38px;color:#e6bd5d;opacity:.88}
.life-block-mark svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.task-row>.life-block-mark{margin-left:3px}
.primary-choice-row>.life-block-mark{width:30px;height:34px;margin:0;justify-self:center}
.primary-choice-row>.life-block-mark svg{width:18px;height:18px}
@media(max-width:420px){
  .life-block-mark{flex-basis:28px;width:28px}
  .life-block-mark svg{width:18px;height:18px}
}


/* V3.13 preview · Vision -> Goal -> System Life Block builder. */
.vision-foundation{
  position:relative;display:flex;align-items:center;gap:16px;width:100%;
  margin:12px 0 10px;padding:18px 17px;text-align:left;color:#f6f0e3;
  border:1px solid #d5ad5142;border-radius:16px;
  background:linear-gradient(135deg,#292419 0%,#1b1d20 54%,#15171a 100%);
  box-shadow:inset 0 1px 0 #ffffff0d,0 12px 30px #0005,0 0 24px #d7aa3510;
}
.vision-foundation::before{
  content:"";position:absolute;top:-1px;left:20px;right:46%;height:1px;
  background:linear-gradient(90deg,#f2cf70,transparent);opacity:.78;
}
.vision-foundation-copy{display:block!important;min-width:0;flex:1}
.vision-foundation-copy>small{display:block;margin:0 0 7px;color:#e7bd60;font-size:10px;font-weight:850;letter-spacing:.12em}
.vision-foundation-copy>strong{display:block;font-size:17px;font-weight:720;line-height:1.35;white-space:normal}
.vision-foundation-copy>em{
  display:-webkit-box;margin-top:8px;overflow:hidden;color:#bdb5a4;font-size:12.5px;font-style:normal;line-height:1.45;
  -webkit-box-orient:vertical;-webkit-line-clamp:2;
}
.vision-edit-label{display:block!important;margin-top:10px;color:#f0ce78;font-size:11px;font-weight:760;letter-spacing:.02em}
.vision-foundation>svg{width:19px;color:#d8b65e;opacity:.9}

.life-build-path{
  margin:0 0 20px;padding:14px;border:1px solid #ffffff10;border-radius:15px;
  background:#15181b;box-shadow:0 10px 24px #0003;
}
.life-build-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px}
.life-build-head>span{min-width:0}
.life-build-head small{display:block;color:#e1b85d;font-size:9.5px;font-weight:850;letter-spacing:.12em}
.life-build-head strong{display:block;margin-top:4px;font-size:13px;font-weight:620;line-height:1.35;color:#eae4d7}
.life-build-head>em{flex:0 0 auto;color:#8f8b81;font-size:9px;font-style:normal;white-space:nowrap}
.life-build-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.life-build-stages button{
  min-width:0;min-height:66px;padding:8px 4px;border:1px solid #ffffff12;border-radius:11px;
  background:#1e2125;color:#c8c1b3;text-align:center;
}
.life-build-stages button.built{border-color:#d5ab4b50;background:linear-gradient(180deg,#2c271b,#202226)}
.life-build-stages b{
  display:grid;place-items:center;width:21px;height:21px;margin:0 auto 5px;border:1px solid #a98b4f55;border-radius:50%;
  color:#f0c96d;font-size:10px;
}
.life-build-stages span{display:block;overflow:hidden;text-overflow:ellipsis;color:#f1eadc;font-size:9px;font-weight:850;letter-spacing:.04em;white-space:nowrap}
.life-build-stages small{display:block;margin-top:4px;color:#8f8b81;font-size:8.5px;font-weight:750}
.life-build-stages .built small{color:#e0bb63}

.vision-builder-form{display:grid;gap:4px}
.vision-step{display:flex;align-items:center;gap:11px;margin:5px 0 2px}
.vision-step>b{
  display:grid;place-items:center;width:30px;height:30px;flex:0 0 30px;border:1px solid #d6ae5259;border-radius:50%;
  background:#2a251a;color:#f2ce73;font-size:12px;
}
.vision-step>span{display:block}
.vision-step small{display:block;color:#dcb45b;font-size:9.5px;font-weight:850;letter-spacing:.12em}
.vision-step strong{display:block;margin-top:2px;font-size:14px}
.vision-builder-help{margin:5px 0 2px;color:#b7b0a2;font-size:12.5px;line-height:1.5}
.vision-prompts{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 7px}
.vision-prompts span{padding:6px 8px;border:1px solid #ffffff12;border-radius:999px;background:#1d2023;color:#bdb6a7;font-size:10px}
.vision-save-actions{display:grid;gap:8px;margin-top:7px}

.goal-build-guide{display:grid;gap:10px}
.goal-build-intro{padding:4px 2px 8px}
.goal-build-intro small{color:#d9b45d;font-size:10px;font-weight:850;letter-spacing:.1em}
.goal-build-intro h3{margin:5px 0 6px;font-size:21px;line-height:1.25}
.goal-build-intro p{margin:0;color:#bdb5a5;font-size:13px;line-height:1.5}
.goal-build-choice{
  display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:15px 14px;
  border:1px solid #ffffff13;border-radius:13px;background:#1d2023;color:#f1eadc;text-align:left;
}
.goal-build-choice:hover,.goal-build-choice:focus-visible{border-color:#d9af5066;background:#24231f}
.goal-build-choice>span{display:block;min-width:0}
.goal-build-choice small{display:block;color:#deb75f;font-size:9.5px;font-weight:850;letter-spacing:.11em}
.goal-build-choice strong{display:block;margin-top:3px;font-size:16px}
.goal-build-choice em{display:block;margin-top:4px;color:#a9a295;font-size:11.5px;font-style:normal;line-height:1.35}
.goal-build-choice>b{color:#e8c46c;font-size:19px}
.goal-build-later{justify-self:center;margin-top:4px}

@media(max-width:430px){
  .life-build-head{align-items:flex-start}
  .life-build-head>em{display:none}
  .life-build-path{padding:12px 10px}
  .life-build-stages{gap:5px}
  .life-build-stages button{min-height:64px;padding-inline:2px}
  .life-build-stages span{font-size:8.4px}
  .vision-foundation{padding:16px 14px}
}
@media(max-width:350px){
  .life-build-stages span{font-size:7.6px;letter-spacing:0}
  .life-build-stages small{font-size:7.8px}
}


/* V3.14 preview · first Flow wizard + compact Vision setup. */
.vision-foundation{
  margin-bottom:12px;padding:17px 18px;border-color:#d5ad5140;
}
.vision-foundation-copy>small{margin-bottom:6px}
.vision-foundation-copy>strong{font-size:16px;line-height:1.35}
.vision-foundation-copy>em{display:none}
.vision-edit-label{margin-top:9px}

.first-flow-wizard{padding:13px 12px 12px}
.first-flow-wizard .life-build-head{margin-bottom:11px}
.first-flow-wizard .life-build-head small{font-size:9px}
.first-flow-wizard .life-build-head strong{font-size:12px;font-weight:560;color:#beb7a9}
.first-flow-wizard .life-build-stages button{min-height:65px}
.first-flow-wizard .life-build-stages button.built{
  border-color:#e6bd5d66;
  background:linear-gradient(180deg,#2d281d,#202226);
  box-shadow:inset 0 1px 0 #ffe5a118,0 0 14px #e5b94913;
}
.first-flow-wizard .life-build-stages button.built b{
  border-color:#e3b64c;background:#e3b64c;color:#17191c;
  box-shadow:0 0 13px #e5b84f75;
  font-size:12px;font-weight:950;
}
.first-flow-wizard .life-build-stages button.built span{color:#f6e7bd}
.first-flow-wizard .life-build-stages button.built small{display:none}
.first-flow-wizard .life-build-stages small{min-height:10px}

.vision-compact-form{display:grid;gap:11px}
.vision-compact-step{padding:0;margin:0}
.vision-compact-step header{display:flex;align-items:center;gap:10px;margin:0 0 7px}
.vision-compact-step header>b{
  display:grid;place-items:center;width:26px;height:26px;flex:0 0 26px;
  border:1px solid #d9b45b63;border-radius:50%;background:#29251b;color:#efca6e;
  font-size:11px;font-weight:850;
}
.vision-compact-step header>span{display:block;min-width:0}
.vision-compact-step header strong{display:inline;font-size:12px;letter-spacing:.06em}
.vision-compact-step header small{margin-left:7px;color:#9f998e;font-size:10.5px}
.vision-compact-form .field{margin:0}
.vision-compact-form .field>span{font-size:11px;color:#bcb5a7}
.vision-compact-form input[name="vision"]{min-height:44px}
.vision-compact-form textarea[name="picture"]{
  min-height:82px;max-height:96px;resize:none;line-height:1.4;
}
.vision-image-picker{
  display:grid;grid-template-columns:58px minmax(0,1fr) auto;align-items:center;gap:11px;
  width:100%;min-height:62px;padding:7px 11px;border:1px solid #ffffff12;border-radius:12px;
  background:#1c1f22;color:#eee7d9;text-align:left;
}
.vision-image-picker.has-image{border-color:#d6ab4f45;background:#211f1a}
.vision-image-thumb{
  position:relative;display:block;width:58px;height:46px;overflow:hidden;border-radius:8px;
  background:#0f1113;border:1px solid #ffffff10;
}
.vision-image-thumb .cover-img{width:100%;height:100%;object-fit:cover}
.vision-image-picker>span:nth-child(2){display:block;min-width:0}
.vision-image-picker>span:nth-child(2)>strong{display:block;font-size:13px}
.vision-image-picker>span:nth-child(2)>small{display:block;margin-top:3px;color:#969087;font-size:10px}
.vision-image-picker>b{color:#e4bf68;font-size:17px}
.vision-save{margin-top:2px;min-height:44px}
#modal:has(.vision-compact-form) .sheet{padding:17px 18px}
#modal:has(.vision-compact-form) .sheet>header{margin-bottom:10px}
#modal:has(.vision-compact-form) .sheet>header h2{font-size:1.2rem}
#modal:has(.vision-compact-form) .form-error{margin:0}
#modal:has(.vision-compact-form){max-height:calc(var(--visible-height) - 18px)}

@media(max-width:430px){
  .vision-foundation{padding:16px 15px}
  .first-flow-wizard{padding-inline:9px}
  .first-flow-wizard .life-build-stages{gap:5px}
  .first-flow-wizard .life-build-stages button{padding-inline:1px}
  .first-flow-wizard .life-build-stages span{font-size:8.2px}
  .vision-compact-form{gap:9px}
  .vision-compact-step header{margin-bottom:6px}
  #modal:has(.vision-compact-form) .sheet{padding:14px 15px 15px}
  #modal:has(.vision-compact-form) .sheet>header{margin-bottom:8px}
}


/* V3.15 preview · restrained premium progress celebrations. */
.flow-celebration{
  position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;
  pointer-events:auto;background:#07080973;backdrop-filter:blur(4px);
  animation:flowCelebrateFade .9s ease both;
}
.flow-celebration.flow-built,.flow-celebration.goal-reached{animation-duration:2.1s}
.flow-celebration-card{
  width:min(430px,calc(100% - 34px));padding:28px 24px;border:1px solid #e2b95559;border-radius:20px;
  background:
    radial-gradient(circle at 50% 0%,#e8bd4b1f,transparent 38%),
    linear-gradient(180deg,#1d1f22,#111315);
  box-shadow:0 24px 70px #000a,0 0 42px #d7aa342c,inset 0 1px 0 #fff2;
  color:#f6efe0;text-align:center;
}
.flow-celebration-card>img{display:block;width:70px;height:48px;object-fit:contain;margin:0 auto 8px;mix-blend-mode:screen;filter:drop-shadow(0 0 14px #e8bb5966)}
.flow-celebration-card>small{display:block;color:#d9b35c;font-size:10px;font-weight:900;letter-spacing:.14em}
.flow-celebration-card>h2{margin:6px 0 9px;font-size:24px;line-height:1.1;letter-spacing:-.03em}
.flow-celebration-card>p{margin:0;color:#bdb5a7;font-size:13px;line-height:1.5}
.flow-chain{display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr auto;align-items:center;gap:6px;margin:20px 0 17px}
.flow-chain span{
  display:grid;gap:5px;place-items:center;color:#efe7d7;font-size:8px;font-weight:850;letter-spacing:.06em;
}
.flow-chain span b{
  display:grid;place-items:center;width:27px;height:27px;border-radius:50%;
  background:#ddb34f;color:#17191c;font-size:14px;
  box-shadow:0 0 16px #e7b8448a;
  animation:flowCheckPop .32s ease both;
}
.flow-chain span:nth-of-type(2) b{animation-delay:.12s}
.flow-chain span:nth-of-type(3) b{animation-delay:.24s}
.flow-chain span:nth-of-type(4) b{animation-delay:.36s}
.flow-chain i{
  display:block;height:1px;background:linear-gradient(90deg,#b78b25,#f1cc70,#b78b25);
  box-shadow:0 0 10px #e8ba4e87;transform-origin:left center;
  animation:flowLineGrow .34s ease both;
}
.flow-chain i:nth-of-type(2){animation-delay:.16s}
.flow-chain i:nth-of-type(3){animation-delay:.3s}
.micro-card{
  width:auto;min-width:210px;max-width:calc(100% - 48px);padding:16px 19px;
  display:grid;grid-template-columns:31px minmax(0,1fr);grid-template-rows:auto auto;
  align-items:center;gap:2px 10px;text-align:left;border-radius:15px;
  animation:flowMicroPop .3s ease both;
}
.micro-card .celebration-check,.goal-reached-card .celebration-check{
  display:grid;place-items:center;width:31px;height:31px;border-radius:50%;
  background:#deb44f;color:#16191c;font-weight:950;box-shadow:0 0 15px #e6b84778;
}
.micro-card .celebration-check{grid-row:1/3}
.micro-card strong{font-size:13px;letter-spacing:.02em}
.micro-card small{color:#aaa397;font-size:10px}
.goal-reached-card{padding-top:31px}
.goal-reached-card .celebration-check{width:50px;height:50px;margin:0 auto 10px;font-size:23px}
.goal-reached-card h2{font-size:25px}
.flow-celebration.goal-reached .flow-celebration-card{
  box-shadow:0 24px 70px #000a,0 0 54px #e0b4453a,inset 0 1px 0 #fff2;
}
@keyframes flowMicroPop{
  0%{opacity:0;transform:translateY(10px) scale(.97)}
  100%{opacity:1;transform:none}
}
@keyframes flowCheckPop{
  0%{opacity:0;transform:scale(.45)}
  70%{transform:scale(1.14)}
  100%{opacity:1;transform:scale(1)}
}
@keyframes flowLineGrow{
  from{opacity:0;transform:scaleX(0)}
  to{opacity:1;transform:scaleX(1)}
}
@keyframes flowCelebrateFade{
  0%{opacity:0}
  12%,82%{opacity:1}
  100%{opacity:0}
}
@media(max-width:430px){
  .flow-celebration-card{padding:24px 17px}
  .flow-chain{gap:4px}
  .flow-chain span{font-size:7px}
  .flow-chain span b{width:24px;height:24px}
}
@media(prefers-reduced-motion:reduce){
  .flow-celebration,.flow-celebration-card,.flow-chain span b,.flow-chain i{animation:none!important}
}


/* V3.16 preview · denser calendar board cards. */
.board-card{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 30px 38px;
  align-items:center;
  min-height:54px;
  padding:3px 2px;
  margin-bottom:5px;
  gap:0;
}
.board-card .check-btn{
  grid-column:1;
  grid-row:1;
  position:static;
  width:44px;
  height:44px;
  padding:0;
}
.board-card .task-content{
  grid-column:2;
  grid-row:1;
  min-height:44px;
  padding:5px 2px;
  align-self:center;
}
.board-card>.life-block-mark{
  grid-column:3;
  grid-row:1;
  justify-self:center;
  align-self:center;
  width:30px;
  height:44px;
  margin:0;
  flex-basis:30px;
  opacity:.94;
}
.board-card>.life-block-mark svg{
  width:18px;
  height:18px;
}
.board-card .drag-handle{
  grid-column:4;
  grid-row:1;
  width:38px;
  min-width:38px;
  min-height:44px;
  padding:0;
  align-self:center;
  font-size:1.18rem;
  order:0;
}
.board-card .task-title{
  font-size:.94rem;
  line-height:1.22;
  padding:0;
}
.board-card .task-meta{
  margin-top:2px;
  padding:0;
  font-size:.73rem;
  line-height:1.2;
}
@media(max-width:420px){
  .board-card{
    grid-template-columns:42px minmax(0,1fr) 28px 36px;
    min-height:52px;
  }
  .board-card .check-btn{width:42px}
  .board-card>.life-block-mark{width:28px;height:42px}
  .board-card .drag-handle{width:36px;min-width:36px}
}


/* MyVAULT V2 preview · unified personal vault. */
.vault-home{max-width:940px;margin:0 auto;padding-bottom:24px}
.vault-title-row{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  margin:4px 0 14px;
}
.vault-title-row h1{margin:0;font-size:clamp(28px,7vw,38px);letter-spacing:-.045em}
.vault-title-row p{margin:4px 0 0;color:#aaa398;font-size:13px}
.vault-search-button{
  width:46px;min-width:46px;height:46px;padding:0;
  font-size:32px;line-height:1;color:#efc967;
  display:grid;place-items:center;
}
.vault-quick-note{
  display:grid;grid-template-columns:30px minmax(0,1fr) 42px;align-items:center;gap:8px;
  min-height:58px;padding:7px 8px 7px 13px;margin:0 0 11px;
  border:1px solid #dab65d38;border-radius:15px;
  background:linear-gradient(135deg,#2a261d,#1a1d20 72%);
  box-shadow:inset 0 1px 0 #ffffff0d,0 8px 24px #0004,0 0 20px #d9ae3e10;
}
.vault-quick-note>span{font-size:18px}
.vault-quick-note input{
  min-width:0;border:0;background:transparent;color:#f4eee1;font-size:16px;outline:0;
}
.vault-quick-note input::placeholder{color:#918a80}
.vault-quick-note button{
  display:grid;place-items:center;width:42px;height:42px;border-radius:12px;
  background:linear-gradient(135deg,#ffe59a,#e4b54c);color:#1a1b1d;font-size:25px;font-weight:450;
  box-shadow:0 0 16px #e7b84c42;
}
.vault-search{
  display:flex;align-items:center;gap:9px;min-height:43px;padding:0 12px;margin:0 0 9px;
  border:1px solid #ffffff10;border-radius:12px;background:#181b1f;color:#9e998f;
}
.vault-search>span{font-size:18px}
.vault-search input{width:100%;min-width:0;border:0;background:transparent;color:#eee8dc;outline:0;font-size:14px}
.vault-filters{
  display:flex;gap:7px;overflow-x:auto;padding:2px 0 6px;margin:0 0 12px;scrollbar-width:none;
}
.vault-filters::-webkit-scrollbar{display:none}
.vault-filters button{
  flex:0 0 auto;min-height:36px;padding:7px 12px;border:1px solid #ffffff10;border-radius:999px;
  background:#1c1f22;color:#9f9a91;font-size:10px;font-weight:850;letter-spacing:.08em;
}
.vault-filters button.active{
  border-color:#e1b85878;background:#30291c;color:#f4cf75;
  box-shadow:0 0 14px #e2b64c1d;
}
.vault-section{margin:20px 0 0}
.vault-section-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 2px 9px;
}
.vault-section-head h2{margin:0;font-size:13px;letter-spacing:.1em;color:#f1eadc}
.vault-section-head small{color:#817c73;font-size:10px}
.vault-pinned-row{
  display:flex;gap:10px;overflow-x:auto;padding:2px 2px 10px;scroll-snap-type:x proximity;scrollbar-width:none;
}
.vault-pinned-row::-webkit-scrollbar{display:none}
.vault-pinned-item{flex:0 0 min(265px,76vw);scroll-snap-align:start}
.vault-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;
}
.vault-item{
  position:relative;overflow:hidden;min-width:0;border:1px solid #ffffff10;border-radius:15px;
  background:linear-gradient(145deg,#292c31,#1b1d21 72%);
  box-shadow:inset 0 1px 0 #ffffff0c,0 6px 18px #0004;
}
.vault-item>button:first-child{display:block;width:100%;height:100%;text-align:left;color:inherit}
.vault-card-body{display:block;padding:13px 13px 14px}
.vault-card-body small{
  display:block;color:#c4a95f;font-size:8.5px;font-weight:850;letter-spacing:.08em;
}
.vault-card-body small b{font-size:12px;margin-right:2px}
.vault-card-body strong{
  display:-webkit-box;margin-top:7px;overflow:hidden;color:#f4efe5;font-size:14px;line-height:1.3;font-weight:720;
  -webkit-box-orient:vertical;-webkit-line-clamp:2;
}
.vault-card-body>span{
  display:-webkit-box;margin-top:6px;overflow:hidden;color:#aaa49a;font-size:11px;line-height:1.45;
  -webkit-box-orient:vertical;-webkit-line-clamp:3;
}
.vault-card-body em{display:block;margin-top:9px;color:#76736d;font-size:9px;font-style:normal}
.vault-item.vault-note{border-top-color:#d8b45a3b}
.vault-item.vault-reflection{
  background:
    radial-gradient(circle at 100% 0,#d4a92e12,transparent 45%),
    linear-gradient(150deg,#28251f,#1a1d21 70%);
}
.vault-item.vault-reflection .vault-card-body strong{font-family:Georgia,serif;font-weight:500}
.vault-saved .vault-media{display:block;width:100%;aspect-ratio:16/9;overflow:hidden;background:#0d0f11}
.vault-saved .vault-media img{width:100%;height:100%;object-fit:cover}
.vault-item>.record-menu{
  position:absolute;right:6px;top:6px;z-index:3;min-width:34px;width:34px;height:34px;border-radius:10px;
  background:#0b0c0db8;color:#d7d1c5;
}
.vault-empty{border:1px dashed #ffffff12;background:#151719}
.vault-collections{margin-top:24px}
.vault-collection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.vault-collection-card{
  isolation:isolate;position:relative;min-height:118px;overflow:hidden;border:1px solid #d2af5b3b;border-radius:16px;
  text-align:left;color:#f6efe2;box-shadow:0 9px 24px #0004;
}
.vault-collection-card>.cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vault-collection-card>.image-shade{position:absolute;inset:0;background:linear-gradient(0deg,#080909ec 0%,#08090978 55%,#08090922 100%)}
.vault-collection-card>span:last-child{position:absolute;left:13px;right:12px;bottom:12px;z-index:2}
.vault-collection-card small{display:block;color:#e5c77d;font-size:9px;font-weight:700;margin-bottom:4px}
.vault-collection-card strong{display:block;font-size:16px}
.vault-collection-heading{
  display:grid;grid-template-columns:1fr auto;align-items:end;gap:2px 12px;margin:0 0 14px;
}
.vault-collection-heading .text-btn{grid-column:1/-1;justify-self:start;min-height:32px;padding:0}
.vault-collection-heading h2{margin:0;font-size:21px}
.vault-collection-heading>span{color:#9f998e;font-size:11px}
.vault-capture-grid{grid-template-columns:1fr!important}
.vault-capture-grid .btn{
  min-height:64px;display:grid;grid-template-columns:1fr;text-align:left;justify-items:start;padding:12px 14px;
}
.vault-capture-grid .btn b{font-size:15px}
.vault-capture-grid .btn small{color:#9f998e;font-size:11px;font-weight:500}
.notes-shell .fab.fab-labeled{min-width:66px;padding:0 18px;border-radius:18px}

@media(max-width:640px){
  .vault-home{padding-top:0}
  .vault-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .vault-card-body{padding:11px 10px 12px}
  .vault-card-body strong{font-size:13px}
  .vault-card-body>span{-webkit-line-clamp:2;font-size:10.5px}
  .vault-collection-card{min-height:105px}
  .vault-collection-card strong{font-size:14px}
}
@media(max-width:360px){
  .vault-grid{grid-template-columns:1fr}
  .vault-collection-grid{gap:8px}
  .vault-quick-note{grid-template-columns:26px minmax(0,1fr) 40px}
}


/* MyVAULT V2.1 preview · simple home, deeper collections. */
.vault-home-root .vault-section{margin-top:19px}
.vault-home-root .vault-collections{margin-top:15px}
.vault-home-root .vault-section-head{margin-bottom:8px}
.vault-home-root .vault-section-head h2{font-size:12px;letter-spacing:.11em}
.vault-home-root .vault-collection-grid{gap:9px}
.vault-home-root .vault-collection-card{min-height:112px}

.vault-pinned-reflections{margin-top:22px!important}
.vault-reflection-row{
  display:flex;gap:9px;overflow-x:auto;padding:1px 1px 7px;scroll-snap-type:x proximity;scrollbar-width:none;
}
.vault-reflection-row::-webkit-scrollbar{display:none}
.vault-pinned-reflection{
  position:relative;flex:0 0 min(310px,84vw);scroll-snap-align:start;overflow:hidden;
  border:1px solid #d8b15143;border-radius:15px;
  background:
    radial-gradient(circle at 90% 0,#e4b63d19,transparent 45%),
    linear-gradient(145deg,#29251d,#191b1e 75%);
  box-shadow:inset 0 1px 0 #ffffff0d,0 8px 20px #0004;
}
.vault-pinned-reflection>button:first-child{display:block;width:100%;padding:15px 16px;text-align:left}
.vault-pinned-reflection small{display:block;color:#dfbd6d;font-size:8.5px;font-weight:850;letter-spacing:.08em}
.vault-pinned-reflection strong{
  display:block;margin-top:7px;color:#f4eddf;font-family:Georgia,serif;font-size:17px;font-weight:500;line-height:1.25;
}
.vault-pinned-reflection span{
  display:-webkit-box;margin-top:7px;overflow:hidden;color:#aaa398;font-size:11px;line-height:1.5;
  -webkit-line-clamp:3;-webkit-box-orient:vertical;
}
.vault-pinned-reflection>.record-menu{position:absolute;right:5px;top:5px;background:#0b0c0db8}
.vault-pinned-reflection-empty{
  min-height:54px;display:flex;align-items:center;padding:0 14px;
  border:1px dashed #ffffff12;border-radius:13px;color:#827d74;font-size:11px;background:#151719;
}

.vault-notes-section{margin-top:21px!important}
.vault-home-notes{
  max-height:min(390px,46vh);overflow-y:auto;border:1px solid #ffffff0d;border-radius:15px;
  background:linear-gradient(145deg,#24272c,#191b1f 72%);scrollbar-width:none;
  box-shadow:inset 0 1px 0 #ffffff0c,0 7px 18px #0003;
}
.vault-home-notes::-webkit-scrollbar{display:none}
.vault-note-row{
  position:relative;display:grid;grid-template-columns:minmax(0,1fr) 38px;align-items:center;
  min-height:72px;border-bottom:1px solid #ffffff0c;
}
.vault-note-row:last-child{border-bottom:0}
.vault-note-row>button:first-child{
  display:block;min-width:0;width:100%;padding:11px 5px 11px 14px;text-align:left;
}
.vault-note-row strong{
  display:block;overflow:hidden;color:#f4efe5;font-size:14px;font-weight:650;line-height:1.25;text-overflow:ellipsis;white-space:nowrap;
}
.vault-note-row span{
  display:block;overflow:hidden;margin-top:4px;color:#9f9a91;font-size:11px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap;
}
.vault-note-row small{display:block;margin-top:6px;color:#77736d;font-size:8.5px;letter-spacing:.04em}
.vault-note-row>.record-menu{
  position:static;grid-column:2;width:36px;min-width:36px;height:44px;background:transparent;color:#9c978f;
}

.vault-collection-view{padding-bottom:34px}
.vault-collection-top{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 8px;
}
.vault-collection-top .text-btn{justify-content:flex-start}
.vault-collection-hero{
  isolation:isolate;position:relative;min-height:145px;overflow:hidden;border:1px solid #d4b15944;border-radius:18px;
  box-shadow:0 10px 28px #0005;
}
.vault-collection-hero>.cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vault-collection-hero>.image-shade{position:absolute;inset:0;background:linear-gradient(0deg,#08090ae8,#08090a6e 65%,#08090a22)}
.vault-collection-hero>div:last-child{position:absolute;left:17px;right:15px;bottom:16px;z-index:2}
.vault-collection-hero small{display:block;color:#e0bd68;font-size:8.5px;font-weight:800;letter-spacing:.09em}
.vault-collection-hero h1{margin:5px 0 0;color:#f7f0e3;font-size:24px;line-height:1.1;letter-spacing:-.03em}
.vault-collection-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 2px}
.vault-collection-actions .btn{min-height:44px;font-size:12px}

.vault-subfolder-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.vault-subfolder-card{
  min-height:88px;padding:12px;border:1px solid #ffffff10;border-radius:14px;
  background:linear-gradient(145deg,#292c31,#1b1d21 75%);text-align:left;
  box-shadow:inset 0 1px 0 #ffffff0b,0 5px 16px #0003;
}
.vault-subfolder-card>span{font-size:21px}
.vault-subfolder-card strong{display:block;margin-top:8px;color:#f3eddf;font-size:13px;line-height:1.25}
.vault-subfolder-card small{display:block;margin-top:4px;color:#88837a;font-size:9px}
.vault-collection-view .vault-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.vault-collection-view .vault-item{min-height:120px}
.vault-collection-view .vault-card-body strong{font-size:13px}
.vault-collection-view .vault-card-body>span{-webkit-line-clamp:2}

.vault-search-modal{margin:0 0 12px}
.vault-search-results{
  display:grid;gap:6px;max-height:min(500px,62vh);overflow-y:auto;scrollbar-width:none;
}
.vault-search-results::-webkit-scrollbar{display:none}
.vault-search-results>button{
  display:block;width:100%;padding:11px 12px;border:1px solid #ffffff0d;border-radius:12px;
  background:#1c1f22;text-align:left;
}
.vault-search-results small{display:block;color:#c2a258;font-size:8px;font-weight:800;letter-spacing:.07em}
.vault-search-results strong{
  display:block;margin-top:4px;color:#f1eadf;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.vault-search-results span{
  display:block;margin-top:4px;color:#8f8a82;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* V2.1 home intentionally hides the old mixed-feed controls. */
.vault-home-root .vault-search,
.vault-home-root .vault-filters,
.vault-home-root .vault-recent,
.vault-home-root .vault-pinned-row{display:none!important}

@media(max-width:430px){
  .vault-home-root .vault-collection-card{min-height:104px}
  .vault-home-notes{max-height:42vh}
  .vault-collection-hero{min-height:132px}
  .vault-collection-hero h1{font-size:22px}
  .vault-subfolder-card{min-height:82px;padding:11px}
}


/* MyVAULT V2.2 preview · slim reflections + rich social saves. */
.vault-reflection-slim{
  margin:20px 0 0;padding:12px 13px 10px;
  border:1px solid #d7b2563b;border-radius:14px;
  background:linear-gradient(135deg,#29251c,#17191c 76%);
  box-shadow:inset 0 1px 0 #ffffff0c,0 7px 18px #0003;
}
.vault-reflection-top{
  display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px;
}
.vault-reflection-top>span small{
  display:block;color:#d9b561;font-size:8px;font-weight:850;letter-spacing:.11em;
}
.vault-reflection-top>span strong{
  display:block;margin-top:3px;color:#eee8db;font-size:12px;font-weight:650;
}
.vault-reflection-top .text-btn{
  min-height:28px;padding:0;color:#c8a957;font-size:10px;
}
.vault-reflection-bottom{
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:12px;
}
.vault-reflection-week{
  display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;min-width:0;
}
.vault-reflection-week span{text-align:center;color:#75716a}
.vault-reflection-week i{
  display:grid;place-items:center;width:22px;height:22px;margin:0 auto;
  border:1px solid #ffffff18;border-radius:50%;font-size:9px;font-style:normal;
}
.vault-reflection-week small{display:block;margin-top:3px;font-size:7.5px}
.vault-reflection-week .written{color:#e6c36f}
.vault-reflection-week .written i{
  background:#80601c44;border-color:#d7ad55;color:#f5d67f;
  box-shadow:0 0 10px #d9ad5020;
}
.vault-reflection-write{
  min-height:36px;padding:8px 14px;font-size:10px;font-weight:850;letter-spacing:.06em;
}
.vault-notes-section{margin-top:10px!important}

.vault-reflections-page{padding-bottom:38px}
.vault-reflections-heading{margin:3px 0 14px}
.vault-reflections-heading small{
  color:#d9b45e;font-size:9px;font-weight:850;letter-spacing:.12em;
}
.vault-reflections-heading h1{
  margin:4px 0 4px;font-size:27px;letter-spacing:-.035em;
}
.vault-reflections-heading p{margin:0;color:#908b82;font-size:11px}
.vault-reflections-list{
  display:grid;gap:8px;max-height:calc(var(--visible-height) - 210px);overflow-y:auto;
  padding-bottom:12px;scrollbar-width:none;
}
.vault-reflections-list::-webkit-scrollbar{display:none}
.vault-reflection-note{
  position:relative;display:block;width:100%;padding:14px 15px;
  border:1px solid #ffffff0d;border-radius:13px;
  background:linear-gradient(145deg,#27241e,#191b1e 72%);text-align:left;
  box-shadow:inset 0 1px 0 #ffffff0b,0 5px 14px #0003;
}
article.vault-reflection-note{padding:0}
article.vault-reflection-note>button:first-child{display:block;width:100%;padding:14px 45px 14px 15px;text-align:left}
.vault-reflection-note small{
  display:block;color:#c2a65e;font-size:8px;font-weight:800;letter-spacing:.04em;
}
.vault-reflection-note strong{
  display:block;margin-top:5px;color:#f1eadc;font-family:Georgia,serif;font-size:15px;font-weight:500;line-height:1.3;
}
.vault-reflection-note span{
  display:-webkit-box;margin-top:6px;overflow:hidden;color:#9e998f;font-size:11px;line-height:1.45;
  -webkit-box-orient:vertical;-webkit-line-clamp:3;
}
.vault-reflection-note>.record-menu{position:absolute;right:4px;top:7px;background:transparent;color:#a79568}

.rich-link-preview{overflow:hidden}
.rich-link-preview img{
  flex:0 0 110px;width:110px;height:80px;object-fit:cover;background:#101214;
}
.rich-link-preview>div{min-width:0}
.rich-link-preview strong{font-size:14px}
.rich-link-preview small{margin-top:6px;font-size:10px}

/* Reflection is intentionally not offered as generic Vault content. */
.vault-collection-view .vault-reflection{display:none}

@media(max-width:430px){
  .vault-reflection-slim{padding:11px 10px 9px}
  .vault-reflection-bottom{gap:8px}
  .vault-reflection-week{gap:3px}
  .vault-reflection-week i{width:20px;height:20px}
  .vault-reflection-write{padding-inline:11px}
  .vault-reflections-list{max-height:calc(var(--visible-height) - 190px)}
  .rich-link-preview img{flex-basis:92px;width:92px;height:72px}
}