:root{--gfx-primary:#173e34;--gfx-gold:#b99a5d;--gfx-cream:#f6f0e4}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#121a17}
body.gfx-wedding-page{font-family:Arial,Helvetica,sans-serif;color:#24312c}
.gfx-wedding-app{--gfx-primary:#173e34;--gfx-gold:#b99a5d;--gfx-cream:#f6f0e4;min-height:100vh;background:#121a17}
.gfx-viewer{width:min(100%,760px);margin:0 auto;background:#fff;min-height:100vh;box-shadow:0 0 60px rgba(0,0,0,.25)}
.gfx-pages{width:100%}
.gfx-page{margin:0;padding:0;line-height:0;background:#eee}
.gfx-page img{display:block;width:100%;height:auto;margin:0;padding:0}
.gfx-program-block{padding:46px 24px;text-align:center;background:#fff}
.gfx-program-kicker{margin:0 0 10px;font-size:12px;letter-spacing:.22em;font-weight:700;color:var(--gfx-gold)}
.gfx-program-block h2{margin:0 0 20px;font-family:Georgia,"Times New Roman",serif;font-size:clamp(30px,6vw,48px);font-weight:400;color:var(--gfx-primary)}
.gfx-timer-block{background:var(--gfx-primary);color:#fff}
.gfx-timer-block h2{color:#fff}
.gfx-countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:600px;margin:28px auto 0}
.gfx-countdown>div{padding:18px 4px;border-top:1px solid color-mix(in srgb,var(--gfx-gold) 60%,transparent);border-bottom:1px solid rgba(255,255,255,.14)}
.gfx-countdown strong{display:block;font-family:Georgia,"Times New Roman",serif;font-size:clamp(30px,8vw,54px);font-weight:400}
.gfx-countdown span{display:block;margin-top:7px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--gfx-cream)}
.gfx-chip{display:inline-block;margin:4px 0 0;padding:10px 17px;border:1px solid var(--gfx-gold);border-radius:999px;font-size:13px}
.gfx-action-block{background:var(--gfx-cream)}
.gfx-inline-actions,.gfx-welcome-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.gfx-btn{appearance:none;border:0;border-radius:999px;padding:14px 21px;text-transform:uppercase;letter-spacing:.08em;font-size:12px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.gfx-btn-primary{background:var(--gfx-primary);color:#fff}
.gfx-btn-light{background:#fff;color:var(--gfx-primary)}
.gfx-btn-outline{background:transparent;color:var(--gfx-primary);border:1px solid var(--gfx-primary)}
.gfx-btn:disabled{opacity:.45;cursor:not-allowed}
.gfx-full{width:100%}
.gfx-rsvp-block p{line-height:1.6}
.gfx-gallery-block{background:#f7f5ef}
.gfx-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;max-width:700px;margin:28px auto 0}
.gfx-gallery img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.gfx-welcome{--gfx-cover:none;position:fixed;inset:0;z-index:99999;display:grid;place-items:center;padding:24px;background-image:var(--gfx-cover);background-size:cover;background-position:center;transition:opacity .55s ease,visibility .55s ease}
.gfx-welcome-overlay{position:absolute;inset:0;background:linear-gradient(rgba(10,31,24,.62),rgba(10,31,24,.82));backdrop-filter:blur(2px)}
.gfx-welcome-card{position:relative;z-index:2;width:min(100%,520px);text-align:center;color:#fff}
.gfx-kicker{font-size:11px;letter-spacing:.28em;font-weight:700;color:#ead29c;margin:0 0 14px}
.gfx-welcome-card h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(34px,8vw,58px);font-weight:400;line-height:1.08;margin:0 0 14px}
.gfx-welcome-copy{margin:0 0 25px;color:rgba(255,255,255,.85);line-height:1.6}
.gfx-audio-note{font-size:12px;color:rgba(255,255,255,.68);margin-top:18px}
.gfx-welcome.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.gfx-music-toggle{position:fixed;right:18px;bottom:18px;z-index:9990;width:48px;height:48px;border:0;border-radius:50%;background:var(--gfx-primary);color:#fff;font-size:20px;box-shadow:0 8px 24px rgba(0,0,0,.25);display:none}
.gfx-music-toggle.is-visible{display:block}
.gfx-music-toggle.is-playing{outline:3px solid color-mix(in srgb,var(--gfx-gold) 45%,transparent)}
.gfx-modal{position:fixed;inset:0;z-index:99998;display:none;place-items:center;padding:18px;background:rgba(0,0,0,.72);backdrop-filter:blur(5px)}
.gfx-modal.is-open{display:grid}
.gfx-modal-dialog{position:relative;width:min(100%,520px);max-height:90vh;overflow:auto;background:#fff;border-radius:18px;padding:34px 24px;box-shadow:0 25px 80px rgba(0,0,0,.28)}
.gfx-modal-close{position:absolute;top:8px;right:13px;border:0;background:transparent;font-size:30px;line-height:1;color:#58615d;cursor:pointer}
.gfx-modal-kicker{font-size:11px;letter-spacing:.2em;color:var(--gfx-gold);font-weight:700}
.gfx-modal-dialog h2{font-family:Georgia,"Times New Roman",serif;font-size:34px;font-weight:400;color:var(--gfx-primary);margin:6px 0 10px}
.gfx-modal-copy{color:#69726e;line-height:1.5}
.gfx-modal label{display:block;font-size:13px;font-weight:600;margin:14px 0}
.gfx-modal input,.gfx-modal select,.gfx-modal textarea{width:100%;display:block;margin-top:7px;border:1px solid #d6ddd9;border-radius:9px;padding:12px;background:#fff;font:inherit}
.gfx-status{font-size:13px;line-height:1.5}
@media(max-width:520px){
  .gfx-program-block{padding:38px 18px}
  .gfx-countdown{gap:4px}
  .gfx-countdown>div{padding:14px 2px}
  .gfx-countdown span{font-size:9px}
  .gfx-welcome-actions{flex-direction:column}
  .gfx-welcome-actions .gfx-btn{width:100%}
}