/* GLOBAL SETTINGS */
*{
box-sizing:border-box;
}

/* PAGE BACKGROUND + FONT */
body{
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
margin:0;
background:linear-gradient(180deg,#4facfe 0%,#00f2fe 100%);
min-height:100vh;
display:flex;
justify-content:center;
align-items:center;
padding:env(safe-area-inset-top) 20px env(safe-area-inset-bottom);
color:#111;
}

/* MAIN APP CONTAINER */
.container{
width:100%;
max-width:420px;
}

/* APP TITLE */
.header{
font-size:28px;
font-weight:700;
color:white;
text-align:center;
margin-bottom:25px;
}

/* BUTTON STYLING */
button{
width:100%;
padding:18px;
margin:10px 0;
font-size:18px;
border:none;
border-radius:18px;
font-weight:600;
color:white;
cursor:pointer;
transition:transform .1s ease, box-shadow .1s ease;
box-shadow:0 8px 20px rgba(0,0,0,0.2);
}

button:active{
transform:scale(.95);
box-shadow:0 4px 10px rgba(0,0,0,0.2);
}

/* BUTTON COLORS */
.random{ background:#007AFF; }
.photo{ background:#34C759; }
.deep{ background:#FF3B30; }
.pimienta{ background:#AF52DE; }

.saveMemory{
background:#007AFF;
color:white;
font-weight:600;
}

.saveMemory:active{
transform:scale(.95);
}

/* PROMPT CARD (WHITE BOX THAT DISPLAYS PROMPTS) */
.card{
margin-top:25px;
backdrop-filter:blur(18px);
background:rgba(255,255,255,0.75);
border-radius:22px;
padding:28px;
font-size:22px;
line-height:1.4;
box-shadow:0 12px 35px rgba(0,0,0,0.25);
min-height:150px;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
position:relative;
overflow:hidden;
}

/* PROMPT TEXT */
#prompt{
transition:transform .2s ease, opacity .2s ease;
}

/* LOADING SPINNER */
.spinner{
width:30px;
height:30px;
border-radius:50%;
border:3px solid rgba(0,0,0,.15);
border-top:3px solid #007AFF;
animation:spin 1s linear infinite;
}

@keyframes spin{
0%{ transform:rotate(0deg); }
100%{ transform:rotate(360deg); }
}

/* MEMORY VAULT SECTION */
.vault{
margin-top:30px;
background:white;
padding:20px;
border-radius:20px;
box-shadow:0 10px 30px rgba(0,0,0,.2);
}

.answerVault{
  margin-top:18px;
}

.authBox{
  margin-bottom:14px;
}

.authStatus{
  margin-bottom:10px;
  font-size:14px;
}

.signOutBtn{
  background:#555;
}

.homeIntro{
  margin:10px 0 14px;
  line-height:1.45;
}

.homeImage{
  width:100%;
  margin:10px 0 16px;
  border-radius:18px;
  box-shadow:0 10px 25px rgba(0,0,0,.15);
}

.homeUsage{
  padding:14px;
  border-radius:16px;
  background:rgba(0,0,0,.04);
  line-height:1.45;
}

.entriesIntro{
  font-size:14px;
  color:rgba(0,0,0,.65);
  line-height:1.45;
}

.hiddenInput{
  display:none;
}

/* JOURNAL TEXT BOX */
textarea{
width:100%;
height:80px;
border-radius:12px;
padding:10px;
border:1px solid #ddd;
margin-bottom:10px;
}

/* INPUT FIELDS */
input, select{
width:100%;
padding:10px;
margin-bottom:10px;
border-radius:10px;
border:1px solid #ddd;
}

/* MEMORY ENTRIES */
.entry{
  background:white;
  border-radius:18px;
  padding:16px;
  margin-top:12px;
  box-shadow:0 6px 16px rgba(0,0,0,.10);
  border:1px solid rgba(0,0,0,.06);
}

.dayHeader{
  margin-top:18px;
  font-size:14px;
  font-weight:700;
  letter-spacing:.02em;
  color:rgba(0,0,0,.60);
}

.entryHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
}

.entryMeta{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  font-size:13px;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
}

.pill.alex{
  background:rgba(0,122,255,.12);
  color:#0A56C2;
}

.pill.nathalia{
  background:rgba(175,82,222,.14);
  color:#7A2EA5;
}

.badge{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:700;
  background:rgba(0,0,0,.06);
  color:rgba(0,0,0,.60);
  white-space:nowrap;
}

.timestamp{
  font-size:12px;
  color:rgba(0,0,0,.55);
  white-space:nowrap;
}

.promptBlock{
  background:rgba(0,0,0,.04);
  border-left:4px solid rgba(0,0,0,.16);
  padding:10px 12px;
  border-radius:12px;
  margin:10px 0;
  font-size:15px;
  line-height:1.35;
}

.promptLabel{
  font-size:12px;
  font-weight:800;
  color:rgba(0,0,0,.55);
  margin-bottom:6px;
}

.answerBlock{
  font-size:16px;
  line-height:1.45;
  margin-top:10px;
  white-space:pre-wrap;
}

.entryActions{
  margin-top:10px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.linkButton{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(0,122,255,.12);
  color:#0A56C2;
  font-weight:700;
  font-size:14px;
  text-decoration:none;
}

.entryImage{
  width:100%;
  border-radius:14px;
  margin-top:12px;
  display:block;
}

.reactionRow{
  margin-top:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.heartBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.10);
  background:rgba(0,0,0,.03);
  color:#111;
  font-weight:900;
  font-size:14px;
  cursor:pointer;
  box-shadow:none;
}

.heartBtn.active{
  background:rgba(255,45,85,.14);
  border-color:rgba(255,45,85,.28);
  color:#FF2D55;
}

.heartCount{
  font-size:13px;
  font-weight:800;
  color:rgba(0,0,0,.55);
}

.entryFilterBar{
  margin:12px 0 10px;
  padding:12px;
  border-radius:18px;
  background:rgba(255,255,255,.94);
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 10px 26px rgba(0,0,0,.18);
}

.entryFilterBar input,
.entryFilterBar select{
  margin-bottom:0;
  font-size:14px;
}

.entrySearch{
  margin-bottom:10px !important;
}

.entriesControlGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.entriesControlGrid select:last-child{
  grid-column:1 / -1;
}

.entryFeedSummary{
  margin-top:10px;
  font-size:12px;
  font-weight:800;
  color:rgba(0,0,0,.58);
}

.entryReturnTop{
  all:unset;
  box-sizing:border-box;
  position:fixed;
  right:calc(env(safe-area-inset-right, 0px) + 12px);
  bottom:calc(env(safe-area-inset-bottom, 0px) + 12px);
  z-index:9000;
  width:42px;
  height:42px;
  border-radius:999px;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(17,17,17,.84);
  color:white;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 10px 24px rgba(0,0,0,.22);
  font-size:22px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

.entryReturnTop:active{
  transform:scale(.94);
}

.emptyEntries{
  margin-top:12px;
  padding:18px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.88);
  border:1px solid rgba(0,0,0,.08);
  color:rgba(0,0,0,.62);
  font-weight:800;
  text-align:center;
}

/* TABS */
.tabs{
  display:flex;
  gap:8px;
  margin-bottom:14px;
  flex-wrap:wrap;
}

.tabBtn{
  flex:1;
  min-width:120px;
  padding:12px;
  border:none;
  border-radius:14px;
  font-weight:800;
  cursor:pointer;
  background:rgba(255,255,255,.25);
  color:white;
  box-shadow:none;
}

.tabBtn.active{
  background:rgba(255,255,255,.85);
  color:#111;
}

.section{ display:none; }
.section.active{ display:block; }

#sectionEntries{
  padding-bottom:24px;
}

#sectionEntries.active .entryReturnTop{
  display:flex;
}

/* JOURNAL COMPOSER */

.replyPill{
  display:none;
  margin:10px 0;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(0,0,0,.05);
  border:1px solid rgba(0,0,0,.08);
}

.replyPill .label{
  font-size:12px;
  font-weight:900;
  color:rgba(0,0,0,.55);
  margin-bottom:6px;
}

.replyPill .text{
  font-size:14px;
  line-height:1.35;
}

.replyPill.show{ display:block; }

/* Romantic new-entry badge */
.tabBadge{
  display:none;
  align-items:center;
  justify-content:center;
  margin-left:6px;
  padding:2px 8px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  background:rgba(255,255,255,.85);
  color:#FF2D55;
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 6px 14px rgba(0,0,0,.10);
}

.tabBadge.show{
  display:inline-flex;
}

/* Toast */
.toast{
  display:none;
  position:fixed;
  left:50%;
  bottom:calc(env(safe-area-inset-bottom) + 18px);
  transform:translateX(-50%);
  max-width:420px;
  width:calc(100% - 40px);
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(14px);
  border:1px solid rgba(0,0,0,.08);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
  color:#111;
  font-weight:800;
  font-size:14px;
  line-height:1.35;
  z-index:9999;
}

.toastSub{
  display:block;
  margin-top:4px;
  font-weight:700;
  color:rgba(0,0,0,.60);
}

.pickRow{
  display:flex;
  gap:10px;
  margin-bottom:10px;
}

.pickBtn{
  flex:1;
  padding:12px;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.10);
  background:rgba(0,0,0,.03);
  color:#111;
  font-weight:800;
  font-size:14px;
  cursor:pointer;
  box-shadow:none;
}


.pickBtn:active{
  transform:scale(.98);
}

.fileStatus{
  margin-top:-2px;
  margin-bottom:10px;
  font-size:13px;
  font-weight:800;
  color:rgba(0,0,0,.60);
}

.fileStatus strong{
  color:rgba(0,0,0,.78);
}

.thumbWrap{
  margin-top:6px;
}

.thumb{
  width:100%;
  max-height:200px;
  object-fit:cover;
  border-radius:14px;
  display:none;
  box-shadow:0 10px 22px rgba(0,0,0,.12);
}

.uploadOverlay{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.55);
  backdrop-filter:blur(10px);
  z-index:10000;
}

.uploadCard{
  min-width:220px;
  max-width:300px;
  padding:22px 20px;
  border-radius:20px;
  background:rgba(255,255,255,.96);
  box-shadow:0 18px 45px rgba(0,0,0,.20);
  border:1px solid rgba(0,0,0,.06);
  text-align:center;
}

.uploadSpinner{
  width:34px;
  height:34px;
  margin:0 auto 12px;
  border-radius:50%;
  border:3px solid rgba(0,0,0,.12);
  border-top:3px solid #007AFF;
  animation:spin 1s linear infinite;
}

.uploadTitle{
  font-size:16px;
  font-weight:800;
  color:#111;
}

.uploadSub{
  margin-top:6px;
  font-size:13px;
  font-weight:700;
  color:rgba(0,0,0,.58);
}

button.isBusy{
  opacity:.65;
  pointer-events:none;
}

/* SCRAPBOOK */
#sectionScrapbook{
  padding-bottom:24px;
}

.scrapbookControls{
  margin-top:30px;
  padding:20px;
  border-radius:20px;
  background:#fffaf2;
  border:1px solid rgba(90,54,35,.12);
  box-shadow:0 12px 30px rgba(0,0,0,.18);
  color:#2b2522;
}

.scrapbookControls h2{
  margin:0 0 8px;
  font-size:24px;
}

.scrapbookControls p{
  margin:0 0 14px;
  line-height:1.45;
  color:rgba(43,37,34,.72);
}

.scrapbookActionGrid{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}

.scrapbookActionGrid button{
  margin:0;
}

.scrapbookPrimary{
  background:#b5485b;
}

.scrapbookSecondary{
  background:#2f6f75;
}

.scrapbookStatus{
  margin-top:12px;
  font-size:13px;
  font-weight:800;
  color:rgba(43,37,34,.62);
}

.scrapbookPrintNote{
  margin-top:10px;
  padding:10px 12px;
  border-radius:12px;
  background:#e8f0ed;
  color:#235a60;
  font-size:12px;
  font-weight:800;
  line-height:1.35;
}

.scrapbookBook{
  margin-top:18px;
}

.scrapbookPage{
  position:relative;
  overflow:hidden;
  margin:16px 0;
  min-height:620px;
  padding:26px;
  border-radius:24px;
  background:#fff6ea;
  color:#2b2522;
  border:1px solid rgba(101,67,48,.12);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
  overflow-wrap:anywhere;
}

.scrapbookPage::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(181,72,91,.08) 0 1px, transparent 1px 100%),
    linear-gradient(180deg, rgba(47,111,117,.07) 0 1px, transparent 1px 100%);
  background-size:28px 28px;
  opacity:.55;
}

.scrapbookPage::after{
  content:"A + N  /  Djibouti - Destin";
  position:absolute;
  left:26px;
  right:26px;
  bottom:16px;
  pointer-events:none;
  color:rgba(47,111,117,.42);
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-align:center;
}

.scrapbookPage > *{
  position:relative;
  z-index:1;
}

.scrapbookSticker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  max-width:100%;
  padding:8px 12px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(101,67,48,.18);
  color:#b5485b;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
  box-shadow:0 10px 20px rgba(74,49,36,.10);
}

.coverSticker{
  align-self:flex-start;
  transform:rotate(-3deg);
}

.letterSticker,
.statsSticker,
.gallerySticker,
.closingSticker{
  margin-bottom:14px;
  transform:rotate(-2deg);
}

.coverMark,
.coverKicker,
.pageEyebrow,
.letterEyebrow{
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:12px;
  font-weight:900;
  color:#2f6f75;
}

.scrapbookCover{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  background:#fff3e3;
}

.scrapbookLetter{
  background:#edf6f4;
}

.scrapbookStatsPage{
  background:#fff1f5;
}

.scrapbookTimelinePage{
  background:#fff7ed;
}

.scrapbookTimelinePage:nth-of-type(odd){
  background:#f3f7fb;
}

.scrapbookGalleryPage{
  background:#f1f6ef;
}

.scrapbookClosingPage{
  background:#f6f0fb;
}

.coverTitleBlock{
  margin:70px 0;
}

.coverTitleBlock h1{
  margin:10px 0 14px;
  font-size:42px;
  line-height:1.02;
  color:#321f24;
}

.coverTitleBlock p{
  max-width:310px;
  margin:0;
  font-size:20px;
  line-height:1.35;
  color:#6f3f4c;
}

.coverRoute{
  margin-top:22px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.coverRoute span{
  display:inline-flex;
  padding:9px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(101,67,48,.14);
  color:#2f6f75;
  font-size:13px;
  font-weight:900;
}

.coverRoute strong{
  color:#b5485b;
  font-size:20px;
}

.coverMeta{
  display:flex;
  flex-direction:column;
  gap:8px;
  font-weight:900;
  color:#3e4f4d;
}

.letterPaper{
  min-height:520px;
  padding:24px;
  border-radius:18px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(101,67,48,.12);
}

.letterPaper h2,
.scrapbookStatsPage h2,
.monthHeader h2,
.scrapbookGalleryPage h2,
.scrapbookClosingPage h2,
.scrapbookEmptyPage h2{
  margin:10px 0 14px;
  font-size:31px;
  line-height:1.08;
  color:#321f24;
}

.letterPaper p{
  font-size:18px;
  line-height:1.65;
  color:#3b302c;
}

.letterSignature{
  margin-top:28px;
  font-size:26px;
  font-weight:900;
  color:#b5485b;
}

.scrapbookStatsGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:22px;
}

.scrapbookStat{
  min-height:92px;
  padding:16px;
  border-radius:18px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(101,67,48,.12);
}

.scrapbookStat strong{
  display:block;
  font-size:32px;
  line-height:1;
  color:#b5485b;
}

.scrapbookStat span{
  display:block;
  margin-top:8px;
  font-size:13px;
  font-weight:900;
  color:#4d5d5b;
}

.scrapbookDateBand{
  margin-top:18px;
  padding:16px;
  border-radius:18px;
  background:#e8f0ed;
  border:1px solid rgba(47,111,117,.16);
  display:grid;
  gap:12px;
}

.scrapbookDateBand span{
  display:block;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:#2f6f75;
}

.scrapbookDateBand strong{
  display:block;
  margin-top:4px;
  line-height:1.35;
}

.monthHeader{
  padding-bottom:16px;
  margin-bottom:18px;
  border-bottom:2px dashed rgba(181,72,91,.28);
}

.monthRibbon{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
  color:#2f6f75;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.monthRibbon span{
  flex:1;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(47,111,117,.35), rgba(181,72,91,.45));
}

.monthHeader h2{
  margin-bottom:8px;
}

.monthHeader p{
  margin:0;
  font-weight:900;
  color:#5d625d;
}

.monthKeepsake{
  margin-top:34px;
  padding:18px;
  border-radius:18px;
  background:rgba(255,255,255,.72);
  border:1px dashed rgba(181,72,91,.30);
  color:#3b302c;
}

.monthKeepsake strong{
  display:block;
  margin-bottom:8px;
  color:#b5485b;
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.monthKeepsake span{
  display:block;
  font-size:18px;
  line-height:1.5;
}

.spreadHeader{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
  padding-bottom:14px;
  border-bottom:2px dashed rgba(47,111,117,.22);
}

.spreadHeader h2{
  margin:6px 0 0;
  font-size:26px;
  line-height:1.1;
  color:#321f24;
}

.spreadCount{
  flex:0 0 auto;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(101,67,48,.14);
  color:#b5485b;
  font-size:12px;
  font-weight:900;
}

.scrapbookEntryGrid{
  display:grid;
  gap:18px;
}

.scrapbookSpreadPage .scrapbookEntryGrid{
  align-items:start;
}

.singleEntrySpread .scrapbookEntryGrid{
  display:block;
}

.scrapbookEntry{
  position:relative;
  padding:18px;
  border-radius:18px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(101,67,48,.13);
  box-shadow:0 10px 24px rgba(74,49,36,.12);
  overflow:hidden;
}

.scrapbookEntry.alex{
  border-left:6px solid #3178c6;
}

.scrapbookEntry.nathalia{
  border-left:6px solid #b5488d;
}

.scrapbookTape{
  position:absolute;
  top:-11px;
  width:78px;
  height:24px;
  border-radius:4px;
  background:rgba(244,198,93,.55);
  border:1px solid rgba(156,103,24,.18);
  transform:rotate(-4deg);
}

.scrapbookTape.right{
  right:24px;
  transform:rotate(4deg);
}

.scrapbookTape.left{
  left:24px;
}

.scrapbookCornerMark{
  position:absolute;
  right:-28px;
  bottom:-28px;
  width:78px;
  height:78px;
  border-radius:50%;
  background:rgba(181,72,91,.08);
  border:1px solid rgba(181,72,91,.12);
}

.scrapbookEntryHeader{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

.scrapbookEntryIdentity{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
}

.scrapbookWho{
  display:inline-flex;
  padding:7px 11px;
  border-radius:999px;
  background:#e8f0ed;
  color:#235a60;
  font-size:13px;
  font-weight:900;
}

.scrapbookLocation{
  display:inline-flex;
  padding:6px 9px;
  border-radius:999px;
  background:rgba(244,198,93,.22);
  color:#7d5717;
  border:1px solid rgba(156,103,24,.13);
  font-size:12px;
  font-weight:900;
}

.scrapbookEntry.nathalia .scrapbookWho{
  background:#f4e3ec;
  color:#8b2f62;
}

.scrapbookEntry.nathalia .scrapbookLocation{
  background:rgba(181,72,141,.10);
  color:#8b2f62;
  border-color:rgba(181,72,141,.14);
}

.scrapbookEntryHeader time{
  max-width:150px;
  text-align:right;
  font-size:12px;
  line-height:1.35;
  font-weight:900;
  color:rgba(43,37,34,.58);
}

.scrapbookPrompt{
  margin:12px 0;
  padding:12px;
  border-radius:14px;
  background:#fff8e8;
  border-left:4px solid #d4a13d;
  border-top:1px solid rgba(212,161,61,.14);
}

.scrapbookPrompt span{
  display:block;
  margin-bottom:6px;
  font-size:12px;
  font-weight:900;
  color:#8c611b;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.scrapbookPrompt p{
  margin:0;
  line-height:1.45;
}

.scrapbookText{
  margin-top:12px;
  font-size:17px;
  line-height:1.55;
  white-space:pre-wrap;
  color:#332925;
}

.scrapbookPhotoFrame{
  margin:16px 0 0;
  padding:10px 10px 20px;
  border-radius:10px;
  background:#fff;
  box-shadow:0 12px 24px rgba(44,31,24,.18);
  transform:rotate(-1deg);
}

.scrapbookEntry:nth-child(even) .scrapbookPhotoFrame{
  transform:rotate(1deg);
}

.scrapbookPhotoFrame img{
  display:block;
  width:100%;
  max-height:420px;
  object-fit:contain;
  border-radius:6px;
  background:#f7f2ec;
}

.scrapbookLink{
  display:block;
  margin-top:14px;
  padding:11px 12px;
  border-radius:14px;
  background:#e8f0ed;
  color:#235a60;
  font-size:14px;
  font-weight:900;
  text-decoration:none;
}

.scrapbookLoved{
  margin-top:12px;
  color:#b5485b;
  font-size:13px;
  font-weight:900;
  padding-top:10px;
  border-top:1px dashed rgba(181,72,91,.24);
}

.scrapbookGalleryGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:18px;
}

.featuredGalleryTile{
  grid-column:1 / -1;
}

.galleryTile{
  margin:0;
  padding:9px;
  border-radius:14px;
  background:#fff;
  box-shadow:0 12px 24px rgba(44,31,24,.15);
  break-inside:avoid;
}

.galleryTile img{
  display:block;
  width:100%;
  aspect-ratio:1 / 1;
  object-fit:contain;
  border-radius:8px;
  background:#f7f2ec;
}

.galleryTile figcaption{
  margin-top:8px;
  font-size:12px;
  line-height:1.35;
  color:#3d332f;
}

.galleryTile figcaption strong{
  display:block;
  color:#b5485b;
}

.tile1,
.tile4{
  transform:rotate(-1.3deg);
}

.tile2,
.tile5{
  transform:rotate(1.2deg);
}

.closingCard{
  min-height:520px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.closingCard h2{
  font-size:38px;
}

.closingCard p{
  margin:0;
  font-size:24px;
  line-height:1.35;
  color:#6f3f4c;
}

.closingNames{
  margin-top:34px;
  font-size:22px;
  font-weight:900;
  color:#2f6f75;
}

.scrapbookEmptyPage{
  min-height:320px;
}

.scrapbookEmptyPage p{
  font-size:17px;
  line-height:1.45;
}

@media (min-width:760px){
  body.scrapbookMode .container{
    max-width:760px;
  }

  .scrapbookActionGrid{
    grid-template-columns:1fr 1fr;
  }

  .scrapbookEntryGrid{
    grid-template-columns:1fr 1fr;
  }

  .scrapbookEntry.hasScrapbookPhoto{
    grid-column:span 2;
  }
}

@media print{
  @page{
    size:6.25in 9.25in;
    margin:0;
  }

  html,
  body{
    display:block !important;
    min-height:auto !important;
    margin:0 !important;
    padding:0 !important;
    background:#fff !important;
    color:#2b2522 !important;
    print-color-adjust:exact;
    -webkit-print-color-adjust:exact;
  }

  .container{
    width:100% !important;
    max-width:none !important;
  }

  .header,
  .tabs,
  .scrapbookControls,
  #toast,
  #uploadOverlay,
  .entryReturnTop{
    display:none !important;
  }

  .section{
    display:none !important;
  }

  #sectionScrapbook{
    display:block !important;
    padding:0 !important;
  }

  .scrapbookBook{
    margin:0 !important;
  }

  .scrapbookPage::before{
    background:
      linear-gradient(90deg, #f2e8dd 0 1px, transparent 1px 100%),
      linear-gradient(180deg, #e7efec 0 1px, transparent 1px 100%);
    background-size:.25in .25in;
    opacity:1;
  }

  .scrapbookPage::after{
    bottom:.32in;
    color:#7e9790;
  }

  .scrapbookPage{
    width:6.25in !important;
    height:9.25in !important;
    min-height:9.25in !important;
    margin:0 !important;
    padding:.625in .625in .75in .75in !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    break-after:auto;
    page-break-after:auto;
    overflow:hidden !important;
    print-color-adjust:exact;
    -webkit-print-color-adjust:exact;
  }

  .scrapbookPage:nth-of-type(even){
    padding-left:.625in !important;
    padding-right:.75in !important;
  }

  .scrapbookPage:nth-of-type(odd){
    padding-left:.75in !important;
    padding-right:.625in !important;
  }

  .scrapbookCover,
  .scrapbookLetter,
  .scrapbookStatsPage,
  .scrapbookClosingPage,
  .scrapbookMonthIntroPage,
  .scrapbookSpreadPage,
  .scrapbookGalleryPage{
    min-height:9.25in !important;
    break-after:page;
    page-break-after:always;
  }

  .scrapbookCover{
    background:#fff3e3 !important;
  }

  .scrapbookLetter{
    background:#edf6f4 !important;
  }

  .scrapbookStatsPage{
    background:#fff1f5 !important;
  }

  .scrapbookTimelinePage{
    background:#fffaf2 !important;
    break-after:page;
    page-break-after:always;
  }

  .scrapbookTimelinePage:nth-of-type(odd){
    background:#f7fbff !important;
  }

  .scrapbookClosingPage{
    background:#f6f0fb !important;
  }

  .scrapbookTimelinePage{
    min-height:auto;
  }

  .scrapbookMonthIntroPage,
  .scrapbookSpreadPage,
  .scrapbookGalleryPage{
    min-height:9.25in !important;
  }

  .scrapbookGalleryPage{
    display:flex !important;
    flex-direction:column;
  }

  .scrapbookPage:last-child{
    break-after:auto;
    page-break-after:auto;
  }

  .coverTitleBlock h1{
    font-size:36px;
  }

  .coverTitleBlock{
    margin:.65in 0;
  }

  .coverTitleBlock p{
    font-size:17px;
  }

  .letterPaper h2,
  .scrapbookStatsPage h2,
  .monthHeader h2,
  .scrapbookGalleryPage h2,
  .scrapbookClosingPage h2,
  .scrapbookEmptyPage h2{
    font-size:26px;
  }

  .letterPaper p{
    font-size:15px;
    line-height:1.52;
  }

  .letterPaper{
    background:rgba(255,255,255,.82) !important;
  }

  .scrapbookSticker{
    box-shadow:none;
    background:#fff !important;
    border-color:rgba(101,67,48,.22) !important;
  }

  .coverRoute span,
  .scrapbookWho,
  .scrapbookLocation,
  .scrapbookLink{
    border:1px solid rgba(101,67,48,.14);
  }

  .scrapbookStatsGrid{
    grid-template-columns:1fr 1fr;
    gap:.12in;
  }

  .scrapbookStat{
    min-height:.75in;
    padding:.12in;
  }

  .scrapbookStat strong{
    font-size:25px;
  }

  .monthHeader{
    margin-bottom:.14in;
    padding-bottom:.11in;
  }

  .monthHeader h2{
    font-size:25px;
  }

  .monthKeepsake{
    margin-top:.38in;
    background:rgba(255,255,255,.82) !important;
  }

  .monthKeepsake span{
    font-size:16px;
  }

  .spreadHeader{
    margin-bottom:.16in;
    padding-bottom:.12in;
  }

  .spreadHeader h2{
    font-size:24px;
  }

  .scrapbookEntryGrid{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:.16in;
  }

  .singleEntrySpread .scrapbookEntryGrid,
  .photoSpreadPage .scrapbookEntryGrid{
    display:block !important;
  }

  .scrapbookEntry,
  .scrapbookStat,
  .scrapbookDateBand{
    break-inside:avoid;
    page-break-inside:avoid;
  }

  .scrapbookEntry{
    margin:0 0 .14in !important;
    padding:.14in !important;
    background:rgba(255,255,255,.86) !important;
    box-shadow:none;
    border:1px solid rgba(101,67,48,.18);
    break-inside:avoid;
    page-break-inside:avoid;
    overflow:hidden;
  }

  .scrapbookEntry.hasScrapbookPhoto{
    grid-column:auto;
  }

  .photoSpreadPage .scrapbookEntry.hasScrapbookPhoto,
  .singleEntrySpread .scrapbookEntry.hasScrapbookPhoto{
    grid-column:auto;
  }

  .tile1,
  .tile2,
  .tile4,
  .tile5,
  .scrapbookPhotoFrame,
  .scrapbookEntry:nth-child(even) .scrapbookPhotoFrame{
    transform:none !important;
  }

  .scrapbookTape{
    opacity:.72;
  }

  .scrapbookTape.left{
    transform:rotate(-4deg) !important;
  }

  .scrapbookTape.right{
    transform:rotate(4deg) !important;
  }

  .scrapbookCornerMark{
    background:rgba(181,72,91,.08) !important;
  }

  .scrapbookEntryIdentity{
    gap:6px;
  }

  .scrapbookText{
    font-size:12.8px;
    line-height:1.38;
  }

  .scrapbookPrompt{
    margin:.1in 0;
    padding:.1in;
    font-size:12.4px;
  }

  .scrapbookPhotoFrame{
    margin:.12in 0 0;
    padding:.08in .08in .13in;
    background:#fff !important;
    box-shadow:none;
    border:1px solid rgba(101,67,48,.16);
    break-inside:avoid;
    page-break-inside:avoid;
  }

  .scrapbookPhotoFrame img,
  .scrapbookPhotoFrame img{
    width:100% !important;
    height:auto !important;
    max-height:2.75in !important;
    object-fit:contain !important;
    background:#f7f2ec !important;
    border-radius:4px;
  }

  .photoOnlyScrapbookEntry .scrapbookPhotoFrame img{
    max-height:4.15in !important;
  }

  .longScrapbookEntry .scrapbookPhotoFrame img{
    max-height:2.0in !important;
  }

  .scrapbookGalleryGrid{
    flex:1;
    min-height:0;
    display:grid !important;
    grid-template-columns:1fr 1fr;
    grid-template-rows:minmax(0, 1.16fr) minmax(0, .84fr);
    gap:.16in;
  }

  .scrapbookGalleryGrid.count1{
    grid-template-columns:1fr;
    grid-template-rows:1fr;
  }

  .scrapbookGalleryGrid.count2{
    grid-template-rows:1fr;
  }

  .galleryTile{
    margin:0 !important;
    padding:.1in !important;
    background:#fff !important;
    box-shadow:none;
    border:1px solid rgba(101,67,48,.14);
    display:grid;
    grid-template-rows:minmax(0, 1fr) auto;
    min-height:0;
    overflow:hidden;
    break-inside:avoid;
    page-break-inside:avoid;
  }

  .featuredGalleryTile{
    grid-column:1 / -1;
  }

  .galleryTile img{
    aspect-ratio:auto !important;
    display:block;
    width:100% !important;
    height:100% !important;
    min-height:0;
    max-height:none !important;
    object-fit:contain !important;
    background:#f7f2ec !important;
    border-radius:4px;
  }

  .galleryTile figcaption span{
    display:-webkit-box;
    max-height:28px;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
  }

  a{
    color:inherit !important;
    text-decoration:none !important;
  }
}