@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Libre+Caslon+Display&display=swap');
:root{--green:#173f30;--red:#8d202b;--gold:#b48a45;--cream:#faf4e9}*{box-sizing:border-box}body{margin:0;color:var(--green);background:radial-gradient(ellipse at 75% 40%,#fffaf1,transparent 60%),var(--cream);font-family:'DM Sans',sans-serif}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;font:inherit}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:5px}header{height:96px;border-bottom:1px solid #b48a453a;display:flex;align-items:center;justify-content:space-between;padding:0 6%}.brand{text-decoration:none;color:var(--green);font-family:'Libre Caslon Display',Georgia,serif;font-size:35px}.brand span{color:var(--red);padding-right:10px}.secret{background:var(--red);color:#fff6df;border-radius:30px;padding:12px 22px;font-family:Georgia,serif;font-style:italic}main{max-width:1200px;margin:auto;padding:30px 50px 15px}.demo{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:1.4px;color:#736b57}.dot{width:6px;height:6px;border-radius:50%;background:var(--gold)}.demo-detail{letter-spacing:0;border-left:1px solid #d6c6a8;padding-left:12px}.demo button{margin-left:auto;border:0;background:none;color:#72624b;font-size:11px;text-decoration:underline;text-underline-offset:4px}#demo-panel{background:#efe6d5;padding:20px;border-radius:12px;margin-top:15px;font-size:13px}#demo-panel select,#demo-panel button{padding:8px;margin:5px;border:1px solid #cbb590;border-radius:6px;background:var(--cream)}#demo-panel p{font-size:12px}.hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:40px;padding:55px 0 45px}.eyebrow{font-size:10px;letter-spacing:2.7px;display:flex;align-items:center;gap:12px;color:#857040;font-weight:600}.eyebrow span{width:32px;height:1px;background:var(--gold)}h1{font-family:'Libre Caslon Display',Georgia,serif;font-size:83px;line-height:.99;letter-spacing:-2px;font-weight:400;margin:27px 0 24px}h1 em{font-weight:400;color:var(--red)}.subtitle{font-size:19px;line-height:1.6;color:#625e4e;margin-bottom:28px}.hello{display:inline-flex;align-items:center;gap:12px;border:1px solid #c7a873;border-radius:30px;padding:12px 22px;font-family:Georgia,serif;font-size:18px}.sprig{color:var(--red);font-size:26px;margin-left:10px}.little{font-size:12px;line-height:1.7;color:#968a74;margin:18px 0 0}.play{text-align:center;position:relative;padding-top:16px}.wheel-wrap{width:390px;height:390px;position:relative;margin:0 auto 30px}.wheel{height:100%;width:100%;border:10px solid #c69c52;outline:1px solid #ab7b37;border-radius:50%;background:conic-gradient(#f7edd9 0deg 45deg,#8b2330 45deg 90deg,#204a36 90deg 135deg,#f7edd9 135deg 180deg,#8b2330 180deg 225deg,#204a36 225deg 270deg,#f7edd9 270deg 315deg,#8b2330 315deg 360deg);box-shadow:inset 0 0 0 3px #e8c98b,0 20px 35px #765b3428;position:relative;transition:transform 5s cubic-bezier(.12,.62,.12,1)}.pointer{position:absolute;left:calc(50% - 17px);top:-17px;width:34px;height:53px;background:linear-gradient(90deg,#b48135,#f7d998,#b48135);clip-path:polygon(0 0,100% 0,50% 100%);z-index:2;filter:drop-shadow(0 3px 2px #0005)}.hub{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:86px;height:86px;border-radius:50%;background:radial-gradient(circle,#fff2cf,#c79746);border:4px solid #f5d69b;box-shadow:0 2px 8px #0005;display:grid;place-items:center;font-size:48px;color:var(--red)}.gift{position:absolute;width:32px;height:32px;left:calc(50% - 16px);top:calc(50% - 16px);color:#dbb365}.gift svg{width:100%;height:100%}.primary{background:var(--green);color:#fff8e8;border:1px solid #44644a;border-radius:40px;padding:19px 30px;font-family:Georgia,serif;font-size:23px;box-shadow:0 5px 0 #d8c7a653;transition:background .2s,transform .2s;width:100%;max-width:420px}.primary:hover{background:#285b43;transform:translateY(-2px)}.primary:disabled{cursor:wait;opacity:.75;transform:none}.primary span{float:right}.lock{font-size:12px;color:#776e5b;margin:18px 0 0}.wheel-note{font-family:Georgia,serif;font-style:italic;color:#a08e6e;font-size:13px}.stars{position:absolute;right:-8px;top:0;color:var(--gold);font-size:36px}.stars span{display:block;margin:80px -10px 0 0;font-size:17px}footer{border-top:1px solid #c8a66a;display:grid;grid-template-columns:repeat(3,1fr);padding:28px 0 20px;text-align:center}footer>div+div{border-left:1px solid #dac8a6}.step-icon{font-size:30px;color:var(--gold)}footer p{font-family:Georgia,serif;font-size:15px}footer small{color:#b08d52;font-family:'DM Sans',sans-serif;font-size:10px;margin-right:6px}.bottom{display:flex;justify-content:center;gap:16px;font-size:10px;color:#a29378;padding-top:15px}.garland{position:absolute;color:#466045;pointer-events:none;font-size:55px;opacity:.8}.garland-left{top:92px;left:16px;transform:rotate(-20deg)}.garland-right{top:150px;right:20px;transform:rotate(30deg)}.garland i{display:block;width:90px;height:45px;border-top:12px double #3b5d43;transform:rotate(20deg)}.garland b{color:var(--red);font-size:20px;position:absolute;top:40px}dialog{border:1px solid #c8a66a;border-radius:24px;background:var(--cream);color:var(--green);width:min(480px,calc(100% - 32px));padding:48px 35px 30px;text-align:center;box-shadow:0 25px 100px #0003}dialog::backdrop{background:#09251de0;backdrop-filter:blur(6px)}.close{position:absolute;right:18px;top:12px;background:none;border:0;font-size:28px;color:#7a715d}.result-eyebrow{font-size:9px;letter-spacing:2px;color:#977d48}h2{font-family:'Libre Caslon Display',Georgia,serif;font-weight:400;font-size:43px;margin:18px 0}dialog p{font-size:14px;color:#7b705b}.name{font-family:'Libre Caslon Display',Georgia,serif;color:var(--red);font-size:58px;border-block:1px solid #cbb17e;padding:10px;margin:20px 0}.wish{margin-bottom:26px}dialog small{display:block;margin-top:20px;color:#9b8d75;font-size:10px}.present{height:125px;margin-top:20px}.box{margin:auto;width:92px;height:82px;background:linear-gradient(90deg,#e1c286 42%,#8d202b 42%,#8d202b 57%,#e1c286 57%);border-radius:4px;box-shadow:0 8px 15px #0001}.bow{font-size:55px;line-height:40px;color:var(--red)}@media(max-width:760px){header{height:77px;padding:0 22px}.brand{font-size:27px}.secret{display:none}main{padding:22px}.demo{font-size:9px}.demo-detail{display:none}.hero{grid-template-columns:1fr;gap:28px;padding:35px 0 25px}.intro{text-align:center}.eyebrow{justify-content:center;font-size:9px;letter-spacing:2px}h1{font-size:67px;margin-top:20px}h1 br:nth-of-type(1){display:none}.subtitle{font-size:17px;margin-bottom:20px}.little{display:none}.wheel-wrap{width:min(330px,82vw);height:min(330px,82vw)}.play{padding-top:10px}.primary{font-size:21px}.stars{right:0}.garland{display:none}footer{padding-top:22px;gap:8px}footer p{font-size:12px;line-height:1.6}footer small{display:block}.bottom{font-size:9px;gap:9px}.hub{width:70px;height:70px;font-size:40px}}@media(prefers-reduced-motion:reduce){.wheel{transition-duration:.1s}.primary{transition:none}}

[hidden]{display:none!important}.entry{text-align:center;padding:38px 0}.entry>.eyebrow{justify-content:center}.entry h1{font-size:65px;line-height:1.05}.entry .subtitle{margin:15px 0 35px}.entry-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;text-align:left;align-items:stretch}.invitation{border:1px solid #ccb07c;border-radius:20px;background:#fffaf2;padding:36px;text-align:center;box-shadow:0 18px 45px #6d4f1d0c}.envelope{font-size:62px;color:var(--red);margin-bottom:20px}.invitation .eyebrow{justify-content:center;font-size:9px}.invitation h2{margin:20px 0}.invitation p,.mail-preview p{font-size:14px;line-height:1.8;color:#796f5c}.invitation small{display:block;font-size:10px;color:#9c8c73;margin-top:22px}label{display:block;font-size:12px;margin:18px 0 9px;color:#72674f}input,select{font:inherit;width:100%;border:1px solid #cfbd9c;border-radius:10px;padding:14px;background:#fffdf8;color:var(--green)}#invite-form .primary{margin-top:16px;font-size:19px}#entry-error{color:var(--red);min-height:20px;margin:10px 0}.mail-preview{padding:30px;background:#eee5d4;border-radius:18px;border:1px solid #ddd0b7}.mail-top{font-size:10px;letter-spacing:2px;color:#8c774e;padding-bottom:20px;border-bottom:1px solid #cfbd9a}.mail-meta{font-size:11px;line-height:1.9;color:#92836d;padding-top:18px}.mail-preview h3{font-family:'Libre Caslon Display',Georgia,serif;color:var(--red);font-size:39px;font-weight:400;margin:22px 0}.mail-preview .primary{font-size:19px;margin-top:14px}.sample-code{font-size:11px!important;text-align:center}.text-button{background:none;border:0;color:#7e6845;font-size:12px;text-decoration:underline;text-underline-offset:4px;padding:10px}.welcome{max-width:560px;margin:60px auto}.welcome-details{font-family:Georgia,serif;text-align:left;line-height:2.7;font-size:17px;margin:25px auto;max-width:270px}.welcome .primary{font-size:19px}.welcome .text-button{display:block;margin:15px auto 0}.session-bar{display:flex;justify-content:space-between;align-items:center;color:#8b7756;font-size:11px;padding:5px 0 25px}.done-note{color:var(--red)}@media(max-width:760px){.entry{padding:25px 0}.entry h1{font-size:49px}.entry-grid{grid-template-columns:1fr}.invitation{padding:28px 20px}.mail-preview{padding:25px}.welcome{margin:30px auto}.welcome h2{font-size:38px}}

.wish-card{text-align:left;background:#eee5d4;padding:18px 22px;border-radius:14px;margin:20px 0}.wish-card h3{font-family:Georgia,serif;font-weight:400;margin:0 0 12px;font-size:19px}.wish-card ul{padding-left:20px;margin:0;color:#6f624c;font-size:14px;line-height:1.8}.wish-card small{margin:12px 0 0}dialog{max-height:90vh;overflow-y:auto}.wish{margin-bottom:12px}
.entry-single{max-width:560px;margin:30px auto}.pixel-credit{display:flex;flex-direction:column;align-items:center;gap:16px;text-decoration:none;text-align:center;background:#17191e;color:#eee;padding:30px 20px;border-radius:16px;margin:28px 0 10px}.pixel-credit img{width:256px;height:auto;max-width:85%}.pixel-credit span{font-size:13px;line-height:1.6}.pixel-credit strong{font-size:12px;color:#ff5a62;font-weight:500}.pixel-credit:hover{background:#23252c}

/* Consistent vector icons across iOS and Android. */
.primary::after{content:"";display:inline-block;width:18px;height:18px;margin-left:12px;vertical-align:-1px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19 19 5M5 5h14v14' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 19 19 5M5 5h14v14' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}.primary:disabled::after,#hide::after{display:none}.step-icon svg{width:32px;height:32px;display:inline-block;vertical-align:middle}