#redlineApp .rl-date-lobby,
#redlineApp .rl-date-bill,
#redlineApp .rl-date-keepsake {
  padding: calc(30px + var(--safe-top-inset, 0px)) 18px calc(18px + var(--safe-bottom-inset, 0px));
}

#redlineApp .rl-date-page-head {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 34px;
  align-items: start;
  gap: 10px;
  flex: 0 0 auto;
}

#redlineApp .rl-date-page-head > div { grid-column: 2; }
#redlineApp .rl-date-page-head > button:last-child { grid-column: 3; }
#redlineApp .rl-date-page-head h1 {
  margin: 5px 0 4px;
  font-family: var(--rl-serif);
  font-size: 31px;
  font-weight: 500;
  letter-spacing: 0;
}
#redlineApp .rl-date-page-head p { margin: 0; color: var(--rl-muted); font-size: 12px; line-height: 1.5; }
#redlineApp .rl-date-icon-button {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 1px solid var(--rl-soft-line);
  border-radius: 50%;
  background: rgba(255,255,255,.64);
  color: var(--rl-ink);
  cursor: pointer;
}
#redlineApp .rl-date-icon-button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
#redlineApp .rl-date-icon-button.is-light { border-color: rgba(255,255,255,.32); background: rgba(15,15,15,.34); color: #fff; backdrop-filter: blur(12px); }

#redlineApp .rl-date-lobby-scroll { min-height: 0; flex: 1; margin: 16px -2px 0; padding: 0 2px 16px; overflow-y: auto; overscroll-behavior: contain; }
#redlineApp .rl-date-section-title { display: flex; align-items: end; justify-content: space-between; gap: 10px; margin: 20px 1px 9px; }
#redlineApp .rl-date-section-title strong { font-size: 12px; font-weight: 600; }
#redlineApp .rl-date-scene-list { display: grid; gap: 10px; }
#redlineApp .rl-date-scene-card {
  position: relative;
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr);
  min-height: 112px;
  padding: 0;
  overflow: hidden;
  border: 1px solid var(--rl-soft-line);
  border-radius: 6px;
  background: var(--rl-white);
  color: var(--rl-ink);
  text-align: left;
  cursor: pointer;
}
#redlineApp .rl-date-scene-photo { min-height: 112px; background-color: #5e615f; background-image: var(--date-scene); background-position: center; background-size: cover; filter: grayscale(.6) saturate(.55) contrast(.9); }
#redlineApp .rl-date-scene-copy { display: flex; flex-direction: column; justify-content: center; min-width: 0; padding: 13px; }
#redlineApp .rl-date-scene-copy small { color: var(--rl-red); font-size: 8px; font-weight: 700; letter-spacing: .18em; }
#redlineApp .rl-date-scene-copy strong { margin-top: 8px; font-size: 16px; }
#redlineApp .rl-date-scene-copy em { margin-top: 7px; color: var(--rl-muted); font-size: 10px; font-style: normal; line-height: 1.5; }
#redlineApp .rl-date-scene-card.is-cooling { cursor: default; opacity: .55; }

#redlineApp .rl-date-pending-list { display: grid; gap: 8px; }
#redlineApp .rl-date-pending { padding: 14px; border-left: 2px solid var(--rl-red); background: rgba(255,255,255,.66); }
#redlineApp .rl-date-pending strong, #redlineApp .rl-date-pending p, #redlineApp .rl-date-pending blockquote { display: block; margin: 7px 0 0; }
#redlineApp .rl-date-pending p, #redlineApp .rl-date-pending blockquote { color: var(--rl-muted); font-size: 11px; line-height: 1.55; }
#redlineApp .rl-date-pending blockquote { font-family: var(--rl-serif); font-size: 16px; font-style: italic; }
#redlineApp .rl-date-pending > button, #redlineApp .rl-date-pending div button { margin-top: 10px; padding: 8px 10px; background: transparent; color: var(--rl-red); font-size: 10px; font-weight: 650; cursor: pointer; }
#redlineApp .rl-date-pending div { display: flex; gap: 6px; }
#redlineApp .rl-date-keepsake-list { display: grid; border-top: 1px solid var(--rl-line); }
#redlineApp .rl-date-keepsake-row { display: grid; grid-template-columns: 28px minmax(0,1fr); gap: 9px; align-items: center; min-height: 66px; padding: 9px 2px; border-bottom: 1px solid var(--rl-soft-line); background: transparent; color: var(--rl-ink); text-align: left; cursor: pointer; }
#redlineApp .rl-date-keepsake-row > span { color: var(--rl-red); font-family: var(--rl-serif); font-size: 20px; }
#redlineApp .rl-date-keepsake-row div { display: grid; gap: 2px; }
#redlineApp .rl-date-keepsake-row small, #redlineApp .rl-date-keepsake-row em { color: var(--rl-muted); font-size: 9px; font-style: normal; }
#redlineApp .rl-date-keepsake-row strong { font-size: 13px; }
#redlineApp .rl-date-empty { margin: 0; padding: 18px 2px; color: var(--rl-muted); font-family: var(--rl-serif); font-size: 13px; font-style: italic; }

#redlineApp .rl-date-setup, #redlineApp .rl-date-invitation { position: relative; height: 100%; overflow: hidden; background: #292b2b; color: #fff; }
#redlineApp .rl-date-setup-photo, #redlineApp .rl-date-invite-photo { position: absolute; inset: 0; background-color: #454846; background-image: var(--date-scene); background-position: center; background-size: cover; filter: grayscale(.55) saturate(.5) brightness(.62); }
#redlineApp .rl-date-setup-photo::after, #redlineApp .rl-date-invite-photo::after, #redlineApp .rl-date-scene-background::after { position: absolute; inset: 0; background: rgba(10,10,10,.28); content: ''; }
#redlineApp .rl-date-page-head.is-over-photo { position: relative; z-index: 2; color: #fff; }
#redlineApp .rl-date-page-head.is-over-photo p, #redlineApp .rl-date-page-head.is-over-photo .rl-kicker { color: rgba(255,255,255,.7); }
#redlineApp .rl-date-setup-sheet { position: relative; z-index: 2; margin-top: auto; padding: 18px; border-radius: 6px 6px 0 0; background: rgba(247,248,248,.96); color: var(--rl-ink); box-shadow: 0 -14px 40px rgba(0,0,0,.18); }
#redlineApp .rl-date-setup-sheet > strong { display: block; margin-top: 6px; font-size: 20px; }
#redlineApp .rl-date-setup-sheet > p { margin: 11px 0 0; color: var(--rl-muted); font-size: 11px; line-height: 1.5; }
#redlineApp .rl-date-time-switch { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 15px; }
#redlineApp .rl-date-time-switch input { position: absolute; opacity: 0; }
#redlineApp .rl-date-time-switch span { display: grid; place-items: center; min-height: 44px; border: 1px solid var(--rl-line); border-radius: 6px; font-size: 11px; cursor: pointer; }
#redlineApp .rl-date-time-switch input:checked + span { border-color: var(--rl-red); background: var(--rl-red-soft); color: var(--rl-red); }
#redlineApp .rl-date-datetime { display: grid; gap: 6px; margin-top: 12px; color: var(--rl-muted); font-size: 10px; }
#redlineApp .rl-date-datetime input { min-height: 43px; padding: 0 10px; border: 1px solid var(--rl-line); border-radius: 6px; background: #fff; color: var(--rl-ink); }
#redlineApp .rl-date-inline-error { min-height: 16px; color: var(--rl-red) !important; font-size: 11px !important; }

#redlineApp .rl-date-invite-close { position: absolute; top: calc(32px + var(--safe-top-inset,0px)); right: 18px; z-index: 3; }
#redlineApp .rl-date-invite-paper { position: absolute; right: 8%; bottom: calc(38px + var(--safe-bottom-inset,0px)); left: 8%; z-index: 2; padding: 25px 22px; border-radius: 5px; background: rgba(247,248,248,.95); color: var(--rl-ink); box-shadow: 0 20px 60px rgba(0,0,0,.28); }
#redlineApp .rl-date-invite-paper h1 { margin: 8px 0 4px; font-family: var(--rl-serif); font-size: 29px; font-weight: 500; }
#redlineApp .rl-date-invite-paper p, #redlineApp .rl-date-invite-paper small { color: var(--rl-muted); font-size: 10px; }
#redlineApp .rl-date-invite-paper blockquote { margin: 24px 0 12px; font-family: var(--rl-serif); font-size: 20px; font-style: italic; line-height: 1.45; }

#redlineApp .rl-date-scene { position: relative; height: 100%; overflow: hidden; background: #202222; color: #fff; }
#redlineApp .rl-date-scene-background { position: absolute; inset: 0; background-color: #454846; background-image: var(--date-scene); background-position: center; background-size: cover; filter: grayscale(.55) saturate(.5) brightness(.58); }
#redlineApp .rl-date-scene > header { position: relative; z-index: 3; display: grid; grid-template-columns: 36px minmax(0,1fr) 36px; align-items: center; gap: 10px; padding: calc(28px + var(--safe-top-inset,0px)) 16px 10px; }
#redlineApp .rl-date-scene > header div { display: grid; text-align: center; }
#redlineApp .rl-date-scene > header span { color: rgba(255,255,255,.6); font-size: 8px; letter-spacing: .2em; }
#redlineApp .rl-date-scene > header strong { margin-top: 3px; font-family: var(--rl-serif); font-size: 18px; font-weight: 500; }
#redlineApp .rl-date-atmosphere { position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: center; min-height: 0; height: calc(100% - 356px); padding: 14px 28px; text-align: center; }
#redlineApp .rl-date-atmosphere > span { color: rgba(255,255,255,.65); font-size: 10px; }
#redlineApp .rl-date-atmosphere blockquote { min-height: 54px; margin: 16px 0 0; font-family: var(--rl-serif); font-size: 21px; line-height: 1.45; text-shadow: 0 2px 12px rgba(0,0,0,.4); }
#redlineApp .rl-date-atmosphere small { min-height: 16px; margin-top: 8px; color: rgba(255,255,255,.64); font-size: 9px; }
#redlineApp .rl-date-scene-controls { position: absolute; right: 0; bottom: 0; left: 0; z-index: 3; display: grid; gap: 9px; padding: 13px 16px calc(14px + var(--safe-bottom-inset,0px)); background: rgba(15,15,15,.68); backdrop-filter: blur(18px); }
#redlineApp .rl-date-choices { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; min-height: 42px; }
#redlineApp .rl-date-choice { min-height: 42px; padding: 7px 8px; border: 1px solid rgba(255,255,255,.22); border-radius: 5px; background: rgba(255,255,255,.08); color: #fff; font-size: 10px; line-height: 1.35; cursor: pointer; }
#redlineApp .rl-date-choice.is-selected { border-color: rgba(255,255,255,.7); background: rgba(255,255,255,.18); }
#redlineApp .rl-date-actions { display: flex; gap: 7px; overflow-x: auto; scrollbar-width: none; }
#redlineApp .rl-date-actions button { flex: 0 0 auto; min-height: 30px; padding: 0 10px; border-radius: 999px; background: rgba(255,255,255,.1); color: rgba(255,255,255,.82); font-size: 9px; cursor: pointer; }
#redlineApp .rl-date-chat { display: grid; grid-template-columns: minmax(0,1fr) 38px; height: 38px; overflow: hidden; border: 1px solid rgba(255,255,255,.2); border-radius: 5px; background: rgba(0,0,0,.18); }
#redlineApp .rl-date-chat input { min-width: 0; padding: 0 11px; border: 0; outline: 0; background: transparent; color: #fff; font-size: 11px; }
#redlineApp .rl-date-chat button { display: grid; place-items: center; background: transparent; color: #fff; }
#redlineApp .rl-date-chat svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.3; }
#redlineApp .rl-date-next { min-height: 42px; border-radius: 5px; background: rgba(255,255,255,.92); color: #181818; font-size: 10px; font-weight: 700; letter-spacing: .12em; cursor: pointer; }
#redlineApp .rl-date-next:disabled { opacity: .42; cursor: default; }
#redlineApp .rl-date-log { position: absolute; top: 0; right: 0; bottom: 0; z-index: 5; width: min(82%,310px); padding: calc(32px + var(--safe-top-inset,0px)) 16px 18px; background: rgba(18,18,18,.94); transform: translateX(102%); transition: transform 180ms ease; }
#redlineApp .rl-date-log.is-open { transform: translateX(0); }
#redlineApp .rl-date-log > div { display: flex; justify-content: space-between; align-items: center; }
#redlineApp .rl-date-log button { width: 30px; height: 30px; background: transparent; color: #fff; }
#redlineApp .rl-date-log svg { width: 18px; fill: none; stroke: currentColor; }
#redlineApp .rl-date-log ol, #redlineApp .rl-date-event-details ol { list-style: none; margin: 15px 0 0; padding: 0; overflow-y: auto; }
#redlineApp .rl-date-event { display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 8px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.1); font-size: 10px; line-height: 1.45; }
#redlineApp .rl-date-event b { color: rgba(255,255,255,.5); font-weight: 500; }
#redlineApp .rl-date-exit-confirm { position: absolute; inset: 0; z-index: 8; display: grid; place-items: center; padding: 20px; background: rgba(0,0,0,.7); }
#redlineApp .rl-date-exit-confirm[hidden] { display: none; }
#redlineApp .rl-date-exit-confirm > div { width: min(100%,300px); padding: 20px; border-radius: 6px; background: #202020; }
#redlineApp .rl-date-exit-confirm strong { display: block; margin-top: 7px; font-size: 18px; }
#redlineApp .rl-date-exit-confirm p { color: rgba(255,255,255,.65); font-size: 11px; line-height: 1.5; }

#redlineApp .rl-date-bill-paper { margin: 22px 4px 0; padding: 19px 16px 15px; border: 1px solid var(--rl-line); background: #fff; box-shadow: var(--rl-shadow); }
#redlineApp .rl-date-bill-paper > div, #redlineApp .rl-date-bill-paper footer { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; font-size: 12px; }
#redlineApp .rl-date-bill-paper footer { margin-top: 9px; border-top: 1px dashed var(--rl-line); }
#redlineApp .rl-date-wallet-line { display: flex; align-items: center; gap: 8px; margin: 13px 4px; color: var(--rl-muted); font-size: 11px; }
#redlineApp .rl-date-wallet-line svg { width: 17px; fill: none; stroke: currentColor; }
#redlineApp .rl-date-wallet-line strong { margin-left: auto; color: var(--rl-ink); }
#redlineApp .rl-date-payer-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
#redlineApp .rl-date-payer-grid button { min-height: 75px; padding: 9px 5px; border: 1px solid var(--rl-line); border-radius: 5px; background: transparent; color: var(--rl-ink); cursor: pointer; }
#redlineApp .rl-date-payer-grid strong, #redlineApp .rl-date-payer-grid small { display: block; }
#redlineApp .rl-date-payer-grid strong { font-size: 11px; }
#redlineApp .rl-date-payer-grid small { margin-top: 5px; color: var(--rl-muted); font-size: 8px; line-height: 1.35; }
#redlineApp .rl-date-topup { position: absolute; inset: 0; z-index: 6; display: flex; flex-direction: column; justify-content: center; padding: 28px; background: rgba(247,248,248,.98); }
#redlineApp .rl-date-topup[hidden] { display: none; }
#redlineApp .rl-date-topup strong { font-size: 22px; }
#redlineApp .rl-date-topup p { color: var(--rl-muted); font-size: 12px; line-height: 1.5; }
#redlineApp .rl-date-topup input { min-height: 48px; padding: 0 12px; border: 1px solid var(--rl-line); border-radius: 6px; }
#redlineApp .rl-date-topup button { min-height: 44px; margin-top: 8px; border-radius: 5px; background: var(--rl-ink); color: #fff; cursor: pointer; }
#redlineApp .rl-date-topup button:last-child { background: transparent; color: var(--rl-muted); }

#redlineApp .rl-date-keepsake { overflow-y: auto; }
#redlineApp .rl-date-keepsake-paper { margin: 19px 4px 0; padding: 13px 15px 20px; border: 1px solid var(--rl-line); background: #fff; box-shadow: var(--rl-shadow); }
#redlineApp .rl-date-keepsake-photo { height: 154px; margin: -1px -3px 17px; background-color: #535655; background-image: var(--date-scene); background-position: center; background-size: cover; filter: grayscale(.6) saturate(.55) contrast(.88); }
#redlineApp .rl-date-keepsake-paper h2 { margin: 6px 0 12px; font-family: var(--rl-serif); font-size: 27px; font-weight: 500; }
#redlineApp .rl-date-keepsake-paper dl { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; margin: 0; padding: 11px 0; border-top: 1px dashed var(--rl-line); border-bottom: 1px dashed var(--rl-line); }
#redlineApp .rl-date-keepsake-paper dt { color: var(--rl-muted); font-size: 7px; letter-spacing: .12em; }
#redlineApp .rl-date-keepsake-paper dd { margin: 4px 0 0; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
#redlineApp .rl-date-keepsake-paper blockquote { margin: 18px 0 7px; font-family: var(--rl-serif); font-size: 19px; font-style: italic; line-height: 1.4; }
#redlineApp .rl-date-keepsake-paper p { margin: 0; color: var(--rl-muted); font-size: 11px; line-height: 1.55; }
#redlineApp .rl-date-route-summary { margin: 12px 4px; padding: 14px; border-left: 2px solid var(--rl-red); background: var(--rl-red-soft); }
#redlineApp .rl-date-route-summary > strong { display: block; margin-top: 5px; font-family: var(--rl-serif); font-size: 19px; font-weight: 500; }
#redlineApp .rl-date-route-summary > p, #redlineApp .rl-date-legacy-note { margin: 5px 0 0; color: var(--rl-muted); font-size: 10px; line-height: 1.5; }
#redlineApp .rl-date-route-summary ol { display: grid; gap: 5px; margin: 11px 0 0; padding: 0; list-style: none; }
#redlineApp .rl-date-route-summary li { display: grid; grid-template-columns: 80px minmax(0,1fr); gap: 7px; align-items: baseline; font-size: 10px; }
#redlineApp .rl-date-route-summary li span { color: var(--rl-muted); font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }
#redlineApp .rl-date-legacy-note { margin: 12px 4px; padding: 10px 12px; border-left: 2px solid var(--rl-line); }
#redlineApp .rl-date-event-details { margin: 12px 4px; font-size: 10px; }
#redlineApp .rl-date-event-details .rl-date-event { border-color: var(--rl-soft-line); }
#redlineApp .rl-date-event-details .rl-date-event b { color: var(--rl-muted); }
#redlineApp .rl-date-delete-confirm { margin: 12px 4px; padding: 16px; border: 1px solid rgba(143,29,44,.25); background: var(--rl-red-soft); }
#redlineApp .rl-date-delete-confirm[hidden] { display: none; }
#redlineApp .rl-date-delete-confirm p { color: var(--rl-muted); font-size: 11px; line-height: 1.5; }

@media (max-height: 650px) {
  #redlineApp .rl-date-lobby, #redlineApp .rl-date-bill, #redlineApp .rl-date-keepsake { padding-top: calc(18px + var(--safe-top-inset,0px)); }
  #redlineApp .rl-date-scene > header { padding-top: calc(18px + var(--safe-top-inset,0px)); }
  #redlineApp .rl-date-atmosphere { height: calc(100% - 326px); padding-top: 4px; padding-bottom: 4px; }
  #redlineApp .rl-date-atmosphere blockquote { margin-top: 8px; font-size: 17px; }
  #redlineApp .rl-date-scene-controls { gap: 6px; padding-top: 9px; }
  #redlineApp .rl-date-actions button { min-height: 27px; }
  #redlineApp .rl-date-invite-paper { bottom: calc(18px + var(--safe-bottom-inset,0px)); padding: 18px; }
  #redlineApp .rl-date-invite-paper blockquote { margin-top: 15px; font-size: 17px; }
  #redlineApp .rl-date-setup-sheet { max-height: 58%; overflow-y: auto; }
}

@media (orientation: landscape) and (max-height: 500px) {
  #redlineApp .rl-date-setup { padding: calc(12px + var(--safe-top-inset,0px)) 14px calc(12px + var(--safe-bottom-inset,0px)); }
  #redlineApp .rl-date-setup-sheet { position: absolute; top: calc(12px + var(--safe-top-inset,0px)); right: 14px; bottom: calc(12px + var(--safe-bottom-inset,0px)); width: min(46%,350px); margin: 0; overflow-y: auto; border-radius: 6px; }
  #redlineApp .rl-date-page-head.is-over-photo { width: 48%; }
  #redlineApp .rl-date-scene-controls { right: 0; left: 52%; }
  #redlineApp .rl-date-atmosphere { width: 52%; height: calc(100% - 74px); box-sizing: border-box; }
  #redlineApp .rl-date-scene > header { width: 52%; box-sizing: border-box; }
  #redlineApp .rl-date-keepsake { display: grid; grid-template-columns: minmax(240px,.8fr) minmax(320px,1.2fr); gap: 14px; }
  #redlineApp .rl-date-keepsake > header { grid-column: 1 / -1; }
  #redlineApp .rl-date-keepsake-paper { margin-top: 0; }
  #redlineApp .rl-date-keepsake-photo { height: 90px; }
}

@media (prefers-reduced-motion: reduce) {
  #redlineApp .rl-date-log { transition: none; }
}

/* Visual-novel route layer: the story scrolls independently from its safe-area controls. */
#redlineApp .rl-date-story {
  position: absolute;
  top: calc(76px + var(--safe-top-inset,0px));
  right: 14px;
  bottom: calc(188px + var(--safe-bottom-inset,0px));
  left: 14px;
  z-index: 2;
  overflow-y: auto;
  padding: 12px 4px 20px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
#redlineApp .rl-date-story-note,
#redlineApp .rl-date-scene-note {
  max-width: 34rem;
  margin: 12px auto;
  color: rgba(255,255,255,.68);
  font-family: var(--rl-serif);
  font-size: 15px;
  line-height: 1.7;
  text-align: center;
  text-shadow: 0 2px 12px rgba(0,0,0,.4);
}
#redlineApp .rl-date-story-copy {
  display: grid;
  gap: 10px;
  max-width: 38rem;
  margin: 0 auto;
}
#redlineApp .rl-date-narration {
  margin: 0;
  padding: 12px 14px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 4px;
  background: rgba(14,14,14,.46);
  color: rgba(255,255,255,.88);
  font-family: var(--rl-serif);
  font-size: 15px;
  line-height: 1.75;
  text-shadow: 0 1px 8px rgba(0,0,0,.45);
}
#redlineApp .rl-date-dialogue {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr);
  gap: 10px;
  align-items: start;
  max-width: 31rem;
  margin: 2px 0 0 auto;
  padding: 11px 12px;
  border: 1px solid rgba(255,255,255,.32);
  border-radius: 5px;
  background: rgba(247,248,248,.94);
  color: #191919;
  box-shadow: 0 10px 26px rgba(0,0,0,.18);
}
#redlineApp .rl-date-dialogue.is-chat { opacity: .84; }
#redlineApp .rl-date-dialogue-avatar {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  overflow: hidden;
  border-radius: 50%;
  background: #d5d7d5;
  color: #555;
  font-family: var(--rl-serif);
}
#redlineApp .rl-date-dialogue-avatar img { width: 100%; height: 100%; object-fit: cover; }
#redlineApp .rl-date-dialogue small { color: #777; font-size: 9px; letter-spacing: .08em; }
#redlineApp .rl-date-dialogue p { margin: 4px 0 0; font-family: var(--rl-serif); font-size: 15px; line-height: 1.55; }
#redlineApp .rl-date-story-status {
  display: block;
  min-height: 16px;
  margin: 10px auto 0;
  color: rgba(255,255,255,.66);
  font-size: 10px;
  text-align: center;
}
#redlineApp .rl-date-story [hidden] { display: none !important; }
#redlineApp .rl-date-scene-controls {
  gap: 8px;
  padding: 10px 14px calc(12px + var(--safe-bottom-inset,0px));
}
#redlineApp .rl-date-choices {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 7px;
  min-height: 48px;
}
#redlineApp .rl-date-choice {
  min-width: 0;
  min-height: 48px;
  padding: 7px 8px;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 4px;
  background: rgba(255,255,255,.09);
  color: #fff;
  font-family: var(--rl-serif);
  font-size: 11px;
  line-height: 1.4;
  cursor: pointer;
}
#redlineApp .rl-date-choice:hover,
#redlineApp .rl-date-choice:focus-visible { border-color: rgba(255,255,255,.82); background: rgba(255,255,255,.18); outline: none; }
#redlineApp .rl-date-choice:disabled { opacity: .48; cursor: wait; }
#redlineApp .rl-date-skip {
  justify-self: end;
  min-height: 24px;
  padding: 0 7px;
  border: 0;
  background: transparent;
  color: rgba(255,255,255,.62);
  font-size: 9px;
  cursor: pointer;
}
#redlineApp .rl-date-retry {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 7px 9px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.24);
  color: rgba(255,255,255,.8);
  font-size: 10px;
}
#redlineApp .rl-date-retry p { margin: 0; line-height: 1.4; }
#redlineApp .rl-date-retry button { min-height: 28px; padding: 0 8px; border: 1px solid rgba(255,255,255,.45); border-radius: 3px; background: transparent; color: #fff; font-size: 9px; cursor: pointer; }
#redlineApp .rl-date-resume {
  display: grid;
  gap: 4px;
  width: 100%;
  margin-bottom: 14px;
  padding: 14px;
  border: 1px solid var(--rl-line);
  border-left: 2px solid var(--rl-red);
  background: rgba(255,255,255,.78);
  color: var(--rl-ink);
  text-align: left;
  cursor: pointer;
}
#redlineApp .rl-date-resume strong { font-family: var(--rl-serif); font-size: 18px; font-weight: 500; }
#redlineApp .rl-date-resume small { color: var(--rl-muted); font-size: 10px; }
#redlineApp .rl-date-ai-gate {
  margin: 0 0 12px;
  padding: 10px 12px;
  border-left: 2px solid var(--rl-red);
  background: var(--rl-red-soft);
  color: var(--rl-muted);
  font-size: 11px;
  line-height: 1.55;
}

@media (max-width: 350px) {
  #redlineApp .rl-date-story { bottom: calc(202px + var(--safe-bottom-inset,0px)); }
  #redlineApp .rl-date-choice { min-height: 56px; padding-inline: 5px; font-size: 10px; }
  #redlineApp .rl-date-dialogue p, #redlineApp .rl-date-narration { font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  #redlineApp .rl-date-narration,
  #redlineApp .rl-date-dialogue { scroll-behavior: auto; transition: none; }
}
