
:root{--deep:#041b16;--green:#0a3327;--forest:#12513a;--gold:#cba65a;--goldlight:#e7cd88;--paper:#f7eedb;--ink:#14382b;--paperedge:#d6c19b;--muted:#948260}
*{box-sizing:border-box}html,body{height:100%;width:100%;margin:0;overflow:hidden}body{font-family:"DM Sans",sans-serif;color:var(--paper);background:radial-gradient(ellipse at 50% 28%,#1a503d 0%,#0a2b22 40%,#03140f 100%);-webkit-font-smoothing:antialiased}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #d8ad4b;outline-offset:3px}a{color:inherit}button:disabled{opacity:.34;cursor:not-allowed}.defs{position:absolute;width:0;height:0;overflow:hidden}.ambient{position:fixed;inset:0;pointer-events:none;z-index:0;background-image:radial-gradient(circle at 0 0,transparent 13px,#c1a46d 14px,transparent 15px),radial-gradient(circle at 27px 27px,transparent 13px,#c1a46d 14px,transparent 15px);background-size:54px 54px;opacity:.09}.ambient:after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent,#041b16 76%)}.topbar{position:relative;z-index:2;height:70px;padding:0 clamp(15px,5vw,58px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #cba65a44}.monogram{font:600 28px/1 "Cormorant Garamond",serif;letter-spacing:.08em;color:#f4e5bd;text-decoration:none}.monogram span{font-style:italic;color:var(--gold)}.topbar-date{font-size:10px;letter-spacing:.24em;color:var(--goldlight);font-weight:600}.topbar-caption{color:#bca977;font:italic 18px "Cormorant Garamond",serif}.book-stage{position:relative;z-index:1;height:calc(100dvh - 70px);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:18px;padding:18px 16px 23px;min-height:0}.book-stage[inert]{pointer-events:none}.book{position:relative;width:min(1050px,93vw);height:min(690px,calc(100dvh - 198px));min-height:350px;flex:0 1 auto;box-shadow:0 22px 35px rgba(0,0,0,.37);perspective:2200px;transform-style:preserve-3d}.book::before{content:"";position:absolute;inset:-9px;border:1px solid #c59b4e66;border-radius:15px;z-index:-2}.book::after{content:"";position:absolute;inset:0;border-radius:9px;box-shadow:inset 0 0 0 8px #113b2a,inset 0 0 0 10px #bf9d60;pointer-events:none;z-index:80}.book-left{position:absolute;left:0;top:0;bottom:0;width:50%;border-radius:9px 0 0 9px;background:radial-gradient(ellipse at 46% 38%,#255a43,#0c382a 58%,#09291e 100%);border:1px solid #b99454;box-shadow:inset -19px 0 21px #0004;display:flex;align-items:center;justify-content:center;text-align:center;padding:38px;overflow:hidden}.book-left:after{content:"";position:absolute;inset:14px;border:1px solid #b89a5c77;pointer-events:none;border-radius:75px 4px 4px 4px}.book-left:before{content:"";position:absolute;width:500px;height:500px;top:-240px;left:-150px;background:repeating-conic-gradient(from 0deg,#d6b86c12 0deg 10deg,transparent 10deg 21deg);border-radius:50%;opacity:.8}.left-content{position:relative;z-index:1;max-width:325px}.left-crescent{width:65px;height:65px;color:var(--goldlight);margin-bottom:15px}.left-arabic{font:38px/1.55 Amiri,serif;color:var(--goldlight);margin:4px 0 8px}.left-eyebrow{font-size:9px;letter-spacing:.26em;color:#d4bc84;line-height:1.8}.left-line{width:136px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:26px auto}.left-heading{font:500 clamp(35px,4vw,54px)/1.04 "Cormorant Garamond",serif;margin:10px 0 17px}.left-heading em{color:var(--goldlight);font-weight:400}.left-sub{font:21px/1.4 "Cormorant Garamond",serif;color:#e9dfc5}.left-names{font:45px "Great Vibes",cursive;color:#f1d99f;margin:20px 0}.left-names span{font:italic 23px "Cormorant Garamond",serif;padding:0 4px}.left-floral{font:27px "Cormorant Garamond",serif;color:var(--gold);letter-spacing:14px;margin-top:20px}.book-spine{position:absolute;top:4px;bottom:4px;left:calc(50% - 7px);width:14px;z-index:85;background:linear-gradient(90deg,#030e0b44,#f6dba055,#040d0a66);box-shadow:0 0 9px #0006;pointer-events:none;border-radius:100%}.leaf{position:absolute;left:50%;top:0;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;transition:transform 880ms cubic-bezier(.25,.65,.15,1);z-index:calc(30 - var(--i));pointer-events:none}.leaf.is-flipped{transform:rotateY(-180deg);z-index:calc(var(--i) + 1)}.leaf.is-current{pointer-events:auto}.leaf.is-turning{pointer-events:none}.leaf-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;background:var(--paper);color:var(--ink);border:1px solid #bb9d63;border-radius:0 8px 8px 0;box-shadow:inset 11px 0 18px #75664117,inset -5px 0 6px #93794618}.leaf-front{display:flex;flex-direction:column;align-items:stretch;justify-content:center;text-align:center;padding:clamp(24px,4vh,45px) clamp(20px,3vw,43px);background-image:radial-gradient(circle at 60% 8%,#fff9e9 0%,#f7eedb 60%,#ebdec3 100%)}.leaf-front:before{content:"";position:absolute;inset:12px;border:1px solid #bc975766;pointer-events:none;border-radius:0 75px 6px 6px}.leaf-front:after{content:"";position:absolute;inset:19px;border:1px solid #decaa288;pointer-events:none;border-radius:0 68px 4px 4px}.leaf-back{transform:rotateY(180deg);border-radius:8px 0 0 8px;background:radial-gradient(ellipse at center,#eee2c6,#d5bd92);display:flex;align-items:center;justify-content:center;text-align:center}.leaf-back:after{content:"";inset:14px;position:absolute;border:1px solid #a98142;pointer-events:none}.leaf-back-inner{color:#987640;padding:20px}.leaf-back-inner svg{width:57px;height:57px;opacity:.6}.leaf-back-inner p{font:italic 28px "Cormorant Garamond",serif}.page-content{position:relative;z-index:1;max-height:100%;min-height:0;overflow-y:auto;scrollbar-width:none}.page-content::-webkit-scrollbar{display:none}.tiny-ornament{font-size:20px;letter-spacing:14px;color:#af8646}.mini-eyebrow{font-size:9px;letter-spacing:.24em;font-weight:700;color:#95763e;margin:12px 0 8px}.page-heading{font:500 clamp(37px,4.5vw,59px)/1.02 "Cormorant Garamond",serif;margin:6px 0 9px;color:#163b2d}.page-heading em{color:#a27a3d;font-weight:400}.page-script{font:clamp(63px,7vw,94px)/.94 "Great Vibes",cursive;color:#103e2f;margin:25px 0 15px;text-shadow:0 3px 0 #d7c9ad}.page-script span{display:block}.page-script .weds{font:italic 26px "Cormorant Garamond",serif;color:#aa8647;padding:8px 0 7px}.page-rule{display:block;color:#ad8642;width:148px;height:25px;margin:12px auto}.page-description{font:clamp(19px,2vw,23px)/1.35 "Cormorant Garamond",serif;color:#4b5847;margin:13px auto;max-width:350px}.page-number{font:italic 14px "Cormorant Garamond",serif;color:#9c7f4b;margin-top:21px}.page-arabic{font:30px/1.6 Amiri,serif;color:#806029;margin:0}.personal-greeting{font:italic 22px "Cormorant Garamond",serif;color:#9c793f;margin:8px auto}.date-seal{display:flex;align-items:baseline;justify-content:center;gap:12px;margin:28px auto 12px}.date-seal strong{font:500 clamp(90px,9vw,122px)/.9 "Cormorant Garamond",serif;color:#133e2d}.date-seal span{font:500 18px/1.45 "Cormorant Garamond",serif;text-align:left;letter-spacing:.05em;color:#98733e}.event-symbol{width:94px;height:93px;margin:5px auto 0;color:#bd9143}.event-symbol svg{width:100%;height:100%}.event-title{font:600 62px/1 "Cormorant Garamond",serif;margin:6px 0 0}.event-sub{font:700 9px "DM Sans",sans-serif;letter-spacing:.2em;color:#96723c;margin:7px 0}.event-foot{font:italic 24px "Cormorant Garamond",serif;margin:16px 0;color:#56634c}.page-button{display:inline-flex;gap:15px;align-items:center;justify-content:center;border:1px solid #a8874f;padding:12px 17px;min-height:43px;background:#123f2f;color:#fbebc8;text-decoration:none;font:700 11px "DM Sans",sans-serif;letter-spacing:.06em;transition:.2s;max-width:100%}.page-button:hover{background:#2b5b42;transform:translateY(-1px)}.page-button.secondary{background:transparent;color:#22503b}.page-button.secondary:hover{background:#e5d4ad}.page-small{font-size:11px;line-height:1.45;color:#837761;margin:13px auto;max-width:310px}.venue-pin{font-size:41px;color:#aa8747;margin:12px 0}.venue-address{font:500 clamp(25px,3vw,36px)/1.12 "Cormorant Garamond",serif;font-style:normal;margin:14px 0 25px}.venue-map{max-width:100%;width:285px;min-height:105px;margin:20px auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:1px solid #b99f68;background:radial-gradient(circle,#e7d7b6,#efe0c2);color:#36543e;font-size:11px;letter-spacing:.08em}.venue-map span{font-size:29px}.count-wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:345px;margin:26px auto}.count-wrap div{border:1px solid #d5c092;padding:13px 2px 10px;background:#fff9ee8f}.count-wrap strong{display:block;font:500 40px "Cormorant Garamond",serif;color:#153b2c}.count-wrap span{font-size:8px;letter-spacing:.1em;color:#997b49}.prayer{font:500 clamp(25px,3vw,36px)/1.16 "Cormorant Garamond",serif;margin:15px auto}.prayer em{color:#a78246}.link-form{text-align:left;margin:23px auto 0;max-width:300px}.link-form label{display:block;font-size:10px;letter-spacing:.16em;color:#896e40;font-weight:700;margin-bottom:8px}.link-form input{width:100%;height:44px;border:1px solid #bea674;background:#fff9e7;color:#173a2b;padding:0 12px;border-radius:0}.link-form .page-button{width:100%;margin-top:9px}.link-preview{border:1px solid #ccb37e;background:#eddfc3;padding:12px;margin:12px auto 0;max-width:320px;text-align:left}.link-preview>span{font:700 9px "DM Sans",sans-serif;letter-spacing:.14em;color:#9d793d}.link-url{font:12px/1.45 "DM Sans",sans-serif;overflow-wrap:anywhere;margin:7px 0 10px;color:#123d2c}.link-actions{display:flex;gap:8px;flex-wrap:wrap}.link-actions button,.link-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:7px 11px;border:1px solid #ab8b55;background:#133f2f;color:#f8edcc;font-size:11px;text-decoration:none}.link-actions a{background:transparent;color:#1e503a}.error{color:#922c24;font-size:12px;margin:8px 0}.closing-dua{font:italic 22px "Cormorant Garamond",serif;color:#a38042;margin:15px auto}.footer-controls{width:min(1050px,93vw);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-shrink:0}.nav-button{min-width:150px;border:1px solid #bd9c61;color:#f7e4ba;background:#0e3829;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 20px;font:600 11px "DM Sans",sans-serif;letter-spacing:.09em;transition:.2s}.nav-button:not(:disabled):hover{background:#1d4e39}.nav-center{text-align:center;flex:1}.page-counter{font:500 19px "Cormorant Garamond",serif;color:#e9d6a2}.page-counter small{font:500 10px "DM Sans",sans-serif;letter-spacing:.18em;color:#a9ad92}.page-dots{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:7px}.page-dots span{width:5px;height:5px;border-radius:50%;background:#b49b69;opacity:.38;transition:.2s}.page-dots span.is-active{opacity:1;background:#f0cd76;transform:scale(1.5)}.swipe-hint{text-align:center;font-size:10px;letter-spacing:.12em;color:#a4a990;flex-shrink:0}.intro-overlay{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:16px;background:radial-gradient(ellipse at center,#133c2d,#02100c 75%);perspective:1800px;transition:opacity .5s 1.05s,visibility .5s 1.05s}.intro-overlay.is-opening{opacity:0;visibility:hidden;pointer-events:none}.cover-card{width:min(450px,90vw);height:min(650px,85dvh);min-height:390px;position:relative;transform-style:preserve-3d;transform-origin:left center;transition:transform 1.15s cubic-bezier(.28,.81,.21,1),filter 1.15s;filter:drop-shadow(0 17px 35px #0009)}.intro-overlay.is-opening .cover-card{transform:rotateY(-158deg);filter:drop-shadow(12px 17px 18px #0005)}.cover-front,.cover-back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:7px;background:radial-gradient(ellipse at 50% 39%,#195038,#062c21 80%);border:3px solid #caa45b;box-shadow:inset 0 0 0 10px #0c3c2b,inset 0 0 0 11px #c8a358,0 0 0 6px #052418}.cover-front:before,.cover-back:before{content:"";position:absolute;inset:20px;border:1px solid #cfa9688c;pointer-events:none;border-radius:110px 110px 5px 5px}.cover-front:after{content:"";position:absolute;inset:29px;border:1px solid #cfa9683d;pointer-events:none;border-radius:100px 100px 3px 3px}.cover-back{transform:rotateY(180deg);background:#e2d2b0}.cover-interior{position:absolute;inset:34px 24px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.cover-crescent{width:52px;height:52px;color:#e3c277}.cover-kicker{font-size:9px;letter-spacing:.24em;color:#efd7a2;margin:16px 0 5px}.cover-arabic{font:35px Amiri,serif;color:#f0d799;line-height:1.5;margin:6px 0}.cover-names{font:400 clamp(66px,11vw,83px)/.94 "Great Vibes",cursive;color:#f8e5b8;margin:14px auto 5px;text-shadow:0 3px 16px #0003}.cover-names span{display:block}.cover-names .mini-weds{font:italic 25px "Cormorant Garamond",serif;color:#ddbd72;margin:10px 0}.cover-for{font:italic 23px "Cormorant Garamond",serif;color:#f8e7c4;margin:13px auto 4px}.cover-guest{font:500 32px "Cormorant Garamond",serif;color:#e7c16f;max-width:340px;overflow-wrap:anywhere}.cover-line{height:1px;width:125px;background:linear-gradient(90deg,transparent,#edc46d,transparent);margin:13px auto}.cover-date{font-size:10px;letter-spacing:.19em;color:#efdfba;margin:8px 0 19px}.open-button{background:#e7c783;color:#173b2c;border:1px solid #f4dfac;padding:14px 24px;font-size:11px;letter-spacing:.12em;font-weight:800;box-shadow:0 7px 25px #0004;transition:.2s}.open-button:hover{background:#f8dfa9;transform:translateY(-2px)}.cover-instruction{color:#ccb98c;font:italic 17px "Cormorant Garamond",serif;margin:15px 0 0}.cover-flower{position:absolute;color:#d8b36e66;font-size:28px;z-index:2}.cover-flower.left{left:25px;bottom:25px}.cover-flower.right{right:25px;top:25px}.toast{position:fixed;z-index:180;bottom:22px;left:50%;transform:translate(-50%,70px);background:#e5d0a3;color:#173b2b;padding:12px 18px;font-size:12px;box-shadow:0 10px 30px #0004;transition:.25s;opacity:0;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:710px){.topbar{height:55px}.topbar-date{font-size:9px;letter-spacing:.09em}.topbar-caption{display:none}.book-stage{height:calc(100dvh - 55px);padding:12px 14px 16px;gap:12px}.book{width:min(440px,91vw);height:calc(100dvh - 161px);max-height:720px;min-height:325px}.book-left,.book-spine{display:none}.book::after{box-shadow:inset 0 0 0 5px #103f2d,inset 0 0 0 7px #bc9c60}.leaf{left:0;width:100%;transform-origin:left center}.leaf-front{padding:21px 25px}.leaf-front:before{inset:10px;border-radius:70px 70px 5px 5px}.leaf-front:after{inset:16px;border-radius:63px 63px 5px 5px}.page-heading{font-size:clamp(39px,9.5vw,57px)}.page-script{font-size:clamp(71px,16vw,98px)}.page-description{font-size:21px}.date-seal{margin:13px auto}.date-seal strong{font-size:105px}.event-title{font-size:57px}.event-symbol{width:80px;height:78px}.venue-map{margin:10px auto}.venue-address{margin:9px 0 15px}.count-wrap{margin:14px auto}.count-wrap strong{font-size:34px}.footer-controls{width:min(440px,91vw);gap:8px}.nav-button{min-width:105px;padding:11px 12px;gap:8px;font-size:10px}.page-counter{font-size:15px}.page-counter small{font-size:8px}.swipe-hint{font-size:9px}.cover-card{height:min(650px,85dvh)}.cover-crescent{width:41px;height:41px}.cover-arabic{font-size:29px}.cover-names{font-size:clamp(64px,16vw,85px)}.cover-for{font-size:21px}.cover-guest{font-size:27px}.cover-interior{inset:33px 24px}}
@media(max-width:370px){.leaf-front{padding:15px 19px}.mini-eyebrow{font-size:8px}.page-heading{font-size:38px}.page-description{font-size:18px}.page-script{font-size:63px}.date-seal strong{font-size:82px}.event-symbol{height:65px;width:65px}.cover-card{min-height:355px}.cover-names{font-size:60px}.cover-arabic{font-size:25px}.nav-button{min-width:90px}.page-counter small{letter-spacing:0}}
@media(max-height:700px){.book{height:calc(100dvh - 159px);min-height:290px}.book-stage{gap:10px}.leaf-front{padding-top:15px;padding-bottom:15px}.page-script{margin:13px 0 5px}.page-description{margin:8px auto}.page-rule{margin:5px auto}.tiny-ornament{font-size:15px}.event-symbol{height:58px;width:63px}.date-seal strong{font-size:77px}.date-seal{margin:10px auto}.event-title{font-size:48px}.page-heading{font-size:39px}.page-number{margin-top:8px}.count-wrap{margin:11px auto}.count-wrap strong{font-size:31px}.venue-map{min-height:65px}.cover-card{height:85dvh}.cover-crescent{height:33px;width:33px}.cover-arabic{font-size:26px;margin:3px 0}.cover-names{font-size:60px;margin:7px}.cover-for{margin:5px auto}.cover-date{margin:6px 0 11px}.cover-instruction{margin:7px 0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}}

/* The music control lives inside the header, away from page-turn navigation. */
.topbar{gap:12px}
.topbar-date,.monogram{flex-shrink:0;white-space:nowrap}
.music-toggle{position:relative;z-index:3;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:7px 11px;border:1px solid #dfbd74;background:#123c2c;color:#f4dc9b;border-radius:24px;font:700 10px "DM Sans",sans-serif;letter-spacing:.025em;transition:background .2s,border-color .2s}
.music-toggle[hidden]{display:none!important}
.music-toggle:hover:not(:disabled){background:#22523c;border-color:#ffe2a1}
.music-toggle:disabled{opacity:.65}
.music-icon{font-size:18px;line-height:1}
.music-toggle.is-playing .music-icon{animation:music-note 1.8s ease-in-out infinite}
@keyframes music-note{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@media(max-width:710px){.topbar{gap:8px}.music-toggle{width:34px;height:34px;min-height:34px;padding:0;border-radius:50%;margin-left:0}.music-icon{font-size:18px}#musicLabel{display:none}.topbar-date{font-size:8px;letter-spacing:.03em}}
@media(max-width:370px){.topbar{gap:5px}.monogram{font-size:24px}.topbar-date{font-size:7.5px;letter-spacing:0}.music-toggle{width:32px;height:32px;min-height:32px}}
@media(prefers-reduced-motion:reduce){.music-toggle.is-playing .music-icon{animation:none}}

/* Keep actual page fronts from showing through the reverse side.
   In some browsers, filters flatten preserve-3d and leak mirrored text.
   JS switches the rendered face precisely at the midpoint of each flip. */
.leaf { -webkit-transform-style:preserve-3d; transform-style:preserve-3d; will-change:transform; }
.leaf-face { -webkit-backface-visibility:hidden; backface-visibility:hidden; }
.leaf-front { -webkit-transform:translateZ(0.5px); transform:translateZ(0.5px); visibility:visible; }
.leaf-back { -webkit-transform:rotateY(180deg) translateZ(0.5px); transform:rotateY(180deg) translateZ(0.5px); visibility:hidden; }
.leaf.is-showing-back .leaf-front { visibility:hidden; }
.leaf.is-showing-back .leaf-back { visibility:visible; }
