:root{
	--pb-bg1:#081421;
	--pb-bg2:#0b1a2b;

	--pb-panel:#0d1b2a;
	--pb-panel2:#0b1624;

	--pb-line:rgba(255,255,255,.12);
	--pb-text:rgba(255,255,255,.92);
	--pb-muted:rgba(255,255,255,.66);

	--pb-accent:#ff72b6;
	--pb-accent2:rgba(255,114,182,.22);

	--pb-accentB:#6fd6ff;
	--pb-accentB2:rgba(111,214,255,.18);

	--pb-shadow:0 16px 46px rgba(0,0,0,.42);

	--pb-field:rgba(255,255,255,.05);
	--pb-ring:rgba(255,114,182,.26);

	--pb-r:22px;
	--pb-r2:14px;
}

html[data-theme="light"]{
	--pb-bg1:#ffe9f4;
	--pb-bg2:#e8f7ff;

	--pb-panel:#ffffff;
	--pb-panel2:#f6f8fb;

	--pb-line:rgba(9,20,35,.12);
	--pb-text:#0b0f14;
	--pb-muted:rgba(9,20,35,.62);

	--pb-accent:#ff5fb3;
	--pb-accent2:rgba(255,95,179,.18);

	--pb-accentB:#52c7ff;
	--pb-accentB2:rgba(82,199,255,.16);

	--pb-shadow:0 18px 52px rgba(9,20,35,.10);

	--pb-field:rgba(9,20,35,.035);
	--pb-ring:rgba(255,95,179,.22);
}

#poll-baby{
	color:var(--pb-text);
	background:
		radial-gradient(900px 420px at 18% 0%, var(--pb-accent2), transparent 60%),
		radial-gradient(900px 420px at 82% 0%, var(--pb-accentB2), transparent 60%),
		linear-gradient(180deg, var(--pb-bg1), var(--pb-bg2));
}

#poll-baby .pb-main{
	max-width:1120px;
	margin:0 auto;
	padding:34px 22px 56px;
}

#poll-baby .pb-hero{
	margin-bottom:16px;
}

#poll-baby .pb-heroCard{
	border:1px solid var(--pb-line);
	background:
		radial-gradient(700px 240px at 16% 0%, var(--pb-accent2), transparent 60%),
		radial-gradient(700px 240px at 84% 0%, var(--pb-accentB2), transparent 60%),
		linear-gradient(180deg, var(--pb-panel), var(--pb-panel2));
	border-radius:var(--pb-r);
	box-shadow:var(--pb-shadow);
	padding:22px 22px 20px;
}

#poll-baby .pb-kicker{
	display:inline-flex;
	align-items:center;
	font-size:12px;
	font-weight:800;
	letter-spacing:.2px;
	padding:6px 10px;
	border-radius:999px;
	border:1px solid var(--pb-line);
	background:linear-gradient(90deg, var(--pb-accent2), var(--pb-accentB2));
	color:var(--pb-text);
}

#poll-baby .pb-title{
	margin:12px 0 8px;
	font-size:44px;
	line-height:1.06;
	letter-spacing:-.6px;
}

#poll-baby .pb-sub{
	margin:0;
	color:var(--pb-muted);
	line-height:1.5;
	max-width:60ch;
}

#poll-baby .pb-card{
	border:1px solid var(--pb-line);
	background:var(--pb-panel);
	border-radius:var(--pb-r);
	box-shadow:var(--pb-shadow);
	overflow:hidden;
}

#poll-baby .pb-cardHead{
	padding:16px 18px 10px;
	border-bottom:1px solid var(--pb-line);
}

#poll-baby .pb-cardTitle{
	margin:0;
	font-size:16px;
	font-weight:900;
	letter-spacing:-.2px;
}

#poll-baby .pb-cardBody{
	padding:18px;
}

#poll-baby .pb-alert{
	border:1px solid var(--pb-line);
	border-radius:14px;
	padding:12px 14px;
	margin-bottom:14px;
	background:var(--pb-panel2);
}

#poll-baby .pb-alert--ok{
	border-color:rgba(46,204,113,.35);
	background:rgba(46,204,113,.12);
}

#poll-baby .pb-alert--err{
	border-color:rgba(255,77,77,.35);
	background:rgba(255,77,77,.12);
}

#poll-baby .pb-errors{
	margin:0;
	padding-left:18px;
}

#poll-baby .pb-form{
	margin-top:6px;
}

#poll-baby .pb-formGrid{
	display:grid;
	grid-template-columns:1fr;
	gap:14px;
}

@media (min-width:900px){
	#poll-baby .pb-formGrid{
		grid-template-columns:1fr 1fr;
		gap:16px;
	}
}

#poll-baby .pb-panel{
	border:1px solid var(--pb-line);
	border-radius:var(--pb-r2);
	background:var(--pb-panel2);
	padding:14px;
	display:flex;
	flex-direction:column;
	gap:12px;
}

#poll-baby .pb-field{
	display:flex;
	flex-direction:column;
	gap:7px;
}

#poll-baby .pb-label{
	font-size:14px;
	color:var(--pb-muted);
}

#poll-baby .pb-input{
	width:100%;
	padding:12px 12px;
	border-radius:12px;
	border:1px solid var(--pb-line);
	background:var(--pb-field);
	color:var(--pb-text);
	outline:none;
	transition:border-color .15s ease, box-shadow .15s ease;
}

#poll-baby .pb-input:focus{
	border-color:rgba(255,114,182,.62);
	box-shadow:0 0 0 4px var(--pb-ring);
}

#poll-baby .pb-input::placeholder{
	color:var(--pb-muted);
	opacity:.85;
}

#poll-baby .pb-radioRow{
	display:flex;
	gap:10px;
	flex-wrap:wrap;
}

#poll-baby .pb-radio{
	display:flex;
	align-items:center;
	gap:10px;
	padding:10px 12px;
	border:1px solid var(--pb-line);
	border-radius:12px;
	background:var(--pb-field);
	cursor:pointer;
	user-select:none;
	transition:transform .08s ease, box-shadow .15s ease, border-color .15s ease;
}

#poll-baby .pb-radio:hover{
	transform:translateY(-1px);
}

#poll-baby .pb-radioInput{
	transform:translateY(1px);
	accent-color:var(--pb-accent);
}

#poll-baby .pb-radio:has(.pb-radioInput:focus-visible){
	border-color:rgba(255,114,182,.62);
	box-shadow:0 0 0 4px var(--pb-ring);
}

#poll-baby .pb-actions{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	margin-top:8px;
}

#poll-baby .pb-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	height:42px;
	padding:0 16px;
	border-radius:12px;
	text-decoration:none;
	font-weight:900;
	letter-spacing:.1px;
	border:1px solid var(--pb-line);
	background:var(--pb-panel);
	color:var(--pb-text);
	cursor:pointer;
	transition:transform .08s ease, box-shadow .15s ease, border-color .15s ease, background-color .15s ease;
}

#poll-baby .pb-btn:hover{
	transform:translateY(-1px);
}

#poll-baby .pb-btn--primary{
	border-color:rgba(255,114,182,.55);
	background:linear-gradient(90deg, rgba(255,114,182,.22), rgba(111,214,255,.18));
}

#poll-baby .pb-btn--primary:hover{
	border-color:rgba(255,114,182,.72);
	background:linear-gradient(90deg, rgba(255,114,182,.28), rgba(111,214,255,.22));
	box-shadow:0 0 0 4px var(--pb-ring);
}

#poll-baby .pb-btn:focus-visible{
	outline:none;
	box-shadow:0 0 0 4px var(--pb-ring);
}

#poll-baby .pb-footnote{
	margin:14px 0 0;
	color:var(--pb-muted);
	line-height:1.5;
}

html,body{
	min-height:100%;
}

#poll-baby{
	min-height:100vh;
}

#poll-baby .pb-radio:has(.pb-radioInput[value="boy"]:checked){
	border-color:var(--pb-accentB);
	background:linear-gradient(
		180deg,
		rgba(111,214,255,.18),
		var(--pb-field)
	);
	box-shadow:0 0 0 4px rgba(111,214,255,.22);
}

#poll-baby .pb-radio:has(.pb-radioInput[value="girl"]:checked){
	border-color:var(--pb-accent);
	background:linear-gradient(
		180deg,
		rgba(255,114,182,.20),
		var(--pb-field)
	);
	box-shadow:0 0 0 4px rgba(255,114,182,.24);
}

#poll-baby .pb-radioInput[value="boy"]{
	accent-color:var(--pb-accentB);
}

#poll-baby .pb-radioInput[value="girl"]{
	accent-color:var(--pb-accent);
}