/* ===== NEW REDESIGN THEME ===== */
:root {
	--clr-bg:#05070f;
	--clr-panel:rgba(20,26,40,.6);
	--clr-accent:#ffda74;
	--clr-accent2:#78b4ff;
	--anim-fast: .6s cubic-bezier(.19,1,.22,1);
	--anim-slow: 1.3s cubic-bezier(.19,1,.22,1);
}
/* Base Reset */
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{font-family:'Kanit','Inter',system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--clr-bg);color:#e9edf3;display:flex;flex-direction:column;overflow:hidden;}
body::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 40%,rgba(90,130,255,.25),transparent 60%),radial-gradient(circle at 80% 70%,rgba(255,180,90,.18),transparent 55%),linear-gradient(140deg,#0b1222,#060a14);mix-blend-mode:screen;pointer-events:none;opacity:.55;}

/* Glass Top Bar */
/* Control Dock (bottom) */
.control-dock{position:fixed;left:50%;bottom:10px;transform:translateX(-50%);z-index:40;width:min(1180px,92vw);opacity:.32;transition:opacity .45s ease, filter .45s ease, transform .6s ease;}
.control-dock:hover,.control-dock.active,.control-dock:focus-within{opacity:1;filter:none;}
.control-dock .dock-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:10px 18px;background:rgba(20,24,34,.55);backdrop-filter:blur(14px) saturate(140%);border:1px solid rgba(255,255,255,.10);border-radius:22px;box-shadow:0 8px 28px -12px rgba(0,0,0,.55);} 
.control-dock select{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);color:#fff;font-size:14px;padding:6px 40px 6px 12px;border-radius:14px;appearance:none;cursor:pointer;position:relative;min-width:140px;transition:.35s;}
.control-dock select:hover{background:rgba(255,255,255,.15);} 
.dock-label{font-size:12px;letter-spacing:.8px;text-transform:uppercase;display:block;margin-bottom:4px;color:#aab8c6;font-weight:600;}
.dock-section{display:flex;flex-direction:column;gap:6px;}
.dock-section.actions{flex-direction:row;align-items:center;gap:10px;}
.icon-btn{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);color:#fff;min-width:40px;height:40px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;font-size:15px;cursor:pointer;transition:background .35s,transform .35s,color .35s,opacity .4s;gap:6px;font-weight:500;line-height:1;opacity:.68;padding:0 12px;}
.icon-btn.circle{width:40px;padding:0;aspect-ratio:1/1;border-radius:50%;}
.icon-btn.circle i{pointer-events:none;}
.icon-btn span{font-size:14px;letter-spacing:.5px;}
.icon-btn:hover{background:rgba(255,255,255,.18);transform:translateY(-5px) scale(1.04);opacity:1;} 
.icon-btn:active{transform:scale(.92);} 
.info-pill{background:rgba(255,255,255,.08);padding:4px 10px;border-radius:16px;font-size:11px;letter-spacing:.4px;color:#cbd5df;border:1px solid rgba(255,255,255,.10);display:inline-flex;align-items:center;gap:6px;font-weight:500;}
.info-pill i{font-size:12px;opacity:.85;}
.dock-section.info{flex-direction:row;gap:10px;align-items:center;}

@media (max-width:820px){
		.control-dock .dock-inner{flex-direction:column;align-items:stretch;}
	.dock-section.actions{flex-wrap:wrap;justify-content:space-between;width:100%;}
	.dock-section.info{justify-content:flex-start;width:100%;flex-wrap:wrap;}
}

/* Layout */
#app{flex:1;display:flex;flex-direction:column;}
.stage{flex:1;position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;}

/* Background Canvas */
.bg-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;}
.bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;filter:brightness(.55) saturate(1.2) contrast(1.05);}

/* Collage Items */
.collage{position:absolute;inset:0;z-index:10;}
.collage-item{position:absolute;top:50%;left:50%;width:var(--item-size,320px);aspect-ratio:4/3;background:#ffffff;border:1px solid rgba(0,0,0,.06);border-radius:14px;overflow:hidden;box-shadow:0 12px 42px -10px rgba(0,0,0,.55),0 6px 18px -4px rgba(0,0,0,.45);transform:translate(-50%,-50%) scale(.05) rotate(0deg);opacity:0;transition:transform 1.35s cubic-bezier(.19,1,.22,1),opacity 1.05s ease,filter .6s;will-change:transform,opacity;filter:blur(18px) brightness(.75) saturate(.75);} 
.collage-item::before{content:"";position:absolute;inset:0;background:#fff;z-index:0;}
.collage-item img{position:relative;z-index:1;}
.collage-item.layer-0{z-index:11}
.collage-item.layer-1{z-index:12}
.collage-item.layer-2{z-index:13}
.collage-item.layer-3{z-index:14}
.collage-item.layer-4{z-index:15}
.collage-item img{width:100%;height:100%;object-fit:cover;display:block;}
.collage-item.sequence.active-cert{box-shadow:0 0 0 2px rgba(255,215,140,.65),0 0 26px -6px rgba(255,200,110,.85),0 0 80px -10px rgba(255,170,60,.55),0 14px 40px -10px rgba(0,0,0,.55);filter:brightness(1.02) saturate(1.08);}
.collage-item.sequence.active-cert::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;background:linear-gradient(120deg,rgba(255,230,160,.35),rgba(255,190,60,.15) 40%,rgba(255,230,160,.35));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;animation:certGlow 4.5s ease-in-out infinite;}
@keyframes certGlow{0%,100%{opacity:.55;filter:blur(0);}50%{opacity:1;filter:blur(1px);}}
.collage-item.ready{opacity:1;}
.collage-item.scattered{will-change:transform,opacity;filter:blur(0) brightness(1) saturate(1.05);}
.collage-item.float{animation:floatY 6.5s ease-in-out infinite;}
.collage-item.float.alt{animation-duration:8.2s;animation-direction:reverse;}
.collage-item.in-flight{z-index:5 !important;}
.collage-item.settled{z-index:120 !important;}
.collage.gathering .collage-item{transition:transform 1s cubic-bezier(.65,.02,.4,.9),opacity .7s ease;filter:brightness(1.08) saturate(1.15);}

/* Message Overlay */
.message{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;z-index:50;background:rgba(0,0,0,0);backdrop-filter:none;transition:background 1.1s ease;}
.message .message-inner.wide{align-items:stretch;}
.message .message-inner.wide > *{width:100%;}
.message.active{background:rgba(8,12,22,.75);backdrop-filter:blur(18px) saturate(160%);} 
.message-inner{max-width:1180px;padding:0 6vw;text-align:center;transform:translateY(55px) scale(.95);opacity:0;transition:transform 1.25s cubic-bezier(.19,1,.22,1),opacity 1.15s ease;}
.message-inner.wide{max-width:none;width:100%;padding:0;margin:0;}
.message-inner.wide .hero-intro{max-width:none;width:100%;padding:8vh 6vw 10vh;}
.message-inner.wide .hero-body{max-width:1400px;}
.message-panel{position:relative;margin-inline:auto;max-width:980px;padding:2.6rem 3.2rem 3.2rem;border-radius:34px;background:rgba(15,20,32,.58);backdrop-filter:blur(22px) saturate(160%);border:1px solid rgba(255,255,255,.10);box-shadow:0 25px 60px -18px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.04);} 
.message-panel.ceremony{max-width:1320px;padding:3.8rem clamp(1.8rem,3.2vw,4.2rem) 4.6rem;border-radius:58px;background:linear-gradient(160deg,rgba(18,24,38,.86),rgba(30,38,56,.72));border:1px solid rgba(255,255,255,.16);box-shadow:0 55px 120px -40px rgba(0,0,0,.85),0 28px 70px -30px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.05);overflow:hidden;}
/* ==== OPEN CEREMONY LAYOUT (no card container) ==== */
.ceremony-open{position:relative;max-width:1500px;margin:0 auto;padding:2vh 4vw 4vh;display:flex;flex-direction:column;align-items:center;text-align:center;z-index:2;}
.ceremony-fullcard{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center;padding:4vh 4vw;}
/* ===== New HERO INTRO (clean full viewport composition) ===== */
.hero-intro{position:relative;max-width:1600px;margin:0 auto;padding:6vh 5vw 8vh;display:flex;flex-direction:column;align-items:center;text-align:center;overflow:hidden;}
.hero-bg-texture{position:absolute;inset:-12%;background:
	radial-gradient(circle at 50% 20%,rgba(255,220,130,.25),rgba(255,220,130,0) 55%),
	radial-gradient(circle at 78% 72%,rgba(120,180,255,.22),rgba(120,180,255,0) 60%),
	linear-gradient(140deg,rgba(20,26,40,.65),rgba(14,18,30,.85));
	filter:blur(40px) saturate(140%);opacity:.65;mix-blend-mode:screen;pointer-events:none;}
.hero-header{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;margin-bottom:3.4rem;}
.hero-badge{position:relative;width:210px;height:210px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:2.2rem;background:radial-gradient(circle at 50% 50%,rgba(255,240,200,.9),rgba(255,190,60,.28) 65%,rgba(255,140,20,0) 78%);box-shadow:0 35px 95px -40px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.15),inset 0 3px 9px rgba(255,255,255,.45);animation:emblemPulse 7s ease-in-out infinite;}
.hero-badge i{font-size:90px;background:linear-gradient(160deg,#fff4ce,#ffd97b 45%,#ffba36);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 10px 32px rgba(0,0,0,.55),0 0 24px rgba(255,210,110,.55);} 
.hero-badge .hero-logo{width:64%;height:64%;object-fit:contain;filter:drop-shadow(0 8px 26px rgba(0,0,0,.55)) brightness(1.05);animation:fadeScale .9s cubic-bezier(.19,1,.22,1) .1s both;}
.hero-badge .badge-ring{position:absolute;inset:0;border:4px solid rgba(255,255,255,.35);border-radius:50%;mix-blend-mode:overlay;animation:spinSlow 32s linear infinite;}
.badge-year{position:absolute;bottom:-12px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,#ffcc53,#ffe7b2,#ffcc53);color:#422600;font-weight:700;padding:.5rem 1.6rem;font-size:14px;border-radius:14px;letter-spacing:1px;box-shadow:0 12px 30px -12px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.28);} 
.hero-heading{margin:0 0 1.8rem;line-height:1.02;font-family:'Kanit',sans-serif;font-weight:800;}
.hero-heading .h-pre{display:block;font-size:clamp(20px,1.4vw,32px);letter-spacing:2px;font-weight:600;color:#ffe9b8;text-transform:uppercase;opacity:.9;margin-bottom:.6rem;animation:fadeSlide .9s ease .05s both;}
.hero-heading .h-main{display:inline-block;font-size:clamp(72px,9vw,160px);letter-spacing:3px;line-height:.9;background:linear-gradient(95deg,#fff5d0,#ffd87a 40%,#ffc24d,#ffb22e,#ffd87a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 12px 50px rgba(0,0,0,.7));animation:fadeScale 1.2s cubic-bezier(.19,1,.22,1) .18s both;position:relative;}
.hero-heading .h-main::after{content:"";position:absolute;left:-6%;right:-6%;bottom:6%;height:14%;background:radial-gradient(circle at 50% 60%,rgba(255,220,120,.6),rgba(255,220,120,0));filter:blur(22px);opacity:.55;animation:glowPulse 5.5s ease-in-out infinite;}
.hero-heading .h-sub{display:block;font-size:clamp(24px,2vw,44px);letter-spacing:1px;font-weight:600;color:#ffffff;opacity:.95;margin-top:1rem;animation:fadeSlide .9s ease .4s both;}
.hero-metrics{display:flex;flex-wrap:wrap;gap:1.4rem;justify-content:center;align-items:center;animation:fadeSlide 1s ease .55s both;}
.hero-count{font-size:clamp(46px,5vw,94px);font-weight:800;background:linear-gradient(90deg,#fff7d2,#ffd777,var(--clr-accent));-webkit-background-clip:text;background-clip:text;color:transparent;position:relative;padding:.3rem 1.2rem .55rem;}
.hero-count::after{content:"";position:absolute;left:50%;bottom:-8px;width:70%;height:3px;transform:translateX(-50%);background:linear-gradient(90deg,var(--clr-accent),#ffe8b0,#ffffff);border-radius:4px;box-shadow:0 4px 14px -4px rgba(255,200,110,.7);} 
.hero-date{font-size:clamp(15px,1.2vw,20px);display:flex;align-items:center;gap:.55rem;color:#d8e4f1;background:rgba(255,255,255,.07);padding:.6rem 1.1rem;border:1px solid rgba(255,255,255,.15);border-radius:14px;backdrop-filter:blur(8px) saturate(150%);} 
.hero-date i{color:var(--clr-accent);} 
.hero-body{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;max-width:1180px;}
.intro-lead{font-size:clamp(24px,2.3vw,42px);font-weight:600;margin:0 0 1.6rem;color:#fffdf5;letter-spacing:.6px;text-shadow:0 8px 26px rgba(0,0,0,.65);animation:fadeSlide 1s ease .75s both;}
.intro-text{font-size:clamp(18px,1.4vw,25px);line-height:1.68;color:#e6edf5;margin:0 0 2.2rem;text-align:center;max-width:1020px;animation:fadeSlide 1s ease .9s both;}
.hero-quote{margin:0;max-width:880px;animation:fadeSlide 1s ease 1.05s both;}
.hero-quote blockquote{margin:0;font-size:clamp(18px,1.5vw,30px);font-weight:600;letter-spacing:.6px;color:#ffe7b0;position:relative;padding:1rem 1.6rem 1.2rem 3.2rem;background:linear-gradient(120deg,rgba(255,210,110,.14),rgba(255,230,180,.06));border:1px solid rgba(255,255,255,.12);border-radius:22px;backdrop-filter:blur(6px) saturate(140%);}
.hero-quote blockquote::before{content:"\f10d";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:1.2rem;top:50%;transform:translateY(-50%);font-size:30px;opacity:.55;background:linear-gradient(120deg,#ffe4ad,#ffcc58);-webkit-background-clip:text;background-clip:text;color:transparent;}
@keyframes fadeSlide{0%{opacity:0;transform:translateY(40px);}60%{opacity:1;}100%{opacity:1;transform:translateY(0);}}
@keyframes fadeScale{0%{opacity:0;transform:translateY(50px) scale(.9);}55%{opacity:1;}100%{opacity:1;transform:translateY(0) scale(1);} }
@keyframes glowPulse{0%,100%{opacity:.55;}50%{opacity:.9;}}
@media (max-width:820px){
	.hero-intro{padding:6vh 6vw 8vh;}
	.hero-heading .h-main{font-size:clamp(68px,14vw,140px);} 
	.intro-lead{font-size:clamp(22px,4.2vw,36px);} 
	.hero-badge{width:180px;height:180px;}
	.hero-badge i{font-size:78px;}
}
@media (max-width:520px){
	.hero-heading .h-main{font-size:clamp(60px,18vw,120px);} 
	.hero-badge{width:150px;height:150px;}
	.hero-badge i{font-size:64px;}
	.intro-text{font-size:clamp(17px,3.6vw,22px);} 
}
.ceremony-fullcard::before{content:"";position:absolute;inset:0;border-radius:60px;background:linear-gradient(150deg,rgba(18,24,38,.85),rgba(30,38,56,.78));backdrop-filter:blur(30px) saturate(180%);border:1px solid rgba(255,255,255,.14);box-shadow:0 60px 140px -40px rgba(0,0,0,.85),0 28px 70px -24px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.06);opacity:0;transform:scale(.96);animation:cardIn 1.2s cubic-bezier(.19,1,.22,1) .05s forwards;}
@keyframes cardIn{0%{opacity:0;transform:scale(.96);}60%{opacity:1;}100%{opacity:1;transform:scale(1);} }
.ceremony-fullcard::after{content:"";position:absolute;inset:-8%;border-radius:70px;background:conic-gradient(from 0deg,rgba(255,230,160,.18),rgba(255,190,70,0) 35%,rgba(255,230,160,.18));filter:blur(140px);opacity:.18;animation:panelSpin 36s linear infinite;pointer-events:none;}
.ceremony-fullcard > .ceremony-open{position:relative;}
@media (max-width:880px){
	.ceremony-fullcard::before{border-radius:46px;}
	.ceremony-fullcard::after{border-radius:56px;}
}
@media (max-width:580px){
	.ceremony-fullcard{padding:2vh 3vw;}
	.ceremony-fullcard::before{border-radius:36px;}
	.ceremony-fullcard::after{border-radius:46px;}
}
.ceremony-open::before,.ceremony-open::after{content:"";position:absolute;inset:0;pointer-events:none;}
.ceremony-open::before{background:radial-gradient(circle at 50% 40%,rgba(255,220,130,.18),rgba(255,220,130,0) 55%),radial-gradient(circle at 75% 70%,rgba(120,180,255,.18),rgba(120,180,255,0) 60%);mix-blend-mode:screen;opacity:.65;}
.ceremony-open::after{background:conic-gradient(from 0deg,rgba(255,230,160,.25),rgba(255,190,70,0) 35%,rgba(255,230,160,.25));filter:blur(120px);opacity:.18;animation:panelSpin 30s linear infinite;}
.co-emblem{position:relative;margin-bottom:2.6rem;}
.co-core{position:relative;width:300px;height:300px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 50%,rgba(255,240,200,.9),rgba(255,190,60,.28) 60%,rgba(255,140,20,0) 78%);box-shadow:0 28px 80px -34px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.15),inset 0 3px 10px rgba(255,255,255,.5);overflow:hidden;animation:emblemPulse 7s ease-in-out infinite;}
.co-core i{font-size:148px;background:linear-gradient(150deg,#fff4ce,#ffd97b 45%,#ffba36);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 12px 34px rgba(0,0,0,.6),0 0 34px rgba(255,200,90,.55);} 
.co-core .ring{position:absolute;inset:0;border:5px solid rgba(255,255,255,.28);border-radius:50%;mix-blend-mode:overlay;animation:spinSlow 26s linear infinite;}
.co-core .ring.r2{inset:12%;border-color:rgba(255,255,255,.35);animation-direction:reverse;animation-duration:34s;}
.co-core .spark{position:absolute;width:110px;height:110px;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.95),rgba(255,255,255,0) 70%);filter:blur(10px) brightness(1.1);mix-blend-mode:screen;opacity:.65;animation:flareDrift 11s ease-in-out infinite;}
.co-core .spark.s2{width:150px;height:150px;animation-duration:15s;animation-delay:-4s;}
.co-ribbon{position:absolute;bottom:-16px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,#ffcc53,#ffe7b2,#ffcc53);padding:.85rem 2.8rem;font-weight:700;font-size:clamp(18px,1.4vw,28px);border-radius:0 0 22px 22px;letter-spacing:1.3px;color:#4a2d00;box-shadow:0 10px 30px -14px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.28);} 
.co-heading{margin:0 0 1.6rem;line-height:1.02;font-family:'Kanit',sans-serif;font-weight:800;position:relative;}
.co-heading .pre{display:block;font-size:clamp(20px,1.5vw,34px);letter-spacing:2px;font-weight:600;color:#ffe9b8;text-transform:uppercase;opacity:.9;margin-bottom:.45rem;}
.co-heading .main{display:block;font-size:clamp(64px,9vw,144px);letter-spacing:3px;line-height:.92;background:linear-gradient(95deg,#fff5d0,#ffd87a 40%,#ffc24d,#ffb22e,#ffd87a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 10px 40px rgba(0,0,0,.7));}
.co-heading .sub{display:block;font-size:clamp(22px,2vw,40px);letter-spacing:1px;font-weight:600;color:#ffffff;opacity:.95;margin-top:.5rem;}
.co-metrics{display:flex;flex-wrap:wrap;gap:1.4rem;justify-content:center;align-items:center;margin:0 0 2rem;}
.co-count{font-size:clamp(42px,5vw,90px);font-weight:800;background:linear-gradient(90deg,#fff7d2,#ffd777,var(--clr-accent));-webkit-background-clip:text;background-clip:text;color:transparent;position:relative;padding:.3rem 1.2rem .5rem;}
.co-count::after{content:"";position:absolute;left:50%;bottom:-8px;width:70%;height:3px;transform:translateX(-50%);background:linear-gradient(90deg,var(--clr-accent),#ffe8b0,#ffffff);border-radius:4px;box-shadow:0 4px 14px -4px rgba(255,200,110,.7);} 
.co-date{font-size:clamp(15px,1.2vw,20px);display:flex;align-items:center;gap:.55rem;color:#d8e4f1;background:rgba(255,255,255,.07);padding:.6rem 1.1rem;border:1px solid rgba(255,255,255,.15);border-radius:14px;backdrop-filter:blur(8px) saturate(150%);} 
.co-date i{color:var(--clr-accent);} 
.co-lead{font-size:clamp(22px,2vw,40px);font-weight:600;margin:0 0 1.3rem;color:#fffdf5;letter-spacing:.6px;text-shadow:0 8px 26px rgba(0,0,0,.65);} 
.co-body{font-size:clamp(17px,1.3vw,24px);line-height:1.62;color:#e6edf5;margin:0 0 2rem;max-width:1080px;}
.co-divider{display:flex;align-items:center;gap:1.2rem;margin:0 0 1.6rem;width:100%;max-width:880px;}
.co-divider span{flex:1;height:1px;background:linear-gradient(90deg,rgba(255,220,130,0),rgba(255,220,130,.65),rgba(255,220,130,0));}
.co-divider i{color:var(--clr-accent);font-size:clamp(18px,2.4vw,36px);filter:drop-shadow(0 6px 16px rgba(0,0,0,.6));}
.co-quote{font-size:clamp(18px,1.6vw,28px);font-weight:600;letter-spacing:.6px;color:#ffe7b0;position:relative;padding:1rem 1.6rem 1.2rem 3.2rem;background:linear-gradient(120deg,rgba(255,210,110,.14),rgba(255,230,180,.06));border:1px solid rgba(255,255,255,.12);border-radius:22px;backdrop-filter:blur(6px) saturate(140%);max-width:840px;margin:0 auto;}
.co-quote::before{content:"\f10d";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:1.2rem;top:50%;transform:translateY(-50%);font-size:30px;opacity:.55;background:linear-gradient(120deg,#ffe4ad,#ffcc58);-webkit-background-clip:text;background-clip:text;color:transparent;}
.ceremony-open .co-heading .main{animation:lineRise 1.2s cubic-bezier(.19,1,.22,1) .25s both;}
.ceremony-open .co-heading .pre{opacity:0;transform:translateY(30px);animation:lineRise .9s cubic-bezier(.19,1,.22,1) .05s forwards;}
.ceremony-open .co-heading .sub{opacity:0;transform:translateY(30px);animation:lineRise 1s cubic-bezier(.19,1,.22,1) .55s forwards;}
.ceremony-open .co-count{opacity:0;transform:translateY(30px);animation:lineRise 1s cubic-bezier(.19,1,.22,1) .75s forwards;}
.ceremony-open .co-lead{opacity:0;transform:translateY(30px);animation:lineRise 1s cubic-bezier(.19,1,.22,1) 1s forwards;}
.ceremony-open .co-body{opacity:0;transform:translateY(30px);animation:lineRise 1s cubic-bezier(.19,1,.22,1) 1.18s forwards;}
.ceremony-open .co-divider{opacity:0;transform:translateY(30px);animation:lineRise 1s cubic-bezier(.19,1,.22,1) 1.35s forwards;}
.ceremony-open .co-quote{opacity:0;transform:translateY(30px);animation:lineRise 1s cubic-bezier(.19,1,.22,1) 1.55s forwards;}
@media (max-width:780px){
	.co-core{width:240px;height:240px;}
	.co-core i{font-size:118px;}
	.co-heading .main{font-size:clamp(60px,14vw,110px);} 
}
@media (max-width:520px){
	.co-core{width:200px;height:200px;}
	.co-core i{font-size:100px;}
	.co-ribbon{font-size:15px;padding:.6rem 1.6rem;} 
}
.message-panel.ceremony .panel-back-fx{position:absolute;inset:-35% -40%;background:conic-gradient(from 0deg,var(--clr-accent),#fff6d2,#ffe08b,#ffc04e,#ffe08b,#fff6d2,var(--clr-accent));filter:blur(140px) saturate(180%);opacity:.14;animation:panelSpin 26s linear infinite;}
.message-panel.ceremony .panel-edge{position:absolute;left:50%;width:92%;height:2px;background:linear-gradient(90deg,rgba(255,220,130,0),rgba(255,220,130,.65),rgba(255,220,130,0));transform:translateX(-50%);opacity:.55;}
.message-panel.ceremony .panel-edge-top{top:18px;}
.message-panel.ceremony .panel-edge-bottom{bottom:18px;}
.ceremony-intro{display:flex;flex-wrap:wrap;gap:3.6rem;align-items:stretch;position:relative;z-index:2;}
.ci-left{flex:1 1 340px;display:flex;flex-direction:column;gap:2.2rem;align-items:center;justify-content:flex-start;}
.ci-emblem{position:relative;}
.ci-emblem-core{position:relative;width:270px;height:270px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 50%,rgba(255,235,180,.85),rgba(255,185,60,.28) 60%,rgba(255,140,20,0) 78%);box-shadow:0 25px 70px -30px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.15),inset 0 3px 8px rgba(255,255,255,.45);overflow:hidden;animation:emblemPulse 7s ease-in-out infinite;}
.ci-emblem-core i{font-size:128px;background:linear-gradient(150deg,#fff2c0,#ffd56f 45%,#ffb935);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 10px 32px rgba(0,0,0,.6),0 0 28px rgba(255,210,110,.55);} 
.ci-emblem-core .rings{position:absolute;inset:0;border:4px solid rgba(255,255,255,.25);border-radius:50%;mix-blend-mode:overlay;animation:spinSlow 22s linear infinite;}
.ci-emblem-core .rings.r2{inset:10%;border-color:rgba(255,255,255,.35);animation-direction:reverse;animation-duration:28s;}
.ci-emblem-core .flare{position:absolute;width:90px;height:90px;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.95),rgba(255,255,255,0) 70%);filter:blur(8px) brightness(1.1);mix-blend-mode:screen;opacity:.65;animation:flareDrift 9s ease-in-out infinite;}
.ci-emblem-core .flare.f2{width:120px;height:120px;animation-duration:12s;animation-delay:-3s;}
@keyframes flareDrift{0%{transform:translate(-25%,-25%) rotate(0deg);}50%{transform:translate(25%,20%) rotate(120deg);}100%{transform:translate(-25%,-25%) rotate(360deg);}}
.ci-ribbon{position:absolute;bottom:-14px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,#ffcc53,#ffe7b2,#ffcc53);padding:.75rem 2.4rem;font-weight:700;font-size:clamp(18px,1.4vw,26px);border-radius:0 0 18px 18px;letter-spacing:1.2px;color:#4a2d00;box-shadow:0 8px 24px -10px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.25);}
.ci-stats{display:flex;flex-direction:column;gap:1.2rem;align-items:center;}
.ci-count{font-size:clamp(38px,4.4vw,82px);font-weight:800;line-height:1;letter-spacing:1px;background:linear-gradient(90deg,#fff7d2,#ffd777,var(--clr-accent));-webkit-background-clip:text;background-clip:text;color:transparent;position:relative;}
.ci-count .num{display:inline-block;min-width:1ch;}
.ci-count::after{content:"";position:absolute;left:50%;bottom:-10px;width:80%;height:4px;transform:translateX(-50%);background:linear-gradient(90deg,var(--clr-accent),#ffe8b0,#ffffff);border-radius:4px;box-shadow:0 6px 16px -4px rgba(255,200,110,.7);} 
.ci-meta{font-size:clamp(14px,1.05vw,18px);display:flex;align-items:center;gap:.6rem;color:#d8e4f1;background:rgba(255,255,255,.07);padding:.55rem 1rem;border:1px solid rgba(255,255,255,.15);border-radius:14px;backdrop-filter:blur(8px) saturate(150%);} 
.ci-meta i{color:var(--clr-accent);} 
.ci-right{flex:2 1 540px;display:flex;flex-direction:column;justify-content:center;min-width:360px;}
.ci-heading{margin:0 0 1.4rem;line-height:1.03;font-family:'Kanit',sans-serif;font-weight:800;position:relative;}
.ci-heading .ci-pre{display:block;font-size:clamp(18px,1.2vw,26px);letter-spacing:2px;font-weight:600;color:#ffe9b8;text-transform:uppercase;opacity:.85;margin-bottom:.35rem;}
.ci-heading .ci-main{display:block;font-size:clamp(56px,7vw,118px);letter-spacing:2px;line-height:.95;}
.gradient-text{background:linear-gradient(95deg,#fff5d0,#ffd87a 40%,#ffc24d,#ffb22e,#ffd87a);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 8px 34px rgba(0,0,0,.65));}
.ci-heading .ci-sub{display:block;font-size:clamp(20px,1.6vw,36px);letter-spacing:1px;font-weight:600;color:#ffffff;opacity:.92;margin-top:.4rem;}
.ci-divider{display:flex;align-items:center;gap:1.2rem;margin:0 0 1.8rem;}
.ci-divider span{flex:1;height:1px;background:linear-gradient(90deg,rgba(255,220,130,0),rgba(255,220,130,.65),rgba(255,220,130,0));}
.ci-divider i{color:var(--clr-accent);font-size:clamp(16px,2vw,30px);filter:drop-shadow(0 4px 12px rgba(0,0,0,.55));}
.ci-lead{font-size:clamp(20px,1.75vw,34px);font-weight:600;margin:0 0 1.2rem;color:#fffdf5;letter-spacing:.6px;text-shadow:0 6px 20px rgba(0,0,0,.6);} 
.ci-body{font-size:clamp(17px,1.25vw,24px);line-height:1.62;color:#e6edf5;margin:0 0 1.4rem;text-align:justify;text-justify:inter-word;}
.ci-quote{margin:0;font-size:clamp(16px,1.2vw,22px);font-weight:600;letter-spacing:.5px;color:#ffe7b0;position:relative;padding:.9rem 1.2rem 1rem 3.2rem;background:linear-gradient(120deg,rgba(255,210,110,.14),rgba(255,230,180,.06));border:1px solid rgba(255,255,255,.12);border-radius:18px;backdrop-filter:blur(6px) saturate(140%);display:inline-block;max-width:820px;}
.ci-quote::before{content:"\f10d";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:1.2rem;top:50%;transform:translateY(-50%);font-size:28px;opacity:.55;background:linear-gradient(120deg,#ffe4ad,#ffcc58);-webkit-background-clip:text;background-clip:text;color:transparent;}
@keyframes emblemPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.05);} }
@keyframes spinSlow{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);} }
@media (max-width:1100px){
	.ceremony-intro{flex-direction:column;align-items:center;text-align:center;}
	.ci-right{align-items:center;}
	.ci-quote{text-align:left;}
}
@media (max-width:680px){
	.message-panel.ceremony{padding:2.6rem 1.4rem 3rem;border-radius:48px;}
	.ci-emblem-core{width:220px;height:220px;}
	.ci-emblem-core i{font-size:100px;}
	.ci-ribbon{font-size:16px;padding:.55rem 1.6rem;}
	.ci-heading .ci-main{font-size:clamp(54px,13vw,92px);} 
}
.message-panel.prestige{max-width:1160px;padding:3.4rem clamp(1.8rem,3.2vw,4rem) 4rem;border-radius:46px;background:linear-gradient(145deg,rgba(18,24,38,.82),rgba(26,34,52,.68));border:1px solid rgba(255,255,255,.14);box-shadow:0 40px 90px -28px rgba(0,0,0,.75),0 22px 50px -18px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.05);overflow:hidden;}
.message-panel.prestige .panel-decoration{position:absolute;inset:0;pointer-events:none;background:
	radial-gradient(circle at 20% 18%,rgba(255,220,130,.30),rgba(255,200,90,0) 55%),
	radial-gradient(circle at 82% 78%,rgba(120,180,255,.28),rgba(120,180,255,0) 58%),
	radial-gradient(circle at 50% 50%,rgba(255,255,255,.10),rgba(255,255,255,0) 70%);
	mix-blend-mode:overlay;opacity:.9;}
.message-panel.prestige .panel-glow{position:absolute;inset:-30% -35%;background:conic-gradient(from 0deg,var(--clr-accent),#fff7dc,#ffe18e,#ffd067,#ffbb3d,#ffe18e,#fff7dc,var(--clr-accent));filter:blur(90px) saturate(160%);opacity:.16;animation:panelSpin 18s linear infinite;}
@keyframes panelSpin{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}
.hero-top{display:flex;flex-wrap:wrap;align-items:stretch;gap:2.8rem;margin-bottom:2.6rem;position:relative;z-index:2;}
.hero-emblem{flex:1 1 240px;display:flex;align-items:center;justify-content:center;position:relative;min-width:220px;}
.emblem-ring{position:relative;width:240px;height:240px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:radial-gradient(circle at 50% 50%,rgba(255,230,150,.8),rgba(255,180,40,.22) 60%,rgba(255,160,0,0) 75%);box-shadow:0 18px 50px -16px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.18),inset 0 2px 6px rgba(255,255,255,.4);animation:emblemPulse 6.5s ease-in-out infinite;}
@keyframes emblemPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.06);} }
.emblem-ring i{font-size:110px;color:#c67900;text-shadow:0 8px 26px rgba(0,0,0,.55),0 0 18px rgba(255,200,90,.55);background:linear-gradient(160deg,#ffedc4,#ffc961 45%,#ffaa2e);-webkit-background-clip:text;background-clip:text;color:transparent;}
.emblem-ring .laurel{position:absolute;top:50%;width:140px;height:140px;background:conic-gradient(from -90deg,#ffe9b5,#ffc55a 48%,#ffb02a 52%,#ffe09a);mask:radial-gradient(circle at 50% 50%,#000 52%,transparent 53%);-webkit-mask:radial-gradient(circle at 50% 50%,#000 52%,transparent 53%);opacity:.9;filter:drop-shadow(0 8px 16px rgba(0,0,0,.4));}
.emblem-ring .laurel.left{left:-10%;transform:translateY(-50%) rotate(-22deg) scaleX(-1);} 
.emblem-ring .laurel.right{right:-10%;transform:translateY(-50%) rotate(22deg);} 
.hero-text{flex:2 1 420px;display:flex;flex-direction:column;justify-content:center;}
.hero-heading{font-size:clamp(44px,5.5vw,96px);line-height:1.05;margin:0 0 1.1rem;font-weight:800;letter-spacing:.5px;font-family:'Kanit',sans-serif;position:relative;}
.hero-heading .line{display:block;background:linear-gradient(90deg,#fff7db,#ffe08b,var(--clr-accent));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 6px 24px rgba(0,0,0,.55));}
.hero-heading .line.highlight{background:linear-gradient(90deg,var(--clr-accent),#fff7dc,#ffe08b,var(--clr-accent));position:relative;}
.hero-heading .line.highlight::after{content:"";position:absolute;left:0;bottom:.15em;width:100%;height:.28em;background:linear-gradient(90deg,rgba(255,210,90,.4),rgba(255,240,200,.9),rgba(255,200,80,.4));border-radius:6px;filter:blur(6px) opacity(.85);mix-blend-mode:screen;}
.hero-heading .line{opacity:0;transform:translateY(42px) scale(.94);animation:lineRise 1.1s cubic-bezier(.19,1,.22,1) forwards;}
.hero-heading .line.l1{animation-delay:.15s;}
.hero-heading .line.l2{animation-delay:.38s;}
.hero-heading .line.l3{animation-delay:.64s;}
@keyframes lineRise{0%{opacity:0;transform:translateY(42px) scale(.94);}55%{opacity:1;}100%{opacity:1;transform:translateY(0) scale(1);} }
.hero-heading .line.highlight{--shine-accent:linear-gradient(120deg,rgba(255,255,255,.0) 0%,rgba(255,255,255,.9) 42%,rgba(255,255,255,0) 55%);}
.hero-heading .line.highlight::before{content:"";position:absolute;inset:0;background:var(--shine-accent);mix-blend-mode:overlay;animation:shineSweep 3.8s ease-in-out 1s infinite;opacity:.0;}
@keyframes shineSweep{0%{transform:translateX(-140%) skewX(-12deg);opacity:0;}28%{opacity:1;}48%{opacity:0;}60%{transform:translateX(55%) skewX(-12deg);}100%{transform:translateX(140%) skewX(-12deg);opacity:0;}}
.message-panel .tagline{font-size:clamp(18px,1.6vw,30px);font-weight:600;letter-spacing:.8px;margin:0 0 .2rem;color:#fffdf5;text-shadow:0 5px 18px rgba(0,0,0,.55);}
.message-panel .tagline{position:relative;padding:.4rem 1rem .6rem;display:inline-block;background:linear-gradient(90deg,rgba(255,210,110,.15),rgba(255,230,170,.08),rgba(120,180,255,.15));border:1px solid rgba(255,255,255,.12);border-radius:18px;box-shadow:0 6px 18px -6px rgba(0,0,0,.55),inset 0 0 0 1px rgba(255,255,255,.04);backdrop-filter:blur(6px) saturate(130%);}
.message-panel .tagline::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(140deg,rgba(255,255,255,.4),rgba(255,255,255,0) 45%);mix-blend-mode:overlay;opacity:.35;pointer-events:none;}
.message-panel.prestige .msg-accent.rich{width:120px;height:6px;background:linear-gradient(90deg,var(--clr-accent),#ffe8a8,#ffffff);border-radius:8px;box-shadow:0 6px 18px -4px rgba(255,200,90,.75);margin:0 0 1.4rem;}
.message-panel.prestige .msg-accent.rich{position:relative;}
.message-panel.prestige .msg-accent.rich::before,.message-panel.prestige .msg-accent.rich::after{content:"";position:absolute;top:50%;width:90px;height:1px;background:linear-gradient(90deg,rgba(255,220,120,.0),rgba(255,220,120,.65),rgba(255,220,120,0));filter:blur(.5px);}
.message-panel.prestige .msg-accent.rich::before{right:100%;margin-right:18px;}
.message-panel.prestige .msg-accent.rich::after{left:100%;margin-left:18px;}
.content-text{position:relative;z-index:2;}
.message-panel.prestige .lead{font-size:clamp(20px,1.8vw,34px);font-weight:600;margin-bottom:1.4rem;letter-spacing:.6px;}
.message-panel.prestige .body{font-size:clamp(17px,1.25vw,25px);line-height:1.62;}
/* Corner ornaments */
.message-panel.prestige::before{box-shadow:0 0 0 1px rgba(255,255,255,.06),inset 0 0 0 1px rgba(255,255,255,.04);}
.message-panel.prestige .corner{position:absolute;width:56px;height:56px;border:2px solid rgba(255,230,150,.55);border-radius:14px;opacity:.65;mix-blend-mode:screen;}
.message-panel.prestige .corner.tl{top:14px;left:14px;border-right:none;border-bottom:none;}
.message-panel.prestige .corner.tr{top:14px;right:14px;border-left:none;border-bottom:none;}
.message-panel.prestige .corner.bl{bottom:14px;left:14px;border-right:none;border-top:none;}
.message-panel.prestige .corner.br{bottom:14px;right:14px;border-left:none;border-top:none;}
@media (max-width:1100px){
	.hero-top{flex-direction:column;align-items:center;text-align:center;}
	.hero-text{align-items:center;}
	.emblem-ring{width:200px;height:200px;}
	.emblem-ring i{font-size:92px;}
}
@media (max-width:640px){
	.message-panel.prestige{padding:2.4rem 1.4rem 2.8rem;border-radius:38px;}
	.hero-heading{font-size:clamp(40px,9vw,74px);} 
	.emblem-ring{width:170px;height:170px;} 
	.emblem-ring i{font-size:78px;} 
}
.message-panel h1{margin-top:0;}
.message-panel .msg-accent{width:90px;height:4px;margin:1rem auto 1.8rem;background:linear-gradient(90deg,var(--clr-accent),#ffe8a8,#fff);border-radius:6px;box-shadow:0 4px 12px -2px rgba(255,200,90,.6);} 
.message-panel .lead{font-size:clamp(18px,1.5vw,28px);font-weight:600;margin-bottom:1.2rem;color:#fffdf5;letter-spacing:.5px;}
.message-panel .body{font-size:clamp(16px,1.2vw,23px);font-weight:400;line-height:1.6;color:#e6edf5;text-align:justify;text-justify:inter-word;margin-bottom:0;}
@media (max-width:900px){
	.message-panel{padding:1.9rem 1.7rem 2.4rem;border-radius:26px;}
	.message-panel .body{text-align:left;}
}
@media (max-width:560px){
	.message-panel{padding:1.6rem 1.2rem 2.1rem;}
	.message-panel .msg-accent{margin:0.8rem auto 1.2rem;}
}

/* Sakura petals */
.sakura-petal{position:fixed;top:-60px;width:26px;height:24px;background:radial-gradient(circle at 30% 30%,#ffe3ec,#ffb3ce 60%,#ff89b4);border-radius:60% 70% 70% 60%;pointer-events:none;opacity:0;will-change:transform,opacity;filter:drop-shadow(0 4px 6px rgba(0,0,0,.25));}
.sakura-petal::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 70%,rgba(255,255,255,.85),rgba(255,255,255,0) 70%);mix-blend-mode:overlay;border-radius:inherit;}
.sakura-fall{animation:petalFall linear forwards;}
@keyframes petalFall{0%{opacity:0;transform:translate3d(var(--sx,0),-10vh,0) rotateZ(var(--rz,0)) rotateY(0deg) scale(var(--sc,1));}6%{opacity:1;}100%{opacity:0;transform:translate3d(var(--ex,0),110vh,0) rotateZ(calc(var(--rz,0) + 380deg)) rotateY(540deg) scale(var(--sc,1));}}
.message.active .message-inner{transform:translateY(0) scale(1);opacity:1;}
.message h1{font-size:clamp(40px,5.6vw,84px);line-height:1.18;margin-bottom:1.25rem;font-weight:700;letter-spacing:.5px;background:linear-gradient(90deg,var(--clr-accent),#fff7d8,#ffffff);background-size:100% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 4px 18px rgba(0,0,0,.55);font-family:'Kanit',sans-serif;transition:filter .6s ease;} 
.message h1 .spark::after{display:none;} /* disable moving spark sheen */
html:not(.font-ready) .message h1{background:none;color:#ffffff;-webkit-background-clip:initial;background-clip:initial;}
@media (prefers-reduced-motion:reduce){.message h1{animation:none;filter:none;}}
.message h1 .spark{position:relative;}
.message h1 .spark::after{content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:linear-gradient(120deg,rgba(255,255,255,.26),rgba(255,255,255,0) 70%);mix-blend-mode:overlay;animation:sparkSlide 4.5s linear infinite;}
@keyframes sparkSlide{0%{transform:translateX(-100%);}100%{transform:translateX(100%);}}
.message p{font-size:clamp(18px,1.5vw,30px);line-height:1.55;color:#e6edf5;text-shadow:0 3px 10px rgba(0,0,0,.55);font-weight:400;font-family:'Kanit',sans-serif;} 

/* Envelope (SVG) Layer */
.envelope-layer{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;z-index:70;pointer-events:none;}
.envelope-shell{width:min(62vmin,660px);max-width:92%;aspect-ratio:3/2;position:relative;transform:translateY(60px) scale(.65) rotateX(32deg);opacity:0;transition:transform 1.3s cubic-bezier(.19,1,.22,1),opacity 1.1s ease;transform-style:preserve-3d;}
.envelope-shell.icon-mode{aspect-ratio:auto;width:auto;background:none;box-shadow:none;transform:translateY(60px) scale(.55) rotateX(0deg);} 
.envelope-shell.icon-mode.entered{transform:translateY(0) scale(.9);} 
.envelope-shell.icon-mode .envelope-icon{font-size:18vmin;position:relative;color:#ffdd95;filter:drop-shadow(0 10px 30px rgba(0,0,0,.55));}
.envelope-shell.icon-mode .circle-bg{color:rgba(255,255,255,.12);} 
.envelope-shell.icon-mode .main-env{color:#ffcf62;animation:envPulse 2.6s ease-in-out infinite;} 
@keyframes envPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.06);} }
.envelope-shell.entered{opacity:1;transform:translateY(0) scale(1) rotateX(0deg);} 
.envelope-shell.exit{animation:envFly 2.6s cubic-bezier(.22,.8,.3,.99) forwards;} 
.envelope-shell.fast-exit{animation:envFlyFast 1.2s cubic-bezier(.55,.13,.55,.95) forwards;} 
.envelope-shell::after{content:"";position:absolute;inset:-6%;border-radius:18px;background:radial-gradient(circle at 50% 50%,rgba(255,245,190,.85),rgba(255,205,90,.35) 38%,rgba(255,180,30,.15) 60%,rgba(255,160,0,0) 72%);opacity:0;pointer-events:none;filter:blur(22px) saturate(140%);transform:scale(.65);}
.envelope-shell.preflight::after{animation:envPreGlow .7s ease forwards;}
.envelope-shell.preflight{animation:envShellFlash .7s ease forwards;}
@keyframes envPreGlow{0%{opacity:0;transform:scale(.55);}38%{opacity:1;transform:scale(1);}70%{opacity:.85;}100%{opacity:0;transform:scale(1.25);} }
@keyframes envShellFlash{0%{filter:drop-shadow(0 6px 12px rgba(0,0,0,.55)) brightness(1);}25%{filter:drop-shadow(0 0 28px rgba(255,220,140,.65)) brightness(1.25);}55%{filter:drop-shadow(0 0 34px rgba(255,210,110,.55)) brightness(1.18);}100%{filter:drop-shadow(0 8px 25px rgba(0,0,0,.55)) brightness(1.05);} }
.envelope-svg{width:100%;height:100%;display:block;}
.env-flap{transform-origin:300px 30px;transform:rotateX(0deg);transition:transform 1.05s cubic-bezier(.65,.02,.4,.9);}
.env-flap.closed{transform:rotateX(180deg);} 
.seal{position:absolute;left:50%;top:54%;transform:translate(-50%,-50%) scale(0);width:122px;height:122px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#d42020,#7d0f0f);display:flex;align-items:center;justify-content:center;color:#fff;font-size:48px;box-shadow:0 14px 40px -10px rgba(0,0,0,.65),0 8px 20px -4px rgba(0,0,0,.5),inset 0 5px 10px rgba(255,255,255,.28);opacity:0;}
.seal.pop{animation:sealPop 1.15s ease forwards;}
@keyframes sealPop{0%{transform:translate(-50%,-50%) scale(0);opacity:0;}60%{transform:translate(-50%,-50%) scale(1.18);opacity:1;}80%{transform:translate(-50%,-50%) scale(.9);}100%{transform:translate(-50%,-50%) scale(1);opacity:1;}}
@keyframes envFly{0%{transform:translateY(0) scale(1) rotateX(0deg) rotate(0deg);opacity:1;}28%{transform:translateY(-25vh) scale(.93) rotateX(15deg) rotate(4deg);}54%{transform:translateY(-55vh) scale(.85) rotateX(6deg) rotate(-4deg);}80%{opacity:1;}100%{transform:translateY(-135vh) scale(.7) rotateX(26deg) rotate(-10deg);opacity:0;}}
@keyframes envFlyFast{0%{transform:translateY(0) scale(1) rotateX(0deg);opacity:1;}40%{transform:translateY(-70vh) scale(.78) rotateX(12deg);}100%{transform:translateY(-140vh) scale(.62) rotateX(24deg);opacity:0;}}

/* Float subtle oscillation */
@keyframes floatY{0%{transform:translate(-50%,-50%) translateY(-6px) scale(var(--float-scale,1)) rotate(var(--float-rot,0deg));}50%{transform:translate(-50%,-50%) translateY(10px) scale(var(--float-scale,1)) rotate(calc(var(--float-rot,0deg)*1));}100%{transform:translate(-50%,-50%) translateY(-6px) scale(var(--float-scale,1)) rotate(var(--float-rot,0deg));}}

/* Animated heading gradient */
/* headingShift animation removed for stability */

/* Spark burst (message entrance) */
.burst-particle{position:absolute;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle,#fff,#ffd27a 60%,transparent 70%);pointer-events:none;mix-blend-mode:screen;animation:burst 1.4s ease forwards;filter:blur(.5px);} 
@keyframes burst{0%{transform:translate(-50%,-50%) scale(0);opacity:1;}55%{opacity:1;}100%{transform:translate(-50%,-50%) scale(1.9);opacity:0;}}

/* Sparkle trail for envelope */
.sparkle{position:fixed;width:10px;height:10px;left:0;top:0;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.95),rgba(255,220,120,.6) 50%,rgba(255,180,80,0) 70%);pointer-events:none;mix-blend-mode:screen;animation:sparkFade .9s linear forwards;filter:blur(.5px);} 
@keyframes sparkFade{0%{transform:translate(-50%,-50%) scale(.4);opacity:1;}70%{opacity:.9;}100%{transform:translate(-50%,-50%) scale(1.6);opacity:0;}}

/* Envelope exit extra blur */
.envelope-shell.exit{filter:drop-shadow(0 8px 25px rgba(0,0,0,.55)) brightness(1.05);}

/* Footer */
/* Old footer removed; info moved to dock */

/* Utility */
.hidden{display:none !important;}

/* Delivery Overlay (replaces envelope phase) */
.delivery-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background:rgba(8,12,20,.82);backdrop-filter:blur(28px) saturate(170%);z-index:90;opacity:0;transition:opacity .9s ease;}
.delivery-overlay.active{opacity:1;}
.delivery-inner{text-align:center;max-width:1200px;padding:4rem 5vw 5rem;position:relative;}
.delivery-inner::before{content:"";position:absolute;inset:-30% -35%;background:conic-gradient(from 0deg,var(--clr-accent),#fff6d2,#ffe08b,#ffc04e,#ffe08b,#fff6d2,var(--clr-accent));filter:blur(140px) saturate(180%);opacity:.12;animation:panelSpin 24s linear infinite;}
.delivery-heading{font-size:clamp(32px,4.5vw,72px);line-height:1.18;font-weight:700;margin:0 0 1.6rem;font-family:'Kanit',sans-serif;background:linear-gradient(90deg,var(--clr-accent),#fff7db,#ffe08b,#ffffff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 6px 28px rgba(0,0,0,.55);animation:fadeScale 1.1s cubic-bezier(.19,1,.22,1) .05s both;}
.delivery-accent{width:140px;height:6px;margin:0 auto 1.8rem;background:linear-gradient(90deg,var(--clr-accent),#ffe8a8,#ffffff);border-radius:10px;box-shadow:0 8px 24px -6px rgba(255,200,90,.75);animation:accentPulse 3.8s ease-in-out infinite;}
@keyframes accentPulse{0%,100%{transform:scaleX(.85);opacity:.9;}50%{transform:scaleX(1);opacity:1;}}
.delivery-note{font-size:clamp(18px,1.6vw,30px);color:#e6edf5;letter-spacing:.6px;font-weight:500;margin:0;animation:fadeSlide 1s ease .4s both;}
.delivery-overlay .particle{position:absolute;width:14px;height:14px;left:0;top:0;border-radius:50%;background:radial-gradient(circle,#fff,#ffd27a 60%,transparent 70%);pointer-events:none;mix-blend-mode:screen;animation:deliveryParticle 2.2s linear forwards;filter:blur(.5px);}
@keyframes deliveryParticle{0%{transform:translate(var(--sx),var(--sy)) scale(0);opacity:1;}55%{opacity:1;}100%{transform:translate(var(--ex),var(--ey)) scale(1.6);opacity:0;}}

/* QR Overlay */
.qr-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background:radial-gradient(circle at 50% 40%,rgba(15,24,42,.92),rgba(5,8,14,.94));backdrop-filter:blur(26px) saturate(180%);z-index:120;opacity:0;transition:opacity .9s ease;}
.qr-overlay.active{opacity:1;}
.qr-inner{text-align:center;animation:qrRise 1.1s cubic-bezier(.19,1,.22,1) forwards;transform:translateY(60px) scale(.9);opacity:0;display:flex;justify-content:center;align-items:center;width:100%;padding:4vmin 4vw;}
.qr-overlay.active .qr-inner{transform:translateY(0) scale(1);opacity:1;}
.qr-panel{position:relative;padding:3.2rem clamp(1.4rem,3vw,3.5rem) 3.6rem;border-radius:40px;max-width:880px;width:100%;background:linear-gradient(145deg,rgba(25,32,50,.85),rgba(15,20,32,.72));border:1px solid rgba(255,255,255,.10);box-shadow:0 28px 70px -18px rgba(0,0,0,.65),0 10px 30px -10px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.05);overflow:hidden;}
.qr-panel::before,.qr-panel::after{content:"";position:absolute;inset:0;pointer-events:none;}
.qr-panel::before{background:radial-gradient(circle at 20% 15%,rgba(255,210,120,.22),rgba(255,180,70,0) 55%),radial-gradient(circle at 80% 85%,rgba(120,180,255,.22),rgba(120,180,255,0) 60%);mix-blend-mode:overlay;}
.qr-panel::after{background:linear-gradient(120deg,rgba(255,255,255,.22),rgba(255,255,255,0) 35%,rgba(255,255,255,.18) 70%,rgba(255,255,255,0));opacity:.12;mix-blend-mode:overlay;}
.qr-heading{display:inline-flex;align-items:center;gap:14px;font-size:clamp(28px,3vw,54px);font-weight:700;letter-spacing:.6px;margin:0 0 1.8rem;font-family:'Kanit',sans-serif;background:linear-gradient(90deg,var(--clr-accent),#fff4c8,#ffffff);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 6px 18px rgba(0,0,0,.55));}
.qr-heading i{font-size:.8em;color:#ffda74;filter:drop-shadow(0 4px 10px rgba(0,0,0,.55));animation:crownFloat 3.6s ease-in-out infinite;}
@keyframes crownFloat{0%,100%{transform:translateY(-4px) rotate(-6deg);}50%{transform:translateY(6px) rotate(6deg);}}
.qr-frame{position:relative;width:min(48vmin,460px);max-width:82vw;margin:0 auto 1.8rem;}
.qr-image{width:100%;height:auto;display:block;border-radius:30px;position:relative;z-index:2;padding:1rem;background:#fff;box-shadow:0 25px 50px -16px rgba(0,0,0,.55),0 0 0 1px rgba(0,0,0,.08);}
.qr-glow{position:absolute;inset:-12%;background:radial-gradient(circle at 50% 50%,rgba(255,230,140,.65),rgba(255,170,60,.15) 55%,rgba(255,140,20,0) 75%);filter:blur(28px) saturate(160%);z-index:1;opacity:.85;animation:qrPulse 4.6s ease-in-out infinite;}
@keyframes qrPulse{0%,100%{transform:scale(.9);opacity:.75;}50%{transform:scale(1.15);opacity:1;}}
.qr-caption{font-size:clamp(20px,1.9vw,34px);font-weight:700;color:#fff;letter-spacing:.8px;text-shadow:0 5px 18px rgba(0,0,0,.6);margin:0 0 .8rem;}
.qr-sub{font-size:clamp(15px,1.1vw,22px);color:#d8e2ee;letter-spacing:.5px;margin:0;font-weight:500;opacity:.85;}
@keyframes qrRise{0%{transform:translateY(60px) scale(.9);opacity:0;}55%{opacity:1;}100%{transform:translateY(0) scale(1);opacity:1;}}
@media (max-width:720px){
	.qr-panel{padding:2.4rem 1.6rem 2.8rem;border-radius:34px;}
	.qr-frame{margin-bottom:1.4rem;}
	.qr-heading{margin-bottom:1.2rem;}
}

/* End Video Overlay */
.end-video-overlay{position:absolute;inset:0;z-index:200;display:flex;justify-content:center;align-items:center;background:#000;opacity:0;transition:opacity 1.4s ease;}
.end-video-overlay.active{opacity:1;}
.end-video{width:100%;height:100%;object-fit:cover;}

/* Sound prompt */
.sound-prompt{position:absolute;right:18px;top:18px;z-index:140;background:rgba(15,20,32,.65);backdrop-filter:blur(14px) saturate(160%);color:#fff;padding:10px 18px;border:1px solid rgba(255,255,255,.15);border-radius:18px;font-size:15px;font-weight:600;display:flex;align-items:center;gap:8px;cursor:pointer;box-shadow:0 6px 22px -8px rgba(0,0,0,.55);transition:background .4s,transform .4s,opacity .4s;opacity:0;}
.sound-prompt i{font-size:16px;}
.sound-prompt.show{opacity:1;}
.sound-prompt:hover{background:rgba(255,255,255,.18);transform:translateY(-4px);}
.sound-prompt:active{transform:translateY(0) scale(.94);}

/* Responsive Tweaks */
@media (max-width:900px){
	.collage-item{width:calc(var(--item-size,320px)*0.75);}
	.message h1{font-size:clamp(34px,7vw,70px);}
	.message p{font-size:clamp(17px,2vw,28px);}
	.seal{width:100px;height:100px;font-size:40px;}
}
@media (max-width:600px){
	.collage-item{width:calc(var(--item-size,320px)*0.55);border-radius:12px;}
	.message-inner{padding:0 7vw;}
	.top-bar.minimal{padding:6px 14px;}
	.icon-btn{width:34px;height:34px;}
}