/* Eleven working rooms, each printed on the same manuscript paper as Notes. */
body[data-page="memories"] { --folio-accent: #5f7048; --folio-wash: #e9eddc; --folio-label: 'THE MEMORY ROOM'; }
body[data-page="diary"] { --folio-accent: #58717a; --folio-wash: #e4ecea; --folio-label: 'PAGES FROM HIS DAY'; }
body[data-page="dream"] { --folio-accent: #795066; --folio-wash: #eee1e7; --folio-label: 'THE QUIET HOURS'; }
body[data-page="mailbox"] { --folio-accent: #99613c; --folio-wash: #f3e3d0; --folio-label: 'LETTERS KEPT CLOSE'; }
body[data-page="moments"] { --folio-accent: #65734d; --folio-wash: #e8ecd9; --folio-label: 'A CHRONICLE OF US'; }
body[data-page="heart"] { --folio-accent: #8d4d49; --folio-wash: #f0e0da; --folio-label: 'THE LIVING MEASURE'; }
body[data-page="settings"] { --folio-accent: #98713e; --folio-wash: #f2e9d7; --folio-label: 'MAKE THIS HOME YOURS'; }
body[data-page="bookshelf"] { --folio-accent: #6b7046; --folio-wash: #e9e9d8; --folio-label: 'SHELVES & STORIES'; }
body[data-page="cove"] { --folio-accent: #56747b; --folio-wash: #e2ebea; --folio-label: 'A LITTLE CINEMA FOR TWO'; }
body[data-page="rhythm"] { --folio-accent: #8c6850; --folio-wash: #f1e7d8; --folio-label: 'HIS OWN HOURS'; }
body[data-page="cycle"] { --folio-accent: #975a62; --folio-wash: #f2e4df; --folio-label: 'THE DAYS WE KEEP'; }

html body[data-page] .app-shell {
  background: radial-gradient(ellipse 78% 390px at 50% 2%, #fff9eb, transparent 100%),
    linear-gradient(122deg, #ead9bb 0%, #f4e9d3 48%, #e9d8bb 100%);
}
html body[data-page] .app-shell::before,
html body[data-page] .app-shell::after { display: none; }
html body[data-page] .app-shell .main-content { min-width: 0; padding: clamp(22px, 4vw, 58px) 14px 72px; }
html body[data-page] .app-shell .page-container {
  position: relative;
  isolation: isolate;
  max-width: 870px;
  min-width: 0;
  margin-inline: auto;
  padding: clamp(25px, 4.5vw, 52px);
  border: 1px solid #ccb28a;
  border-radius: 8px 28px 8px 28px;
  background: linear-gradient(145deg, #fffdf7, #fbf4e5 82%);
  box-shadow: 0 24px 65px rgba(92,62,29,.14), inset 0 0 0 6px rgba(255,255,255,.38);
}
html body[data-page] .app-shell .page-container::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 12px;
  border: 1px solid rgba(167,124,66,.28);
  border-radius: 3px 20px 3px 20px;
  pointer-events: none;
}
html body[data-page] .app-shell .page-container > .page-header:first-child {
  margin: 0 0 clamp(25px, 3vw, 37px);
  padding: 0 0 23px;
  border-bottom: 1px solid #dcc6a3;
  text-align: center;
}
html body[data-page] .app-shell .page-container > .page-header:first-child::before {
  content: var(--folio-label);
  display: block;
  margin-bottom: 8px;
  color: var(--folio-accent);
  font: 700 10px/1.4 var(--font-display);
  letter-spacing: .19em;
}
html body[data-page] .app-shell .page-container > .page-header:first-child .page-title {
  justify-content: center;
  margin: 0 0 6px;
  color: #4d3828;
  font-size: clamp(2rem, 1.5rem + 2vw, 3rem);
}
html body[data-page] .app-shell .page-container > .page-header:first-child .page-title img { width: 60px; height: 60px; }
html body[data-page] .app-shell .page-container > .page-header:first-child .page-intro {
  max-width: 61ch;
  margin: 0 auto;
  color: #695745;
  font: 400 clamp(14px, 1.2vw, 16px)/1.75 var(--font-display);
  text-wrap: pretty;
}
html body[data-page] .app-shell .page-container :is(.diary-card,.dream-card,.mail-card,.moment-item,.memory-card,.rhythm-entry,.cove-card,.settings-card,.heart-card,.vital-card,.chord-card,.hr-curve-wrap,.cycle-card) {
  border: 1px solid #d5c09e;
  border-radius: 6px 20px 6px 20px;
  background: linear-gradient(145deg, #fffdf8, #faf1df);
  background-image: linear-gradient(145deg, #fffdf8, #faf1df);
  box-shadow: 0 8px 20px rgba(91,61,28,.075), inset 0 0 0 4px rgba(255,255,255,.35);
}
html body[data-page] .app-shell .page-container :is(.diary-card,.dream-card,.mail-card,.moment-item,.memory-card,.rhythm-entry,.cove-card,.settings-card,.heart-card,.vital-card,.chord-card,.hr-curve-wrap,.cycle-card)::after { content: none; }
html body[data-page] .app-shell .page-container :is(.diary-card,.dream-card,.memory-card,.rhythm-entry,.cove-card,.settings-card,.cycle-card) { border-top: 3px solid var(--folio-accent); }
html body[data-page] .app-shell .page-container :is(.btn-primary,.empty-state-action) { background: var(--folio-accent); color: #fffaf1; border-radius: 5px; box-shadow: 0 5px 12px rgba(92,62,29,.12); }
html body[data-page] .app-shell .page-container :is(.btn-secondary,.tab-btn) { border: 1px solid #d2ba94; background: #fbf3e3; color: #614a34; border-radius: 5px; }
html body[data-page] .app-shell .page-container :is(input,textarea,select):not([type="checkbox"]):not([type="radio"]):not([type="hidden"]) { border: 1px solid #cdb590; border-radius: 5px; background: #fffaf0; color: #4c3829; }
html body[data-page] .app-shell .page-container :is(input,textarea,select):focus-visible { outline: 2px solid var(--folio-accent); outline-offset: 2px; }
html body[data-page] .app-shell .loading-line { color: #745c42; }
html body[data-page] .app-shell .footer { border-top: 1px solid rgba(153,113,64,.2); }
html body[data-page] .app-shell .folio-section-title,
html body[data-page] .app-shell .folio-card-label { margin: 22px 0 14px; padding-bottom: 10px; border-bottom: 1px solid #d7c19e; color: #654831; font: 500 clamp(19px, 2.5vw, 25px)/1.3 var(--font-display); }
html body[data-page] .app-shell .folio-card-label { margin: 0 0 18px; font-size: 20px; }
html body[data-page] .app-shell .folio-help { margin: 18px 0 25px; padding: 15px 18px; border: 1px solid #d7c3a1; border-radius: 5px 16px 5px 16px; background: #fbf3e4; color: #66523c; font: 14px/1.75 var(--font-display); }
html body[data-page] .app-shell .folio-help summary { cursor: pointer; color: var(--folio-accent); font-weight: 700; }
html body[data-page] .app-shell .folio-help p { margin: 10px 0 0; }

/* Memory index */
body[data-page="memories"] .search-container { max-width: 540px; margin: 17px auto 0; }
body[data-page="memories"] .search-container input { min-height: 51px; padding-inline: 18px; box-shadow: inset 3px 0 var(--folio-accent); }
body[data-page="memories"] .memories-state { min-height: 370px; }
body[data-page="memories"] .memories-loading { position: relative; max-width: 650px; margin-inline: auto; padding: 28px; border: 1px solid #d8c5a4; border-radius: 5px 18px 5px 18px; background: #fbf4e5; }
body[data-page="memories"] .memory-skeleton { background: #eee4ce; }
body[data-page="memories"] .memory-card { padding: 23px; margin-bottom: 14px; }
body[data-page="memories"] .memories-error[hidden] { display: none !important; }
body[data-page="memories"] .empty-state { min-height: 360px; border: 1px solid #d8c5a4; border-radius: 5px 18px 5px 18px; background: #fbf4e5; }
body[data-page="memories"] .empty-state-icon { background: url('../icons/nav/memories-cutout-v2.webp') center/contain no-repeat; width: 94px; height: 94px; margin: 0 auto 12px; font-size: 0; }

/* Diary pages, with a dated margin and soft ruled interior. */
body[data-page="diary"] .diary-card { position: relative; min-height: 142px; padding: 28px 30px 28px 38px; }
body[data-page="diary"] .diary-card::before { content: ''; position: absolute; left: 22px; top: 22px; bottom: 22px; border-left: 2px solid #d9b58c; }
body[data-page="diary"] .diary-card-date { color: var(--folio-accent); font-size: 21px; }
body[data-page="diary"] .diary-card-body { font-family: var(--font-display); line-height: 1.9; }
body[data-page="diary"] .diary-history-title { padding-bottom: 12px; border-bottom: 1px solid #d7c5a8; font-size: 24px; }
body[data-page="diary"] .diary-empty-history { min-height: 150px; display: grid; place-items: center; border: 1px dashed #c9b291; border-radius: 5px 16px 5px 16px; background: #f8f0df; font: italic 16px var(--font-display); text-align: center; }

/* Dreams: moonlit paper rather than an unstructured status screen. */
body[data-page="dream"] #dream-status { min-height: 135px; padding: 27px; background: radial-gradient(circle at 90% 12%, #f4e4e7, transparent 45%), #fffaf0; }
body[data-page="dream"] .dream-actions { padding: 13px; border: 1px solid #d7bdba; border-radius: 5px 15px 5px 15px; background: #f7ece9; }
body[data-page="dream"] .dream-actions .btn { min-height: 42px; }
body[data-page="dream"] .dream-card { padding: 25px; }
body[data-page="dream"] .dream-log { min-height: 160px; border: 1px solid #ddc8c4; border-radius: 3px; background: repeating-linear-gradient(transparent 0 27px, rgba(121,80,102,.11) 28px), #fffaf0; color: #594b46; font-family: var(--font-display); font-size: 14px; }

/* Letters and the feed read like a correspondence archive. */
body[data-page="mailbox"] .mailbox-actions { justify-content: center; gap: 11px; margin-bottom: 23px; padding: 18px; border: 1px solid #dec4a1; border-radius: 5px 16px 5px 16px; background: #f8edda; }
body[data-page="mailbox"] .mailbox-actions .btn { min-height: 45px; padding-inline: 18px; }
body[data-page="mailbox"] #mail-list:has(.loading-line),
body[data-page="moments"] .timeline:has(.loading-line),
body[data-page="rhythm"] .rhythm-timeline:has(.loading-line) { display: grid; place-content: center; justify-items: center; gap: 12px; min-height: 265px; padding: 30px; border: 1px dashed #cdb895; border-radius: 6px 20px 6px 20px; background: #fbf3e4; text-align: center; }
body[data-page="mailbox"] #mail-list:has(.loading-line)::before,
body[data-page="moments"] .timeline:has(.loading-line)::before,
body[data-page="rhythm"] .rhythm-timeline:has(.loading-line)::before { content: ''; width: 90px; height: 90px; background: var(--page-mark) center/contain no-repeat; }
body[data-page="mailbox"] .mail-card { position: relative; padding: 22px 25px; border-left: 4px solid var(--folio-accent) !important; }
body[data-page="mailbox"] .mail-card.open { background: #fff8e9; }
body[data-page="mailbox"] .mail-card-body { padding-top: 14px; border-top: 1px solid #dfc7a6; font-family: var(--font-display); line-height: 1.85; }
body[data-page="mailbox"] .mail-empty,
body[data-page="moments"] .moment-empty,
body[data-page="rhythm"] .rhythm-empty { min-height: 240px; display: grid; place-content: center; justify-items: center; padding: 28px; border: 1px dashed #cdb895; border-radius: 5px 18px 5px 18px; background: #fbf3e4; color: #6c5640; font: italic 16px/1.6 var(--font-display); text-align: center; }
body[data-page="mailbox"] .mail-empty::before,
body[data-page="moments"] .moment-empty::before,
body[data-page="rhythm"] .rhythm-empty::before { content: ''; width: 95px; height: 95px; margin-bottom: 8px; background: var(--page-mark) center/contain no-repeat; }
body[data-page="moments"] .timeline { min-height: 200px; }
body[data-page="moments"] .timeline::before { background: #b6a57f; }
body[data-page="moments"] .moment-item { padding: 21px 24px; }
body[data-page="moments"] .moment-title { color: #4e4534; }
body[data-page="rhythm"] .rhythm-entry { padding: 21px 24px; border-left-width: 4px !important; }
body[data-page="rhythm"] .rhythm-reason { font-family: var(--font-display); font-size: 16px; }

/* The library sits on a warm wooden shelf while keeping the book controls intact. */
body[data-page="bookshelf"] .page-container { max-width: 920px !important; }
body[data-page="bookshelf"] .page-container > .page-header:not(:first-child) { margin: 35px 0 18px !important; padding-bottom: 15px; border-bottom: 1px solid #d7c19d; }
body[data-page="bookshelf"] .page-container > .page-header:not(:first-child) .page-title { color: #4c3828; font-size: 25px; }
body[data-page="bookshelf"] .bookshelf-wrap { min-height: 220px; padding: 27px 22px 15px; border: 1px solid #ad8250; border-radius: 5px 18px 5px 18px; background: linear-gradient(180deg, transparent calc(100% - 27px), #8f5e37 calc(100% - 26px), #b78551 calc(100% - 11px), #7b4d2b 100%), linear-gradient(125deg, #f5e7cc, #e8d5b5); box-shadow: 0 10px 22px rgba(87,57,28,.15), inset 0 0 0 5px rgba(255,252,238,.23); }
body[data-page="bookshelf"] .bookshelf { min-height: 155px; }
body[data-page="bookshelf"] .book-add { border-color: #a27349; background: rgba(255,250,231,.5); color: #81512f; }
body[data-page="bookshelf"] .empty-shelf { margin-top: 9px; border: 1px dashed #cbb18b; border-radius: 4px; background: #f9f1df; }

/* Cove keeps media controls prominent in a theatre-like viewing room. */
body[data-page="cove"] .cove-card { padding: 24px; margin-bottom: 17px; }
body[data-page="cove"] .page-header + .cove-card { background: linear-gradient(130deg, #e8eeea, #fbf8eb); }
body[data-page="cove"] .form-row-inline { gap: 10px; }
body[data-page="cove"] .form-input { min-height: 46px; padding-inline: 14px; }
body[data-page="cove"] .video-list { min-height: 110px; }
body[data-page="cove"] .video-list:has(.loading-line) { display: grid; place-content: center; justify-items: center; }
body[data-page="cove"] .video-list:has(.loading-line)::before { content: ''; width: 75px; height: 75px; background: var(--page-mark) center/contain no-repeat; }
body[data-page="cove"] .cove-empty { min-height: 190px; display: grid; place-content: center; justify-items: center; padding: 25px; border: 1px dashed #cdb895; border-radius: 5px 17px 5px 17px; background: #f8f2e6; color: #6c5845; font: italic 16px/1.6 var(--font-display); text-align: center; }
body[data-page="cove"] .cove-empty::before { content: ''; display: block; width: 92px; height: 92px; margin: 0 auto 8px; background: var(--page-mark) center/contain no-repeat; }
body[data-page="cove"] .video-item { border-bottom: 1px solid #dfceb2; border-radius: 2px; padding: 12px; }
body[data-page="cove"] .player-wrap { border: 7px solid #5c4d40; border-radius: 5px; background: #27231f; box-shadow: 0 9px 22px rgba(31,27,24,.2); }
body[data-page="cove"] .player-empty { color: #f0dec1; }

/* Heart: an observation journal with measured, legible figures. */
body[data-page="heart"] .heart-card { margin-bottom: 18px; padding: 30px 20px; border-top: 3px solid var(--folio-accent) !important; background: radial-gradient(circle at 50% 42%, #f7e8e3, transparent 49%), #fffaf1; }
body[data-page="heart"] .heart-icon { filter: drop-shadow(0 9px 12px rgba(118,68,59,.15)); }
body[data-page="heart"] .heart-icon img { object-fit: contain; }
body[data-page="heart"] .hr-value { font-family: var(--font-display); color: var(--folio-accent); }
body[data-page="heart"] .vitals-grid { gap: 12px; margin-bottom: 17px; }
body[data-page="heart"] .vital-card { min-width: 0; padding: 15px 9px; }
body[data-page="heart"] .vital-value { font-family: var(--font-display); }
body[data-page="heart"] .chord-card { gap: 15px; }
body[data-page="heart"] .hr-curve-wrap { min-height: 120px; padding: 16px; }
body[data-page="heart"] .senses-section,
body[data-page="heart"] .desires-section { padding: 17px 20px; border: 1px solid #d5c09e; border-radius: 5px 16px 5px 16px; background: #fbf3e4; }

/* Settings: tidy chapter tabs and related field groups. */
body[data-page="settings"] .settings-tabs { padding: 5px; border: 1px solid #d4b990; border-radius: 5px 16px 5px 16px; background: #f5e7ce; }
html body[data-page="settings"] .app-shell .main { padding: clamp(22px, 4vw, 58px) 14px 72px; }
html body[data-page="settings"] .app-shell { grid-template-columns: minmax(0, 1fr); }
html body[data-page="settings"] .app-shell .main { min-width: 0; }
html body[data-page="settings"] .settings-container { position: relative; isolation: isolate; width: min(100%, 870px); max-width: 870px; margin: 0 auto; padding: clamp(25px, 4.5vw, 52px); border: 1px solid #ccb28a; border-radius: 8px 28px 8px 28px; background: linear-gradient(145deg, #fffdf7, #fbf4e5 82%); box-shadow: 0 24px 65px rgba(92,62,29,.14), inset 0 0 0 6px rgba(255,255,255,.38); }
html body[data-page="settings"] .settings-container::before { content: ''; position: absolute; z-index: -1; inset: 12px; border: 1px solid rgba(167,124,66,.28); border-radius: 3px 20px 3px 20px; pointer-events: none; }
html body[data-page="settings"] .settings-container > .page-title { display: flex; align-items: center; justify-content: center; gap: 13px; margin: 0; color: #4d3828; font-size: clamp(2rem, 1.5rem + 2vw, 3rem); text-align: center; }
html body[data-page="settings"] .settings-container > .page-title::before { content: 'MAKE THIS HOME YOURS'; display: block; position: absolute; top: clamp(14px, 2.5vw, 28px); left: 0; width: 100%; color: #98713e; font: 700 10px/1.4 var(--font-display); letter-spacing: .19em; }
html body[data-page="settings"] .settings-container > .page-title img { width: 60px; height: 60px; object-fit: contain; }
html body[data-page="settings"] .settings-intro { max-width: 55ch; margin: 8px auto 24px; padding-bottom: 22px; border-bottom: 1px solid #dcc6a3; color: #695745; font: 15px/1.75 var(--font-display); text-align: center; }
html body[data-page="settings"] .settings-tabs { margin-bottom: 23px; }
html body[data-page="settings"] .settings-card { border: 1px solid #d5c09e; border-radius: 6px 20px 6px 20px; background: #fffaf0; box-shadow: 0 8px 20px rgba(91,61,28,.075); }
html body[data-page="settings"] .settings-card-body { background: #fffaf0; }
html body[data-page="settings"] .settings-input,
html body[data-page="settings"] .settings-select { border: 1px solid #cdb590; border-radius: 5px; background: #fffdf8; color: #4c3829; }
html body[data-page="settings"] .settings-card .btn { border-radius: 5px; }
body[data-page="settings"] .settings-tabs .tab-btn { border: 0 !important; background: transparent !important; }
body[data-page="settings"] .settings-tabs .tab-btn.active { background: #fffaf0 !important; color: #704c2e; box-shadow: 0 2px 7px rgba(84,54,24,.1); }
body[data-page="settings"] .settings-card { overflow: hidden; margin-bottom: 17px; }
body[data-page="settings"] .settings-card-header { padding-block: 19px; background: var(--folio-wash); background-image: none; border-bottom: 1px solid #d7c09c; }
body[data-page="settings"] .settings-card-title { font-family: var(--font-display); color: #4f3827; }
body[data-page="settings"] .settings-card-body { padding: 25px; }
body[data-page="settings"] .settings-card-footer { border-top: 1px solid #e0cda9; background: #f8edd9; }

/* Cycle uses the same sheet and clearer date/form hierarchy. */
body[data-page="cycle"] .page-container { max-width: 1000px !important; }
body[data-page="cycle"] .cycle-hero { min-height: 235px; border-color: #cba69f; border-radius: 5px 20px 5px 20px; background: radial-gradient(circle at 82% 33%, #fff8e8, transparent 42%), linear-gradient(115deg, #f2e1dc, #fbf2e4); box-shadow: 0 8px 20px rgba(91,61,28,.08), inset 0 0 0 5px rgba(255,255,255,.34); }
body[data-page="cycle"] .cycle-hero::after { border-radius: 2px 14px 2px 14px; }
body[data-page="cycle"] .cycle-card { background-image: none !important; border-radius: 5px 20px 5px 20px; }
body[data-page="cycle"] .cycle-feature-date { border-radius: 4px 15px 4px 15px; }
body[data-page="cycle"] .cycle-metric { border: 1px solid #d5c09e; border-radius: 4px 12px 4px 12px; background: #fbf3e4; }
body[data-page="cycle"] .cycle-empty { border-radius: 4px 15px 4px 15px; background: #fbf2e5; }
body[data-page="cycle"] .cycle-status-panel:has(.loading-line) #status-card { min-height: 250px; display: grid; place-content: center; justify-items: center; gap: 10px; }
body[data-page="cycle"] .cycle-status-panel:has(.loading-line) #status-card::before { content: ''; display: block; width: 98px; height: 98px; margin: 0 auto; background: var(--page-mark) center/contain no-repeat; }
body[data-page="cycle"] .cycle-form-panel .form-input { border-radius: 5px; }

html[data-theme="dark"] body[data-page] .app-shell { background: radial-gradient(ellipse 78% 440px at 50% 2%, #51412f, transparent 100%), linear-gradient(122deg, #302820, #3d3227 50%, #2c251f); }
html[data-theme="dark"] body[data-page] .app-shell .page-container { border-color: #806243; background: linear-gradient(145deg, #42372b, #332c25 82%); box-shadow: 0 24px 65px rgba(0,0,0,.28), inset 0 0 0 6px rgba(234,191,132,.025); }
html[data-theme="dark"] body[data-page] .app-shell .page-container::before { border-color: rgba(215,170,103,.22); }
html[data-theme="dark"] body[data-page] .app-shell .page-container > .page-header:first-child { border-bottom-color: #786047; }
html[data-theme="dark"] body[data-page] .app-shell .page-container > .page-header:first-child::before { color: #e1bb81; }
html[data-theme="dark"] body[data-page] .app-shell .page-container > .page-header:first-child .page-title { color: #fff0d7; }
html[data-theme="dark"] body[data-page] .app-shell .page-container > .page-header:first-child .page-intro { color: #dec8a8; }
html[data-theme="dark"] body[data-page] .app-shell .page-container :is(.diary-card,.dream-card,.mail-card,.moment-item,.memory-card,.rhythm-entry,.cove-card,.settings-card,.heart-card,.vital-card,.chord-card,.hr-curve-wrap,.cycle-card) { border-color: #816747; background: linear-gradient(145deg, #4a3c2e, #3b3128); background-image: linear-gradient(145deg, #4a3c2e, #3b3128); box-shadow: 0 8px 20px rgba(0,0,0,.15), inset 0 0 0 4px rgba(238,194,126,.025); }
html[data-theme="dark"] body[data-page] .app-shell .page-container :is(.diary-card,.dream-card,.memory-card,.rhythm-entry,.cove-card,.settings-card,.cycle-card) { border-top-color: #c49a6b; }
html[data-theme="dark"] body[data-page] .app-shell .page-container :is(.btn-primary,.empty-state-action) { background: #b27b52; color: #fff7e7; }
html[data-theme="dark"] body[data-page] .app-shell .page-container :is(.btn-secondary,.tab-btn) { border-color: #876a47; background: #51402f; color: #f2dfc2; }
html[data-theme="dark"] body[data-page] .app-shell .page-container :is(input,textarea,select):not([type="checkbox"]):not([type="radio"]):not([type="hidden"]) { border-color: #8e704d; background: #322a23; color: #f3e4cb; }
html[data-theme="dark"] body[data-page] .app-shell .loading-line { color: #ddc7a6; }
html[data-theme="dark"] body[data-page] .app-shell :is(.folio-section-title,.folio-card-label) { border-bottom-color: #795e40; color: #efd9b6; }
html[data-theme="dark"] body[data-page] .app-shell .folio-help { border-color: #826749; background: #42362a; color: #e2cfb0; }
html[data-theme="dark"] body[data-page] .app-shell .folio-help summary { color: #e3b887; }
html[data-theme="dark"] body[data-page="memories"] :is(.memories-loading,.empty-state),
html[data-theme="dark"] body[data-page="diary"] .diary-empty-history,
html[data-theme="dark"] body[data-page="mailbox"] :is(#mail-list:has(.loading-line),.mail-empty),
html[data-theme="dark"] body[data-page="moments"] :is(.timeline:has(.loading-line),.moment-empty),
html[data-theme="dark"] body[data-page="rhythm"] :is(.rhythm-timeline:has(.loading-line),.rhythm-empty) { border-color: #866a49; background: #43372a; color: #e7d1b1; }
html[data-theme="dark"] body[data-page="memories"] .memory-skeleton { background: #5c4a37; }
html[data-theme="dark"] body[data-page="dream"] #dream-status { background: radial-gradient(circle at 90% 12%, #63464e, transparent 45%), #43352e; }
html[data-theme="dark"] body[data-page="dream"] .dream-actions { border-color: #806455; background: #4b3836; }
html[data-theme="dark"] body[data-page="dream"] .dream-log { border-color: #8b6c60; background: repeating-linear-gradient(transparent 0 27px, rgba(238,187,161,.1) 28px), #322a27; color: #e7d4c7; }
html[data-theme="dark"] body[data-page="mailbox"] .mailbox-actions { border-color: #806246; background: #49382c; }
html[data-theme="dark"] body[data-page="mailbox"] .mail-card.open { background: #49392c; }
html[data-theme="dark"] body[data-page="mailbox"] .mail-card-body { border-top-color: #806246; }
html[data-theme="dark"] body[data-page="bookshelf"] .bookshelf-wrap { border-color: #a1774f; background: linear-gradient(180deg, transparent calc(100% - 27px), #5e3b27 calc(100% - 26px), #815333 calc(100% - 11px), #4d2e20 100%), linear-gradient(125deg, #554331, #413327); }
html[data-theme="dark"] body[data-page="bookshelf"] .book-add { background: rgba(34,28,22,.4); color: #e7ba85; }
html[data-theme="dark"] body[data-page="bookshelf"] .page-container > .page-header:not(:first-child) { border-color: #775b40; }
html[data-theme="dark"] body[data-page="bookshelf"] .page-container > .page-header:not(:first-child) .page-title { color: #f3e2c7; }
html[data-theme="dark"] body[data-page="cove"] .page-header + .cove-card { background: linear-gradient(130deg, #354344, #45392d); }
html[data-theme="dark"] body[data-page="cove"] .cove-empty { border-color: #806d51; background: #3d3429; color: #dfccae; }
html[data-theme="dark"] body[data-page="heart"] .heart-card { background: radial-gradient(circle at 50% 42%, #5d3e3c, transparent 50%), #43352d; }
html[data-theme="dark"] body[data-page="heart"] .hr-value { color: #e6b5a7; }
html[data-theme="dark"] body[data-page="heart"] :is(.senses-section,.desires-section) { border-color: #806747; background: #41362b; }
html[data-theme="dark"] body[data-page="settings"] .settings-tabs { border-color: #876a49; background: #493a2b; }
html[data-theme="dark"] body[data-page="settings"] .settings-container { border-color: #806243; background: linear-gradient(145deg, #42372b, #332c25 82%); box-shadow: 0 24px 65px rgba(0,0,0,.28); }
html[data-theme="dark"] body[data-page="settings"] .settings-container::before { border-color: rgba(215,170,103,.22); }
html[data-theme="dark"] body[data-page="settings"] .settings-container > .page-title { color: #fff0d7; }
html[data-theme="dark"] body[data-page="settings"] .settings-container > .page-title::before { color: #e1bb81; }
html[data-theme="dark"] body[data-page="settings"] .settings-intro { border-bottom-color: #786047; color: #dec8a8; }
html[data-theme="dark"] body[data-page="settings"] .settings-card { border-color: #816747; background: #43372a; box-shadow: 0 8px 20px rgba(0,0,0,.15); }
html[data-theme="dark"] body[data-page="settings"] .settings-card-body { background: #3c3229; }
html[data-theme="dark"] body[data-page="settings"] :is(.settings-input,.settings-select) { border-color: #8e704d; background: #322a23; color: #f3e4cb; }
html[data-theme="dark"] body[data-page="settings"] .app-shell .settings-container :is(input,select,textarea):not([type="checkbox"]):not([type="radio"]):not([type="hidden"]) { background-color: #322a23; border-color: #8e704d; color: #f3e4cb; }
html[data-theme="dark"] body[data-page="settings"] .settings-card .btn-primary,
html[data-theme="dark"] body[data-page="settings"] .settings-card .btn-danger { color: #fff7e7; }
html[data-theme="dark"] body[data-page="settings"] .settings-tabs .tab-btn.active { background: #665039 !important; color: #fff0d8; }
html[data-theme="dark"] body[data-page="settings"] .settings-card-header { border-color: #806747; background: #514331; }
html[data-theme="dark"] body[data-page="settings"] .settings-card-title { color: #f3e3ca; }
html[data-theme="dark"] body[data-page="settings"] .settings-card-footer { border-color: #806747; background: #49392b; }
html[data-theme="dark"] body[data-page="cycle"] .cycle-hero { border-color: #8a6c60; background: radial-gradient(circle at 82% 33%, #654946, transparent 42%), linear-gradient(115deg, #503b3a, #40352d); }
html[data-theme="dark"] body[data-page="cycle"] .cycle-hero { box-shadow: 0 9px 20px rgba(0,0,0,.18), inset 0 0 0 5px rgba(229,181,121,.04); }
html[data-theme="dark"] body[data-page="cycle"] :is(.cycle-metric,.cycle-empty) { border-color: #876b50; background: #44372d; }

@media (max-width: 767px) {
  html body[data-page] .app-shell .main-content { padding: 18px 10px 48px; }
  html body[data-page] .app-shell .page-container { padding: 23px 18px 30px; }
  html body[data-page] .app-shell .page-container::before { inset: 7px; }
  html body[data-page] .app-shell .page-container > .page-header:first-child .page-title img { width: 53px; height: 53px; }
  body[data-page="diary"] .diary-card { padding: 24px 19px 24px 28px; }
  body[data-page="diary"] .diary-card::before { left: 15px; }
  body[data-page="heart"] .vital-card { padding: 12px 5px; }
  body[data-page="cycle"] .cycle-hero { min-height: 310px; }
  body[data-page="cycle"] .cycle-card { padding: 22px 20px; }
  html body[data-page="settings"] .app-shell .main { padding: 18px 10px 48px; }
  html body[data-page="settings"] .settings-container { padding: 42px 18px 28px; }
  html body[data-page="settings"] .settings-container::before { inset: 7px; }
  html body[data-page="settings"] .settings-container > .page-title img { width: 53px; height: 53px; }
  html body[data-page="settings"] .settings-tabs { flex-wrap: wrap; overflow: visible; }
  html body[data-page="settings"] .settings-tabs .tab-btn { flex: 1 1 calc(50% - 6px); }
  html body[data-page="settings"] .settings-tabs .tab-btn:last-child { flex-basis: 100%; }
}
@media (max-width: 360px) {
  html body[data-page] .app-shell .page-container { padding-inline: 14px; }
  body[data-page="cove"] .form-row-inline { flex-wrap: wrap; }
  body[data-page="cove"] .form-row-inline .form-input { min-width: 100%; }
}
@media (min-width: 768px) and (max-width: 1199px) {
  body[data-page] .header-nav { display: none; }
}