@charset "UTF-8";
:root{--paper:#fff7f8;--pink:#f3c5d3;--rose:#c53762;--ink:#422735;--muted:#846674;--line:#ecced8;--yellow:#ffed9b;--font:"Microsoft YaHei","PingFang SC",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:15px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #b32259;outline-offset:5px}.header{max-width:1400px;margin:auto;padding:27px 6%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{font-family:Georgia,serif;font-size:25px;font-weight:bold;letter-spacing:-1px}.brand>span:not(.brand-heart){color:var(--rose)}.brand-heart{font-size:31px;vertical-align:-2px;color:var(--rose);margin-right:6px}.header-right{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--muted)}.status-dot{width:6px;height:6px;background:#81a581;border-radius:50%}.sound-toggle{margin-left:20px;border:1px solid var(--line);border-radius:30px;background:transparent;padding:8px 13px;color:var(--muted)}.hero{max-width:1320px;margin:auto;display:grid;grid-template-columns:44% 56%;min-height:690px;padding:60px 6% 50px;align-items:center;overflow:hidden}.intro{position:relative;z-index:2}.invitation{font-size:13px;color:var(--rose);display:flex;align-items:center;gap:8px;margin-bottom:24px}.invitation span{font-size:20px}h1{font-size:clamp(56px,5.5vw,80px);font-weight:850;line-height:1.18;letter-spacing:-4px;margin:0 0 26px}.title-heart{display:inline-block;font-family:Georgia,serif;color:var(--rose);font-weight:400;transform:rotate(12deg);font-size:.86em;margin-left:13px}.description{font-size:16px;line-height:1.95;color:var(--muted);margin:0 0 27px}.date-button{min-width:228px;padding:17px 24px;border:0;border-radius:9px;background:var(--rose);color:#fff;font-weight:600;display:inline-flex;justify-content:space-between;align-items:center;gap:30px;box-shadow:0 5px 0 #a6254e;transition:transform .16s,box-shadow .16s}.date-button:hover{transform:translateY(-2px);box-shadow:0 7px 0 #a6254e}.date-button:active{transform:translateY(3px);box-shadow:0 2px 0 #a6254e}.date-button span{font-size:22px;line-height:1}.small-note{font-size:11px;color:var(--muted);margin:17px 0 29px}.appointment{display:flex;gap:13px;align-items:center;font-size:12px}.appointment small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.calendar-icon{display:grid;place-items:center;height:39px;width:39px;border:1px solid var(--line);border-radius:8px;font-size:23px;color:var(--rose)}.art-stage{height:575px;position:relative;margin-left:-24px}.orbit{position:absolute;width:470px;height:470px;border-radius:50%;left:50%;top:51%;transform:translate(-50%,-50%);background:#f8dce5}.orbit-one{background:radial-gradient(circle at 36% 30%,#fff2f6 0,#f7d4df 64%,#f1c2d3 100%);border:1px solid #efcad5}.orbit-two{width:518px;height:518px;background:none;border:1px dashed #e4afc3;transform:translate(-50%,-50%) rotate(-25deg)}.art-wrap{position:absolute;inset:-10px -72px 0 -54px;display:flex;align-items:center;justify-content:center}.tribbie-art{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 14px #a4436e1c);position:relative;z-index:1}.image-fallback{font-size:28px;text-align:center;color:var(--rose);line-height:2;z-index:1}.handwritten{font-family:"KaiTi","STKaiti",serif;font-size:24px;color:#a35e79;position:absolute;z-index:3}.note-top{top:9px;right:47px;transform:rotate(8deg)}.note-bottom{bottom:11px;left:15px;transform:rotate(-8deg);font-size:21px}.note-bottom svg{width:70px;height:40px;position:absolute;top:-31px;right:-70px;fill:none;stroke:#a35e79;stroke-width:2;stroke-linecap:round}.sticker{z-index:3;position:absolute;background:#fffdfd;box-shadow:0 5px 16px #80405512;border:1px solid #f2d3df;border-radius:11px;padding:13px 19px;font-size:16px;font-weight:600}.greeting{top:69px;left:-6px;transform:rotate(-9deg);color:var(--rose)}.greeting span{margin-left:9px}.charge-sticker{position:absolute;z-index:3;bottom:29px;right:5px;transform:rotate(8deg);display:flex;gap:8px;align-items:center;background:var(--yellow);border:3px solid white;outline:1px solid #e4c77c;padding:11px 15px;border-radius:7px;font-weight:bold;box-shadow:0 5px 12px #78432912}.charge-sticker>span{font-size:29px}.charge-sticker small{font-size:10px;display:block;font-weight:400;margin-top:4px}.spark{position:absolute;color:#c46188;z-index:2;font-size:49px}.spark-one{top:133px;right:7px;transform:rotate(9deg)}.spark-two{bottom:98px;left:19px;font-size:33px}.lightning{position:absolute;z-index:5;font-family:Georgia,serif;font-size:180px;line-height:1;color:#ffd746;-webkit-text-stroke:2px #7b4662;display:none;text-shadow:5px 6px 0 white}.bolt-one{left:6px;top:170px;transform:rotate(-16deg)}.bolt-two{right:0;top:200px;transform:rotate(14deg)}.ticker{border-top:1px solid #edb8ca;border-bottom:1px solid #edb8ca;overflow:hidden;background:#f9e0e9;padding:14px 0;color:#a83e65;font-size:13px}.ticker>div{white-space:nowrap;word-spacing:18px;text-align:center}.ticker span{margin:0 34px;color:#815263}.after-date{max-width:1170px;margin:0 auto;padding:75px 6% 78px;display:grid;grid-template-columns:1.15fr 1fr;gap:95px;align-items:center}.chapter{font-size:12px;color:var(--rose)}h2{font-size:31px;letter-spacing:-1px;line-height:1.5;margin:15px 0 20px}.result-copy>p{font-size:14px;color:var(--muted);line-height:1.9}.tiny-conversation{margin-top:26px;display:flex;flex-direction:column;gap:10px;font-size:12px}.tiny-conversation span{width:fit-content;background:#f5e5eb;border-radius:9px 9px 9px 0;padding:10px 14px}.tiny-conversation span+span{background:#faeeda;margin-left:23px;border-radius:9px 9px 0 9px}.receipt{background:#fffefa;position:relative;padding:27px 29px 19px;filter:drop-shadow(0 8px 11px #6330410a);border-top:1px solid #f1e1de;transform:rotate(3deg)}.receipt:after{content:"";position:absolute;left:0;right:0;height:9px;bottom:-8px;background:linear-gradient(135deg,#fffefa 25%,transparent 25%) -9px 0/18px 18px,linear-gradient(225deg,#fffefa 25%,transparent 25%) -9px 0/18px 18px}.receipt-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px dashed #d8c7c9;padding-bottom:20px;text-align:center}.receipt-top>span{font-size:24px;color:var(--rose)}.receipt-top>div{font-weight:bold;font-size:17px}.receipt-top small{display:block;color:#9f7e86;font-size:10px;font-weight:400;margin-top:6px}.receipt-line{display:flex;justify-content:space-between;margin:17px 0;font-size:12px}.receipt-line span,.receipt-total span{color:var(--muted)}.receipt-line strong{font-weight:500}.receipt-total{border-top:1px dashed #d8c7c9;display:flex;justify-content:space-between;align-items:center;padding-top:19px;font-size:12px;margin-top:20px}.receipt-total strong{color:var(--rose);font-size:17px}.receipt-bottom{text-align:center;margin-top:25px;font-size:10px;color:#94717a}.barcode{height:22px;width:155px;margin:0 auto;background:repeating-linear-gradient(90deg,#563b46 0px,#563b46 2px,transparent 2px,transparent 4px,#563b46 4px,#563b46 5px,transparent 5px,transparent 9px,#563b46 9px,#563b46 12px,transparent 12px,transparent 15px)}.receipt-stamp{position:absolute;top:135px;left:25px;border:3px double #c53762;border-radius:7px;color:#c53762;transform:rotate(-18deg);font-size:25px;font-weight:bold;padding:6px 13px;opacity:.75}footer{border-top:1px solid var(--line);margin:0 auto;max-width:1400px;display:flex;align-items:center;gap:28px;padding:25px 6%;color:var(--muted)}footer .brand{font-size:20px;color:var(--ink)}footer p{font-size:10px;line-height:1.8;margin:0}.footer-note{margin-left:auto;font-size:11px}dialog{border:1px solid #ebc3d2;border-radius:22px;background:#fff7f8;color:var(--ink);max-width:440px;width:calc(100% - 40px);padding:38px 30px 25px;text-align:center;box-shadow:0 25px 100px #49233825}dialog::backdrop{background:#45273345;backdrop-filter:blur(6px)}.close-dialog{position:absolute;right:14px;top:12px;background:none;border:0;color:var(--muted);font-size:25px;width:36px;height:36px}.dialog-icon{display:inline-grid;place-items:center;font-size:43px;background:var(--yellow);height:76px;width:76px;border-radius:50%}.dialog-kicker{font-size:12px;color:var(--rose);margin:21px 0 5px}dialog h2{font-size:29px;margin:4px 0 12px}dialog>p:not(.dialog-kicker){font-size:13px;color:var(--muted)}.result-medal{padding:17px;border-top:1px dashed var(--line);border-bottom:1px dashed var(--line);margin:25px 0;font-size:12px;color:var(--muted)}.result-medal strong{display:block;color:var(--rose);font-size:27px;letter-spacing:3px;margin-top:8px}dialog .date-button{width:100%}.quiet-button{padding:12px;margin-top:13px;background:transparent;border:0;color:var(--muted);font-size:12px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.zapped .lightning{display:block}.zapped .art-wrap{animation:shake .5s linear}.zapped .orbit-one{background:#ffe894}.zapped .greeting{background:#fff5ba}.date-button:disabled{opacity:.8;cursor:wait}@keyframes shake{0%,100%{transform:translateX(0)}20%,60%{transform:translateX(-8px) rotate(-1deg)}40%,80%{transform:translateX(8px) rotate(1deg)}}@media(min-width:1450px){.hero{min-height:740px}.art-stage{height:615px}}@media(max-width:900px){.hero{grid-template-columns:45% 55%;padding-left:5%;padding-right:5%;min-height:620px}.art-stage{height:490px}.orbit-one{width:350px;height:350px}.orbit-two{width:390px;height:390px}.art-wrap{inset:0 -60px 0 -40px}.note-top{right:8px}.greeting{top:52px;left:0;font-size:12px}.charge-sticker{right:-8px;bottom:18px}.after-date{gap:45px;padding-left:7%;padding-right:7%}.footer-note{display:none}.header-right{font-size:11px}.sound-toggle{margin-left:7px}}@media(max-width:600px){.header{padding:18px 6%}.brand{font-size:22px}.brand-heart{font-size:26px}.header-right>#connection,.status-dot{display:none}.sound-toggle{font-size:10px;padding:7px 11px}.hero{display:flex;flex-direction:column;align-items:stretch;padding:34px 7% 35px;min-height:0;overflow:hidden}.intro{order:1}.art-stage{order:0;height:330px;margin:0 0 16px}.orbit-one{width:270px;height:270px}.orbit-two{width:298px;height:298px}.art-wrap{inset:-10px -15px 0}.note-top{top:3px;right:7px;font-size:18px}.greeting{top:30px;left:2px;font-size:11px;padding:9px 12px}.spark-one{font-size:30px;top:90px;right:2px}.spark-two{bottom:48px;left:1px;font-size:25px}.note-bottom{bottom:0;left:3px;font-size:16px}.charge-sticker{right:3px;bottom:6px;padding:8px 10px;font-size:12px}.charge-sticker>span{font-size:23px}.charge-sticker small{font-size:9px}.invitation{font-size:11px;margin-bottom:16px}h1{font-size:47px;letter-spacing:-2px;line-height:1.22;margin-bottom:19px}h1 br:first-of-type{display:none}.description{font-size:14px;margin-bottom:22px}.date-button{width:100%;font-size:14px;padding:16px 23px}.small-note{margin-bottom:23px}.appointment{font-size:11px}.appointment small{font-size:10px}.ticker{padding:12px 0;font-size:11px}.ticker>div{transform:translateX(-50px);text-align:left}.ticker span{margin:0 12px}.after-date{display:flex;flex-direction:column;gap:32px;padding:40px 8% 47px;align-items:stretch}h2{font-size:26px}.result-copy>p{font-size:12px}.receipt{margin:0 8px;padding:25px;transform:rotate(2deg)}footer{padding:22px 7%;gap:20px;align-items:flex-start}footer p{font-size:9px}.bolt-one{top:95px;font-size:120px}.bolt-two{top:90px;font-size:120px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
.date-moments{display:flex;gap:14px;margin:24px 0 20px}.date-moments figure{margin:0;width:46%;background:#fffdfd;border:1px solid #eed7e0;padding:6px 8px 12px;transform:rotate(-4deg);box-shadow:0 5px 12px #78432908}.date-moments figure+figure{transform:rotate(4deg)}.date-moments img{display:block;width:100%;height:155px;object-fit:contain}.date-moments figcaption{text-align:center;font-family:"KaiTi","STKaiti",serif;font-size:15px;color:#995871}.dialog-art{width:180px;height:155px;object-fit:contain;display:block;margin:-18px auto -5px}.dialog-kicker{margin-top:8px}.tribbie-art[hidden]{display:none}.art-wrap{inset:0 -15px}.after-date{align-items:center}@media(max-width:600px){.date-moments img{height:140px}.dialog-art{height:125px;width:155px}dialog{padding-top:30px}.result-medal{margin:19px 0;padding:12px}.tiny-conversation{margin-top:18px}}
@media(max-width:600px){.after-date{align-items:stretch}}
[hidden]{display:none!important}body{min-height:100svh;display:flex;flex-direction:column}.header{width:100%}main{flex:1;display:flex;align-items:center}main>.screen{width:100%}.screen h1:focus,.screen h2:focus{outline:none}.hero{min-height:calc(100svh - 182px);padding-top:32px;padding-bottom:32px}.art-stage{height:530px}.result-screen{max-width:1120px;gap:110px;padding-top:42px;padding-bottom:42px;min-height:calc(100svh - 182px)}.result-art-wrap{width:280px;height:240px;margin:0 0 10px}.result-art{width:100%;height:100%;object-fit:contain}.result-copy h2{margin-bottom:8px}.result-copy>.quiet-button{display:block}.result-screen .receipt{min-width:320px;width:100%;max-width:395px}.receipt-stamp{top:140px}.zap-screen .orbit-one{background:#ffedb2}.secret-screen h1{font-size:clamp(49px,5vw,70px)}.secret-screen .orbit-one{background:radial-gradient(circle at 30% 30%,#fff9df,#f6e2b4)}.secret-screen .orbit-two{border-color:#d6b371}.secret-screen .handwritten{color:#a0783f}.secret-message{margin:0 0 24px;font-size:15px;color:#966325}.secret-message>span{margin-left:10px}.secret-message small{display:block;font-size:11px;color:var(--muted);margin-top:9px}.adult-wrap{inset:-18px 12px 0}.adult-art{height:100%;width:100%}.secret-star{flex-shrink:0;width:40px;height:40px;border:0;background:transparent;font-size:26px;color:#a06c40;border-radius:50%}.secret-star:hover{background:#fae8cc}footer{width:100%;padding-top:18px;padding-bottom:18px;gap:24px}.footer-note{margin-left:auto}.noscript-message{text-align:center;padding:20px}@media(max-width:900px){.hero{min-height:calc(100svh - 170px)}.art-stage{height:470px}.result-screen{gap:45px}.result-screen .receipt{min-width:280px}}@media(max-width:600px){.hero{min-height:0;padding-top:24px;padding-bottom:27px}.art-stage{height:320px}.intro{margin-top:0}.invitation{margin-bottom:12px}h1{font-size:44px;margin-bottom:15px}.description{font-size:13px;line-height:1.8;margin-bottom:19px}.small-note{margin-bottom:19px}.appointment{font-size:10px}.result-screen{padding:28px 8% 34px;gap:25px;min-height:0}.result-art-wrap{height:175px;width:100%;margin:0}.result-art{height:175px;width:210px;display:block;margin:auto}.result-copy>p{margin:6px 0 18px}.result-copy h2{font-size:27px}.result-screen .receipt{min-width:0;width:calc(100% - 16px);max-width:395px}.secret-screen h1{font-size:41px}.secret-screen h1 br{display:block}.adult-wrap{inset:-5px 30px}.secret-screen .art-stage{height:335px}.secret-screen .note-bottom{bottom:5px}.secret-message{margin-bottom:18px;font-size:13px}footer{padding:14px 6%;gap:14px;align-items:center}footer .brand{font-size:17px}footer p{font-size:8px}.secret-star{margin-left:auto;font-size:24px;width:30px;height:36px}.zap-screen h1 br:first-of-type{display:block}.zap-screen .note-top{font-size:15px}.zap-screen .charge-sticker small{font-size:8px}.quiet-button{margin-top:10px;padding:10px 0}}