:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{font-family:Playfair Display,serif;color:#1f2327;background-color:#fdfcf9}*{box-sizing:border-box}body{margin:0;min-height:100vh;background-color:#fdfcf9;width:100%;max-width:100%;overflow-x:hidden;scroll-snap-type:y proximity}html{width:100%;max-width:100%;overflow-x:hidden;scroll-snap-type:y proximity}#root{width:100%;max-width:100%;min-height:100vh;overflow-x:hidden}.landing{position:relative;min-height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center}.letter{position:absolute;font-weight:700;line-height:1;color:#1f2327;-webkit-user-select:none;user-select:none}.letter-m{font-size:22vw;top:4vh;left:50%;transform:translate(-50%)}.letter-j{font-size:22vw;bottom:30vh;right:10vw}.ampersand{position:absolute;font-size:32vw;left:-8vw;top:22vh;line-height:.95;font-weight:700;color:#1f2327;-webkit-user-select:none;user-select:none}.details{position:absolute;right:32vw;top:30vh;text-align:center;color:#2d3338}.tagline{margin:0 0 1rem;font-family:Cormorant Garamond,serif;font-style:italic;font-size:clamp(24px,1.6vw,26px);font-weight:500}.names{display:grid;gap:.4rem;text-transform:lowercase}.names .name{font-size:clamp(30px,2vw,32px);font-weight:700}.names .and{font-family:Cormorant Garamond,serif;font-style:italic;font-size:clamp(24px,1.2vw,26px)}.cta{position:absolute;left:32vw;bottom:16vh;text-align:center;color:#2d3338}.guest{margin:0 0 .7rem;font-family:Cormorant Garamond,serif;font-size:clamp(20px,1.3vw,22px);font-style:italic;font-weight:600}.guest span{font-weight:700}.cta button{padding:.65rem 1.3rem;font-size:clamp(18px,1.2vw,22px);font-family:Playfair Display,serif;text-transform:lowercase;background:#fff;border:none;border-radius:3px;box-shadow:0 12px 24px #0000001f;color:#1f2327;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.cta button:hover{transform:translateY(-2px);box-shadow:0 16px 28px #00000029}.cta button:active{transform:translateY(0);box-shadow:0 10px 18px #0000001f}@media(max-width:900px){.letter-m{font-size:32vw;top:6vh}.letter-j{font-size:32vw;right:4vw}.ampersand{font-size:46vw;top:28vh;left:-18vw}.details{right:50%;transform:translate(50%);top:34vh}.cta{left:50%;transform:translate(-50%);bottom:12vh}}.music-control{position:fixed;bottom:2rem;right:2rem;width:48px;height:48px;border-radius:50%;background:#fff;border:1px solid #e0e0e0;box-shadow:0 4px 12px #0000001a;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:1000;color:#1f2327;transition:all .3s ease}.music-control:hover{transform:scale(1.1);box-shadow:0 6px 16px #00000026}.music-control.playing{animation:pulse-shadow 2s infinite}@keyframes pulse-shadow{0%{box-shadow:0 0 #1f232733}70%{box-shadow:0 0 0 10px #1f232700}to{box-shadow:0 0 #1f232700}}.home{min-height:100vh;width:min(95vw,640px);margin:0 auto;padding:clamp(1.1rem,4vw,1.8rem);background:#fff;display:flex;flex-direction:column;gap:clamp(1rem,3vw,1.6rem)}hr{border:0;height:1px;background:#252525;margin:1rem auto;width:100%}.names-block{display:flex;flex-direction:column;gap:.4rem;color:#1f2327;text-align:left}.first-name,.second-name{font-family:Playfair Display,serif;line-height:1.05;letter-spacing:-.02em}.first-name{font-size:clamp(32px,6vw,48px);font-weight:700}.middle-line{display:flex;align-items:baseline;gap:.5rem}.and{font-family:Cormorant Garamond,serif;font-style:italic;font-size:clamp(28px,4.6vw,36px);font-weight:500}.second-name{font-size:clamp(32px,6vw,48px);font-weight:700}.photo-frame{width:100%}.photo-frame img{width:100%;display:block;object-fit:cover;aspect-ratio:3 / 4;background:#f4f4f4}.hadist{background:#050505;color:#f7f7f7;padding:clamp(.9rem,3vw,1.3rem) clamp(1.25rem,4vw,1.8rem);font-family:Playfair Display,serif;font-size:clamp(12px,3vw,14px);font-weight:500;line-height:1.6;letter-spacing:-.01em;margin-top:clamp(.3rem,3vw,1rem);text-align:justify}.hadist p{margin:0 0 .35rem}.hadist span{display:block;font-size:.95em;font-weight:500}.container-photo{margin-top:20px;display:grid;grid-template-columns:1fr 1fr;gap:clamp(.5rem,2vw,1rem);align-items:flex-start}.container-couple h1{font-family:Playfair Display,serif;font-size:clamp(36px,5vw,36px);font-weight:700;color:#1f2327;margin:clamp(.8rem,3vw,1.2rem) 0;text-align:center}.container-couple .salam{font-family:Cormorant Garamond,serif;font-size:clamp(24px,4vw,28px);font-weight:700}.container-couple h2,.cerita-cinta h2,.container-save-date h2,.container-photo-gallery h2,.container-gift h2,.message-board h2{font-family:Great Vibes,cursive;font-size:clamp(36px,5vw,44px);font-weight:700;color:#1f2327;margin:0 0 clamp(.8rem,3vw,1rem);text-align:center;line-height:1.2}.container-couple .text-invite{font-family:Cormorant Garamond,serif;font-size:clamp(16px,3vw,20px);font-weight:600;color:#010f1d;text-align:center}.container-in{display:flex;flex-direction:column-reverse;width:100%;align-items:center;justify-content:flex-start;gap:1rem;padding:0;background:transparent;box-shadow:none;border-radius:0;text-align:center}.container-in.reverse{flex-direction:column-reverse}.container-in-text{flex:0 0 auto;width:100%;font-family:Playfair Display,serif;color:#1f2327;text-align:center;padding:.5rem 0 0}.container-in.reverse .container-in-text{text-align:center}.container-in-text h3{margin:0 0 .5rem;font-size:clamp(22px,5vw,30px);font-weight:700;line-height:1.2;color:#1f2327}.container-in-text p{margin:0;font-family:Cormorant Garamond,serif;font-size:clamp(16px,3vw,18px);font-style:italic;color:#555;line-height:1.5}.container-in-photo{flex:0 0 auto;width:100%;max-width:250px;position:relative;border-radius:100px 100px 0 0;overflow:hidden;box-shadow:0 10px 25px #00000026;border:4px solid #fff;outline:1px solid #e0e0e0;margin:0 auto}.container-in-photo img{width:100%;height:100%;display:block;object-fit:cover;aspect-ratio:3/5;transition:transform .5s ease}.container-in:hover .container-in-photo img{transform:scale(1.05)}.countdowns{margin-top:clamp(1.2rem,4vw,2rem);display:grid;gap:clamp(.9rem,3vw,1.4rem)}.countdowns h3{font-size:.95rem;font-weight:900}.count-card{background:#fff;border:1px solid #e7e7e7;border-radius:8px;padding:clamp(1rem,3vw,1.4rem);box-shadow:0 10px 24px #00000014}.count-title{margin:0 0 .75rem;font-family:Playfair Display,serif;font-size:20px;font-weight:700;color:#1f2327}.count-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;text-align:center;margin-bottom:.65rem}.count-grid span{display:block;font-size:clamp(18px,4vw,22px);font-weight:700}.count-grid small{display:block;font-size:12px;color:#4b4f53}.count-date{margin:1.5rem 0 .5rem;font-family:Cormorant Garamond,serif;font-size:18px;font-weight:900;font-style:italic;color:#1f2327;background-color:transparent;text-shadow:.5px 0 0 #1f2327;padding:.8rem 2rem;border:1px solid #1f2327;outline:1px solid #1f2327;outline-offset:4px;display:inline-block;border-radius:0;box-shadow:none}.map-embed{margin-top:.5rem;border:1px solid #e7e7e7;border-radius:8px;overflow:hidden;background:#f7f7f7}.map-embed iframe{width:100%;height:250px;border:0;display:block}.container-save-date{text-align:center}.container-save-date h3{font-family:Playfair Display,serif;font-size:clamp(24px,5vw,32px);font-weight:700;color:#1f2327;margin:0 0 clamp(.6rem,3vw,1rem)}.container-date{display:flex;justify-content:center;gap:1.2rem;font-family:Playfair Display,serif}.container-date h4{margin:0}.container-photo-gallery{margin-top:clamp(1.5rem,4vw,2.2rem)}.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.1rem;margin-top:1rem}.gallery-item{width:100%;height:200px;overflow:hidden;background:#f4f4f4}.gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease}.gallery-item img:hover{transform:scale(1.05)}.container-gift{margin-top:clamp(1.5rem,4vw,2.2rem);text-align:center}.gift-cards{display:flex;flex-direction:column;gap:1rem;margin-top:1.5rem;align-items:center}.gift-card{background:#fff;border:1px solid #e7e7e7;border-radius:12px;padding:1.5rem;width:100%;max-width:350px;box-shadow:0 10px 24px #00000014;text-align:left;transition:transform .3s ease}.gift-card:hover{transform:translateY(-5px)}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;border-bottom:1px solid #f0f0f0;padding-bottom:.8rem}.bank-name{font-family:Playfair Display;font-weight:700;font-size:1.2rem;color:#1f2327}.bank-logo{height:24px;object-fit:contain}.card-body{margin-bottom:0}.account-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.2rem}.account-number{font-family:Arial,sans-serif;font-size:1.5rem;font-weight:700;color:#1f2327;margin:0;letter-spacing:.05em}.btn-copy-icon{background:none;border:none;padding:4px;cursor:pointer;color:#666;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s ease}.btn-copy-icon:hover{background-color:#f0f0f0;color:#1f2327}.btn-copy-icon:active{transform:scale(.9)}.account-name{font-family:Cormorant Garamond,serif;font-size:1rem;color:#666;margin:0;font-style:italic}.message-board{margin-top:clamp(1.5rem,4vw,2.2rem);padding:clamp(1rem,3vw,1.4rem);background:#fff;border:1px solid #e7e7e7;border-radius:10px;box-shadow:0 10px 24px #00000014}.message-form{display:grid;gap:.75rem;margin-bottom:1rem}.message-form input,.message-form textarea{width:100%;padding:.7rem .85rem;border:1px solid #dcdcdc;border-radius:6px;font-family:Cormorant Garamond,serif;font-size:16px;font-weight:600;color:#000;box-sizing:border-box}.message-form textarea{resize:vertical;min-height:90px}.message-form button{justify-self:flex-start;padding:.65rem 1.2rem;background:#1f2327;color:#fff;border:none;border-radius:6px;font-family:Playfair Display,serif;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}.message-form button:hover{transform:translateY(-1px);box-shadow:0 8px 18px #0000001f}.message-list{display:grid;gap:.75rem;max-height:260px;overflow:auto;padding-right:.25rem}.message-item{padding:.65rem .8rem;border:1px solid #ededed;border-radius:8px;background:#fafafa}.message-name{font-weight:700;margin-bottom:.3rem;color:#1f2327}.message-text{margin:0;color:#2f3337;line-height:1.5;font-size:14px}.empty-state{margin:0;color:#60656a;font-size:13px}.attendance-select{width:100%;padding:.7rem 2.5rem .7rem .85rem;border:1px solid #dcdcdc;border-radius:6px;font-family:Cormorant Garamond,serif;font-size:16px;font-weight:600;color:#000;box-sizing:border-box;background-color:#fff;cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231f2327' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .7rem center;background-size:1em}.message-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.3rem}.message-name{margin-bottom:0}.attendance-badge{font-size:11px;padding:2px 8px;border-radius:12px;font-weight:600;text-transform:uppercase;letter-spacing:.02em}.attendance-badge.hadir{background-color:#e6f4ea;color:#1e7e34}.attendance-badge.tidak_hadir{background-color:#fbe9e7;color:#c62828}.attendance-badge.ragu{background-color:#fff3e0;color:#ef6c00}@media(max-width:640px){.container-in{flex-direction:column-reverse;align-items:center}.container-in.reverse{flex-direction:column-reverse}}.cerita-cinta{display:flex;flex-direction:column;padding:3rem 1.5rem}.timeline{position:relative;max-width:600px;margin:2rem auto 0;padding-left:1rem}.timeline:before{content:"";position:absolute;top:0;bottom:0;left:23px;width:2px;background:#e0e0e0}.story-block{position:relative;display:flex;gap:1.5rem;margin-bottom:3rem}.story-block:last-child{margin-bottom:0}.timeline-marker{position:relative;z-index:1;flex-shrink:0;width:16px;height:16px;border-radius:50%;background:#fff;border:4px solid #1f2327;margin-top:.4rem;box-shadow:0 0 0 4px #fff}.timeline-content{flex:1;padding-bottom:1rem}.story-title{font-family:Playfair Display,serif;font-size:1.25rem;color:#1f2327;margin:0 0 .5rem;font-weight:700;text-align:left;line-height:1.2}.story-body{font-family:Cormorant Garamond,serif;font-size:1.05rem;color:#4a4a4a;line-height:1.6;text-align:left;margin:0}.footer-section{position:relative;background-size:cover;background-position:center;color:#000;text-align:center;overflow:hidden;margin-top:6rem;padding:0}.footer-overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.footer-content{position:relative;z-index:2;padding:clamp(3rem,8vw,4rem) 1.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center}.footer-title{font-family:Playfair Display,serif;font-size:clamp(14px,3vw,16px);font-weight:500;margin:0 0 .5rem;letter-spacing:.02em}.footer-thank-you{font-family:Great Vibes,cursive;font-size:clamp(32px,6vw,42px);font-weight:400;margin:0 0 1rem;line-height:1.2}.footer-subtitle{font-family:Playfair Display,serif;font-size:clamp(14px,3vw,16px);font-weight:600;margin:0 0 .5rem}.footer-couple-name{font-family:Great Vibes,cursive;font-size:clamp(24px,5vw,32px);font-weight:400;margin:0;line-height:1.2}footer{margin:0!important;font-family:inherit;font-size:inherit;font-weight:inherit;color:inherit;text-align:inherit}