:root{--ivory:#fbf7f0;--paper:#fffdf8;--ink:#33291e;--gold:#a87a2e;--line:#c9ab7a66}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top,#fff,var(--ivory) 58%,#eadfce);color:var(--ink);font-family:Georgia,serif}header{height:164px;display:flex;align-items:center;justify-content:center;padding:8px 3vw;border-bottom:1px solid var(--line);background:#fffaf4f2;position:sticky;top:0;z-index:9}header img{display:block;width:min(720px,92vw);height:148px;object-fit:contain;object-position:center}main{max-width:1500px;margin:auto;padding:28px;display:grid;grid-template-columns:390px 1fr;gap:24px}.controls,.preview{background:#fffaf4e8;border:1px solid var(--line);border-radius:24px;box-shadow:0 16px 44px #6c47151a}.controls{padding:24px}.controls h1{font-size:32px;font-weight:400;margin:0 0 8px}.controls>p{color:#73614d;line-height:1.5}.thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.thumb{border:2px solid transparent;border-radius:12px;overflow:hidden;aspect-ratio:3/4;padding:0;background:#eee;position:relative}.thumb img{width:100%;height:100%;object-fit:cover;object-position:center}.thumb.active{border-color:var(--gold)}.thumb.active:after{content:'✓';position:absolute;right:6px;top:6px;background:var(--gold);color:#fff;border-radius:50%;width:24px;height:24px;display:grid;place-items:center}label{display:block;font:600 11px Arial;text-transform:uppercase;letter-spacing:.8px;color:#6e5b45;margin:12px 0 5px}input,textarea{display:block;width:100%;margin-top:6px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:12px;font:16px Georgia;color:var(--ink)}textarea{min-height:160px;resize:vertical;line-height:1.5}.row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.buttons{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.buttons button:nth-child(n+3){grid-column:1/-1}button{padding:13px;border-radius:10px;border:1px solid var(--gold);background:linear-gradient(135deg,#c49a55,#8b611f);color:#fff;font:15px Georgia;cursor:pointer}.alt{background:transparent;color:var(--ink)}.note{font:12px Arial!important}.preview{padding:22px}.previewTop{display:flex;justify-content:space-between;align-items:center;letter-spacing:3px;font-size:12px;margin-bottom:15px}.previewTop b{border:1px solid var(--line);padding:8px 12px;border-radius:99px;color:var(--gold)}.stage{min-height:720px;border:1px solid var(--line);border-radius:18px;background:radial-gradient(circle at 50% 38%,#fff 0,#f3e8d9 50%,#dcc7aa 100%);display:grid;place-items:center;perspective:2200px;position:relative;overflow:hidden}.book{width:min(72vw,760px);aspect-ratio:1.42/1;position:relative;transform-style:preserve-3d;transform:translateX(-25%);transition:transform 1.05s cubic-bezier(.22,.78,.2,1);filter:drop-shadow(0 28px 30px #53351538);cursor:pointer}.book.open{transform:translateX(0)}.rightPage,.cover{position:absolute;top:0;left:50%;width:50%;height:100%;border:1px solid #8c642b33;border-radius:0 12px 12px 0}.rightPage{background:linear-gradient(120deg,#fffefa,#f3e6d3);display:flex;align-items:center;justify-content:center;padding:9% 8%;box-shadow:inset 18px 0 30px #4d2e0c12}.message{width:100%;white-space:pre-wrap;text-align:center;font-family:'Segoe Script','Snell Roundhand','Brush Script MT',cursive;line-height:1.52;color:#59442e;height:100%;max-height:100%;overflow:hidden;overflow-wrap:anywhere;display:block;padding:18px 10px 22px}.cover{z-index:4;transform-origin:left center;transform-style:preserve-3d;transition:transform 1.35s cubic-bezier(.22,.78,.2,1)}.book.open .cover{transform:rotateY(-180deg)}.coverFront,.coverInside{position:absolute;inset:0;border-radius:0 12px 12px 0;backface-visibility:hidden}.coverFront{background-repeat:no-repeat;background-size:100% 100%;background-position:center}.coverFront:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#4d2e1626,transparent 16%);border-radius:inherit}.coverInside{transform:rotateY(180deg);background:linear-gradient(135deg,#fffefa,#f1e4d1);box-shadow:inset -18px 0 30px #4d2e0c12}.hint{position:absolute;bottom:28px;font-style:italic;color:#725b3d}.book:focus-visible{outline:3px solid var(--gold);outline-offset:8px}footer{text-align:center;padding:22px;letter-spacing:4px;font-size:11px;border-top:1px solid var(--line)}@media(max-width:900px){main{grid-template-columns:1fr}.preview{order:-1}.stage{min-height:560px}.book{width:min(92vw,700px)}}@media(max-width:520px){main{padding:10px}.controls,.preview{padding:14px;border-radius:16px}.stage{min-height:430px}.book{width:96vw}.row{grid-template-columns:1fr}.buttons{grid-template-columns:1fr}.buttons button:last-child{grid-column:auto}header{height:118px;padding:5px 2vw}header img{width:96vw;height:108px}}

#fontSizeValue{float:right;font:600 12px Arial;color:var(--gold);letter-spacing:0;text-transform:none}input[type=range]{padding:0;height:34px;accent-color:var(--gold);cursor:pointer}
.message{transform-origin:center center;will-change:transform}