/* ════════════════════════════════════════════════════
   KeyHR AI Search — Complete Stylesheet v2
   Uses !important throughout to override WordPress themes
════════════════════════════════════════════════════ */

:root {
    --khr-accent:       #DD3333;
    --khr-accent-hover: #bb2222;
    --khr-accent-glow:  rgba(221,51,51,0.35);
    --khr-accent-light: rgba(221,51,51,0.10);
    --khr-bg:           rgba(8,8,8,0.93);
    --khr-bg-2:         rgba(10,10,10,0.98);
    --khr-border:       rgba(255,255,255,0.07);
    --khr-border-mid:   rgba(255,255,255,0.13);
    --khr-text:         rgba(255,255,255,0.82);
    --khr-muted:        rgba(255,255,255,0.40);
    --khr-font:         'Rethink Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    --khr-radius-lg:    20px;
}

/* ══════════════════════════════════════════════════
   VIDEO BACKGROUND
══════════════════════════════════════════════════ */
.khr-video-wrap {
    position: relative !important;
    width: 65% !important;
    border-radius: var(--khr-radius-lg) !important;
    display: block !important;
    margin: 0 auto;
    background: #fff !important;
    padding: 20px;


    
}
.khr-bg-video {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    object-fit: cover !important;
    z-index: 0 !important;
    opacity: 0.45 !important;
    pointer-events: none !important;
    /* Ensure video plays — some themes block autoplay styles */
    display: block !important;
}
.khr-video-overlay {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    background: radial-gradient(ellipse at 40% 50%, rgba(221,51,51,0.10) 0%, rgba(0,0,0,0.60) 75%) !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

/* ══════════════════════════════════════════════════
   ANIMATED BORDER
   H pair: top(L→R) + bottom(R→L) simultaneously
   V pair: right(T→B) + left(B→T) simultaneously, +1.6s delay
══════════════════════════════════════════════════ */
.khr-border-box {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    border-radius: inherit !important;
    pointer-events: none !important;
    z-index: 20 !important;
    overflow: hidden !important;
}
.khr-bl-top,
.khr-bl-bottom {
    position: absolute !important;
    height: 1.5px !important;
    width: 60% !important;
    border-radius: 2px !important;
    background: linear-gradient(90deg, transparent 0%, rgba(221,51,51,0.5) 20%, rgba(221,51,51,0.85) 50%, rgba(221,51,51,0.5) 80%, transparent 100%) !important;
}
.khr-bl-top    { top: 0 !important; left: -60% !important; animation: khrSweepH 3.2s linear infinite !important; }
.khr-bl-bottom { bottom: 0 !important; right: -60% !important; animation: khrSweepHR 3.2s linear infinite !important; }
@keyframes khrSweepH  { 0%{left:-60%}  100%{left:100%}  }
@keyframes khrSweepHR { 0%{right:-60%} 100%{right:100%} }

.khr-bl-right,
.khr-bl-left {
    position: absolute !important;
    width: 1.5px !important;
    height: 60% !important;
    border-radius: 2px !important;
    background: linear-gradient(180deg, transparent 0%, rgba(221,51,51,0.5) 20%, rgba(221,51,51,0.85) 50%, rgba(221,51,51,0.5) 80%, transparent 100%) !important;
}
.khr-bl-right { right: 0 !important; top: -60% !important; animation: khrSweepV 3.2s linear infinite !important; animation-delay: 1.6s !important; }
.khr-bl-left  { left: 0 !important; bottom: -60% !important; animation: khrSweepVR 3.2s linear infinite !important; animation-delay: 1.6s !important; }
@keyframes khrSweepV  { 0%{top:-60%}    100%{top:100%}    }
@keyframes khrSweepVR { 0%{bottom:-60%} 100%{bottom:100%} }

.khr-border-box::before,
.khr-border-box::after {
    content: '' !important;
    position: absolute !important;
    width: 4px !important; height: 4px !important;
    border-radius: 50% !important;
    background: var(--khr-accent) !important;
    opacity: 0.5 !important;
    box-shadow: 0 0 5px var(--khr-accent) !important;
    animation: khrCorner 3.2s ease-in-out infinite !important;
}
.khr-border-box::before { top: 0 !important; left: 0 !important; }
.khr-border-box::after  { bottom: 0 !important; right: 0 !important; animation-delay: 1.6s !important; }
@keyframes khrCorner { 0%,100%{opacity:0.4} 50%{opacity:0.9} }

/* ══════════════════════════════════════════════════
   INLINE WIDGET
══════════════════════════════════════════════════ */
.khr-inline-widget {
    position: relative !important;
    width: 100% !important;
    /* No max-width — full width like screenshot 3 */
    background: var(--khr-bg) !important;
    border-radius: var(--khr-radius-lg) !important;
    overflow: hidden !important;
    font-family: var(--khr-font) !important;
    backdrop-filter: blur(22px) !important;
    -webkit-backdrop-filter: blur(22px) !important;
    border: 1px solid var(--khr-border-mid) !important;
    box-shadow: 0 24px 70px rgba(0,0,0,0.6) !important;
    z-index: 2 !important;
    box-sizing: border-box !important;
    margin: 0 auto;
}

.khr-inline-header {
    position: relative !important;
    padding: 24px 32px 22px !important;
    border-bottom: 1px solid var(--khr-border) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    overflow: hidden !important;
    z-index: 2 !important;
    box-sizing: border-box !important;
    min-height: 90px !important;
}
.khr-inline-header-bg {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    background: radial-gradient(ellipse at 25% 60%, rgba(221,51,51,0.18) 0%, transparent 65%) !important;
    pointer-events: none !important; z-index: 0 !important;
}
.khr-inline-header-bg::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    background-image: radial-gradient(circle, rgba(255,255,255,0.04) 1px, transparent 1px) !important;
    background-size: 20px 20px !important;
}
.khr-inline-agent {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    position: relative !important;
    z-index: 1 !important;
}
.khr-orb {
    width: 52px !important; height: 52px !important; min-width: 52px !important;
    border-radius: 50% !important;
    background: radial-gradient(circle at 35% 35%, #ff7070, var(--khr-accent) 55%, #7a1010) !important;
    box-shadow: 0 0 18px var(--khr-accent-glow) !important;
    flex-shrink: 0 !important;
    overflow: hidden !important;
    animation: khrOrbPulse 3s ease-in-out infinite !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
}
.khr-orb img { width: 100% !important; height: 100% !important; object-fit: contain !important; border-radius: 50% !important; display: block !important; }
@keyframes khrOrbPulse {
    0%,100% { box-shadow: 0 0 18px var(--khr-accent-glow); }
    50%      { box-shadow: 0 0 28px rgba(221,51,51,0.65), 0 0 60px rgba(221,51,51,0.22); }
}
.khr-agent-info { position: relative !important; z-index: 1 !important; }

.khr-title {
    font-family: var(--khr-font) !important;
    font-size: 1.6rem !important; font-weight: 800 !important;
    color: #ffffff !important; letter-spacing: -0.02em !important;
    line-height: 1.1 !important;
    margin: 0 !important; padding: 0 !important;
    background: none !important; border: none !important;
    text-transform: none !important; text-shadow: none !important;
}
.khr-title em { color: var(--khr-accent) !important; font-style: normal !important; font-weight: 800 !important; }

.khr-sub {
    font-family: var(--khr-font) !important;
    font-size: 0.77rem !important; color: var(--khr-muted) !important;
    margin: 3px 0 0 0 !important; padding: 0 !important;
    font-weight: 400 !important; background: none !important;
    text-transform: none !important; line-height: 1.4 !important;
}

.khr-status-pill {
    display: flex !important; align-items: center !important; gap: 6px !important;
    padding: 5px 13px !important;
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--khr-border-mid) !important;
    border-radius: 30px !important;
    font-family: var(--khr-font) !important;
    font-size: 0.7rem !important; font-weight: 700 !important;
    color: #4ade80 !important; letter-spacing: 0.06em !important;
    text-transform: uppercase !important; white-space: nowrap !important;
    position: relative !important; z-index: 1 !important;
    box-shadow: none !important; text-decoration: none !important;
}
.khr-status-dot {
    width: 7px !important; height: 7px !important; min-width: 7px !important;
    border-radius: 50% !important;
    background: #4ade80 !important;
    box-shadow: 0 0 6px #4ade80 !important;
    animation: khrDotPulse 2s ease-in-out infinite !important;
    display: inline-block !important; flex-shrink: 0 !important;
}
@keyframes khrDotPulse { 0%,100%{opacity:1} 50%{opacity:0.3} }

/* ── Search Row ── */
.khr-search-row {
    padding: 20px 28px !important;
    border-bottom: 1px solid var(--khr-border) !important;
    position: relative !important; z-index: 2 !important;
    background: transparent !important;
    box-sizing: border-box !important;
}
.khr-search-wrap {
    display: flex !important; align-items: center !important; gap: 10px !important;
    background: #ffffff !important;
    border-radius: 50px !important;
    padding: 10px 10px 10px 18px !important;
    box-shadow: none !important; border: none !important;
    box-sizing: border-box !important;
}
.khr-search-icon { display: flex !important; align-items: center !important; flex-shrink: 0 !important; }
.khr-search-icon svg { width: 16px !important; height: 16px !important; stroke: #aaaaaa !important; fill: none !important; display: block !important; }
.khr-search-input {
    flex: 1 !important; min-width: 0 !important;
    background: transparent !important;
    border: none !important; outline: none !important; box-shadow: none !important;
    font-family: var(--khr-font) !important;
    font-size: 0.9rem !important; color: #333333 !important;
    padding: 0 !important; margin: 0 !important;
    height: auto !important; line-height: normal !important;
    border-radius: 0 !important;
}
.khr-search-input::placeholder { color: #bbbbbb !important; opacity: 1 !important; }
.khr-search-input:focus { outline: none !important; box-shadow: none !important; border: none !important; background: transparent !important; }
.khr-search-btn {
    width: 38px !important; height: 38px !important; min-width: 38px !important;
    border-radius: 50% !important;
    background: var(--khr-accent-light) !important;
    border: none !important; cursor: pointer !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    color: var(--khr-accent) !important; transition: all 0.2s !important;
    flex-shrink: 0 !important; padding: 0 !important; box-shadow: none !important;
}
.khr-search-btn:hover { background: var(--khr-accent) !important; color: #ffffff !important; }
.khr-search-btn svg { width: 16px !important; height: 16px !important; stroke: currentColor !important; fill: none !important; display: block !important; }

/* ── Quick Pills ── */
.khr-quick-pills {
    padding: 16px 28px 22px !important;
    display: flex !important; flex-wrap: wrap !important; gap: 8px !important;
    position: relative !important; z-index: 2 !important;
    background: transparent !important;
    margin: 0 !important; list-style: none !important;
    box-sizing: border-box !important;
}
.khr-quick-pill {
    display: inline-flex !important; align-items: center !important; gap: 7px !important;
    padding: 7px 14px !important;
    background: rgba(255,255,255,0.04) !important;
    border: 1px solid rgba(255,255,255,0.10) !important;
    border-radius: 30px !important;
    font-family: var(--khr-font) !important;
    font-size: 0.75rem !important; font-weight: 500 !important;
    color: rgba(255,255,255,0.60) !important;
    cursor: pointer !important; transition: all 0.18s ease !important;
    white-space: nowrap !important; text-decoration: none !important;
    text-transform: none !important; letter-spacing: normal !important;
    line-height: 1.4 !important; box-shadow: none !important;
    margin: 0 !important; outline: none !important;
    -webkit-appearance: none !important; appearance: none !important;
}
.khr-quick-pill:hover,
.khr-quick-pill:focus {
    background: rgba(221,51,51,0.10) !important;
    border-color: rgba(221,51,51,0.30) !important;
    color: rgba(255,255,255,0.90) !important;
    box-shadow: none !important; outline: none !important; text-decoration: none !important;
}
.khr-quick-pill svg { width: 11px !important; height: 11px !important; flex-shrink: 0 !important; stroke: var(--khr-accent) !important; fill: none !important; display: block !important; }

/* ══════════════════════════════════════════════════
   FLOATING BUTTON
══════════════════════════════════════════════════ */
.khr-float-btn {
    position: fixed !important;
    bottom: 30px !important; right: 30px !important;
    z-index: 99998 !important;
    display: flex !important; flex-direction: column !important;
    align-items: center !important; gap: 5px !important;
    cursor: pointer !important;
    background: none !important; background-color: transparent !important;
    border: none !important; padding: 0 !important; box-shadow: none !important;
    -webkit-tap-highlight-color: transparent !important; text-decoration: none !important;
}
.khr-float-btn:hover,.khr-float-btn:focus,.khr-float-btn:active {
    background: none !important; background-color: transparent !important;
    border: none !important; box-shadow: none !important; outline: none !important;
    text-decoration: none !important;
}
.khr-float-orb-wrap { width: 60px !important; height: 60px !important; position: relative !important; flex-shrink: 0 !important; }
.khr-float-orb {
    width: 60px !important; height: 60px !important;
    border-radius: 50% !important;
    background: radial-gradient(circle at 35% 35%, #ff7070, var(--khr-accent) 55%, #7a1010) !important;
    box-shadow: 0 0 22px var(--khr-accent-glow), 0 0 50px rgba(221,51,51,0.20) !important;
    animation: khrOrbPulse 2.8s ease-in-out infinite !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    overflow: hidden !important; transition: transform 0.2s !important;
}
.khr-float-orb img { width: 100% !important; height: 100% !important; object-fit: contain !important; border-radius: 50% !important; display: block !important; }
.khr-float-orb svg { width: 26px !important; height: 26px !important; stroke: #ffffff !important; fill: none !important; }
.khr-float-btn:hover .khr-float-orb { transform: scale(1.08) !important; }
.khr-float-ring {
    position: absolute !important;
    top: -6px !important; left: -6px !important;
    width: calc(100% + 12px) !important; height: calc(100% + 12px) !important;
    border-radius: 50% !important;
    border: 2px solid transparent !important;
    border-top-color: rgba(255,100,100,0.75) !important;
    border-right-color: rgba(221,51,51,0.38) !important;
    animation: khrRingSpin 2.2s linear infinite !important;
    pointer-events: none !important;
}
@keyframes khrRingSpin { to { transform: rotate(360deg); } }
.khr-float-label {
    font-family: var(--khr-font) !important;
    font-size: 0.58rem !important; font-weight: 700 !important;
    color: rgba(255,255,255,0.55) !important;
    letter-spacing: 0.12em !important; text-transform: uppercase !important;
    user-select: none !important; margin: 0 !important; padding: 0 !important;
    background: none !important; text-shadow: none !important;
}

/* ══════════════════════════════════════════════════
   BACKDROP + POPUP
══════════════════════════════════════════════════ */
.khr-backdrop {
    position: fixed !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    background: rgba(0,0,0,0.72) !important;
    backdrop-filter: blur(9px) !important;
    -webkit-backdrop-filter: blur(9px) !important;
    z-index: 999999 !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    padding: 20px !important;
    opacity: 0 !important; pointer-events: none !important;
    transition: opacity 0.28s ease !important;
    box-sizing: border-box !important;
}
.khr-backdrop.open { opacity: 1 !important; pointer-events: auto !important; }

/* Outer wrapper for popup — holds border-box so overflow:hidden on popup doesn't clip it */
.khr-popup-outer {
    position: relative !important;
    width: 100% !important;
    max-width: 720px !important;
    display: flex !important;
    align-items: stretch !important;
}

.khr-popup {
    position: relative !important;
    width: 100% !important; max-width: 100% !important; max-height: 88vh !important;
    background: var(--khr-bg-2) !important;
    border-radius: var(--khr-radius-lg) !important;
    border: 1px solid var(--khr-border-mid) !important;
    box-shadow: 0 40px 100px rgba(0,0,0,0.85) !important;
    display: flex !important; flex-direction: column !important;
    overflow: hidden !important; font-family: var(--khr-font) !important;
    transform: translateY(24px) scale(0.96) !important;
    transition: transform 0.35s cubic-bezier(0.34, 1.3, 0.64, 1) !important;
    box-sizing: border-box !important;
}
.khr-backdrop.open .khr-popup { transform: translateY(0) scale(1) !important; }

.khr-popup-header {
    position: relative !important; overflow: hidden !important;
    padding: 15px 18px !important;
    border-bottom: 1px solid var(--khr-border) !important;
    display: flex !important; align-items: center !important; justify-content: space-between !important;
    flex-shrink: 0 !important; box-sizing: border-box !important;
}
.khr-popup-header-bg {
    position: absolute !important; top: 0 !important; left: 0 !important;
    width: 100% !important; height: 100% !important;
    background: radial-gradient(ellipse at 20% 55%, rgba(221,51,51,0.15) 0%, transparent 65%) !important;
    pointer-events: none !important; z-index: 0 !important;
}
.khr-popup-header-bg::after {
    content: '' !important; position: absolute !important;
    top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important;
    background-image: radial-gradient(circle, rgba(255,255,255,0.04) 1px, transparent 1px) !important;
    background-size: 18px 18px !important;
}
.khr-popup-agent { display: flex !important; align-items: center !important; gap: 11px !important; position: relative !important; z-index: 1 !important; }
.khr-popup-orb {
    width: 34px !important; height: 34px !important; min-width: 34px !important;
    border-radius: 50% !important;
    background: radial-gradient(circle at 35% 35%, #ff7070, var(--khr-accent) 55%, #7a1010) !important;
    box-shadow: 0 0 12px var(--khr-accent-glow) !important;
    flex-shrink: 0 !important; overflow: hidden !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
}
.khr-popup-orb img { width: 100% !important; height: 100% !important; object-fit: contain !important; border-radius: 50% !important; display: block !important; }
.khr-popup-name {
    font-family: var(--khr-font) !important; font-size: 0.88rem !important;
    font-weight: 700 !important; color: #ffffff !important; letter-spacing: -0.01em !important;
    margin: 0 !important; padding: 0 !important; background: none !important; border: none !important;
}
.khr-popup-name em { color: var(--khr-accent) !important; font-style: normal !important; font-weight: 700 !important; }
.khr-popup-sub {
    font-family: var(--khr-font) !important; font-size: 0.67rem !important;
    color: var(--khr-muted) !important; margin: 2px 0 0 0 !important; padding: 0 !important;
    background: none !important; font-weight: 400 !important; text-transform: none !important;
}
.khr-popup-right { display: flex !important; align-items: center !important; gap: 9px !important; position: relative !important; z-index: 1 !important; }
.khr-popup-close {
    width: 28px !important; height: 28px !important;
    border-radius: 7px !important;
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid var(--khr-border) !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    cursor: pointer !important; color: var(--khr-muted) !important;
    transition: all 0.18s !important; padding: 0 !important; box-shadow: none !important; flex-shrink: 0 !important;
}
.khr-popup-close:hover { background: rgba(221,51,51,0.12) !important; border-color: rgba(221,51,51,0.3) !important; color: var(--khr-accent) !important; }
.khr-popup-close svg { width: 14px !important; height: 14px !important; stroke: currentColor !important; fill: none !important; }

.khr-popup-search {
    padding: 12px 16px !important; border-bottom: 1px solid var(--khr-border) !important;
    flex-shrink: 0 !important; background: transparent !important; box-sizing: border-box !important;
}
.khr-popup-search-wrap {
    display: flex !important; align-items: center !important; gap: 10px !important;
    background: #ffffff !important; border-radius: 50px !important;
    padding: 8px 8px 8px 16px !important;
    border: none !important; box-shadow: none !important; box-sizing: border-box !important;
}
.khr-popup-search-icon { display: flex !important; align-items: center !important; flex-shrink: 0 !important; }
.khr-popup-search-icon svg { width: 14px !important; height: 14px !important; stroke: #aaaaaa !important; fill: none !important; display: block !important; }
.khr-popup-search-input {
    flex: 1 !important; min-width: 0 !important;
    background: transparent !important; border: none !important;
    outline: none !important; box-shadow: none !important;
    font-family: var(--khr-font) !important; font-size: 0.87rem !important; color: #333333 !important;
    padding: 0 !important; margin: 0 !important; height: auto !important; line-height: normal !important;
    border-radius: 0 !important;
}
.khr-popup-search-input::placeholder { color: #bbbbbb !important; opacity: 1 !important; }
.khr-popup-search-input:focus { outline: none !important; box-shadow: none !important; border: none !important; }
.khr-popup-clear {
    background: none !important; border: none !important; cursor: pointer !important;
    color: #bbbbbb !important; padding: 2px !important; display: none;
    align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; box-shadow: none !important;
}
.khr-popup-clear svg { width: 13px !important; height: 13px !important; stroke: currentColor !important; fill: none !important; }
.khr-popup-send {
    width: 34px !important; height: 34px !important; min-width: 34px !important;
    border-radius: 50% !important;
    background: var(--khr-accent) !important; border: none !important;
    cursor: pointer !important; display: flex !important; align-items: center !important; justify-content: center !important;
    color: #ffffff !important; transition: all 0.2s !important; flex-shrink: 0 !important;
    padding: 0 !important; box-shadow: none !important;
}
.khr-popup-send:hover { background: var(--khr-accent-hover) !important; }
.khr-popup-send svg { width: 14px !important; height: 14px !important; stroke: currentColor !important; fill: none !important; display: block !important; }

.khr-popup-result {
    flex: 1 !important; overflow-y: auto !important;
    padding: 18px 20px !important;
    display: flex !important; flex-direction: column !important; gap: 12px !important;
    min-height: 180px !important; max-height: 52vh !important;
    scroll-behavior: smooth !important; box-sizing: border-box !important;
}
.khr-popup-result::-webkit-scrollbar { width: 3px !important; }
.khr-popup-result::-webkit-scrollbar-track { background: transparent !important; }
.khr-popup-result::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08) !important; border-radius: 2px !important; }

.khr-result-header { display: flex !important; align-items: center !important; justify-content: space-between !important; margin-bottom: 10px !important; flex-shrink: 0 !important; }
.khr-result-label { display: flex !important; align-items: center !important; gap: 8px !important; font-family: var(--khr-font) !important; font-size: 0.7rem !important; font-weight: 700 !important; color: var(--khr-muted) !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; }
.khr-result-label-dot { width: 18px !important; height: 18px !important; min-width: 18px !important; border-radius: 50% !important; background: radial-gradient(circle at 35% 35%, #ff7070, var(--khr-accent)) !important; flex-shrink: 0 !important; }
.khr-result-status { font-family: var(--khr-font) !important; font-size: 0.67rem !important; color: #4ade80 !important; display: flex !important; align-items: center !important; gap: 5px !important; }
.khr-result-status .khr-dot-g { width: 6px !important; height: 6px !important; border-radius: 50% !important; background: #4ade80 !important; display: inline-block !important; flex-shrink: 0 !important; }

.khr-response-text { font-family: var(--khr-font) !important; font-size: 0.87rem !important; line-height: 1.78 !important; color: var(--khr-text) !important; }
.khr-response-text p { margin: 0 0 0.5em 0 !important; padding: 0 !important; }
.khr-response-text p:last-child { margin-bottom: 0 !important; }
.khr-response-text strong { color: #ffffff !important; font-weight: 600 !important; }
.khr-response-text ul { margin: 6px 0 !important; padding-left: 18px !important; list-style: disc !important; }
.khr-response-text li { margin: 4px 0 !important; }
.khr-response-text li::marker { color: var(--khr-accent) !important; }
.khr-response-text h3 { font-family: var(--khr-font) !important; font-size: 0.95rem !important; font-weight: 700 !important; color: #ffffff !important; margin: 12px 0 6px !important; }
.khr-response-text h3:first-child { margin-top: 0 !important; }
.khr-response-text a { color: var(--khr-accent) !important; }

.khr-dots { display: flex !important; gap: 5px !important; padding: 4px 0 !important; align-items: center !important; }
.khr-dots span { width: 7px !important; height: 7px !important; border-radius: 50% !important; background: var(--khr-accent) !important; opacity: 0.3 !important; display: inline-block !important; animation: khrDotBounce 1.1s ease-in-out infinite !important; }
.khr-dots span:nth-child(2) { animation-delay: 0.18s !important; }
.khr-dots span:nth-child(3) { animation-delay: 0.36s !important; }
@keyframes khrDotBounce { 0%,80%,100%{opacity:0.22;transform:scale(0.8)} 40%{opacity:1;transform:scale(1.15)} }

.khr-cursor { display: inline-block !important; width: 2px !important; height: 0.9em !important; background: var(--khr-accent) !important; vertical-align: text-bottom !important; margin-left: 2px !important; animation: khrBlink 0.85s ease-in-out infinite !important; }
@keyframes khrBlink { 0%,100%{opacity:1} 50%{opacity:0} }

.khr-under-construction { display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; padding: 32px 20px !important; text-align: center !important; gap: 14px !important; min-height: 200px !important; }
.khr-uc-icon { width: 54px !important; height: 54px !important; border-radius: 50% !important; background: var(--khr-accent-light) !important; border: 1px solid rgba(221,51,51,0.22) !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 1.5rem !important; animation: khrIconFloat 3s ease-in-out infinite !important; }
@keyframes khrIconFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }
.khr-uc-title { font-family: var(--khr-font) !important; font-size: 1rem !important; font-weight: 700 !important; color: #ffffff !important; margin: 0 !important; padding: 0 !important; }
.khr-uc-sub { font-family: var(--khr-font) !important; font-size: 0.82rem !important; color: var(--khr-muted) !important; max-width: 320px !important; line-height: 1.6 !important; margin: 0 !important; padding: 0 !important; }
.khr-uc-badge { display: flex !important; align-items: center !important; gap: 7px !important; padding: 6px 14px !important; background: var(--khr-accent-light) !important; border: 1px solid rgba(221,51,51,0.22) !important; border-radius: 24px !important; font-family: var(--khr-font) !important; font-size: 0.73rem !important; font-weight: 600 !important; color: var(--khr-accent) !important; }

.khr-sources { margin-top: 14px !important; padding-top: 12px !important; border-top: 1px solid var(--khr-border) !important; }
.khr-sources-label { font-family: var(--khr-font) !important; font-size: 0.68rem !important; font-weight: 700 !important; color: var(--khr-muted) !important; text-transform: uppercase !important; letter-spacing: 0.06em !important; margin-bottom: 7px !important; }
.khr-source-link { display: inline-flex !important; align-items: center !important; gap: 4px !important; padding: 4px 9px !important; margin: 3px 3px 0 0 !important; font-family: var(--khr-font) !important; font-size: 0.75rem !important; color: var(--khr-accent) !important; background: var(--khr-accent-light) !important; border: 1px solid rgba(221,51,51,0.2) !important; border-radius: 7px !important; text-decoration: none !important; transition: all 0.18s !important; }
.khr-source-link:hover { background: rgba(221,51,51,0.18) !important; }

.khr-popup-contact { padding: 13px 18px 15px !important; border-top: 1px solid var(--khr-border) !important; flex-shrink: 0 !important; background: transparent !important; box-sizing: border-box !important; }
.khr-contact-label { font-family: var(--khr-font) !important; font-size: 0.63rem !important; font-weight: 700 !important; color: rgba(255,255,255,0.28) !important; text-transform: uppercase !important; letter-spacing: 0.1em !important; margin-bottom: 10px !important; }
.khr-contact-row { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; flex-wrap: wrap !important; }
.khr-contact-links { display: flex !important; align-items: center !important; gap: 16px !important; flex-wrap: wrap !important; }
.khr-contact-link { display: flex !important; align-items: center !important; gap: 7px !important; font-family: var(--khr-font) !important; font-size: 0.79rem !important; color: var(--khr-muted) !important; text-decoration: none !important; transition: color 0.18s !important; }
.khr-contact-link:hover { color: var(--khr-accent) !important; text-decoration: none !important; }
.khr-contact-link svg { width: 13px !important; height: 13px !important; stroke: currentColor !important; fill: none !important; opacity: 0.65 !important; }
.khr-contact-btns { display: flex !important; gap: 8px !important; flex-wrap: wrap !important; }
.khr-btn-secondary { padding: 7px 15px !important; border-radius: 8px !important; background: rgba(255,255,255,0.05) !important; border: 1px solid var(--khr-border-mid) !important; font-family: var(--khr-font) !important; font-size: 0.77rem !important; font-weight: 600 !important; color: var(--khr-muted) !important; cursor: pointer !important; transition: all 0.18s !important; box-shadow: none !important; text-decoration: none !important; -webkit-appearance: none !important; appearance: none !important; }
.khr-btn-secondary:hover { background: rgba(255,255,255,0.10) !important; color: #ffffff !important; }
.khr-btn-primary { padding: 7px 17px !important; border-radius: 8px !important; background: var(--khr-accent) !important; border: none !important; font-family: var(--khr-font) !important; font-size: 0.77rem !important; font-weight: 700 !important; color: #ffffff !important; cursor: pointer !important; transition: all 0.18s !important; display: flex !important; align-items: center !important; gap: 5px !important; box-shadow: none !important; text-decoration: none !important; -webkit-appearance: none !important; appearance: none !important; }
.khr-btn-primary:hover { background: var(--khr-accent-hover) !important; color: #ffffff !important; }
.khr-btn-primary svg { width: 11px !important; height: 11px !important; stroke: currentColor !important; fill: none !important; }

@media (max-width: 600px) {
    .khr-backdrop { padding: 0 !important; align-items: flex-end !important; }
    .khr-popup { max-width: 100% !important; max-height: 92vh !important; border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; }
    .khr-float-btn { bottom: 20px !important; right: 18px !important; }
    .khr-contact-row { flex-direction: column !important; align-items: flex-start !important; }
    .khr-inline-header { padding: 16px 18px 14px !important; }
    .khr-title { font-size: 1.1rem !important; }
    .khr-quick-pills { padding: 10px 16px 14px !important; }
}