/* Fresh colors for the existing lucky ticket and postcard interactions. */
#fortune-dialog {
  --fortune-red: var(--red);
  --fortune-cream: var(--paper);
  --keepsake-lemon: #ffc4d2;
  --keepsake-on-red: #211715;
  color: var(--keepsake-on-red);
  background: var(--fortune-red);
  box-shadow: 0 18px 90px #252A2D30;
  scrollbar-color: #21171566 transparent;
}
#fortune-dialog::backdrop,
#postcard-dialog::backdrop {
  background: #252A2DBD;
}
#fortune-dialog button:focus-visible,
#fortune-dialog a:focus-visible {
  outline-color: var(--keepsake-on-red);
}
#fortune-dialog .fortune-header {
  border-bottom-color: #21171533;
}
#fortune-dialog .fortune-header button,
#fortune-dialog .fortune-kicker,
#fortune-dialog #fortune-intro,
#fortune-dialog #fortune-gift-note,
#fortune-dialog .fortune-paper-moon>span,
#fortune-dialog .fortune-theatre-caption,
#fortune-dialog .fortune-pull-hint,
#fortune-dialog .fortune-again,
#fortune-dialog .fortune-status,
#fortune-dialog .fortune-storage-note,
#fortune-dialog .fortune-image-view>p,
#fortune-dialog .fortune-image-actions button,
#fortune-dialog .fortune-image-actions a {
  color: var(--keepsake-on-red);
}
#fortune-dialog #fortune-title {
  font-weight: 650;
}
#fortune-dialog .fortune-header i,
#fortune-dialog .fortune-signature i,
#fortune-dialog .fortune-draw>span,
#fortune-dialog .fortune-little-star {
  font-family: var(--sans);
}
#fortune-dialog .fortune-paper-moon {
  border-color: #21171526;
  background: #FFFCF433;
}
#fortune-dialog .fortune-paper-moon:before {
  border-color: #FFFCF433;
}
#fortune-dialog .fortune-figure {
  filter: drop-shadow(0 4px 1px #252A2D14);
}
#fortune-dialog .fortune-sticks i {
  color: var(--ink);
  background: var(--paper);
  border-color: #252A2D40;
  box-shadow: inset -3px 0 #252A2D0D;
}
#fortune-dialog .fortune-sticks i:nth-child(3) {
  background: var(--keepsake-lemon);
}
#fortune-dialog .fortune-jar {
  color: var(--keepsake-on-red);
  background: var(--keepsake-lemon);
  border-color: #21171540;
  box-shadow: inset 5px 0 #FFFCF440, inset -5px 0 #2117150A, 0 8px 15px #21171520;
}
#fortune-dialog .fortune-jar:before {
  border-color: #21171533;
}
#fortune-dialog .fortune-jar-rim {
  border-color: var(--keepsake-lemon);
  background: var(--keepsake-on-red);
}
#fortune-dialog .fortune-jar b {
  text-shadow: none;
}
#fortune-dialog .fortune-table-shadow {
  background: #21171526;
}
#fortune-dialog .fortune-primary {
  color: var(--ink);
  background: var(--paper);
  border-color: var(--paper);
  font-weight: 600;
}
#fortune-dialog .fortune-primary:enabled:active {
  background: var(--keepsake-lemon);
  border-color: var(--keepsake-lemon);
}
#fortune-dialog .fortune-ticket {
  color: var(--ink);
  background: var(--paper);
  border-top-color: var(--keepsake-lemon);
  border-bottom-color: var(--keepsake-lemon);
  box-shadow: 0 8px 18px #252A2D20;
}
#fortune-dialog .fortune-ticket-rule,
#fortune-dialog .fortune-ticket-bottom {
  border-color: var(--line);
}
#fortune-dialog .fortune-ticket-top,
#fortune-dialog .fortune-ticket-to {
  color: var(--ink);
}
#fortune-dialog .fortune-word {
  color: var(--red);
  font-weight: 600;
}
#fortune-dialog .fortune-little-star {
  color: var(--red-ink);
}
#fortune-dialog .fortune-note,
#fortune-dialog .fortune-signature small {
  color: var(--muted);
}
#fortune-dialog .fortune-stamp {
  color: var(--ink);
  background: var(--keepsake-lemon);
  border-color: var(--ink);
  outline-color: var(--ink);
}

#postcard-dialog {
  --postcard-red: var(--red);
  --postcard-paper: var(--paper);
  --keepsake-lemon: #ffc4d2;
  color: var(--ink);
  background: var(--postcard-paper);
  scrollbar-color: var(--line) var(--paper);
}
#postcard-dialog .postcard-header>button,
#postcard-dialog .postcard-photo-option,
#postcard-dialog .postcard-saved-signature strong {
  color: var(--ink);
}
#postcard-dialog #postcard-title {
  font-weight: 650;
}
#postcard-dialog .postcard-steps,
#postcard-dialog .postcard-help,
#postcard-dialog .postcard-photo-loading,
#postcard-dialog .postcard-message-meta,
#postcard-dialog .postcard-saved-signature,
#postcard-dialog .postcard-done,
#postcard-dialog .postcard-local-note,
#postcard-dialog #postcard-message::placeholder,
#postcard-dialog #postcard-name::placeholder {
  color: var(--muted);
}
#postcard-dialog .postcard-steps li+li:before {
  background: var(--line);
}
#postcard-dialog .postcard-steps [aria-current=step],
#postcard-dialog #postcard-photo-retry,
#postcard-dialog .postcard-error {
  color: var(--red-ink);
}
#postcard-dialog .postcard-photo-option {
  background: var(--paper);
  box-shadow: 0 2px 7px #252A2D12;
}
#postcard-dialog .postcard-photo-option:after {
  color: var(--red-ink);
  background: var(--paper);
}
#postcard-dialog .postcard-photo-option[aria-current=true] {
  border-color: var(--red-ink);
}
#postcard-dialog .postcard-photo-option[aria-current=true]:after {
  color: var(--ink);
  background: var(--keepsake-lemon);
}
#postcard-dialog .postcard-photo-option:hover {
  box-shadow: 0 5px 10px #252A2D1A;
}
#postcard-dialog .postcard-photo-option:focus-visible,
#postcard-dialog #postcard-message:focus-visible,
#postcard-dialog #postcard-name:focus-visible {
  outline-color: var(--red-ink);
}
#postcard-dialog .postcard-all,
#postcard-dialog #postcard-photo-retry,
#postcard-dialog .postcard-face {
  border-color: var(--line);
}
#postcard-dialog .postcard-face {
  background: var(--paper);
  box-shadow: 0 7px 18px #252A2D1A;
}
#postcard-dialog .postcard-photo-frame,
#postcard-dialog .postcard-photo-loading {
  background: #F1F1EA;
}
#postcard-dialog .postcard-back {
  background: var(--paper);
}
#postcard-dialog .postcard-postage {
  color: var(--ink);
  background: var(--keepsake-lemon);
  border-color: var(--paper);
  outline-color: #252A2D40;
}
#postcard-dialog .postcard-photo-option:after,
#postcard-dialog .postcard-all>span,
#postcard-dialog .postcard-front-caption>span:last-child,
#postcard-dialog .postcard-postage small,
#postcard-dialog .postcard-stamp>b,
#postcard-dialog .postcard-primary>span,
#postcard-dialog .postcard-fortune>span:last-child {
  font-family: var(--sans);
}
#postcard-dialog #postcard-message,
#postcard-dialog #postcard-name {
  color: var(--ink);
  border-color: var(--line);
}
#postcard-dialog #postcard-message {
  background-image: repeating-linear-gradient(transparent 0, transparent 31px, #252A2D14 31px, #252A2D14 32px);
}
#postcard-dialog .postcard-stamp {
  color: var(--ink);
  background: var(--keepsake-lemon);
  border-color: var(--ink);
  outline-color: var(--ink);
}
#postcard-dialog .postcard-primary,
#postcard-dialog #postcard-replace {
  color: #211715;
  background: var(--postcard-red);
  border-color: var(--postcard-red);
  font-weight: 600;
}
#postcard-dialog .postcard-primary:hover,
#postcard-dialog #postcard-replace:hover {
  color: var(--paper);
  background: var(--red-ink);
  border-color: var(--red-ink);
}
#postcard-dialog .postcard-secondary {
  color: var(--ink);
  border-color: var(--line);
}
#postcard-dialog .postcard-conflict {
  color: var(--ink);
  background: #F2453D08;
  border-color: var(--red-ink);
}
#postcard-dialog .postcard-conflict button {
  border-color: var(--line);
}
#postcard-dialog .postcard-fortune {
  color: var(--ink);
  border-color: var(--line);
}
#postcard-dialog .postcard-fortune .gift-seal {
  color: var(--ink);
  background: var(--keepsake-lemon);
  border-color: #252A2D40;
}
#postcard-dialog .postcard-fortune small {
  color: var(--muted);
}
