@font-face{font-family:WeddingNastaliq;src:url('assets/fonts/NotoNastaliqUrdu-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
*{box-sizing:border-box}
:root{color-scheme:light;--wine:#6c3440;--ink:#744e55;--ivory:#f7f7f0}
html,body{margin:0;width:100%;height:100%;overflow:hidden}
body{background:radial-gradient(ellipse at center,#faf8f2,#e9e3da);color:var(--ink);font-family:'B Nazanin','Noto Naskh Arabic','Times New Roman',Tahoma,serif;display:grid;place-items:center}
button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}[hidden]{display:none!important}
.lace-card{position:relative;width:min(100vw,480px);height:100vh;height:100svh;overflow:hidden;background:var(--ivory);box-shadow:0 10px 70px #79675730;isolation:isolate}
.frame{position:absolute;inset:0;z-index:0;background:#f7f7f0}
.frame:before{content:'';position:absolute;inset:0;background:url('assets/lace/bellagio-az-poster.jpg') center/cover;opacity:.6}
.frame:after{content:'';position:absolute;inset:9% 12%;background:#f7f7f0;border-radius:45%;filter:blur(15px)}
.frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:1}
.invitation{position:absolute;inset:11% 0 10%;z-index:2;display:flex;align-items:center;justify-content:center;opacity:0;transform:scale(.97);transition:opacity 1.1s ease,transform 1.4s ease;pointer-events:none}
.lace-card.opened .invitation{opacity:1;transform:none;pointer-events:auto}
.card-content{width:65%;text-align:center;transform:scale(var(--card-scale,1));transform-origin:center;flex-shrink:0;padding:15px 0;max-width:310px}
.family-line{font-size:14px;line-height:1.5;margin:0 0 10px;color:#a69a91}
h1{font-family:WeddingNastaliq,serif;font-weight:400;margin:0 0 5px;padding-bottom:8px;display:flex;align-items:center;justify-content:center;gap:16px;font-size:clamp(30px,8vw,40px);line-height:2;color:var(--wine)}
h1 em{font-family:inherit;font-style:normal;font-size:22px;font-weight:400;color:#baa9a1}
.couple-photo{margin:5px auto 13px;width:clamp(96px,26vw,122px);aspect-ratio:852/1201;height:auto;border-radius:48% 48% 45% 45%;padding:4px;border:1px solid #cbb7a7;box-shadow:0 3px 12px #a6917d20;background:#faf9f3;overflow:hidden}
.couple-photo img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:inherit;display:block}
.invitation-text{font-size:clamp(15px,3.8vw,18px);line-height:1.6;margin:0;color:#8e7977}
.tiny-flourish{font-size:25px;color:#bba697;line-height:1.3;margin:8px 0}
.event-details p{margin:4px 0}.event-date{font-size:18px;color:var(--wine)}.event-time{font-size:14px}.event-details h2{font-size:25px;font-weight:400;margin:8px 0 1px}.event-city{font-size:15px;color:#a18f88}.event-address{font-size:13px;line-height:1.4;overflow-wrap:anywhere;max-width:260px;margin:5px auto!important}
.countdown{display:flex;direction:ltr;justify-content:center;align-items:center;gap:9px;margin:13px 0 0;color:var(--wine)}.countdown div{display:flex;flex-direction:column;min-width:28px}.countdown strong{font-size:20px;font-weight:400}.countdown span{font-size:10px;color:#a6908a}.countdown i{font-style:normal;font-size:14px;margin-bottom:12px;color:#c5b5a9}
.card-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:17px}.pill{border:1px solid #bfa9a4;border-radius:25px;padding:7px 15px;background:#faf9f340;color:var(--wine);text-decoration:none;font-size:13px;line-height:1.4;transition:background .2s}.pill:hover{background:#ecdfd8}.pill:focus-visible,.cover-button:focus-visible{outline:2px solid var(--wine);outline-offset:3px}.closing-line{font-size:12px;color:#aa9891;margin:13px 0 0}
.cover{position:absolute;inset:0;z-index:10;background:#f1eee7;transition:opacity .8s ease;overflow:hidden}.cover-poster,.opening-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.opening-video{opacity:0;transition:opacity .2s}.cover.playing .opening-video{opacity:1}.cover-button{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:none;color:#826e63}.cover-button:disabled{pointer-events:none}.tap-hint{position:absolute;bottom:9%;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:12px;padding:6px 12px;border-radius:20px;background:#faf8f2bf;box-shadow:0 2px 12px #74605115;animation:hint 2.5s ease infinite}.cover.playing .cover-button{pointer-events:none}.cover.playing .tap-hint{opacity:0;animation:none;transition:opacity .25s}.cover.finished{opacity:0;pointer-events:none}.cover.fallback .cover-poster{animation:laceReveal 1.8s cubic-bezier(.22,.7,.2,1) forwards}.cover.fallback .opening-video{display:none}
.preload-gate{position:absolute;top:0;right:0;bottom:0;left:0;z-index:12;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;gap:10px;background:linear-gradient(#f7f3eccc,#efe8dfd9);transition:opacity .55s ease;pointer-events:none}.preload-gate.ready{opacity:0}.preload-count{margin:0;font-family:WeddingNastaliq,serif;font-size:56px;font-size:clamp(52px,14vw,72px);line-height:1;color:var(--wine);text-shadow:0 2px 18px #6c344018}.preload-caption{margin:0;font-size:14px;letter-spacing:.02em;color:#8d746d;text-align:center;padding:0 16px}.preload-gate.waiting .preload-count{font-size:32px;font-size:clamp(28px,8vw,36px)}
.music-toggle{position:absolute;z-index:15;bottom:20px;left:20px;width:37px;height:37px;border-radius:50%;border:0;background:#eee5dcbb;color:var(--wine);font-size:19px;backdrop-filter:blur(6px)}
dialog{width:min(90vw,390px);max-height:90svh;border:1px solid #d0beb0;border-radius:18px;background:#faf8f1;color:var(--wine);padding:30px 25px 20px;box-shadow:0 20px 70px #3e2d2860;text-align:center}dialog::backdrop{background:#4a3d3660;backdrop-filter:blur(4px)}.dialog-close{position:absolute;top:8px;left:12px;border:0;background:none;font-size:26px;color:#85686a}dialog h2{font-weight:400;font-size:25px;margin:0 0 8px}dialog>p{font-size:14px;margin:0 0 15px}form{text-align:right}form>label{display:block;font-size:15px;margin:10px 0}input:not([type=radio]){display:block;width:100%;border:1px solid #d5c3b6;border-radius:7px;background:white;padding:9px;margin-top:4px;color:#6c3440;outline-color:#a47e79}fieldset{border:0;padding:8px 0;font-size:14px}fieldset legend{margin-bottom:7px}fieldset label{display:block;margin:8px 0}form>.pill{display:block;margin:12px auto 0;padding:8px 30px;background:#6c3440;color:#fff}#formMessage{font-size:13px;text-align:center;margin:10px 0 0;line-height:1.6}
@keyframes hint{50%{opacity:.55}}@keyframes laceReveal{to{transform:scale(1.6);opacity:0;filter:blur(8px)}}
@media(min-width:600px){.lace-card{height:96vh;height:min(96svh,860px);border-radius:5px}}@media(max-height:680px){.family-line{margin-bottom:5px;font-size:12px}h1{font-size:36px;margin-bottom:5px}.couple-photo{height:110px;width:100px;margin-bottom:7px}.invitation-text{font-size:14px;line-height:1.4}.tiny-flourish{margin:4px 0;font-size:20px}.event-date{font-size:16px}.event-details h2{font-size:21px;margin-top:4px}.card-actions{margin-top:9px}.closing-line{margin-top:7px}.countdown{margin-top:7px}}
@media(prefers-reduced-motion:reduce){.invitation,.cover{transition-duration:.01s}.tap-hint{animation:none}.cover.fallback .cover-poster{animation-duration:.01s}}
@media(max-height:680px){h1{font-size:30px}.couple-photo{width:90px;height:auto}}
.family-line{font-size:16px;margin-bottom:7px}
h1{font-size:clamp(34px,9vw,45px);margin-bottom:2px}
h1 em{font-size:25px}
.invitation-text{font-size:clamp(17px,4.2vw,20px);line-height:1.5}
.tiny-flourish{margin:5px 0}
.event-date{font-size:21px}
.event-time{font-size:16px}
.event-details h2{font-size:28px;margin-top:5px}
.event-city{font-size:18px}
.event-address{font-size:15px}
.countdown{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));direction:rtl;gap:5px;margin-top:12px}
.countdown div{display:flex;flex-direction:row;align-items:baseline;justify-content:center;gap:3px;min-width:0;white-space:nowrap}
.countdown strong{font-size:23px;line-height:1.3;font-variant-numeric:tabular-nums;min-width:1.1em;text-align:center}
.countdown span{font-size:12px}
.pill{font-size:15px;padding:6px 15px}
.card-actions{margin-top:12px}
.closing-line{font-size:14px;margin-top:9px}
.event-address{line-height:1.5;text-wrap:pretty;margin:7px auto!important;color:#826e6c}
.map-links{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:10px}
.map-link{display:flex;align-items:center;flex-direction:column;justify-content:center;gap:5px;min-width:64px;min-height:64px;padding:6px 5px;color:var(--wine);background:#faf8f1;border:1px solid #c6aaa5;text-decoration:none;font-size:15px;line-height:1.3;border-radius:12px;transition:background .2s}
.map-link svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.map-link:hover{background:#ecdfd860}.map-link:focus-visible{outline:2px solid var(--wine);outline-offset:3px}
.map-links + .card-actions{margin-top:10px}
@media(max-height:680px){.family-line{font-size:14px}h1{font-size:34px}.invitation-text{font-size:16px}.event-date{font-size:19px}.event-details h2{font-size:25px}.event-city{font-size:16px}.pill{font-size:14px}.closing-line{font-size:13px}}
.couple-photo{width:clamp(96px,26vw,118px);height:auto;aspect-ratio:1;border-radius:50%;margin:5px auto 10px}
.couple-photo img{border-radius:50%;object-position:center 42%}
@media(max-height:680px){.couple-photo{width:90px}.map-link{min-height:58px}.map-link svg{width:27px;height:27px}}
.card-content{width:72%;max-width:345px;padding:6px 0}
h1{font-size:clamp(39px,10vw,49px);line-height:1.8;padding-bottom:5px}
.family-line{font-size:18px;margin-bottom:3px}
.couple-photo{width:clamp(150px,41vw,175px);margin:3px auto 9px}
.couple-photo{display:flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;box-shadow:none}
.couple-photo img{width:100%;height:100%;object-fit:contain;object-position:center;border-radius:50%}
.invitation-text{font-size:clamp(19px,4.7vw,22px);line-height:1.4}
.event-date{font-size:24px}.event-time{font-size:19px}
.event-details h2{font-size:31px}.event-city{font-size:20px}
.event-address{font-size:17px;line-height:1.4;max-width:100%}
.countdown strong{font-size:26px}.countdown span{font-size:14px}
.closing-line{font-size:21px;font-weight:700;line-height:1.5;color:var(--wine);margin-top:12px}
@media(max-height:680px){.family-line{font-size:16px}h1{font-size:39px}.couple-photo{width:140px}.invitation-text{font-size:18px}.event-date{font-size:22px}.event-details h2{font-size:28px}.event-address{font-size:16px}.closing-line{font-size:19px}}
.invitation-text.wedding-poem{font-size:clamp(14px,3.6vw,16px);line-height:1.65;color:var(--wine);margin:0;font-weight:400}
.wedding-poem span{display:block;text-wrap:balance}
.tiny-flourish{font-size:20px;margin:3px 0}
.map-links{margin-top:7px}
.closing-line{margin-top:8px}