#searchOverlay{position:fixed;inset:0;background:rgba(0,0,0,.65);backdrop-filter:blur(7.5px);-webkit-backdrop-filter:blur(7.5px);z-index:220;opacity:0;visibility:hidden;transition:opacity .22s ease,visibility 0s linear .22s}
#searchOverlay.open{opacity:1;visibility:visible;transition:opacity .22s ease,visibility 0s}
#searchModal{position:fixed;left:50%;top:96px;transform:translate(-50%,-8px);width:min(760px,92vw);max-height:min(680px,calc(100vh - 160px));background:#fff;border-radius:12px;box-shadow:0 25px 50px -12px rgba(0,0,0,.25);z-index:221;display:flex;flex-direction:column;overflow:hidden;opacity:0;visibility:hidden;transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s}
#searchModal.open{opacity:1;visibility:visible;transform:translate(-50%,0);transition:opacity .22s ease,transform .22s ease,visibility 0s}

.search-head{border-bottom:1px solid var(--line);padding:24px 24px 16px;flex:none;display:flex;flex-direction:column;gap:12px}
.search-input-row{display:flex;align-items:center;gap:10px}
.search-input-wrap{flex:1;min-width:0;position:relative;background:var(--soft);border-radius:8px;height:48px;display:flex;align-items:center}
.search-input-ic{position:absolute;left:17px;width:16.5px;height:16.5px;color:var(--muted);pointer-events:none}
.search-input-wrap input{width:100%;height:100%;background:none;border:0;outline:0;padding:0 92px 0 48px;font:600 18px var(--font);letter-spacing:-.18px;color:var(--ink)}
.search-input-wrap input::placeholder{font-weight:400;color:#747878}
.search-clear{position:absolute;right:12px;display:none;align-items:center;gap:4px;background:#eee;color:var(--muted);font-size:10px;font-weight:700;letter-spacing:.4px;padding:4px 8px;border-radius:4px;border:0;cursor:pointer}
.search-clear.show{display:flex}
.search-clear svg{width:8px;height:8px}
.search-close{flex:none;width:44px;height:44px;border-radius:8px;background:var(--soft);border:0;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink)}
.search-close:hover{background:var(--soft2)}
.search-close svg{width:12px;height:12px}

.search-chips{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.search-chip{background:var(--soft);color:var(--ink);font-size:13px;font-weight:500;letter-spacing:.13px;padding:6px 12px;border-radius:9999px;border:0;cursor:pointer}
.search-chip.on{background:#000;color:#fff}

.search-body{flex:1;min-height:0;overflow-y:auto;padding:24px}

.search-sec+.search-sec{margin-top:24px}
.search-sec-t{font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:#5f5e5e;margin-bottom:12px}
.search-pills{display:flex;flex-wrap:wrap;gap:8px}
.search-pill{background:var(--soft);color:var(--ink);font-size:13px;font-weight:500;padding:7px 14px;border-radius:9999px;border:0;cursor:pointer}
.search-pill:hover{background:var(--soft2)}
.search-concern-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.search-concern-link{background:var(--soft);border-radius:8px;padding:10px 12px;font-size:12px;font-weight:600;color:var(--ink);text-decoration:none;display:block}
.search-concern-link:hover{background:var(--soft2)}

.search-results-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:16px;gap:12px;flex-wrap:wrap}
.search-results-head b{font-size:15px;font-weight:700;color:#000;letter-spacing:-.075px}
.search-results-head b u{text-decoration-thickness:1px}
.search-count-pill{background:var(--soft);color:var(--muted);font-size:14px;padding:2px 10px;border-radius:9999px;margin-left:6px}
.search-sort{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--muted)}
.search-sort select{font:600 14px var(--font);color:#000;border:0;background:none;cursor:pointer}

.search-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.search-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:17px;display:flex;gap:16px;align-items:center;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.search-card:hover,.search-card.on{border-color:#000;box-shadow:0 0 0 1px #000}
.search-card-ph{width:96px;height:96px;border-radius:8px;background:var(--soft);flex:none;display:flex;align-items:center;justify-content:center;overflow:hidden}
.search-card-ph img{width:100%;height:100%;object-fit:cover;mix-blend-mode:multiply}
.search-card-ph .pph-icon{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#b9b9b9}
.search-card-ph .pph-icon svg{width:36%;height:36%}
.search-card-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.search-card-brand{font-size:10px;font-weight:600;letter-spacing:.8px;color:var(--muted);text-transform:uppercase}
.search-card-name{font-size:15px;font-weight:700;letter-spacing:-.075px;color:#000;line-height:22px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
.search-card-tags{display:flex;gap:6px;flex-wrap:wrap;padding-bottom:4px}
.search-card-tags span{background:#e8e8e8;color:var(--ink);font-size:9px;font-weight:600;padding:2px 8px;border-radius:9999px}
.search-card-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #eee;padding-top:5px}
.search-card-bottom b{font-size:18px;font-weight:700;color:#000;letter-spacing:-.18px}
.search-card-add{display:flex;align-items:center;gap:4px;background:#000;color:#fff;font-size:13px;font-weight:500;padding:6px 12px;border-radius:8px;border:0;cursor:pointer}
.search-card-add svg{width:9px;height:9px}
.search-card-add:hover{opacity:.88}
.search-card-add.added{background:#1a7f4e}

.search-bottom-row{display:flex;align-items:center;justify-content:space-between;padding-top:16px;gap:12px;flex-wrap:wrap}
.search-bottom-row>span{font-size:12px;color:var(--muted)}
.search-viewall{display:flex;align-items:center;gap:4px;font-size:13px;font-weight:700;color:#000;text-decoration:none}
.search-viewall svg{width:10px;height:10px}

.search-empty{padding:40px 20px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.search-empty-ic{width:48px;height:48px;border-radius:9999px;background:var(--soft);color:#b9b9b9;display:flex;align-items:center;justify-content:center;margin-bottom:6px}
.search-empty-ic svg{width:20px;height:20px}
.search-empty-title{font-size:15px;font-weight:600;color:var(--ink)}
.search-empty-sub{font-size:13px;color:var(--muted);line-height:20px;max-width:340px;margin-bottom:14px}

.search-foot{background:#eee;border-top:1px solid var(--line);padding:11px 16px 10px;display:flex;align-items:center;justify-content:space-between;flex:none;gap:12px;flex-wrap:wrap}
.search-foot-l{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--ink);font-weight:700}
.search-foot-l i{width:6px;height:6px;border-radius:50%;background:#000;flex:none}
.search-foot-l span{font-size:12px;color:var(--muted);font-weight:400}
.search-foot-r{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--muted)}
.search-foot-r kbd{background:#fff;box-shadow:0 1px 1px rgba(0,0,0,.05);border-radius:4px;padding:2px 6px;font:11px monospace;color:var(--ink)}

@media(max-width:640px){
  #searchModal{top:16px;width:calc(100vw - 24px);max-height:calc(100vh - 32px)}
  .search-input-wrap input{font-size:16px;padding-right:60px}
  .search-grid{grid-template-columns:1fr}
  .search-concern-grid{grid-template-columns:repeat(2,1fr)}
  .search-foot-r{display:none}
}