/* ═══════════════════════════════════════════════
   NightPulse Login Theme
   Palette: deep black + electric purple + hot pink neon
   Font: Orbitron (display) + Outfit (body)
═══════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600;700;900&family=Outfit:wght@300;400;500;600;700&display=swap');

:root {
	--np-bg:       #060610;
	--np-bg2:      #0d0d1f;
	--np-purple:   #a855f7;
	--np-pink:     #ec4899;
	--np-cyan:     #22d3ee;
	--np-white:    #f0f0ff;
	--np-muted:    rgba(240,240,255,0.45);
	--np-border:   rgba(168,85,247,0.2);
	--np-glass:    rgba(255,255,255,0.04);
	--np-glass2:   rgba(255,255,255,0.07);
	--np-card-bg:  rgba(13,13,31,0.85);
	--np-radius:   18px;
	--np-grad:     linear-gradient(135deg, var(--np-purple), var(--np-pink));
}

/* ── Reset ── */
#login_wrap.np-wrap * { box-sizing: border-box; margin: 0; padding: 0; }

/* ── Wrap ── */
#login_wrap.np-wrap {
	width: 100% !important;
	min-height: 100vh !important;
	position: relative !important;
	overflow: hidden !important;
	background: var(--np-bg) !important;
	font-family: 'Outfit', sans-serif !important;
	color: var(--np-white) !important;
}

/* ── Background ── */
.np-bg {
	position: fixed !important;
	inset: 0 !important;
	pointer-events: none !important;
	overflow: hidden !important;
	z-index: 0 !important;
}

.np-orb {
	position: absolute !important;
	border-radius: 50% !important;
	filter: blur(100px) !important;
	animation: npPulse 10s ease-in-out infinite !important;
}
.np-orb-1 {
	width: 500px !important; height: 500px !important;
	top: -150px !important; left: -100px !important;
	background: radial-gradient(circle, rgba(168,85,247,0.35) 0%, transparent 70%) !important;
	animation-delay: 0s !important;
}
.np-orb-2 {
	width: 400px !important; height: 400px !important;
	bottom: -100px !important; right: -80px !important;
	background: radial-gradient(circle, rgba(236,72,153,0.3) 0%, transparent 70%) !important;
	animation-delay: 4s !important;
}
.np-orb-3 {
	width: 300px !important; height: 300px !important;
	top: 40% !important; right: 20% !important;
	background: radial-gradient(circle, rgba(34,211,238,0.18) 0%, transparent 70%) !important;
	animation-delay: 7s !important;
}
@keyframes npPulse {
	0%,100% { transform: scale(1); opacity: 0.7; }
	50%      { transform: scale(1.15); opacity: 1; }
}

#np-particles {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
}

.np-scanline {
	position: absolute !important;
	inset: 0 !important;
	background: repeating-linear-gradient(
		0deg,
		transparent,
		transparent 3px,
		rgba(168,85,247,0.015) 3px,
		rgba(168,85,247,0.015) 4px
	) !important;
	pointer-events: none !important;
}

/* ── Floating icons ── */
.np-float {
	position: absolute !important;
	width: 52px !important; height: 52px !important;
	display: flex !important;
	align-items: center !important; justify-content: center !important;
	border-radius: 16px !important;
	border: 1px solid var(--np-border) !important;
	background: var(--np-glass) !important;
	backdrop-filter: blur(12px) !important;
	color: var(--np-purple) !important;
	font-size: 20px !important;
	z-index: 1 !important;
	animation: npDrift 14s ease-in-out infinite !important;
}
.np-float-1 { top: 12% !important; left: 5% !important; animation-delay: 0s !important; color: var(--np-purple) !important; }
.np-float-2 { top: 70% !important; left: 3% !important; animation-delay: 3s !important; color: var(--np-pink) !important; }
.np-float-3 { top: 20% !important; right: 4% !important; animation-delay: 6s !important; color: var(--np-cyan) !important; }
.np-float-4 { top: 55% !important; right: 6% !important; animation-delay: 9s !important; color: var(--np-purple) !important; }
.np-float-5 { top: 85% !important; right: 14% !important; animation-delay: 2s !important; color: var(--np-pink) !important; }
@keyframes npDrift {
	0%,100% { transform: translateY(0) rotate(0deg); }
	33%      { transform: translateY(-18px) rotate(6deg); }
	66%      { transform: translateY(10px) rotate(-4deg); }
}

/* ── Shell ── */
.np-shell {
	position: relative !important;
	z-index: 2 !important;
	max-width: 1300px !important;
	margin: 0 auto !important;
	padding: 0 24px 40px !important;
}

/* ── Topbar ── */
.np-topbar {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	padding: 20px 0 !important;
}
.np-brand {
	display: flex !important;
	align-items: center !important;
	gap: 14px !important;
}
.np-logo-ring {
	width: 44px !important; height: 44px !important;
	border-radius: 14px !important;
	background: var(--np-grad) !important;
	display: flex !important; align-items: center !important; justify-content: center !important;
	font-size: 18px !important;
	color: #fff !important;
	box-shadow: 0 0 20px rgba(168,85,247,0.5) !important;
}
.np-brand-text { display: flex !important; flex-direction: column !important; }
.np-brand-tag { font-family: 'Orbitron', sans-serif !important; font-size: 9px !important; letter-spacing: 3px !important; color: var(--np-purple) !important; font-weight: 600 !important; }
.np-brand-text strong { font-size: 15px !important; font-weight: 700 !important; color: var(--np-white) !important; }

.np-topbar-right { display: flex !important; align-items: center !important; gap: 12px !important; }
.np-safe-pill {
	display: flex !important; align-items: center !important; gap: 6px !important;
	padding: 6px 14px !important; border-radius: 20px !important;
	border: 1px solid var(--np-border) !important;
	background: var(--np-glass) !important;
	font-size: 12px !important; color: var(--np-muted) !important;
}
.np-lang-btn {
	display: flex !important; align-items: center !important; gap: 6px !important;
	padding: 7px 12px !important; border-radius: 12px !important;
	border: 1px solid var(--np-border) !important;
	background: var(--np-glass) !important;
	cursor: pointer !important;
}
.np-lang-btn img { width: 20px !important; border-radius: 3px !important; }
.np-lang-btn i { font-size: 10px !important; color: var(--np-muted) !important; }

/* ── Main layout ── */
.np-main {
	display: flex !important;
	gap: 40px !important;
	align-items: flex-start !important;
	padding: 40px 0 !important;
	width: 100% !important;
	min-height: calc(100vh - 90px) !important;
}

/* ── Left hero ── */
.np-left { flex: 1 !important; min-width: 0 !important; max-width: none !important; }
.np-hero-badge {
	display: inline-flex !important; align-items: center !important; gap: 8px !important;
	padding: 6px 16px !important; border-radius: 20px !important;
	border: 1px solid rgba(168,85,247,0.4) !important;
	background: rgba(168,85,247,0.1) !important;
	font-family: 'Orbitron', sans-serif !important;
	font-size: 10px !important; letter-spacing: 3px !important;
	color: var(--np-purple) !important; margin-bottom: 20px !important;
}
.np-badge-dot {
	width: 8px !important; height: 8px !important; border-radius: 50% !important;
	background: var(--np-purple) !important;
	box-shadow: 0 0 8px var(--np-purple) !important;
	animation: npBlink 1.5s ease-in-out infinite !important;
}
@keyframes npBlink { 0%,100%{opacity:1} 50%{opacity:0.3} }

.np-hero-title {
	font-family: 'Orbitron', sans-serif !important;
	font-size: clamp(28px, 4vw, 46px) !important;
	font-weight: 900 !important;
	line-height: 1.15 !important;
	background: linear-gradient(135deg, #fff 30%, var(--np-purple) 70%, var(--np-pink) 100%) !important;
	-webkit-background-clip: text !important;
	-webkit-text-fill-color: transparent !important;
	background-clip: text !important;
	margin-bottom: 16px !important;
}
.np-hero-sub {
	font-size: 15px !important; color: var(--np-muted) !important;
	line-height: 1.7 !important; margin-bottom: 36px !important;
	max-width: 400px !important;
}

.np-features { display: flex !important; flex-direction: column !important; gap: 18px !important; margin-bottom: 36px !important; }
.np-feat {
	display: flex !important; align-items: center !important; gap: 16px !important;
	padding: 16px 20px !important; border-radius: 14px !important;
	border: 1px solid var(--np-border) !important;
	background: var(--np-glass) !important;
	backdrop-filter: blur(10px) !important;
	transition: border-color 0.25s, background 0.25s !important;
}
.np-feat:hover { border-color: rgba(168,85,247,0.45) !important; background: var(--np-glass2) !important; }
.np-feat-icon {
	width: 42px !important; height: 42px !important; border-radius: 12px !important;
	background: var(--np-grad) !important;
	display: flex !important; align-items: center !important; justify-content: center !important;
	font-size: 17px !important; color: #fff !important; flex-shrink: 0 !important;
	box-shadow: 0 0 14px rgba(168,85,247,0.3) !important;
}
.np-feat-text { display: flex !important; flex-direction: column !important; gap: 3px !important; }
.np-feat-text strong { font-size: 14px !important; font-weight: 600 !important; color: var(--np-white) !important; }
.np-feat-text span { font-size: 12px !important; color: var(--np-muted) !important; }

.np-counters {
	display: flex !important; align-items: center !important; gap: 0 !important;
	padding: 20px 24px !important; border-radius: 16px !important;
	border: 1px solid var(--np-border) !important;
	background: var(--np-glass) !important;
	backdrop-filter: blur(10px) !important;
}
.np-counter { flex: 1 !important; text-align: center !important; }
.np-counter-val {
	display: block !important;
	font-family: 'Orbitron', sans-serif !important;
	font-size: 22px !important; font-weight: 700 !important;
	color: var(--np-purple) !important;
	text-shadow: 0 0 12px rgba(168,85,247,0.6) !important;
}
.np-counter-lbl { font-size: 11px !important; color: var(--np-muted) !important; text-transform: uppercase !important; letter-spacing: 1.5px !important; }
.np-counter-div { width: 1px !important; height: 40px !important; background: var(--np-border) !important; }

/* ── Right / Card ── */
.np-right { flex: 0 0 420px !important; }
.np-card {
	position: relative !important;
	border-radius: var(--np-radius) !important;
	border: 1px solid var(--np-border) !important;
	background: var(--np-card-bg) !important;
	backdrop-filter: blur(30px) !important;
	overflow: hidden !important;
	padding: 32px 28px !important;
}
.np-card-glow {
	position: absolute !important; top: -1px !important; left: 10% !important; right: 10% !important;
	height: 2px !important;
	background: var(--np-grad) !important;
	filter: blur(4px) !important;
}

.np-card-head { text-align: center !important; margin-bottom: 20px !important; }
.np-logo-wrap {
	width: 110px !important; height: 72px !important; border-radius: 14px !important;
	margin: 0 auto 14px !important;
	border: 2px solid var(--np-border) !important;
	overflow: hidden !important;
	background: var(--np-bg2) !important;
	display: flex !important; align-items: center !important; justify-content: center !important;
}
.np-logo-wrap img { width: 100% !important; height: 100% !important; object-fit: contain !important; padding: 4px !important; }
.np-welcome h2 {
	font-family: 'Orbitron', sans-serif !important;
	font-size: 18px !important; font-weight: 700 !important;
	background: var(--np-grad) !important;
	-webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important;
	background-clip: text !important;
	margin-bottom: 4px !important;
}
.np-welcome p { font-size: 12px !important; color: var(--np-muted) !important; }

.np-pills { display: flex !important; justify-content: center !important; gap: 8px !important; margin-bottom: 20px !important; }
.np-pill {
	display: flex !important; align-items: center !important; gap: 5px !important;
	padding: 5px 12px !important; border-radius: 20px !important;
	border: 1px solid var(--np-border) !important;
	background: var(--np-glass) !important;
	font-size: 11px !important; color: var(--np-muted) !important;
}
.np-pill i { font-size: 10px !important; color: var(--np-purple) !important; }

/* ── Tabs ── */
.np-tabs { margin-bottom: 20px !important; }
.np-tab-list {
	display: flex !important; gap: 4px !important;
	background: rgba(0,0,0,0.3) !important;
	border-radius: 12px !important; padding: 4px !important;
	list-style: none !important;
}
.np-tab {
	flex: 1 !important; display: flex !important; align-items: center !important; justify-content: center !important;
	gap: 6px !important; padding: 9px 8px !important; border-radius: 9px !important;
	cursor: pointer !important; font-size: 12px !important; font-weight: 500 !important;
	color: var(--np-muted) !important;
	transition: all 0.2s !important;
}
.np-tab.active {
	background: var(--np-grad) !important;
	color: #fff !important;
	box-shadow: 0 2px 12px rgba(168,85,247,0.4) !important;
}
.np-tab i { font-size: 12px !important; }

/* ── Panels ── */
.np-panels { position: relative !important; }
.np-panel { display: none !important; }
.np-panel.active { display: block !important; animation: npFadeUp 0.3s ease !important; }
@keyframes npFadeUp { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }

/* ── Form ── */
.np-form { display: flex !important; flex-direction: column !important; gap: 12px !important; }
.np-field {
	display: flex !important; align-items: center !important;
	border-radius: 12px !important;
	border: 1px solid var(--np-border) !important;
	background: rgba(0,0,0,0.3) !important;
	overflow: hidden !important;
	transition: border-color 0.2s, box-shadow 0.2s !important;
}
.np-field:focus-within {
	border-color: var(--np-purple) !important;
	box-shadow: 0 0 0 3px rgba(168,85,247,0.15) !important;
}
.np-field i { padding: 0 14px !important; color: var(--np-purple) !important; font-size: 14px !important; flex-shrink: 0 !important; }
.np-input, .np-select {
	flex: 1 !important; padding: 13px 14px 13px 0 !important;
	background: transparent !important; border: none !important; outline: none !important;
	font-size: 13px !important; color: var(--np-white) !important;
	font-family: 'Outfit', sans-serif !important;
}
.np-input::placeholder { color: var(--np-muted) !important; }
.np-select { color: var(--np-muted) !important; }
.np-select option { background: var(--np-bg2) !important; }

.np-row { display: flex !important; gap: 10px !important; }
.np-field.half { flex: 1 !important; }

.np-date-block { display: flex !important; flex-direction: column !important; gap: 8px !important; }
.np-date-label { font-size: 11px !important; color: var(--np-muted) !important; text-transform: uppercase !important; letter-spacing: 1px !important; }
.np-date-row { display: flex !important; gap: 8px !important; }
.np-date-col { flex: 1 !important; }
.np-date-col .np-select {
	width: 100% !important; padding: 13px 14px !important;
	border-radius: 12px !important;
	border: 1px solid var(--np-border) !important;
	background: rgba(0,0,0,0.3) !important;
	color: var(--np-white) !important;
	font-size: 13px !important; font-family: 'Outfit', sans-serif !important;
	outline: none !important; cursor: pointer !important;
	transition: border-color 0.2s, box-shadow 0.2s !important;
	appearance: auto !important;
}
.np-date-col .np-select:focus {
	border-color: var(--np-purple) !important;
	box-shadow: 0 0 0 3px rgba(168,85,247,0.15) !important;
}
.np-date-col .np-select option { background: var(--np-bg2) !important; }

.np-btn {
	display: flex !important; align-items: center !important; justify-content: center !important;
	gap: 8px !important; padding: 14px !important; border-radius: 12px !important;
	border: none !important; cursor: pointer !important;
	background: var(--np-grad) !important;
	color: #fff !important; font-size: 14px !important; font-weight: 600 !important;
	font-family: 'Outfit', sans-serif !important;
	box-shadow: 0 4px 20px rgba(168,85,247,0.4) !important;
	transition: all 0.2s !important;
	width: 100% !important;
}
.np-btn:hover { transform: translateY(-2px) !important; box-shadow: 0 6px 28px rgba(168,85,247,0.6) !important; }
.np-btn-guest { background: linear-gradient(135deg, #ec4899, #f97316) !important; box-shadow: 0 4px 20px rgba(236,72,153,0.4) !important; }
.np-btn-reg   { background: linear-gradient(135deg, #22d3ee, #3b82f6) !important; box-shadow: 0 4px 20px rgba(34,211,238,0.4) !important; }

.np-link { font-size: 12px !important; color: var(--np-purple) !important; cursor: pointer !important; text-align: center !important; text-decoration: underline !important; }
.np-terms { font-size: 11px !important; color: var(--np-muted) !important; text-align: center !important; }
.np-recaptcha { display: flex !important; justify-content: center !important; }

.np-bridge-msg {
	display: flex !important; flex-direction: column !important; align-items: center !important;
	gap: 10px !important; padding: 20px !important; border-radius: 12px !important;
	border: 1px solid var(--np-border) !important; background: var(--np-glass) !important;
	text-align: center !important;
}
.np-bridge-msg i { font-size: 28px !important; color: var(--np-purple) !important; }
.np-bridge-msg p { font-size: 13px !important; color: var(--np-muted) !important; }

/* ── Bottom zone ── */
.np-bottom {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: 24px !important;
	margin-top: 40px !important;
}
.np-zone-title {
	display: flex !important; align-items: center !important; gap: 8px !important;
	font-family: 'Orbitron', sans-serif !important;
	font-size: 10px !important; letter-spacing: 2.5px !important;
	color: var(--np-purple) !important; font-weight: 600 !important;
	text-transform: uppercase !important;
	margin-bottom: 16px !important;
}
.np-pulse-dot {
	width: 8px !important; height: 8px !important; border-radius: 50% !important;
	background: var(--np-pink) !important;
	box-shadow: 0 0 8px var(--np-pink) !important;
	animation: npBlink 1.5s ease-in-out infinite !important;
}
.np-active-zone, .np-radio-zone {
	padding: 24px !important; border-radius: 16px !important;
	border: 1px solid var(--np-border) !important;
	background: var(--np-glass) !important;
	backdrop-filter: blur(10px) !important;
}
.np-active-list { display: flex !important; flex-wrap: wrap !important; gap: 4px !important; }
.np-active-list .active_item { display: inline-block !important; }
.np-active-list .active_item img,
.np-active-list .active_avatar { width: 70px !important; height: 70px !important; border-radius: 50% !important; border: 2px solid var(--np-border) !important; object-fit: cover !important; display: block !important; }
.np-active-list .active_item a { display: block !important; line-height: 0 !important; }
.np-active-list .active_item span,
.np-active-list .active_item p,
.np-active-list .active_item b,
.np-active-list .active_item strong,
.np-active-list .active_item .active_name { display: none !important; }

/* ── Radio ── */
.np-radio { display: flex !important; flex-direction: column !important; gap: 14px !important; }
.np-radio-head {
	display: flex !important; align-items: center !important; gap: 12px !important;
	padding: 14px !important; border-radius: 12px !important;
	background: rgba(0,0,0,0.3) !important; border: 1px solid var(--np-border) !important;
}
.np-radio-disc {
	width: 44px !important; height: 44px !important; border-radius: 50% !important;
	background: var(--np-grad) !important;
	display: flex !important; align-items: center !important; justify-content: center !important;
	font-size: 16px !important; color: #fff !important; flex-shrink: 0 !important;
	transition: transform 0.3s !important;
}
.np-radio-disc.spinning { animation: npSpin 3s linear infinite !important; }
@keyframes npSpin { to { transform: rotate(360deg); } }
.np-radio-info { flex: 1 !important; }
.np-radio-info strong { display: block !important; font-size: 13px !important; font-weight: 600 !important; color: var(--np-white) !important; }
.np-radio-info span  { font-size: 11px !important; color: var(--np-muted) !important; }
.np-eq { display: flex !important; align-items: flex-end !important; gap: 2px !important; height: 20px !important; }
.np-eq span {
	display: block !important; width: 3px !important; border-radius: 2px !important;
	background: var(--np-purple) !important;
	animation: npEq 0.8s ease-in-out infinite alternate !important;
}
.np-eq span:nth-child(1){height:30%;animation-delay:0s}
.np-eq span:nth-child(2){height:80%;animation-delay:0.15s}
.np-eq span:nth-child(3){height:50%;animation-delay:0.3s}
.np-eq span:nth-child(4){height:90%;animation-delay:0.45s}
@keyframes npEq { to{height:100%} }

.np-stations {
	display: flex !important; flex-wrap: wrap !important; gap: 6px !important;
}
.np-station-btn {
	display: flex !important; align-items: center !important; gap: 6px !important;
	padding: 6px 12px !important; border-radius: 20px !important;
	border: 1px solid var(--np-border) !important;
	background: transparent !important; color: var(--np-muted) !important;
	font-size: 11px !important; cursor: pointer !important;
	font-family: 'Outfit', sans-serif !important;
	transition: all 0.2s !important;
}
.np-station-btn.active, .np-station-btn:hover {
	background: var(--np-grad) !important; color: #fff !important;
	border-color: transparent !important;
}
.np-radio-empty { font-size: 12px !important; color: var(--np-muted) !important; text-align: center !important; padding: 12px 0 !important; }
.np-radio-ctrl { display: flex !important; justify-content: center !important; gap: 10px !important; }
.np-ctrl-btn {
	width: 40px !important; height: 40px !important; border-radius: 50% !important;
	border: 1px solid var(--np-border) !important;
	background: var(--np-glass) !important; color: var(--np-muted) !important;
	font-size: 14px !important; cursor: pointer !important;
	display: flex !important; align-items: center !important; justify-content: center !important;
	transition: all 0.2s !important;
}
.np-ctrl-play { background: var(--np-grad) !important; border-color: transparent !important; color: #fff !important; box-shadow: 0 0 14px rgba(168,85,247,0.4) !important; }
.np-ctrl-btn:hover { border-color: var(--np-purple) !important; color: var(--np-purple) !important; }

/* ── Footer ── */
.np-footer {
	margin-top: 40px !important;
	border-top: 1px solid var(--np-border) !important;
	padding-top: 24px !important;
}
.np-footer-inner {
	display: flex !important; align-items: center !important; justify-content: space-between !important;
	flex-wrap: wrap !important; gap: 16px !important;
	font-size: 12px !important; color: var(--np-muted) !important;
}
.np-footer-links { display: flex !important; gap: 20px !important; flex-wrap: wrap !important; }
.np-footer-links a {
	display: flex !important; align-items: center !important; gap: 5px !important;
	font-size: 12px !important; color: var(--np-muted) !important;
	text-decoration: none !important;
	transition: color 0.2s !important;
}
.np-footer-links a:hover { color: var(--np-purple) !important; }

/* ── Cookie ── */
.np-cookie {
	position: fixed !important; bottom: 20px !important; left: 50% !important;
	transform: translateX(-50%) !important;
	width: 90% !important; max-width: 600px !important;
	border-radius: 14px !important;
	border: 1px solid var(--np-border) !important;
	background: var(--np-card-bg) !important;
	backdrop-filter: blur(20px) !important;
	z-index: 9999 !important;
	padding: 16px 20px !important;
}
.np-cookie-inner { display: flex !important; align-items: center !important; gap: 14px !important; }
.np-cookie-inner > i { font-size: 22px !important; color: var(--np-purple) !important; flex-shrink: 0 !important; }
.np-cookie-inner .cookie_text { flex: 1 !important; }
.np-cookie-inner .cookie-title { font-size: 13px !important; font-weight: 600 !important; margin-bottom: 3px !important; }
.np-cookie-inner .cookie-desc { font-size: 11px !important; color: var(--np-muted) !important; }
.np-btn-cookie {
	padding: 8px 20px !important; border-radius: 20px !important; border: none !important;
	background: var(--np-grad) !important; color: #fff !important;
	font-size: 12px !important; font-weight: 600 !important; cursor: pointer !important;
	font-family: 'Outfit', sans-serif !important; flex-shrink: 0 !important;
}

/* ── Responsive ── */
@media (max-width: 900px) {
	.np-main { flex-direction: column !important; gap: 30px !important; }
	.np-left { max-width: 100% !important; }
	.np-right { flex: none !important; width: 100% !important; }
	.np-bottom { grid-template-columns: 1fr !important; }
	.np-float { display: none !important; }
}
@media (max-width: 480px) {
	.np-card { padding: 24px 18px !important; }
	.np-counters { padding: 16px !important; }
	.np-counter-val { font-size: 18px !important; }
	.np-hero-title { font-size: 26px !important; }
}


/* Chat v11+ form compatibility. Theme-specific input/button classes are retained. */
.boom-v11-box { width: 100%; }
.boom-v11-field { margin-bottom: 14px; }
.boom-v11-box input,
.boom-v11-box select { width: 100%; max-width: 100%; box-sizing: border-box; }
.boom-v11-box button { width: 100%; }
.boom-v11-birth { margin-bottom: 14px; }
.boom-v11-label { margin: 0 0 8px; }
.boom-v11-date { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.boom-v11-recaptcha { margin: 14px 0; }
.boom-v11-terms { margin: 10px 0 0; text-align: center; }
@media (max-width: 420px) {
  .boom-v11-date { gap: 5px; }
}
