.book-demo{min-width:0;text-align:center}.book-demo>p{font-size:12px;color:var(--muted)}
#signChoices[hidden]{display:none}
#signChoices .radio-card{text-align:left;background:#fff;color:var(--ink)}#signChoices .radio-card.active{background:var(--mint)}#signChoices .radio-card span{display:block;margin-top:4px}
.physical-book{position:relative;perspective:1600px;margin:30px 0;min-height:510px;isolation:isolate}
.physical-book .physical-spread{opacity:0;transition:opacity .45s .1s}
.book-cover{position:absolute;inset:0 0 0 50%;z-index:3;transform-origin:left center;transition:transform 1.1s ease,opacity .3s .6s;backface-visibility:hidden;display:flex;flex-direction:column;justify-content:center;padding:28px;background:linear-gradient(135deg,#f6e8db,#fff8ee 60%,#f2dac8);box-shadow:8px 16px 28px #234f3d26;border:1px solid #dfcbb4;border-radius:2px 12px 12px 2px;color:#234f3d}
.book-cover h2{font:32px/1.15 Georgia,serif}.book-cover .cover-flower{font-size:64px;color:#b37462}.book-cover p{font-size:15px}
.is-open .book-cover{transform:rotateY(-180deg);opacity:0;pointer-events:none}.is-open .physical-spread{opacity:1}
.inside-spread{position:relative;display:grid;grid-template-columns:1fr 1fr;background:#fffdf5;box-shadow:0 15px 32px #234f3d24;border:1px solid #e6dfd1;border-radius:4px;overflow:hidden;margin-bottom:24px;text-align:left}
.inside-spread:after{content:'';position:absolute;top:0;bottom:0;left:calc(50% - 9px);width:18px;background:linear-gradient(90deg,transparent,#69533916 45%,#69533940 50%,#fff8 57%,transparent);pointer-events:none}
.paper-leaf{padding:20px 16px 26px;display:grid;grid-template-columns:1fr 1fr;align-content:start;align-items:start;gap:18px 12px;background:linear-gradient(105deg,#fffefa,#fffaf0)}
.hand-note{min-width:0;position:relative;overflow-wrap:anywhere;font:12px/1.5 'Segoe Print','Comic Sans MS',cursive;transform:rotate(-3deg);padding:2px}
.hand-note p{margin:0 0 5px!important;font:inherit!important;color:inherit!important}.hand-note strong{font-size:12px;font-weight:600}.hand-note:nth-child(2n){transform:rotate(3deg);padding-top:9px}.hand-note:nth-child(3n){font-family:'Bradley Hand','Segoe Script',cursive}
.ink-0{color:#315a49}.ink-1{color:#95546d}.ink-2{color:#345a8b}.ink-3{color:#8755a0}.ink-4{color:#8a602e}.ink-5{color:#3d7476}
.card-doodle{display:block;font:20px cursive;text-align:right;line-height:1}.team-message{grid-column:1/-1;padding:13px 24px;text-align:center;border-top:1px dashed #d7cdbb;margin:0 20px 12px;font:12px/1.6 'Segoe Print','Comic Sans MS',cursive;color:#52675d;background:#fffdf5;z-index:1}
#signMessages.physical-spread{display:block;margin-top:18px}#signMessages .hand-note{font-size:14px}#signMessages .paper-leaf{grid-template-columns:1fr}.preview-inner:has(.physical-spread){padding:20px}
@media(max-width:620px){.physical-book{min-height:540px}.paper-leaf{gap:13px 8px;padding:16px 10px}.hand-note{font-size:11px}.hand-note strong{font-size:11px}.book-cover{padding:18px}.book-cover h2{font-size:25px}.team-message{font-size:11px;padding:12px 6px;margin:0 10px 10px}}
@media(prefers-reduced-motion:reduce){.book-cover,.physical-book .physical-spread{transition:none}}
.book-cover.book-cover-template{inset:0;padding:0;overflow:hidden;background:#17213a}.book-cover-template img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center}
@font-face{font-family:CardHand;src:url('/assets/fonts/Kalam-Regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:CardHand;src:url('/assets/fonts/Kalam-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
#completionInsidePreview .hand-note,#completionInsidePreview .team-message,#handwrittenStyleSample .hand-note{font-family:CardHand,'Segoe Print',cursive}
.inside-style-options{border:0;padding:0;margin:24px 0}.inside-style-options legend{font:700 22px Georgia,serif}.inside-style-choices{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0}.inside-style-choices>label{display:block;padding:16px;border:2px solid var(--line);border-radius:14px;cursor:pointer;min-width:0}.inside-style-choices>label:has(input:checked){border-color:var(--brand);background:var(--mint)}.inside-style-choices input{width:auto;margin-right:8px}.inside-style-choices label>span{display:block;font-size:13px;margin:8px 0;color:var(--muted)}.inside-style-choices .physical-spread{pointer-events:none;max-height:180px;overflow:hidden}.inside-style-choices .paper-leaf{padding:8px;gap:8px}.inside-style-choices .hand-note{font-size:9px}.inside-style-choices .hand-note strong{font-size:9px}#completionInsidePreview{max-height:560px;overflow:auto;padding:4px;margin:16px 0}#completionInsidePreview .hand-note{font-size:14px}
.bubble-layout .inside-spread{display:block;background:#fff;padding:18px}.bubble-layout .inside-spread:after{display:none}.bubble-layout .paper-leaf{display:contents}.bubble-layout .inside-spread{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.bubble-layout .hand-note{border:1px solid #e8e2d8;border-radius:12px;padding:12px;transform:none;font-family:CardHand,'Segoe Print',cursive;background:#fff0eb;color:#33453d}.bubble-layout .hand-note:nth-child(3n+2){background:#e9f6ef}.bubble-layout .hand-note:nth-child(3n){background:#f4edff}.bubble-layout .card-doodle{display:none}.bubble-layout .hand-note strong{display:block;text-align:right}.bubble-layout .team-message{grid-column:1/-1;background:#fff}.inside-style-choices .bubble-layout .inside-spread{grid-template-columns:1fr 1fr;padding:8px;gap:8px}.inside-style-choices .bubble-layout .hand-note{padding:7px}
@media(max-width:620px){.inside-style-choices{grid-template-columns:1fr}.bubble-layout .inside-spread{grid-template-columns:1fr 1fr}#completionInsidePreview .hand-note{font-size:12px}}
.inside-style-sample{display:block;width:100%;height:auto;border:1px solid #e8e2d8;border-radius:8px;margin-top:12px}

.message-symbol-picker{border:0;padding:0;margin:18px 0 0}.message-symbol-picker legend{font-size:12px;font-weight:850;color:#475467}.symbol-choices{display:flex;flex-wrap:wrap;gap:8px}.symbol-option{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--brand);cursor:pointer}.symbol-option svg{width:23px;height:23px}.symbol-option[aria-pressed="true"]{background:var(--mint);border:2px solid var(--brand)}.symbol-option:focus-visible{outline:2px solid var(--brand);outline-offset:3px}.remove-symbol[hidden]{display:none}.hand-note.has-message-symbol{transform:none}.message-symbol-row{display:flex;margin-top:5px;height:14px;align-items:center;clear:both}.placement-left{justify-content:flex-start}.placement-right{justify-content:flex-end}.chosen-symbol{display:block;width:12px;height:12px;color:inherit}.chosen-symbol svg{display:block;width:100%;height:100%}

/* The physical spread scales as a whole; viewport changes never recompose messages. */
.canonical-spread{container-type:inline-size;aspect-ratio:800/660;display:block;min-width:0}
.canonical-spread .paper-leaf{position:absolute;inset:0 50% 0 0;display:block;padding:0;background:linear-gradient(105deg,#fffefa,#fffaf0)}
.canonical-spread .paper-leaf:nth-child(2){inset:0 0 0 50%;background:linear-gradient(85deg,#fffaf0,#fffefa)}
.canonical-spread:after{left:48.8%;width:2.4%;background:linear-gradient(90deg,transparent,#69533908 28%,#69533922 47%,#69533932 50%,#fff9 54%,#fff4 65%,transparent);z-index:1}
.canonical-spread .hand-note,.canonical-spread .hand-note:nth-child(n),#completionInsidePreview .canonical-spread .hand-note{position:absolute;padding:0;margin:0;font-family:CardHand,cursive;font-weight:400;transform-origin:center;white-space:pre;overflow-wrap:normal}
.canonical-spread .hand-note p{padding:0;margin:0!important;line-height:inherit!important}
.canonical-spread .hand-note strong{display:block;font-size:inherit;font-weight:700;line-height:inherit}
.canonical-spread .card-doodle{position:absolute;display:block;width:1.5cqw;height:1.5cqw;line-height:1}
.canonical-spread .card-doodle svg{display:block;width:100%;height:100%}
.canonical-spread .message-symbol-row{height:1.75cqw;margin:0;clear:none}
.canonical-spread .chosen-symbol{width:1.5cqw;height:1.5cqw}
.canonical-spread .team-message{position:absolute;left:6.25%;right:6.25%;top:81.82%;margin:0;padding:2cqw 0 0;border:0;background:transparent;font:2cqw/1.5 CardHand,cursive;color:#52675d;white-space:pre;z-index:2}
.canonical-spread .team-message:before{content:'';position:absolute;left:8%;right:8%;top:0;height:1px;background:linear-gradient(90deg,transparent,#b9aa8c80,transparent)}
.quiet-ornament{position:absolute;font:4cqw CardHand,cursive;color:#8a602e60}
.empty-card-note{position:absolute;left:8%;top:25%;font:2cqw CardHand,cursive;color:#52675d}
.growing-card-preview{margin-top:24px;max-width:860px}.growing-card-preview summary{cursor:pointer;font-weight:700;margin-bottom:20px}
.production-front{position:relative;container-type:inline-size;aspect-ratio:595/420;min-height:0!important;overflow:hidden}
.production-front>div,.production-front>h2{visibility:hidden}
.production-front-art{position:absolute;left:4%;top:6%;width:92%;height:82%;object-fit:contain}
.production-front-name{position:absolute;left:5%;right:5%;bottom:5%;text-align:center;color:#315a49;font:2.02cqw Helvetica,Arial,sans-serif}
.production-front-photo{position:absolute;left:5.4%;bottom:13.8%;width:23.5%;aspect-ratio:1;object-fit:cover;max-width:140px;max-height:140px}
/* Inline-size containment and auto margins otherwise shrink this absolute-content front. */
@media screen{
  #signer .preview-inner>.production-front:first-child{width:100%}
}
@media print{.canonical-spread{box-shadow:none;border:0;border-radius:0;break-inside:avoid;break-after:page;print-color-adjust:exact}}
@font-face{font-family:PatrickHand;src:url('/assets/fonts/PatrickHand-Regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:Handlee;src:url('/assets/fonts/Handlee-Regular.ttf') format('truetype');font-display:swap}
