.kwd-app {
	--kwd-pink-50: #FBEAF0;
	--kwd-pink-100: #F4C0D1;
	--kwd-pink-600: #D4537E;
	--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;
	max-width: 480px;
	margin: 0 auto;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	color: var(--kwd-gray-900);
}

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-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; }

/* 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-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: var(--kwd-pink-600); color: #fff; width: 100%; }
.kwd-btn-secondary { background: #fff; color: var(--kwd-gray-900); 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 var(--kwd-pink-100); color: var(--kwd-pink-600); padding: 8px 16px; }
.kwd-whatsapp-btn { background: #25D366; color: #fff; width: 100%; margin-top: 14px; }

.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; gap: 8px; }
.kwd-composer input { flex: 1; border: 1px solid var(--kwd-gray-50); border-radius: 20px; padding: 10px 14px; font-size: 14px; }
.kwd-composer button { background: var(--kwd-pink-600); color: #fff; border: none; border-radius: 50%; width: 40px; height: 40px; cursor: pointer; }

.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-teaser-stack { pointer-events: none; user-select: none; }
.kwd-teaser-card { position: relative; }
.kwd-teaser-photo { background: linear-gradient(160deg, var(--kwd-pink-100), var(--kwd-pink-50)); display: flex; align-items: center; justify-content: center; filter: blur(2px); }
.kwd-teaser-heart { width: 44px; height: 44px; color: var(--kwd-pink-600); opacity: .4; }
.kwd-teaser-heart svg { width: 44px; height: 44px; }
.kwd-teaser-blur { filter: blur(3px); }

.kwd-match-toast { position: fixed; top: 20px; left: 50%; transform: translateX(-50%); 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-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; }
.kwd-steps { padding-left: 18px; font-size: 13px; line-height: 1.7; color: var(--kwd-gray-900); }
.kwd-auth-modal-inner { padding-top: 30px; }

.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); }

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

.kwd-auth-toggle { display: flex; gap: 4px; background: var(--kwd-gray-50); border-radius: 30px; padding: 4px; margin-bottom: 20px; }
.kwd-auth-tab { flex: 1; background: none; border: none; border-radius: 26px; padding: 10px 4px; font-size: 14px; font-weight: 600; color: var(--kwd-gray-600); cursor: pointer; -webkit-tap-highlight-color: transparent; outline: none; transition: background-color .15s ease, color .15s ease; }
.kwd-auth-tab.active { background: var(--kwd-pink-600); color: #fff; }

.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; }
.kwd-save-status { font-size: 13px; color: var(--kwd-teal-800); margin-top: 10px; min-height: 16px; }

.kwd-logout-btn { text-align: center; }

.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); }
