/* Drop 785: the search overlay (website and client/partner portal) */
.ss { --ss-bg: var(--bg-card, #fff); --ss-ink: var(--fg, #0E1B2E); --ss-soft: var(--fg-muted, #5B6780); --ss-line: var(--border, #E1E6EE); --ss-gold: var(--accent, #D4A03A); --ss-mist: var(--bg-2, #F3F6FA);
  position: fixed; inset: 0; z-index: 9995; display: grid; justify-items: center; align-items: start; padding: clamp(1rem, 10vh, 7rem) 1rem 1rem; }
.ss[hidden] { display: none; } html.ss-lock { overflow: hidden; }
.ss-scrim { position: absolute; inset: 0; background: rgba(8, 18, 34, .5); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); opacity: 0; transition: opacity .15s; }
.ss-box { position: relative; width: min(100%, 42rem); max-height: min(78vh, 44rem); display: flex; flex-direction: column; background: var(--ss-bg); color: var(--ss-ink); border-radius: 16px; border: 1px solid var(--ss-line); box-shadow: 0 30px 70px rgba(8, 18, 34, .35); overflow: hidden; transform: translateY(-8px); opacity: 0; transition: transform .15s, opacity .15s; }
.ss.is-open .ss-scrim { opacity: 1; } .ss.is-open .ss-box { transform: none; opacity: 1; }
@media (prefers-reduced-motion: reduce) { .ss-box, .ss-scrim { transition: none; } }
.ss-field { display: flex; align-items: center; gap: .7rem; padding: 0 1rem; border-bottom: 1px solid var(--ss-line); margin: 0; }
.ss-field svg { width: 20px; height: 20px; fill: none; stroke: var(--ss-gold); stroke-width: 2; flex: none; }
.ss-field input { flex: 1; min-width: 0; height: 58px; border: 0; background: transparent; color: inherit; font: inherit; font-size: 1.05rem; outline: none; }
.ss-field kbd, .ss-foot { font-size: .72rem; color: var(--ss-soft); } .ss-field kbd { padding: .2rem .45rem; border: 1px solid var(--ss-line); border-radius: 6px; }
.ss-res { overflow-y: auto; padding: .4rem .6rem .8rem; }
.ss-res section h3 { margin: .8rem .5rem .35rem; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ss-soft); } [dir="rtl"] .ss-res section h3 { letter-spacing: 0; }
.ss-res a { display: grid; gap: .1rem; padding: .55rem .7rem; border-radius: 10px; color: inherit; text-decoration: none; }
.ss-res a b { font-size: .92rem; font-weight: 600; } .ss-res a span { font-size: .78rem; color: var(--ss-soft); line-height: 1.5; }
.ss-res a:hover, .ss-res a.is-sel { background: color-mix(in srgb, var(--ss-gold) 12%, transparent); }
.ss-res a.ss-all { margin-top: .5rem; font-weight: 600; color: var(--ss-gold); display: block; text-align: center; }
.ss-empty { margin: 1rem .7rem; color: var(--ss-soft); font-size: .9rem; }
.ss-foot { margin: 0; display: flex; gap: 1rem; padding: .55rem 1rem; border-top: 1px solid var(--ss-line); background: var(--ss-mist); }
@media (max-width: 640px) { .ss-foot { display: none; } }
/* the buttons that open it */
.ss-btn-client { display: inline-flex; align-items: center; gap: .4rem; width: auto !important; padding: 0 .7rem !important; font-size: .8rem; font-weight: 600; }
.ss-btn-client svg, .hn-search svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
.ss-btn-client kbd { font: 600 .65rem/1 inherit; padding: .15rem .35rem; border: 1px solid currentColor; border-radius: 4px; opacity: .55; }
@media (max-width: 760px) { .ss-btn-client span, .ss-btn-client kbd { display: none; } }
/* the results page */
.srp { padding: clamp(2rem, 4vw, 3rem) clamp(1.25rem, 4vw, 4rem) clamp(3rem, 6vw, 5rem); display: grid; gap: 1.6rem; }
.srp-form { display: flex; gap: .6rem; max-width: 46rem; } .srp-form input { flex: 1; height: 50px; padding: 0 1rem; border-radius: 12px; border: 1px solid var(--border, #E1E6EE); font: inherit; font-size: 1rem; background: var(--bg-card, #fff); color: var(--fg, #0E1B2E); }
.srp-count { color: var(--fg-muted, #5B6780); margin: 0; }
.srp-grp h2 { font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-text, #8C6410); margin: 0 0 .8rem; display: flex; align-items: center; gap: .8rem; } [dir="rtl"] .srp-grp h2 { letter-spacing: 0; }
.srp-grp h2::after { content: ""; flex: 1; height: 1px; background: var(--border, #E1E6EE); }
.srp-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr)); gap: .8rem; }
.srp-list a { display: grid; gap: .3rem; padding: 1rem 1.1rem; border-radius: 14px; border: 1px solid var(--border, #E1E6EE); background: var(--bg-card, #fff); text-decoration: none; color: inherit; transition: border-color .2s, transform .2s; }
.srp-list a:hover { border-color: var(--accent, #D4A03A); transform: translateY(-2px); } .srp-list b { font-size: 1rem; } .srp-list span { font-size: .85rem; color: var(--fg-muted, #5B6780); line-height: 1.6; }
.srp-list mark { background: color-mix(in srgb, var(--accent, #D4A03A) 25%, transparent); color: inherit; border-radius: 3px; padding: 0 .1rem; }