*,
*::before,
*::after {
    box-sizing: border-box;
}

:root {
    --t3-ink: #efe3c4;
    --t3-soft: #d3c191;
    --t3-gold: #b99349;
    --t3-gold-light: #d8bc72;
    --t3-dark: #060504;
    --t3-panel: rgba(9, 7, 5, 0.76);
    --t3-panel-solid: #15100b;
    --t3-muted: rgba(239, 227, 196, 0.72);
    --t3-border: rgba(216, 188, 114, 0.55);
    --t3-shadow: 0 28px 70px rgba(0, 0, 0, 0.58);
}

html {
    scroll-behavior: smooth;
}

body.t3-body {
    margin: 0;
    color: var(--t3-ink);
    background: #090704;
    font-family: "Open Sans", Arial, sans-serif;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

body.t3-body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -3;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.72)),
        var(--t3-page-bg) center / cover no-repeat;
}

button,
input,
textarea,
select {
    font: inherit;
}

a {
    color: inherit;
}

img,
video {
    display: block;
    max-width: 100%;
}

#youtubeMusicFrame {
    position: fixed;
    width: 1px;
    height: 1px;
    left: -9999px;
    top: -9999px;
    opacity: 0;
    pointer-events: none;
}

.t3-loader {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at center, rgba(185, 147, 73, 0.15), transparent 38%),
        #050403;
    color: var(--t3-gold-light);
    transition: opacity 0.55s ease, visibility 0.55s ease;
}

.t3-loader span {
    font-family: "Imperial Script", cursive;
    font-size: clamp(3rem, 13vw, 6rem);
}

.t3-loader.is-hidden {
    opacity: 0;
    visibility: hidden;
}

.t3-app {
    min-height: 100vh;
}

.t3-phone {
    position: relative;
    width: 100%;
    min-height: 100vh;
    margin: 0 auto;
    overflow: hidden;
    background: #080604;
}

.t3-desktop-cover {
    display: none;
}

.t3-section {
    position: relative;
    min-height: 100vh;
    padding: 5.5rem 1.45rem;
    overflow: hidden;
    isolation: isolate;
}

.t3-section::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -3;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.48), rgba(0, 0, 0, 0.76)),
        var(--t3-page-bg) center / cover no-repeat;
}

.t3-section::after {
    content: none;
}

.t3-flower-layer {
    position: absolute;
    z-index: -1;
    width: 275px;
    height: 275px;
    background-image: var(--t3-flower);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    opacity: 0;
    pointer-events: none;
    will-change: transform, opacity;
    animation: t3-flower-enter 1200ms ease-out 160ms both, t3-flower-sway 6200ms ease-in-out 1360ms infinite alternate;
}

.t3-flower-layer--left {
    left: -148px;
    top: 12%;
    transform-origin: 18% 82%;
}

.t3-flower-layer--right {
    right: -155px;
    bottom: 8%;
    transform: scaleX(-1);
    transform-origin: 82% 82%;
    animation-name: t3-flower-enter-right, t3-flower-sway-right;
}

@keyframes t3-flower-enter {
    from {
        opacity: 0;
        transform: translateY(34px) scale(0.96);
    }
    to {
        opacity: 0.78;
        transform: translateY(0) scale(1);
    }
}

@keyframes t3-flower-enter-right {
    from {
        opacity: 0;
        transform: translateY(34px) scaleX(-1) scale(0.96);
    }
    to {
        opacity: 0.78;
        transform: translateY(0) scaleX(-1) scale(1);
    }
}

@keyframes t3-flower-sway {
    from {
        transform: translate3d(-4px, 0, 0) rotate(-1.8deg);
    }
    50% {
        transform: translate3d(3px, -5px, 0) rotate(1.2deg);
    }
    to {
        transform: translate3d(6px, 2px, 0) rotate(2deg);
    }
}

@keyframes t3-flower-sway-right {
    from {
        transform: translate3d(4px, 0, 0) scaleX(-1) rotate(1.8deg);
    }
    50% {
        transform: translate3d(-3px, -5px, 0) scaleX(-1) rotate(-1.2deg);
    }
    to {
        transform: translate3d(-6px, 2px, 0) scaleX(-1) rotate(-2deg);
    }
}

.t3-gate {
    position: fixed;
    inset: 0;
    z-index: 900;
    min-height: 100svh;
    display: grid;
    place-items: end center;
    padding: 3rem 1.5rem 5.25rem;
    text-align: center;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.22) 40%, rgba(0, 0, 0, 0.78)),
        var(--t3-cover) center / cover no-repeat,
        var(--t3-fallback) center / cover no-repeat;
    transition: opacity 0.8s ease, transform 0.8s ease, visibility 0.8s ease;
}

.t3-gate::before,
.t3-gate::after {
    content: "";
    position: absolute;
    width: 42vw;
    max-width: 245px;
    aspect-ratio: 0.62;
    bottom: -3rem;
    background: var(--t3-wayang) bottom center / contain no-repeat;
    opacity: 0.78;
    filter: drop-shadow(0 15px 22px rgba(0, 0, 0, 0.65));
}

.t3-gate::before {
    left: -3.5rem;
}

.t3-gate::after {
    right: -3.5rem;
    transform: scaleX(-1);
}

.invitation-open .t3-gate {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-2rem) scale(1.015);
}

.t3-gate__inner {
    position: relative;
    z-index: 2;
    width: min(100%, 440px);
}

.t3-gate h1,
.t3-desktop-cover h1,
.t3-video-frame h2,
.t3-section-title h2,
.t3-closing-section h2 {
    margin: 0;
    font-family: "Imperial Script", cursive;
    font-weight: 400;
    line-height: 0.9;
    color: var(--t3-gold-light);
    text-shadow: 0 8px 28px rgba(0, 0, 0, 0.7);
}

.t3-gate h1 {
    font-size: clamp(4.15rem, 18vw, 7rem);
}

.t3-kicker,
.t3-date-text,
.t3-section-title p {
    margin: 0;
    font-family: "Cinzel", serif;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--t3-soft);
}

.t3-kicker {
    font-size: 0.77rem;
}

.t3-date-text {
    margin-top: 1.35rem;
    font-size: 0.84rem;
}

.t3-guest-box {
    width: min(100%, 330px);
    margin: 2rem auto 1.1rem;
    padding: 1rem 1.1rem;
    border: 1px solid var(--t3-border);
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.42);
    backdrop-filter: blur(7px);
}

.t3-guest-box span,
.t3-guest-box strong {
    display: block;
}

.t3-guest-box span {
    font-size: 0.72rem;
    color: var(--t3-muted);
}

.t3-guest-box strong {
    margin-top: 0.25rem;
    font-family: "Cinzel", serif;
    font-size: 1.02rem;
    color: var(--t3-ink);
}

.t3-button,
.copy-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0.75rem 1.35rem;
    border: 1px solid rgba(216, 188, 114, 0.78);
    border-radius: 999px;
    background: linear-gradient(135deg, #a87b33, #dbc16f 52%, #8a652d);
    color: #1b1208;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.42);
    cursor: pointer;
    transition: transform 0.25s ease, filter 0.25s ease, box-shadow 0.25s ease;
}

.t3-button:hover,
.copy-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.05);
    box-shadow: 0 22px 46px rgba(0, 0, 0, 0.48);
}

.t3-button--small {
    min-height: 38px;
    padding: 0.6rem 1.1rem;
    font-size: 0.86rem;
}

.t3-content {
    display: none;
}

.invitation-open .t3-content,
.t3-body.is-preview .t3-content {
    display: block;
}

.t3-video-hero {
    display: grid;
    place-items: center;
    text-align: center;
    background: #050403;
}

.t3-video-hero::before {
    background:
        radial-gradient(circle at center, rgba(185, 147, 73, 0.12), transparent 42%),
        rgba(0, 0, 0, 0.45);
}

.t3-video-hero::after {
    display: none;
}

.t3-bg-video {
    position: absolute;
    inset: 0;
    z-index: -4;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.t3-particles,
.t3-particles::before,
.t3-particles::after {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-repeat: no-repeat;
    animation: t3-sparkle-drift 12s ease-in-out infinite alternate;
}

.t3-particles {
    background-image:
        radial-gradient(circle at 11% 18%, rgba(255, 244, 201, 0.72) 0 1.2px, transparent 2.8px),
        radial-gradient(circle at 27% 42%, rgba(216, 188, 114, 0.52) 0 2px, transparent 4.5px),
        radial-gradient(circle at 64% 17%, rgba(255, 244, 201, 0.5) 0 0.9px, transparent 2.4px),
        radial-gradient(circle at 83% 31%, rgba(216, 188, 114, 0.64) 0 1.6px, transparent 3.8px),
        radial-gradient(circle at 18% 73%, rgba(255, 244, 201, 0.42) 0 2.4px, transparent 5.4px),
        radial-gradient(circle at 54% 62%, rgba(216, 188, 114, 0.42) 0 1px, transparent 2.6px),
        radial-gradient(circle at 76% 82%, rgba(255, 244, 201, 0.58) 0 1.8px, transparent 4.2px),
        radial-gradient(circle at 39% 88%, rgba(216, 188, 114, 0.46) 0 1.3px, transparent 3px);
}

.t3-particles::before,
.t3-particles::after {
    content: "";
}

.t3-particles::before {
    opacity: 0.62;
    background-image:
        radial-gradient(circle at 7% 55%, rgba(255, 244, 201, 0.42) 0 1.5px, transparent 3.6px),
        radial-gradient(circle at 34% 12%, rgba(216, 188, 114, 0.48) 0 0.8px, transparent 2.2px),
        radial-gradient(circle at 43% 35%, rgba(255, 244, 201, 0.5) 0 2.2px, transparent 5px),
        radial-gradient(circle at 71% 49%, rgba(216, 188, 114, 0.46) 0 1.1px, transparent 2.8px),
        radial-gradient(circle at 91% 68%, rgba(255, 244, 201, 0.44) 0 1.7px, transparent 4px),
        radial-gradient(circle at 58% 91%, rgba(216, 188, 114, 0.5) 0 2.6px, transparent 5.8px);
    animation-duration: 16s;
}

.t3-particles::after {
    opacity: 0.46;
    background-image:
        radial-gradient(circle at 16% 29%, rgba(216, 188, 114, 0.32) 0 3px, transparent 6.4px),
        radial-gradient(circle at 48% 7%, rgba(255, 244, 201, 0.44) 0 1.4px, transparent 3.4px),
        radial-gradient(circle at 69% 72%, rgba(216, 188, 114, 0.38) 0 2px, transparent 4.8px),
        radial-gradient(circle at 86% 9%, rgba(255, 244, 201, 0.38) 0 0.9px, transparent 2.4px),
        radial-gradient(circle at 24% 93%, rgba(216, 188, 114, 0.36) 0 1.6px, transparent 3.8px);
    animation-duration: 20s;
}

@keyframes t3-sparkle-drift {
    from {
        opacity: 0.32;
        transform: translate3d(-4px, 8px, 0) scale(0.98);
    }
    to {
        opacity: 0.82;
        transform: translate3d(8px, -12px, 0) scale(1.03);
    }
}

.t3-video-frame {
    position: relative;
    z-index: 3;
    width: min(78vw, 365px);
    min-height: 540px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 3.7rem 1.5rem 4.2rem;
    border: 7px double rgba(216, 188, 114, 0.92);
    border-radius: 50% 50% 44% 44% / 34% 34% 12% 12%;
    background: linear-gradient(180deg, rgba(8, 6, 4, 0.28), rgba(8, 6, 4, 0.73));
    box-shadow: inset 0 0 0 1px rgba(255, 243, 210, 0.23), var(--t3-shadow);
}

.t3-video-frame::before {
    content: "";
    position: absolute;
    inset: 1.05rem;
    border: 1px solid rgba(216, 188, 114, 0.42);
    border-radius: inherit;
}

.t3-video-frame h2 {
    margin-top: 0.8rem;
    font-size: clamp(4rem, 17vw, 6.8rem);
}

.invitation-open .t3-video-frame.reveal {
    transition-delay: 7s;
}

.t3-wayang-img {
    position: absolute;
    z-index: 2;
    bottom: -4rem;
    width: min(40vw, 230px);
    opacity: 0.9;
    filter: drop-shadow(0 22px 28px rgba(0, 0, 0, 0.8));
    animation: t3-wayang-sway 5s ease-in-out infinite alternate;
}

.t3-wayang-img--left {
    left: -3.2rem;
}

.t3-wayang-img--right {
    right: -3.2rem;
    transform: scaleX(-1);
    animation-delay: -1.2s;
}

@keyframes t3-wayang-sway {
    from {
        translate: 0 0;
        rotate: -1.5deg;
    }
    to {
        translate: 0 -10px;
        rotate: 1.5deg;
    }
}

.t3-opening-photo {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    text-align: center;
}

.t3-photo-arch {
    position: relative;
    width: min(76vw, 330px);
    aspect-ratio: 0.72;
    padding: 8px;
    border: 2px solid var(--t3-border);
    border-radius: 50% 50% 44% 44% / 31% 31% 8% 8%;
    background: rgba(0, 0, 0, 0.24);
    box-shadow: var(--t3-shadow);
    overflow: hidden;
}

.t3-photo-arch img,
.t3-closing-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.t3-photo-arch img {
    border-radius: inherit;
}

.t3-section-title {
    position: relative;
    z-index: 2;
    text-align: center;
}

.t3-section-title::before {
    content: "";
    display: block;
    width: 92px;
    height: 30px;
    margin: 0 auto 0.55rem;
    background: var(--t3-ornament) center / contain no-repeat;
    opacity: 0.78;
}

.t3-section-title p {
    margin-bottom: 0.3rem;
    font-size: 0.74rem;
}

.t3-section-title h2 {
    font-size: clamp(3.4rem, 16vw, 5.8rem);
}

.t3-copy {
    position: relative;
    z-index: 2;
    width: min(100%, 520px);
    margin: 0 auto;
    color: var(--t3-muted);
    font-size: 0.96rem;
    line-height: 1.9;
    text-align: center;
}

.t3-oval-card,
.t3-panel,
.t3-story-panel {
    position: relative;
    z-index: 2;
    width: min(100%, 560px);
    margin: 0 auto;
    padding: 3rem 1.35rem;
    border: 1px solid var(--t3-border);
    background:
        linear-gradient(180deg, rgba(10, 7, 4, 0.74), rgba(10, 7, 4, 0.9)),
        var(--t3-piece-bg) center / cover no-repeat;
    box-shadow: var(--t3-shadow);
}

.t3-oval-card {
    min-height: 500px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 50% / 14%;
    text-align: center;
}

.t3-oval-card h2 {
    margin: 0 0 1rem;
    font-family: "Imperial Script", cursive;
    font-size: clamp(3.3rem, 15vw, 5.2rem);
    font-weight: 400;
    color: var(--t3-gold-light);
}

.t3-oval-card p,
.t3-panel p,
.t3-story-panel p {
    color: var(--t3-muted);
    line-height: 1.9;
}

.t3-couple-section {
    text-align: center;
}

.t3-couple-list {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 2rem;
    width: min(100%, 600px);
    margin: 2.5rem auto 0;
}

.t3-couple-card {
    position: relative;
    padding: 1.4rem 1.15rem 2rem;
    border: 1px solid var(--t3-border);
    border-radius: 48% 48% 1.5rem 1.5rem / 19% 19% 1.5rem 1.5rem;
    background: rgba(9, 7, 5, 0.72);
    box-shadow: var(--t3-shadow);
}

.t3-couple-card::before {
    content: none;
}

.t3-couple-photo {
    width: min(72vw, 260px);
    aspect-ratio: 0.75;
    margin: 0 auto 1.35rem;
    padding: 7px;
    border: 1px solid rgba(216, 188, 114, 0.75);
    border-radius: 50% 50% 43% 43% / 28% 28% 7% 7%;
    overflow: hidden;
    background: rgba(216, 188, 114, 0.14);
}

.t3-couple-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: inherit;
}

.t3-couple-card h3,
.t3-event-card h3,
.t3-story-item h3 {
    margin: 0;
    font-family: "Vidaloka", serif;
    font-size: 2.05rem;
    font-weight: 400;
    color: var(--t3-ink);
}

.t3-couple-card p {
    margin: 0.7rem auto 0;
    color: var(--t3-muted);
    line-height: 1.7;
}

.t3-couple-card a {
    display: inline-block;
    margin-top: 1rem;
    color: var(--t3-gold-light);
    font-weight: 700;
    text-decoration: none;
}

.t3-countdown-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.65rem;
    text-align: center;
}

.t3-countdown-frame {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    width: min(100%, 330px);
    padding: 2.7rem 1rem 1.65rem;
    border: 1px solid var(--t3-border);
    border-radius: 50% 50% 12px 12px / 24% 24% 12px 12px;
    background:
        linear-gradient(180deg, rgba(9, 7, 5, 0.43), rgba(9, 7, 5, 0.85)),
        var(--t3-piece-bg) center bottom / cover no-repeat;
    box-shadow: var(--t3-shadow);
}

.t3-countdown-frame div {
    min-height: 98px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0.8rem 0.45rem;
    border: 1px solid rgba(216, 188, 114, 0.34);
    border-radius: 18px;
    background: rgba(0, 0, 0, 0.26);
    box-shadow: inset 0 0 0 1px rgba(255, 244, 210, 0.07);
}

.t3-countdown-frame strong {
    display: block;
    font-family: "Aboreto", serif;
    font-size: clamp(2.05rem, 11vw, 3.1rem);
    line-height: 1;
    font-weight: 400;
    color: var(--t3-ink);
}

.t3-event-date strong {
    display: block;
    font-family: "Aboreto", serif;
    font-size: clamp(2.55rem, 14vw, 4rem);
    line-height: 1;
    font-weight: 400;
    color: var(--t3-ink);
}

.t3-countdown-frame span {
    display: block;
    margin-top: 0.18rem;
    color: var(--t3-soft);
    font-size: 0.82rem;
    font-weight: 700;
}

.t3-event-list {
    position: relative;
    z-index: 2;
    display: grid;
    gap: 1.75rem;
    width: min(100%, 680px);
    margin: 2.4rem auto 0;
}

.t3-event-card {
    position: relative;
    min-height: 520px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 4.5rem 1.3rem 3rem;
    overflow: hidden;
    border: 1.5px solid var(--t3-border);
    border-radius: 50% 50% 12px 12px / 21% 21% 12px 12px;
    background:
        linear-gradient(180deg, rgba(9, 7, 5, 0.62), rgba(9, 7, 5, 0.83)),
        var(--t3-piece-bg) center bottom / cover no-repeat;
    text-align: center;
    box-shadow: var(--t3-shadow);
}

.t3-event-card::before {
    content: none;
}

.t3-event-card > * {
    position: relative;
    z-index: 1;
}

.t3-event-card > img {
    width: 90px;
    height: 34px;
    object-fit: contain;
    opacity: 0.75;
}

.t3-event-card h3 {
    font-size: 2.45rem;
}

.t3-day {
    margin: 0.25rem 0 0;
    font-family: "Cinzel", serif;
    color: var(--t3-soft);
    font-weight: 700;
}

.t3-event-date {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.85rem;
}

.t3-event-date span {
    max-width: 105px;
    text-align: left;
    color: var(--t3-soft);
    font-size: 0.94rem;
    font-weight: 700;
    line-height: 1.25;
}

.t3-event-card b {
    display: block;
    width: min(100%, 280px);
    margin-top: 0.5rem;
    color: var(--t3-ink);
    line-height: 1.5;
}

.t3-story-panel,
.t3-panel {
    border-radius: 1.6rem;
    text-align: center;
}

.t3-story-list {
    display: grid;
    gap: 1.2rem;
    margin-top: 2rem;
    text-align: left;
}

.t3-story-item {
    padding: 1.25rem;
    border: 1px solid rgba(216, 188, 114, 0.28);
    background: rgba(0, 0, 0, 0.24);
}

.t3-story-item img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    margin-bottom: 1rem;
}

.t3-story-item small {
    display: block;
    color: var(--t3-gold-light);
    font-family: "Cinzel", serif;
    letter-spacing: 0.18em;
}

.t3-gallery-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    width: min(100%, 620px);
    margin: 2.3rem auto 0;
}

.gallery-trigger {
    display: block;
    padding: 0;
    border: 1px solid rgba(216, 188, 114, 0.38);
    background: transparent;
    cursor: pointer;
    overflow: hidden;
}

.gallery-trigger:nth-child(3n + 1) {
    grid-row: span 2;
}

.gallery-trigger img {
    width: 100%;
    height: 100%;
    min-height: 150px;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.gallery-trigger:hover img {
    transform: scale(1.06);
}

.t3-bank-card {
    display: grid;
    gap: 0.45rem;
    justify-items: center;
    margin-top: 1rem;
    padding: 1rem;
    border: 1px solid rgba(216, 188, 114, 0.34);
    background: rgba(0, 0, 0, 0.24);
    color: var(--t3-ink);
    text-align: center;
}

.t3-bank-card strong,
.t3-bank-card span,
.t3-bank-card small {
    display: block;
}

.t3-bank-name {
    font-family: "Cinzel", serif;
    font-size: 1.38rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--t3-gold-light);
}

.t3-bank-card span {
    font-family: "Cinzel", serif;
    font-size: 1.2rem;
    letter-spacing: 0.08em;
}

.t3-address-card {
    gap: 0.55rem;
}

.t3-location-icon {
    display: inline-grid;
    place-items: center;
    width: 58px;
    height: 58px;
    line-height: 1;
}

.t3-location-icon svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

.t3-location-icon .st0 {
    fill: var(--t3-gold-light);
}

.t3-location-icon .st1 {
    fill: rgba(216, 188, 114, 0.22);
}

.t3-location-icon .dot {
    fill: rgba(216, 188, 114, 0.52);
}

.t3-address-card p {
    margin: 0.35rem 0 0.25rem;
    color: var(--t3-muted);
    line-height: 1.7;
}

.t3-address-card a {
    color: var(--t3-gold-light);
    font-weight: 700;
    text-decoration: none;
}

.copy-btn {
    width: fit-content;
    min-height: 36px;
    margin: 0.45rem auto 0;
    padding: 0.55rem 1rem;
    font-size: 0.84rem;
}

.guestbook-form {
    display: grid;
    gap: 0.72rem;
    margin-top: 1.1rem;
}

.guestbook-form input,
.guestbook-form textarea,
.guestbook-form select {
    width: 100%;
    border: 1px solid rgba(216, 188, 114, 0.33);
    border-radius: 14px 14px 8px 8px;
    background: rgba(0, 0, 0, 0.22);
    color: var(--t3-ink);
    padding: 0.76rem 0.9rem;
    outline: none;
}

.guestbook-form textarea {
    min-height: 112px;
    resize: vertical;
}

.guestbook-form .t3-button {
    width: fit-content;
    min-width: 136px;
    margin-inline: auto;
    padding-inline: 1.1rem;
}

.guestbook-form option {
    color: #111;
}

.guestbook-list {
    margin-top: 1rem;
    text-align: left;
}

.guestbook-list-card {
    max-height: min(430px, 56vh);
    overflow: auto;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(216, 188, 114, 0.28);
    border-radius: 20px 20px 12px 12px;
    background:
        linear-gradient(180deg, rgba(29, 18, 13, 0.72), rgba(18, 12, 10, 0.58)),
        rgba(0, 0, 0, 0.22);
    scrollbar-width: thin;
    scrollbar-color: rgba(216, 188, 114, 0.48) rgba(255, 255, 255, 0.04);
}

.guestbook-list-card::-webkit-scrollbar {
    width: 6px;
}

.guestbook-list-card::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.04);
}

.guestbook-list-card::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(216, 188, 114, 0.48);
}

.guestbook-item {
    display: block;
    padding: 0.72rem 0;
    border-bottom: 1px solid rgba(216, 188, 114, 0.2);
    background: transparent;
}

.guestbook-item:first-child {
    padding-top: 0;
}

.guestbook-item:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.guestbook-item strong {
    display: block;
    color: var(--t3-gold-light);
    font-size: 0.92rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.guestbook-item small {
    display: block;
    margin-top: 0.14rem;
    color: rgba(239, 227, 196, 0.58);
    font-size: 0.72rem;
    line-height: 1.35;
}

.guestbook-item p {
    margin: 0.28rem 0 0;
    color: var(--t3-muted);
    font-size: 0.86rem;
    line-height: 1.62;
    overflow-wrap: anywhere;
}

.guestbook-item.is-empty {
    text-align: center;
    opacity: 0.78;
}

@media (max-width: 420px) {
    .guestbook-list-card {
        max-height: 400px;
        padding: 0.78rem 0.82rem;
    }

    .guestbook-item {
        padding-block: 0.66rem;
    }
}

.t3-closing-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1.4rem;
    text-align: center;
}

.t3-closing-photo {
    position: relative;
    width: min(70vw, 310px);
    aspect-ratio: 0.78;
    padding: 8px;
    overflow: hidden;
    border: 2px solid var(--t3-border);
    border-radius: 50% 50% 42% 42% / 24% 24% 8% 8%;
    background:
        linear-gradient(180deg, rgba(8, 6, 4, 0.18), rgba(8, 6, 4, 0.48)),
        rgba(0, 0, 0, 0.22);
    box-shadow: var(--t3-shadow);
}

.t3-closing-photo::before {
    content: "";
    position: absolute;
    inset: 1.05rem;
    z-index: 2;
    border: 1px solid rgba(216, 188, 114, 0.42);
    border-radius: inherit;
    pointer-events: none;
}

.t3-closing-photo img {
    border-radius: inherit;
}

.t3-closing-section h2 {
    font-size: clamp(3.5rem, 15vw, 5.8rem);
}

.t3-footer {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, #a87b33, #dbc16f 52%, #8a652d);
    color: #17100a;
    text-align: center;
    font-size: 0.84rem;
    font-weight: 600;
    opacity: 1;
    transform: none;
}

.t3-footer p {
    margin: 0;
    color: inherit;
}

.t3-footer a {
    color: inherit;
    font-weight: 800;
    text-decoration: none;
}

.t3-footer a:hover {
    text-decoration: underline;
}

.music-toggle {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 960;
    width: 46px;
    height: 46px;
    border: 1px solid var(--t3-border);
    border-radius: 999px;
    background: rgba(8, 6, 4, 0.82);
    color: var(--t3-gold-light);
    box-shadow: 0 18px 30px rgba(0, 0, 0, 0.45);
    cursor: pointer;
}

.music-toggle.is-playing {
    animation: t3-spin 6s linear infinite;
}

@keyframes t3-spin {
    to {
        rotate: 360deg;
    }
}

.toast {
    position: fixed;
    left: 50%;
    bottom: 5rem;
    z-index: 1200;
    width: max-content;
    max-width: calc(100vw - 2rem);
    padding: 0.8rem 1rem;
    border: 1px solid var(--t3-border);
    background: rgba(8, 6, 4, 0.9);
    color: var(--t3-ink);
    opacity: 0;
    transform: translate(-50%, 12px);
    transition: opacity 0.25s ease, transform 0.25s ease;
    pointer-events: none;
}

.toast.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
}

.gallery-lightbox {
    position: fixed;
    inset: 0;
    z-index: 1500;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 4rem 1rem;
    background: rgba(0, 0, 0, 0.88);
}

.gallery-lightbox.is-open {
    display: flex;
}

.gallery-lightbox__image {
    max-width: min(92vw, 820px);
    max-height: 80vh;
    object-fit: contain;
}

.gallery-lightbox__close,
.gallery-lightbox__nav {
    position: fixed;
    border: 1px solid var(--t3-border);
    background: rgba(8, 6, 4, 0.72);
    color: var(--t3-ink);
    cursor: pointer;
}

.gallery-lightbox__close {
    top: 1rem;
    right: 1rem;
    width: 44px;
    height: 44px;
    font-size: 2rem;
}

.gallery-lightbox__nav {
    top: 50%;
    width: 44px;
    height: 54px;
    font-size: 2.6rem;
    transform: translateY(-50%);
}

.gallery-lightbox__nav--prev {
    left: 0.75rem;
}

.gallery-lightbox__nav--next {
    right: 0.75rem;
}

.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.75s ease, transform 0.75s ease;
}

.reveal.is-visible,
.t3-gate .reveal {
    opacity: 1;
    transform: translateY(0);
}

.t3-gate .reveal:nth-child(1) {
    transition-delay: 0.12s;
}

.t3-gate .reveal:nth-child(2) {
    transition-delay: 0.24s;
}

.t3-gate .reveal:nth-child(3) {
    transition-delay: 0.36s;
}

.t3-gate .reveal:nth-child(4) {
    transition-delay: 0.48s;
}

.t3-gate .reveal:nth-child(5) {
    transition-delay: 0.6s;
}

@media (min-width: 680px) {
    .t3-couple-list,
    .t3-event-list {
        grid-template-columns: 1fr;
    }

    .t3-gallery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 900px) {
    .t3-app {
        display: block;
        min-height: 100vh;
        background: #050403;
    }

    .t3-desktop-cover {
        position: fixed;
        inset: 0 auto 0 0;
        display: flex;
        align-items: center;
        justify-content: center;
        width: calc(100vw - min(500px, 100vw));
        min-height: 100vh;
        height: 100vh;
        padding: 3rem clamp(2rem, 5vw, 5rem);
        overflow: hidden;
        background:
            radial-gradient(circle at center, rgba(216, 188, 114, 0.12), transparent 36%),
            linear-gradient(90deg, rgba(0, 0, 0, 0.28), rgba(0, 0, 0, 0.68)),
            var(--t3-fallback) center / cover no-repeat;
        background-color: #050403;
    }

    .t3-desktop-cover__photo {
        position: relative;
        z-index: 1;
        width: min(330px, 32vw);
        aspect-ratio: 0.72;
        padding: 8px;
        border: 2px solid var(--t3-border);
        border-radius: 50% 50% 44% 44% / 31% 31% 8% 8%;
        background:
            linear-gradient(180deg, rgba(8, 6, 4, 0.18), rgba(8, 6, 4, 0.48)),
            rgba(0, 0, 0, 0.22);
        box-shadow: var(--t3-shadow);
        overflow: hidden;
        filter: drop-shadow(0 28px 55px rgba(0, 0, 0, 0.58));
    }

    .t3-desktop-cover__photo::before {
        content: "";
        position: absolute;
        inset: 1.05rem;
        z-index: 2;
        border: 1px solid rgba(216, 188, 114, 0.42);
        border-radius: inherit;
        pointer-events: none;
    }

    .t3-desktop-cover__image {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        border-radius: inherit;
    }

    .t3-desktop-cover__shade {
        position: absolute;
        inset: 0;
        z-index: 2;
        background:
            linear-gradient(180deg, rgba(0, 0, 0, 0.06) 0%, rgba(0, 0, 0, 0.12) 32%, rgba(0, 0, 0, 0.76) 76%, rgba(0, 0, 0, 0.92) 100%),
            linear-gradient(90deg, rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0.46));
        pointer-events: none;
    }

    .t3-desktop-cover__text {
        position: absolute;
        left: clamp(2rem, 5vw, 5rem);
        right: clamp(2rem, 5vw, 5rem);
        bottom: clamp(1.8rem, 5vh, 4rem);
        z-index: 3;
        width: auto;
        padding: 0;
        text-align: center;
        background: transparent;
        border-radius: 0;
    }

    .t3-desktop-cover h1 {
        font-size: clamp(5rem, 9vw, 8rem);
    }

    .t3-desktop-cover p {
        margin: 0.3rem 0;
        font-family: "Cinzel", serif;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: var(--t3-ink);
        text-shadow: 0 2px 12px rgba(0, 0, 0, 0.9);
    }

    .t3-phone {
        width: min(100%, 500px);
        min-height: 100vh;
        margin-left: calc(100vw - min(500px, 100vw));
        box-shadow: -24px 0 60px rgba(0, 0, 0, 0.45);
    }

    .t3-gate {
        width: 100%;
        left: 0;
        right: 0;
        box-shadow: none;
    }

    .t3-gate__inner {
        width: min(100%, 560px);
    }

    .t3-gate h1 {
        font-size: clamp(5.8rem, 10vw, 9rem);
    }

    .t3-section {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .t3-video-frame {
        min-height: 590px;
    }
}

.t3-video-fallback .t3-bg-video {
    display: none;
}

.t3-lite .t3-particles::before,
.t3-lite .t3-particles::after {
    display: none;
}

.t3-lite .t3-flower-layer,
.t3-lite .t3-wayang-img,
.t3-lite .music-toggle.is-playing {
    animation: none;
}

.t3-lite .t3-flower-layer {
    opacity: 0.58;
}

.t3-lite .t3-guest-box {
    backdrop-filter: none;
}

.t3-lite .t3-desktop-cover__photo,
.t3-lite .t3-photo-arch,
.t3-lite .t3-oval-card,
.t3-lite .t3-panel,
.t3-lite .t3-story-panel,
.t3-lite .t3-couple-card,
.t3-lite .t3-countdown-frame,
.t3-lite .t3-event-card,
.t3-lite .t3-closing-photo {
    filter: none;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.36);
}

@media (max-width: 420px) {
    .t3-section {
        padding-left: 1.1rem;
        padding-right: 1.1rem;
    }

    .t3-video-frame {
        width: min(84vw, 335px);
        min-height: 500px;
    }

    .t3-wayang-img {
        width: 46vw;
    }

    .t3-countdown-frame {
        width: min(100%, 330px);
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.001ms !important;
    }
}

/* Compact reading scale */
.t3-section-title p {
    font-size: 0.68rem;
    line-height: 1.35;
}

.t3-section-title h2 {
    font-size: clamp(3rem, 13.5vw, 5rem);
    line-height: 0.95;
}

.t3-copy {
    font-size: 0.86rem;
    line-height: 1.72;
}

.t3-oval-card p,
.t3-panel p,
.t3-story-panel p,
.t3-couple-card p,
.t3-event-card p,
.t3-story-item p,
.t3-address-card p {
    font-size: 0.86rem;
    line-height: 1.66;
}

.t3-couple-card h3,
.t3-event-card h3,
.t3-story-item h3 {
    font-size: clamp(2.35rem, 10vw, 3.45rem);
}

.t3-rsvp-section .t3-panel {
    padding-block: 2.25rem;
}

.t3-rsvp-section .t3-copy {
    margin-top: 0.15rem;
    font-size: 0.8rem;
    line-height: 1.58;
}

.t3-rsvp-section .guestbook-form {
    gap: 0.56rem;
    margin-top: 0.9rem;
}

.t3-rsvp-section .guestbook-form input,
.t3-rsvp-section .guestbook-form textarea,
.t3-rsvp-section .guestbook-form select {
    padding: 0.66rem 0.78rem;
    font-size: 0.82rem;
    line-height: 1.35;
}

.t3-rsvp-section .guestbook-form textarea {
    min-height: 96px;
}

.t3-rsvp-section .guestbook-form .t3-button {
    min-height: 36px;
    padding: 0.55rem 1rem;
    font-size: 0.78rem;
}

.t3-rsvp-section .guestbook-list {
    margin-top: 0.72rem;
}

.t3-rsvp-section .guestbook-list-card {
    padding: 0.7rem 0.82rem;
}

.t3-rsvp-section .guestbook-item {
    padding: 0.52rem 0;
}

.t3-rsvp-section .guestbook-item strong {
    font-size: 0.8rem;
    line-height: 1.28;
}

.t3-rsvp-section .guestbook-item small {
    margin-top: 0.1rem;
    font-size: 0.62rem;
    line-height: 1.25;
}

.t3-rsvp-section .guestbook-item p {
    margin-top: 0.18rem;
    font-size: 0.76rem;
    line-height: 1.48;
}

@media (max-width: 420px) {
    .t3-section-title h2 {
        font-size: clamp(2.75rem, 12.5vw, 4.35rem);
    }

    .t3-copy,
    .t3-oval-card p,
    .t3-panel p,
    .t3-story-panel p {
        font-size: 0.82rem;
    }
}