/* Switch Log Snow World — CSS-only visual theme.
 * Does NOT change application logic, permissions, data, image handling, or navigation.
 * iOS safe: no font-size overrides on inputs, no width/zoom/view-port overrides.
 */
:root {
  --sl-snow-ice: #ecf9ff;
  --sl-snow-aqua: #d7f1fb;
  --sl-snow-ink: #233e54;
  --sl-snow-muted: #5c7488;
  --sl-snow-primary: #176b96;
  --sl-snow-line: #c9e6f3;
  --sl-snow-shadow: 0 10px 32px rgba(49, 119, 163, .10);
  color-scheme: light;
}

html { background: #eef9fe; }
body {
  color: var(--sl-snow-ink) !important;
  background-color: #eef9fe !important;
  background-image:
    url('/snowflakes.svg'),
    radial-gradient(ellipse 80% 42% at 95% 6%, #d7effb 0%, transparent 82%),
    radial-gradient(ellipse 55% 30% at 5% 50%, #e1f5ff 0%, transparent 90%),
    linear-gradient(160deg, #fcfeff 0%, #eff9ff 45%, #e4f5fc 100%) !important;
  background-position: center top, center top, center center, center center !important;
  background-size: 700px 850px, cover, cover, cover !important;
  background-repeat: repeat-y, no-repeat, no-repeat, no-repeat !important;
}

/* Keep the existing page sizing, especially the iPhone 16 fixes. */
.cloud-app { color: var(--sl-snow-ink) !important; }
.cloud-header {
  position: relative;
  border: 1px solid #d4edf8;
  border-radius: 23px;
  padding: 20px 19px 16px;
  background:
    url('/snowflakes.svg') right center / 350px auto no-repeat,
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(219,242,252,.84)) !important;
  box-shadow: 0 10px 26px rgba(70, 151, 189, .08);
}
.cloud-header h1, .timeline-ui h1, .timeline-ui h2,
.switch-person-heading h2 { color: #24445f !important; }
.cloud-brand {
  color: #3e97bc !important;
  letter-spacing: .24em;
}
.cloud-header .muted, .cloud-app .muted, .timeline-hint,
.timeline-hero-time, .timeline-hero-subtitle, .timeline-conditions,
.timeline-duration, .switch-person-hint, .switch-person-count {
  color: var(--sl-snow-muted) !important;
}

/* White frosted-glass panels; avatar dimensions stay as implemented. */
.cloud-card,
.timeline-ui .timeline-hero,
.timeline-ui .timeline-form-card,
.timeline-ui .timeline-entry-card {
  border: 1px solid var(--sl-snow-line) !important;
  background: linear-gradient(154deg, rgba(255,255,255,.985), rgba(247,253,255,.94)) !important;
  box-shadow: var(--sl-snow-shadow) !important;
  border-radius: 22px !important;
}
.cloud-person, .timeline-entry { border-bottom-color: #e0f0f7 !important; }
.timeline-hero-separator { background: #d7edf7 !important; }
.profile-avatar, .switch-person-avatar-slot,
.timeline-fallback-avatar {
  border: 1px solid rgba(151,205,231,.65);
  box-shadow: 0 4px 14px rgba(63,146,188,.13);
}
.timeline-fallback-avatar { background: #e7f6fc !important; color: #397c9c !important; }

/* Accent buttons. Keep destructive actions unmistakably red. */
.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(145deg, #1975a0, #0f648c) !important;
  color: #fff !important;
  box-shadow: 0 5px 14px rgba(30,119,162,.16);
}
.timeline-ui .timeline-home-top-action .timeline-primary {
  background: linear-gradient(125deg, #177ca5, #14688f) !important;
  color: white !important;
  box-shadow: 0 8px 20px rgba(35,124,166,.2) !important;
}
.cloud-app .secondary-btn { background: #dbeef6 !important; color: #235873 !important; }
.cloud-app .danger-btn, .cloud-app .person-danger-btn { background: #b44765 !important; color: #fff !important; }
.timeline-ui .timeline-outline, .timeline-ui .timeline-quiet,
.timeline-ui .timeline-link, .timeline-ui .timeline-text-action {
  color: #236f92 !important;
  border-color: #c5e5f2 !important;
}
.timeline-ui .timeline-outline { background: #f9feff !important; }
.cloud-app button:focus-visible,
.timeline-ui button:focus-visible,
.timeline-sheet button:focus-visible,
.switch-person-sheet button:focus-visible {
  outline: 3px solid #56b6df !important;
  outline-offset: 2px;
}
.cloud-app button:disabled { opacity: .55; }

/* The fixed navigation keeps exactly the current tab layout and safe area. */
.cloud-tabs {
  background: rgba(250,254,255,.97) !important;
  border-top: 1px solid #cce7f4 !important;
  box-shadow: 0 -9px 26px rgba(44,135,177,.08);
}
.cloud-app .cloud-tab { background: transparent !important; color: #638296 !important; box-shadow: none !important; }
.cloud-app .cloud-tab.active {
  color: #125f88 !important;
  background: #d9f3fc !important;
  box-shadow: inset 0 0 0 1px #bde5f4 !important;
}

/* Profile list, kana tabs, edit panel, train status. */
.kana-heading {
  background: linear-gradient(90deg, #d7f0fb, #edfaff) !important;
  color: #1d668d !important;
  border: 1px solid #c5e9f6;
}
.cloud-app .kana-button {
  color: #416c82 !important;
  background: #f4fbfe !important;
  border-color: #cae5f1 !important;
  box-shadow: none !important;
}
.cloud-app .kana-button.current {
  color: white !important;
  background: #176d95 !important;
  border-color: #176d95 !important;
}
.cloud-app .person-main {
  background: transparent !important;
  color: var(--sl-snow-ink) !important;
  box-shadow: none !important;
}
.cloud-app .person-edit-btn {
  background: transparent !important;
  color: #207599 !important;
  box-shadow: none !important;
}
.person-chevron { color: #6c9eb7 !important; }
.edit-box, .train-info, .photo-edit-panel {
  background: #ebf8fd !important;
  border: 1px solid #d3edf8;
}
.train-choice { border-color: #cbe6f3 !important; }
.train-choice .train-option { border-color: #cbe3ef !important; background: #fff !important; color: #31546b !important; }
.train-choice .train-option.selected {
  background: #d9f3fc !important;
  border-color: #59abd1 !important;
  color: #1a5f83 !important;
}
.train-choice input[type=radio] { accent-color: #1b769f !important; }
.photo-select-label { background: #eef9fe !important; border-color: #8ecde5 !important; }
.photo-preview { border-color: #9dd8ed !important; }

/* Text fields retain >= 16 px from the previous iPhone focus zoom fix. */
.cloud-app input:not([type=radio]):not([type=checkbox]),
.cloud-app textarea, .cloud-app select,
.timeline-ui select, .timeline-ui textarea,
.timeline-sheet textarea, .timeline-sheet .timeline-date-trigger,
.timeline-sheet .timeline-time-controls select,
.timeline-ui .switch-person-search, .timeline-ui .timeline-person-trigger {
  border-color: #c4e2ef !important;
  background-color: #fcfeff !important;
  color: #294b63 !important;
}
.cloud-app input:focus-visible, .cloud-app textarea:focus-visible,
.cloud-app select:focus-visible, .timeline-ui input:focus-visible,
.timeline-ui textarea:focus-visible, .timeline-ui select:focus-visible {
  outline: 3px solid #9ddcf1 !important;
  outline-offset: 1px;
}

/* Calendar / switch history / special avatar settings. */
.timeline-history-group h3 { color: #527b92 !important; }
.timeline-sheet, .switch-person-sheet {
  background: linear-gradient(165deg, #fcfeff 0%, #eaf8fe 100%) !important;
  color: #254459 !important;
  border: 1px solid #cce8f4;
}
.timeline-grabber, .switch-person-handle { background: #a5cfe1 !important; }
.timeline-sheet .timeline-calendar, .timeline-sheet .timeline-date-trigger { border-color: #c9e3f0 !important; background: white !important; }
.timeline-sheet .timeline-calendar-grid button.is-current {
  background: #176b96 !important; color: white !important;
}
.timeline-sheet .timeline-calendar-header button {
  background: #e1f2fa !important; color: #2a698b !important;
}
.timeline-sheet-actions .timeline-cancel { background: #dceff8 !important; color: #315b75 !important; }
.timeline-ui .timeline-choice.selected, .timeline-sheet .timeline-choice.selected {
  background: #daf3fa !important; color: #165e85 !important; border-color: #3d9cc8 !important;
}
.timeline-ui .switch-person-close { background: #e2f1f9 !important; color: #356880 !important; box-shadow: none !important; }
.timeline-ui .switch-person-option, .timeline-ui .switch-person-option.special-option { color: #253e54 !important; }
.timeline-ui .switch-person-option.special-option { background: #eaf7fc !important; }
.timeline-ui .switch-person-option.selected { background: #d7f0fc !important; border-color: #4ba5cd !important; }
.timeline-person-trigger-selected { color: #244b65 !important; }
.timeline-special-avatar-settings summary { color: #237498 !important; }

/* Small accessible accents; no moving snow or expensive blur animation. */
::selection { background: #bdeafb; color: #1a4f70; }
@media (prefers-reduced-transparency: reduce) {
  .cloud-tabs { background: #fff !important; }
}