/* Isolated Diary styles. The feature uses the common Mini App color tokens. */
.diary-home-icon { background: rgba(126, 102, 208, .14); color: var(--primary); }
.diary-overlay { position: fixed; z-index: 25; inset: var(--app-top-offset) 0 0; display: flex; flex-direction: column; overflow: hidden; background: var(--bg); color: var(--text); transform: translateX(101%); transition: transform .26s ease; }
.diary-overlay.open { transform: translateX(0); }.diary-header { min-height: 58px; display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; padding: 8px 16px; border-bottom: 1px solid var(--border); background: var(--surface); }.diary-header-title { color: var(--text); font-size: 18px; font-weight: 750; text-align: center; }.diary-icon-btn { width: 40px; height: 40px; display: grid; place-items: center; border: 0; border-radius: 13px; background: transparent; color: var(--text); }.diary-icon-btn:active { background: var(--surface-2); transform: scale(.95); }.diary-icon-btn svg { width: 21px; height: 21px; }
.diary-body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 14px 16px calc(env(safe-area-inset-bottom) + 100px); -webkit-overflow-scrolling: touch; }.diary-tools { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; }.diary-search { min-height: 44px; display: flex; align-items: center; gap: 9px; padding: 0 13px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); color: var(--text-muted); }.diary-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--text); font: inherit; font-size: 14px; }.diary-controls { display: flex; justify-content: flex-end; }.diary-date { display: inline-flex; align-items: center; gap: 7px; color: var(--text-muted); font-size: 12px; font-weight: 650; }.diary-date input { min-height: 32px; border: 1px solid var(--border); border-radius: 10px; padding: 0 8px; background: var(--surface); color: var(--text); font: inherit; font-size: 12px; }.diary-filter-row { display: flex; gap: 7px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }.diary-filter-row::-webkit-scrollbar { display: none; }.diary-filter-chip { flex: 0 0 auto; min-height: 32px; padding: 0 11px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--text-muted); font: inherit; font-size: 12px; font-weight: 650; }.diary-filter-chip.active { border-color: transparent; background: var(--primary-soft); color: var(--primary); }
.diary-day-group { margin: 0 0 22px; }.diary-day-title { margin: 0 0 10px 2px; color: var(--text); font-size: 16px; font-weight: 760; }.diary-timeline { position: relative; display: flex; flex-direction: column; gap: 8px; }.diary-timeline-sentinel { height: 24px; }.diary-timeline-card { position: relative; width: 100%; min-height: 90px; display: flex; align-items: flex-start; gap: 11px; padding: 13px 13px 13px 8px; border: 1px solid var(--border); border-radius: 17px; background: var(--surface); color: var(--text); box-shadow: var(--shadow-sm); text-align: left; }.diary-timeline-line { position: absolute; z-index: 0; left: 25px; top: 40px; bottom: -18px; width: 2px; background: var(--border-strong); }.diary-day-group:last-child .diary-timeline-card:last-child .diary-timeline-line { display: none; }.diary-event-icon { position: relative; z-index: 1; width: 35px; height: 35px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 12px; background: var(--primary-soft); font-size: 18px; }.diary-event-content { min-width: 0; display: flex; flex-direction: column; gap: 3px; }.diary-event-title { overflow: hidden; color: var(--text); font-size: 15px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }.diary-event-meta, .diary-event-body { color: var(--text-muted); font-size: 12px; }.diary-event-body { font-size: 13px; line-height: 1.35; }
.diary-empty { max-width: 320px; margin: 58px auto 0; color: var(--text-muted); text-align: center; }.diary-empty-icon { width: 54px; height: 54px; display: grid; place-items: center; margin: 0 auto 14px; border-radius: 18px; background: var(--primary-soft); color: var(--primary); font-size: 26px; }.diary-empty h2 { margin: 0 0 8px; color: var(--text); font-size: 18px; }.diary-empty p { margin: 0; font-size: 14px; line-height: 1.5; }.diary-loading { min-height: 118px; display: flex; align-items: center; justify-content: center; gap: 6px; color: var(--primary); }.diary-loading span { width: 7px; height: 7px; border-radius: 50%; background: currentColor; animation: diary-loading 1s infinite ease-in-out; }.diary-loading span:nth-child(2) { animation-delay: .15s; }.diary-loading span:nth-child(3) { animation-delay: .3s; }@keyframes diary-loading { 0%,100% { opacity:.25; transform:translateY(0); }50% { opacity:1; transform:translateY(-5px); } }
.diary-detail, .diary-observation, .diary-reminders { max-width: 520px; margin: 0 auto; padding: 10px 2px 28px; }.diary-detail-back { display: inline-flex; align-items: center; gap: 5px; border: 0; padding: 8px 0; background: transparent; color: var(--primary); font: inherit; font-size: 14px; font-weight: 700; }.diary-detail-icon { width: 56px; height: 56px; display: grid; place-items: center; margin: 18px 0 12px; border-radius: 18px; background: var(--primary-soft); font-size: 28px; }.diary-detail h1, .diary-observation-intro h1 { margin: 5px 0 8px; color: var(--text); font-size: 24px; line-height: 1.2; }.diary-detail-meta { color: var(--text-muted); font-size: 13px; }.diary-detail p { color: var(--text); line-height: 1.55; }.diary-observation-intro { margin: 4px 0 18px; }.diary-observation-intro .diary-empty-icon { margin-left: 0; }.diary-observation-intro p { margin: 0; color: var(--text-muted); font-size: 14px; line-height: 1.45; }.diary-observation-field textarea { box-sizing: border-box; width: 100%; min-height: 144px; padding: 15px; border: 1px solid var(--border); border-radius: 18px; outline: 0; background: var(--surface); color: var(--text); font: inherit; font-size: 16px; line-height: 1.45; }.diary-observation-next { width: 100%; min-height: 50px; margin-top: 20px; }.diary-observation-kicker { margin: 8px 0 10px; color: var(--primary); font-size: 13px; font-weight: 750; }.diary-observation-preview-card { padding: 18px; border: 1px solid var(--border); border-radius: 20px; background: var(--surface); box-shadow: var(--shadow-sm); }.diary-preview-field { display: block; margin: 12px 0; }.diary-preview-field > span { display: block; margin-bottom: 5px; color: var(--text-muted); font-size: 11px; font-weight: 750; text-transform: uppercase; }.diary-preview-field input, .diary-preview-field select { box-sizing: border-box; width: 100%; min-height: 42px; padding: 0 11px; border: 1px solid var(--border); border-radius: 12px; outline: 0; background: var(--surface-2); color: var(--text); font: inherit; font-size: 14px; }.diary-observation-actions { display: grid; grid-template-columns: minmax(0,.72fr) minmax(0,1.28fr); gap: 10px; margin-top: 16px; }.diary-observation-actions .btn { min-height: 50px; }
.diary-entry-attachments, .diary-draft-attachments { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }.diary-entry-attachment { overflow: hidden; border: 1px solid var(--border); border-radius: 16px; background: var(--surface-2); }.diary-entry-attachment--image { width: min(100%,230px); aspect-ratio: 1; }.diary-entry-attachment--image img { display: block; width: 100%; height: 100%; object-fit: cover; }.diary-entry-attachment--audio { display: flex; align-items: center; width: 100%; padding: 10px; }.diary-entry-attachment--audio audio { min-width: 0; flex: 1; }
.diary-draft-attachment { position: relative; flex: 0 0 92px; width: 92px; height: 92px; overflow: hidden; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2); }.diary-draft-attachment--image img { display: block; width: 100%; height: 100%; object-fit: cover; }.diary-draft-attachment button { position: absolute; top: 5px; right: 5px; width: 26px; height: 26px; display: grid; place-items: center; padding: 0; border: 1px solid var(--border); border-radius: 50%; background: var(--surface); color: var(--text); font: inherit; font-size: 20px; line-height: 1; }.diary-draft-attachment button:active { transform: scale(.92); }.diary-draft-attachments--preview .diary-draft-attachment { flex-basis: 76px; width: 76px; height: 76px; }
.diary-reminder-schedule-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }.diary-reminder-private-note { color: var(--text-muted); font-size: 13px; line-height: 1.45; }.diary-reminder-list { margin-top: 28px; }.diary-reminder-list h2 { color: var(--text); font-size: 16px; }.diary-reminder-empty { display: flex; flex-direction: column; gap: 4px; padding: 16px; border: 1px dashed var(--border-strong); border-radius: 16px; color: var(--text-muted); font-size: 13px; }.diary-reminder-empty strong { color: var(--text); }.diary-reminder-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow-sm); }.diary-reminder-card + .diary-reminder-card { margin-top: 8px; }.diary-reminder-card > div:first-child { min-width: 0; display: flex; flex-direction: column; gap: 4px; }.diary-reminder-card strong { overflow: hidden; color: var(--text); text-overflow: ellipsis; white-space: nowrap; }.diary-reminder-card span { color: var(--text-muted); font-size: 12px; }.diary-reminder-card-actions { display: flex; flex: 0 0 auto; gap: 5px; }.diary-reminder-action { min-height: 30px; padding: 0 8px; border: 0; border-radius: 9px; background: var(--primary-soft); color: var(--primary); font: inherit; font-size: 11px; font-weight: 750; }.diary-reminder-action.is-danger { background: rgba(196,86,86,.11); color: var(--danger,#c95858); }
.diary-nav { position: fixed; z-index: 2; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(2,1fr); gap: 4px; padding: 8px 16px calc(env(safe-area-inset-bottom) + 8px); border-top: 1px solid var(--border); background: var(--surface); }.diary-nav-item { min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 7px 2px; border: 0; border-radius: 12px; background: transparent; color: var(--text-muted); font: inherit; font-size: 10px; font-weight: 600; }.diary-nav-item svg { width: 20px; height: 20px; }.diary-nav-item.active { background: var(--primary-soft); color: var(--primary); }
.diary-overlay-cta { position: sticky; bottom: calc(env(safe-area-inset-bottom) + 74px); z-index: 3; padding: 10px 16px 0; background: linear-gradient(180deg, transparent 0%, var(--bg) 24%, var(--bg) 100%); }.diary-overlay-cta .app-confirm-btn { width: 100%; min-height: 50px; box-shadow: none; }
.diary-timeline-empty { margin-top: 14px; }

/* Diary notes: clear attachment actions, neutral notes, no category taxonomy. */
.diary-entry-editor .diary-attachment-controls {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}
.diary-entry-editor .diary-attachment-button {
  width: 100%;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 10px;
  border-radius: 13px;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}
.diary-entry-editor .diary-attachment-button svg { width: 20px; height: 20px; flex: 0 0 auto; }
.diary-entry-editor .diary-attachment-button--voice.is-recording {
  grid-column: 1 / -1;
  width: 100%;
  background: rgba(196, 86, 86, .1);
  color: var(--danger, #c95858);
}
.diary-entry-editor .diary-original-toggle {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  margin: 10px 0 0;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-2);
  color: var(--text);
}
.diary-entry-editor .diary-original-toggle input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.diary-original-toggle-control {
  position: relative;
  width: 38px;
  height: 22px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: var(--border-strong);
  transition: background .18s ease;
}
.diary-original-toggle-control::after {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--surface);
  box-shadow: 0 1px 2px rgba(25, 20, 58, .18);
  content: '';
  transition: transform .18s ease;
}
.diary-original-toggle input:checked + .diary-original-toggle-control { background: var(--primary); }
.diary-original-toggle input:checked + .diary-original-toggle-control::after { transform: translateX(16px); }
.diary-original-toggle-copy { display: grid; gap: 2px; min-width: 0; }
.diary-original-toggle-copy strong { color: var(--text); font-size: 13px; font-weight: 700; }
.diary-original-toggle-copy small { color: var(--text-muted); font-size: 11px; line-height: 1.35; }
.diary-entry-editor .diary-draft-attachment--audio { min-width: 142px; }
.diary-entry-editor .diary-draft-attachment--audio > span { display: none; }
.diary-timeline-card { padding: 14px !important; }
.diary-timeline-card .diary-timeline-head { gap: 0; }

/* Archive has a clear visual rhythm: title, count, then the disclosure arrow. */
.diary-reminder-archive summary { justify-content: flex-start; }
.diary-reminder-archive summary .diary-reminder-archive-title { display: inline; }
.diary-reminder-archive summary .diary-reminder-archive-count { margin-left: auto; }
.diary-reminder-archive-chevron { margin-left: 0; }

/* One sheet language for Diary and Reminders: the same quiet controls as Feeding. */
.diary-entry-editor-sheet { border: 0 !important; }
.diary-entry-editor .diary-icon-btn {
  width: 40px; height: 40px; border: 0 !important; border-radius: 14px;
  background: var(--surface-2); color: var(--text); font-size: 27px;
}
.diary-entry-editor .field-input,
.diary-entry-editor .diary-preview-field input,
.diary-entry-editor .diary-preview-field select,
.diary-entry-editor .diary-field-text textarea,
.diary-entry-editor .field-input-wrap:not(.lunora-temporal-field),
.diary-entry-editor .temporal-input-wrap:not(.lunora-temporal-field) {
  box-sizing: border-box; border: 0 !important; outline: 0; box-shadow: none !important;
  background: var(--input-bg) !important; color: var(--text); font: inherit; font-size: 14px;
}
/* Date and time deliberately inherit the shared Lunora temporal control.
   Do not add sheet-specific padding, height or typography here: the Sleep
   sheets are the visual reference for every date/time picker. */
.diary-entry-editor .field-input,
.diary-entry-editor .diary-preview-field input,
.diary-entry-editor .diary-preview-field select { min-height: 44px; padding: 0 14px; border-radius: 12px; }
.diary-entry-editor .diary-preview-field select {
  /* Native arrows sit flush against the edge in Telegram WebView.  Render
     one stable chevron at the same inset as the rest of the controls. */
  appearance: none;
  -webkit-appearance: none;
  padding-right: 46px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b4d' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 17px center !important;
  background-size: 18px !important;
}
.diary-entry-editor .diary-field-text textarea { min-height: 112px; padding: 12px 14px; border-radius: 12px; }
.diary-entry-editor .field-input:focus,
.diary-entry-editor .diary-preview-field input:focus,
.diary-entry-editor .diary-preview-field select:focus,
.diary-entry-editor .diary-field-text textarea:focus { border: 0 !important; outline: 0; }
.diary-entry-editor .diary-preview-field { margin: 20px 0 0; }
.diary-entry-editor .diary-reminder-schedule-fields { margin-top: 20px; }
.diary-entry-editor .diary-reminder-schedule-fields .diary-preview-field { margin: 0; }
.diary-entry-editor .diary-original-toggle { border: 0 !important; }
.diary-entry-editor-actions.diary-reminder-editor-actions--new { grid-template-columns: 1fr; }
.diary-reminder-editor-delete { border: 0 !important; background: rgba(196, 86, 86, .1) !important; color: var(--danger, #c95858) !important; }

/* Cards should open quietly: no scale or whole-card press animation. */
.diary-timeline-card,
.diary-reminder-card { transition: none !important; transform: none !important; }
.diary-timeline-card:active,
.diary-reminder-card:active { transform: none !important; }
.diary-reminder-card[role="button"] { cursor: pointer; }

/* Archive header is just a disclosure row. Destructive action lives inside it. */
.diary-reminder-archive summary { justify-content: flex-start; }
.diary-reminder-archive summary .diary-reminder-archive-title {
  display: inline-flex; align-items: center; gap: 8px;
}
.diary-reminder-archive summary .diary-reminder-archive-count {
  display: inline; min-width: 0; height: auto; margin: 0; padding: 0;
  border-radius: 0; background: transparent; color: var(--text-muted); font-size: inherit;
}
.diary-reminder-archive-chevron { margin-left: auto; }
.diary-reminder-archive-clear {
  min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  width: 100%; margin-top: 4px; padding: 0 14px; border: 0; border-radius: 13px;
  background: rgba(196, 86, 86, .1); color: var(--danger, #c95858);
  font: inherit; font-size: 13px; font-weight: 700; line-height: 1.2;
}
.diary-reminder-archive-clear svg { width: 16px; height: 16px; }
.diary-reminder-card-edit { width: 22px; height: 22px; flex: 0 0 auto; display: grid; place-items: center; color: var(--primary); }
.diary-reminder-card-edit svg { width: 19px; height: 19px; }
@media (min-width:561px) { .diary-overlay { left:50%; right:auto; width:min(100%,560px); transform:translateX(101%); }.diary-overlay.open { transform:translateX(-50%); }.diary-nav { left:50%; right:auto; width:min(100%,560px); transform:translateX(-50%); } }

/* Diary polish: the bottom navigation is the only navigation surface. */
.diary-observation-date {
  display: block;
  margin-top: 16px;
}

.diary-observation-date > span {
  display: block;
  margin-bottom: 7px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 750;
  text-transform: uppercase;
}

.diary-observation-date-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

/* The Diary deliberately uses flat controls; elevation belongs to the app shell. */
.diary-overlay button,
.diary-overlay .btn,
.diary-overlay .diary-timeline-card,
.diary-overlay .diary-observation-preview-card,
.diary-overlay .diary-reminder-card {
  box-shadow: none !important;
}

/* Observation composer: compact media actions and deliberate vertical rhythm. */
.diary-observation,
.diary-reminders {
  padding-top: 4px;
}

.reminders-overlay .diary-body {
  padding-bottom: calc(env(safe-area-inset-bottom) + 100px);
}

.diary-observation-intro {
  margin: 0 0 14px;
}

.diary-observation-field textarea {
  min-height: 132px;
}

.diary-observation-date {
  margin-top: 14px;
}

.diary-attachment-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  margin-top: 10px;
}

.diary-attachment-button {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-2);
  color: var(--primary);
}

.diary-attachment-button svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.diary-attachment-button:active {
  transform: scale(.95);
}

.diary-attachment-button--voice.is-recording {
  width: auto;
  gap: 6px;
  padding: 0 11px;
  background: rgba(196, 86, 86, .1);
  color: var(--danger, #c95858);
}

.diary-attachment-button--voice.is-recording span {
  font: inherit;
  font-size: 13px;
  font-weight: 750;
}

.diary-original-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 4px 0 2px;
  color: var(--text-muted);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.35;
  cursor: pointer;
}

.diary-original-toggle input {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: var(--primary);
}

.diary-draft-attachment--audio {
  flex: 0 1 auto;
  width: auto;
  min-width: 0;
  height: 44px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 8px 0 11px;
}

.diary-draft-attachment--audio > span {
  flex: 0 0 auto;
  color: var(--primary);
  font-size: 18px;
}

.diary-draft-attachment--audio strong {
  min-width: 0;
  overflow: hidden;
  color: var(--text);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.diary-draft-attachment--audio button {
  position: static;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  margin-left: 2px;
  font-size: 17px;
}

.diary-draft-attachments--preview .diary-draft-attachment--audio {
  flex-basis: auto;
  width: auto;
  height: 40px;
}

.diary-entry-image-button {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
}

.diary-entry-image-button img {
  cursor: zoom-in;
}

.diary-media-lightbox {
  position: fixed;
  z-index: 80;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(15, 14, 31, .78);
}

.diary-media-lightbox-card {
  position: relative;
  width: min(100%, 560px);
  max-height: min(82vh, 760px);
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 20px;
  background: var(--surface);
}

.diary-media-lightbox-card img {
  display: block;
  width: 100%;
  max-height: calc(min(82vh, 760px) - 16px);
  object-fit: contain;
  border-radius: 14px;
}

.diary-media-lightbox-close {
  position: absolute;
  top: -11px;
  right: -11px;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 50%;
  background: var(--surface);
  color: var(--text);
  font-size: 24px;
  line-height: 1;
}

/* Timeline is the Diary home. Creation and editing stay in one compact sheet. */
.diary-timeline-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  max-width: 520px;
  margin: 2px auto 18px;
}

.diary-timeline-top h1 {
  margin: 0;
  color: var(--text);
  font-size: 25px;
  line-height: 1.2;
}

.diary-add-entry {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex: 0 0 auto;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: var(--primary);
  color: var(--on-primary, #fff);
  font: inherit;
  font-size: 13px;
  font-weight: 750;
}

.diary-add-entry span {
  font-size: 20px;
  font-weight: 400;
  line-height: 1;
}

.diary-timeline-list {
  max-width: 520px;
  margin: 0 auto;
}

.diary-empty {
  margin-top: 38px;
}

.diary-entry-editor {
  position: fixed;
  z-index: 70;
  inset: var(--app-top-offset) 0 0;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  padding-top: 30px;
  background: rgba(18, 15, 42, .46);
}

.diary-entry-editor-sheet {
  box-sizing: border-box;
  width: min(100%, 560px);
  max-height: 93%;
  overflow-y: auto;
  overflow-x: hidden;
  isolation: isolate;
  clip-path: inset(0 round 24px 24px 0 0);
  padding: 8px var(--modal-side-padding, 20px) calc(env(safe-area-inset-bottom) + 24px);
  border: 1px solid var(--border);
  border-bottom: 0;
  border-radius: 24px 24px 0 0;
  background: var(--surface);
  color: var(--text);
  -webkit-overflow-scrolling: touch;
}

.diary-entry-editor-handle {
  width: 40px;
  height: 4px;
  margin: 0 auto 12px;
  border-radius: 999px;
  background: var(--border-strong);
}

.diary-entry-editor-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 16px;
}

.diary-entry-editor-heading h2 {
  margin: 0;
  color: var(--text);
  font-size: var(--modal-title-size, 18px);
  font-weight: 700;
  line-height: normal;
  letter-spacing: -.01em;
}

.diary-entry-editor-heading .diary-icon-btn {
  width: 36px;
  height: 36px;
  border: 1px solid var(--border);
  font-size: 24px;
  line-height: 1;
}

.diary-entry-editor-text {
  display: block;
  margin: 12px 0;
}

.diary-entry-editor-text > span {
  display: block;
  margin-bottom: 5px;
  color: var(--text-muted);
  font-size: 11px;
  font-weight: 750;
  text-transform: uppercase;
}

.diary-entry-editor-text textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 112px;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 14px;
  outline: 0;
  resize: vertical;
  background: var(--surface-2);
  color: var(--text);
  font: inherit;
  font-size: 15px;
  line-height: 1.42;
}

.diary-entry-editor-sheet > .field {
  display: block;
  margin: 20px 0 0;
}

.diary-entry-editor-sheet > .diary-entry-editor-heading + .field,
.diary-entry-editor-sheet > .diary-entry-editor-heading + .diary-preview-field {
  margin-top: 4px;
}

.diary-entry-editor .diary-observation-date {
  margin-top: 12px;
}

.diary-entry-editor .diary-draft-attachments,
.diary-entry-editor .diary-entry-attachments {
  margin-top: 12px;
}

.diary-entry-editor-existing .diary-entry-attachment--image {
  width: 86px;
  border-radius: 13px;
}

.diary-entry-editor-existing .diary-entry-attachment--audio {
  width: min(100%, 300px);
}

.diary-entry-editor-actions {
  display: grid;
  grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr);
  gap: 10px;
  margin-top: 18px;
}

.diary-entry-editor-actions .btn {
  min-height: 50px;
}

/* Video must never disappear between upload and transcoding. */
.diary-draft-attachment--video video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.diary-draft-video-meta {
  position: absolute;
  right: 5px;
  bottom: 5px;
  left: 5px;
  overflow: hidden;
  padding: 4px 6px;
  border-radius: 7px;
  background: rgba(20, 16, 48, .72);
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.diary-draft-video-progress {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 52px;
  height: 52px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(var(--primary) var(--diary-upload-progress, 0deg), rgba(255, 255, 255, .36) 0);
  box-shadow: 0 3px 14px rgba(18, 15, 42, .32);
  transform: translate(-50%, -50%);
}

.diary-draft-video-progress::before {
  position: absolute;
  inset: 4px;
  border-radius: inherit;
  background: rgba(20, 16, 48, .82);
  content: '';
}

.diary-draft-video-progress > span {
  position: relative;
  color: #fff;
  font-size: 10px;
  font-weight: 750;
  font-variant-numeric: tabular-nums;
}

/* The upload state belongs on the preview itself: selection starts the upload. */
.diary-draft-image-meta {
  position: absolute;
  right: 4px;
  bottom: 4px;
  left: 4px;
  overflow: hidden;
  padding: 3px 5px;
  border-radius: 7px;
  background: rgba(20, 16, 48, .72);
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.diary-draft-attachment.is-failed .diary-draft-image-meta,
.diary-draft-attachment.is-failed .diary-draft-video-meta {
  background: rgba(177, 71, 79, .9);
}

.diary-draft-attachment button:disabled {
  opacity: .55;
}

.diary-draft-attachment--audio small {
  overflow: hidden;
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.diary-draft-attachment--audio .diary-draft-video-progress {
  position: static;
  width: 26px;
  height: 26px;
  margin-left: auto;
  transform: none;
}

.diary-draft-attachment--audio .diary-draft-video-progress::before { inset: 3px; }
.diary-draft-attachment--audio .diary-draft-video-progress > span { font-size: 0; }

.diary-upload-status,
.diary-video-processing {
  display: flex;
  align-items: center;
  gap: 8px;
  border-radius: 13px;
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.35;
}

.diary-upload-status {
  margin-top: 12px;
  padding: 11px 12px;
  background: var(--surface-2);
}

.diary-video-processing {
  width: 100%;
  min-height: 58px;
  padding: 12px;
  border: 1px solid var(--border);
  background: var(--surface-2);
}

.diary-upload-status span,
.diary-video-processing > span {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  border: 2px solid var(--border-strong);
  border-top-color: var(--primary);
  border-radius: 50%;
  animation: diary-upload-spinner .8s linear infinite;
}

.diary-upload-status.is-error {
  background: rgba(196, 86, 86, .1);
  color: var(--danger, #c95858);
}

@keyframes diary-upload-spinner {
  to { transform: rotate(360deg); }
}

@media (min-width: 561px) {
  .diary-entry-editor {
    left: 50%;
    width: min(100%, 560px);
    transform: translateX(-50%);
  }

  .diary-entry-editor-sheet {
    border-bottom: 1px solid var(--border);
    border-radius: 24px;
    clip-path: inset(0 round 24px);
    margin-bottom: 24px;
  }
}

/* Media and category icons use the same line-icon language as the Mini App. */
.diary-event-icon svg { width: 19px; height: 19px; }
.diary-event-icon.diary-event-icon--milestones { background: rgba(133, 109, 204, .14); color: #7964ba; }
.diary-event-icon.diary-event-icon--development { background: rgba(74, 169, 113, .13); color: #459565; }
.diary-event-icon.diary-event-icon--teeth { background: rgba(213, 111, 134, .13); color: #bd6178; }
.diary-event-icon.diary-event-icon--food { background: rgba(224, 151, 82, .15); color: #bc7c3d; }
.diary-event-icon.diary-event-icon--sleep { background: rgba(123, 111, 196, .14); color: #7b6fc4; }
.diary-event-icon.diary-event-icon--health { background: rgba(64, 166, 112, .13); color: #3f9867; }
.diary-event-icon.diary-event-icon--behavior { background: rgba(81, 150, 204, .13); color: #5c91bd; }
.diary-event-icon.diary-event-icon--doctor { background: rgba(62, 157, 149, .13); color: #3b908a; }
.diary-event-icon.diary-event-icon--kindergarten { background: rgba(111, 116, 203, .13); color: #686eb7; }
.diary-event-icon.diary-event-icon--potty { background: rgba(96, 139, 203, .13); color: #5f83b8; }
.diary-event-icon.diary-event-icon--holiday { background: rgba(226, 174, 66, .15); color: #bd8b35; }
.diary-event-icon.diary-event-icon--photo { background: rgba(194, 105, 164, .13); color: #ad6090; }
.diary-event-icon.diary-event-icon--other { background: rgba(129, 119, 166, .13); color: #786e9d; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--milestones { background: rgba(183, 159, 255, .19); color: #cbb8ff; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--development { background: rgba(107, 209, 145, .18); color: #91e2ae; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--teeth { background: rgba(239, 151, 172, .18); color: #f2acbe; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--food { background: rgba(239, 183, 108, .18); color: #f2c480; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--sleep { background: rgba(185, 172, 247, .18); color: #c7b9fa; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--health { background: rgba(112, 211, 157, .18); color: #8fe0b4; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--behavior { background: rgba(132, 192, 239, .18); color: #a1cff6; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--doctor { background: rgba(112, 211, 199, .18); color: #8cddd2; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--kindergarten { background: rgba(171, 174, 255, .18); color: #b9bcff; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--potty { background: rgba(143, 184, 241, .18); color: #adcefa; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--holiday { background: rgba(242, 201, 112, .18); color: #f5d288; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--photo { background: rgba(234, 156, 204, .18); color: #f0b5d7; }
:root[data-theme="dark"] .diary-event-icon.diary-event-icon--other { background: rgba(184, 174, 218, .18); color: #c8bedf; }
.diary-entry-attachment { position: relative; }
.diary-audio-player { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 9px; width: 100%; }
.diary-audio-player audio { display: none; }
.diary-audio-toggle { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; padding: 0; border: 0; border-radius: 50%; background: var(--primary); color: #fff; box-shadow: none; }
.diary-audio-toggle svg { width: 17px; height: 17px; }
.diary-audio-progress { min-width: 0; }
.diary-audio-progress input[type="range"] { width: 100%; height: 4px; margin: 0; padding: 0; appearance: none; -webkit-appearance: none; border: 0; border-radius: 999px; outline: 0; background: var(--border-strong); accent-color: var(--primary); }
.diary-audio-progress input[type="range"]::-webkit-slider-thumb { width: 12px; height: 12px; appearance: none; -webkit-appearance: none; border: 0; border-radius: 50%; background: var(--primary); }
.diary-audio-progress input[type="range"]::-moz-range-thumb { width: 12px; height: 12px; border: 0; border-radius: 50%; background: var(--primary); }
.diary-audio-progress > div { display: flex; justify-content: space-between; gap: 8px; margin-top: 4px; color: var(--text-muted); font-size: 11px; font-variant-numeric: tabular-nums; line-height: 1; }
.diary-stored-attachment-delete { position: absolute; z-index: 2; top: 6px; right: 6px; width: 30px; height: 30px; display: grid; place-items: center; padding: 0; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); color: var(--danger, #c95858); }
.diary-stored-attachment-delete svg { width: 15px; height: 15px; }
.diary-entry-editor-delete { border-color: rgba(196, 86, 86, .22) !important; background: rgba(196, 86, 86, .1) !important; color: var(--danger, #c95858) !important; }

/* Reminders use the app's compact section rhythm, without a second page title. */
.diary-section-top { display: flex; justify-content: flex-end; margin: 2px 0 30px; }
.diary-reminder-list { margin-top: 0; }
.diary-reminder-list h2 { margin: 0 0 12px; font-size: 17px; line-height: 1.25; }
.diary-reminder-card { min-height: 72px; padding: 14px; }
.diary-reminder-card-actions { align-self: center; }
.diary-reminder-delete { width: 38px; height: 38px; display: grid; place-items: center; padding: 0; border: 1px solid rgba(196, 86, 86, .16); border-radius: 12px; background: rgba(196, 86, 86, .08); color: var(--danger, #c95858); }
.diary-reminder-delete svg { width: 18px; height: 18px; }
.diary-reminder-archive { margin-top: 30px; }
.diary-reminder-archive summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; cursor: pointer; color: var(--text-muted); font-size: 14px; font-weight: 720; list-style: none; }
.diary-reminder-archive summary::-webkit-details-marker { display: none; }
.diary-reminder-archive summary span { display: inline-grid; min-width: 22px; height: 22px; place-items: center; margin-left: auto; border-radius: 999px; background: var(--surface-2); color: var(--text-muted); font-size: 11px; }
.diary-reminder-archive-list { display: grid; gap: 8px; margin-top: 12px; }
.diary-reminder-card.is-archived { opacity: .58; filter: grayscale(.18); }

/* Cloud Archive balance mirrors the compact balance treatment from the AI chat,
   but speaks in storage capacity rather than tokens. */
.diary-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.diary-storage { display: grid; gap: 14px; max-width: 520px; margin: 0 auto; padding: 2px 0 24px; }
.diary-storage-loading { margin: -62px 0 0; color: var(--text-muted); font-size: 13px; text-align: center; }
.diary-storage-hero, .diary-storage-plan { border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface); }
.diary-storage-hero { padding: 18px; }
.diary-storage-label { color: var(--text-muted); font-size: 13px; font-weight: 600; }
.diary-storage-value { margin-top: 4px; color: var(--text); font-size: 27px; font-weight: 750; letter-spacing: -.02em; font-variant-numeric: tabular-nums; line-height: 1.18; }
.diary-storage-subtitle { margin: 6px 0 16px; color: var(--text-muted); font-size: 13px; line-height: 1.4; }
.diary-storage-meter { height: 8px; overflow: hidden; border-radius: 999px; background: var(--surface-2); }
.diary-storage-meter > span { display: block; height: 100%; min-width: 0; border-radius: inherit; background: var(--primary); transition: width .22s ease; }
.diary-storage-meta { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: 9px; color: var(--text-muted); font-size: 12px; }
.diary-storage-meta strong { color: var(--text); font-size: 13px; font-weight: 650; font-variant-numeric: tabular-nums; }
.diary-storage-reserved, .diary-storage-expiry { margin-top: 10px; color: var(--text-muted); font-size: 12px; line-height: 1.35; }
.diary-storage-plans { display: grid; gap: 10px; }
.diary-storage-plan { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 4px 12px; padding: 14px; }
.diary-storage-plan.is-recommended { border-color: color-mix(in srgb, var(--primary) 42%, var(--border)); }
.diary-storage-plan.is-active { background: var(--primary-soft); }
.diary-storage-plan-head { display: flex; align-items: center; gap: 7px; min-width: 0; }
.diary-storage-plan-head strong { color: var(--text); font-size: 15px; font-weight: 700; }
.diary-storage-plan-head span { padding: 3px 7px; border-radius: 999px; background: var(--primary-soft); color: var(--primary); font-size: 10px; font-weight: 700; white-space: nowrap; }
.diary-storage-plan-price { grid-column: 1; color: var(--text); font-size: 15px; font-weight: 700; }
.diary-storage-plan-price small { color: var(--text-muted); font-size: 11px; font-weight: 500; }
.diary-storage-buy { grid-column: 2; grid-row: 1 / span 2; min-height: 38px; padding: 0 12px; border-radius: 11px; font-size: 12px; white-space: nowrap; box-shadow: none !important; }
.diary-storage-buy:disabled { opacity: 1; color: var(--primary); cursor: default; }
.diary-storage-open-plans { width: 100%; min-height: 46px; box-shadow: none !important; }
.diary-storage-sheet { position: fixed; z-index: 210; inset: 0; display: flex; align-items: flex-end; justify-content: center; padding: 18px; background: rgba(20, 16, 45, .46); }
.diary-storage-sheet-card { width: min(100%, 520px); max-height: min(78vh, 680px); overflow: auto; padding: 10px 20px calc(24px + env(safe-area-inset-bottom, 0px)); border: 1px solid var(--border); border-radius: 26px; background: var(--surface); box-shadow: 0 -12px 38px rgba(20, 16, 45, .2); }
.diary-storage-sheet-heading { align-items: flex-start; gap: 12px; margin: 2px 0 16px; }
.diary-storage-sheet-heading .sheet-title { margin: 0; color: var(--text); }
.diary-storage-sheet-heading p { margin: 5px 0 0; color: var(--text-muted); font-size: 14px; font-weight: 400; line-height: 1.5; }

/* Diary actions, records and fields intentionally reuse app primitives. */
.diary-timeline-top,
.diary-section-top { justify-content: flex-end; margin-bottom: 24px; }
.diary-top-add { box-shadow: none !important; }
.diary-top-add > span { font-size: 20px; font-weight: 400; line-height: 1; }

/* Same card structure and typography as Journal; only the supplied SVG differs. */
.diary-timeline-card.journal-item {
  min-height: 0;
  width: 100%;
  padding: 12px 14px;
  border: 0;
  border-radius: var(--r-md);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  text-align: left;
}
.diary-overlay .diary-timeline-card.journal-item { box-shadow: var(--shadow-sm) !important; }
.diary-timeline-card .diary-timeline-line { display: none; }
.diary-timeline-card .diary-event-icon.journal-icon { width: 40px; height: 40px; border-radius: var(--r-sm); font-size: 18px; }
.diary-timeline-card .journal-label { overflow: hidden; font-size: 14px; font-weight: 600; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.diary-timeline-card .journal-subline { margin-top: 2px; font-size: 12px; }
.diary-timeline-card { display: block; cursor: default; }
.diary-timeline-head { display: flex; align-items: flex-start; gap: 10px; width: 100%; }
.diary-timeline-main { min-width: 0; flex: 1 1 auto; padding-top: 1px; }
.diary-timeline-content { display: grid; width: 100%; gap: 10px; margin-top: 10px; }
.diary-timeline-card .journal-note { display: block; width: 100%; margin: 0; }
.diary-timeline-edit { width: 32px; height: 32px; display: grid; place-items: center; flex: 0 0 32px; align-self: flex-start; margin: 0 -4px 0 0; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--primary); }
.diary-timeline-edit:active { background: var(--primary-soft); transform: scale(.94); }
.diary-timeline-edit svg { width: 18px; height: 18px; }
.diary-timeline-media { display: grid; width: 100%; gap: 10px; margin: 0; }
.diary-timeline-photos { display: grid; grid-auto-columns: 100%; grid-auto-flow: column; width: 100%; max-width: 100%; padding: 0; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; }
.diary-timeline-photos::-webkit-scrollbar { display: none; }
.diary-timeline-photo { width: 100%; aspect-ratio: 4 / 3; padding: 0; border: 0; border-radius: var(--r-sm); overflow: hidden; background: var(--surface-2); scroll-snap-align: start; }
.diary-timeline-photo img { display: block; width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }
.diary-timeline-video, .diary-entry-attachment--video { width: 100%; overflow: hidden; border-radius: var(--r-sm); background: #111; }
.diary-timeline-video video, .diary-entry-attachment--video video { display: block; width: 100%; max-height: 360px; object-fit: contain; }
.diary-draft-attachment--video video { display: block; width: 100%; height: 100%; object-fit: cover; }
.diary-timeline-audio { width: 100%; min-width: 0; padding: 10px; border-radius: var(--r-sm); background: var(--surface-2); }
.diary-entry-attachment--audio { position: relative; display: block; min-width: 0; width: 100%; padding: 10px 46px 10px 10px; }
.diary-entry-attachment--audio .diary-audio-progress > div,
.diary-entry-attachment--audio .diary-audio-progress span { color: var(--text-muted); font-size: 11px; line-height: 1; }
.diary-entry-editor-existing .diary-entry-attachment--audio { flex: 0 0 100%; width: 100%; }

/* Do not wrap the date and time fields in a second card. */
.diary-entry-editor .diary-observation-date { border: 0; border-radius: 0; background: transparent; padding: 0; }
.diary-entry-editor-sheet > .diary-event-datetime { margin: 20px 0 0; }
.diary-event-datetime > .field-label { margin-bottom: 10px; }
.diary-event-datetime-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.diary-event-datetime .field-input-wrap { margin: 0; }
.diary-entry-editor .diary-event-datetime-fields .field-input-wrap:not(.lunora-temporal-field),
.diary-entry-editor .diary-event-datetime-fields .field-input {
  min-height: 48px;
  border: 0 !important;
  border-radius: 14px !important;
  background: var(--surface-2) !important;
  box-shadow: none !important;
}
.diary-entry-editor .diary-event-datetime-fields .field-input { width: 100%; padding: 0 14px; }
.diary-field-text textarea.field-input { min-height: 112px; resize: vertical; font: inherit; font-size: 14px; line-height: 1.5; }

/* Reminders are Journal rows without a leading icon. */
.diary-reminder-card.journal-item {
  min-height: 0;
  padding: 12px 14px;
  border: 0;
  border-radius: var(--r-md);
  background: var(--surface);
}
.diary-overlay .diary-reminder-card.journal-item { box-shadow: var(--shadow-sm) !important; }
.diary-reminder-card .journal-label { font-size: 14px; font-weight: 600; line-height: 1.3; }
.diary-reminder-card .journal-subline { margin-top: 2px; font-size: 12px; }
.diary-reminder-card .journal-item-actions { margin-left: auto; }
.diary-reminder-delete.journal-acc-btn { color: var(--danger, #c95858); background: rgba(196, 86, 86, .08); }
.diary-reminder-delete.journal-acc-btn svg { width: 16px; height: 16px; }
.diary-reminder-archive { margin-top: 28px; }
.diary-reminder-archive summary { display: flex; align-items: center; gap: 8px; min-height: 32px; list-style: none; cursor: pointer; color: var(--text-muted); font-size: 14px; font-weight: 600; }
.diary-reminder-archive summary::-webkit-details-marker { display: none; }
.diary-reminder-archive summary::after { content: none; }
.diary-reminder-archive summary .diary-reminder-archive-title { display: inline; min-width: 0; height: auto; margin-left: 0; border-radius: 0; background: transparent; color: var(--text); font-size: 14px; }
.diary-reminder-archive summary .diary-reminder-archive-count { display: inline; min-width: 0; height: auto; margin-left: auto; border-radius: 0; background: transparent; color: var(--text-muted); font-size: 14px; font-variant-numeric: tabular-nums; }
.diary-reminder-archive-chevron { width: 18px; height: 18px; color: var(--text-muted); transition: transform .18s ease; }
.diary-reminder-archive[open] .diary-reminder-archive-chevron { transform: rotate(180deg); }
.diary-reminder-archive-list { display: grid; gap: 8px; margin-top: 10px; }
.diary-reminder-card.is-archived { opacity: .58; filter: grayscale(.18); }

/* A multi-photo entry opens as a small gallery without leaving the Diary. */
.diary-media-lightbox-nav { position: absolute; z-index: 1; top: 50%; width: 38px; height: 38px; display: grid; place-items: center; padding: 0; border: 1px solid var(--border); border-radius: 50%; background: var(--surface); color: var(--text); transform: translateY(-50%); }
.diary-media-lightbox-nav svg { width: 20px; height: 20px; }
.diary-media-lightbox-prev { left: 14px; }
.diary-media-lightbox-next { right: 14px; }
.diary-media-lightbox-count { position: absolute; z-index: 1; bottom: 16px; left: 50%; padding: 5px 8px; border-radius: 999px; background: rgba(20, 18, 40, .62); color: #fff; font-size: 12px; font-weight: 600; line-height: 1; transform: translateX(-50%); }

:root[data-theme="dark"] .diary-entry-editor .diary-preview-field select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f0eff8' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
}

/* Notes are intentionally neutral until history tells us which filters matter. */
.diary-entry-editor .diary-attachment-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 18px; }
.diary-entry-editor .diary-attachment-button { width: 100%; height: 48px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 0 10px; border: 0 !important; border-radius: 14px; font: inherit; font-size: 14px; font-weight: 400; line-height: 1; }
.diary-entry-editor .diary-attachment-button svg { width: 20px; height: 20px; flex: 0 0 auto; }
.diary-entry-editor .diary-attachment-button--voice.is-recording { grid-column: 1 / -1; width: 100%; background: rgba(196, 86, 86, .1); color: var(--danger, #c95858); }
.diary-entry-editor .diary-attachment-button.is-muted { display: none; }
.diary-entry-editor .diary-original-toggle { position: relative; display: flex; align-items: center; gap: 10px; min-height: 46px; margin: 10px 0 0; padding: 10px 12px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface-2); color: var(--text); }
.diary-entry-editor .diary-original-toggle input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.diary-original-toggle-control { position: relative; width: 38px; height: 22px; flex: 0 0 auto; border-radius: 999px; background: var(--border-strong); transition: background .18s ease; }
.diary-original-toggle-control::after { position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: var(--surface); box-shadow: 0 1px 2px rgba(25, 20, 58, .18); content: ''; transition: transform .18s ease; }
.diary-original-toggle input:checked + .diary-original-toggle-control { background: var(--primary); }
.diary-original-toggle input:checked + .diary-original-toggle-control::after { transform: translateX(16px); }
.diary-original-toggle-copy { display: grid; gap: 2px; min-width: 0; }
.diary-original-toggle-copy strong { color: var(--text); font-size: 13px; font-weight: 700; }
.diary-original-toggle-copy small { color: var(--text-muted); font-size: 11px; line-height: 1.35; }
.diary-entry-editor .diary-draft-attachment--audio { min-width: 142px; }
.diary-entry-editor .diary-draft-attachment--audio > span { display: none; }
.diary-timeline-card { padding: 14px !important; }
.diary-timeline-card .diary-timeline-head { gap: 0; }

/* Stable photo slots while nearby media loads; never expose broken-image UI. */
.diary-timeline-photo, .diary-entry-image-button { position: relative; }
[data-diary-stored-image] { opacity: 0; transition: opacity .24s ease; }
[data-diary-stored-image].is-loaded { opacity: 1; }
.diary-photo-placeholder { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--muted); background: var(--surface-2); font-size: 12px; font-weight: 400; pointer-events: none; overflow: hidden; }
.diary-photo-placeholder::after { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 25%, rgba(145,126,209,.09) 50%, transparent 75%); transform: translateX(-100%); animation: diary-photo-shimmer 1.8s ease-in-out infinite; }
.diary-photo-placeholder svg { width: 30px; height: 30px; opacity: .5; }
[data-diary-stored-image].is-loaded + .diary-photo-placeholder { display: none; }
.is-error > .diary-photo-placeholder::after { animation: none; display: none; }
@keyframes diary-photo-shimmer { to { transform: translateX(100%); } }
@media (prefers-reduced-motion: reduce) { .diary-photo-placeholder::after { animation: none; } [data-diary-stored-image] { transition: none; } }