:root{--paper:#fbf1de;--ink:#563d33;--pink:#e8a3ab;--rose:#a44859;--honey:#efc16c;--muted:#796054;--line:#d8c0a1;--shadow:0 5px 18px #5e3e2720;font-family:"Kaiti SC","STKaiti","KaiTi","PingFang SC",sans-serif;color:var(--ink);background:#e9dcc6;font-size:16px}*{box-sizing:border-box}body{margin:0}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border:1px solid var(--line);background:#fff9ed;min-height:44px;padding:10px 16px;border-radius:10px;cursor:pointer;touch-action:manipulation;transition:background .18s,transform .18s}button:hover{background:#f7dfbe}button:active{transform:translateY(2px)}button:disabled{cursor:default;opacity:.55}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--rose);outline-offset:4px}::selection{background:#f4c3bf;color:#563d33}a{color:inherit;text-decoration:none}h1,h2,p{margin:0}h1{font-size:clamp(25px,5.8vw,35px);line-height:1.35;font-weight:700}h2{font-size:25px;line-height:1.5}p{line-height:1.7}small{font-size:14px}.book{max-width:780px;min-height:100dvh;margin:auto;background:var(--paper);box-shadow:0 0 36px #6f4a3220;padding:0 26px}header{display:flex;align-items:center;justify-content:space-between;padding:22px 0 16px;border-bottom:1px dashed var(--line);gap:8px}.brand{font-size:23px;font-weight:bold;white-space:nowrap}.brand span{display:block;font-size:12px;font-weight:normal;letter-spacing:1px;margin-top:4px}nav{display:flex;gap:6px}nav button{font-size:14px;padding:8px 10px;border:0;background:#efdfc6}footer{padding:28px 0 max(24px,env(safe-area-inset-bottom));font-size:12px;color:var(--muted);text-align:center;line-height:1.7}footer span{display:block}.dedication{text-align:center;padding:22px 0 20px}.date{font-size:13px;color:var(--rose);letter-spacing:3px;margin-bottom:7px}.dedication p:last-child{margin-top:10px;color:var(--muted);font-size:15px}.room{position:relative;max-width:490px;margin:auto;isolation:isolate;box-shadow:var(--shadow);transform:rotate(-.6deg)}.room:before,.polaroid:before,.quiz-paper:before,.letter:before{content:"";position:absolute;width:80px;height:23px;background:#e9b3a7b8;top:-10px;left:calc(50% - 40px);transform:rotate(-5deg);z-index:2}.room-art{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border:7px solid #fff9ec}.room-couple{position:absolute;left:31%;top:42%;width:49%}.hotspot{position:absolute;background:transparent;border:0;border-radius:0;padding:0;display:flex;align-items:end;justify-content:center;min-height:48px;box-shadow:none}.hotspot:hover{background:#fff4dc20}.hotspot span{background:#fff7e9ed;box-shadow:0 2px 5px #54362020;padding:6px 8px;font-size:14px;white-space:nowrap;border-radius:3px;transform:rotate(2deg);border-bottom:2px solid #daa67d}.spot-claw{left:5%;top:14%;width:28%;height:22%}.spot-dance{left:33%;top:48%;width:38%;height:13%}.spot-desk{left:1%;top:49%;width:33%;height:17%}.spot-bus{right:4%;top:28%;width:30%;height:14%}.spot-quiz{left:5%;bottom:3%;width:35%;height:15%}.spot-cake{right:3%;bottom:9%;width:36%;height:18%}.room-note{position:absolute;top:3%;left:32%;font-size:12px;background:#fff5dfcc;padding:5px 8px;transform:rotate(4deg)}.room-bottom{max-width:490px;margin:20px auto;display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--muted)}.directory{max-width:490px;margin:auto;border-block:1px dashed var(--line);padding:12px 0}.directory summary{cursor:pointer;min-height:44px;display:flex;align-items:center;justify-content:center}.directory summary:after{content:' ＋'}.directory[open] summary:after{content:' −'}.directory button{display:flex;gap:14px;align-items:center;width:100%;text-align:left;background:transparent;border:0;border-top:1px solid #dfc9aa;border-radius:0;padding:14px 4px}.directory small{display:block;font-size:13px;color:var(--muted);margin-top:3px}.icon{width:38px;height:44px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.couple{display:flex;justify-content:center;align-items:end;position:relative}.person{position:relative;width:120px;height:185px;flex:0 0 120px;transform-origin:50% 85%}.person svg{width:100%;height:100%;overflow:visible}.person svg path{stroke:var(--ink);stroke-width:5;stroke-linecap:round;stroke-linejoin:round;fill:none}.person svg .shirt{fill:#e7abb3;stroke-width:3}.boy svg .shirt{fill:#80a477}.person .head{position:absolute;width:73px;left:25px;top:-9px;filter:drop-shadow(1px 3px 2px #54362025)}.person.girl .head{width:80px;left:22px;top:-7px}.arm.left{transform-origin:45px 77px}.arm.right{transform-origin:75px 77px}.leg.left{transform-origin:49px 115px}.leg.right{transform-origin:70px 115px}.arm,.leg,.head,.body{transition:transform .2s ease-out}.pose-left .person{transform:rotate(-7deg)}.pose-right .person{transform:rotate(7deg)}.pose-left .arm.left,.pose-left .arm.right{transform:rotate(55deg)}.pose-right .arm.right,.pose-right .arm.left{transform:rotate(-55deg)}.pose-left .body{transform:translateX(-5px)}.pose-right .body{transform:translateX(5px)}.pose-left .head{transform:rotate(6deg)}.pose-right .head{transform:rotate(-6deg)}.cuddling .girl{transform:rotate(10deg) translateX(12px)}.cuddling .boy{transform:rotate(-10deg) translateX(-12px)}.room .person{width:50%;flex-basis:50%;height:auto;aspect-ratio:120/185}.room .head{width:61%;left:21%;top:-5%}.room .girl .head{width:67%;left:18%;top:-4%}.game-page{max-width:490px;margin:auto}.game-top{display:flex;justify-content:space-between;align-items:center;padding:15px 0 12px}.back,.skip{border:0;background:transparent;padding-inline:4px}.skip{color:var(--muted);font-size:14px}.game-page>h1{text-align:center;margin:10px 0 12px}.instruction{text-align:center;color:var(--muted);font-size:16px;margin:0 0 20px;line-height:1.6}.primary{background:var(--rose);color:#fff9ed;border:0;font-weight:700;min-height:50px}.primary:hover{background:#8e3849}.primary:disabled{background:#b68c84}.game-page #game>.primary{display:block;min-width:180px;margin:18px auto}.game-footer{border-top:1px dashed var(--line);margin-top:24px;padding-top:16px;display:flex;justify-content:center;gap:10px}.game-footer button{font-size:14px}.row{display:flex;gap:12px;align-items:center;justify-content:center}.row>button{flex:1}.feedback{text-align:center;min-height:54px;margin:18px 0 12px;font-size:16px}.hint{font-size:13px;text-align:center;color:var(--muted);margin:10px 0}.meter{display:flex;justify-content:space-between;margin:15px 0;font-size:14px;font-variant-numeric:tabular-nums}.photo-reward{display:block;width:80%;margin:12px auto;transform:rotate(-2deg);padding:10px;background:#fff;border:0;box-shadow:var(--shadow)}.photo-reward img{width:100%;max-height:230px;object-fit:contain}.photo-reward span{display:block;font-size:14px;margin-top:8px}.dance-floor{height:280px;position:relative;background:#eed8c2;border-radius:48% 48% 12px 12px;overflow:hidden;border-bottom:12px solid #c49d78}.dance-floor .couple{position:absolute;bottom:4px;left:0;right:0}.bunting{text-align:center;font-size:24px;color:var(--rose);transform:rotate(-4deg);padding-top:14px}#dance-cue{position:relative;text-align:center;font-size:21px;font-weight:bold;z-index:2;margin-top:10px}.beat-track{height:7px;background:#dfc9aa;overflow:hidden;margin:10px 0 20px;border-radius:3px}.beat-track i{display:block;height:100%;background:var(--rose);width:0}.dance-controls button,.foot-controls button{min-height:64px;font-size:20px;border:2px solid #bd8c75;background:#fff8e8}.dance-controls button.lit,.foot-controls button.lit{background:var(--honey);border-color:#866339;box-shadow:0 4px 10px #92703724}.desk-scene{height:310px;position:relative;background:#e0d5c9;border-radius:14px;overflow:hidden;transition:background .4s}.desk-scene.lamp-on{background:#f9dfad}.desk-window{position:absolute;right:10px;top:10px;background:#69727c;color:#fff9ed;padding:10px;text-align:center;font-size:13px;line-height:1.6;border:6px solid #bd9b7f}.desk-scene .couple{position:absolute;left:0;right:0;bottom:92px}.sitting .person{transform:scale(.8);transform-origin:bottom}.desktop{position:absolute;left:10px;right:10px;height:118px;bottom:8px;border-bottom:38px solid #b78761;background:#d7ac80;border-radius:45% 35% 6px 6px}.desktop button{position:absolute;border:0;background:transparent;padding:0}#lamp{width:64px;height:108px;left:0;bottom:54px}#lamp svg{width:100%;height:100%;fill:none;stroke:#8d716d;stroke-width:5;stroke-linecap:round}.lamp-shade{fill:#f6dfdc}.lamp-on #lamp{filter:drop-shadow(8px 9px 13px #ffefa1)}#computer{left:28%;bottom:43px;width:43%;height:95px;background:#a39281;border-radius:4px;padding:7px;transform:rotate(-2deg)}.screen{display:grid;align-content:center;width:100%;height:100%;background:#4b4648;color:#fce9d4;font-size:13px;line-height:1.4}.screen small{font-size:12px}.watching .screen{background:#526a66}.watching .girl{transform:scale(.8) rotate(7deg)}.watching .boy{transform:scale(.8) rotate(-7deg)}#candle{right:9%;bottom:42px;width:44px;height:55px}.candle-wax{display:block;position:absolute;bottom:0;left:8px;width:30px;height:32px;border-radius:5px;background:#fff2d5;font-size:12px;padding-top:8px}.flame{position:absolute;top:0;left:18px;width:10px;height:21px;border-radius:70% 30% 50% 50%;background:#e69b3d;opacity:0;transform:rotate(10deg)}.burning .flame{opacity:1}.pear{position:absolute;right:0;bottom:13px;font-size:42px;color:#6e792e;line-height:1}#table-drop{left:18%;right:14%;bottom:-22px;height:57px;min-height:57px;border:1px dashed #8e5f42;border-radius:50%;background:#f3d8b2;font-size:14px}.plate{display:block;border-radius:50%;background:#fff4db;padding:10px;border:2px solid #ebcc99}.honey-plate{padding:3px;font-size:12px}.honey-plate b{color:#bd802d}.tiny-photo{left:0;bottom:-26px;width:42px;height:49px;transform:rotate(-9deg);z-index:2}.tiny-photo img{width:100%;height:100%;object-fit:cover;border:3px solid #fff}.food-tray{display:flex;gap:8px;justify-content:center}.food-tray button{padding:12px;touch-action:none;flex:1}.food-tray button.selected{background:#eed29c;border-color:#9c7741}.dragging{transform:scale(1.08)!important;box-shadow:var(--shadow)}#honey{display:block;margin:10px auto;touch-action:none}#honey[hidden]{display:none}.bus-scene{height:288px;background:#dfe5d6;border-radius:15px;overflow:hidden;position:relative}.arrival{position:absolute;left:14px;top:15px;padding:12px 18px;background:#fff9ed;box-shadow:var(--shadow);transform:rotate(-5deg)}.arrival span{display:block;font-size:12px}.arrival strong{font-family:inherit;font-size:30px;color:var(--rose)}.speech{position:absolute;right:13px;top:35px;width:44%;font-size:15px;line-height:1.5}.road{position:absolute;bottom:0;left:0;right:0;height:165px;border-bottom:22px solid #b9b5a4;background:#f2eddb}.bus-drawing{position:absolute;right:14px;bottom:23px;background:#e9bd61;border-radius:10px;width:94px;height:72px;display:flex;align-items:center;justify-content:center;gap:3px;transition:transform 1.5s}.bus-drawing .icon{width:41px;height:48px}.bus-drawing span{font-size:13px;writing-mode:vertical-rl}.bus-stop{position:absolute;right:14px;top:0;background:#d9baa1;border-bottom:22px solid #856c53;padding:4px;font-size:14px}.runners{position:absolute;left:5%;bottom:6px;transition:left .25s}.runners .couple{width:142px}.runners .person{width:71px;height:110px;flex-basis:71px}.runners .head{width:43px;left:15px;top:-5px}.runners .girl .head{width:47px;left:13px;top:-4px}.running .leg.left{animation:run .3s infinite alternate}.running .leg.right{animation:run .3s infinite alternate-reverse}.running .arm.left{animation:run .3s infinite alternate-reverse}.running .arm.right{animation:run .3s infinite alternate}.running .head{animation:bob .3s infinite alternate}.missed .bus-drawing{transform:translateX(150px)}.caught .runners{bottom:33px;transform:scale(.7)}progress{width:100%;height:13px;accent-color:var(--rose);border:0;margin-bottom:17px}.quiz-progress{display:flex;justify-content:center;gap:17px;margin:20px 0 32px}.quiz-progress span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e5d3b6;font-size:15px}.quiz-progress .answered{background:var(--rose);color:#fff}.quiz-paper{position:relative;background:#fffbf1;box-shadow:var(--shadow);padding:100px 22px 22px;transform:rotate(-.5deg)}.quiz-paper>.couple{position:absolute;top:-18px;left:calc(50% - 75px);height:110px;width:150px;overflow:hidden}.quiz-paper .person{transform:scale(.6);transform-origin:top center;flex-basis:70px}.quiz-paper>p:first-of-type{font-size:13px;color:var(--rose);margin-bottom:8px}.quiz-paper h2{font-size:23px}.answers{display:grid;gap:10px;margin-top:24px}.answers button{display:flex;align-items:center;gap:12px;text-align:left;min-height:54px;font-size:17px}.answers button span{font-size:13px;color:var(--muted);width:18px}.answers .wrong{background:#f3d0c8}.answers .correct{background:#dfe6b7;border-color:#818853;opacity:1}.quiz-paper #quiz-next{display:grid;gap:12px}.quiz-finish{text-align:center;padding:30px 0}.hearts{font-size:28px;color:var(--rose);margin-bottom:20px}.quiz-finish .couple{margin:28px 0}.birthday-stage{height:290px;position:relative;background:#f4ddc7;border-radius:48% 48% 10px 10px}.birthday-stage .couple{position:absolute;top:20px;left:0;right:0}.birthday-stage .person{transform:scale(.85);transform-origin:top}.birthday-stage .girl{transform:scale(.85) rotate(9deg) translateX(13px)}.birthday-stage .boy{transform:scale(.85) rotate(-9deg) translateX(-13px)}#birthday-cake{position:absolute;bottom:13px;left:calc(50% - 85px);width:170px;height:155px;background:transparent;border:0;padding:0;touch-action:none}.cake-body{position:absolute;bottom:12px;left:5px;width:160px;height:72px;background:#e9a9b3;border:3px solid #ab7075;border-radius:10% 10% 20% 20%;padding-top:27px;font-size:15px;font-style:italic;z-index:2}.cake-top{position:absolute;bottom:63px;left:5px;width:160px;height:35px;border:3px solid #ab7075;background:#fff3d9;border-radius:50%;z-index:3}.birthday-candle{position:absolute;bottom:85px;left:79px;width:13px;height:34px;background:#b1c3c5;border:2px solid #668386;z-index:4}.birthday-flame{position:absolute;bottom:121px;left:79px;width:13px;height:25px;border-radius:80% 20% 50% 50%;background:#eaa83b;opacity:0;z-index:5}.lit-cake .birthday-flame{opacity:1;animation:flicker 1s infinite alternate}.cake-plate{position:absolute;bottom:3px;left:0;width:170px;height:30px;border-radius:50%;background:#fffcf1;border:2px solid #bea988}.confetti{position:absolute;left:0;right:0;top:0;text-align:center;color:var(--rose);font-size:28px;opacity:0;pointer-events:none}.celebrating .confetti{opacity:1;animation:confetti 2s ease-out}.letter{margin:30px 0 20px;position:relative;background:#fffaf0;padding:18px 22px 26px;box-shadow:var(--shadow);transform:rotate(-.5deg)}.letter img{width:100%;display:block;margin-bottom:25px}.letter h2{margin-bottom:20px}.letter p{margin:16px 0;line-height:1.9}.signature{text-align:right}.page-heading{text-align:center;padding:18px 0 28px}.page-heading .back{display:block;margin-bottom:18px}.page-heading p{color:var(--muted);margin-top:12px;font-size:15px}.album{display:grid;grid-template-columns:1fr 1fr;gap:28px 18px;padding:0 8px}.polaroid{position:relative;border:0;background:#fffcf5;border-radius:0;padding:8px 8px 12px;box-shadow:var(--shadow);transform:rotate(-2deg);text-align:center}.polaroid:nth-child(even){transform:rotate(3deg)}.polaroid:first-child{grid-column:1/-1;margin:0 32px 10px}.polaroid img{display:block;width:100%;height:190px;object-fit:contain;background:#f0e7d7}.polaroid:first-child img{height:auto}.polaroid span{display:block;margin-top:10px;font-size:14px;line-height:1.5}dialog{max-width:min(94vw,650px);max-height:94dvh;padding:16px;border:0;background:var(--paper);color:var(--ink);border-radius:12px;box-shadow:var(--shadow)}dialog::backdrop{background:#352820bd}dialog .close{display:block;margin-left:auto;margin-bottom:10px}#full-photo{display:block;max-width:100%;max-height:65dvh;object-fit:contain;margin:auto}#photo-caption{text-align:center;margin:15px 0}#photo-count{font-size:14px;white-space:nowrap}.icon,path{vector-effect:non-scaling-stroke}[hidden]{display:none!important}@keyframes run{from{transform:rotate(-30deg)}to{transform:rotate(30deg)}}@keyframes bob{to{transform:translateY(3px)}}@keyframes flicker{to{transform:rotate(10deg) scale(.88)}}@keyframes confetti{from{transform:translateY(-10px);letter-spacing:1px}to{transform:translateY(0);letter-spacing:7px}}
@media(max-width:480px){.book{padding:0 18px}header{padding:16px 0 13px}.brand{font-size:21px}.brand span{font-size:11px}.dedication{padding:20px 0}.dedication h1{font-size:29px}.room-art{border-width:5px}.room-bottom{font-size:12px}.hotspot span{font-size:12px;padding:5px 6px}.room-note{font-size:10px;left:34%}.game-top{padding-top:9px}.game-page>h1{font-size:27px}.game-footer{gap:7px}.game-footer button{padding:10px 11px}.quiz-paper{padding-inline:17px}.album{gap:25px 14px;padding:0 2px}.polaroid:first-child{margin-inline:5px}.polaroid img{height:180px}.polaroid span{font-size:13px}.desktop{left:5px;right:5px}.food-tray button{padding:10px 5px}.room-couple{left:32%;top:43%}}
@media(max-width:350px){.book{padding-inline:12px}.brand{font-size:19px}nav button{font-size:12px;padding-inline:7px}.instruction{font-size:14px}.hotspot span{font-size:11px}.room-note{display:none}.game-page>h1{font-size:25px}.dance-controls button{font-size:18px;padding-inline:10px}.speech{font-size:13px}.album .polaroid img{height:150px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Paper objects respond to the same drag and movement as the game state. */
.collected-prizes{position:absolute;top:32%;left:33%;display:flex;gap:3px;max-width:30%;flex-wrap:wrap}.collected-prizes span{font-size:11px;background:#f8deb0;padding:4px;box-shadow:1px 2px 4px #513c2522;transform:rotate(-8deg)}.seated .leg.left{transform:rotate(-65deg)}.seated .leg.right{transform:rotate(65deg)}.seated .arm.left{transform:rotate(-35deg)}.seated .arm.right{transform:rotate(35deg)}.disappointed .head{transform:rotate(-10deg) translateY(3px)}.disappointed .arm.left{transform:rotate(-40deg)}.disappointed .arm.right{transform:rotate(40deg)}.food-art{display:block;background-image:url('assets/food.webp');background-size:400% 100%;background-repeat:no-repeat;aspect-ratio:3/4;mix-blend-mode:multiply}.food-burger{background-position:0 50%}.food-thai{background-position:33.333% 50%}.food-ice{background-position:66.667% 50%}.food-pear{background-position:100% 50%}.food-tray .food-art{width:55px;margin:auto;height:64px}.food-tray button{font-size:14px}.pear.food-art{width:42px;height:56px;right:-2px;bottom:19px}.plate.food-art{width:70px;height:75px;margin:auto;border:0;border-radius:0;position:relative;top:-19px;background-color:transparent;padding:0}.honey-plate b{position:absolute;right:-20px;bottom:5px;font-size:18px;color:#976727}.food-drag-ghost{position:fixed;z-index:20;pointer-events:none;transform:translate(-50%,-70%);background:#fff8e6d9;padding:7px;box-shadow:var(--shadow);font-size:13px;text-align:center}.food-drag-ghost .food-art{width:60px;height:70px}.desk-scene .sitting{gap:46px}.desk-window{top:10px;right:10px;font-size:12px;padding:7px}.desktop .tiny-photo{width:46px}.caught .runners{z-index:2;transform:scale(.7) translateX(-5px);bottom:16px}.caught .bus-drawing{width:112px;height:112px;bottom:4px}.caught .bus-drawing .icon{opacity:.2}.caught .bus-drawing span{position:absolute;right:6px;top:6px}.watching .girl{transform:scale(.8) rotate(7deg) translateX(12px)}.watching .boy{transform:scale(.8) rotate(-7deg) translateX(-12px)}
.runners.waiting .girl{opacity:0;transform:translateX(-25px)}.runners .girl{transition:opacity .45s,transform .45s}.birthday-stage .girl{transform:scale(.85) rotate(12deg) translateX(34px)}.birthday-stage .boy{transform:scale(.85) rotate(-12deg) translateX(-34px)}.cuddling .girl .arm.right{transform:rotate(-35deg)}.cuddling .boy .arm.left{transform:rotate(35deg)}
.person svg .paper-limb{stroke:#fffaeb;stroke-width:11}.person .body{filter:drop-shadow(1px 2px 1px #5e3e2726)}.person svg .shoe{stroke-width:7}.person svg .shirt{stroke:#74584a;stroke-width:3;paint-order:stroke}
.bus-drawing{border:3px solid #a9783d;box-shadow:1px 3px 7px #64402120}.bus-drawing:before,.bus-drawing:after{content:'';position:absolute;bottom:-10px;width:17px;height:17px;background:#6f5848;border:3px solid #f5dcaa;border-radius:50%}.bus-drawing:before{left:10px}.bus-drawing:after{right:10px}.bus-windows{position:absolute;top:8px;left:6px;right:6px;height:32px;border:2px solid #a9783d;border-radius:9px 9px 2px 2px;background:#f9ecd1}.bus-windows:after{content:'';position:absolute;left:50%;height:100%;width:2px;background:#a9783d}.bus-drawing .bus-label,.caught .bus-drawing .bus-label{position:absolute;right:7px;top:auto;bottom:2px;writing-mode:horizontal-tb;font-size:11px}.caught .bus-windows{height:76px}.foot-controls button{display:flex;align-items:center;justify-content:center;gap:13px}.foot-controls svg{width:25px;height:37px;fill:#b18061;transform:rotate(-15deg)}.foot-controls button:last-child svg{transform:rotate(15deg)}progress::-webkit-progress-bar{background:#e3cfb5;border-radius:8px}progress::-webkit-progress-value{background:var(--rose);border-radius:8px}progress::-moz-progress-bar{background:var(--rose);border-radius:8px}
.hotspot span{font-size:14px}.brand span{font-size:12px}@media(max-width:350px){.hotspot span{font-size:13px}.instruction{font-size:16px}}