*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#111;color:#eee;height:100vh;display:flex;flex-direction:column}

header{background:linear-gradient(135deg,#4a0000,#7a0000);padding:12px 24px;display:flex;align-items:center;gap:12px;flex-shrink:0}
.mobile-title-bar{display:none}
.mobile-bottom-bar{display:none}
header h1{font-size:1.2rem;font-weight:700;color:#fff}
#stop-btn{display:none;padding:7px 14px;background:#fff;color:#c00;border:none;border-radius:5px;font-size:.82rem;font-weight:700;cursor:pointer;white-space:nowrap}
#stop-btn:hover{background:#ffe0e0}
#stop-btn:disabled{opacity:.6;cursor:not-allowed}
#hdr-status{font-size:.8rem;color:#ffbbbb;margin-left:auto}
/* ── Auth header widget ── */
#auth-widget{display:flex;align-items:center;gap:8px;flex-shrink:0}
#auth-login-btn{padding:6px 14px;background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.35);border-radius:5px;font-size:.78rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .15s}
#auth-login-btn:hover{background:rgba(255,255,255,.25)}
#auth-user-info{display:none;align-items:center;gap:8px}
#auth-email{font-size:.75rem;color:#ffdddd;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#auth-logout-btn{padding:5px 10px;background:rgba(0,0,0,.25);color:#ffcccc;border:1px solid rgba(255,255,255,.2);border-radius:4px;font-size:.72rem;cursor:pointer;white-space:nowrap}
#auth-logout-btn:hover{background:rgba(0,0,0,.4)}
#auth-sync-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;display:none;flex-shrink:0;title:"Synced"}
/* ── Auth modal ── */
#auth-modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:9999;align-items:center;justify-content:center}
#auth-modal.open{display:flex}
.auth-box{background:#1a1a1a;border:1px solid #2e2e2e;border-radius:12px;padding:32px 36px;width:340px;max-width:90vw}
.auth-box h2{color:#fff;font-size:1.1rem;margin-bottom:4px}
.auth-box p{color:#666;font-size:.82rem;margin-bottom:22px}
.auth-tabs{display:flex;gap:0;margin-bottom:22px;border-bottom:1px solid #2e2e2e}
.auth-tab{flex:1;padding:8px;background:none;border:none;border-bottom:2px solid transparent;color:#666;font-size:.85rem;font-weight:600;cursor:pointer;margin-bottom:-1px;transition:color .15s}
.auth-tab.active{color:#ff5555;border-bottom-color:#c00}
.auth-field{width:100%;padding:10px 12px;background:#252525;border:1px solid #3a3a3a;border-radius:5px;color:#eee;font-size:.92rem;outline:none;margin-bottom:12px;box-sizing:border-box}
.auth-field:focus{border-color:#c00}
.auth-submit{width:100%;padding:10px;background:#c00;color:#fff;border:none;border-radius:5px;font-size:.95rem;font-weight:700;cursor:pointer;margin-top:4px}
.auth-submit:hover{background:#e00}
.auth-submit:disabled{opacity:.5;cursor:not-allowed}
.auth-err{color:#f88;font-size:.8rem;margin-bottom:10px;min-height:18px}
.auth-note{font-size:.75rem;color:#555;margin-top:14px;text-align:center}
.auth-close{position:absolute;top:12px;right:14px;background:none;border:none;color:#666;font-size:1.2rem;cursor:pointer}
#auth-modal .auth-box{position:relative}
.auth-divider{display:flex;align-items:center;gap:10px;margin:14px 0 12px;color:#555;font-size:.75rem}
.auth-divider::before,.auth-divider::after{content:'';flex:1;border-top:1px solid #333}
.auth-google-btn{display:flex;align-items:center;justify-content:center;gap:9px;width:100%;padding:10px;background:#fff;color:#222;border:none;border-radius:5px;font-size:.9rem;font-weight:600;cursor:pointer;transition:background .15s}
.auth-google-btn:hover{background:#f0f0f0}
.auth-google-btn svg{flex-shrink:0}
/* ── Google welcome modal ── */
#google-welcome-modal{display:none;position:fixed;inset:0;z-index:300;align-items:center;justify-content:center}
#google-welcome-modal.open{display:flex}
#google-welcome-modal .gw-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.75)}
#google-welcome-modal .gw-box{position:relative;background:#1a1a1a;border:1px solid #2e2e2e;border-radius:12px;padding:32px 36px;width:380px;max-width:92vw;z-index:1}
#google-welcome-modal h2{color:#fff;font-size:1.1rem;margin-bottom:6px}
#google-welcome-modal p{color:#888;font-size:.82rem;margin-bottom:20px;line-height:1.5}
.gw-label{display:block;font-size:.78rem;color:#888;margin-bottom:5px;margin-top:14px}
.gw-divider{border:none;border-top:1px solid #2e2e2e;margin:20px 0}
.gw-import-toggle{background:none;border:none;color:#888;font-size:.8rem;cursor:pointer;padding:0;text-decoration:underline;margin-bottom:14px}
.gw-import-section{display:none}
.gw-import-section.open{display:block}
.gw-msg{font-size:.8rem;margin:8px 0 4px;min-height:18px}
.gw-msg.error{color:#f88}
.gw-msg.success{color:#4ade80}
/* ── Google link banner ── */
#google-link-banner{display:none;background:#1a2a3a;border-bottom:1px solid #2a4a6a;padding:8px 24px;align-items:center;gap:12px;font-size:.82rem;color:#7ab8d4;flex-wrap:wrap}
#google-link-banner.show{display:flex}
#google-link-banner button.glib-link{padding:4px 12px;background:#1a4a6a;color:#7ab8d4;border:1px solid #2a6a9a;border-radius:4px;cursor:pointer;font-size:.8rem;white-space:nowrap}
#google-link-banner button.glib-link:hover{background:#2a5a7a}
#google-link-banner button.glib-dismiss{padding:4px 8px;background:none;color:#555;border:none;cursor:pointer;font-size:.8rem;margin-left:auto}

.layout{display:flex;flex:1;overflow:hidden}

/* ── Left panel ── */
.left{width:220px;min-width:200px;background:#1a1a1a;border-right:1px solid #2e2e2e;display:flex;flex-direction:column;flex-shrink:0;position:relative;z-index:10}

.sel-btns{display:flex;gap:6px;margin-top:8px}
.sel-btn{flex:1;padding:5px;background:#252525;border:1px solid #3a3a3a;border-radius:4px;color:#aaa;font-size:.75rem;cursor:pointer}
.sel-btn:hover{border-color:#c00;color:#fff}

.search-wrap{padding:10px 12px;border-bottom:1px solid #2e2e2e;flex-shrink:0}
#search{width:100%;padding:7px 11px;border-radius:5px;background:#252525;border:1px solid #3a3a3a;color:#eee;font-size:.875rem;outline:none}
#search:focus{border-color:#c00;box-shadow:0 0 0 3px rgba(204,0,0,.15)}

#store-list{flex:1;overflow-y:auto;padding:4px 0}
.store-row{display:flex;align-items:center;padding:6px 12px;gap:8px;cursor:pointer}
.store-row:hover{background:#222}
.store-row input[type=checkbox]{accent-color:#c00;flex-shrink:0;cursor:pointer}
.store-row label{flex:1;font-size:.855rem;cursor:pointer}
.store-row.hidden{display:none}
.store-dist{font-size:.72rem;color:#555;flex-shrink:0;min-width:44px;text-align:right}
.store-dist-inline{font-size:.72rem;color:#aaa;font-style:italic;font-weight:400}
.fav-btn{background:none;border:none;cursor:pointer;font-size:1rem;line-height:1;padding:0 4px;color:#444;flex-shrink:0;transition:color .15s}
.fav-btn.active{color:#f5c518}
.fav-btn:hover{color:#f5c518}

/* ── ZIP sort row ── */
.zip-sort-row{display:flex;align-items:center;gap:6px;margin-top:7px}
#zip-input{width:80px;flex:none;padding:5px 9px;border-radius:5px;background:#252525;border:1px solid #3a3a3a;color:#eee;font-size:.82rem;outline:none}
#zip-input:focus{border-color:#555;box-shadow:0 0 0 2px rgba(255,255,255,.05)}
#zip-input::placeholder{color:#555}
#zip-sort-btn{padding:5px 9px;background:#222;border:1px solid #3a3a3a;border-radius:5px;color:#888;font-size:.78rem;cursor:pointer;white-space:nowrap;transition:all .15s}
#zip-sort-btn.active{background:#1a2a1a;border-color:#3a6a3a;color:#7bc97b}
#zip-sort-btn:hover{border-color:#555;color:#bbb}
.zip-radius-row{display:flex;align-items:center;gap:6px;margin-top:7px}
.zip-radius-row label{font-size:.78rem;color:#888;white-space:nowrap}
#zip-radius-select{flex:1;min-width:0;padding:5px 9px;border-radius:5px;background:#252525;border:1px solid #3a3a3a;color:#eee;font-size:.82rem;outline:none;cursor:pointer}
#zip-radius-select:focus{border-color:#555;box-shadow:0 0 0 2px rgba(255,255,255,.05)}
#zip-radius-select.zr-active{background:#1a2a1a;border-color:#3a6a3a;color:#7bc97b}

.empty-msg{padding:24px 16px;color:#555;font-size:.85rem;text-align:center}
#dev-footer{position:fixed;bottom:10px;right:12px;display:flex;flex-direction:row;align-items:center;gap:8px;z-index:50;font-size:.72rem;color:#aaa;white-space:nowrap}
#dev-footer span{pointer-events:none;color:#888}
#dev-footer a{display:inline-flex;align-items:center;color:#bbb;text-decoration:none;transition:color .2s}
#dev-footer a:hover{color:#fff}
#dev-footer svg{opacity:.7;transition:opacity .2s}
#dev-footer a:hover svg{opacity:1}

/* ── Desktop sidebar collapse ── */
#sidebar-collapse-btn{display:none}
@media(min-width:821px){
  .left{overflow:hidden;transition:width .2s ease,min-width .2s ease}
  .left.sidebar-collapsed{width:18px;min-width:18px}
  #sidebar-collapse-btn{
    display:flex;align-items:center;justify-content:center;
    position:absolute;right:0;top:50%;transform:translateY(-50%);
    width:20px;height:72px;padding:0;
    background:#252525;border:none;border-left:1px solid #444;
    border-radius:0 5px 5px 0;color:#aaa;cursor:pointer;font-size:.75rem;
    z-index:20;line-height:1;transition:color .15s,background .15s;
    writing-mode:vertical-rl
  }
  #sidebar-collapse-btn:hover{color:#fff;background:#333}
}

.left-footer{padding:12px;border-top:1px solid #2e2e2e;flex-shrink:0;background:#1a1a1a;position:relative;z-index:2}
#sel-count{font-size:.78rem;color:#666;margin-bottom:8px}

/* ── Right panel ── */
.right{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative;z-index:1}

.status-bar{padding:8px 20px;background:#161616;border-bottom:1px solid #2e2e2e;font-size:.78rem;color:#666;display:flex;gap:20px;flex-wrap:wrap;flex-shrink:0}
.status-bar b{color:#bbb}
#global-search-wrap{margin-left:auto;display:flex;align-items:center;gap:4px;flex-shrink:0}
#global-search{padding:5px 10px;border-radius:4px;background:#1e1e1e;border:1px solid #3a3a3a;color:#eee;font-size:.78rem;width:200px;outline:none}
#global-search:focus{border-color:#c00;box-shadow:0 0 0 3px rgba(204,0,0,.15)}
#global-search-btn{background:none;border:1px solid #3a3a3a;border-radius:4px;color:#888;font-size:.72rem;padding:4px 8px;cursor:pointer;line-height:1}
#global-search-btn:hover{border-color:#c00;color:#eee}
#global-search-clear{background:none;border:1px solid #c00;border-radius:4px;color:#f88;font-size:.72rem;padding:4px 8px;cursor:pointer;line-height:1}
#global-search-clear:hover{background:#3a1a1a}

#log{height:52px;overflow-y:auto;padding:6px 20px;font-family:monospace;font-size:.78rem;color:#6dba8d;line-height:1.75;flex-shrink:0;border-bottom:1px solid #2e2e2e}
.log-dim{color:#6dba8d}
.log-err{color:#f88}

.results{flex:1;overflow-y:auto;overflow-x:hidden;background:#1a1a1a}
.results-hdr{padding:8px 16px;font-size:.88rem;font-weight:600;color:#ccc;background:#111;border-bottom:1px solid #1e1e1e;display:flex;align-items:center;gap:8px;flex-wrap:nowrap;box-shadow:0 2px 10px rgba(0,0,0,.5)}
/* ── Quick-filter chip bar (Price Drops / Watch List / Want List) ── */
.quick-filter-bar{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:6px 16px;background:#111;border-bottom:1px solid #1e1e1e;flex-shrink:0}
#results-top-bar{display:flex;flex-direction:column;align-items:stretch;flex-shrink:0;position:sticky;top:0;z-index:2;background:#111}
#results-top-bar .quick-filter-bar{border-bottom:1px solid #2e2e2e;background:none;padding:4px 8px 4px 16px;flex-shrink:0}
#results-top-bar .results-hdr{flex:none;border-bottom:none;background:none;box-shadow:none}
.qf-chip{padding:5px 10px;border-radius:16px;background:#1e1e1e;border:1px solid #3a3a3a;color:#aaa;font-size:.78rem;cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent}
.qf-chip:hover{border-color:#555;color:#ccc}
.qf-chip.wl-active{background:#2d6a2d;border-color:#4ade80;color:#fff}
.qf-edit-link{color:#4ade80;cursor:pointer;white-space:nowrap;font-size:.78rem;text-decoration:none}
.qf-edit-link:hover{text-decoration:underline}
.view-toggle-chip-btn{display:none;margin-left:auto}  /* mobile only — shown in mobile block */
/* ── Saved Searches ── */
#ss-wrap{position:relative}
.ss-dropdown{position:fixed;z-index:500;background:#1a1a1a;border:1px solid #3a3a3a;border-radius:8px;min-width:280px;max-width:380px;max-height:400px;overflow-y:auto;box-shadow:0 8px 32px rgba(0,0,0,.7);display:none}
.ss-dropdown-hdr{padding:10px 14px 6px;font-size:.72rem;font-weight:700;color:#bbb;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid #2a2a2a;display:flex;align-items:center;justify-content:space-between}
.ss-empty{padding:20px 14px;color:#aaa;font-size:.82rem;text-align:center;line-height:1.5}
.ss-item{display:flex;align-items:center;gap:8px;padding:9px 14px;cursor:pointer;border-bottom:1px solid #2a2a2a;transition:background .12s}
.ss-item:hover{background:#252525}
.ss-item:last-child{border-bottom:none}
.ss-item-main{flex:1;min-width:0}
.ss-item-name{font-size:.84rem;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ss-item-desc{font-size:.72rem;color:#aaa;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ss-count-badge{background:#2a2a2a;color:#ccc;font-size:.68rem;font-weight:700;padding:2px 7px;border-radius:10px;white-space:nowrap;flex-shrink:0}
.ss-count-badge.loaded{background:#1e3a1e;color:#4ade80}
.ss-delete-btn{background:none;border:none;color:#888;font-size:.75rem;cursor:pointer;padding:3px 5px;border-radius:3px;flex-shrink:0;line-height:1}
.ss-delete-btn:hover{color:#f88;background:#2a1a1a}
.ss-clear-all-btn{background:none;border:none;color:#888;font-size:.72rem;cursor:pointer;padding:2px 6px;border-radius:3px;white-space:nowrap}
.ss-clear-all-btn:hover{color:#f88}
.ss-back-btn{background:none;border:1px solid #444;color:#93c5fd;font-size:.72rem;cursor:pointer;padding:2px 8px;border-radius:3px;white-space:nowrap;margin-right:4px}
.ss-back-btn:hover{background:#1e2a3a;color:#bfdbfe}
/* ── About modal ── */
#about-modal{display:none;position:fixed;inset:0;z-index:900;background:rgba(0,0,0,.7);align-items:center;justify-content:center}
#about-modal.open{display:flex}
#about-box{background:#1a1a1a;border:1px solid #3a3a3a;border-radius:10px;padding:24px 28px;max-width:340px;width:90%;text-align:center;position:relative}
#about-box h3{color:#ffcccc;font-size:1rem;margin:0 0 6px}
#about-box .about-sub{color:#888;font-size:.78rem;margin-bottom:18px}
.about-donate-row{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:14px}
.about-donate-label{color:#aaa;font-size:.8rem}
.about-donate-row a{display:flex;align-items:center;opacity:.8;transition:opacity .15s}
.about-donate-row a:hover{opacity:1}
.about-music-link{display:inline-flex;align-items:center;gap:5px;color:#aaa;font-size:.82rem;text-decoration:none}
.about-music-link:hover{color:#ffcccc}
.about-close-btn{margin-top:20px;padding:7px 24px;background:#2a2a2a;border:1px solid #3a3a3a;border-radius:5px;color:#ccc;font-size:.82rem;cursor:pointer;width:100%}
.about-close-btn:hover{background:#333;color:#fff}
.mtb-about{color:#ffcccc;font-size:.6rem;font-weight:400;opacity:.55;cursor:pointer;white-space:nowrap;text-align:left;background:none;border:none;padding:0}
.mtb-about:hover{opacity:1}
#save-search-btn:hover{background:#1a3a1a!important}
#filter-action-btns{display:contents}  /* desktop: wrapper invisible, children flow inline */
.ss-save-mobile-btn{padding:4px 9px;border-radius:4px;background:#1e2e1e;border:1px solid #4ade80;color:#4ade80;font-size:.75rem;cursor:pointer;white-space:nowrap}
.badge{background:#c00;color:#fff;font-size:.7rem;font-weight:700;padding:2px 7px;border-radius:10px}.badge:empty{display:none}
.cat-sel{padding:5px 8px;border-radius:4px;background:#1e1e1e;border:1px solid #3a3a3a;color:#eee;font-size:.78rem;outline:none;cursor:pointer;flex-shrink:1;min-width:70px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cat-sel:focus{border-color:#c00}
#watchlist-toggle.wl-active,#cl-watchlist-toggle.wl-active,
#price-drop-toggle.wl-active,#want-list-toggle.wl-active{background:#2d6a2d;border-color:#4ade80;color:#fff!important}
.brand-dd-item{display:flex;align-items:center;padding:6px 12px;cursor:pointer;font-size:.82rem;color:#ccc;gap:6px}
.brand-dd-item:hover{background:#252525}
.brand-dd-item.active{background:#c00;color:#fff}
.brand-dd-item .bcount{margin-left:auto;color:#555;font-size:.72rem;font-style:italic;font-weight:normal}
.brand-dd-item.active .bcount{color:rgba(255,255,255,.7);font-style:italic;font-weight:normal}
.cond-dd-item{display:flex;align-items:center;padding:6px 12px;cursor:pointer;font-size:.82rem;color:#ccc;gap:8px}
.cond-dd-item:hover{background:#252525}
.cond-dd-item.active{color:#fff}
.cond-dd-item .bcount{margin-left:auto;color:#666;font-size:.72rem;font-style:italic;font-weight:normal}
.cond-dd-item.active .bcount{color:rgba(255,255,255,.7);font-style:italic;font-weight:normal}
.cond-dd-check{width:14px;height:14px;border:1px solid #555;border-radius:3px;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.7rem}
.cond-dd-item.active .cond-dd-check{background:#c00;border-color:#c00;color:#fff}
#res-search-wrap{margin-left:auto;display:flex;align-items:center;gap:6px;position:relative;flex-shrink:1;min-width:90px}
#res-search{padding:5px 10px;border-radius:4px;background:#1e1e1e;border:1px solid #3a3a3a;color:#eee;font-size:.8rem;width:150px;min-width:0;outline:none}
#res-search:focus{border-color:#c00;box-shadow:0 0 0 3px rgba(204,0,0,.15)}
.res-search-icon{display:none;position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:.9rem;pointer-events:none;opacity:.5}
#res-search-count{font-size:.75rem;color:#555;white-space:nowrap;flex-shrink:0}
#search-info-btn:hover{color:#ccc;border-color:#666}
#search-info-popover{display:none;position:absolute;top:calc(100% + 6px);right:0;z-index:200;background:#1e1e1e;border:1px solid #3a3a3a;border-radius:7px;padding:12px 14px;width:260px;font-size:.76rem;line-height:1.6;color:#bbb;box-shadow:0 6px 24px rgba(0,0,0,.6)}
#search-info-popover.open{display:block}
#search-info-popover b{color:#eee}
#search-info-popover code{color:#4ade80;font-family:monospace;font-size:.8rem}
.dd-clear-row{padding:7px 12px;color:#f88;font-size:.78rem;cursor:pointer;border-bottom:1px solid #2a2a2a;display:flex;align-items:center;gap:4px}
.dd-clear-row:hover{background:#1e1e1e}

table{width:100%;border-collapse:separate;border-spacing:0;font-size:.83rem;table-layout:auto}
th{background:#161616;color:#aaa;font-weight:600;text-align:left;padding:7px 10px;font-size:.7rem;text-transform:uppercase;letter-spacing:.4px;position:sticky;top:var(--tbl-hdr-top,88px);z-index:1;cursor:pointer;user-select:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
th:hover{color:#ccc}
th.sort-asc::after{content:" ▲";color:#c00;font-size:.6rem}
th.sort-desc::after{content:" ▼";color:#c00;font-size:.6rem}
td{padding:7px 10px;border-bottom:1px solid #1c1c1c;color:#ddd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Action cols: fixed narrow */
th:nth-child(1),td:nth-child(1){width:50px;text-align:center;overflow:visible}
th:nth-child(2),td:nth-child(2){width:28px;text-align:center}
th:nth-child(3),td:nth-child(3){width:44px;text-align:center;overflow:visible}
/* col 4 = Item: capped so data cols can breathe */
th:nth-child(4),td:nth-child(4){max-width:420px}
/* Data cols: auto-sized, nowrap keeps them from collapsing */
th:nth-child(5),td:nth-child(5){white-space:nowrap}
th:nth-child(6),td:nth-child(6){white-space:nowrap;text-align:left}
th:nth-child(7),td:nth-child(7){white-space:nowrap}
th:nth-child(8),td:nth-child(8){white-space:nowrap}
th:nth-child(9),td:nth-child(9){white-space:nowrap}
th:nth-child(10),td:nth-child(10){white-space:nowrap}
th:nth-child(11),td:nth-child(11){white-space:nowrap}
table.no-new th:nth-child(3),table.no-new td:nth-child(3){display:none}
table.no-want th:nth-child(1),table.no-want td:nth-child(1){display:none}
tr:hover td{background:#2e1e1e}
td a{color:#7bbff7;text-decoration:none}
td a:hover{color:#a8d4ff;text-decoration:underline}
.tag{background:#c00;color:#fff;font-size:.64rem;font-weight:700;padding:2px 7px;border-radius:10px;letter-spacing:.2px}
.tag-kw{background:#0a5c2a;color:#4ade80;font-size:.64rem;font-weight:700;padding:2px 7px;border-radius:10px;border:1px solid #2d6a2d;letter-spacing:.2px}
.price-drop-val{color:#4ade80;cursor:default}
.price-orig{color:#888;text-decoration:line-through;font-size:.85em;margin-right:2px}
.tag-sold{background:#3a1a1a;color:#f87171;font-size:.62rem;font-weight:700;padding:2px 5px;border-radius:3px;border:1px solid #6a2d2d}
.watch-btn{background:none;border:none;cursor:pointer;color:#444;font-size:1rem;line-height:1;padding:0 2px;transition:color .15s;flex-shrink:0}
.watch-btn:hover{color:#f5c518}
.watch-btn.active{color:#f5c518}
tr.sold-row td{color:#666}
tr.sold-row td a{color:#666}
tr.fav-row td:last-child{color:#4ade80}
.no-res{padding:24px 20px;color:#555;font-size:.85rem}

/* ── Paginator ── */
.paginator{display:flex;align-items:center;justify-content:center;gap:2px;padding:14px 16px 36px;border-top:1px solid #1e1e1e;user-select:none;position:sticky;bottom:0;background:#111;z-index:5}
.paginator .pg-info{font-size:.75rem;color:#555;margin-right:12px;white-space:nowrap}
.paginator button{background:none;border:1px solid transparent;color:#888;font-size:.78rem;min-width:32px;height:30px;border-radius:5px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;transition:all .15s;font-weight:500}
.paginator button:hover:not(:disabled):not(.pg-active){background:#1e1e1e;border-color:#333;color:#ddd}
.paginator button:disabled{color:#333;cursor:default}
.paginator button.pg-active{background:#c00;border-color:#c00;color:#fff;font-weight:700}
.paginator button.pg-nav{font-size:.72rem;color:#666;letter-spacing:-.5px}
.paginator button.pg-nav:hover:not(:disabled){color:#ccc;background:#1e1e1e;border-color:#333}
.paginator .pg-ellipsis{color:#444;font-size:.75rem;min-width:24px;text-align:center;line-height:30px}

/* ── Thin custom scrollbars ── */
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#2a2a2a;border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:#3e3e3e}

/* ── Image thumbnail tooltip ── */
#img-tooltip{display:none;position:fixed;z-index:200;background:#1a1a1a;border:1px solid #3a3a3a;border-radius:8px;padding:6px;box-shadow:0 8px 24px rgba(0,0,0,.6);pointer-events:none}
#img-tooltip img{display:block;width:200px;height:200px;object-fit:contain;border-radius:4px;background:#111}

/* ── Desktop inline thumbnail view ── */
.row-thumb{display:none;width:48px;height:48px;object-fit:contain;border-radius:4px;background:#111;flex-shrink:0}
.thumb-name-cell{display:flex;align-items:center;gap:8px}
#res-body.thumb-mode .row-thumb{display:block}
#res-body.thumb-mode #res-table tbody tr{height:58px}

/* ── Password modal ── */
/* ── CL Search tab ── */
#cl-panel{flex-direction:row}
.cl-left{width:220px;min-width:200px;background:#1a1a1a;border-right:1px solid #2e2e2e;display:flex;flex-direction:column;flex-shrink:0}
.cl-left .search-wrap{padding:10px 12px;border-bottom:1px solid #2e2e2e;flex-shrink:0}
#cl-city-search{width:100%;padding:7px 11px;border-radius:5px;background:#252525;border:1px solid #3a3a3a;color:#eee;font-size:.875rem;outline:none}
#cl-city-search:focus{border-color:#a5b4fc;box-shadow:0 0 0 3px rgba(165,180,252,.15)}
.cl-sel-btns{display:flex;gap:6px;margin-top:8px}
.cl-sel-btn{flex:1;padding:5px;background:#252525;border:1px solid #3a3a3a;border-radius:4px;color:#aaa;font-size:.75rem;cursor:pointer}
.cl-sel-btn:hover{border-color:#a5b4fc;color:#fff}
.cl-sel-btn.active{border-color:#a5b4fc;color:#c7d2fe;background:#1a1f35}
#cl-city-list{flex:1;overflow-y:auto;padding:4px 0}
.cl-city-row{display:flex;align-items:center;padding:6px 12px;gap:8px;cursor:pointer}
.cl-city-row:hover{background:#222}
.cl-city-row input[type=checkbox]{accent-color:#a5b4fc;flex-shrink:0;cursor:pointer}
.cl-city-row label{flex:1;font-size:.855rem;cursor:pointer}
.cl-fav-btn{background:none;border:none;cursor:pointer;font-size:1rem;line-height:1;padding:0 4px;color:#444;flex-shrink:0;transition:color .15s}
.cl-fav-btn.active{color:#f5c518}
.cl-fav-btn:hover{color:#f5c518}
.cl-left-footer{padding:12px;border-top:1px solid #2e2e2e;flex-shrink:0}
.cl-right{display:flex;flex-direction:column;flex:1;overflow:hidden}
.cl-search-bar{padding:12px 16px;border-bottom:1px solid #2e2e2e;display:flex;gap:10px;align-items:center;flex-shrink:0;background:#111}
#cl-query{flex:1;padding:9px 14px;border-radius:6px;background:#1e1e1e;border:1px solid #3a3a3a;color:#eee;font-size:.95rem;outline:none}
#cl-query:focus{border-color:#a5b4fc;box-shadow:0 0 0 3px rgba(165,180,252,.15)}
#cl-search-btn{padding:9px 20px;background:#a5b4fc;color:#fff;border:none;border-radius:6px;font-size:.88rem;font-weight:700;cursor:pointer;white-space:nowrap}
#cl-search-btn:hover{background:#818cf8}
#cl-search-btn:disabled{opacity:.6;cursor:not-allowed}
#cl-status{font-size:.8rem;color:#c7d2fe;padding:0 4px}
.cl-results-hdr{padding:10px 16px;border-bottom:1px solid #1e1e1e;display:flex;align-items:center;gap:10px;flex-shrink:0;background:#141414}
#cl-count{font-size:.85rem;color:#c7d2fe;font-weight:600}
#cl-res-search{padding:5px 10px;border-radius:4px;background:#1e1e1e;border:1px solid #3a3a3a;color:#eee;font-size:.78rem;outline:none;margin-left:auto;width:200px}
#cl-res-search:focus{border-color:#a5b4fc}
#cl-body{flex:1;overflow-y:auto}
#cl-body table{width:100%;border-collapse:collapse;font-size:.83rem;table-layout:auto}
#cl-body th{background:#161616;color:#666;font-weight:600;text-align:left;padding:7px 10px;font-size:.7rem;text-transform:uppercase;letter-spacing:.4px;position:sticky;top:0;cursor:pointer;user-select:none;white-space:nowrap}
#cl-body th:hover{color:#ccc}
#cl-body th.sort-asc::after{content:" ▲";color:#a5b4fc;font-size:.6rem}
#cl-body th.sort-desc::after{content:" ▼";color:#a5b4fc;font-size:.6rem}
#cl-body td{padding:7px 10px;border-bottom:1px solid #1c1c1c;color:#ddd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:0}
#cl-body td:nth-child(1){width:30px;min-width:30px;max-width:30px;text-align:center;overflow:visible}
#cl-body td:nth-child(2){width:52px;min-width:52px;max-width:52px;text-align:center;overflow:visible}
#cl-body td:nth-child(3){width:50%;max-width:none;text-align:left}
#cl-body td:nth-child(4){width:90px;text-align:left}
#cl-body td:nth-child(5){width:140px}
#cl-body td:nth-child(6){width:90px}
#cl-body tr:hover td{background:#161616}
#cl-body tr.cl-fav-result td{background:#1a1f35}
#cl-body tr.cl-fav-result:hover td{background:#252b45}
#cl-body td a{color:#c7d2fe;text-decoration:none}
#cl-body td a:hover{text-decoration:underline}
.cl-empty{padding:32px;color:#555;font-size:.9rem;text-align:center}
.cl-fav-star{color:#f5c518;margin-right:4px;font-size:.8rem}

/* ── Mobile toggle buttons (hidden on desktop) ── */
.mobile-sidebar-toggle{display:none}
.mobile-filter-toggle{display:none}
.mobile-sort-row{display:none}
.filter-sheet-handle{display:none}
.filter-sheet-title{display:none}
.filter-done-btn{display:none}
.filter-active-dot{display:none}
/* On desktop the filter-collapsible wrapper and inner zones are invisible to
   layout so their children flow directly in the parent flex row */
.filter-collapsible{display:contents}
.filter-sheet-header{display:none}   /* header only meaningful in the sheet */
.filter-scroll-body{display:contents} /* children flow inline on desktop */
.filter-chip-row{display:contents}   /* chip buttons are inline flex items */
.dd-done-bar{display:none}           /* done bar only needed on mobile */
.filter-accordion{display:none}      /* accordion only shown on mobile */
.price-range-mobile{display:none}    /* mobile price row hidden on desktop; shown in @media block */
/* ── Desktop price inputs: hide number spinners ── */
#price-min-dd,#price-max-dd{-moz-appearance:textfield}
#price-min-dd::-webkit-inner-spin-button,#price-min-dd::-webkit-outer-spin-button,
#price-max-dd::-webkit-inner-spin-button,#price-max-dd::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}

/* ══════════════════════════════════════════════════════════════════════════════
   MOBILE RESPONSIVE — all changes scoped inside @media so desktop is untouched
   ══════════════════════════════════════════════════════════════════════════════ */
@media(max-width:820px){
  #dev-footer{display:none}

  /* ── Base font bump + iOS tap highlight removal ── */
  body{font-size:1rem;overflow:hidden;height:100dvh}
  a,button,input,label,.store-row,.cl-city-row,.mobile-sidebar-toggle,.mobile-filter-toggle,.paginator button{-webkit-tap-highlight-color:transparent}

  /* ── Mobile sidebar toggle button — compact ── */
  .mobile-sidebar-toggle{display:flex;align-items:center;gap:8px;padding:11px 16px;background:linear-gradient(180deg,#1e1e1e,#1a1a1a);border:none;border-bottom:1px solid #2e2e2e;cursor:pointer;font-size:.9rem;color:#ccc;font-weight:600;width:100%;text-align:left;flex-shrink:0;letter-spacing:.1px}
  .mobile-sidebar-toggle:active{background:#252525}
  .mobile-sidebar-toggle .toggle-arrow{transition:transform .2s;font-size:.65rem;color:#888}
  .mobile-sidebar-toggle .toggle-arrow.open{transform:rotate(90deg)}
  .mobile-sidebar-toggle .toggle-count{margin-left:auto;font-size:.75rem;color:#888;font-weight:400}

  /* ── Header: HIDDEN on mobile to save space (stop btn still works via JS) ── */
  header{display:none!important}
  .mobile-title-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:linear-gradient(135deg,#4a0000,#7a0000);color:#ffcccc;font-size:.8rem;font-weight:700;letter-spacing:.02em;padding:8px 16px;flex-shrink:0;border-bottom:1px solid #5c0000}
  .mobile-title-bar .mtb-title{text-align:center}
  .mobile-title-bar .mtb-ver{text-align:right;font-size:.6rem;font-weight:400;opacity:.55;white-space:nowrap}

  /* ── GC Layout: stack vertically ── */
  /* CRITICAL: proper flex height chain so #res-body / #cl-body can scroll.
     Every ancestor must constrain height: flex:1 + min-height:0 + overflow:hidden */
  .layout{flex-direction:column;overflow:hidden;flex:1;min-height:0}
  .layout{display:flex;flex-direction:column;overflow:hidden}

  /* ── Store panel: bottom sheet on mobile ── */
  .store-sheet-backdrop{
    display:none;position:fixed;inset:0;z-index:119;
    background:rgba(0,0,0,.6);opacity:0;transition:opacity .25s
  }
  .store-sheet-backdrop.visible{display:block;opacity:1}
  .sheet-handle{width:36px;height:4px;background:#3a3a3a;border-radius:2px;margin:10px auto 4px;flex-shrink:0;cursor:grab}
  .left{
    position:fixed!important;bottom:calc(56px + env(safe-area-inset-bottom));left:0;right:0;
    width:100%!important;max-height:75vh;min-width:0;background:#161616;
    transform:translateY(150%);transition:transform .3s cubic-bezier(.32,.72,0,1);
    z-index:120;border-radius:14px 14px 0 0;border-top:1px solid #333;
    border-right:none;border-bottom:none!important;
    display:flex!important;flex-direction:column;overflow:hidden;flex-shrink:0
  }
  .left.sheet-open{transform:translateY(0)}
  #store-list{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;max-height:none}
  .store-row{padding:10px 14px;gap:10px}
  .store-row label{font-size:.95rem}
  .left-footer{padding:10px 12px;flex-shrink:0}
  #sel-count{font-size:.82rem}

  /* ── GC Right panel: flex column, results is the ONLY scroller ── */
  /* z-index:auto prevents a stacking context so fixed filter sheet escapes to root */
  .right{overflow:hidden;flex:1;min-height:0;display:flex;flex-direction:column;z-index:auto}

  /* ── Status bar: single compact row ── */
  .status-bar{flex-direction:row;flex-wrap:wrap;gap:6px 14px;padding:6px 12px;align-items:center;font-size:.78rem;flex-shrink:0}
  .status-bar b{color:#ccc}
  /* Hide Items and Stores counts on mobile */
  .status-bar > span:nth-child(2),
  .status-bar > span:nth-child(3){display:none}
  #global-search-wrap{margin-left:0;flex:1 1 100%;min-width:0;display:flex;align-items:center;gap:6px}
  #global-search{flex:1;min-width:0;font-size:.88rem;padding:9px 16px;border-radius:22px;background:#1e1e1e}
  #global-search-btn{font-size:.82rem;padding:7px 12px;flex-shrink:0;border-radius:8px}
  #global-search-clear{font-size:.82rem;padding:7px 12px;flex-shrink:0;border-radius:8px}
  #s-want-match{font-size:.78rem!important}

  /* ── Hide Download Excel on mobile ── */
  #s-excel{display:none!important}

  /* ── Log: minimal ── */
  #log{padding:4px 12px;height:auto;min-height:28px;max-height:40px;font-size:.75rem;line-height:1.5;flex-shrink:0}

  /* ── Results header / filter toolbar: compact ── */
  #results-top-bar{display:contents}
  #results-top-bar .results-hdr{flex:none}
  .quick-filter-bar{padding:8px 12px;gap:6px;flex-shrink:0;overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .quick-filter-bar::-webkit-scrollbar{display:none}
  .qf-chip{font-size:.82rem;padding:7px 12px;border-radius:18px}
  .results-hdr{padding:6px 10px;gap:5px;flex-wrap:wrap;align-items:center;position:relative;top:auto;z-index:auto;flex-shrink:0;border-bottom:1px solid #2e2e2e}
  .results-hdr > *{flex-shrink:0}
  #res-title{font-size:.88rem}
  .badge{font-size:.72rem;padding:2px 7px}
  #res-search-wrap{margin-left:0;width:100%}
  #save-search-btn,#clear-filters-btn{flex:1}  /* stretch to fill row on mobile */
  #search-info-popover{right:auto;left:0}  /* popover opens left-aligned on mobile */
  #res-search{width:100%;flex:1;font-size:.84rem;padding:8px 14px;border-radius:20px}
  #res-search-count{font-size:.78rem}
  .cat-sel{font-size:.78rem;padding:6px 10px}
  #search-wl-link{font-size:.78rem}
  #clear-filters-btn{font-size:.78rem}

  /* ── Mobile filter toggle button ── */
  .mobile-filter-toggle{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;background:#1e1e1e;border:1px solid #3a3a3a;border-radius:4px;cursor:pointer;font-size:.78rem;color:#aaa;font-weight:600;margin-left:auto;white-space:nowrap}
  .mobile-filter-toggle:active{background:#252525}
  .mobile-filter-toggle .toggle-arrow{transition:transform .2s;font-size:.6rem;color:#666}
  .mobile-filter-toggle .toggle-arrow.open{transform:rotate(90deg)}
  .filter-active-dot{display:none;width:6px;height:6px;background:#c00;border-radius:50%;flex-shrink:0}
  .filter-active-dot.visible{display:inline-block}

  /* ── Filter section → bottom sheet on mobile ── */
  #gc-filter-collapsible{
    position:fixed!important;bottom:calc(56px + env(safe-area-inset-bottom));left:0;right:0;
    max-height:75vh;background:#161616;
    transform:translateY(150%);transition:transform .3s cubic-bezier(.32,.72,0,1);
    z-index:120;border-radius:14px 14px 0 0;border-top:1px solid #333;
    display:flex!important;flex-direction:column;overflow:hidden
  }
  #gc-filter-collapsible.sheet-open{transform:translateY(0)}
  /* collapsed class no longer drives visibility — sheet-open does */
  .filter-collapsible.collapsed{display:flex!important}
  /* ── Filter sheet: 3-zone layout ── */
  /* Zone 1: sticky header */
  .filter-sheet-header{
    display:flex!important;flex-direction:column;flex-shrink:0;
    padding:0 16px;border-bottom:1px solid #2a2a2a
  }
  .filter-sheet-handle{
    display:block;width:36px;height:4px;background:#3a3a3a;border-radius:2px;
    margin:10px auto 6px;flex-shrink:0
  }
  .filter-sheet-hdr-row{
    display:flex;align-items:center;justify-content:space-between;padding-bottom:10px
  }
  .filter-sheet-title{
    display:block;font-size:.92rem;font-weight:700;color:#ccc;letter-spacing:.2px
  }
  .filter-clear-all-btn{
    background:none;border:1px solid #444;color:#aaa;font-size:.78rem;
    cursor:pointer;padding:4px 10px;border-radius:14px;letter-spacing:.1px;
    -webkit-tap-highlight-color:transparent
  }
  .filter-clear-all-btn:active{background:#252525}
  /* Zone 2: scrollable content */
  .filter-scroll-body{
    display:flex!important;flex-direction:column;gap:8px;
    flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;
    padding:12px 14px 8px;min-height:0
  }
  /* Chip row: quick toggle buttons side-by-side */
  .filter-chip-row{display:flex!important;flex-wrap:wrap;gap:6px;flex-shrink:0}
  /* Mobile sort row */
  .mobile-sort-row{display:flex!important;align-items:center;gap:6px;flex-wrap:wrap;flex-shrink:0}
  .mobile-sort-label{font-size:.75rem;color:#888;flex-shrink:0}
  .mobile-sort-btn{background:#1e1e1e;border:1px solid #3a3a3a;border-radius:14px;color:#aaa;font-size:.78rem;cursor:pointer;padding:5px 12px;white-space:nowrap;-webkit-tap-highlight-color:transparent}
  .mobile-sort-btn.active{background:#3a0a0a;border-color:#c00;color:#fff}
  /* Filter buttons: full-width, larger tap targets in sheet */
  .filter-scroll-body .cat-sel{width:100%;text-align:left;padding:11px 14px;font-size:.88rem;border-radius:8px;box-sizing:border-box}
  .filter-scroll-body #res-search-wrap{width:100%;margin:0}
  .filter-scroll-body #res-search{width:100%;font-size:.88rem;padding:10px 14px 10px 36px;border-radius:8px;box-sizing:border-box}
  .filter-scroll-body .res-search-icon{display:block}
  .filter-scroll-body #filter-item-count{display:none}
  /* Zone 3: pinned Show Results button */
  .filter-done-btn{
    display:block;width:100%;padding:14px;
    background:#c00;color:#fff;border:none;border-radius:0;
    font-size:.95rem;font-weight:700;cursor:pointer;letter-spacing:.2px;
    -webkit-tap-highlight-color:transparent;flex-shrink:0;
    border-top:1px solid #a00
  }
  .filter-done-btn:active{background:#a00}
  /* ── Hide desktop dropdowns on mobile; accordion + price-range-mobile replace them ── */
  #brand-dropdown,#cond-dropdown,#cat-dropdown,#subcat-dropdown,#price-dropdown{display:none!important}

  /* ── Mobile price range row ── */
  .price-range-mobile{
    display:flex;align-items:center;gap:10px;
    padding:4px 0;flex-shrink:0
  }
  .price-range-label{font-size:.8rem;color:#888;white-space:nowrap;flex-shrink:0}
  .price-inputs-row{display:flex;align-items:center;gap:5px;flex:1}
  .price-sym{font-size:.82rem;color:#666;flex-shrink:0}
  .price-sep{color:#555;font-size:.85rem;flex-shrink:0}
  .price-inp{
    flex:1 1 0;min-width:0;width:0;
    padding:9px 10px;
    background:#252525;border:1px solid #3a3a3a;border-radius:6px;
    color:#eee;font-size:.88rem;outline:none;
    -moz-appearance:textfield
  }
  .price-inp::-webkit-inner-spin-button,.price-inp::-webkit-outer-spin-button{-webkit-appearance:none}

  /* ── Mobile filter accordion ── */
  .filter-accordion{
    display:block;border:1px solid #2a2a2a;border-radius:8px;
    overflow:hidden;flex-shrink:0;background:#1a1a1a
  }
  .acc-header{
    display:flex;align-items:center;gap:8px;width:100%;
    padding:13px 14px;background:#1a1a1a;border:none;color:#ddd;
    font-size:.9rem;font-weight:600;cursor:pointer;text-align:left;
    -webkit-tap-highlight-color:transparent
  }
  .acc-header:active{background:#222}
  .acc-title{flex:1}
  .acc-summary{
    font-size:.76rem;color:#4ade80;font-weight:400;
    max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap
  }
  .acc-arrow{font-size:.72rem;color:#555;flex-shrink:0;transition:transform .2s}
  .acc-arrow.open{transform:rotate(180deg)}
  .acc-body{max-height:0;overflow:hidden;transition:max-height .3s ease;background:#161616}
  .acc-body.open{border-top:1px solid #2a2a2a}
  .acc-search-wrap{padding:8px 12px 4px}
  .acc-search-wrap input{
    width:100%;padding:7px 12px;background:#252525;
    border:1px solid #3a3a3a;border-radius:6px;
    color:#eee;font-size:.84rem;outline:none;box-sizing:border-box
  }
  .acc-list{overflow-y:auto;-webkit-overflow-scrolling:touch;max-height:220px}
  .acc-item{
    display:flex;align-items:center;gap:10px;padding:11px 14px;
    cursor:pointer;-webkit-tap-highlight-color:transparent;
    border-bottom:1px solid #1e1e1e
  }
  .acc-item:active{background:#1e1e1e}
  .acc-item.acc-active .acc-label{color:#4ade80}
  .acc-check{width:16px;text-align:center;font-size:.82rem;color:#4ade80;flex-shrink:0;font-weight:700}
  .acc-label{flex:1;font-size:.88rem;color:#ccc}
  .acc-count{font-size:.74rem;color:#555;font-style:italic}
  .acc-empty{padding:12px 14px;color:#555;font-size:.84rem}
  .acc-clear-row{padding:10px 14px;color:#f88;font-size:.82rem;cursor:pointer;border-bottom:1px solid #2a2a2a;display:flex;align-items:center;gap:4px;-webkit-tap-highlight-color:transparent}
  .acc-clear-row:active{background:#1e1e1e}

  /* ── GC Table: .results is a flex column; only #res-body scrolls.
     JS sets display:block via inline style — override to flex when visible ── */
  #res-panel:not([style*="none"]){display:flex!important;flex-direction:column!important}
  .results{overflow:hidden;flex:1;min-height:0}
  #res-body{overflow:auto;-webkit-overflow-scrolling:touch;flex:1;min-height:0}
  table{min-width:920px;table-layout:auto;border-collapse:separate;border-spacing:0}
  th{background:#161616;font-size:.78rem;padding:8px 8px;position:sticky;top:0;z-index:10;border-bottom:2px solid #2e2e2e}
  td{padding:8px 8px;font-size:.86rem;border-bottom:1px solid #1e1e1e}
  td:nth-child(1){width:42px}
  td:nth-child(2){width:52px}
  td:nth-child(3){width:30px}
  td:nth-child(4){width:auto;min-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:1px}
  td:nth-child(5),td:nth-child(6),td:nth-child(7),td:nth-child(8),td:nth-child(9),td:nth-child(10),td:nth-child(11),td:nth-child(12){width:auto;min-width:85px}
  th:nth-child(1){width:42px}
  th:nth-child(2){width:52px}
  th:nth-child(3){width:30px}
  th:nth-child(4){width:auto;min-width:200px}
  th:nth-child(5),th:nth-child(6),th:nth-child(7),th:nth-child(8),th:nth-child(9),th:nth-child(10),th:nth-child(11),th:nth-child(12){width:auto;min-width:85px}
  .tag{font-size:.72rem;padding:2px 6px}
  .tag-kw{font-size:.72rem;padding:2px 6px}
  .tag-sold{font-size:.7rem;padding:3px 6px}
  td a{font-size:.88rem}
  .no-res{font-size:.92rem;padding:28px 20px}

  /* ── Paginator ── */
  /* Paginator: fixed directly above the bottom bar — no gap, no bleed-through */
  .paginator{position:static!important;padding:16px 8px 24px;gap:4px;flex-wrap:wrap;
    justify-content:center;background:#111;border-top:1px solid #2e2e2e}
  .paginator button{min-width:38px;height:38px;font-size:.85rem;border-radius:8px}
  .paginator .pg-info{font-size:.78rem;margin-right:0;width:100%;text-align:center;margin-bottom:6px}
  /* Padding so last row scrolls clear of the bottom action bar only */
  #res-body{padding-bottom:calc(64px + env(safe-area-inset-bottom))}

  /* ── CL Layout: stack vertically ── */
  #cl-panel{flex-direction:column;overflow:hidden}
  .cl-left{
    position:fixed!important;bottom:calc(56px + env(safe-area-inset-bottom));left:0;right:0;
    width:100%!important;max-height:75vh;min-width:0;background:#161616;
    transform:translateY(150%);transition:transform .3s cubic-bezier(.32,.72,0,1);
    z-index:120;border-radius:14px 14px 0 0;border-top:1px solid #333;
    border-right:none;border-bottom:none!important;
    display:flex!important;flex-direction:column;overflow:hidden;flex-shrink:0
  }
  .cl-left.sheet-open{transform:translateY(0)}
  #cl-city-list{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;max-height:none}
  .cl-city-row{padding:10px 14px;gap:10px}
  .cl-city-row label{font-size:.95rem}

  /* ── CL Right: flex column, only #cl-body scrolls ── */
  .cl-right{flex:1;overflow:hidden;min-height:0;display:flex;flex-direction:column}
  .cl-search-bar{padding:8px 12px;gap:8px;flex-wrap:wrap;flex-shrink:0}
  #cl-query{width:100%;flex:1 1 100%;font-size:.92rem;padding:8px 12px}
  #cl-search-btn{flex:1;font-size:.88rem;padding:8px 16px}
  #cl-status{width:100%;text-align:center;font-size:.82rem}

  /* ── CL Table: #cl-body is the sole scroller ── */
  #cl-body{overflow:auto;-webkit-overflow-scrolling:touch;flex:1;min-height:0}
  #cl-body table{min-width:600px;table-layout:auto;border-collapse:separate;border-spacing:0}
  #cl-body th{font-size:.78rem;padding:8px 8px;background:#161616;position:sticky;top:0;z-index:10;border-bottom:2px solid #2e2e2e}
  #cl-body td{padding:8px 8px;font-size:.86rem;border-bottom:1px solid #1e1e1e}
  #cl-body td:nth-child(3){white-space:normal;min-width:200px}

  /* ── CL results header ── */
  .cl-results-hdr{flex-wrap:wrap;gap:6px;padding:6px 12px;flex-shrink:0}
  #cl-count{font-size:.85rem}
  #cl-res-search{width:100%;margin-left:0;font-size:.82rem;padding:6px 10px}
  #cl-search-wl-link{font-size:.78rem}

  /* ── Modals: full-width on mobile ── */
  #kw-modal > div:last-child{width:calc(100% - 32px)!important;max-width:420px}
  #first-run-modal > div:nth-child(2){width:calc(100% - 32px)!important;max-width:400px}
  #vs-modal > div:nth-child(2){width:calc(100% - 32px)!important;max-width:380px}

  /* ── Image tooltip: disabled on mobile ── */
  #img-tooltip{display:none!important}
  /* ── Desktop thumbnail toggle: hidden on mobile ── */
  #desktop-thumb-toggle{display:none!important}

  /* ── Touch-friendly sizing ── */
  input[type=checkbox]{width:20px;height:20px}
  #search{font-size:.95rem;padding:9px 12px}
  #cl-city-search{font-size:.95rem;padding:9px 12px}
  .sel-btn,.cl-sel-btn{padding:9px 8px;font-size:.84rem;min-height:38px}
  .watch-btn,.fav-btn,.cl-fav-btn{font-size:1.2rem;padding:4px 6px;min-width:36px;min-height:36px;display:inline-flex;align-items:center;justify-content:center}
  button,a{-webkit-tap-highlight-color:transparent}

  /* ── Alternating row stripes for readability ── */
  tr:nth-child(even) td{background:rgba(255,255,255,.02)}
  #cl-body tr:nth-child(even) td{background:rgba(255,255,255,.02)}

  /* ── Hide elements replaced by the bottom action bar ── */
  .mobile-sidebar-toggle{display:none!important}
  .mobile-filter-toggle{display:none!important}
  #check-now-btn{display:none!important}
  #view-toggle-btn{display:none!important}
  .view-toggle-chip-btn{display:inline-flex!important}
  /* Collapsed left panel: no stray border when button is hidden */
  .left.collapsed{border-bottom:none}

  /* ── Pad scroll areas so bottom bar doesn't cover last row ── */
  #res-body{padding-bottom:calc(60px + env(safe-area-inset-bottom))}
  #cl-body{padding-bottom:calc(60px + env(safe-area-inset-bottom))}

  /* ── Mobile bottom action bar ── */
  .mobile-bottom-bar{
    display:flex;position:fixed;bottom:0;left:0;right:0;z-index:150;
    background:#161616;border-top:1px solid #2e2e2e;
    padding-bottom:env(safe-area-inset-bottom)
  }
  .mbb-btn{
    flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    padding:10px 4px;background:none;border:none;color:#888;cursor:pointer;
    position:relative;-webkit-tap-highlight-color:transparent;gap:4px;min-height:56px;
    border-radius:0;font-family:inherit
  }
  .mbb-btn:active{background:#1e1e1e}
  .mbb-icon{font-size:1.25rem;line-height:1}
  .mbb-label{font-size:.6rem;font-weight:700;letter-spacing:.4px;text-transform:uppercase}
  /* Check Now: prominent red center button */
  .mbb-btn.mbb-check{color:#ff4444}
  .mbb-btn.mbb-check.scanning{color:#555;pointer-events:none}
  /* Active-filter dot */
  .mbb-dot{
    position:absolute;top:8px;left:50%;transform:translateX(6px);
    width:7px;height:7px;background:#c00;border-radius:50%;display:none
  }
  .mbb-dot.visible{display:block}
}

/* ── Extra small screens (phones in portrait) ── */
@media(max-width:480px){
  header{padding:10px 12px}
  header h1{font-size:1rem}
  .app-tab{padding:10px 12px;font-size:.82rem}
  .status-bar{font-size:.82rem}
  table{min-width:800px}
  #cl-body table{min-width:540px}
  .results-hdr{gap:6px;padding:8px 10px}
  .cat-sel{font-size:.8rem;padding:7px 10px}
  .paginator button{min-width:28px;height:30px;font-size:.78rem}
}

/* ── Mobile card & list views (only active on mobile) ── */
.view-toggle-btn{display:none}
@media(max-width:820px){
  .view-toggle-btn{display:inline-flex;align-items:center;justify-content:center;width:26px;height:22px;padding:0;background:#1e1e1e;border:1px solid #3a3a3a;border-radius:4px;cursor:pointer;font-size:.9rem;color:#aaa;line-height:1;vertical-align:middle;margin-left:2px;flex-shrink:0}
  .view-toggle-btn:active{background:#252525}
  .view-toggle-btn.active{border-color:#c00;color:#ff6666}

  /* ── Card grid ── */
  .card-grid{display:flex;flex-direction:column;gap:0}
  .item-card{display:flex;align-items:stretch;gap:0;padding:10px 12px;border-bottom:1px solid #232323;background:#1a1a1a;cursor:default;-webkit-tap-highlight-color:transparent}
  .item-card:active{background:#1a1a1a}
  .item-card.is-new{border-left:3px solid #c00}
  .item-card.is-want{border-left:3px solid #2d6a2d}
  .item-card.is-new.is-want{border-left:3px solid #c00}
  .card-thumb-wrap{width:72px;height:72px;flex-shrink:0;margin-right:12px;border-radius:6px;overflow:hidden;background:#1a1a1a;display:flex;align-items:center;justify-content:center}
  .card-thumb{width:72px;height:72px;object-fit:contain;border-radius:6px;background:#1a1a1a}
  .card-thumb-placeholder{width:72px;height:72px;display:flex;align-items:center;justify-content:center;font-size:1.6rem;color:#333;background:#1a1a1a;border-radius:6px}
  .card-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
  .card-badges{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:1px}
  .card-name{font-size:.9rem;font-weight:600;color:#eee;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .card-name a{color:#eee;text-decoration:none}
  .card-name a:active{color:#7bbff7}
  .card-price{font-size:.95rem;font-weight:700;color:#fff}
  .card-meta{font-size:.75rem;color:#888;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .card-actions{display:flex;align-items:center;justify-content:flex-end;margin-top:2px}
  .card-watch-btn{background:none;border:none;cursor:pointer;color:#444;font-size:1.2rem;padding:4px;min-width:36px;min-height:36px;display:inline-flex;align-items:center;justify-content:center}
  .card-watch-btn.active{color:#f5c518}

  /* ── Compact list view ── */
  .compact-list{display:flex;flex-direction:column;gap:0}
  .compact-row{display:flex;align-items:flex-start;padding:10px 12px;border-bottom:1px solid #232323;gap:8px;background:#1a1a1a}
  .compact-row.is-new{border-left:3px solid #c00}
  .compact-row-left{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:2px}
  .compact-row-name{font-size:.84rem;color:#ddd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .compact-row-name a{color:#ddd;text-decoration:none}
  .compact-row-sub{font-size:.72rem;color:#888;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .compact-row-price{font-size:.88rem;font-weight:700;color:#fff;white-space:nowrap;flex-shrink:0}
  .compact-row-watch{background:none;border:none;cursor:pointer;color:#444;font-size:1rem;padding:2px 6px;min-height:36px;display:inline-flex;align-items:center}
  .compact-row-watch.active{color:#f5c518}
}

/* ── SEO footer ── */
.seo-footer{
  padding:12px 24px 20px;
  border-top:1px solid #1e1e1e;
  text-align:center;
  color:#555;
  font-size:.72rem;
}
.seo-footer a{color:#666;text-decoration:none}
.seo-footer a:hover{color:#aaa}