:root{color-scheme:light;--paper:#fff;--ink:#292821;--muted:#6b685c;--ground:#f5f1e8;--accent:#576248;--rule:#d7d1c4;font-family:ui-rounded,"Avenir Next",Avenir,system-ui,sans-serif;color:var(--ink);background:var(--ground)}
*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:4px}button,select,input{font:inherit;color:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.3}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip:focus{position:fixed;z-index:10;left:20px;top:20px;background:white;padding:14px}
.topbar{max-width:1100px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:22px 30px;font-size:13px;gap:12px}.back-link{text-decoration:none;white-space:nowrap}.back-link span{margin-right:7px}.tools{display:flex;gap:8px}.tools button{border:1px solid var(--rule);border-radius:999px;background:transparent;min-height:44px;padding:9px 14px;font-size:12px}.tools button:hover{background:#eae5da}.tools button span[aria-hidden]{font-size:17px;margin-right:4px}
main{width:min(100% - 36px,640px);margin:0 auto;outline:none}.book-label{display:flex;justify-content:space-between;align-items:center;margin:9px 3px 14px;font-size:10px;letter-spacing:.14em}.book-label span:first-child{font-weight:650}.book-label span:last-child{color:var(--muted);letter-spacing:.04em}.book-shell{background:#e7e0d3;border:1px solid #d9d2c4;border-radius:5px 10px 9px 5px;padding:0 5px 5px 0;box-shadow:0 7px 14px #40382809,0 24px 50px #40382808}.book{position:relative;border:1px solid #e9e6de;border-radius:3px 7px 6px 3px;background:var(--paper);overflow:hidden;touch-action:pan-y pinch-zoom;user-select:text;outline-offset:6px!important}.book:before{content:"";position:absolute;inset:0 auto 0 0;width:8px;background:linear-gradient(90deg,#00000004,transparent);pointer-events:none;z-index:1}.book-page{min-height:560px;display:flex;flex-direction:column;align-items:center;padding:44px 34px 22px;text-align:center;position:relative;justify-content:flex-start}.prose{width:100%;min-height:106px;display:flex;flex-direction:column;justify-content:center}h1{font-size:clamp(40px,7vw,58px);line-height:1.12;letter-spacing:-.035em;margin:8px 0 13px;font-weight:720}.byline{font-size:15px;margin:0}.story-words{font-size:clamp(20px,3.9vw,27px);line-height:1.48;margin:0;letter-spacing:-.022em}.drawing-frame{width:100%;height:320px;display:flex;align-items:center;justify-content:center;margin:8px 0 0}.drawing{height:100%;width:100%;overflow:hidden;max-width:420px}.page-1 .drawing{max-width:320px}.page-1 .drawing-frame{height:300px;margin-top:12px}.page-2 .drawing{max-width:480px}.aside-words{font-size:clamp(17px,3.1vw,22px);line-height:1.4;margin:12px 0 0}.printed-number{position:absolute;bottom:14px;color:#777;font-size:11px}.page-2 .drawing-frame{height:260px}.invitation{min-height:auto}.invitation h2{font-size:30px;letter-spacing:-.025em;margin:3px 0 10px}.invitation p{font-size:19px;line-height:1.5;margin:0}.drawing-space{width:85%;height:205px;border:1px solid #d2d2d2;margin:24px 0 22px;border-radius:7px}.credits{font-size:11px;line-height:1.7;color:#595959;margin:0;max-width:420px}
.page-controls{display:flex;align-items:center;justify-content:center;gap:26px;padding-top:20px}.page-controls>button{border:1px solid #c7bfaf;background:transparent;border-radius:50%;width:48px;height:48px;font-size:25px;line-height:1}.page-controls>button:hover:enabled{background:var(--ink);color:var(--ground)}.page-progress{width:190px;text-align:center;position:relative;padding-top:2px}#page-select{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer;z-index:1}.page-progress:focus-within{outline:3px solid var(--accent);outline-offset:6px;border-radius:2px}#page-count{font-size:12px;letter-spacing:.14em}.progress-track{height:2px;background:#d5cebf;margin-top:10px}#progress-fill{display:block;height:100%;width:11.111%;background:#6e775d}.hint{text-align:center;color:var(--muted);font-size:11px;line-height:1.6;margin:15px 0 0}footer{max-width:1000px;margin:30px auto 0;padding:20px 30px 26px;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:10px;color:var(--muted)}footer a{text-decoration:none}.publisher{display:flex;align-items:center;gap:9px}.publisher img{object-fit:contain}.share-fallback{border:1px solid var(--rule);border-radius:6px;background:white;padding:16px;margin-top:18px;font-size:14px}.share-fallback label{display:block;margin-bottom:8px}.share-fallback input{width:100%;padding:10px;border:1px solid var(--rule);font-size:12px}.share-fallback button{margin-top:10px;min-height:44px;padding:8px 18px;background:var(--ground);border:1px solid var(--rule);border-radius:4px}.fallback{text-align:center;line-height:1.6}
.motion{animation-duration:3.2s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;transform-box:fill-box}.cover{animation-name:cover;animation-duration:3.2s}.computer{animation-name:computer;animation-duration:3.4s}.celebration{animation-name:celebration;animation-duration:2.8s}.saucer{animation-name:saucer;animation-duration:3.6s}.signal{animation-name:signal;animation-duration:2.8s}.note{animation-name:note;animation-duration:3.8s}.pencil{animation-name:pencil;animation-duration:3s}.idea{animation-name:idea;animation-duration:3s}.walk{animation-name:walk;animation-duration:2.8s}.motion-paused .motion{animation-play-state:paused!important}.motion-reduced .motion{animation:none!important}
@keyframes cover{0%,100%{transform:rotate(-2deg) translateY(0)}35%{transform:rotate(2deg) translateY(-12px)}70%{transform:rotate(-1deg) translateY(-3px)}}
@keyframes computer{0%,100%{transform:rotate(0) translateY(0)}30%{transform:rotate(-3deg) translateY(-13px)}55%{transform:rotate(2deg) translateY(-7px)}75%{transform:rotate(0) translateY(0)}}
@keyframes celebration{0%,100%{transform:scale(1) translateY(0)}38%{transform:scale(1.22) translateY(-14px)}65%{transform:scale(1.06) translateY(-3px)}}
@keyframes saucer{0%,100%{transform:translate(-16px,0) rotate(-2deg)}50%{transform:translate(20px,-28px) rotate(2deg)}}
@keyframes signal{0%,100%{opacity:.25}35%,60%{opacity:1}}
@keyframes note{0%,100%{transform:rotate(-1.7deg) translateY(0)}45%{transform:rotate(2deg) translateY(-12px)}72%{transform:rotate(.5deg) translateY(-3px)}}
@keyframes pencil{0%,15%,85%,100%{transform:rotate(0) translate(0,0)}30%,55%{transform:rotate(-6deg) translate(10px,-6px)}42%,68%{transform:rotate(4deg) translate(-5px,3px)}}
@keyframes idea{0%,100%{transform:scale(1) rotate(-2deg)}42%{transform:scale(1.16) rotate(3deg)}72%{transform:scale(1.04) rotate(0)}}
@keyframes walk{0%,50%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-18px) rotate(-2deg)}75%{transform:translateY(-18px) rotate(2deg)}}
@media(prefers-reduced-motion:reduce){.motion{animation:none!important}}
@media(max-width:600px){.topbar{padding:12px 16px 16px;gap:8px;font-size:11px}.tools{gap:6px}.tools button{padding:8px 11px;font-size:11px}.tools button span[aria-hidden]{font-size:14px}main{width:calc(100% - 24px);max-width:440px}.book-label{margin:5px 4px 12px;font-size:9px}.book-page{min-height:470px;padding:27px 18px 26px}.prose{min-height:100px}.story-words{font-size:21px;line-height:1.48;letter-spacing:-.03em}.drawing-frame{height:290px;margin-top:4px}.page-1 .drawing-frame{height:270px}.page-2 .drawing-frame{height:230px}.page-2 .story-words{font-size:20px}.aside-words{font-size:17px;margin-top:8px}.byline{font-size:13px}.page-controls{padding-top:18px;gap:20px}.page-controls>button{width:46px;height:46px}.page-progress{width:160px}.hint{font-size:10px;margin:14px 10px 0}footer{padding:18px 18px 24px;margin-top:24px;font-size:9px;gap:10px}.publisher{gap:5px}.publisher img{width:22px}.invitation h2{font-size:26px}.invitation p{font-size:17px}.drawing-space{height:170px;width:95%;margin:20px 0}.credits{font-size:10px}.page-9{padding-left:15px;padding-right:15px}}
@media(max-width:360px){.back-link{font-size:10px}.tools button{padding:8px;font-size:10px}.book-page{padding-left:12px;padding-right:12px}.story-words,.page-2 .story-words{font-size:18px}.book-page{min-height:450px}.drawing-frame{height:270px}.publisher span{max-width:120px}.hint{font-size:9px}}
@media(max-height:750px) and (min-width:601px){.topbar{padding:12px 28px}main{max-width:530px}.book-page{min-height:460px;padding-top:27px}.drawing-frame{height:270px}.page-1 .drawing-frame{height:250px}.page-2 .drawing-frame{height:210px}.page-controls{padding-top:14px}.drawing-space{height:150px}.hint{margin-top:10px}footer{margin-top:12px;padding-top:10px}}
@media print{.topbar,.book-label,.page-controls,.hint,footer,.share-fallback{display:none!important}body{background:white}main{width:100%}.book-shell,.book{border:0;box-shadow:none;padding:0}.book-page[hidden],.book-page{display:flex!important;break-after:page}.motion{animation:none!important}}