/* search sheet (tabelog-style): area + keyword boxes, genre chips, filters, result cards */
.sx-box{margin-top:10px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-1);padding:4px 12px 12px}
.sx-row{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--line);padding:4px 2px}
.sx-ic{flex:none;width:22px;text-align:center;font-size:15px}
.sx-in{flex:1;min-width:0;border:0;background:transparent;padding:10px 2px;font-size:16px;color:var(--ink);font-family:inherit}
.sx-in:focus-visible{outline:none}
.sx-row:focus-within{border-bottom-color:var(--red)}
.sx-go{width:100%;margin-top:12px;font-size:16px;padding:11px}
.sx-areas{margin-top:12px}
.sx-genres{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 4px}
.sx-genre{border:0;background:var(--faint);color:var(--ink);border-radius:8px;padding:6px 11px;font-size:13px}
.sx-genre:active{transform:scale(.95)}
.sx-filters{margin-top:10px;align-items:center}
.sx-budget{flex:none;border:1px solid var(--line);background:var(--card);border-radius:999px;padding:5px 10px;font-size:13px;color:var(--sub);font-family:inherit}
.sx-budget.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.sx-res{margin-top:14px}
.sx-head{display:flex;align-items:baseline;gap:8px;padding:8px 2px;border-bottom:2px solid var(--ink)}
.sx-lab{font-weight:700;font-size:14px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sx-n{font-size:13px;color:var(--red);font-weight:700;flex:none}
.sx-sort{margin-left:auto;flex:none;border:1px solid var(--line);background:var(--card);border-radius:8px;padding:3px 6px;font-size:12px;color:var(--ink);font-family:inherit}
.sx-list{list-style:none;margin:0;padding:0}
.sx-card{padding:14px 2px;border-bottom:1px solid var(--line)}
.sx-top{display:flex;gap:12px;align-items:flex-start}
.sx-tx{flex:1;min-width:0;display:grid;gap:3px}
.sx-nm{font-family:var(--serif);font-weight:700;font-size:17px;line-height:1.35;color:var(--ink);text-decoration:none}
.sx-nm[href]:hover{text-decoration:underline}
.sx-sub{font-size:12px;color:var(--sub)}
.sx-bud{font-size:13px;color:var(--ink);font-weight:500}
.sx-ph{flex:none;width:96px;height:96px;border-radius:10px;object-fit:cover;background:var(--faint)}
.sx-catch{margin:8px 0 0;font-size:13px;line-height:1.55;color:var(--ink);opacity:.85;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sx-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px;align-items:center}
.sx-tag{font-size:11px;border:1px solid var(--red);color:var(--red);border-radius:4px;padding:1px 6px}
.sx-acc{font-size:11px;color:var(--sub)}
.sx-ac{display:flex;gap:8px;margin-top:10px}
.sx-more{display:block;width:100%;margin-top:14px}
.sx-res .caution{margin-top:16px}
.sx-box .sx-row:nth-of-type(2){border-bottom-color:transparent}
.sx-alt{display:block;width:100%;margin-top:12px}
.sx-h{font-size:12px;font-weight:700;color:var(--sub);margin:16px 2px 6px;letter-spacing:.04em}
.sx-help{font-size:12px;color:var(--sub);margin:8px 2px 0;line-height:1.5}
.sx-areas{margin-top:0}
.sx-filters{margin-top:0}
.sx-hit{justify-self:start;font-size:10px;font-weight:700;color:var(--on-red);background:var(--red);border-radius:4px;padding:1px 6px}
.sx-urlcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px 16px;box-shadow:var(--shadow-1)}
.sx-urlt{margin:0;font-weight:700}
.sx-urlu{margin:4px 0 8px;font-size:12px;color:var(--sub);word-break:break-all}
.sx-src{margin:16px 0 0}
.g-price{color:var(--ink);font-weight:700;margin-left:4px}
.sx-tx .starline{margin-top:2px}
.sx-filters[hidden]{display:none}
/* 貼ったURL: one row per link */
.sx-urls{list-style:none;margin:0;padding:0}
.sx-uitem{padding:12px 2px;border-bottom:1px solid var(--line)}
.sx-uitem p{margin:0}
.sx-ok{font-weight:700;color:#2E7D4F}
.sx-ng{font-size:13px;color:var(--red)}
.sx-uitem .sx-urlu{font-size:11px;margin-top:4px;opacity:.8}
.sx-uitem .quickadd{margin-top:8px}
/* result buttons: 行きたい = vermilion, 行った = navy */
.sx-ac .sx-want{background:var(--red);border-color:var(--red);color:var(--on-red);font-weight:700}
.sx-ac .sx-went{background:var(--indigo);border-color:var(--indigo);color:var(--on-indigo);font-weight:700}
.sx-ac .sx-want:disabled,.sx-ac .sx-went:disabled{background:var(--card);border-color:var(--line);color:var(--sub);opacity:1}
.sx-when{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:8px;padding:8px 10px;border-radius:12px;background:color-mix(in srgb,var(--indigo) 8%,var(--card))}
.sx-wl{font-size:12px;font-weight:700;color:var(--ink);margin-right:2px}
.sx-dl{position:relative;overflow:hidden}
.sx-date{position:absolute;inset:0;opacity:0;width:100%;height:100%;font-size:16px}
.sx-h.sx-h1{margin-top:6px}
.sx-box .sx-row{border-bottom-color:transparent}
.sx-box{margin-top:12px}

/* お店を追加: 探す / URLを貼る / 名前だけ */
.add-ways{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:6px 0 14px}
.add-way{display:grid;justify-items:center;gap:2px;padding:10px 4px 9px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);color:var(--sub);font:inherit;box-shadow:var(--shadow-1)}
.add-way svg{width:22px;height:22px;margin-bottom:2px}
.add-way b{font-size:14px;color:var(--ink)}
.add-way small{font-size:10.5px}
.add-way[aria-selected="true"]{border-color:var(--red);background:color-mix(in srgb,var(--red) 7%,var(--card));color:var(--red);box-shadow:0 0 0 2px color-mix(in srgb,var(--red) 18%,transparent)}
.add-way[aria-selected="true"] b{color:var(--red)}
/* after a search: one line of conditions */
.sx-sum{display:flex;align-items:center;gap:8px;width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);font:inherit;text-align:left;box-shadow:var(--shadow-1)}
.sx-sum-t{flex:1;min-width:0;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sx-sum-e{flex:none;font-size:12px;color:var(--red);font-weight:700}
.sx-opts{display:flex;align-items:center;gap:8px;margin-top:16px;flex-wrap:wrap}
.sx-opts .sx-src{margin:0}
.sx-fb.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.sx-filters{margin-top:10px}
.ua-row{display:flex;gap:8px;justify-content:flex-end;margin-top:8px}
.ua-name{margin-top:8px}
.sx-notfound{margin-top:18px;padding:14px;border:1.5px dashed var(--line);border-radius:var(--r-lg);text-align:center}
.sx-nf-t{margin:0 0 8px;font-weight:700}
.sx-nf-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.sx-sum ~ .sx-res .sx-head .sx-lab{display:none}

/* genres are picked, then one big button searches */
.sx-genre[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.sx-box{padding-bottom:4px}
.sx-go-big{display:block;width:100%;margin-top:18px;padding:15px;font-size:16px;border-radius:var(--r-lg)}
.sx-go-hint{margin:6px 0 0;text-align:center;font-size:11.5px;color:var(--sub)}

/* エリア: 札幌 | 東京 next to the heading */
.sx-eh{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}
.sx-eh .sx-h{margin:0}
.sx-city{margin:0}
.sx-city button{padding:5px 14px;font-size:12.5px}
.hp-credit{margin:6px 0 0;font-size:10.5px;color:var(--sub)}.hp-credit a{color:var(--sub)}

/* add screen: source first, one-row genres, pinned search bar */
.sx-src{margin:0 0 4px}
.sx-genres{flex-wrap:nowrap;margin:0 0 4px}
.sx-genres .sx-genre{flex:none}
.sx-filters{flex-wrap:wrap;overflow:visible}
.sx-bar{position:sticky;bottom:0;z-index:2;margin:14px -18px 0;padding:10px 18px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(to bottom,transparent,var(--bg) 14px)}
.sx-selline{margin:0 0 6px;min-height:1.4em;text-align:center;font-size:12.5px;font-weight:700;color:var(--sub);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sx-bar .sx-go-big{margin-top:0}

/* compact add screen */
.sx-pair{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sx-pair .seg button{padding:6px 12px;font-size:12.5px;white-space:nowrap}
.sx-areas{margin-top:10px;margin-bottom:0}
.sx-box{margin-top:10px;padding:0 12px}
.sx-row{border-bottom:0;padding:0 2px}
.sx-in{padding:12px 2px}
.sx-h{margin:14px 2px 6px}
.sx-genres{margin:0}
.sx-filters{flex-wrap:nowrap;overflow-x:auto;margin:0}
.sx-filters .chip,.sx-filters .sx-budget{flex:none}
.sx-bar{margin-top:10px}
.sx-selline:empty{display:none}
/* genres + conditions wrap instead of scrolling sideways */
.sx-areas,.sx-genres,.sx-filters{flex-wrap:wrap;overflow:visible;gap:6px}
.sx-more-ar{flex:none;color:var(--red);border-color:var(--red)}
.sx-pair .sx-city{margin-left:auto}
/* 検索先の切替がないときは、札幌|東京を横いっぱいに */
.sx-pair.solo .sx-city{display:flex;width:100%;margin-left:0}
.sx-pair.solo .sx-city button{flex:1;padding:8px 14px;font-size:13.5px}