/* Switch Log / Moonfall — 月光と降り注ぐ雪
   Presentation-only layer, intended to load AFTER snow-world.css and moon-snow.css.
   Never changes JS, auth, storage, memo visibility, viewport, layout widths or form font-size.
*/
:root {
  --mf-ink:#243e57;
  --mf-ink-soft:#4d6982;
  --mf-silver:#e3f0fa;
  --mf-ice:#e7f6ff;
  --mf-line:#cbdfee;
  --mf-primary:#246d9a;
  --mf-sky:#c6dffa;
  color-scheme:light;
}
html { background-color:#edf6ff !important; }
body {
  background-color:#edf6ff !important;
  background-image:
    url('/moonfall-sky.svg'),
    radial-gradient(ellipse 75% 40% at 92% 3%, rgba(193,210,247,.50), transparent 86%),
    radial-gradient(ellipse 56% 40% at 0% 67%, rgba(199,228,250,.37), transparent 90%),
    linear-gradient(165deg,#f9fdff 0%,#edf6ff 46%,#e8f2fc 100%) !important;
  background-position:center top,center top,center center,center center !important;
  background-size:780px 1180px,cover,cover,cover !important;
  background-repeat:repeat-y,no-repeat,no-repeat,no-repeat !important;
  color:var(--mf-ink) !important;
}
/* Two feather-light snowfall layers live BEHIND all content and cannot intercept taps.
   Animation is enabled only while the home page is displayed, and only if motion is allowed.
   No JS, no layout reflow, no backdrop-filter or large images. */
.cloud-app { position:relative; isolation:isolate; }
.cloud-app::before,.cloud-app::after {
  content:"";
  position:fixed;
  left:0;right:0;bottom:0;
  z-index:-1;
  pointer-events:none;
  background-repeat:repeat;
  background-position:center top;
  transform:translate3d(0,0,0);
}
.cloud-app::before {
  top:-560px;
  background-image:url('/moonfall-snow-near.svg');
  background-size:420px 560px;
  opacity:.42;
}
.cloud-app::after {
  top:-700px;
  background-image:url('/moonfall-snow-far.svg');
  background-size:480px 700px;
  opacity:.34;
}
@keyframes mf-snow-near { to { transform:translate3d(0,560px,0); } }
@keyframes mf-snow-far { to { transform:translate3d(0,700px,0); } }
@supports selector(:has(*)) {
  @media (prefers-reduced-motion:no-preference) {
    .cloud-app:has(.timeline-home-top-action)::before { animation:mf-snow-near 39s linear infinite; }
    .cloud-app:has(.timeline-home-top-action)::after { animation:mf-snow-far 59s linear infinite; }
  }
}
@media (prefers-reduced-motion:reduce) {
  .cloud-app::before,.cloud-app::after { animation:none !important; transform:none !important; }
}
@media (prefers-reduced-transparency:reduce) {
  .cloud-tabs { background:#fff !important; }
  .cloud-header,.cloud-card,.memo-item { background-color:#fff !important; }
}
/* A large snow-white crescent and star clusters sit in the right side of the header.
   The left area remains clear for the title and status text. */
.cloud-header {
  overflow:hidden;
  background-image:
    url('/moonfall-header.svg'),
    linear-gradient(126deg,rgba(255,255,255,.99) 3%,rgba(242,249,255,.98) 49%,rgba(215,231,251,.91) 100%) !important;
  background-size:min(82vw,380px) auto,cover !important;
  background-position:right -10px top -10px,center !important;
  background-repeat:no-repeat,no-repeat !important;
  border:1px solid #c9ddec !important;
  border-radius:24px !important;
  box-shadow:0 12px 31px rgba(59,101,155,.12),inset 0 1px 0 rgba(255,255,255,.95) !important;
}
.cloud-header h1 {
  color:#243d60 !important;
  letter-spacing:.015em;
  text-shadow:0 1px 0 rgba(255,255,255,.70);
}
.cloud-brand { color:#4e80af !important; letter-spacing:.29em !important; }
.cloud-header .muted { color:#4c6982 !important; }
/* Frosted reading surfaces, with unobtrusive moonlight in the top-right corner. */
.cloud-card,
.timeline-ui .timeline-hero,
.timeline-ui .timeline-form-card,
.timeline-ui .timeline-entry-card {
  border:1px solid #d0e3f0 !important;
  background:
    radial-gradient(ellipse 120px 90px at 100% 0%,rgba(222,234,255,.33),transparent 96%),
    linear-gradient(152deg,rgba(255,255,255,.99),rgba(250,253,255,.98)) !important;
  border-radius:22px !important;
  box-shadow:0 9px 26px rgba(61,109,154,.09),inset 0 1px 0 rgba(255,255,255,.95) !important;
  color:var(--mf-ink) !important;
}
.cloud-app :is(.cloud-card h2,.cloud-card h3),
.timeline-ui :is(h2,h3,.timeline-hero-name,.timeline-entry-name),
.switch-person-heading h2 { color:#294763 !important; }
.cloud-card .muted,.timeline-ui .muted { color:#536e85 !important; }
/* Primary and secondary controls keep tactile contrast, focus ring and danger semantics. */
.cloud-app .cloud-card button:not([class]),
.cloud-app .edit-box button:not([class]),
.cloud-app .memo-mode-switch > button:not([class]),
.timeline-ui .timeline-primary,
.timeline-sheet-actions .timeline-save {
  background:linear-gradient(135deg,#337ca5 0%,#246994 62%,#3c80aa 100%) !important;
  color:#fff !important;
  box-shadow:0 5px 14px rgba(33,97,143,.17) !important;
}
.timeline-ui .timeline-home-top-action .timeline-primary {
  background:linear-gradient(126deg,#266d9b,#418ab9 50%,#5a83b8) !important;
  color:#fff !important;
  box-shadow:0 9px 22px rgba(43,103,160,.23) !important;
  border:1px solid rgba(255,255,255,.32) !important;
}
.cloud-app .secondary-btn,
.timeline-ui .timeline-outline,
.timeline-sheet-actions .timeline-cancel {
  background:linear-gradient(145deg,#e8f6ff,#e0eefb) !important;
  color:#255f83 !important;
  border:1px solid #c7e1f0 !important;
  box-shadow:none !important;
}
/* Do not recolor or hide any destructive action. */
.cloud-app :is(.danger-btn,.person-danger-btn,.memo-delete-confirm),
.timeline-ui .timeline-danger {
  background:#ae455d !important;
  color:#fff !important;
}
.cloud-app .memo-delete-link { color:#9c3c53 !important; background:#fff7f8 !important; border-color:#edced5 !important; }
/* Navigation: silvery bar with clear blue current-tab state. No changes to position or safe area. */
.cloud-tabs {
  background:rgba(250,253,255,.985) !important;
  border-top:1px solid #cbdfee !important;
  box-shadow:0 -9px 24px rgba(71,115,162,.10),inset 0 1px 0 #fff !important;
}
.cloud-app .cloud-tab { color:#607e99 !important; }
.cloud-app .cloud-tab.active {
  background:linear-gradient(145deg,#d6e9ff,#e4f7ff 78%) !important;
  color:#175c88 !important;
  box-shadow:inset 0 0 0 1px #bcddec,0 2px 9px rgba(45,108,160,.07) !important;
}
.cloud-tab .sl-snow-nav-icon { filter:drop-shadow(0 1px 2px rgba(85,143,183,.12)); }
/* Profiles, five-column picker and existing avatars retain their exact geometry. */
.profile-avatar,.switch-person-avatar-slot,.timeline-fallback-avatar,.memo-avatar {
  border-color:#b9d8eb !important;
  box-shadow:0 3px 11px rgba(61,120,165,.12) !important;
}
.cloud-person { border-bottom-color:#e0edf5 !important; }
.kana-heading { background:linear-gradient(90deg,#dbeeff,#f3faff) !important; color:#29658b !important; border-color:#c9e2f0 !important; }
.cloud-app .kana-button.current { background:#3479a4 !important; border-color:#3479a4 !important; color:#fff !important; }
/* The newly installed memo cards are especially legible under the atmospheric theme. */
.memo-item {
  background:linear-gradient(154deg,#fff,#fafdff) !important;
  border:1px solid #d4e5f1 !important;
  box-shadow:0 5px 16px rgba(67,112,154,.07) !important;
  border-radius:18px !important;
}
.memo-sender-text strong { color:#294763 !important; }
.memo-sender-text time,.memo-recipient { color:#52728b !important; }
.memo-item-body { color:#243c54 !important; line-height:1.85 !important; }
.memo-current-person,.memo-partner-settings {
  background:linear-gradient(135deg,#eef8ff,#eaf2ff) !important;
  border-color:#d3e5f3 !important;
}
/* Inputs never become translucent, keeping photos, type and focus comfortable on iPhone. */
.cloud-app :is(input:not([type=radio]):not([type=checkbox]),textarea,select),
.timeline-ui :is(textarea,select),
.timeline-sheet :is(textarea,select,.timeline-date-trigger),
.timeline-ui :is(.switch-person-search,.timeline-person-trigger) {
  background:#fff !important;
  color:#253e56 !important;
  border-color:#c7ddec !important;
}
.cloud-app :is(input,textarea,select):focus-visible,
.timeline-ui :is(input,textarea,select):focus-visible,
.timeline-sheet :is(input,textarea,select):focus-visible {
  outline:3px solid #87bde2 !important;
  outline-offset:1px;
}
::selection { background:#cde9ff; color:#173e61; }