/* OmadSavdo — rasm bo‘yicha qidiruv */
.ovs-modal, .ovs-res { --p: #6D28D9; --p2: #5B21B6; --p50: #F5F3FF; --p100: #EDE9FE; --ink: #1C1530; --ink2: #3A3350; --mut: #6E6888; --line: #E7E3F0; --bg: #F6F5FA; --sf: #fff; }
html[data-theme="dark"] .ovs-modal, html[data-theme="dark"] .ovs-res { --p: #8B5CF6; --p2: #A78BFA; --p50: #283149; --p100: #303A5A; --ink: #E7EAF1; --ink2: #C2C9D6; --mut: #8D97AA; --line: #2D3749; --bg: #141B28; --sf: #1E2635; }

/* Sarlavhadagi kamera tugmasi */
form.search button.search__cam { background: transparent; color: var(--primary-600, #6D28D9); padding: 0 12px; border-left: 0; }
form.search button.search__cam:hover { background: var(--primary-50, #F5F3FF); color: var(--primary, #5B21B6); }
html[data-theme="dark"] form.search button.search__cam { color: #A78BFA; }
html[data-theme="dark"] form.search button.search__cam:hover { background: rgba(139, 92, 246, .14); }

/* Oyna */
body.ovs-lock { overflow: hidden; }
.ovs-modal { position: fixed; inset: 0; z-index: 100001; background: rgba(20, 14, 40, .58); backdrop-filter: blur(3px); display: grid; place-items: center; padding: 16px; animation: ovsIn .15s ease; font-family: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif; }
@keyframes ovsIn { from { opacity: 0; } }
.ovs-modal * { box-sizing: border-box; }
.ovs-md { position: relative; width: min(520px, 100%); max-height: calc(100vh - 32px); overflow-y: auto; background: var(--sf); color: var(--ink2); border-radius: 22px; padding: 26px; box-shadow: 0 30px 80px -20px rgba(0,0,0,.5); }
.ovs-md h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 6px; font-size: 20px; color: var(--ink); padding-right: 36px; }
.ovs-md h3 svg { color: var(--p); flex: none; }
.ovs-sub { margin: 0 0 16px; font-size: 14px; color: var(--mut); line-height: 1.5; }
.ovs-x { position: absolute; right: 14px; top: 14px; width: 36px; height: 36px; border-radius: 10px; border: 0; background: var(--bg); font-size: 24px; line-height: 1; color: var(--mut); padding: 0; cursor: pointer; }
.ovs-drop { position: relative; border: 2px dashed var(--line); border-radius: 18px; padding: 18px; background: var(--bg); text-align: center; min-height: 170px; display: flex; flex-direction: column; justify-content: center; gap: 12px; }
.ovs-drop.is-drag { border-color: var(--p); background: var(--p50); }
.ovs-drop.is-drag::after { content: attr(data-drop); position: absolute; inset: 0; display: grid; place-items: center; background: var(--p50); color: var(--p); font-weight: 700; border-radius: 16px; padding: 12px; }
.ovs-pick { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ovs-pick[hidden], .ovs-work[hidden], .ovs-hint[hidden] { display: none; }
.ovs-btn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 22px 10px; border-radius: 16px; border: 1.5px solid var(--line); background: var(--sf); color: var(--ink); font-weight: 700; font-size: 15px; cursor: pointer; transition: all .15s; margin: 0; }
.ovs-btn svg { color: var(--p); }
.ovs-btn:hover { border-color: var(--p); background: var(--p50); }
.ovs-btn--cam { background: var(--p); border-color: var(--p); color: #fff; }
.ovs-btn--cam svg { color: #fff; }
.ovs-btn--cam:hover { background: var(--p2); border-color: var(--p2); }
.ovs-hint { color: var(--mut); font-size: 12.5px; }
.ovs-work { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.ovs-work img { width: 150px; height: 150px; object-fit: cover; border-radius: 14px; box-shadow: 0 6px 20px -8px rgba(0,0,0,.35); filter: none !important; }
.ovs-prog { width: 100%; max-width: 320px; height: 8px; border-radius: 99px; background: var(--line); overflow: hidden; }
.ovs-prog i { display: block; height: 100%; width: 4%; background: linear-gradient(90deg, #8B5CF6, #6D28D9); border-radius: 99px; transition: width .3s; }
.ovs-st { color: var(--ink); font-size: 14.5px; }
.ovs-st2 { color: var(--mut); font-size: 12.5px; min-height: 1em; }
.ovs-err { margin: 12px 0 0; padding: 10px 12px; border-radius: 12px; background: #FEE2E2; color: #B91C1C; font-size: 13.5px; font-weight: 600; display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.ovs-err[hidden] { display: none; }
html[data-theme="dark"] .ovs-err { background: #3B1C1C; color: #FCA5A5; }
.ovs-again { border: 0; background: #fff; color: #B91C1C; border-radius: 9px; padding: 6px 12px; font: inherit; font-weight: 700; cursor: pointer; }
.ovs-priv { margin: 14px 0 0; font-size: 12px; color: var(--mut); text-align: center; }

/* Natijalar sahifasi */
.ovs-res { display: flex; align-items: center; gap: 14px; background: var(--p50); border: 1px solid var(--p100); border-radius: 18px; padding: 12px 14px; margin: 0 0 18px; color: var(--ink2); }
.ovs-res__img { width: 64px; height: 64px; object-fit: cover; border-radius: 12px; flex: none; background: var(--sf); }
.ovs-res__img[hidden] { display: none; }
.ovs-res__t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ovs-res__t b { color: var(--ink); font-size: 15.5px; }
.ovs-res__t span { font-size: 13.5px; color: var(--mut); }
.ovs-res__btn { flex: none; border: 0; border-radius: 12px; padding: 10px 16px; background: var(--p); color: #fff; font: inherit; font-weight: 700; font-size: 14px; cursor: pointer; }
.ovs-res__btn:hover { background: var(--p2); }

@media (max-width: 560px) {
	.ovs-md { padding: 20px 16px; border-radius: 20px; }
	.ovs-btn { padding: 18px 8px; font-size: 14px; }
	.ovs-res { flex-wrap: wrap; }
	.ovs-res__btn { width: 100%; }
}