.sdi-stage{
	--sdi-accent:#d84077;
	--sdi-hover:#b92f63;
	--sdi-card-bg:#f5fcfc;
	--sdi-text:#555;
	--sdi-max-width:430px;
	width:100%;
	min-height:100vh;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:24px;
	overflow:hidden;
	position:relative;
	color:var(--sdi-text);
	background:
		radial-gradient(circle at 20% 20%,rgba(255,255,255,.95),transparent 30%),
		radial-gradient(circle at 80% 30%,rgba(255,225,237,.76),transparent 35%),
		linear-gradient(135deg,#f7eeee,#f7e5ed,#f4eeee);
	font-family:Arial,Helvetica,sans-serif;
}

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

.sdi-stage::before,
.sdi-stage::after{
	content:"";
	position:absolute;
	width:320px;
	height:320px;
	border-radius:50%;
	filter:blur(90px);
	opacity:.35;
	pointer-events:none;
}

.sdi-stage::before{
	background:#ffd6e6;
	top:-80px;
	left:-100px;
}

.sdi-stage::after{
	background:#fff;
	right:-70px;
	bottom:-100px;
}

.sdi-date-app{
	width:100%;
	max-width:var(--sdi-max-width);
	position:relative;
	z-index:2;
}

.sdi-card{
	display:none;
	width:100%;
	padding:34px 28px;
	border-radius:16px;
	background:color-mix(in srgb,var(--sdi-card-bg) 92%,transparent);
	border:1px solid rgba(255,255,255,.88);
	box-shadow:0 20px 45px rgba(91,72,80,.12),0 5px 14px rgba(91,72,80,.10);
	backdrop-filter:blur(20px);
	-webkit-backdrop-filter:blur(20px);
	animation:sdiCardIn .55s cubic-bezier(.2,.8,.2,1);
}

@supports not (background:color-mix(in srgb,#fff 50%,transparent)){
	.sdi-card{background:rgba(245,252,252,.94);}
}

.sdi-card.is-active{display:block;}

@keyframes sdiCardIn{
	from{opacity:0;transform:translateY(18px) scale(.97);}
	to{opacity:1;transform:translateY(0) scale(1);}
}

.sdi-heading{
	margin:0 0 24px;
	font-family:Georgia,"Times New Roman",serif;
	text-align:center;
	color:#c16380;
	font-weight:500;
	font-size:29px;
	line-height:1.25;
}


.sdi-welcome-card{
	text-align:center;
	padding:42px 30px 34px;
	overflow:hidden;
	position:relative;
}

.sdi-welcome-card::before{
	content:"";
	position:absolute;
	width:180px;
	height:180px;
	left:50%;
	top:-110px;
	transform:translateX(-50%);
	border-radius:50%;
	background:rgba(216,64,119,.10);
	filter:blur(8px);
	pointer-events:none;
}

.sdi-welcome-icon{
	width:76px;
	height:76px;
	margin:0 auto 18px;
	border-radius:24px;
	display:flex;
	align-items:center;
	justify-content:center;
	position:relative;
	background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(255,231,240,.88));
	border:1px solid rgba(216,64,119,.14);
	box-shadow:0 12px 32px rgba(216,64,119,.14);
	animation:sdiWelcomeFloat 3s ease-in-out infinite;
}

.sdi-welcome-icon::after{
	content:"";
	position:absolute;
	inset:-8px;
	border-radius:29px;
	border:1px solid rgba(216,64,119,.08);
}

.sdi-welcome-icon span{
	font-size:34px;
	line-height:1;
}

@keyframes sdiWelcomeFloat{
	0%,100%{transform:translateY(0) rotate(-2deg);}
	50%{transform:translateY(-7px) rotate(2deg);}
}

.sdi-welcome-heading{
	margin-bottom:10px;
	font-size:31px;
}

.sdi-welcome-text{
	max-width:330px;
	margin:0 auto 26px;
	color:#8b7a80;
	font-size:13px;
	line-height:1.65;
	text-align:center;
}

.sdi-name-field-wrap{
	text-align:left;
	position:relative;
}

.sdi-name-label{
	display:block;
	margin:0 0 8px 4px;
	font-size:11px;
	font-weight:700;
	letter-spacing:.02em;
	color:#8c7c82;
}

.sdi-name-input-shell{
	height:52px;
	display:flex;
	align-items:center;
	gap:10px;
	padding:0 16px;
	border:1px solid rgba(216,64,119,.15);
	border-radius:16px;
	background:rgba(255,255,255,.78);
	box-shadow:0 8px 22px rgba(91,72,80,.06);
	transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease;
}

.sdi-name-input-shell:focus-within{
	border-color:var(--sdi-accent);
	box-shadow:0 0 0 4px rgba(216,64,119,.08),0 10px 25px rgba(91,72,80,.07);
	transform:translateY(-1px);
}

.sdi-name-icon{
	font-size:16px;
	flex:0 0 auto;
}

.sdi-name-input{
	width:100%;
	height:100%;
	border:0 !important;
	outline:0 !important;
	box-shadow:none !important;
	background:transparent !important;
	padding:0 !important;
	margin:0 !important;
	color:var(--sdi-text) !important;
	font-family:inherit !important;
	font-size:13px !important;
	line-height:1 !important;
}

.sdi-name-input::placeholder{
	color:#b8adb1;
	opacity:1;
}

.sdi-name-error{
	min-height:20px;
	padding:6px 4px 0;
	color:#c75275;
	font-size:10px;
	line-height:1.35;
}

.sdi-welcome-next{
	margin-top:10px;
}

.sdi-welcome-sparkles{
	margin-top:18px;
	display:flex;
	justify-content:center;
	align-items:center;
	gap:15px;
	color:#d46c8d;
	font-size:13px;
	opacity:.78;
}

.sdi-welcome-sparkles span{
	display:inline-block;
	animation:sdiSparkle 2.2s ease-in-out infinite;
}

.sdi-welcome-sparkles span:nth-child(2){animation-delay:.45s;}
.sdi-welcome-sparkles span:nth-child(3){animation-delay:.9s;}

@keyframes sdiSparkle{
	0%,100%{transform:translateY(0) scale(1);opacity:.55;}
	50%{transform:translateY(-5px) scale(1.12);opacity:1;}
}

.sdi-personal-greeting{
	margin:-6px 0 10px;
	text-align:center;
	font-family:Georgia,"Times New Roman",serif;
	font-size:13px;
	color:#a68a94;
}

.sdi-personal-greeting .sdi-person-name{
	color:var(--sdi-accent);
	font-weight:700;
}

.sdi-name-input-shell.has-error{
	border-color:#d85c7d;
	animation:sdiInputShake .38s ease;
}

@keyframes sdiInputShake{
	0%,100%{transform:translateX(0);}
	25%{transform:translateX(-5px);}
	50%{transform:translateX(5px);}
	75%{transform:translateX(-3px);}
}

.sdi-proposal-card{
	text-align:center;
	padding-top:42px;
	padding-bottom:38px;
}

.sdi-proposal-title{
	max-width:340px;
	margin-left:auto;
	margin-right:auto;
	font-size:34px;
	line-height:1.15;
}

.sdi-proposal-actions{
	position:relative;
	min-height:165px;
	margin-top:30px;
}

.sdi-btn,
.sdi-next-btn,
.sdi-month-prev,
.sdi-month-next,
.sdi-time-btn,
.sdi-food-card{
	font-family:inherit;
	-webkit-tap-highlight-color:transparent;
}

.sdi-btn{
	border:0;
	outline:0;
	cursor:pointer;
	transition:.25s ease;
}

.sdi-yes-btn{
	width:100%;
	height:49px;
	border-radius:28px;
	background:var(--sdi-accent);
	color:#fff;
	font-weight:700;
	font-size:15px;
	box-shadow:0 8px 18px rgba(210,63,117,.25);
}

.sdi-yes-btn:hover{
	background:var(--sdi-hover);
	transform:translateY(-2px);
	box-shadow:0 12px 24px rgba(210,63,117,.32);
}

.sdi-no-btn{
	position:absolute;
	top:66px;
	left:50%;
	transform:translateX(-50%);
	padding:8px 14px;
	border-radius:20px;
	background:#edf0f0;
	color:#777;
	font-size:12px;
	white-space:nowrap;
	user-select:none;
	touch-action:none;
	z-index:3;
}

.sdi-funny-message{
	min-height:25px;
	margin-top:8px;
	color:#c16380;
	font-size:13px;
	font-weight:600;
	opacity:0;
	transition:.25s;
}

.sdi-funny-message.is-visible{opacity:1;}

.sdi-section-label{
	font-size:12px;
	margin-bottom:9px;
	color:#777;
}

.sdi-calendar{
	background:#fff;
	border:1px solid #e8e8e8;
	border-radius:12px;
	padding:18px;
	box-shadow:0 5px 12px rgba(0,0,0,.025);
}

.sdi-calendar-header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-bottom:15px;
}

.sdi-month-prev,
.sdi-month-next{
	border:0;
	background:none;
	cursor:pointer;
	font-size:17px;
	color:#999;
	width:30px;
	height:30px;
	border-radius:50%;
}

.sdi-month-prev:hover,
.sdi-month-next:hover{
	background:#f6edf1;
	color:var(--sdi-hover);
}

.sdi-month-prev:disabled,
.sdi-month-next:disabled{
	opacity:.25;
	cursor:not-allowed;
	background:transparent !important;
	color:#aaa !important;
}

.sdi-date-filter-note{
	min-height:18px;
	margin:-4px 0 8px;
	font-size:10px;
	line-height:1.4;
	color:#9b8b91;
}

.sdi-date-filter-note.is-active{
	color:var(--sdi-accent);
	font-weight:600;
}

.sdi-month-year{
	font-size:13px;
	font-weight:700;
	color:#777;
}

.sdi-weekdays,
.sdi-calendar-days{
	display:grid;
	grid-template-columns:repeat(7,1fr);
	gap:4px;
	text-align:center;
}

.sdi-weekdays div{
	font-size:9px;
	color:#aaa;
	padding-bottom:7px;
}

.sdi-day{
	aspect-ratio:1/1;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:50%;
	font-size:10px;
	cursor:pointer;
	transition:.2s;
}

.sdi-day:hover:not(.is-disabled):not(.is-empty){
	background:#f9dce7;
	color:var(--sdi-hover);
}

.sdi-day.is-selected{
	background:var(--sdi-accent);
	color:#fff;
	font-weight:700;
}

.sdi-day.is-disabled{
	color:#d8d8d8;
	cursor:not-allowed;
	opacity:.48;
	pointer-events:none;
	background:transparent;
}

.sdi-day.is-outside-range{
	color:#d8d8d8;
	opacity:.34;
	text-decoration:line-through;
	text-decoration-thickness:1px;
}

.sdi-day.is-empty{cursor:default;}

.sdi-time-section{margin-top:23px;}

.sdi-times{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:8px;
}

.sdi-time-btn{
	border:1px solid #e8e8e8;
	background:#f7f7f7;
	color:#777;
	border-radius:15px;
	padding:8px 3px;
	font-size:9px;
	cursor:pointer;
	transition:.2s;
}

.sdi-time-btn:hover{
	background:#f9dce7;
	border-color:var(--sdi-hover);
	color:var(--sdi-hover);
}

.sdi-time-btn.is-selected{
	background:var(--sdi-accent);
	color:#fff;
	border-color:var(--sdi-accent);
}

.sdi-next-btn{
	width:100%;
	height:45px;
	border:0;
	border-radius:25px;
	margin-top:25px;
	background:#e2e4e4;
	color:#999;
	cursor:not-allowed;
	transition:.25s;
}

.sdi-next-btn.is-ready{
	background:var(--sdi-accent);
	color:#fff;
	cursor:pointer;
	box-shadow:0 7px 17px rgba(216,64,119,.25);
}

.sdi-next-btn.is-ready:hover{
	background:var(--sdi-hover);
	transform:translateY(-2px);
}

.sdi-food-grid{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:12px;
}

.sdi-food-card{
	min-height:94px;
	border:1px solid #e4e4e4;
	border-radius:10px;
	background:rgba(255,255,255,.68);
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:7px;
	cursor:pointer;
	transition:.25s;
	box-shadow:0 2px 6px rgba(0,0,0,.015);
	color:#555;
}

.sdi-food-card:hover{
	transform:translateY(-3px);
	border-color:var(--sdi-hover);
	box-shadow:0 8px 18px rgba(190,94,128,.10);
}

.sdi-food-card.is-selected{
	border:2px solid var(--sdi-accent);
	background:#fff5f8;
	transform:translateY(-2px);
}

.sdi-food-icon{font-size:27px;}
.sdi-food-name{font-size:11px;}

.sdi-final-card{padding:38px 30px 30px;}

.sdi-love-title-wrap{
	position:relative;
	margin-bottom:26px;
	padding:8px 30px 0;
	min-height:110px;
	display:flex;
	align-items:center;
	justify-content:center;
}

.sdi-love-title{
	margin:0;
	font-size:30px;
	line-height:1.22;
	color:#cf4f79;
	position:relative;
	z-index:2;
}

.sdi-kiss{
	position:absolute;
	font-size:23px;
	animation:sdiKissFloat 2.4s ease-in-out infinite;
	filter:drop-shadow(0 4px 8px rgba(207,79,121,.18));
	user-select:none;
	pointer-events:none;
}

.sdi-kiss-1{left:1px;top:5px;animation-delay:0s;}
.sdi-kiss-2{left:10px;bottom:4px;animation-delay:.55s;}
.sdi-kiss-3{right:1px;top:5px;animation-delay:1.05s;}
.sdi-kiss-4{right:10px;bottom:4px;animation-delay:1.55s;}

@keyframes sdiKissFloat{
	0%,100%{transform:translateY(0) rotate(-7deg) scale(1);}
	50%{transform:translateY(-8px) rotate(7deg) scale(1.08);}
}

.sdi-summary{
	background:rgba(255,255,255,.55);
	border:1px solid rgba(230,230,230,.8);
	border-radius:8px;
	overflow:hidden;
}

.sdi-summary-row{
	display:flex;
	gap:12px;
	align-items:center;
	min-height:53px;
	padding:11px 16px;
	border-bottom:1px solid #ededed;
	font-size:13px;
}

.sdi-summary-row:last-child{border-bottom:0;}

.sdi-summary-icon{
	width:25px;
	text-align:center;
	font-size:16px;
}

.sdi-final-message{
	margin-top:22px;
	font-family:Georgia,"Times New Roman",serif;
	color:#c16380;
	text-align:center;
	font-size:17px;
	line-height:1.4;
}

.sdi-romantic-note{
	max-width:330px;
	margin:18px auto 0;
	text-align:center;
	font-size:10px;
	line-height:1.65;
	color:#8d7a81;
	font-style:italic;
}

.sdi-email-status{
	margin-top:14px;
	text-align:center;
	font-size:10px;
	color:#999;
}

.sdi-email-status.is-saving{
	animation:sdiStatusPulse 1.25s ease-in-out infinite;
}

@keyframes sdiStatusPulse{
	0%,100%{opacity:.55;}
	50%{opacity:1;}
}


.sdi-creator-credit{
	margin-top:18px;
	padding-top:14px;
	border-top:1px solid rgba(216,64,119,.12);
	text-align:center;
	font-size:10px;
	line-height:1.5;
	letter-spacing:.02em;
	color:#9b8b91;
}

.sdi-creator-credit span{
	color:var(--sdi-accent);
	font-weight:700;
}

.sdi-floating-love{
	position:fixed;
	pointer-events:none;
	z-index:99999;
	opacity:0;
	animation:sdiFloatLove 4s ease-out forwards;
}

@keyframes sdiFloatLove{
	0%{opacity:0;transform:translateY(20px) scale(.7) rotate(0deg);}
	20%{opacity:.8;}
	100%{opacity:0;transform:translateY(-170px) scale(1.2) rotate(20deg);}
}

@media(max-width:480px){
	.sdi-welcome-card{padding:34px 20px 28px;}
	.sdi-welcome-icon{width:68px;height:68px;border-radius:22px;}
	.sdi-welcome-heading{font-size:27px;}
	.sdi-welcome-text{font-size:12px;margin-bottom:22px;}
	.sdi-stage{padding:16px;min-height:100svh;}
	.sdi-card{padding:28px 20px;}
	.sdi-heading{font-size:25px;}
	.sdi-proposal-title{font-size:29px;}
	.sdi-times{grid-template-columns:repeat(3,1fr);}
	.sdi-food-card{min-height:85px;}
	.sdi-love-title{font-size:24px;}
	.sdi-love-title-wrap{padding-left:25px;padding-right:25px;}
}

.sdi-live-share-note{
	max-width:340px;
	margin:12px auto 0;
	font-size:9px;
	line-height:1.55;
	color:#9b8b91;
	text-align:center;
}


.sdi-live-resume-share{
	position:absolute;
	right:14px;
	bottom:14px;
	z-index:8;
	border:1px solid rgba(216,64,119,.22);
	border-radius:999px;
	padding:8px 12px;
	background:#fff;
	color:var(--sdi-accent);
	font:600 11px/1.2 Arial,Helvetica,sans-serif;
	box-shadow:0 8px 20px rgba(91,72,80,.10);
	cursor:pointer;
}
.sdi-live-resume-share:hover{background:#fff4f8;color:var(--sdi-hover);}
.sdi-live-resume-share:disabled{opacity:.6;cursor:wait;}

/* Dashboard-managed custom food option */
.sdi-other-food-wrap{
	margin-top:16px;
	padding:14px;
	border:1px solid rgba(216,64,119,.16);
	border-radius:14px;
	background:rgba(255,255,255,.62);
	box-shadow:0 8px 22px rgba(91,72,80,.05);
}
.sdi-other-food-wrap[hidden]{display:none !important;}
.sdi-other-food-wrap.is-visible{animation:sdiCardIn .28s ease both;}
.sdi-other-food-label{
	display:block;
	margin:0 0 8px 2px;
	font-size:11px;
	font-weight:700;
	color:#8c7c82;
}
.sdi-other-food-shell{
	height:48px;
	display:flex;
	align-items:center;
	gap:10px;
	padding:0 14px;
	border:1px solid #eadfe3;
	border-radius:14px;
	background:#fff;
	transition:.2s ease;
}
.sdi-other-food-shell:focus-within{
	border-color:var(--sdi-accent);
	box-shadow:0 0 0 4px rgba(216,64,119,.08);
}
.sdi-other-food-input{
	width:100%;
	height:100%;
	border:0 !important;
	outline:0 !important;
	box-shadow:none !important;
	background:transparent !important;
	padding:0 !important;
	margin:0 !important;
	font:inherit !important;
	font-size:12px !important;
	color:var(--sdi-text) !important;
}
.sdi-other-food-help{
	margin:7px 2px 0;
	font-size:9px;
	color:#aaa;
}
