@import"https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;1,300;1,400&family=Jost:wght@300;400;500&display=swap";:root{--ink: #1A1A1C;--bone: #F4EFE9;--rose: #B78A7A;--rose-deep: #9C6F5F;--white: #FFFFFF;--grey: #6B6662;--grey-soft: #8A847F;--line: #E4DCD3;--serif: "Cormorant Garamond", serif;--sans: "Jost", sans-serif;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: max(44px, calc(env(safe-area-inset-bottom, 0px) + 20px) )}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--ink)}body{-webkit-font-smoothing:antialiased;color:var(--ink);font-family:var(--sans);font-weight:300}button,input,textarea{font-family:var(--sans)}button{-webkit-tap-highlight-color:transparent}.screen{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.screen.fixed{height:100vh;height:100dvh;min-height:0;overflow:hidden}.bg-ink{background:var(--ink);color:var(--bone)}.bg-white{background:var(--white)}.bg-bone{background:var(--bone)}.col{width:100%;max-width:520px;margin:0 auto;padding-left:24px;padding-right:24px}.ink-band{background:var(--ink);height:var(--safe-top);flex-shrink:0}.grow{flex:1}.label{font-size:9px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:var(--grey)}.wordmark{font-size:9px;font-weight:500;letter-spacing:.3em;text-transform:uppercase;white-space:nowrap}.serif-body{font-family:var(--serif);font-size:22px;font-weight:300;line-height:1.6;white-space:pre-wrap}.serif-user{font-family:var(--serif);font-size:20px;font-weight:300;font-style:italic;line-height:1.6;color:#4a4643;white-space:pre-wrap}.monogram{display:block;object-fit:contain}.folio{display:flex;justify-content:space-between;gap:12px;font-size:9px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:var(--grey)}.bg-ink .folio{color:#9a948f}.foot{padding-bottom:var(--safe-bottom);flex-shrink:0}.btn{display:block;width:100%;padding:18px;border:none;background:var(--ink);color:var(--bone);text-align:center;font-size:10px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;cursor:pointer;text-decoration:none}.btn:disabled{opacity:.5;cursor:default}.btn-outline{background:transparent;border:1px solid currentColor}.btn-ghost{background:none;border:none;color:var(--grey);padding:14px;font-size:10px;font-weight:500;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;width:100%}.topbar{background:var(--ink);padding-top:var(--safe-top);flex-shrink:0}.topbar-inner{display:flex;align-items:center;justify-content:space-between;padding:4px 12px 6px;max-width:544px;margin:0 auto;min-height:52px}.topbar-btn{background:none;border:none;padding:12px;font-size:10px;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:#b9b3ad;cursor:pointer}.topbar-date{padding:12px;font-size:10px;letter-spacing:.12em;color:#9a948f}.pagehead{display:flex;align-items:flex-end;gap:16px;padding-top:24px}.numeral{font-family:var(--serif);font-size:88px;font-weight:300;line-height:.8;color:var(--rose-deep)}.pagehead h1{font-family:var(--serif);font-size:26px;font-weight:300;font-style:italic;line-height:1.1}.rule{border-top:1px solid var(--line)}.messages{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.msg{margin-bottom:24px;animation:fadeIn .4s ease;scroll-margin-top:22px}.margin-note{background:var(--bone);padding:16px 18px;margin-bottom:24px;animation:fadeIn .4s ease}.margin-note .label{letter-spacing:.16em;margin-bottom:6px;display:block}.thinking{font-family:var(--serif);font-size:18px;font-style:italic;color:var(--grey-soft)}.wave{display:flex;align-items:center;gap:3px;margin-top:12px}.wave span{width:3px;border-radius:2px;background:var(--ink);opacity:.3;animation:wave 1s ease-in-out infinite}.composer{display:flex;align-items:flex-end;gap:12px;border-top:1px solid var(--line);padding-top:10px}.composer textarea{flex:1;border:none;outline:none;resize:none;background:transparent;font-family:var(--serif);font-size:20px;font-weight:300;line-height:1.5;color:var(--ink);padding:8px 0;min-height:44px;max-height:140px}.composer textarea::placeholder{color:var(--grey-soft);font-style:italic;opacity:1}.send{width:44px;height:44px;border-radius:50%;border:none;background:var(--ink);color:var(--bone);font-size:14px;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center}.send:disabled{opacity:.4}.field{display:flex;flex-direction:column;gap:6px}.field label{font-size:9px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--grey)}.field input{border:none;border-bottom:1px solid #CFC6BC;border-radius:0;outline:none;padding:10px 0;font-family:var(--serif);font-size:22px;font-weight:300;color:var(--ink);background:transparent}.field input::placeholder{color:var(--grey-soft);font-style:italic}.field input:focus{border-bottom-color:var(--ink)}.day-row{display:flex;align-items:center;gap:16px;min-height:66px;width:100%;padding:0 4px 0 16px;border:none;border-left:2px solid transparent;border-bottom:1px solid var(--bone);background:none;text-align:left;cursor:pointer;color:var(--ink)}.day-row:disabled{cursor:default}.day-row .n{width:40px;font-family:var(--serif);font-size:30px;font-weight:300;line-height:1}.day-row .t{flex:1;font-family:var(--serif);font-size:20px;font-weight:300;font-style:italic;line-height:1.2}.day-row .m{font-size:9px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap}.backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#1a1a1c73;z-index:200;display:flex;align-items:flex-end;justify-content:center;animation:fade .2s ease}.sheet{width:100%;max-width:520px;max-height:90vh;max-height:90dvh;overflow-y:auto;background:var(--bone);padding:14px 24px var(--safe-bottom);box-shadow:0 -12px 40px #1a1a1c2e;animation:up .28s ease}.grabber{width:40px;height:4px;border-radius:2px;background:#d9cfc4;margin:0 auto 16px}.steps{list-style:none;display:flex;flex-direction:column;gap:8px;margin-top:8px}.steps li{display:flex;gap:12px;align-items:baseline;font-family:var(--serif);font-size:19px;font-weight:300;line-height:1.4}.steps .sn{font-size:26px;width:30px;flex-shrink:0;line-height:1}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes wave{0%,to{transform:scaleY(.3)}50%{transform:scaleY(1)}}@keyframes fade{0%{opacity:0}to{opacity:1}}@keyframes up{0%{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}@media (hover: hover){.btn:hover:not(:disabled){background:var(--rose-deep)}.btn-outline:hover:not(:disabled){background:transparent;opacity:.8}.day-row:not(:disabled):hover .t{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}}
