*{box-sizing:border-box}body{margin:0;color:#303a35;font-family:'Noto Sans KR',sans-serif}header{max-width:1120px;margin:auto;padding:26px 28px;display:flex;justify-content:space-between;align-items:center}a{color:inherit;text-decoration:none}header>a:last-child{font-size:13px}main{max-width:760px;margin:auto;padding:20px 20px 44px;text-align:center}.eyebrow{font-size:11px;letter-spacing:.19em;color:#80715c}h1{font-family:'Noto Serif KR',serif;font-weight:400;font-size:36px;margin:14px 0}p{line-height:1.9}.intro{font-size:15px;color:#625f53}#date{font-size:12px;color:#80715c}#experience{position:relative;min-height:390px;display:grid;place-items:center}#basket{position:relative;width:min(100%,540px);height:350px}.basket-art{position:absolute;width:100%;height:100%;object-fit:contain;inset:0;pointer-events:none}#cookies{position:absolute;inset:0}.cookie{position:absolute;width:25%;height:30%;background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important;transform:translate(-50%,-50%) rotate(var(--r));transition:left .65s ease,top .65s ease,transform .65s ease;cursor:pointer}.cookie img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 5px 3px #553f2825)}.cookie:hover,.cookie:focus-visible{filter:brightness(1.08);outline:2px solid #303a35;outline-offset:2px;border-radius:45%}.cookie.chosen{left:50%!important;top:44%!important;transform:translate(-50%,-50%) rotate(0) scale(1.75);z-index:30}.cookie.dim{opacity:.28}.cookie[disabled]{cursor:default}#opening{position:absolute;width:240px;height:180px;top:80px;left:50%;transform:translateX(-50%);pointer-events:none}.half{position:absolute;inset:0;background:url('assets/fortune/cookie.png') center/contain no-repeat}.half.left{clip-path:polygon(0 0,51% 0,47% 25%,53% 42%,47% 60%,51% 100%,0 100%)}.half.right{clip-path:polygon(51% 0,100% 0,100% 100%,51% 100%,47% 60%,53% 42%,47% 25%)}.cracked .left{transform:translate(-95px,-40px) rotate(-24deg);opacity:0;transition:transform 1.2s,opacity 1.2s}.cracked .right{transform:translate(95px,-40px) rotate(24deg);opacity:0;transition:transform 1.2s,opacity 1.2s}#paper{position:relative;width:min(100%,550px);padding:32px 30px;background:linear-gradient(#fbf7ecb8,#fbf7ecb8),url('assets/theme/hanji-landscape.webp') center bottom/cover;border:1px solid #cabea3;border-left:4px solid #c8b894;border-right:4px solid #c8b894;animation:unfold 1s ease both}#paper h2{font-family:'Noto Serif KR',serif;font-weight:400;font-size:25px;line-height:1.8;word-break:keep-all}.action{margin-top:26px;padding-top:22px;border-top:1px solid #cabea3}.action span{font-size:12px;color:#84715a}.action p{font-size:15px;word-break:keep-all}.signature{font-size:11px;color:#80715c;margin-top:28px}.controls{min-height:45px}button{font:inherit;padding:12px 22px;cursor:pointer}#result-actions{display:flex;justify-content:center;gap:10px}#status{min-height:28px;font-size:13px}.note{font-size:12px;color:#80776b;margin-top:28px}.home-link{font-size:13px;text-decoration:underline;text-underline-offset:4px}footer{text-align:center;padding:20px;font-size:12px;color:#80776b}[hidden]{display:none!important}@keyframes unfold{from{opacity:0;transform:scaleX(.12) scaleY(.8)}to{opacity:1;transform:scale(1)}}@media(max-width:600px){header{padding:22px 20px}main{padding-top:10px}h1{font-size:29px}#experience{min-height:330px}#basket{height:290px}#paper{padding:24px 22px}#paper h2{font-size:22px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
body .cookie:disabled{opacity:1}body .cookie.dim:disabled{opacity:.22}body .cookie.chosen{z-index:30}body .cookie:hover:not(:disabled){transform:translate(-50%,-50%) rotate(var(--r)) scale(1.07)}body .cookie.chosen:hover:not(:disabled){transform:translate(-50%,-50%) rotate(0) scale(1.82)}body h1,body #paper h2{font-weight:400}#opening{z-index:3}.cracked .left{transform:translate(-100px,-80px) rotate(-26deg);opacity:.9;transition:transform 1s,opacity 1s}.cracked .right{transform:translate(100px,-80px) rotate(26deg);opacity:.9;transition:transform 1s,opacity 1s}#paper{z-index:2}

body .cookie.tumbling{transition:none;pointer-events:none;will-change:left,top,transform}#basket{transform-origin:50% 72%}body .cookie.chosen{z-index:100!important}

body #cookies .cookie:disabled{opacity:1;transform:translate(-50%,-50%) rotate(var(--r))}body #cookies .cookie.dim:disabled{opacity:.22}body #cookies .cookie.chosen{transform:translate(-50%,-50%) rotate(0) scale(1.75)}body #cookies .cookie.tumbling{transition:none}body #cookies .cookie.chosen:hover:not(:disabled){transform:translate(-50%,-50%) rotate(0) scale(1.82)}


#gesture-hint{font-size:13px;margin:10px 0;color:#6b6256}#touch-cookie{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:250px;height:210px;z-index:110;--pressure:0;--pull:0px;touch-action:none}
body #touch-cookie .touch-half{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:url('assets/fortune/cookie.png') center/contain no-repeat;box-shadow:none;cursor:grab;touch-action:none;user-select:none;filter:drop-shadow(0 8px 5px #553f282e)}
body #touch-cookie .touch-left{clip-path:polygon(0 0,51% 0,47% 25%,53% 42%,47% 60%,51% 100%,0 100%);transform:translateX(calc(var(--pull)*-.5 - var(--pressure)*4px)) rotate(calc(var(--pressure)*-4deg))}
body #touch-cookie .touch-right{clip-path:polygon(51% 0,100% 0,100% 100%,51% 100%,47% 60%,53% 42%,47% 25%);transform:translateX(calc(var(--pull)*.5 + var(--pressure)*4px)) rotate(calc(var(--pressure)*4deg))}
.crack-mark{position:absolute;left:47%;top:19%;width:7%;height:60%;background:#744526;clip-path:polygon(48% 0,60% 0,32% 27%,76% 45%,38% 66%,61% 100%,46% 100%,24% 64%,63% 45%,18% 28%);opacity:var(--pressure);pointer-events:none}
#hold-progress{position:absolute;bottom:-15px;left:25%;width:50%;height:3px;background:#d8cbb8;pointer-events:none}#hold-progress span{display:block;width:0;height:100%;background:#6b5943}
.gift-actions{margin:28px auto 12px;padding-top:22px;border-top:1px solid #cbc3b2;max-width:550px}.gift-actions>p{font-size:12px;color:#80715c}.gift-actions>button{background:transparent}#gift-link-box{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:16px}#gift-link-box label{width:100%;font-size:12px}#gift-link{width:100%;padding:12px;border:1px solid #c8c0b1;background:#fbf8f0;color:#303a35;border-radius:5px;font:inherit;font-size:12px}#result-actions{flex-wrap:wrap}

@media(prefers-reduced-motion:reduce){body #touch-cookie .touch-half{transform:none!important}}

#usage{font-size:13px;margin:10px 0;color:#625f53}body #next-cookie{display:block;margin:16px auto 0}.service-share-actions{margin:24px auto 12px;max-width:550px}.service-share-actions p{font-size:12px;color:#80715c}#service-link-box{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:15px}#service-link-box label{width:100%;font-size:12px}#service-link{width:100%;padding:12px;border:1px solid #c8c0b1;background:#fbf8f0;color:#303a35;border-radius:5px;font:inherit;font-size:12px}#paid-dialog{max-width:420px;width:calc(100% - 40px);padding:28px;border:1px solid #c8c0b1;background:#faf5e9;color:#303a35;border-radius:5px}#paid-dialog::backdrop{background:#242b2566}#paid-dialog h2{font-size:22px;font-weight:400}#paid-dialog p{font-size:14px}#paid-dialog>div{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}

#invite-welcome{max-width:500px;margin:24px auto;padding:20px 22px;border:1px solid #d2c6b0;background:#faf6ec;text-align:center}#invite-welcome>p{margin:8px 0;font-size:15px;color:#494e43}#invite-note{font-size:12px;line-height:1.7;color:#796e5a}.invite-stamp{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid #97624f;color:#97624f;font-family:serif;font-size:20px}.device-notice{font-size:11px;color:#81796c;margin:24px auto 0;max-width:500px}

body main>h1{line-height:1.5;word-break:keep-all}body .intro{line-height:1.85;word-break:keep-all;margin:12px 0 18px}body #invite-welcome{display:flex;flex-direction:column;align-items:center;gap:4px;max-width:500px;margin:18px auto 16px;padding:14px 18px;border-color:#d4c7b1;background:#faf6ec}body #invite-welcome .invite-stamp{width:24px;height:24px;font-size:17px}body #invite-welcome>p{font-size:13px;margin:3px 0}body #invite-note{font-size:12px}body #date{margin:14px 0 8px}body #usage{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 14px;margin:10px 0 6px;font-size:12px}#usage .usage-bonus{padding:5px 10px;border:1px solid #c9b897;color:#72593c;background:#fbf6e9;border-radius:5px}body #experience{min-height:350px}body .service-share-actions{max-width:500px;margin:28px auto 16px;padding:24px 22px;border:1px solid #cdc3b0;background:#faf6ec}body .service-share-actions>.eyebrow{font-size:10px;letter-spacing:.16em;margin:0 0 7px}body #invite-share-title{font-family:'Noto Serif KR',serif;font-weight:400;font-size:23px;line-height:1.6;word-break:keep-all;margin:0 0 8px}body .service-share-actions .share-offer{font-size:15px;color:#72593c;margin:8px 0 18px}body .service-share-actions #share-service{min-width:240px}body #share-reward-note{font-size:11px;line-height:1.8;margin:13px 0 0;word-break:keep-all}body #service-link-box{padding-top:18px;margin-top:16px;border-top:1px solid #ded4c1}body #status{margin:16px 0 0}body .device-notice{margin-top:20px}body .note{margin-top:18px}@media(max-width:600px){body main>h1{font-size:28px;line-height:1.55;margin:10px 0}body .intro{font-size:13px}body #experience{min-height:305px}body #invite-share-title{font-size:21px}body .service-share-actions{padding:22px 16px}body #invite-welcome{padding:12px 14px}body .service-share-actions #share-service{min-width:0;width:100%}}

.opened-cookie{position:relative;width:170px;height:105px;margin:0 auto 8px;pointer-events:none}.result-half{position:absolute;inset:0;background:url('assets/fortune/cookie.png') center/contain no-repeat;filter:drop-shadow(0 3px 2px #553f2820)}.result-left{clip-path:polygon(0 0,51% 0,47% 25%,53% 42%,47% 60%,51% 100%,0 100%);transform:translate(-13px,3px) rotate(-13deg)}.result-right{clip-path:polygon(51% 0,100% 0,100% 100%,51% 100%,47% 60%,53% 42%,47% 25%);transform:translate(13px,3px) rotate(13deg)}.crumb{position:absolute;background:#c69a5b;clip-path:polygon(0 25%,70% 0,100% 75%,35% 100%);width:5px;height:4px;bottom:9px}.crumb-one{left:43%;transform:rotate(26deg)}.crumb-two{left:51%;bottom:4px;width:4px;height:3px}.crumb-three{left:57%;bottom:12px;transform:rotate(-35deg)}@media(max-width:600px){.opened-cookie{width:150px;height:94px}}

body #paid-dialog{width:calc(100% - 36px);max-width:450px;padding:28px 24px;text-align:center}body #paid-dialog>.eyebrow{font-size:10px;margin:0 0 8px}body #paid-dialog h2{font-family:'Noto Serif KR',serif;font-weight:400;font-size:24px;line-height:1.6;word-break:keep-all;margin:0 0 10px}body #paid-dialog .again-intro{font-size:13px;color:#746b5d;line-height:1.85;margin:10px 0 23px}body #paid-dialog .again-options{display:block}body #paid-dialog .again-options button{display:block;width:100%;padding:14px 12px}body #paid-dialog .again-options p{font-size:11px;color:#80715c;line-height:1.8;word-break:keep-all;margin:8px 0 20px}body #paid-dialog #cancel-paid{border:0;background:transparent;padding:6px 10px;font-size:12px;color:#80715c}body #paid-dialog #confirm-paid{display:block;width:100%;margin:14px 0;font-size:12px}@media(max-width:600px){body #paid-dialog h2{font-size:21px}body #paid-dialog{padding:26px 20px}}

body #next-cookie{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:150;margin:0;min-width:220px;padding:16px 30px;background:#303a35;color:#fbf8f0;border:1px solid #303a35;font-size:16px;font-weight:600}body #next-cookie:hover:not(:disabled){transform:translateX(-50%);background:#26332c;color:#fbf8f0}body:has(#next-cookie:not([hidden])) footer{padding-bottom:110px}body:has(#paid-dialog[open]) #next-cookie{visibility:hidden}@media(max-width:600px){body #next-cookie{width:calc(100% - 40px);max-width:360px;bottom:calc(16px + env(safe-area-inset-bottom,0px));padding:16px 24px}}

body #result-actions{margin-top:24px;margin-bottom:8px}