:root, .kwd-app {
	--kwd-pink-50: #FBEAF0;
	--kwd-pink-100: #F4C0D1;
	--kwd-pink-600: #D6336C;
	--kwd-pink-800: #72243E;
	--kwd-pink-900: #4B1528;
	--kwd-teal-50: #E1F5EE;
	--kwd-teal-100: #9FE1CB;
	--kwd-teal-800: #085041;
	--kwd-teal-900: #04342C;
	--kwd-amber-50: #FAEEDA;
	--kwd-amber-600: #BA7517;
	--kwd-gray-50: #F1EFE8;
	--kwd-gray-200: #B4B2A9;
	--kwd-gray-600: #5F5E5A;
	--kwd-gray-900: #2C2C2A;
	--kwd-love-pink: #F0508A;
	--kwd-love-pink-dark: #C2255C;
	--kwd-paper: #FFFDFB;
}
.kwd-app {
	max-width: 480px;
	margin: 0 auto;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	color: var(--kwd-gray-900);
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

html { background: #fff; }
#wpadminbar { display: none !important; }
html { margin-top: 0 !important; }

.kwd-app button, .kwd-app a { -webkit-tap-highlight-color: transparent; }

.kwd-header { display: flex; align-items: center; justify-content: space-between; padding: 14px 4px; }
.kwd-brand { font-weight: 600; font-size: 18px; display: flex; align-items: center; gap: 6px; }
.kwd-heart { color: var(--kwd-pink-600); }
.kwd-brand-logo { height: 26px; width: auto; display: block; object-fit: contain; }
.kwd-plan-badge { font-size: 12px; padding: 4px 12px; border-radius: 20px; font-weight: 600; }
.kwd-plan-free { background: var(--kwd-gray-50); color: var(--kwd-gray-600); }
.kwd-plan-premium { background: var(--kwd-teal-100); color: var(--kwd-teal-900); }

.kwd-panel { display: none; padding: 4px 4px 24px; }
.kwd-panel.active { display: block; }

/* top sub-nav: "For You" / "People You Like" inside Discover (separate from the bottom nav) */
.kwd-subnav { display: flex; gap: 4px; background: var(--kwd-gray-50); border-radius: 30px; padding: 4px; margin: 4px 0 16px; }
.kwd-subtab { flex: 1; background: none; border: none; border-radius: 26px; padding: 10px 4px; font-size: 13px; font-weight: 600; color: var(--kwd-gray-600); cursor: pointer; -webkit-tap-highlight-color: transparent; -webkit-appearance: none; appearance: none; outline: none; transition: background-color .15s ease, color .15s ease; }
.kwd-subtab.active { background: var(--kwd-pink-600); color: #fff; }
.kwd-subtab:focus-visible { box-shadow: inset 0 0 0 2px var(--kwd-pink-100); }

.kwd-subpanel { display: none; }
.kwd-subpanel.active { display: block; }


/* bottom app navigation */
.kwd-bottom-nav { position: fixed; left: 50%; bottom: 0; transform: translateX(-50%); width: 100%; max-width: 480px; display: flex; background: #fff; border-top: 1px solid var(--kwd-gray-50); box-shadow: 0 -2px 10px rgba(0,0,0,0.05); z-index: 500; padding-bottom: env(safe-area-inset-bottom, 0); }
.kwd-tab { flex: 1; background: none; border: none; padding: 9px 4px 8px; font-size: 11px; font-weight: 600; color: var(--kwd-gray-600); cursor: pointer; -webkit-tap-highlight-color: transparent; -webkit-appearance: none; appearance: none; outline: none; display: flex; flex-direction: column; align-items: center; gap: 3px; transition: color .15s ease; }
.kwd-tab svg { width: 22px; height: 22px; }
.kwd-tab.active { color: var(--kwd-pink-600); }
.kwd-tab:focus,
.kwd-tab:active,
.kwd-tab:hover,
.kwd-tab.active:focus,
.kwd-tab.active:active,
.kwd-tab.active:hover { background: none !important; background-color: transparent !important; }
.kwd-tab:focus-visible { box-shadow: inset 0 0 0 2px var(--kwd-pink-100); border-radius: 8px; }
.kwd-app { padding-bottom: 78px; }

.kwd-card { background: #fff; border: 1px solid var(--kwd-gray-50); border-radius: 16px; overflow: hidden; margin-bottom: 16px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.kwd-card-photo { width: 100%; aspect-ratio: 4 / 5; background-size: cover; background-position: center; background-color: var(--kwd-pink-50); }
.kwd-card-body { padding: 14px 16px; }
.kwd-card-name { font-size: 17px; font-weight: 600; margin: 0 0 2px; }
.kwd-card-meta { font-size: 13px; color: var(--kwd-gray-600); margin: 0 0 8px; }
.kwd-card-bio { font-size: 14px; line-height: 1.5; margin: 0 0 14px; color: var(--kwd-gray-900); }
.kwd-card-actions { display: flex; gap: 12px; }

.kwd-round-btn { width: 52px; height: 52px; border-radius: 50%; border: 1.5px solid var(--kwd-gray-200); background: #fff; font-size: 20px; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.kwd-round-btn.kwd-pass { color: var(--kwd-gray-600); }
.kwd-round-btn.kwd-like { color: var(--kwd-pink-600); border-color: var(--kwd-pink-100); margin-left: auto; }
.kwd-round-btn:active { transform: scale(0.94); }

.kwd-feed-status { text-align: center; font-size: 13px; color: var(--kwd-gray-600); padding: 24px 12px; }

.kwd-admirer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.kwd-likes-heading { font-size: 14px; font-weight: 700; color: var(--kwd-gray-900); margin: 0 0 12px; }
.kwd-admirer { border: 0; padding: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; display: block; width: 100%; height: 100%; }
.kwd-admirer:active { transform: scale(0.97); }
.kwd-admirer-scrim { position: absolute; inset: auto 0 0 0; height: 55%; background: linear-gradient(to top, rgba(0,0,0,.72), rgba(0,0,0,0)); }
.kwd-admirer-name { position: absolute; left: 8px; right: 8px; bottom: 6px; color: #fff; font-size: 12px; font-weight: 700; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kwd-admirer { position: relative; border-radius: 12px; overflow: hidden; aspect-ratio: 1; background: var(--kwd-pink-50); }
.kwd-admirer img { width: 100%; height: 100%; object-fit: cover; }
.kwd-admirer.kwd-locked img { filter: blur(6px); }
.kwd-lock-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 18px; color: var(--kwd-gray-900); }

.kwd-upsell { background: var(--kwd-pink-50); border-radius: 14px; padding: 14px 16px; margin-top: 16px; text-align: center; }
.kwd-upsell p { margin: 0 0 10px; font-size: 14px; font-weight: 600; color: var(--kwd-pink-800); }

.kwd-btn { display: inline-block; text-decoration: none; text-align: center; border-radius: 24px; padding: 12px 20px; font-size: 14px; font-weight: 600; border: none; cursor: pointer; }
.kwd-btn-primary { background: #D4537E; background: var(--kwd-pink-600); color: #fff; width: 100%; }
.kwd-btn-secondary { background: #fff; color: #2C2C2A; color: var(--kwd-gray-900); border: 1.5px solid #B4B2A9; border: 1.5px solid var(--kwd-gray-200); width: 100%; margin-top: 10px; box-sizing: border-box; }
.kwd-btn-ghost { background: none; border: 1.5px solid #F4C0D1; border: 1.5px solid var(--kwd-pink-100); color: #D4537E; color: var(--kwd-pink-600); padding: 8px 16px; }
.kwd-whatsapp-btn { background: #25D366; color: #fff; width: 100%; margin-top: 14px; display: flex; align-items: center; justify-content: center; gap: 8px; }
.kwd-whatsapp-icon { display: inline-flex; width: 18px; height: 18px; flex-shrink: 0; }
.kwd-whatsapp-icon svg { width: 18px; height: 18px; display: block; }

.kwd-chat-layout { display: flex; gap: 12px; }
.kwd-matches-list { width: 84px; flex-shrink: 0; display: flex; flex-direction: column; gap: 10px; }
.kwd-match-avatar { width: 56px; height: 56px; border-radius: 50%; background-size: cover; background-position: center; border: 2px solid transparent; cursor: pointer; }
.kwd-match-avatar.active { border-color: var(--kwd-pink-600); }
.kwd-thread { flex: 1; min-height: 320px; display: flex; flex-direction: column; }
.kwd-empty { color: var(--kwd-gray-600); font-size: 14px; text-align: center; margin-top: 40px; }

.kwd-messages { flex: 1; display: flex; flex-direction: column; gap: 8px; padding-bottom: 10px; }
.kwd-msg { max-width: 78%; padding: 8px 12px; border-radius: 14px; font-size: 14px; line-height: 1.4; }
.kwd-msg-them { background: var(--kwd-gray-50); align-self: flex-start; }
.kwd-msg-me { background: var(--kwd-pink-100); color: var(--kwd-pink-900); align-self: flex-end; }
.kwd-msg-time { font-size: 10px; color: var(--kwd-gray-600); margin-top: 2px; }

.kwd-composer {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 6px 7px 8px;
  margin-top: 8px;
  background: #f0f2f5;
  border-radius: 24px;
  border: 1px solid #e4e7ea;
  box-sizing: border-box;
}
.kwd-composer input {
  flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  border-radius: 20px;
  padding: 9px 8px;
  font-size: 15px;
  line-height: 22px;
  color: var(--kwd-gray-900);
  box-shadow: none;
}
.kwd-composer input::placeholder { color: #667781; opacity: 1; }
.kwd-composer button {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--kwd-pink-600);
  color: #fff;
  border: 0;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 2px 5px rgba(0,0,0,.14);
  -webkit-tap-highlight-color: transparent;
  transition: transform .12s ease, background .12s ease, box-shadow .12s ease;
}
.kwd-composer button svg {
  width: 20px;
  height: 20px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
  transform: translate(-1px, 1px);
}
.kwd-composer button:hover { background: var(--kwd-pink-800); box-shadow: 0 3px 7px rgba(0,0,0,.18); }
.kwd-composer button:active { transform: scale(.94); }
.kwd-composer button:focus-visible { outline: 3px solid var(--kwd-pink-100); outline-offset: 2px; }
@media (max-width:480px) {
  .kwd-composer { gap: 7px; padding: 6px 6px 6px 9px; }
  .kwd-composer button { flex-basis: 44px; width: 44px; height: 44px; }
  .kwd-composer input { font-size: 15px; }
}

.kwd-lock-panel { text-align: center; padding: 40px 16px; }
.kwd-lock-panel p { color: var(--kwd-gray-600); font-size: 14px; margin: 10px 0 16px; }

.kwd-locked-panel { text-align: center; padding: 48px 20px 20px; background: #fff; border: 1px solid var(--kwd-gray-50); border-radius: 16px; }
.kwd-locked-icon { color: var(--kwd-pink-600); opacity: .55; margin: 0 auto 14px; width: 40px; height: 40px; }
.kwd-locked-icon svg { width: 40px; height: 40px; }
.kwd-locked-panel p { font-size: 14px; font-weight: 600; color: var(--kwd-gray-900); margin: 0 0 18px; }
.kwd-locked-alt { font-size: 13px; color: var(--kwd-gray-600); margin: 14px 0 0 !important; font-weight: 400 !important; }
.kwd-locked-alt a { color: var(--kwd-pink-600); font-weight: 600; text-decoration: none; }


.kwd-match-toast { position: fixed; top: 20px; left: 50%; transform: translateX(-50%); background: #D4537E; background: var(--kwd-pink-600); color: #fff; padding: 12px 22px; border-radius: 24px; font-size: 14px; font-weight: 600; z-index: 999; box-shadow: 0 4px 14px rgba(0,0,0,0.15); }

.kwd-toast { position: fixed; top: 20px; left: 50%; transform: translateX(-50%) translateY(-12px); max-width: calc(100% - 40px); display: flex; align-items: center; gap: 8px; padding: 13px 20px; border-radius: 24px; font-size: 14px; font-weight: 600; z-index: 1100; box-shadow: 0 6px 18px rgba(0,0,0,0.18); opacity: 0; transition: opacity .18s ease, transform .18s ease; pointer-events: none; }
.kwd-toast.kwd-toast-show { opacity: 1; transform: translateX(-50%) translateY(0); }
.kwd-toast-success { background: #085041; background: var(--kwd-teal-800); color: #fff; }
.kwd-toast-error { background: #D4537E; background: var(--kwd-pink-600); color: #fff; }
.kwd-toast-icon { flex-shrink: 0; width: 18px; height: 18px; display: flex; align-items: center; justify-content: center; }
.kwd-toast-icon svg { width: 18px; height: 18px; }

.kwd-modal-backdrop { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.45); align-items: center; justify-content: center; z-index: 1000; padding: 20px; }
.kwd-modal-backdrop.open { display: flex; }
.kwd-modal { background: #fff; border-radius: 16px; padding: 24px; max-width: 360px; width: 100%; position: relative; max-height: 88vh; overflow-y: auto; box-sizing: border-box; }
.kwd-modal-close { position: absolute; top: 12px; right: 14px; background: none; border: none; font-size: 20px; cursor: pointer; color: var(--kwd-gray-600); -webkit-tap-highlight-color: transparent; z-index: 3; }
.kwd-steps { padding-left: 18px; font-size: 13px; line-height: 1.7; color: var(--kwd-gray-900); }

/* Auth modal: illustrated hero + tabbed log in / sign up, matching the Kapromise brand concept. */
.kwd-auth-modal-inner { padding: 0; max-width: 390px; border-radius: 28px; overflow-y: auto; overflow-x: hidden; background: var(--kwd-paper); -webkit-overflow-scrolling: touch; }
.kwd-auth-modal-inner .kwd-modal-close { top: 14px; right: 16px; width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,.75); display: flex; align-items: center; justify-content: center; line-height: 1; }

.kwd-auth-hero { position: relative; padding: 40px 26px 14px; text-align: center; overflow: hidden; }
.kwd-auth-hero-glow { position: absolute; left: 50%; top: 38%; transform: translate(-50%,-50%); width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle at 42% 38%, var(--kwd-pink-100) 0%, var(--kwd-pink-50) 62%, transparent 78%); z-index: 0; }
.kwd-auth-eyebrow { position: relative; z-index: 2; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--kwd-pink-600); margin: 0 0 16px; }

.kwd-auth-orbit { position: relative; z-index: 1; height: 200px; margin: 0 auto; width: 235px; }
.kwd-auth-avatar { position: absolute; border-radius: 50%; box-shadow: 0 10px 24px -8px rgba(75,21,40,.30), 0 0 0 4px var(--kwd-paper); overflow: hidden; }
.kwd-auth-avatar svg, .kwd-auth-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.kwd-auth-avatar--hero { width: 138px; height: 138px; left: 49px; top: 30px; z-index: 3; box-shadow: 0 16px 30px -10px rgba(75,21,40,.38), 0 0 0 5px var(--kwd-paper); }
.kwd-auth-avatar--a { width: 68px; height: 68px; left: 0; top: 5px; z-index: 2; }
.kwd-auth-avatar--b { width: 64px; height: 64px; right: 0; top: 0; z-index: 2; }
.kwd-auth-avatar--c { width: 61px; height: 61px; left: 2px; bottom: 5px; z-index: 2; }
.kwd-auth-avatar--d { width: 75px; height: 75px; right: -4px; bottom: 12px; z-index: 4; }
.kwd-auth-spark { position: absolute; border-radius: 50%; background: var(--kwd-pink-600); z-index: 2; }
.kwd-auth-spark--1 { width: 8px; height: 8px; left: 110px; top: 0; opacity: .55; }
.kwd-auth-spark--2 { width: 6px; height: 6px; left: 30px; top: 102px; opacity: .4; background: var(--kwd-amber-600); }

.kwd-auth-copy { position: relative; z-index: 2; padding: 4px 4px 0; text-align: left; }
.kwd-auth-copy h2 { font-family: 'Fraunces', Georgia, serif; font-weight: 600; font-size: 25px; line-height: 1.16; letter-spacing: -.01em; margin: 0 0 20px; color: var(--kwd-pink-900); }
.kwd-auth-copy h2 em { font-style: italic; color: var(--kwd-pink-600); }

.kwd-auth-panels { padding: 0 26px 26px; }

.kwd-google-auth-wrap { margin: 0 0 16px; }
.kwd-google-btn-mount { width: 100%; display: flex; justify-content: center; min-height: 44px; }
.kwd-auth-divider { display: flex; align-items: center; gap: 12px; margin: 16px 0 0; color: var(--kwd-gray-600); font-size: 12.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.kwd-auth-divider::before, .kwd-auth-divider::after { content: ''; flex: 1; height: 1px; background: var(--kwd-gray-100); }
.kwd-google-signed-in-note { background: var(--kwd-teal-50, #eef8f6); color: var(--kwd-gray-900); border-radius: 10px; padding: 10px 12px; font-size: 13px; margin: 0 0 16px; }
.kwd-google-signed-in-note strong { font-weight: 700; }
.kwd-onboard-photo-picker span.has-google-photo { border: 3px solid #fff; box-shadow: 0 4px 14px rgba(0,0,0,.14); }


.kwd-auth-toggle { display: flex; gap: 4px; background: var(--kwd-gray-50); border-radius: 16px; padding: 4px; margin: 0 0 18px; }
.kwd-auth-tab { flex: 1; background: none; border: none; border-radius: 12px; padding: 12px 8px; font-size: 14.5px; font-weight: 700; color: var(--kwd-gray-600); cursor: pointer; -webkit-tap-highlight-color: transparent; outline: none; transition: background-color .18s ease, color .18s ease, box-shadow .18s ease; }
.kwd-auth-tab.active { background: #fff; color: var(--kwd-pink-800); box-shadow: 0 4px 10px -4px rgba(75,21,40,.25); }
.kwd-auth-tab:focus-visible { outline: 2px solid var(--kwd-pink-600); outline-offset: 2px; }
/* Deep "love pink" for the login/signup CTAs specifically \u2014 scoped to the
   auth modal so the rest of the app (Boost, Save profile, etc.) keeps the
   original brand pink-600. */
.kwd-auth-modal-inner .kwd-btn-primary { background: linear-gradient(135deg, var(--kwd-love-pink), var(--kwd-love-pink-dark)); box-shadow: 0 10px 22px -8px rgba(177,9,74,.6); border-radius: 14px; padding: 16px; font-size: 15.5px; font-weight: 800; }
.kwd-auth-modal-inner .kwd-field input,
.kwd-auth-modal-inner .kwd-field select,
.kwd-auth-modal-inner .kwd-field textarea { border: 1.5px solid var(--kwd-gray-50); background: var(--kwd-gray-50); border-radius: 13px; padding: 13px 14px; font-size: 15px; }
.kwd-auth-modal-inner .kwd-field select {
	min-height: 50px;
	padding: 14px 36px 14px 14px;
	line-height: 1.4;
}
.kwd-auth-modal-inner .kwd-field input:focus,
.kwd-auth-modal-inner .kwd-field select:focus,
.kwd-auth-modal-inner .kwd-field textarea:focus { border-color: var(--kwd-pink-600); background: #fff; box-shadow: 0 0 0 4px var(--kwd-pink-50); }
.kwd-auth-modal-inner .kwd-field label { font-size: 12.5px; font-weight: 700; }

.kwd-profile-photo-wrap { text-align: center; margin-bottom: 20px; }
.kwd-profile-photo { width: 120px; height: 120px; border-radius: 50%; background: var(--kwd-pink-50) center/cover no-repeat; margin: 0 auto 10px; border: 3px solid #fff; box-shadow: 0 0 0 1px var(--kwd-gray-50); }
.kwd-photo-upload-btn { display: inline-block; font-size: 13px; font-weight: 600; color: var(--kwd-pink-600); border: 1.5px solid var(--kwd-pink-100); border-radius: 20px; padding: 6px 16px; cursor: pointer; }
.kwd-photo-status { font-size: 12px; margin-top: 8px; color: var(--kwd-gray-600); }
.kwd-photo-status.kwd-status-pending { color: var(--kwd-amber-600); }
.kwd-photo-status.kwd-status-approved { color: var(--kwd-teal-800); }
.kwd-photo-status.kwd-status-rejected { color: var(--kwd-pink-600); }

/* Verified badge — premium-only trust mark, scalloped checkmark in brand pink */
.kwd-verified-badge { display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px; margin-left: 3px; vertical-align: -2px; color: #D4537E; color: var(--kwd-pink-600); }
.kwd-verified-badge svg { display: block; width: 100%; height: 100%; }
.kwd-verified-chip { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; color: #D4537E; color: var(--kwd-pink-600); filter: drop-shadow(0 1px 2px rgba(0,0,0,.35)); }
.kwd-verified-chip svg { display: block; width: 100%; height: 100%; }
.kwd-matched-tick { position: absolute; top: 6px; left: 6px; width: 20px; height: 20px; border-radius: 50%; background: #085041; background: var(--kwd-teal-800); color: #fff; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; box-shadow: 0 1px 3px rgba(0,0,0,.3); }

/* Moderation status banner in Discover — makes the review process visible */
.kwd-status-banner { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.4; padding: 10px 12px; border-radius: 12px; margin: 0 0 14px; background: #FAEEDA; background: var(--kwd-amber-50); color: #2C2C2A; color: var(--kwd-gray-900); }
.kwd-status-banner-rejected { background: #FBEAF0; background: var(--kwd-pink-50); }
.kwd-status-banner-incomplete { background: #F1EFE8; background: var(--kwd-gray-50); }

/* Likes nav badge — mirrors the chat unread badge */
.kwd-likes-badge { position: absolute; margin-left: 8px; margin-top: -8px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 10px; background: #D4537E; background: var(--kwd-pink-600); color: #fff; font-size: 10px; line-height: 17px; text-align: center; }

/* Profile completion bar */
.kwd-completion { margin: 0 0 18px; }
.kwd-completion-row { display: flex; justify-content: space-between; align-items: center; font-size: 13px; font-weight: 600; color: var(--kwd-gray-900); margin-bottom: 6px; }
.kwd-completion-row strong { color: var(--kwd-pink-600); }
.kwd-completion-bar { height: 8px; border-radius: 6px; background: var(--kwd-gray-50); overflow: hidden; }
.kwd-completion-bar i { display: block; height: 100%; width: 0%; background: linear-gradient(90deg, var(--kwd-pink-600), var(--kwd-teal-800)); border-radius: 6px; transition: width .3s ease; }
.kwd-completion-hint { font-size: 12px; color: var(--kwd-gray-600); margin: 6px 0 0; }

.kwd-loggedout { padding: 0 4px; }

.kwd-auth-form { display: none; }
.kwd-auth-form.active { display: block; }
.kwd-auth-lead { font-size: 14px; color: var(--kwd-gray-600); margin: 0 0 18px; }
.kwd-auth-status { font-size: 13px; color: var(--kwd-pink-600); min-height: 16px; margin: -4px 0 12px; }
.kwd-auth-switch { text-align: center; font-size: 13px; color: var(--kwd-gray-600); margin: 14px 0 0; }
.kwd-auth-switch a { color: var(--kwd-pink-600); font-weight: 600; text-decoration: none; }

.kwd-field { margin-bottom: 14px; }
.kwd-field label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; color: var(--kwd-gray-900); }
.kwd-field input, .kwd-field select, .kwd-field textarea { width: 100%; border: 1px solid var(--kwd-gray-50); border-radius: 10px; padding: 10px 12px; font-size: 14px; font-family: inherit; box-sizing: border-box; }
.kwd-field input:focus, .kwd-field select:focus, .kwd-field textarea:focus { outline: none; border-color: var(--kwd-pink-100); box-shadow: 0 0 0 3px var(--kwd-pink-50); }
.kwd-field textarea { resize: vertical; }
/* Same clipping problem the DOB selects had (their fix is further down):
   the native select box doesn't reserve enough vertical room for its own
   text on Android WebView with this font stack, so the option text — e.g.
   "Select" — renders visually cut in half. Applying the same fixed-height,
   explicit-line-height, custom-arrow treatment here (rather than only on
   the narrow DOB columns) so it can't resurface on any other <select> in
   the app — currently "I am" / "Looking for", in both the sign-up wizard
   and the profile editor, since both reuse this same .kwd-field select rule. */
.kwd-field select {
	min-height: 44px;
	padding: 10px 34px 10px 12px;
	line-height: 1.4;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%235F5E5A' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
}
.kwd-save-status { font-size: 13px; color: var(--kwd-teal-800); margin-top: 10px; min-height: 16px; }

.kwd-dob-row { display: flex; gap: 6px; }
.kwd-dob-row select {
	width: auto; flex: 1; min-width: 0;
	box-sizing: border-box;
	min-height: 44px;
	padding: 12px 20px 12px 8px;
	font-size: 13px;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%235F5E5A' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 6px center;
}
/* The auth modal's bigger touch-target field styling still needs the same
   compact treatment for these three narrow columns, or "Month" clips. */
.kwd-auth-modal-inner .kwd-dob-row select { min-height: 48px; padding: 14px 20px 14px 8px; font-size: 13px; line-height: 1.4; }
.kwd-field-hint { font-size: 12px; color: var(--kwd-gray-600); margin: 6px 0 0; }
.kwd-toggle-label { display: flex; align-items: center; gap: 9px; font-size: 14px; font-weight: 600; color: var(--kwd-gray-900); cursor: pointer; margin-bottom: 0; }
.kwd-toggle-label input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--kwd-pink-600); flex-shrink: 0; }
.kwd-field-toggle .kwd-field-hint { margin-left: 27px; }

.kwd-btn.kwd-logout-btn { text-align: center; background: #D92D20; color: #fff; border: 1.5px solid #D92D20; text-decoration: none; }
.kwd-btn.kwd-logout-btn:hover, .kwd-btn.kwd-logout-btn:focus { background: #B42318; border-color: #B42318; color: #fff; }
.kwd-btn.kwd-logout-btn:active { background: #912018; border-color: #912018; }

.kwd-password-wrap { position: relative; }
.kwd-password-wrap input { padding-right: 42px; }
.kwd-pw-toggle { position: absolute; top: 50%; right: 4px; transform: translateY(-50%); background: none; border: none; padding: 6px; color: var(--kwd-gray-600); cursor: pointer; -webkit-tap-highlight-color: transparent; display: flex; align-items: center; justify-content: center; }
.kwd-pw-toggle svg { width: 18px; height: 18px; display: block; }
.kwd-pw-toggle[aria-pressed="true"] { color: var(--kwd-pink-600); }
/* Refined discovery & liked profiles */
.kwd-feed { display:flex; flex-direction:column; gap:12px; }
.kwd-card { display:grid; grid-template-columns:42% 58%; min-height:170px; margin:0; border-radius:18px; }
.kwd-card-photo { width:100%; height:100%; min-height:170px; aspect-ratio:auto; }
.kwd-card-body { padding:14px; display:flex; flex-direction:column; }
.kwd-card-top { display:flex; justify-content:space-between; gap:8px; align-items:flex-start; }
.kwd-age-chip { font-size:11px; background:var(--kwd-pink-50); color:var(--kwd-pink-800); padding:5px 8px; border-radius:20px; white-space:nowrap; }
.kwd-card-meta { margin-top:4px; }
.kwd-card-bio { font-size:13px; margin:8px 0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.kwd-card-actions { margin-top:auto; gap:8px; }
.kwd-action-btn,.kwd-mini-btn { border-radius:9px; padding:8px 12px; font-size:12px; font-weight:650; border:1px solid var(--kwd-gray-200); background:#fff; cursor:pointer; }
.kwd-action-btn.kwd-like { color:#fff; background:var(--kwd-pink-600); border-color:var(--kwd-pink-600); }
.kwd-action-btn.kwd-pass,.kwd-cancel { color:var(--kwd-gray-600); }
.kwd-message { color:#fff; background:var(--kwd-teal-800); border-color:var(--kwd-teal-800); }
.kwd-cancel { background:var(--kwd-gray-50); color:var(--kwd-gray-600); }
.kwd-subnav { background:var(--kwd-pink-50); }
.kwd-subtab.active { box-shadow:0 2px 8px rgba(212,83,126,.18); }
@media(max-width:380px){
	.kwd-card{grid-template-columns:40% 60%}
}
/* WhatsApp-style conversations */
.kwd-chat-layout{display:block}.kwd-matches-list{width:100%;display:flex;flex-direction:column;gap:0;background:#fff}.kwd-chat-row{width:100%;display:flex;align-items:center;gap:12px;padding:12px 4px;border:0;border-bottom:1px solid var(--kwd-gray-50);background:#fff;text-align:left;cursor:pointer}.kwd-chat-row img,.kwd-chat-initial{width:52px;height:52px;border-radius:50%;object-fit:cover;flex-shrink:0}.kwd-chat-initial{display:flex;align-items:center;justify-content:center;background:var(--kwd-pink-100);color:var(--kwd-pink-800);font-weight:700}.kwd-chat-row-info{display:flex;flex:1;min-width:0;flex-direction:column;gap:4px}.kwd-chat-row-info strong{font-size:15px;color:var(--kwd-gray-900)}.kwd-chat-row-info small{font-size:12px;color:var(--kwd-gray-600)}.kwd-chat-chevron{font-size:26px;color:var(--kwd-gray-600)}.kwd-thread{display:none;min-height:calc(100vh - 190px);background:#fff;flex-direction:column}.kwd-thread.active{display:flex}.kwd-chat-hidden{display:none!important}.kwd-thread-header{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--kwd-gray-50);font-size:16px}.kwd-thread-header button{border:0;background:none;font-size:32px;line-height:1;color:var(--kwd-pink-600);padding:0 8px 2px 0}.kwd-messages{flex:1;overflow-y:auto;padding:14px 4px}.kwd-chat-badge{position:absolute;margin-left:8px;margin-top:-8px;min-width:17px;height:17px;padding:0 4px;border-radius:10px;background:#D4537E;background:var(--kwd-pink-600);color:#fff;font-size:10px;line-height:17px;text-align:center}.kwd-tab{position:relative}


/* Refined WhatsApp-style conversation list */
.kwd-chat-row{padding:12px 8px!important;gap:13px!important;min-height:76px}
.kwd-chat-row-info{gap:5px!important;justify-content:center}
.kwd-chat-row-info strong{font-size:16px!important;font-weight:700}
.kwd-chat-row-info small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px!important;color:#687078!important}
.kwd-chat-row-meta{align-self:stretch;min-width:52px;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:7px;padding-right:3px}
.kwd-chat-row-meta time{font-size:11px;color:#6b7280;white-space:nowrap}
.kwd-chat-row-unread .kwd-chat-row-info strong{font-weight:800}
.kwd-chat-row-unread .kwd-chat-row-meta time{color:var(--kwd-pink-600);font-weight:700}
.kwd-row-unread{display:flex;align-items:center;justify-content:center;min-width:21px;height:21px;padding:0 6px;border-radius:999px;background:var(--kwd-pink-600);color:#fff;font-size:11px;font-weight:800;line-height:1;box-sizing:border-box}
.kwd-chat-badge{background:#D4537E;background:var(--kwd-pink-600)!important;color:#fff!important;box-shadow:0 1px 5px rgba(219,39,119,.35)}
@media (max-width:480px){.kwd-chat-row{padding:13px 6px!important}.kwd-chat-row img,.kwd-chat-initial{width:50px!important;height:50px!important}.kwd-chat-row-meta{min-width:46px}.kwd-chat-row-info small{max-width:calc(100vw - 145px)}}

/* Full-screen profile showcase — circular avatar over a soft gradient card,
   the same look as the Discover card, so a saved profile previews the way
   others will actually see it. */
.kwd-panel-profile { padding: 0 4px 18px; }
.kwd-profile-showcase { width: 100%; }
.kwd-profile-hero { position: relative; min-height: clamp(480px,64vw,600px); border-radius: 30px; overflow: hidden; background: linear-gradient(145deg, var(--kwd-teal-100), var(--kwd-pink-100)); box-shadow: 0 10px 28px rgba(44,44,42,.13); isolation: isolate; }
.kwd-profile-hero-bg { position:absolute; top:36px; left:50%; transform:translateX(-50%); width:min(52vw,210px); height:min(52vw,210px); border-radius:50%; background: var(--kwd-pink-50) center/cover no-repeat; box-shadow:0 14px 32px rgba(44,44,42,.16); z-index:0; }
.kwd-profile-hero-shade { position:absolute; left:0; right:0; bottom:0; height:64%; z-index:1; background: linear-gradient(to top, rgba(0,0,0,.94) 0%, rgba(0,0,0,.8) 46%, rgba(0,0,0,0) 100%); }
.kwd-profile-hero-content { position:absolute; left:0; right:0; bottom:104px; z-index:2; padding:0 26px; color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.5); }
.kwd-profile-hero-content h2 { margin:0 0 6px; color:#fff; font-size:28px; line-height:1.1; font-weight:800; letter-spacing:-.4px; }
.kwd-profile-display-bio { margin:0 0 12px; color:#fff; font-size:14px; font-weight:600; line-height:1.4; max-width:95%; }
.kwd-profile-display-chips { display:flex; flex-wrap:wrap; gap:8px; }
.kwd-profile-display-chips span { color:#fff; border:1px solid rgba(255,255,255,.55); background:rgba(255,255,255,.16); border-radius:999px; padding:7px 12px; font-size:11px; font-weight:750; letter-spacing:.2px; }
.kwd-profile-showcase-actions { position:absolute; left:22px; right:22px; bottom:18px; z-index:3; display:flex; align-items:center; justify-content:space-between; gap:14px; }
.kwd-showcase-action { width:52px; height:52px; border-radius:50%; border:1px solid rgba(255,255,255,.95); background:#fff; display:flex; align-items:center; justify-content:center; font-size:27px; line-height:1; cursor:pointer; box-shadow:0 5px 16px rgba(0,0,0,.18); color:var(--kwd-pink-600); }
.kwd-showcase-x { color:#c14b6e; font-size:32px; }
.kwd-showcase-heart { width:64px; height:64px; background:var(--kwd-pink-600); border-color:var(--kwd-pink-600); color:#fff; font-size:28px; }
.kwd-showcase-message { color:var(--kwd-pink-600); font-size:24px; }
.kwd-showcase-action:active { transform:scale(.94); }
.kwd-profile-edit-fab { position:absolute; top:16px; right:16px; z-index:3; border:1px solid rgba(255,255,255,.72); background:rgba(0,0,0,.38); color:#fff; border-radius:999px; padding:8px 12px; font-weight:750; font-size:12px; backdrop-filter:blur(7px); text-shadow:0 1px 4px rgba(0,0,0,.8); cursor:pointer; }
.kwd-profile-editor { padding:8px 2px 20px; }
.kwd-profile-editor[hidden] { display:none !important; }
@media(max-width:380px){ .kwd-profile-hero{min-height:64vh;border-radius:24px}.kwd-profile-hero-bg{width:min(48vw,178px);height:min(48vw,178px);top:26px}.kwd-profile-hero-content{bottom:92px;padding:0 20px}.kwd-profile-hero-content h2{font-size:24px}.kwd-showcase-action{width:46px;height:46px}.kwd-showcase-heart{width:58px;height:58px} }


/* Discover card — circular avatar over a soft gradient card, with a dark
   panel overlapping the bottom of the photo that holds the name, online
   status/location, bio, interest chips and the round action row. This
   matches the product reference design. Tapping the card (outside the
   action row) opens the existing full-profile modal below, which is
   intentionally left unchanged. */
.kwd-panel-discover .kwd-feed{gap:18px;padding:2px 0 22px}
/* Softened from teal-100→pink-100 (too saturated/green at full card size) to
   a mostly-neutral wash that only hints at mint near the top, so the card
   reads as light and airy rather than green. */
.kwd-discover-card{position:relative;width:100%;border-radius:28px;overflow:hidden;background:linear-gradient(160deg,var(--kwd-teal-50) 0%,#FDF9F7 42%,var(--kwd-pink-50) 100%);box-shadow:0 10px 28px rgba(44,44,42,.13);isolation:isolate;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:box-shadow .2s ease}
.kwd-discover-avatar-wrap{display:flex;align-items:center;justify-content:center;padding:34px 20px 0}
/* A slim conic gradient ring around the avatar — the bit of "spice" that
   frames the photo without competing with it, and doubles as a subtle nod
   to the "online"/"active" affordance used elsewhere in the product. */
.kwd-discover-avatar-img{width:min(54vw,220px);height:min(54vw,220px);border-radius:50%;background:var(--kwd-pink-50) center/cover no-repeat;box-shadow:0 14px 32px rgba(44,44,42,.16),0 0 0 5px #fff,0 0 0 8px rgba(212,83,126,.28)}
.kwd-discover-card-body{position:relative;z-index:1;margin-top:-58px;padding:70px 24px 20px;background:linear-gradient(to top,rgba(0,0,0,.94) 0%,rgba(0,0,0,.85) 55%,rgba(0,0,0,0) 100%);color:#fff}
.kwd-discover-card-body h2{margin:0 0 6px;color:#fff;font-size:26px;line-height:1.1;font-weight:800;letter-spacing:-.4px;text-shadow:0 2px 10px rgba(0,0,0,.5)}
.kwd-discover-meta{margin:0 0 8px;font-size:12px;font-weight:700;letter-spacing:.1px;color:#fff;opacity:.95}
.kwd-discover-bio-wrap{display:flex;align-items:flex-end;gap:7px;margin:0 0 10px;min-width:0}
.kwd-discover-bio{margin:0!important;flex:1;min-width:0;color:#fff;font-size:14px;line-height:1.4;font-weight:600;max-height:2.7em;overflow:hidden;word-break:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.kwd-bio-more{appearance:none;border:0;background:transparent;color:#fff;text-decoration:underline;font:inherit;font-size:12px;font-weight:800;padding:0 0 1px;cursor:pointer;text-shadow:0 2px 8px rgba(0,0,0,.9)}
.kwd-discover-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.kwd-discover-chips span{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.16);border-radius:999px;padding:7px 11px;color:#fff;font-size:11px;font-weight:750;letter-spacing:.2px;display:inline-flex;align-items:center}
.kwd-discover-actions{margin-top:16px;display:flex;align-items:center;justify-content:space-between;gap:0}
.kwd-discover-action{width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.95);background:#fff;display:flex;align-items:center;justify-content:center;padding:0;font-size:27px;line-height:1;cursor:pointer;box-shadow:0 5px 16px rgba(0,0,0,.18);flex:0 0 auto;-webkit-tap-highlight-color:transparent}
.kwd-discover-pass{color:#c14b6e;font-size:31px;font-weight:300}
.kwd-discover-message{color:var(--kwd-pink-600)}
/* Not-yet-liked heart is the neutral, waiting-for-input state: white circle,
   pink outline/icon. Tapping it likes the profile. */
.kwd-discover-like{width:64px;height:64px;background:#fff;border-color:var(--kwd-pink-600);color:var(--kwd-pink-600);transition:background-color .18s ease,color .18s ease,transform .12s ease,box-shadow .18s ease}
.kwd-discover-like .kwd-action-svg{fill:currentColor}
/* Liked state is the bold, confirmed one: solid pink circle, white heart,
   with a soft outer glow so a revisited liked profile reads as "already
   liked" at a glance. Cancelling a like removes this class and the button
   returns to the default state above. */
.kwd-discover-like.is-liked{background:var(--kwd-pink-600);border-color:var(--kwd-pink-600);color:#fff;box-shadow:0 0 0 5px rgba(217,52,115,.16),0 6px 18px rgba(212,83,126,.38);animation:kwd-like-pop .32s cubic-bezier(.34,1.56,.64,1)}
@keyframes kwd-like-pop{0%{transform:scale(1)}45%{transform:scale(1.16)}100%{transform:scale(1)}}
.kwd-discover-action:active{transform:scale(.94)}
.kwd-inline-icon{width:14px;height:14px;display:inline-block;vertical-align:-2px;margin-right:5px;flex:0 0 auto}
.kwd-action-svg{width:22px;height:22px;display:block}
.kwd-discover-message .kwd-action-svg{width:20px;height:20px}
@media(max-width:480px){
  .kwd-discover-card{border-radius:24px}
  .kwd-discover-avatar-wrap{padding:26px 20px 0}
  .kwd-discover-avatar-img{width:min(50vw,190px);height:min(50vw,190px)}
  .kwd-discover-card-body{margin-top:-48px;padding:58px 20px 18px}
  .kwd-discover-card-body h2{font-size:23px}
  .kwd-discover-action{width:46px;height:46px}
  .kwd-discover-like{width:58px;height:58px}
  .kwd-action-svg{width:20px;height:20px}
}

.kwd-bio-modal{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.58);display:flex;align-items:flex-end;justify-content:center;padding:18px;backdrop-filter:blur(4px)}
.kwd-bio-sheet{position:relative;width:min(560px,100%);max-height:70vh;overflow:auto;background:#fff;border-radius:24px 24px 18px 18px;padding:28px 22px 26px;box-shadow:0 -12px 42px rgba(0,0,0,.25)}
.kwd-bio-sheet h3{margin:0 38px 12px 0;color:var(--kwd-gray-900);font-size:20px;line-height:1.25}.kwd-bio-sheet p{margin:0;color:var(--kwd-gray-700);font-size:15px;line-height:1.55;white-space:pre-wrap;word-break:break-word}.kwd-bio-close{position:absolute;right:14px;top:12px;width:34px;height:34px;border:0;border-radius:50%;background:#FBEAF0;background:var(--kwd-pink-50);color:#D4537E;color:var(--kwd-pink-600);font-size:20px;line-height:1;cursor:pointer;box-sizing:border-box;padding:0;margin:0;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;box-shadow:0 2px 6px rgba(0,0,0,.14)}
.kwd-bio-close-on-photo{background:rgba(0,0,0,.42);color:#fff}

/* "Who liked you" detail sheet — full photo + name + quick actions */
.kwd-admirer-sheet-photo{width:calc(100% + 44px);aspect-ratio:4/3;margin:-28px -22px 16px;border-radius:24px 24px 0 0;background-size:cover;background-position:center;background-color:var(--kwd-pink-50)}
.kwd-admirer-sheet-card h3{display:flex;align-items:center;flex-wrap:wrap}
.kwd-sheet-matched{display:inline-block;font-size:12px;font-weight:700;color:#085041;color:var(--kwd-teal-800);background:#E1F5EE;background:var(--kwd-teal-50);padding:4px 10px;border-radius:999px;margin:0 0 10px}
.kwd-sheet-meta{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--kwd-gray-600);margin:0 0 10px}
.kwd-sheet-bio{margin:0 0 18px!important}
.kwd-admirer-sheet-actions{display:flex;gap:10px;align-items:center}
.kwd-admirer-sheet-actions .kwd-btn-primary{flex:1;width:auto;display:flex;align-items:center;justify-content:center;gap:8px}
.kwd-pill-btn{display:inline-flex;align-items:center;gap:6px;border:1.5px solid #B4B2A9;border:1.5px solid var(--kwd-gray-200);background:#fff;border-radius:999px;padding:0 16px;height:44px;font-size:13px;font-weight:700;color:#2C2C2A;color:var(--kwd-gray-900);cursor:pointer;-webkit-tap-highlight-color:transparent}
.kwd-pill-btn .kwd-action-svg{width:16px;height:16px}
.kwd-pill-btn.is-liked{background:#FBEAF0;background:var(--kwd-pink-50);border-color:#F4C0D1;border-color:var(--kwd-pink-100);color:#D4537E;color:var(--kwd-pink-600)}
.kwd-pill-btn:active{transform:scale(.96)}
/* First-impression welcome header */
.kwd-header-welcome{position:relative;min-height:66px;padding:10px 6px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(212,83,126,.08)}
.kwd-welcome-copy{display:flex;flex-direction:column;line-height:1.15;max-width:130px;overflow:hidden;flex:0 1 130px}
.kwd-welcome-small{font-size:11px;color:var(--kwd-gray-600);font-weight:600;letter-spacing:.01em}
.kwd-welcome-copy strong{font-size:16px;color:var(--kwd-gray-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.kwd-brand-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);gap:7px;white-space:nowrap}
.kwd-brand-center .kwd-brand-logo{height:28px}
.kwd-brand-left{position:static;gap:7px;white-space:nowrap}
.kwd-brand-left .kwd-brand-logo{height:28px}
.kwd-header-avatar{width:42px;height:42px;border-radius:50%;border:2px solid var(--kwd-pink-100);background-size:cover;background-position:center;background-color:var(--kwd-pink-50);padding:0;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.kwd-header-avatar:active{transform:scale(.96)}
.kwd-header-actions{margin-left:auto;position:relative;z-index:1;display:flex;align-items:center;gap:10px}
.kwd-header-bell{position:relative;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--kwd-gray-200);background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;color:var(--kwd-gray-900)}
.kwd-header-bell svg{width:19px;height:19px}
.kwd-header-bell:active{transform:scale(.96)}
.kwd-notif-badge{position:absolute;top:-4px;right:-4px;min-width:16px;height:16px;padding:0 4px;border-radius:10px;background:var(--kwd-pink-600);color:#fff;font-size:10px;line-height:16px;text-align:center}
.kwd-notif-panel{position:absolute;top:60px;right:6px;width:290px;max-width:calc(100vw - 24px);max-height:360px;overflow-y:auto;background:#fff;border:1px solid var(--kwd-gray-50);border-radius:14px;box-shadow:0 8px 24px rgba(0,0,0,.12);z-index:600}
.kwd-notif-panel-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--kwd-gray-50);font-size:14px}
.kwd-notif-panel-head button{border:0;background:none;font-size:20px;line-height:1;color:var(--kwd-gray-600);cursor:pointer;padding:0}
.kwd-notif-list{padding:4px 8px}
.kwd-notif-row{display:flex;align-items:center;gap:10px;padding:9px 6px;border-radius:10px}
.kwd-notif-row.kwd-notif-unread{background:var(--kwd-pink-50)}
.kwd-notif-row.kwd-notif-clickable{cursor:pointer}
.kwd-notif-row.kwd-notif-clickable:active{background:var(--kwd-pink-50)}
.kwd-notif-row img,.kwd-notif-icon{width:36px;height:36px;border-radius:50%;object-fit:cover;flex-shrink:0}
.kwd-notif-icon{display:flex;align-items:center;justify-content:center;background:var(--kwd-pink-100);color:var(--kwd-pink-800)}
.kwd-notif-icon svg{width:16px;height:16px}
.kwd-notif-row-info{display:flex;flex-direction:column;gap:2px;min-width:0}
.kwd-notif-row-info strong{font-size:13px;color:var(--kwd-gray-900);font-weight:600;white-space:normal}
.kwd-notif-row-info small{font-size:11px;color:var(--kwd-gray-600)}
@media(max-width:390px){.kwd-header-welcome{padding-left:4px;padding-right:4px}.kwd-brand-center .kwd-brand-logo{height:24px}.kwd-brand-left .kwd-brand-logo{height:24px}.kwd-welcome-copy{max-width:82px}.kwd-welcome-copy strong{font-size:14px}.kwd-header-avatar{width:40px;height:40px}}

/* v1.4.6 – true viewport centering for the Nkwagala brand */
.kwd-header-welcome .kwd-brand-center{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;margin:0!important}

/* Keep the login action on the far right for visitors while the brand stays truly centered. */
.kwd-header-login{margin-left:auto;position:relative;z-index:1;white-space:nowrap}
/* Guided account setup: profile essentials are collected before entering the app. */
.kwd-onboard-head{margin:0 0 18px}.kwd-onboard-step{display:block;font-size:12px;font-weight:700;color:var(--kwd-pink-600);margin-bottom:8px}.kwd-onboard-progress{height:6px;background:var(--kwd-gray-100);border-radius:99px;overflow:hidden}.kwd-onboard-progress i{display:block;width:33.333%;height:100%;background:var(--kwd-pink-600);border-radius:99px;transition:width .25s ease}.kwd-onboard-page{display:none}.kwd-onboard-page.active{display:block}.kwd-onboard-page h3{margin:0 0 6px;font-size:22px}.kwd-onboard-actions{display:flex;gap:10px}.kwd-onboard-actions .kwd-btn{flex:1}.kwd-onboard-photo-picker{min-height:170px;border:1.5px dashed #e4a7b9;border-radius:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer;background:#fff8fa;margin:8px 0 16px}.kwd-onboard-photo-picker span{width:82px;height:82px;border-radius:50%;background:#f6d9e2;color:var(--kwd-pink-600);display:flex;align-items:center;justify-content:center;font-size:34px;background-size:cover;background-position:center}.kwd-onboard-photo-picker span.has-photo{border:3px solid #fff;box-shadow:0 4px 14px rgba(0,0,0,.14)}.kwd-onboard-photo-picker strong{font-size:15px}.kwd-onboard-photo-picker small{color:var(--kwd-gray-600);font-size:12px}.kwd-field label small{font-weight:400;color:var(--kwd-gray-600)}

/* v1.6.8 – profile sheet polish and reliable action buttons */
.kwd-bio-modal{box-sizing:border-box;width:100%;max-width:100vw;overflow-x:hidden;}
.kwd-admirer-sheet .kwd-sheet-message{appearance:none;-webkit-appearance:none;box-sizing:border-box;min-height:44px;margin:0;padding:12px 18px;border:0;border-radius:24px;background:#D4537E !important;color:#fff !important;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;font-size:14px;font-weight:700;line-height:1.2;text-align:center;text-decoration:none;display:flex !important;align-items:center;justify-content:center;gap:8px;cursor:pointer;opacity:1 !important;visibility:visible !important;box-shadow:none;text-shadow:none;-webkit-tap-highlight-color:transparent;}
.kwd-admirer-sheet .kwd-sheet-message span{display:inline !important;color:#fff !important;font:inherit;line-height:1.2;opacity:1 !important;visibility:visible !important;}
.kwd-admirer-sheet .kwd-sheet-message svg{display:block !important;width:18px;height:18px;flex:0 0 18px;color:#fff !important;fill:none;stroke:currentColor;opacity:1 !important;visibility:visible !important;}
.kwd-admirer-sheet .kwd-sheet-message:hover,.kwd-admirer-sheet .kwd-sheet-message:focus,.kwd-admirer-sheet .kwd-sheet-message:active{background:#C44770 !important;color:#fff !important;opacity:1 !important;}
.kwd-admirer-sheet .kwd-pill-btn{color:var(--kwd-gray-900) !important;background:#fff !important;opacity:1 !important;visibility:visible !important;}
.kwd-admirer-sheet .kwd-pill-btn svg{color:currentColor !important;stroke:currentColor !important;opacity:1 !important;visibility:visible !important;}
.kwd-admirer-sheet .kwd-pill-btn.is-liked{color:var(--kwd-pink-600) !important;background:var(--kwd-pink-50) !important;}
/* Keep the original clean close control; don't place a dark disc over the photo. */
.kwd-bio-close-on-photo{background:var(--kwd-pink-50);color:var(--kwd-pink-600);}
.kwd-admirer-sheet-photo{background-size:cover !important;background-position:50% 50% !important;background-repeat:no-repeat !important;transform:none !important;object-position:50% 50%;}

/* Discover: tapping the card opens a centered full profile. */
.kwd-discover-card{cursor:pointer;-webkit-tap-highlight-color:transparent;}
.kwd-discover-card .kwd-discover-actions,.kwd-discover-card .kwd-discover-actions *,.kwd-discover-card .kwd-bio-more{cursor:pointer;}
.kwd-discover-activity{display:inline-flex;align-items:center;gap:4px;color:#fff;font-size:11px;font-weight:750;}
.kwd-full-profile-sheet{position:relative;width:min(560px,100%);max-height:88vh;overflow:hidden;background:#fff;border-radius:24px 24px 18px 18px;box-shadow:0 -12px 42px rgba(0,0,0,.25);}
.kwd-full-profile-photo{width:100%;height:min(48vh,430px);min-height:260px;background-color:var(--kwd-pink-50);background-size:cover;background-position:50% 50%;background-repeat:no-repeat;}
.kwd-full-profile-body{max-height:42vh;overflow:auto;padding:20px 22px 24px;box-sizing:border-box;}
.kwd-full-profile-body h2{margin:0 38px 5px 0;color:var(--kwd-gray-900);font-size:26px;line-height:1.15;font-weight:800;}
.kwd-full-profile-active{display:inline-block;color:var(--kwd-teal-800);font-size:12px;font-weight:750;margin:0 0 12px;}
.kwd-full-profile-meta{display:grid;gap:7px;padding:12px 0;border-top:1px solid var(--kwd-gray-50);border-bottom:1px solid var(--kwd-gray-50);}
.kwd-full-profile-row{display:flex;justify-content:space-between;gap:18px;font-size:13px;color:var(--kwd-gray-600);}
.kwd-full-profile-row strong{color:var(--kwd-gray-900);font-weight:700;}
.kwd-full-profile-tags{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0 4px;}
.kwd-full-profile-tags span{padding:7px 11px;border-radius:999px;background:var(--kwd-pink-50);border:1px solid var(--kwd-pink-100);color:var(--kwd-pink-800);font-size:12px;font-weight:700;}
.kwd-full-profile-about{margin-top:16px;}
.kwd-full-profile-about h3{margin:0 0 7px;font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--kwd-gray-600);}
.kwd-full-profile-about p{margin:0;color:var(--kwd-gray-900);font-size:15px;line-height:1.55;white-space:pre-wrap;word-break:break-word;}
.kwd-full-profile-actions{display:flex;gap:10px;margin-top:20px;}
.kwd-full-profile-btn{flex:1;min-height:46px;border-radius:999px;border:1.5px solid var(--kwd-gray-200);background:#fff;color:var(--kwd-gray-900);display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:750;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.kwd-full-profile-btn svg{width:18px;height:18px;display:block;stroke:currentColor;fill:currentColor;}
.kwd-full-profile-like.is-liked{background:var(--kwd-pink-50);border-color:var(--kwd-pink-100);color:var(--kwd-pink-600);}
.kwd-full-profile-message{background:var(--kwd-pink-600);border-color:var(--kwd-pink-600);color:#fff;}
.kwd-full-profile-message svg{stroke:#fff;color:#fff;fill:none;}

/* Fixed interest vocabulary — tap to select, up to 3. */
.kwd-tags-field{margin-bottom:14px;}
.kwd-tags-field>label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;color:var(--kwd-gray-900);}
.kwd-tags-field>label small{font-weight:400;color:var(--kwd-gray-600);}
.kwd-tags-chips{display:flex;flex-wrap:wrap;gap:8px;}
.kwd-tag-chip{border:1.5px solid var(--kwd-gray-200);background:#fff;color:var(--kwd-gray-900);border-radius:999px;padding:8px 14px;font-size:12.5px;font-weight:650;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background-color .15s ease,border-color .15s ease,color .15s ease;}
.kwd-tag-chip.active{background:var(--kwd-pink-600);border-color:var(--kwd-pink-600);color:#fff;}
.kwd-tag-chip:active{transform:scale(.97);}
@media(max-width:380px){.kwd-full-profile-photo{height:40vh;min-height:240px}.kwd-full-profile-body{max-height:48vh;}}

/* Compatibility badge shown on Discover cards + full profile. */
.kwd-compat-badge{position:absolute;top:14px;left:14px;z-index:2;background:var(--kwd-pink-600);color:#fff;font-size:11px;font-weight:750;padding:6px 11px;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,.15);}
.kwd-boost-badge{position:absolute;top:14px;right:14px;z-index:2;display:inline-flex;align-items:center;gap:4px;background:#fff;color:var(--kwd-pink-600);font-size:11px;font-weight:750;padding:6px 11px;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,.15);}
.kwd-boost-badge svg{width:12px;height:12px;}

/* Profile Boost card on the Profile tab. */
.kwd-boost-card{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--kwd-pink-50);border:1px solid var(--kwd-pink-100);border-radius:14px;padding:14px 16px;margin:14px 0;}
.kwd-boost-card-text strong{display:block;font-size:14px;color:var(--kwd-pink-800);margin-bottom:2px;}
.kwd-boost-card-text p{margin:0;font-size:12px;color:var(--kwd-gray-600);}
.kwd-boost-card #kwd-boost-btn{width:auto;flex-shrink:0;margin-top:0;padding:9px 16px;font-size:13px;}
.kwd-boost-card #kwd-boost-btn:disabled{opacity:.6;cursor:default;}

/* Boosted rail: horizontal, swipeable strip of currently-boosted profiles
   above the main Discover feed. Visually distinct from the regular card
   stack so it reads as a featured/paid placement, not just "sorted first". */
.kwd-boost-rail-wrap{margin:0 0 18px;}
.kwd-boost-rail-heading{margin:0 0 8px;font-size:12px;font-weight:750;letter-spacing:.02em;text-transform:uppercase;color:var(--kwd-pink-600);}
.kwd-boost-rail{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:2px 2px 6px;margin:0 -2px;scrollbar-width:none;}
.kwd-boost-rail::-webkit-scrollbar{display:none;}
.kwd-boost-rail-card{position:relative;flex:0 0 auto;width:112px;height:168px;scroll-snap-align:start;border-radius:16px;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent;border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,var(--kwd-pink-600),var(--kwd-amber-600)) border-box;box-shadow:0 3px 10px rgba(0,0,0,.12);}
.kwd-boost-rail-photo{position:absolute;inset:0;background-size:cover;background-position:center;background-color:var(--kwd-pink-50);}
.kwd-boost-rail-card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:60%;background:linear-gradient(to top,rgba(0,0,0,.72),rgba(0,0,0,0));pointer-events:none;}
.kwd-boost-rail-badge{position:absolute;top:6px;right:6px;z-index:2;width:22px;height:22px;border-radius:50%;background:#fff;color:var(--kwd-pink-600);display:flex;align-items:center;justify-content:center;box-shadow:0 1px 4px rgba(0,0,0,.2);}
.kwd-boost-rail-badge svg{width:12px;height:12px;}
.kwd-boost-rail-name{position:absolute;left:8px;right:8px;bottom:8px;z-index:2;font-size:12px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 3px rgba(0,0,0,.4);}

/* Conversation starters appear only when a chat is empty. */
.kwd-conversation-starters{margin:18px auto 24px;max-width:360px;text-align:center;color:var(--kwd-gray-600);}
.kwd-conversation-starters>strong{display:block;font-size:13px;color:var(--kwd-gray-900);margin-bottom:10px;}
.kwd-starter-list{display:flex;flex-direction:column;gap:8px;}
.kwd-starter-list button{border:1px solid var(--kwd-pink-100);background:var(--kwd-pink-50);color:var(--kwd-pink-800);border-radius:16px;padding:10px 12px;font:600 12px/1.3 inherit;cursor:pointer;text-align:left;-webkit-tap-highlight-color:transparent;}
.kwd-starter-list button:active{transform:scale(.98);}

/* v1.6.24 – logged-out product previews: let visitors explore each tab before auth */
.kwd-guest-demo{background:linear-gradient(180deg,#fff 0%,#fff9fb 100%);border:1px solid rgba(212,83,126,.14);border-radius:22px;padding:16px;margin:4px 0 14px;box-shadow:0 5px 18px rgba(44,44,42,.05)}
.kwd-guest-demo-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:14px}.kwd-guest-demo-head h2{font-family:'Fraunces',Georgia,serif;font-size:24px;line-height:1.05;margin:3px 0 5px;color:var(--kwd-gray-900)}.kwd-guest-demo-head p{font-size:12px;color:var(--kwd-gray-600);margin:0}.kwd-guest-demo-eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:var(--kwd-pink-600)}.kwd-demo-live-pill{flex:0 0 auto;background:var(--kwd-teal-50);color:var(--kwd-teal-800);border-radius:999px;padding:6px 9px;font-size:10px;font-weight:800}.kwd-demo-live-pill i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--kwd-teal-800);margin-right:5px}
.kwd-demo-discover-card{position:relative;min-height:390px;border-radius:19px;overflow:hidden;background:linear-gradient(145deg,var(--kwd-teal-100),var(--kwd-pink-100));display:flex;flex-direction:column;justify-content:flex-end;padding:16px;color:#fff}.kwd-demo-avatar-large{position:absolute;inset:0 0 108px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--kwd-teal-50),var(--kwd-pink-50))}.kwd-demo-avatar-large img{width:190px;height:190px;object-fit:cover;border-radius:50%;box-shadow:0 10px 28px rgba(44,44,42,.14)}.kwd-demo-profile-copy{position:relative;z-index:1;background:linear-gradient(transparent,rgba(0,0,0,.68));margin:0 -16px -16px;padding:52px 16px 70px}.kwd-demo-profile-copy strong{display:block;font-size:24px}.kwd-demo-profile-copy span{font-size:11px}.kwd-demo-profile-copy p{font-size:12px;line-height:1.4;margin:7px 0}.kwd-demo-chips{display:flex;gap:6px;flex-wrap:wrap}.kwd-demo-chips span{background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:5px 8px;font-size:10px}.kwd-demo-actions{position:absolute;bottom:13px;left:16px;right:16px;display:flex !important;justify-content:space-between;align-items:center;z-index:3;opacity:1 !important;visibility:visible !important}
/* v1.6.26 – reliable Discover-preview action buttons: same !important hardening used for the admirer-sheet buttons in v1.6.8, since unguarded button/svg rules here were being collapsed by theme global styles on the live site. */
.kwd-demo-actions .kwd-demo-round{appearance:none;-webkit-appearance:none;box-sizing:border-box;flex:0 0 auto;width:44px !important;height:44px !important;min-width:44px;min-height:44px;border-radius:50% !important;border:1px solid rgba(255,255,255,.9);margin:0;padding:0;background:#fff !important;color:var(--kwd-pink-600) !important;display:flex !important;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(0,0,0,.15);cursor:pointer;opacity:1 !important;visibility:visible !important}
.kwd-demo-actions .kwd-demo-round svg{display:block !important;width:20px !important;height:20px !important;flex:0 0 20px;color:var(--kwd-pink-600) !important;stroke:currentColor !important;opacity:1 !important;visibility:visible !important}
.kwd-demo-actions .kwd-demo-like{width:52px !important;height:52px !important;min-width:52px;min-height:52px;background:var(--kwd-pink-600) !important;color:#fff !important;border-color:var(--kwd-pink-600);align-self:center}
.kwd-demo-actions .kwd-demo-like svg{width:22px !important;height:22px !important;flex:0 0 22px;color:#fff !important;fill:currentColor !important}.kwd-demo-interest-row{display:flex;align-items:baseline;gap:8px;margin:15px 2px 9px}.kwd-demo-interest-row strong{font-size:13px}.kwd-demo-interest-row span{font-size:11px;color:var(--kwd-gray-600)}.kwd-demo-interest-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.kwd-demo-interest{border:1px solid var(--kwd-pink-100);background:#fff;border-radius:12px;padding:11px 8px;font-size:11px;font-weight:700;color:var(--kwd-gray-900);cursor:pointer;text-align:left}
.kwd-demo-like-grid{display:grid;gap:9px}.kwd-demo-like-card{display:flex;align-items:center;gap:10px;width:100%;border:1px solid var(--kwd-gray-50);background:#fff;border-radius:15px;padding:9px;text-align:left;cursor:pointer}.kwd-demo-avatar{width:50px;height:50px;border-radius:50%;overflow:hidden;flex:0 0 auto;background:var(--kwd-pink-50)}.kwd-demo-avatar svg,.kwd-demo-avatar img{width:100%;height:100%;object-fit:cover}.kwd-demo-like-card span:nth-child(2){display:flex;flex-direction:column;gap:3px;flex:1}.kwd-demo-like-card strong{font-size:13px}.kwd-demo-like-card small{font-size:10px;color:var(--kwd-gray-600)}.kwd-demo-like-card>b{color:var(--kwd-pink-600);display:flex;align-items:center}.kwd-demo-like-card>b svg{width:18px;height:18px}.kwd-demo-note{margin-top:10px;padding:10px 11px;border-radius:11px;background:var(--kwd-pink-50);font-size:11px;line-height:1.4;color:var(--kwd-pink-800)}
.kwd-demo-chat{background:#fff;border:1px solid var(--kwd-gray-50);border-radius:17px;padding:12px}.kwd-demo-chat-person{display:flex;align-items:center;gap:9px;padding-bottom:10px;border-bottom:1px solid var(--kwd-gray-50)}.kwd-demo-chat-person div{display:flex;flex-direction:column;gap:2px}.kwd-demo-chat-person strong{font-size:13px}.kwd-demo-chat-person small{font-size:10px;color:var(--kwd-teal-800)}.kwd-demo-messages{display:flex;flex-direction:column;gap:8px;padding:15px 3px}.kwd-demo-bubble{max-width:78%;padding:9px 11px;border-radius:14px;font-size:12px;line-height:1.35}.kwd-demo-bubble.them{align-self:flex-start;background:var(--kwd-gray-50)}.kwd-demo-bubble.me{align-self:flex-end;background:var(--kwd-pink-100);color:var(--kwd-pink-900)}.kwd-demo-composer{width:100%;border:1px solid var(--kwd-gray-200);background:#fff;border-radius:999px;padding:9px 12px;display:flex;justify-content:space-between;align-items:center;color:var(--kwd-gray-600);font-size:11px;cursor:pointer}.kwd-demo-composer b{color:var(--kwd-pink-600);display:flex;align-items:center}.kwd-demo-composer b svg{width:17px;height:17px}.kwd-demo-profile-card{background:#fff;border:1px solid var(--kwd-gray-50);border-radius:18px;overflow:hidden}.kwd-demo-avatar-profile{height:205px;background:linear-gradient(135deg,var(--kwd-teal-50),var(--kwd-amber-50));display:flex;align-items:center;justify-content:center}.kwd-demo-avatar-profile img{width:170px;height:170px;object-fit:cover;border-radius:50%}.kwd-demo-profile-body{padding:14px}.kwd-demo-profile-body h3{margin:0 0 4px;font-size:22px}.kwd-demo-profile-body p{font-size:12px;line-height:1.45;margin:0 0 10px;color:var(--kwd-gray-600)}.kwd-demo-profile-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:13px 0}.kwd-demo-profile-stats span{background:var(--kwd-gray-50);border-radius:10px;padding:8px 4px;text-align:center;font-size:9px;color:var(--kwd-gray-600)}.kwd-demo-profile-stats b{display:block;font-size:10px;color:var(--kwd-gray-900);margin-bottom:2px}.kwd-demo-profile-body .kwd-btn-primary{margin-top:4px}

.kwd-feed-restart { width: auto; margin-top: 12px; padding: 12px 28px; }

/* ---------- People You Like: image-first 2-column grid ---------- */
.kwd-lk-head { display:flex; align-items:baseline; justify-content:space-between; margin:2px 2px 12px; }
.kwd-lk-count { font-size:15px; font-weight:700; color:var(--kwd-gray-900); margin:0; }
.kwd-lk-sub { font-size:12px; color:var(--kwd-gray-600); margin:0; }
.kwd-lk-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding-bottom:24px; }
.kwd-lk-card { position:relative; background:#fff; border-radius:18px; overflow:hidden; box-shadow:0 2px 10px rgba(75,21,40,.10); display:flex; flex-direction:column; transition:opacity .2s ease, transform .2s ease; }
.kwd-lk-card.is-leaving { opacity:0; transform:scale(.94); }
.kwd-lk-photo { position:relative; aspect-ratio:3/4; background-size:cover; background-position:center; background-color:var(--kwd-pink-50); cursor:pointer; border:0; padding:0; width:100%; display:block; -webkit-tap-highlight-color:transparent; }
.kwd-lk-photo::after { content:""; position:absolute; inset:auto 0 0 0; height:62%; background:linear-gradient(to top,rgba(30,10,18,.82),rgba(30,10,18,0)); pointer-events:none; }
.kwd-lk-info { position:absolute; left:12px; right:12px; bottom:10px; z-index:1; color:#fff; text-align:left; pointer-events:none; }
.kwd-lk-name { font-size:16px; font-weight:700; line-height:1.2; margin:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-shadow:0 1px 3px rgba(0,0,0,.4); }
.kwd-lk-loc { font-size:12px; line-height:1.3; margin:3px 0 0; opacity:.92; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kwd-lk-chip { position:absolute; top:10px; left:10px; z-index:1; background:rgba(255,255,255,.94); color:var(--kwd-pink-800); font-size:11px; font-weight:700; padding:4px 9px; border-radius:20px; display:inline-flex; align-items:center; gap:4px; }
.kwd-lk-chip.is-match { background:var(--kwd-pink-600); color:#fff; }
.kwd-lk-dot { position:absolute; top:13px; right:12px; z-index:1; width:10px; height:10px; border-radius:50%; background:#2fbf71; border:2px solid #fff; box-sizing:content-box; }
.kwd-lk-actions { display:flex; gap:8px; padding:10px; }
.kwd-lk-btn { -webkit-appearance:none; appearance:none; border:0; cursor:pointer; min-height:42px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; gap:6px; font-size:13px; font-weight:700; -webkit-tap-highlight-color:transparent; transition:transform .1s ease, background-color .15s ease; }
.kwd-lk-btn:active { transform:scale(.96); }
.kwd-lk-msg { flex:1; background:var(--kwd-teal-800); color:#fff; }
.kwd-lk-msg svg { width:17px; height:17px; }
.kwd-lk-unlike { width:44px; flex:none; background:var(--kwd-pink-50); color:var(--kwd-pink-600); }
.kwd-lk-unlike svg { width:19px; height:19px; }
.kwd-lk-empty { text-align:center; padding:48px 24px 24px; }
.kwd-lk-empty-icon { width:68px; height:68px; margin:0 auto 16px; border-radius:50%; background:var(--kwd-pink-50); color:var(--kwd-pink-600); display:flex; align-items:center; justify-content:center; }
.kwd-lk-empty-icon svg { width:32px; height:32px; }
.kwd-lk-empty h3 { font-size:17px; font-weight:700; margin:0 0 6px; color:var(--kwd-gray-900); }
.kwd-lk-empty p { font-size:14px; color:var(--kwd-gray-600); margin:0 0 18px; line-height:1.5; }
.kwd-lk-empty .kwd-btn { width:auto; padding:12px 28px; }
.kwd-lk-skel { aspect-ratio:3/4.9; border-radius:18px; background:linear-gradient(100deg,var(--kwd-pink-50) 30%,#fff6f9 50%,var(--kwd-pink-50) 70%); background-size:200% 100%; animation:kwd-lk-shimmer 1.2s linear infinite; }
@keyframes kwd-lk-shimmer { to { background-position:-200% 0; } }
@media (prefers-reduced-motion:reduce){ .kwd-lk-skel{animation:none} .kwd-lk-card{transition:none} }
@media (max-width:340px){ .kwd-lk-grid{gap:8px} .kwd-lk-name{font-size:14px} }

/* ---------- Today's picks ---------- */
.kwd-picks-wrap { margin:0 0 20px; }
.kwd-picks-wrap[hidden] { display:none; }
.kwd-picks-head { display:flex; align-items:baseline; justify-content:space-between; margin:0 2px 10px; }
.kwd-picks-title { margin:0; font-size:16px; font-weight:800; color:var(--kwd-gray-900); }
.kwd-picks-sub { margin:0; font-size:12px; color:var(--kwd-pink-600); font-weight:700; }
.kwd-picks-rail { display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding:2px 2px 8px; margin:0 -2px; scrollbar-width:none; }
.kwd-picks-rail::-webkit-scrollbar { display:none; }
.kwd-pick-card { position:relative; flex:0 0 auto; width:142px; height:206px; scroll-snap-align:start; border-radius:18px; overflow:hidden; cursor:pointer; box-shadow:0 3px 12px rgba(75,21,40,.16); -webkit-tap-highlight-color:transparent; }
.kwd-pick-card:focus-visible { outline:3px solid var(--kwd-pink-100); outline-offset:2px; }
.kwd-pick-photo { position:absolute; inset:0; background-size:cover; background-position:center; background-color:var(--kwd-pink-50); }
.kwd-pick-card::after { content:""; position:absolute; left:0; right:0; bottom:0; height:62%; background:linear-gradient(to top,rgba(30,10,18,.85),rgba(30,10,18,0)); pointer-events:none; }
.kwd-pick-score { position:absolute; top:8px; right:8px; z-index:2; background:rgba(255,255,255,.95); color:var(--kwd-pink-600); font-size:11px; font-weight:800; padding:3px 8px; border-radius:20px; }
.kwd-pick-info { position:absolute; left:10px; right:10px; bottom:10px; z-index:2; color:#fff; }
.kwd-pick-name { font-size:14px; font-weight:700; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-shadow:0 1px 3px rgba(0,0,0,.4); }
.kwd-pick-reason { margin-top:4px; font-size:11px; line-height:1.3; font-weight:600; opacity:.95; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* ---------- Likes panel: Liked you / Viewed you ---------- */
.kwd-likes-subnav { background:var(--kwd-pink-50); }
.kwd-lktab { flex:1; background:none; border:none; border-radius:26px; padding:10px 4px; font-size:13px; font-weight:600; color:var(--kwd-gray-600); cursor:pointer; -webkit-tap-highlight-color:transparent; -webkit-appearance:none; appearance:none; outline:none; transition:background-color .15s ease,color .15s ease; }
.kwd-lktab.active { background:var(--kwd-pink-600); color:#fff; box-shadow:0 2px 8px rgba(212,83,126,.18); }
.kwd-lktab:focus-visible { box-shadow:inset 0 0 0 2px var(--kwd-pink-100); }
.kwd-likes-heading small { font-weight:500; color:var(--kwd-gray-600); font-size:12px; margin-left:6px; }
.kwd-viewed-ago { position:absolute; top:6px; left:6px; z-index:2; background:rgba(255,255,255,.94); color:var(--kwd-gray-900); font-size:10px; font-weight:700; padding:2px 7px; border-radius:20px; }
.kwd-viewer-locked { background:var(--kwd-pink-50); border:0; padding:0; }
.kwd-viewer-silhouette { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:var(--kwd-pink-100); }
.kwd-viewer-silhouette svg { width:44%; height:44%; }

/* ---- referral card ---- */
.kwd-ref-card { background: var(--kwd-pink-50); border-radius: 14px; padding: 16px; margin: 18px 0; }
.kwd-ref-card strong { color: var(--kwd-pink-800); font-size: 15px; }
.kwd-ref-card p { margin: 6px 0 12px; font-size: 13px; color: var(--kwd-gray-600); }
.kwd-ref-link { display: flex; gap: 8px; margin-bottom: 10px; }
.kwd-ref-link input { flex: 1; min-width: 0; padding: 10px 12px; border: 1px solid var(--kwd-gray-50); border-radius: 10px; font-size: 13px; background: #fff; }
.kwd-ref-link .kwd-btn { width: auto; padding: 0 16px; }
.kwd-ref-stats { margin: 10px 0 0 !important; font-size: 12px !important; }
.kwd-ref-note { background: var(--kwd-pink-50); color: var(--kwd-pink-800); border-radius: 10px; padding: 10px 12px; font-size: 13px; margin: 0 0 12px; }

/* ---- selfie verification ---- */
.kwd-selfie-badge { display: inline-flex; width: 16px; height: 16px; margin-left: 4px; vertical-align: -2px; color: var(--kwd-pink-600, #D4537E); }
.kwd-selfie-badge svg, .kwd-selfie-chip svg { display: block; width: 100%; height: 100%; }
.kwd-selfie-chip { position: absolute; top: 6px; left: 6px; width: 22px; height: 22px; color: var(--kwd-pink-600, #D4537E); filter: drop-shadow(0 1px 2px rgba(0,0,0,.35)); }
.kwd-selfie-card { background: #F0FAF6; border-radius: 14px; padding: 16px; margin: 18px 0; }
.kwd-selfie-row { display: flex; gap: 12px; align-items: flex-start; }
.kwd-selfie-row strong { color: var(--kwd-pink-800, #C2255C); font-size: 15px; }
.kwd-selfie-row p { margin: 4px 0 0; font-size: 13px; color: var(--kwd-gray-600); }
.kwd-selfie-ico { flex: 0 0 34px; width: 34px; height: 34px; color: var(--kwd-pink-600, #D4537E); }
.kwd-selfie-ico.is-wait { color: #9aa6a1; }
.kwd-selfie-ico svg { display: block; width: 100%; height: 100%; }
.kwd-selfie-pose { margin: 14px 0 8px; padding: 12px; background: #fff; border-radius: 10px; font-size: 13px; color: var(--kwd-gray-600); text-align: center; }
.kwd-selfie-pose strong { display: block; margin-top: 4px; font-size: 17px; color: var(--kwd-pink-800, #C2255C); }
.kwd-selfie-note { font-size: 12px; color: var(--kwd-gray-600); margin: 0 0 12px; }
.kwd-selfie-reason { font-size: 13px; color: #A32D2D; margin: 10px 0 0; }
.kwd-notif-icon svg { width: 20px; height: 20px; }

/* ---- daily streak + flame badge ---- */
.kwd-flame { --f: #F28C1B; display: inline-flex; align-items: center; gap: 1px; margin-left: 4px; padding: 1px 6px 1px 3px; border-radius: 10px; background: color-mix(in srgb, var(--f) 14%, #fff); color: var(--f); font-size: 11px; line-height: 14px; font-weight: 700; vertical-align: 1px; }
.kwd-flame svg { display: block; width: 13px; height: 14px; flex: 0 0 auto; }
.kwd-flame b { font-weight: 700; }
.kwd-flame-t1 { --f: #F28C1B; }
.kwd-flame-t2 { --f: #E5382B; }
.kwd-flame-t3 { --f: #2D7FF9; }
.kwd-flame-chip { position: absolute; top: 6px; left: 34px; margin: 0; background: rgba(255,255,255,.95); box-shadow: 0 1px 2px rgba(0,0,0,.3); }
.kwd-streak-card { background: #FFF6E5; border-radius: 14px; padding: 16px; margin: 18px 0; }
.kwd-streak-row { display: flex; gap: 12px; align-items: flex-start; }
.kwd-streak-row strong { color: #8A5300; font-size: 15px; }
.kwd-streak-row p { margin: 4px 0 0; font-size: 13px; color: var(--kwd-gray-600); }
.kwd-flame-big { --f: #F28C1B; flex: 0 0 34px; width: 34px; height: 38px; color: var(--f); }
.kwd-flame-big svg { display: block; width: 100%; height: 100%; }
.kwd-flame-big.kwd-flame-t1 { --f: #F28C1B; }
.kwd-flame-big.kwd-flame-t2 { --f: #E5382B; }
.kwd-flame-big.kwd-flame-t3 { --f: #2D7FF9; }
.kwd-flame-big.is-off { color: #C9BFAE; }
.kwd-streak-bar { height: 8px; border-radius: 4px; background: #F1DDB8; margin-top: 12px; overflow: hidden; }
.kwd-streak-bar i { display: block; height: 100%; background: #F28C1B; border-radius: 4px; }

/* ---- discover filters ---- */
.kwd-filter-bar { display: flex; justify-content: flex-end; margin: 4px 0 10px; }
.kwd-filter-btn { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 20px; border: 1.5px solid var(--kwd-gray-200); background: #fff; color: var(--kwd-gray-900); font-size: 13px; font-weight: 600; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.kwd-filter-btn svg { width: 16px; height: 16px; }
.kwd-filter-btn b { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--kwd-pink-600); color: #fff; font-size: 11px; line-height: 18px; text-align: center; box-sizing: border-box; }
.kwd-filter-btn.is-active { border-color: var(--kwd-pink-600); color: var(--kwd-pink-600); }
.kwd-filter-sheet { max-height: 85vh; }
.kwd-filter-sheet .kwd-btn { margin-top: 12px; }
.kwd-fs-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 14px 0; }
.kwd-fs-label { font-size: 14px; font-weight: 600; color: var(--kwd-gray-900); }
.kwd-fs-age { display: flex; align-items: center; gap: 8px; }
.kwd-fs-age input, .kwd-fs-row input[type=text] { padding: 9px 10px; border: 1.5px solid var(--kwd-gray-200); border-radius: 10px; font-size: 15px; box-sizing: border-box; }
.kwd-fs-age input { width: 64px; text-align: center; }
.kwd-fs-row input[type=text] { width: 58%; }
.kwd-fs-toggle { display: flex; align-items: center; gap: 10px; margin: 14px 0; font-size: 14px; color: var(--kwd-gray-900); cursor: pointer; }
.kwd-fs-toggle input { width: 20px; height: 20px; flex: 0 0 auto; }
.kwd-fs-group { margin-top: 18px; padding-top: 6px; border-top: 1px solid var(--kwd-gray-100, #eee); }
.kwd-fs-grouphead { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; }
.kwd-fs-lock { padding: 2px 9px; border-radius: 10px; background: var(--kwd-pink-50); color: var(--kwd-pink-600); font-size: 11px; font-weight: 700; }
.kwd-fs-group.is-locked { opacity: .6; cursor: pointer; }
.kwd-fs-group.is-locked input { pointer-events: none; }

/* ---- district picker ---- */
.kwd-district-input { cursor: pointer; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888780' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center / 18px; padding-right: 38px !important; text-overflow: ellipsis; }
.kwd-district-input.is-legacy { border-color: var(--kwd-pink-600) !important; }
.kwd-district-hint { display: block; margin-top: 6px; font-size: 12px; color: var(--kwd-pink-600); }
.kwd-fs-row input.kwd-district-input { width: 58%; }
body.kwd-dp-open { overflow: hidden; }
.kwd-dp { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: flex-end; justify-content: center; background: rgba(0,0,0,.5); backdrop-filter: blur(3px); }
.kwd-dp-sheet { display: flex; flex-direction: column; width: min(560px, 100%); height: min(86vh, 640px); background: #fff; border-radius: 22px 22px 0 0; box-shadow: 0 -12px 42px rgba(0,0,0,.25); overflow: hidden; }
.kwd-dp-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px 6px; }
.kwd-dp-head strong { font-size: 17px; color: var(--kwd-gray-900); }
.kwd-dp-x { width: 34px; height: 34px; border: 0; border-radius: 50%; background: var(--kwd-pink-50); color: var(--kwd-pink-600); font-size: 20px; line-height: 1; cursor: pointer; padding: 0; }
.kwd-dp-search { position: relative; margin: 8px 16px 6px; }
.kwd-dp-search svg { position: absolute; left: 13px; top: 50%; width: 18px; height: 18px; margin-top: -9px; color: #888780; pointer-events: none; }
.kwd-dp-q { width: 100%; box-sizing: border-box; padding: 12px 14px 12px 40px; border: 1.5px solid var(--kwd-gray-200); border-radius: 14px; font-size: 16px; background: var(--kwd-gray-50); outline: none; -webkit-appearance: none; appearance: none; }
.kwd-dp-q:focus { border-color: var(--kwd-pink-600); background: #fff; }
.kwd-dp-chips { display: flex; gap: 8px; padding: 6px 16px 10px; overflow-x: auto; scrollbar-width: none; }
.kwd-dp-chips::-webkit-scrollbar { display: none; }
.kwd-dp-chips[hidden] { display: none; }
.kwd-dp-chip { flex: 0 0 auto; padding: 6px 14px; border-radius: 16px; border: 1.5px solid var(--kwd-gray-200); background: #fff; color: var(--kwd-gray-900); font-size: 13px; font-weight: 600; cursor: pointer; }
.kwd-dp-chip.is-on { background: var(--kwd-pink-600); border-color: var(--kwd-pink-600); color: #fff; }
.kwd-dp-list { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 0 8px calc(14px + env(safe-area-inset-bottom, 0px)); position: relative; }
.kwd-dp-region { position: sticky; top: 0; z-index: 1; padding: 10px 10px 6px; background: #fff; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #888780; }
.kwd-dp-row { display: flex; align-items: center; justify-content: space-between; width: 100%; box-sizing: border-box; padding: 13px 12px; border: 0; border-radius: 12px; background: none; text-align: left; font-size: 16px; color: var(--kwd-gray-900); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.kwd-dp-row:hover, .kwd-dp-row:active { background: var(--kwd-gray-50); }
.kwd-dp-row small { display: block; margin-top: 2px; font-size: 12px; color: #888780; }
.kwd-dp-row mark { background: none; color: var(--kwd-pink-600); font-weight: 700; }
.kwd-dp-row svg { flex: 0 0 20px; width: 20px; height: 20px; color: var(--kwd-pink-600); }
.kwd-dp-row.is-on { background: var(--kwd-pink-50); font-weight: 600; }
.kwd-dp-any { margin-top: 4px; font-weight: 600; }
.kwd-dp-empty { margin: 36px 20px; text-align: center; font-size: 14px; line-height: 1.5; color: #888780; }
@media (min-width: 600px) { .kwd-dp { align-items: center; } .kwd-dp-sheet { border-radius: 20px; } }


/* ==== v1.15 app skin: one bold pink, rounded, floating, photo-first ==== */
html { background: #FFF6F9; }
.kwd-app { background: #FFF6F9; padding-left: 10px; padding-right: 10px; padding-bottom: 104px; min-height: 100vh; box-sizing: border-box; }

/* Header: pink banner */
.kwd-app .kwd-header-welcome { background: linear-gradient(135deg,#F0508A,#C2255C); border: 0; border-radius: 0 0 28px 28px; margin: 0 -10px 14px; padding: 14px 20px 16px; min-height: 72px; box-shadow: 0 10px 24px -12px rgba(194,37,92,.6); }
.kwd-welcome-small { color: rgba(255,255,255,.85); }
.kwd-welcome-copy strong { color: #fff; }
.kwd-header-welcome .kwd-brand-logo { filter: brightness(0) invert(1); }
.kwd-header-bell { background: rgba(255,255,255,.22); border: 0; color: #fff; width: 42px; height: 42px; }
.kwd-header-avatar { border: 2.5px solid #fff; box-shadow: 0 3px 10px rgba(60,8,28,.25); }
.kwd-header-login { background: #fff !important; color: #C2255C !important; border: 0 !important; border-radius: 999px; font-weight: 800; }
.kwd-notif-badge { border: 2px solid #C2255C; }

/* Sub-tabs (For you / People you like, Liked you / Viewed you) */
.kwd-subnav { background: #FFE3EC; }
.kwd-subtab { font-size: 14px; font-weight: 700; color: #9A4A66; }
.kwd-subtab.active, .kwd-lktab.active { background: linear-gradient(135deg,#F0508A,#C2255C); color: #fff; box-shadow: 0 4px 12px rgba(194,37,92,.35); }

/* Floating bottom bar */
.kwd-bottom-nav { bottom: 12px; width: calc(100% - 24px); max-width: 456px; border: 0; border-radius: 28px; padding: 7px; background: #fff; box-shadow: 0 12px 32px rgba(194,37,92,.28); margin-bottom: env(safe-area-inset-bottom, 0); }
.kwd-bottom-nav .kwd-tab { border-radius: 21px; padding: 8px 4px 7px; font-size: 12px; color: #8D6E7B; }
.kwd-bottom-nav .kwd-tab svg { width: 24px; height: 24px; }
.kwd-bottom-nav .kwd-tab.active,
.kwd-bottom-nav .kwd-tab.active:hover,
.kwd-bottom-nav .kwd-tab.active:focus,
.kwd-bottom-nav .kwd-tab.active:active { background: #FFE3EC !important; color: #C2255C; }
.kwd-likes-badge, .kwd-chat-badge { background: #C2255C !important; border: 2px solid #fff; box-sizing: content-box; }

/* New matches row */
.kwd-nm-wrap { margin: 0 0 16px; }
.kwd-nm-wrap[hidden] { display: none; }
.kwd-nm-title { margin: 0 2px 10px; font-size: 14px; font-weight: 800; color: #C2255C; }
.kwd-nm-rail { display: flex; gap: 14px; overflow-x: auto; padding: 2px 2px 6px; margin: 0 -2px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.kwd-nm-rail::-webkit-scrollbar { display: none; }
.kwd-nm-item { flex: 0 0 auto; width: 68px; background: none; border: 0; padding: 0; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 6px; -webkit-tap-highlight-color: transparent; }
.kwd-nm-ring { width: 64px; height: 64px; border-radius: 50%; padding: 3px; background: linear-gradient(135deg,#F0508A,#FFB3CC); box-sizing: border-box; display: block; box-shadow: 0 4px 12px rgba(194,37,92,.3); }
.kwd-nm-ring img, .kwd-nm-initial { width: 100%; height: 100%; border-radius: 50%; border: 2.5px solid #fff; box-sizing: border-box; object-fit: cover; display: flex; align-items: center; justify-content: center; background: #FFE3EC; color: #C2255C; font-weight: 800; font-size: 20px; }
.kwd-nm-name { max-width: 68px; font-size: 12px; font-weight: 700; color: var(--kwd-gray-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kwd-nm-item:active .kwd-nm-ring { transform: scale(.95); }

/* Discover card: full-bleed photo, name over a soft scrim, big round actions */
.kwd-discover-card { min-height: 500px; display: flex; flex-direction: column; justify-content: flex-end; border-radius: 28px; background: #C2255C; box-shadow: 0 16px 30px -12px rgba(194,37,92,.55); }
.kwd-discover-avatar-wrap { position: absolute; inset: 0; padding: 0; z-index: 0; }
.kwd-discover-avatar-img { width: 100%; height: 100%; border-radius: 0; box-shadow: none; background: linear-gradient(160deg,#FFB3CC,#E8457F 60%,#8E1B47) center/cover no-repeat; }
.kwd-discover-card-body { margin: 0; padding: 110px 20px 20px; background: linear-gradient(to top,rgba(60,8,28,.88) 0%,rgba(60,8,28,.6) 55%,rgba(60,8,28,0) 100%); }
.kwd-discover-actions { justify-content: center; gap: 22px; }
.kwd-discover-action { width: 58px; height: 58px; border: 0; }
.kwd-discover-like { width: 76px; height: 76px; border: 3px solid #F0508A; box-shadow: 0 0 0 5px rgba(240,80,138,.3), 0 10px 24px rgba(194,37,92,.45); color: #D6336C; }
.kwd-discover-like.is-liked { background: linear-gradient(135deg,#F0508A,#C2255C); border-color: #fff; color: #fff; }
.kwd-discover-like .kwd-action-svg { width: 34px; height: 34px; }
.kwd-discover-message { color: #D6336C; }
.kwd-filter-btn { border-radius: 999px; border: 0; background: #fff; color: #C2255C; font-weight: 800; box-shadow: 0 2px 8px rgba(194,37,92,.14); }

/* Messages: soft rounded rows */
.kwd-matches-list { background: transparent; gap: 10px; }
.kwd-chat-row { background: #fff; border: 0; border-radius: 20px; padding: 12px 14px; box-shadow: 0 2px 10px rgba(194,37,92,.08); }
.kwd-chat-row img, .kwd-chat-initial { width: 54px; height: 54px; }
.kwd-chat-row-info strong { font-size: 16px; font-weight: 800; }
.kwd-chat-row-info small { font-size: 13px; }
.kwd-row-unread { background: linear-gradient(135deg,#F0508A,#C2255C) !important; color: #fff !important; }
.kwd-thread { background: transparent; }
.kwd-thread-header { padding: 12px 4px; font-size: 18px; border-bottom: 0; }
.kwd-btn-primary { background: linear-gradient(135deg,#F0508A,#C2255C); border: 0; box-shadow: 0 8px 20px -8px rgba(194,37,92,.6); }

/* ==== v1.15.1 fixes ==== */
/* No more theme-blue flash: the host theme styles button:hover/:focus/:active
   (blue). On touch, :hover sticks after a tap, so the Discover heart/pass/message
   buttons and the notification bell turned blue. Pin every state explicitly. */
.kwd-app .kwd-discover-action,
.kwd-app .kwd-discover-action:hover,
.kwd-app .kwd-discover-action:focus,
.kwd-app .kwd-discover-action:active { background-color: #fff !important; background-image: none !important; color: #D6336C !important; outline: none !important; }
.kwd-app .kwd-discover-like,
.kwd-app .kwd-discover-like:hover,
.kwd-app .kwd-discover-like:focus,
.kwd-app .kwd-discover-like:active { border-color: #F0508A !important; }
.kwd-app .kwd-discover-like.is-liked,
.kwd-app .kwd-discover-like.is-liked:hover,
.kwd-app .kwd-discover-like.is-liked:focus,
.kwd-app .kwd-discover-like.is-liked:active { background-color: #C2255C !important; background-image: linear-gradient(135deg,#F0508A,#C2255C) !important; color: #fff !important; border-color: #fff !important; }
.kwd-app .kwd-discover-pass,
.kwd-app .kwd-discover-pass:hover,
.kwd-app .kwd-discover-pass:focus,
.kwd-app .kwd-discover-pass:active { color: #c14b6e !important; }
.kwd-app .kwd-header-bell,
.kwd-app .kwd-header-bell:hover,
.kwd-app .kwd-header-bell:focus,
.kwd-app .kwd-header-bell:active,
.kwd-app .kwd-header-bell.is-open { background: rgba(255,255,255,.22) !important; background-image: none !important; color: #fff !important; outline: none !important; box-shadow: none !important; }
.kwd-app .kwd-header-bell:active { background: rgba(255,255,255,.4) !important; }
.kwd-app .kwd-header-bell svg { color: #fff; stroke: currentColor; }
.kwd-app .kwd-discover-action:focus-visible,
.kwd-app .kwd-header-bell:focus-visible { outline: 3px solid rgba(255,255,255,.7) !important; outline-offset: 2px; }

/* People You Like: keep the Message + unlike-heart pair always visible. */
.kwd-lk-actions { display: flex !important; gap: 8px; }
.kwd-lk-btn.kwd-lk-msg { flex: 1 1 auto; min-width: 0; }
.kwd-app .kwd-lk-btn.kwd-lk-unlike,
.kwd-app .kwd-lk-btn.kwd-lk-unlike:hover,
.kwd-app .kwd-lk-btn.kwd-lk-unlike:focus { display: inline-flex !important; flex: 0 0 44px !important; width: 44px !important; min-width: 44px !important; background: var(--kwd-pink-50) !important; color: #C2255C !important; visibility: visible !important; opacity: 1 !important; padding: 0; }
.kwd-app .kwd-lk-btn.kwd-lk-unlike:active { background: #FFD0E0 !important; }
.kwd-app .kwd-lk-btn.kwd-lk-unlike svg { display: block !important; width: 19px !important; height: 19px !important; fill: currentColor; stroke: currentColor; }
.kwd-app .kwd-lk-btn.kwd-lk-msg,
.kwd-app .kwd-lk-btn.kwd-lk-msg:hover,
.kwd-app .kwd-lk-btn.kwd-lk-msg:focus { background: var(--kwd-teal-800) !important; color: #fff !important; }

/* Profile sheet: liked state reads as a tappable "Unlike" */
.kwd-app .kwd-full-profile-like.is-liked,
.kwd-full-profile-like.is-liked:hover,
.kwd-full-profile-like.is-liked:focus { background: var(--kwd-pink-50) !important; color: #C2255C !important; border-color: var(--kwd-pink-100) !important; }
.kwd-full-profile-like:disabled { opacity: .6; }

/* ==== v1.15.2 sticky header ==== */
.kwd-app .kwd-header-welcome { position: sticky; top: 0; z-index: 900; transition: padding .2s ease, min-height .2s ease, box-shadow .2s ease; will-change: padding; }
body.admin-bar .kwd-app .kwd-header-welcome { top: 46px; }
@media (min-width: 783px) { body.admin-bar .kwd-app .kwd-header-welcome { top: 32px; } }
/* Compact once the member scrolls: slimmer bar, more room for profiles. */
.kwd-app .kwd-header-welcome.is-compact { padding-top: 8px; padding-bottom: 9px; min-height: 56px; box-shadow: 0 8px 20px -10px rgba(194,37,92,.7); }
.kwd-app .kwd-header-welcome.is-compact .kwd-header-bell { width: 38px; height: 38px; }
.kwd-app .kwd-header-welcome.is-compact .kwd-header-avatar { width: 38px; height: 38px; }
.kwd-app .kwd-header-welcome.is-compact .kwd-brand-logo { height: 24px; }
.kwd-app .kwd-header-welcome.is-compact .kwd-welcome-small { display: none; }
.kwd-notif-panel { z-index: 901; }
@media (prefers-reduced-motion: reduce) { .kwd-app .kwd-header-welcome { transition: none; } }

/* ==== v1.15.3 smart header + cleaner People You Like ==== */
.kwd-app .kwd-header-welcome { transition: padding .2s ease, min-height .2s ease, box-shadow .2s ease, transform .25s ease; }
.kwd-app .kwd-header-welcome.is-hidden { transform: translateY(calc(-100% - 40px)); box-shadow: none; }
.kwd-app.is-mine-view .kwd-nm-wrap { display: none !important; }
@media (prefers-reduced-motion: reduce) { .kwd-app .kwd-header-welcome.is-hidden { transition: none; } }

/* ==== v1.15.4 no-jitter header ==== */
/* The header's height must never change while scrolling (that shifted the page
   under the finger and re-triggered scroll events = "vibrating"). Only a GPU
   transform moves it; compact sizing is disabled. */
.kwd-app .kwd-header-welcome,
.kwd-app .kwd-header-welcome.is-compact { padding: 14px 20px 16px !important; min-height: 72px !important; transition: transform .28s cubic-bezier(.4,0,.2,1) !important; will-change: transform; backface-visibility: hidden; }
.kwd-app .kwd-header-welcome.is-compact .kwd-header-bell { width: 42px; height: 42px; }
.kwd-app .kwd-header-welcome.is-compact .kwd-header-avatar { width: 44px; height: 44px; }
.kwd-app .kwd-header-welcome.is-compact .kwd-brand-logo { height: inherit; }
.kwd-app .kwd-header-welcome.is-compact .kwd-welcome-small { display: inline; }
.kwd-app .kwd-header-welcome { overscroll-behavior: none; }

/* ==== v1.15.5 profile sheet buttons: no theme blue in any state ==== */
.kwd-app .kwd-full-profile-btn,
.kwd-full-profile-btn,
.kwd-full-profile-btn:hover,
.kwd-full-profile-btn:focus,
.kwd-full-profile-btn:active { background-color: #fff !important; background-image: none !important; color: #C2255C !important; border: 1.5px solid #F0508A !important; outline: none !important; box-shadow: none !important; }
.kwd-full-profile-btn.kwd-full-profile-like.is-liked,
.kwd-full-profile-btn.kwd-full-profile-like.is-liked:hover,
.kwd-full-profile-btn.kwd-full-profile-like.is-liked:focus,
.kwd-full-profile-btn.kwd-full-profile-like.is-liked:active { background-color: #FFE3EC !important; color: #C2255C !important; border-color: #F4C0D1 !important; }
.kwd-full-profile-btn.kwd-full-profile-message,
.kwd-full-profile-btn.kwd-full-profile-message:hover,
.kwd-full-profile-btn.kwd-full-profile-message:focus,
.kwd-full-profile-btn.kwd-full-profile-message:active { background-color: #D6336C !important; background-image: linear-gradient(135deg,#F0508A,#C2255C) !important; color: #fff !important; border-color: transparent !important; }
.kwd-full-profile-btn:active { transform: scale(.97); }
.kwd-bio-close, .kwd-bio-close:hover, .kwd-bio-close:focus, .kwd-bio-close:active { background-color: rgba(255,255,255,.94) !important; color: #C2255C !important; outline: none !important; }

/* ==== v1.15.6 chat = full-screen WhatsApp-style view ==== */
/* The open conversation covers the app header and floating nav, so the
   contact's name is never hidden under the sticky header and the message box
   is never hidden behind the bottom bar. The subscribe popup (z 1000) still
   sits above it. */
.kwd-app .kwd-thread.active { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; max-width: 560px; margin: 0 auto; height: 100vh; height: 100dvh; min-height: 0; z-index: 950; display: flex; flex-direction: column; background: #FFF6F9; box-sizing: border-box; }
.kwd-app .kwd-thread.active .kwd-thread-header { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; margin: 0; padding: calc(12px + env(safe-area-inset-top, 0px)) 14px 12px 8px; background: linear-gradient(135deg,#F0508A,#C2255C); color: #fff; font-size: 18px; border-radius: 0 0 22px 22px; box-shadow: 0 8px 20px -12px rgba(194,37,92,.7); }
.kwd-app .kwd-thread.active .kwd-thread-header strong { color: #fff; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kwd-app .kwd-thread-back,
.kwd-app .kwd-thread-back:hover,
.kwd-app .kwd-thread-back:focus,
.kwd-app .kwd-thread-back:active { flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%; border: 0 !important; background: rgba(255,255,255,.22) !important; color: #fff !important; font-size: 30px; line-height: 1; padding: 0 0 4px; display: flex; align-items: center; justify-content: center; cursor: pointer; outline: none !important; box-shadow: none !important; }
.kwd-app .kwd-thread.active .kwd-messages { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 14px 14px 10px; }
.kwd-app .kwd-thread.active .kwd-composer { flex: 0 0 auto; margin: 6px 10px calc(10px + env(safe-area-inset-bottom, 0px)); }
.kwd-app .kwd-thread.active .kwd-lock-panel,
.kwd-app .kwd-thread.active > .kwd-empty { padding: 24px; }
.kwd-app .kwd-thread.active .kwd-conversation-starters { text-align: center; }
.kwd-app .kwd-thread.active .kwd-starter-list { text-align: left; }

/* ==== v1.15.7 single pink verified seal (selfie verified) ==== */
.kwd-selfie-badge, .kwd-selfie-chip, .kwd-selfie-ico:not(.is-wait) { color: #E8457F; }
.kwd-selfie-badge { width: 18px; height: 18px; }
.kwd-selfie-row strong, .kwd-selfie-pose strong { color: #C2255C; }

/* ==== v1.15.10 show the whole photo (no cropping) ==== */
/* The photo is drawn "contain" so nothing is cut off, over a blurred, enlarged
   copy of itself so the leftover space looks intentional instead of empty.
   Both layers inherit the photo from the element's inline background-image. */
.kwd-full-profile-photo,
.kwd-profile-photo { position: relative; overflow: hidden; isolation: isolate; background-size: auto !important; }
.kwd-full-profile-photo::before,
.kwd-profile-photo::before,
.kwd-full-profile-photo::after,
.kwd-profile-photo::after { content: ""; position: absolute; background-image: inherit; background-repeat: no-repeat; background-position: center; }
.kwd-full-profile-photo::before,
.kwd-profile-photo::before { inset: -24px; background-size: cover; filter: blur(22px) saturate(1.15) brightness(.85); z-index: 0; }
.kwd-full-profile-photo::after,
.kwd-profile-photo::after { inset: 0; background-size: contain; z-index: 1; }

/* Own profile: a rounded portrait frame instead of a tiny cropped circle. */
.kwd-app .kwd-profile-photo { width: 168px; height: 224px; border-radius: 22px; border: 3px solid #fff; box-shadow: 0 10px 24px -10px rgba(194,37,92,.5); background-color: var(--kwd-pink-50); }

/* v1.15.11: "Liked you" sheet photo — same whole-photo treatment */
.kwd-admirer-sheet-photo { position: relative; overflow: hidden; isolation: isolate; background-size: auto !important; aspect-ratio: 4/5; max-height: 50vh; }
.kwd-admirer-sheet-photo::before,
.kwd-admirer-sheet-photo::after { content: ""; position: absolute; background-image: inherit; background-repeat: no-repeat; background-position: center; }
.kwd-admirer-sheet-photo::before { inset: -24px; background-size: cover; filter: blur(22px) saturate(1.15) brightness(.85); z-index: 0; }
.kwd-admirer-sheet-photo::after { inset: 0; background-size: contain; z-index: 1; }

/* v1.15.12: "Liked you" card fits the screen — photo takes the leftover space,
   so name, bio and the Like / Message buttons are all visible with one tap. */
.kwd-admirer-sheet { align-items: center; padding: 12px; }
.kwd-admirer-sheet .kwd-admirer-sheet-card { display: flex; flex-direction: column; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); overflow: hidden; padding-bottom: 18px; }
.kwd-admirer-sheet .kwd-admirer-sheet-photo { flex: 1 1 auto; min-height: 180px; max-height: none; aspect-ratio: auto; margin-bottom: 12px; }
.kwd-admirer-sheet .kwd-admirer-sheet-card > :not(.kwd-admirer-sheet-photo):not(.kwd-bio-close) { flex: 0 0 auto; }
.kwd-admirer-sheet .kwd-admirer-sheet-card h3 { margin-bottom: 8px; }
.kwd-admirer-sheet .kwd-sheet-bio { margin: 0 0 14px !important; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.kwd-admirer-sheet .kwd-sheet-meta, .kwd-admirer-sheet .kwd-sheet-matched { margin-bottom: 8px; }

/* Online payment (Marz Pay) inside the subscribe / boost modal */
.kwd-pay-price { font-size: 22px; font-weight: 800; color: var(--kwd-gray-900); margin: 4px 0 14px; }
.kwd-pay-label { display: block; font-size: 12px; font-weight: 700; color: var(--kwd-gray-600); margin-bottom: 6px; }
.kwd-pay-input { width: 100%; box-sizing: border-box; border: 1.5px solid var(--kwd-gray-50); background: var(--kwd-gray-50); border-radius: 13px; padding: 13px 14px; font-size: 16px; margin-bottom: 12px; }
.kwd-pay-input:focus { outline: none; border-color: var(--kwd-pink-600); background: #fff; }
.kwd-pay-hint { font-size: 12.5px; line-height: 1.5; color: var(--kwd-gray-600); margin: 10px 0 0; text-align: center; }
.kwd-pay-wait { text-align: center; padding: 12px 0 4px; }
.kwd-pay-wait-title { font-size: 17px; font-weight: 800; margin: 14px 0 0; color: var(--kwd-gray-900); }
.kwd-pay-spinner { width: 38px; height: 38px; margin: 0 auto; border-radius: 50%; border: 4px solid var(--kwd-pink-100); border-top-color: var(--kwd-pink-600); animation: kwd-pay-spin .9s linear infinite; }
@keyframes kwd-pay-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .kwd-pay-spinner { animation-duration: 3s; } }
.kwd-pay-msg { margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; font-size: 13px; line-height: 1.45; background: var(--kwd-gray-50); color: var(--kwd-gray-900); }
.kwd-pay-msg.is-error { background: #fdecf2; color: #8f1f48; }
.kwd-pay-online[hidden], .kwd-pay-manual[hidden], .kwd-pay-form[hidden], .kwd-pay-wait[hidden], .kwd-pay-msg[hidden] { display: none; }

/* ---------- v1.19 subscribe sheet ---------- */
#kwd-subscribe-modal { align-items: flex-end; padding: 0; background: rgba(44,20,32,.5); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.kwd-sheet { max-width: 460px; border-radius: 26px 26px 0 0; padding: 10px 22px calc(22px + env(safe-area-inset-bottom, 0px)); max-height: 92vh; animation: kwd-sheet-up .28s cubic-bezier(.2,.8,.2,1); }
@keyframes kwd-sheet-up { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (min-width: 600px) { #kwd-subscribe-modal { align-items: center; padding: 20px; } .kwd-sheet { border-radius: 24px; padding-bottom: 24px; } }
.kwd-sheet-grab { display: block; width: 40px; height: 4px; border-radius: 99px; background: #e3dfe2; margin: 0 auto 16px; }
.kwd-sheet .kwd-modal-close { top: 14px; right: 16px; width: 32px; height: 32px; border-radius: 50%; background: var(--kwd-gray-50); display: flex; align-items: center; justify-content: center; font-size: 0; color: var(--kwd-gray-600); padding: 0; }
.kwd-sheet .kwd-modal-close svg { width: 14px; height: 14px; }
.kwd-sheet-head h3 { margin: 0 0 6px; font-size: 23px; font-weight: 800; letter-spacing: -.01em; padding-right: 40px; color: var(--kwd-gray-900); }
.kwd-sheet-head #kwd-modal-desc { margin: 0; color: var(--kwd-gray-600); font-size: 14.5px; line-height: 1.5; }
.kwd-teaser { display: flex; align-items: center; gap: 14px; background: linear-gradient(135deg, #fff1f6, #fbeaf0); border: 1px solid var(--kwd-pink-100); border-radius: 16px; padding: 10px 14px; margin: 0 0 16px; }
.kwd-teaser[hidden] { display: none; }
.kwd-teaser-faces { display: flex; flex: none; padding-left: 4px; }
.kwd-tface { width: 38px; height: 38px; border-radius: 50%; margin-left: -12px; border: 2px solid #fff; display: flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(135deg, #f093b4, #d6336c); filter: blur(1.6px); }
.kwd-tface:first-child { margin-left: 0; }
.kwd-tface svg { width: 60%; height: 60%; opacity: .9; }
.kwd-teaser-text { margin: 0; font-weight: 700; font-size: 14px; color: var(--kwd-pink-800); line-height: 1.35; }
.kwd-perks { list-style: none; margin: 16px 0 2px; padding: 0; display: grid; gap: 10px; }
.kwd-perks li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--kwd-gray-900); }
.kwd-perks li i { flex: none; width: 24px; height: 24px; border-radius: 50%; background: var(--kwd-pink-50); color: var(--kwd-pink-600); display: flex; align-items: center; justify-content: center; }
.kwd-perks li i svg { width: 13px; height: 13px; }
.kwd-sheet .kwd-pay-price { display: flex; align-items: baseline; gap: 6px; margin: 18px 0 12px; }
.kwd-pay-price .amt { font-size: 32px; font-weight: 800; letter-spacing: -.02em; color: var(--kwd-gray-900); }
.kwd-pay-price .per { font-size: 14px; color: var(--kwd-gray-600); font-weight: 600; }
.kwd-pay-field { position: relative; margin-bottom: 12px; }
.kwd-pay-field .kwd-pay-input { margin-bottom: 0; padding-right: 46px; }
.kwd-pay-ok { position: absolute; right: 14px; top: 50%; margin-top: -10px; width: 20px; height: 20px; border-radius: 50%; background: #14a06a; color: #fff; display: flex; align-items: center; justify-content: center; opacity: 0; transform: scale(.6); transition: opacity .2s, transform .2s; }
.kwd-pay-ok svg { width: 12px; height: 12px; }
.kwd-pay-field.is-ok .kwd-pay-ok { opacity: 1; transform: none; }
#kwd-pay-btn { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; font-size: 16px; padding: 15px; box-sizing: border-box; }
#kwd-pay-btn svg { width: 16px; height: 16px; flex: none; }
#kwd-pay-btn:disabled { opacity: .7; }
.kwd-trust { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 12px 0 0; font-size: 12.5px; font-weight: 700; color: var(--kwd-gray-600); }
.kwd-trust > svg { width: 14px; height: 14px; color: #14a06a; }
.kwd-mm-logos { display: inline-flex; align-items: center; gap: 6px; margin-left: 4px; }
.kwd-mm-logos img { width: 30px; height: 30px; border-radius: 8px; display: block; box-shadow: 0 1px 3px rgba(0,0,0,.18); object-fit: cover; }
.kwd-pay-steps { list-style: none; display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; margin: 16px 0 6px; padding: 0; font-size: 11.5px; font-weight: 700; color: var(--kwd-gray-200); }
.kwd-pay-steps li { display: flex; align-items: center; gap: 6px; }
.kwd-pay-steps li:not(:last-child)::after { content: ""; width: 16px; height: 2px; background: #e8e4e7; }
.kwd-pay-steps .done { color: #14a06a; }
.kwd-pay-steps .now { color: var(--kwd-pink-600); }
.kwd-pay-success { display: none; flex-direction: column; align-items: center; text-align: center; padding: 26px 0 10px; }
#kwd-subscribe-modal.is-success .kwd-pay-success { display: flex; }
#kwd-subscribe-modal.is-success .kwd-sheet-head, #kwd-subscribe-modal.is-success .kwd-perks, #kwd-subscribe-modal.is-success .kwd-pay-online, #kwd-subscribe-modal.is-success .kwd-pay-manual { display: none; }
.kwd-check { width: 76px; height: 76px; border-radius: 50%; background: linear-gradient(135deg, #1fbf85, #0f9d6a); color: #fff; display: flex; align-items: center; justify-content: center; animation: kwd-pop .5s cubic-bezier(.2,1.4,.4,1); }
.kwd-check svg { width: 38px; height: 38px; }
.kwd-check path { stroke-dasharray: 30; stroke-dashoffset: 30; animation: kwd-draw .45s .2s forwards; }
@keyframes kwd-pop { from { transform: scale(.3); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes kwd-draw { to { stroke-dashoffset: 0; } }
.kwd-pay-success h4 { margin: 16px 0 4px; font-size: 22px; font-weight: 800; color: var(--kwd-gray-900); }
.kwd-pay-success p { margin: 0; color: var(--kwd-gray-600); }
@media (prefers-reduced-motion: reduce) { .kwd-sheet, .kwd-check, .kwd-check path { animation: none; } .kwd-check path { stroke-dashoffset: 0; } }

/* ---------- v1.19.2 checkout sheet redesign (boost + subscribe) ---------- */
.kwd-sheet-hero { display: flex; align-items: center; gap: 16px; margin: 4px 0 2px; }
.kwd-hero-icon { position: relative; flex: none; width: 84px; height: 84px; border-radius: 50%; background: linear-gradient(145deg, var(--kwd-pink-50), #f8cfde); display: flex; align-items: center; justify-content: center; color: var(--kwd-pink-800); }
.kwd-hero-icon svg.win { width: 52px; height: 52px; }
.kwd-hero-icon .fig { fill: var(--kwd-pink-600); }
.kwd-hero-badge { position: absolute; top: 0; right: -2px; width: 30px; height: 30px; border-radius: 50%; background: linear-gradient(145deg, #ffc247, #f59e0b); border: 3px solid #fff; color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 6px rgba(245,158,11,.35); }
.kwd-hero-badge svg { width: 15px; height: 15px; }
.kwd-hero-text { flex: 1; min-width: 0; }
.kwd-sheet-head .kwd-hero-text h3 { margin: 0 0 6px; padding-right: 34px; font-size: 24px; line-height: 1.15; color: var(--kwd-pink-900); }
.kwd-sheet-head .kwd-hero-text #kwd-modal-desc { font-size: 14px; line-height: 1.5; }

.kwd-perks { margin: 18px 0 0; gap: 12px; }
.kwd-perks li { gap: 12px; font-size: 15px; }
.kwd-perks li i { width: 28px; height: 28px; background: var(--kwd-pink-50); box-shadow: inset 0 0 0 1px #f8dbe6; }
.kwd-perks li i svg { width: 14px; height: 14px; }

.kwd-fee-card { position: relative; overflow: hidden; display: flex; align-items: center; gap: 14px; margin: 18px 0 12px; padding: 14px 16px; border-radius: 16px; border: 1px solid #f6d3df; background: linear-gradient(120deg, #fff4f8 0%, #fce5ee 55%, #f7cddc 100%); }
.kwd-fee-card::after { content: ""; position: absolute; right: -46px; top: -38px; width: 160px; height: 160px; border-radius: 50%; background: rgba(255,255,255,.4); pointer-events: none; }
.kwd-fee-icon { position: relative; z-index: 1; flex: none; width: 46px; height: 46px; border-radius: 50%; background: #fff; color: var(--kwd-pink-600); display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 8px rgba(214,51,108,.16); }
.kwd-fee-icon svg { width: 22px; height: 22px; }
.kwd-fee-body { position: relative; z-index: 1; min-width: 0; }
.kwd-fee-label { display: block; font-size: 14px; font-weight: 700; color: var(--kwd-pink-600); margin-bottom: 1px; }
.kwd-fee-card .kwd-pay-price { margin: 0; display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.kwd-fee-card .kwd-pay-price .amt { font-size: 30px; line-height: 1.1; color: var(--kwd-pink-900); }

.kwd-pay-form { border: 1px solid #f1e3e9; border-radius: 18px; padding: 16px; background: #fff; }
.kwd-pay-form .kwd-pay-label { font-size: 15px; font-weight: 800; color: var(--kwd-gray-900); margin-bottom: 10px; }
.kwd-pay-field { margin-bottom: 14px; }
.kwd-pay-field .kwd-pay-input { padding: 14px 46px 14px 46px; background: #fff; border: 1.5px solid #ead9e0; border-radius: 14px; font-size: 17px; }
.kwd-pay-field .kwd-pay-input:focus { border-color: var(--kwd-pink-600); box-shadow: 0 0 0 3px rgba(214,51,108,.14); }
.kwd-pay-phone-ico { position: absolute; left: 15px; top: 50%; width: 22px; height: 22px; margin-top: -11px; color: var(--kwd-gray-600); pointer-events: none; transition: color .2s; }
.kwd-pay-field.is-ok .kwd-pay-phone-ico, .kwd-pay-field:focus-within .kwd-pay-phone-ico { color: var(--kwd-pink-600); }

#kwd-pay-btn { position: relative; height: 56px; padding: 0 52px; border: 0; border-radius: 999px; color: #fff; font-weight: 800; background: linear-gradient(135deg, #e9488a, #c2255c); box-shadow: 0 8px 18px rgba(214,51,108,.3); transition: transform .12s, box-shadow .12s; }
#kwd-pay-btn:active { transform: scale(.985); box-shadow: 0 4px 10px rgba(214,51,108,.28); }
#kwd-pay-btn svg { width: 20px; height: 20px; }
#kwd-pay-btn .kwd-pay-chev { position: absolute; right: 20px; top: 50%; margin-top: -9px; width: 18px; height: 18px; }

.kwd-trust { flex-wrap: wrap; gap: 10px; margin: 16px 0 0; font-size: 14px; font-weight: 600; }
.kwd-trust > svg { width: 22px; height: 22px; color: #14a06a; }
.kwd-trust-sep { width: 1px; height: 28px; background: #eadde3; }
.kwd-mm-logos { margin-left: 0; gap: 8px; }
.kwd-mm-logos img { width: 40px; height: 40px; border-radius: 10px; }

.kwd-pay-note { display: flex; align-items: center; gap: 12px; margin-top: 16px; padding-top: 14px; border-top: 1px solid #f1e5ea; }
.kwd-pay-note-ico { flex: none; width: 34px; height: 34px; border-radius: 50%; background: var(--kwd-pink-50); color: var(--kwd-pink-600); display: flex; align-items: center; justify-content: center; }
.kwd-pay-note-ico svg { width: 17px; height: 17px; }
.kwd-pay-note .kwd-pay-hint { margin: 0; text-align: left; font-size: 13.5px; }

@media (max-width: 380px) {
  .kwd-sheet { padding-left: 16px; padding-right: 16px; }
  .kwd-hero-icon { width: 68px; height: 68px; }
  .kwd-hero-icon svg.win { width: 42px; height: 42px; }
  .kwd-hero-badge { width: 26px; height: 26px; }
  .kwd-sheet-head .kwd-hero-text h3 { font-size: 21px; }
  .kwd-fee-card .kwd-pay-price .amt { font-size: 26px; }
  .kwd-pay-form { padding: 14px; }
  .kwd-mm-logos img { width: 34px; height: 34px; }
}
@media (max-height: 720px) {
  .kwd-perks { margin-top: 12px; gap: 8px; }
  .kwd-fee-card { margin: 12px 0 10px; }
}