/* sst-site-search-20261023: header search icon + search bar + results page (site-search.js) */
.sst-ss-item{display:flex; align-items:center}
.sst-ss-toggle{display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; min-height:0; padding:0; border:0; border-radius:50%; background:transparent; color:inherit; cursor:pointer}
.sst-ss-toggle svg{width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round}
/* owner 10/23: no purple circle on hover — the theme's button hover/active fill is cancelled, the icon only dims a little */
.sst-header .sst-ss-toggle:is(:hover, :focus, :active, [aria-expanded="true"]){background:transparent !important; box-shadow:none !important; color:inherit !important}
.sst-header .sst-ss-toggle:hover{opacity:.65}
.sst-ss-toggle:focus-visible{outline:2px solid #9e2c5f; outline-offset:2px}
.sst-ss-toggle--mobile{display:none}
@media (max-width:900px){
  .sst-ss-toggle--mobile{display:inline-flex; width:36px; height:36px}
}

/* the bar: a row under the header, in the page flow (the header may be sticky) */
.sst-ss-bar{border-top:1px solid var(--sst-line, #e8e8e8); background:var(--sst-paper, #fff)}
.sst-ss-bar[hidden]{display:none !important}
.sst-ss-bar__in{padding-top:10px; padding-bottom:10px}
.sst-ss-bar__form{display:flex; align-items:center; gap:8px; max-width:760px; margin:0 auto; padding:0 6px 0 12px; height:46px; border:1px solid var(--sst-line, #d9d9d9); border-radius:2px; background:var(--sst-paper, #fff)}
.sst-ss-bar__form:focus-within{border-color:#9e2c5f}
.sst-ss-bar__icon svg, .sst-ss__form-icon svg{display:block; width:18px; height:18px; fill:none; stroke:var(--sst-muted, #6b6b6b); stroke-width:2; stroke-linecap:round}
.sst-ss-bar__input, .sst-ss__input{flex:1; min-width:0; height:100%; padding:0; border:0 !important; outline:0; box-shadow:none !important; background:transparent; color:var(--sst-ink, #1a1a1a); font:500 16px/1.2 var(--sst-font, sans-serif)}
.sst-ss__input::-webkit-search-cancel-button{cursor:pointer}
.sst-ss-bar__input::-webkit-search-cancel-button{-webkit-appearance:none; appearance:none; display:none}   /* the bar has its own × */
.sst-ss-bar__go, .sst-ss__go{height:34px; min-height:0; padding:0 16px; border:0; border-radius:2px; background:#9e2c5f; color:#fff; font:700 13px/1 var(--sst-font, sans-serif); cursor:pointer}
.sst-ss-bar__go:hover, .sst-ss__go:hover{background:#7a2149}
.sst-ss-bar__close{display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; min-height:0; padding:0; border:0; border-radius:50%; background:transparent; color:var(--sst-muted, #6b6b6b); cursor:pointer}
.sst-ss-bar__close svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round}
.sst-ss-bar__close:hover{color:var(--sst-ink, #1a1a1a)}

/* results page */
.sst-ss{--ss-fg:#1a1a1a; --ss-muted:#5c5c5c; --ss-dim:#8a8a8a; --ss-line:#e6e6e6; --ss-card:#fff; --ss-bg:#f7f7f7; --ss-accent:#9e2c5f; --ss-accent-d:#7a2149; --ss-in:#0e7f4c; --ss-out:#b3261e;
  max-width:1200px; margin:0 auto; padding:28px 16px 64px; color:var(--ss-fg); font-family:var(--sst-font, sans-serif)}
html[data-sst-theme="dark"] .sst-ss{--ss-fg:#e8e8e8; --ss-muted:#b4b4b4; --ss-dim:#8c8c8c; --ss-line:#2e2e33; --ss-card:#17171b; --ss-bg:#111114; --ss-accent:#bd3d76; --ss-accent-d:#a02f62; --ss-in:#3ccf8e; --ss-out:#ff7a70}
html[data-sst-theme="dark"] .sst-ss-bar__go, html[data-sst-theme="dark"] .sst-ss__go{background:#bd3d76}

.sst-ss__form{display:flex; align-items:center; gap:10px; max-width:760px; height:52px; margin:0 0 20px; padding:0 8px 0 14px; border:1px solid var(--ss-line); border-radius:2px; background:var(--ss-card)}
.sst-ss__form:focus-within{border-color:var(--ss-accent)}
.sst-ss__input{color:var(--ss-fg); font-size:17px}
.sst-ss__go{height:38px; padding:0 20px; background:var(--ss-accent)}
.sst-ss__head{margin-bottom:14px}
.sst-ss__title{margin:0; font-size:24px; font-weight:800; letter-spacing:-.01em; line-height:1.25; overflow-wrap:anywhere}
.sst-ss__hint{margin:6px 0 0; font-size:14px; color:var(--ss-muted)}

.sst-ss__tabs{display:flex; gap:4px; margin:0 0 20px; border-bottom:1px solid var(--ss-line); overflow-x:auto; scrollbar-width:none}
.sst-ss__tabs[hidden]{display:none}
.sst-ss__tab{display:inline-flex; align-items:center; gap:7px; flex:none; height:42px; min-height:0; padding:0 14px; border:0; border-bottom:2px solid transparent; margin-bottom:-1px; background:transparent; color:var(--ss-muted); font:600 14px/1 var(--sst-font, sans-serif); cursor:pointer}
.sst-ss__tab em{font-style:normal; font-size:12px; font-weight:700; padding:3px 7px; border-radius:10px; background:var(--ss-bg); color:var(--ss-muted)}
.sst-ss__tab:hover{color:var(--ss-fg)}
.sst-ss__tab.is-on{color:var(--ss-fg); border-bottom-color:var(--ss-accent)}
.sst-ss__tab.is-on em{background:var(--ss-accent); color:#fff}

.sst-ss__sec + .sst-ss__sec{margin-top:34px}
.sst-ss__sec-head{display:flex; align-items:baseline; gap:10px; margin:0 0 12px}
.sst-ss__sec-title{margin:0; font-size:18px; font-weight:800}
.sst-ss__sec-count{font-size:13px; font-weight:600; color:var(--ss-dim)}
.sst-ss__see{margin-left:auto; min-height:0; padding:0; border:0; background:transparent; color:var(--ss-accent); font:700 13px/1 var(--sst-font, sans-serif); cursor:pointer}
.sst-ss__see:hover{text-decoration:underline}

.sst-ss__grid{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:14px}
.sst-ss-card{display:flex; flex-direction:column; min-width:0; border:1px solid var(--ss-line); border-radius:6px; background:var(--ss-card); overflow:hidden}
.sst-ss-card__media{display:flex; align-items:center; justify-content:center; height:180px; padding:12px; background:var(--ss-bg)}
.sst-ss-card__media img{max-width:100%; max-height:100%; object-fit:contain}
.sst-ss-card__body{display:flex; flex-direction:column; gap:8px; flex:1; padding:12px}
.sst-ss-card__name{font-size:14px; font-weight:700; line-height:1.35; color:var(--ss-fg); text-decoration:none; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.sst-ss-card__name:hover{text-decoration:underline}
.sst-ss-card__price{margin-top:auto; display:flex; align-items:baseline; justify-content:space-between; gap:8px; flex-wrap:wrap}
.sst-ss-card__price b{font-size:17px; font-weight:800}
.sst-ss-stock{font-size:12px; font-weight:700}
.sst-ss-stock.is-in{color:var(--ss-in)}
.sst-ss-stock.is-out{color:var(--ss-out)}

.sst-ss__list{list-style:none; margin:0; padding:0; border-top:1px solid var(--ss-line)}
.sst-ss-row{padding:14px 0; border-bottom:1px solid var(--ss-line)}
.sst-ss-row__title{font-size:16px; font-weight:700; line-height:1.35; color:var(--ss-fg); text-decoration:none}
.sst-ss-row__title:hover{color:var(--ss-accent); text-decoration:underline}
.sst-ss-row__meta{display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; margin:5px 0 0; font-size:12px; color:var(--ss-dim)}
.sst-ss-row__kind{font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--ss-accent)}
.sst-ss-row__url{overflow-wrap:anywhere}
.sst-ss-row__ex{margin:6px 0 0; font-size:13px; line-height:1.5; color:var(--ss-muted)}

.sst-ss__more{display:flex; align-items:center; justify-content:center; width:100%; max-width:320px; height:42px; min-height:0; margin:22px auto 0; border:1px solid var(--ss-line); border-radius:2px; background:var(--ss-card); color:var(--ss-fg); font:700 13px/1 var(--sst-font, sans-serif); cursor:pointer}
.sst-ss__more:hover{border-color:var(--ss-accent); color:var(--ss-accent)}
.sst-ss__more:disabled{opacity:.6; cursor:default}

/* type-ahead list under the header bar and the results-page box (owner 10/23: "Pika" -> choices) */
.sst-ss-has-sug{position:relative}
.sst-ss-sug{--sg-fg:#1a1a1a; --sg-muted:#6b6b6b; --sg-line:#e6e6e6; --sg-bg:#fff; --sg-hover:#f5eef2; --sg-img:#f4f4f4; --sg-accent:#9e2c5f; --sg-in:#0e7f4c; --sg-out:#b3261e;
  position:absolute; top:calc(100% + 4px); left:-1px; right:-1px; z-index:1000; max-height:min(70vh, 560px); overflow-y:auto; padding:6px 0; border:1px solid var(--sg-line); border-radius:4px; background:var(--sg-bg); box-shadow:0 10px 30px rgba(0,0,0,.14); text-align:left; font-family:var(--sst-font, sans-serif)}
html[data-sst-theme="dark"] .sst-ss-sug{--sg-fg:#e8e8e8; --sg-muted:#a8a8a8; --sg-line:#2e2e33; --sg-bg:#1a1a1e; --sg-hover:#2a1f26; --sg-img:#111114; --sg-accent:#e07aa8; --sg-in:#3ccf8e; --sg-out:#ff7a70; box-shadow:0 10px 30px rgba(0,0,0,.5)}
.sst-ss-sug[hidden]{display:none}
.sst-ss-sug__h{margin:6px 14px 4px; font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--sg-muted)}
.sst-ss-sug__opt{display:flex; align-items:center; gap:12px; padding:7px 14px; color:var(--sg-fg); text-decoration:none; cursor:pointer}
.sst-ss-sug__opt:hover, .sst-ss-sug__opt.is-active{background:var(--sg-hover); color:var(--sg-fg)}
.sst-ss-sug__img{flex:none; display:flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:3px; background:var(--sg-img); overflow:hidden}
.sst-ss-sug__img img{max-width:100%; max-height:100%; object-fit:contain}
.sst-ss-sug__txt{display:flex; flex-direction:column; gap:3px; min-width:0}
.sst-ss-sug__name{font-size:14px; font-weight:600; line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.sst-ss-sug__name mark{background:transparent; color:var(--sg-accent); font-weight:800}
.sst-ss-sug__meta{display:flex; align-items:baseline; gap:10px; font-size:12px}
.sst-ss-sug__meta b{font-size:13px; font-weight:800}
.sst-ss-sug__meta i{font-style:normal; font-weight:700}
.sst-ss-sug__meta i.is-in{color:var(--sg-in)}
.sst-ss-sug__meta i.is-out{color:var(--sg-out)}
.sst-ss-sug__opt.is-art{gap:10px}
.sst-ss-sug__kind{flex:none; min-width:44px; font-size:10px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--sg-accent)}
.sst-ss-sug__none{margin:8px 14px; font-size:13px; color:var(--sg-muted)}
.sst-ss-sug__opt.is-all{margin-top:6px; padding:11px 14px; border-top:1px solid var(--sg-line); font-size:13px; font-weight:700; color:var(--sg-accent)}

@media (max-width:749px){
  .sst-ss-sug__name{white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical}
  .sst-ss{padding:18px 12px 48px}
  .sst-ss__title{font-size:20px}
  .sst-ss__form{height:48px}
  .sst-ss__grid{grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px}
  .sst-ss-card__media{height:140px; padding:8px}
  .sst-ss-card__body{padding:10px}
  .sst-ss-card__name{font-size:13px}
  .sst-ss-card__price b{font-size:15px}
  .sst-ss-bar__go{display:none}
}
