@import url("https://fonts.googleapis.com/css2?family=Inter:wght@700;800&display=swap");
/* 工具 · 仅本地开发 */

/*
 * 顶导二级菜单：header-inner 固定 66px + html/body overflow-x:hidden
 * 会裁切 absolute 下拉。本地放开裁切并抬高 z-index。
 */
body:has(.tools-nav-item) .site-header,
body:has(.tools-nav-item) .header-inner,
body:has(.tools-nav-item) .desktop-nav,
body:has(.about-nav-item) .site-header,
body:has(.about-nav-item) .header-inner,
body:has(.about-nav-item) .desktop-nav{
  overflow:visible!important;
}
/* header-inner 固定高度时仍允许下拉画出（桌面 66；移动端与全站顶栏 56 一致） */
body:has(.tools-nav-item) .header-inner,
body:has(.about-nav-item) .header-inner{
  height:auto;
  min-height:var(--header-bar-h, 66px);
  align-items:center;
}
@media (max-width:800px){
  body:has(.tools-nav-item) .header-inner,
  body:has(.about-nav-item) .header-inner{
    height:var(--header-bar-h, 56px);
    min-height:var(--header-bar-h, 56px);
  }
}
body:has(.tools-nav-item) .desktop-nav,
body:has(.about-nav-item) .desktop-nav{
  position:relative;
  z-index:230;
  align-items:center;
}

/* —— 顶导「工具」+ 二级菜单 ——
 * 默认无态 · hover 半透明绿 · 当前页实色（hover 不再变）
 * 选择器需压过 styles.css .desktop-nav a:hover / .active
 */
.tools-nav-item{
  position:relative;
  display:inline-flex;
  align-items:center;
  z-index:240;
}
.desktop-nav .tools-nav-trigger,
.tools-nav-trigger{
  display:inline-flex;
  align-items:center;
  padding:9px 13px;
  border-radius:7px;
  border:0;
  background:transparent!important;
  color:var(--muted);
  font:inherit;
  font-size:13px;
  font-weight:inherit;
  white-space:nowrap;
  box-shadow:none!important;
  box-sizing:border-box;
  cursor:pointer;
}
/* 默认无特殊态；仅非选中时 hover / 展开 → 半透明绿 */
.desktop-nav .tools-nav-trigger:hover:not(.active),
.desktop-nav .tools-nav-item:hover .tools-nav-trigger:not(.active),
.desktop-nav .tools-nav-item:focus-within .tools-nav-trigger:not(.active),
.desktop-nav .tools-nav-item.is-open .tools-nav-trigger:not(.active),
.tools-nav-trigger:hover:not(.active),
.tools-nav-item:hover .tools-nav-trigger:not(.active),
.tools-nav-item:focus-within .tools-nav-trigger:not(.active),
.tools-nav-item.is-open .tools-nav-trigger:not(.active){
  background:color-mix(in srgb,var(--accent) 14%,transparent)!important;
  color:var(--accent)!important;
  box-shadow:none!important;
}
/* 当前页选中：实色；hover / 展开保持同一实色，不再叠 hover 效果 */
.desktop-nav .tools-nav-trigger.active,
.desktop-nav .tools-nav-trigger.active:hover,
.desktop-nav .tools-nav-item:hover .tools-nav-trigger.active,
.desktop-nav .tools-nav-item:focus-within .tools-nav-trigger.active,
.desktop-nav .tools-nav-item.is-open .tools-nav-trigger.active,
.tools-nav-trigger.active,
.tools-nav-trigger.active:hover,
.tools-nav-item:hover .tools-nav-trigger.active,
.tools-nav-item:focus-within .tools-nav-trigger.active,
.tools-nav-item.is-open .tools-nav-trigger.active{
  background:var(--paper)!important;
  color:var(--ink)!important;
  box-shadow:0 2px 9px rgba(0,0,0,.04)!important;
}
body.dark .desktop-nav .tools-nav-trigger:hover:not(.active),
body.dark .desktop-nav .tools-nav-item:hover .tools-nav-trigger:not(.active),
body.dark .desktop-nav .tools-nav-item:focus-within .tools-nav-trigger:not(.active),
body.dark .desktop-nav .tools-nav-item.is-open .tools-nav-trigger:not(.active){
  background:color-mix(in srgb,var(--accent) 18%,transparent)!important;
  color:var(--accent)!important;
}
body.dark .desktop-nav .tools-nav-trigger.active,
body.dark .desktop-nav .tools-nav-trigger.active:hover,
body.dark .desktop-nav .tools-nav-item:hover .tools-nav-trigger.active,
body.dark .desktop-nav .tools-nav-item:focus-within .tools-nav-trigger.active,
body.dark .desktop-nav .tools-nav-item.is-open .tools-nav-trigger.active{
  background:#20211d!important;
  color:var(--ink)!important;
}

.tools-nav-menu{
  position:absolute;
  top:100%;
  left:0;
  width:max-content;
  min-width:0;
  max-width:min(92vw, 640px);
  margin:0;
  padding:10px 8px 8px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--paper);
  box-shadow:0 16px 40px rgba(22,70,47,.16);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(4px);
  transition:opacity .12s ease, transform .12s ease, visibility .12s;
  z-index:500;
}
.tools-nav-menu::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-14px;
  height:14px;
}
.tools-nav-item:hover .tools-nav-menu,
.tools-nav-item:focus-within .tools-nav-menu,
.tools-nav-item.is-open .tools-nav-menu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}

/* 二级项：默认无态 · hover 半透明绿 · 选中实色且 hover 不变 */
.tools-nav-link{
  display:grid;
  grid-template-columns:var(--tools-nav-left, max-content) var(--tools-nav-right, max-content);
  column-gap:28px;
  align-items:center;
  justify-content:start;
  padding:11px 12px;
  border-radius:8px;
  border:0;
  background:transparent;
  color:var(--ink);
  font-size:13px;
  font-weight:600;
  text-decoration:none;
  white-space:nowrap;
  box-shadow:none;
}
.tools-nav-link:hover:not(.is-active):not(.is-disabled){
  background:color-mix(in srgb,var(--accent) 14%,transparent);
  color:var(--accent);
}
.tools-nav-link.is-active,
.tools-nav-link.is-active:hover{
  background:color-mix(in srgb,var(--accent) 10%,var(--paper));
  color:var(--accent);
}
.tools-nav-link.is-disabled,
.tools-nav-link.is-disabled:hover{
  background:transparent;
  color:var(--muted);
  font-weight:500;
  cursor:default;
}
.tools-nav-label{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-width:0;
  white-space:nowrap;
}
.tools-nav-meta{
  justify-self:end;
  text-align:right;
  color:var(--muted);
  font-size:12px;
  font-weight:650;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.tools-nav-link.is-active .tools-nav-meta,
.tools-nav-link:hover:not(.is-disabled) .tools-nav-meta{
  color:inherit;
  opacity:.85;
}
.tools-nav-link[data-member-only],
.tools-mobile-link[data-member-only]{
  display:grid;
  grid-template-columns:var(--tools-nav-left, max-content) var(--tools-nav-right, max-content);
  column-gap:28px;
}
.tools-nav-member{
  flex:0 0 auto;
  padding:2px 7px;
  border-radius:999px;
  background:color-mix(in srgb,var(--accent) 12%,transparent);
  color:var(--accent);
  font-size:10px;
  font-weight:800;
  letter-spacing:.02em;
  white-space:nowrap;
}
.tools-mobile-link .tools-nav-member{font-size:11px}
.tools-nav-link small{
  font-size:10px;
  font-weight:600;
  opacity:.75;
  flex:0 0 auto;
}
/* 移动端工具区：可折叠二级；子项字号更小；会员无底色 */
.tools-mobile-block{
  display:flex;
  flex-direction:column;
  gap:0;
  padding:0;
  margin:0;
  border:0;
  width:100%;
}
.tools-mobile-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  box-sizing:border-box;
  width:100%;
  padding:15px 20px;
  margin:0;
  border:0;
  border-bottom:1px solid var(--line);
  color:var(--ink);
  font-size:17px;
  font-weight:400;
  font-family:inherit;
  letter-spacing:.01em;
  line-height:1.35;
  text-align:left;
  background:transparent;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.tools-mobile-title:hover,
.tools-mobile-title:active{
  background:color-mix(in srgb,var(--accent) 8%,var(--paper));
  color:var(--accent);
}
.tools-mobile-title-text{flex:1 1 auto;text-align:left}
.tools-mobile-chevron{
  flex:0 0 auto;
  width:8px;
  height:8px;
  margin-right:2px;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:rotate(45deg);
  transition:transform .18s ease;
  opacity:.7;
}
/* 展开：箭头朝上 */
.tools-mobile-block.is-open .tools-mobile-chevron{
  transform:rotate(-135deg);
  margin-top:4px;
}
.tools-mobile-panel{
  display:none;
  flex-direction:column;
  width:100%;
  border-bottom:1px solid var(--line);
}
.tools-mobile-block.is-open .tools-mobile-panel{display:flex}
.tools-mobile-link{
  display:grid;
  grid-template-columns:var(--tools-nav-left, max-content) 1fr;
  column-gap:28px;
  align-items:center;
  box-sizing:border-box;
  width:100%;
  padding:12px 20px;
  margin:0;
  border:0!important;
  border-radius:0;
  background:transparent;
  font-size:14px;
  font-weight:400;
  letter-spacing:.01em;
  color:var(--ink);
  text-decoration:none;
  text-align:left;
}
.tools-mobile-link + .tools-mobile-link{
  border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent)!important;
}
.tools-mobile-link:hover:not(.is-active):not(.is-disabled){
  background:color-mix(in srgb,var(--accent) 12%,var(--paper));
  color:var(--accent);
}
.tools-mobile-link.is-active,
.tools-mobile-link.is-active:hover{
  background:color-mix(in srgb,var(--accent) 12%,var(--paper));
  color:var(--accent);
  font-weight:500;
  border-bottom:0!important;
  box-shadow:none;
}
.tools-mobile-link .tools-nav-label{
  min-width:0;
  flex:1 1 auto;
  text-align:left;
}
/* 会员 / 即将推出：右对齐、小字；会员无底色 */
.tools-mobile-link .tools-nav-member,
.tools-mobile-link .tools-nav-soon{
  flex:0 0 auto;
  margin-left:auto;
  text-align:right;
  font-size:11px;
  font-weight:500;
  letter-spacing:0;
  line-height:1.2;
  white-space:nowrap;
  padding:0;
  border-radius:0;
  background:none;
}
.tools-mobile-link .tools-nav-member{
  color:var(--accent);
  font-weight:600;
}
.tools-mobile-link .tools-nav-soon{
  color:var(--muted);
}
.tools-mobile-link.is-disabled,
.tools-mobile-link.is-disabled:hover{
  background:transparent;
  color:var(--muted);
  font-weight:400;
  cursor:default;
}
.tools-mobile-link.is-disabled .tools-nav-label{color:var(--muted)}
/* 工具块之后一级项顶部分隔 */
.mobile-menu > .tools-mobile-block + a{
  border-top:0;
}

/* —— 地址工具页 —— */
.tools-page{padding-bottom:72px}
.tools-hero p{max-width:720px}
.tools-stats-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px 20px;
  flex-wrap:wrap;
  margin-bottom:16px;
}
.tools-stats{
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
  gap:0;
  margin:0;
  min-width:0;
}
.tools-stat{
  min-width:88px;
  padding:2px 18px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.tools-stat:first-child{padding-left:0}
.tools-stat + .tools-stat{
  border-left:1px solid var(--line);
}
.tools-stat strong{
  display:block;
  font-size:20px;
  font-weight:800;
  letter-spacing:-.3px;
  color:var(--accent);
  line-height:1.2;
}
.tools-stat span{
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:12px;
  font-weight:600;
}
.tools-panel{
  margin:8px 0 28px;
  padding:18px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--paper);
  box-shadow:0 10px 28px rgba(22,70,47,.05);
}
.tools-field-search{
  margin-left:auto;
  flex:0 1 280px;
  min-width:min(100%,200px);
  max-width:320px;
}
.tools-stats-row .tools-field-search{
  align-self:flex-start;
}
.tools-field-inline{
  display:flex;
  flex-direction:column;
  gap:0;
}
.tools-field-inline .visually-hidden{
  position:absolute;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.tools-filters{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-bottom:14px;
}
.tools-filters-2{
  grid-template-columns:repeat(2,minmax(0,1fr));
  max-width:560px;
}
.tools-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:12px;
  color:var(--muted);
  font-weight:650;
}
.tools-field select,
.tools-field input{
  min-height:40px;
  padding:0 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--bg);
  color:var(--ink);
  font:inherit;
  font-weight:600;
  width:100%;
  box-sizing:border-box;
}
/* 下拉箭头与右边距拉开 */
.tools-field select{
  appearance:none;
  -webkit-appearance:none;
  padding-right:36px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b756f' d='M1.1 1.2l4.9 4.8 4.9-4.8 1.1 1.1-6 5.9-6-5.9z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:12px 8px;
}
body.dark .tools-field select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%239aa39c' d='M1.1 1.2l4.9 4.8 4.9-4.8 1.1 1.1-6 5.9-6-5.9z'/%3E%3C/svg%3E");
}
.tools-meta-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px 16px;
  flex-wrap:wrap;
  margin:0 0 16px;
}
.tools-meta{
  margin:0;
  color:var(--muted);
  font-size:14px;
  font-weight:650;
  line-height:1.5;
  flex:1 1 auto;
  min-width:0;
}
.tools-meta time{
  display:inline;
  margin-left:6px;
  font-variant-numeric:tabular-nums;
  color:var(--ink);
  font-size:16px;
  font-weight:800;
  letter-spacing:-.2px;
}
.tools-meta-row .tools-sort-btns{
  margin-left:auto;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:6px;
}
.tools-sort-btn{
  min-height:32px;
  padding:0 8px;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--muted);
  font-size:13px;
  font-weight:700;
  cursor:pointer;
  box-shadow:none;
}
.tools-sort-btn:hover{color:var(--ink)}
.tools-sort-btn.active{
  border:0;
  background:transparent;
  color:var(--accent);
}
.tools-sort-arrow{
  display:inline-block;
  width:0;height:0;
  margin-left:4px;
  border-left:4px solid transparent;
  border-right:4px solid transparent;
  border-bottom:5px solid currentColor;
  vertical-align:middle;
  opacity:.7;
}
.tools-sort-arrow.desc{transform:rotate(180deg)}
.tools-member-kicker{
  color:var(--accent);
  font-weight:800;
}
.tools-addr-list-wrap{
  position:relative;
}
.tools-addr-list-wrap.is-teaser .tools-addr-grid{
  position:relative;
}
/* 试看第一排：底部渐隐，贴近正文页 premium-preview 浮层感 */
.tools-addr-list-wrap.is-teaser .tools-addr-grid::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:72px;
  background:linear-gradient(180deg,transparent,var(--bg) 88%);
  pointer-events:none;
  border-radius:0 0 12px 12px;
}
.tools-addr-gate-slot{
  position:relative;
  z-index:2;
  margin-top:4px;
}
/* 地址页沿用全站 .premium-gate 通用浮层 */
.tools-addr-gate-slot .premium-gate{
  margin-top:18px!important;
}
body.dark .tools-addr-list-wrap.is-teaser .tools-addr-grid::after{
  background:linear-gradient(180deg,transparent,#181a16 88%);
}
.tools-addr-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:12px;
}
.tools-addr-card{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--bg);
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    background-color .18s ease;
  will-change:transform;
}
.tools-addr-card:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--accent) 42%,var(--line));
  background:var(--paper);
  box-shadow:
    0 10px 28px rgba(22,70,47,.10),
    0 2px 8px rgba(22,70,47,.05);
}
.tools-addr-card:hover .tools-addr-street{
  color:var(--accent);
}
.tools-addr-card:hover .tools-addr-badge{
  background:color-mix(in srgb,var(--accent) 18%,var(--paper));
}
@media (prefers-reduced-motion:reduce){
  .tools-addr-card{transition:none;will-change:auto}
  .tools-addr-card:hover{transform:none}
}
.tools-addr-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
}
.tools-addr-badge{
  display:inline-flex;
  align-self:flex-start;
  padding:3px 8px;
  border-radius:999px;
  background:color-mix(in srgb,var(--accent) 12%,var(--paper));
  color:var(--accent);
  font-size:11px;
  font-weight:800;
}
.tools-addr-badge.is-res{
  background:color-mix(in srgb,#1a7f4b 14%,var(--paper));
  color:#147a45;
}
.tools-addr-provider{
  font-size:11px;
  font-weight:700;
  color:var(--muted);
  letter-spacing:.02em;
}
.tools-addr-street{
  margin:0;
  font-size:16px;
  font-weight:750;
  letter-spacing:-.2px;
  line-height:1.35;
}
.tools-addr-city{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}
.tools-addr-class{
  margin:0;
  font-size:12px;
  font-weight:650;
  line-height:1.45;
  color:var(--ink);
}
.tools-addr-meta{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px 10px;
  padding:10px 0 2px;
  border-top:1px dashed var(--line);
}
.tools-addr-meta-item{
  display:flex;
  flex-direction:column;
  gap:1px;
  min-width:0;
}
.tools-addr-meta-item span{
  font-size:10px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--muted);
}
.tools-addr-meta-item b{
  font-size:12px;
  font-weight:650;
  color:var(--ink);
  line-height:1.35;
  word-break:break-word;
}
.tools-link-btn{
  border:0;
  background:none;
  color:var(--accent);
  font:inherit;
  font-weight:700;
  cursor:pointer;
  padding:0;
  text-decoration:underline;
  text-underline-offset:2px;
}
.tools-addr-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:auto;
  padding-top:8px;
  border-top:1px solid var(--line);
}
.tools-addr-price strong{
  font-size:18px;
  font-weight:800;
  color:var(--ink);
}
.tools-addr-price span{color:var(--muted);font-size:12px;margin-left:2px}
.tools-addr-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.tools-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 12px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--paper);
  color:var(--ink);
  font-size:12px;
  font-weight:700;
  text-decoration:none;
  cursor:pointer;
}
.tools-btn:hover{border-color:var(--accent);color:var(--accent)}
.tools-btn-primary{
  border-color:var(--accent);
  background:var(--accent);
  color:#fff!important;
}
.tools-btn-primary:hover{filter:brightness(1.05);color:#fff!important}
.tools-empty{
  padding:28px 16px;
  text-align:center;
  color:var(--muted);
  font-size:13px;
  border:1px dashed var(--line);
  border-radius:12px;
  background:var(--bg);
}
.tools-faq h2{margin:0 0 12px;font-size:18px}
.tools-faq-item{
  margin:0 0 8px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--bg);
}
.tools-faq-item summary{
  cursor:pointer;
  font-weight:700;
  font-size:14px;
}
.tools-faq-item p{
  margin:10px 0 0;
  color:var(--muted);
  font-size:13px;
  line-height:1.75;
}
.tools-faq-list{
  margin:10px 0 0;
  padding:0 0 0 1.15em;
  color:var(--muted);
  font-size:13px;
  line-height:1.75;
}
.tools-faq-list li{margin:0 0 10px}
.tools-faq-list li:last-child{margin-bottom:0}
.tools-faq-list a{
  color:var(--accent);
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:2px;
}
.tools-faq-list a:hover{filter:brightness(1.05)}
.tools-faq-list strong{color:var(--ink);font-weight:700}
.tools-toast{
  position:fixed;
  left:50%;
  bottom:28px;
  transform:translateX(-50%) translateY(20px);
  z-index:300;
  padding:10px 16px;
  border-radius:999px;
  background:#123426;
  color:#eafff2;
  font-size:13px;
  font-weight:650;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
  box-shadow:0 10px 28px rgba(0,0,0,.2);
}
.tools-toast.show{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}
body.dark .tools-panel,
body.dark .tools-btn{background:#20211d;border-color:#343b32}
body.dark .tools-stat{
  background:transparent;
  border-color:transparent;
}
body.dark .tools-stat + .tools-stat{border-left-color:#343b32}
body.dark .tools-addr-card,
body.dark .tools-field input,
body.dark .tools-faq-item,
body.dark .tools-empty{background:#181a16;border-color:#343b32}
body.dark .tools-addr-card:hover{
  background:#20211d;
  border-color:color-mix(in srgb,var(--accent) 45%,#343b32);
  box-shadow:
    0 12px 32px rgba(0,0,0,.35),
    0 2px 10px rgba(0,0,0,.2);
}
body.dark .tools-field select{
  background-color:#181a16;
  border-color:#343b32;
}
body.dark .tools-sort-btn{
  background:transparent;
  border:0;
  color:var(--muted);
}
body.dark .tools-sort-btn.active{color:var(--accent)}
body.dark .tools-nav-menu{background:#20211d;border-color:#343b32}

@media (max-width:900px){
  .tools-filters{grid-template-columns:1fr 1fr}
  .tools-stats-row .tools-field-search,
  .tools-field-search{flex:1 1 100%;max-width:none;margin-left:0}
  .tools-meta-row .tools-sort-btns{width:100%;justify-content:flex-start}
}
.tools-filter-box{
  margin:12px 0 8px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--bg);
  padding:0 14px 12px;
}
.tools-filter-box summary{
  cursor:pointer;
  font-weight:800;
  font-size:14px;
  padding:12px 0;
  list-style:revert;
}
.tools-filters-offers{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
/* 本页放开 overflow-x:hidden，否则 sticky 吸顶失效 */
html:has(body[data-page="tools-offers-us"]),
body[data-page="tools-offers-us"],
html:has(body.wallet-us-offers-on),
body.wallet-us-offers-on{
  overflow-x:clip;
}
.tools-offers-layout{
  display:grid;
  grid-template-columns:248px minmax(0,1fr);
  align-items:start;
  gap:22px;
  margin:8px 0 28px;
}
.tools-offers-aside{
  position:sticky;
  top:calc(var(--header-offset, 66px) + 10px);
  z-index:4;
  align-self:start;
  max-height:calc(100vh - var(--header-offset, 66px) - 20px);
  overflow:auto;
  overscroll-behavior:contain;
}
.tools-offers-main{min-width:0}
.tools-offers-results{margin:0}
.tools-offers-results .tools-stats-row{
  align-items:center;
  margin-bottom:16px;
}
.tools-offers-updated{
  margin:0 0 0 auto;
  color:var(--muted);
  font-size:13px;
  font-weight:650;
  white-space:nowrap;
}
.tools-offers-updated time{
  color:var(--ink);
  font-variant-numeric:tabular-nums;
}
.tools-offers-fab,
.tools-offers-scrim,
.tools-offers-drawer-head{display:none}
.tools-offers-filters{
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--paper);
  box-shadow:0 10px 28px rgba(22,70,47,.05);
  padding:10px 14px 16px;
}
.tools-offers-filter-stack{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.tools-offers-set{
  margin:0;
  padding:8px 0 0;
  border:0;
  border-top:1px solid var(--line);
}
.tools-offers-set legend{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  width:100%;
  padding:0;
  font-size:12px;
  font-weight:800;
  color:var(--muted);
}
.tools-offers-reset{
  border:0;
  background:transparent;
  color:var(--accent);
  font:inherit;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  padding:0;
}
.tools-bank-checks-col{
  display:flex;
  flex-direction:column;
  flex-wrap:nowrap;
  gap:6px;
  margin-top:8px;
}
.tools-range-stack{
  flex-direction:column;
  align-items:stretch;
  gap:8px;
  margin-top:8px;
}
.tools-range-stack label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  font-size:12px;
  font-weight:700;
  color:var(--muted);
}
.tools-range-stack input{flex:1 1 auto;min-height:36px}
.tools-bank-checks{
  display:flex;
  flex-wrap:wrap;
  gap:8px 14px;
  margin-top:12px;
}
.tools-bank-checks label{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  font-weight:600;
  color:var(--ink);
  cursor:pointer;
}
.tools-check-row{margin-top:12px}
.tools-check-label{
  margin:0 0 6px;
  font-size:12px;
  font-weight:700;
  color:var(--muted);
}
.tools-range{
  display:flex;
  align-items:center;
  gap:8px;
}
.tools-range input{
  flex:1 1 0;
  min-width:0;
  width:100%;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--paper);
  color:var(--ink);
  padding:8px 10px;
  font:inherit;
}
.tools-range-sep{color:var(--muted);font-weight:700}
.tools-filter-actions{margin-top:12px}
.tools-offer-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.tools-offer-card{
  position:relative;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--bg);
  padding:14px 16px;
}
.tools-offer-card:hover{
  border-color:color-mix(in srgb,var(--accent) 40%,var(--line));
}
.tools-offer-top{
  display:grid;
  grid-template-columns:296px minmax(0,1fr);
  gap:8px;
  align-items:start;
}
.tools-offer-img{position:relative;width:max-content;max-width:100%}
.tools-offer-img .wallet-cloud-badge{
  position:absolute;
  top:8px;
  left:8px;
  z-index:2;
  padding:3px 8px;
  font-size:11px;
  box-shadow:0 4px 12px rgba(18,52,38,.12);
}
.tools-offer-img img,
.tools-offer-img-empty{
  width:288px;
  max-width:100%;
  height:184px;
  object-fit:contain;
  background:#fff;
  border:1px solid var(--line);
  border-radius:8px;
}
.tools-offer-img-empty{
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  color:var(--muted);
}
.tools-offer-topline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
  margin:0 0 10px;
}
.tools-offer-tags{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0;
  min-width:0;
  margin:0;
  padding:0;
  border:0;
}
.tools-offer-tag{
  font-size:12px;
  font-weight:650;
  color:var(--muted);
  line-height:1.3;
}
.tools-offer-tag-sep{
  margin:0 8px;
  color:var(--muted);
  opacity:.55;
  font-weight:500;
}
.tools-offer-head{
  display:flex;
  flex-direction:column;
  min-width:0;
}
.tools-offer-head h3{
  margin:0;
  padding:6px 0 0;
  border-bottom:0;
  font-size:16px;
  line-height:1.35;
}
.tools-offer-bonus-kicker{
  display:block;
  margin:6px 0 0;
  padding:0;
  font-size:11px;
  font-weight:750;
  letter-spacing:.04em;
  color:var(--muted);
  writing-mode:horizontal-tb;
  white-space:normal;
}
.tools-offer-bonus-wrap{
  position:relative;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px 8px;
  margin:0;
  padding:8px 10px;
  border:0;
  border-radius:10px;
  background:linear-gradient(125deg,#3a3a3a 0%,#1c1c1c 28%,#0a0a0a 58%,#242018 82%,#121212 100%);
  color:#f0d78a;
}
.tools-offer-bonus-wrap.is-high{
  align-items:stretch;
  gap:10px;
  padding:0 10px 0 0;
  overflow:hidden;
  background:linear-gradient(135deg,#f8e7a8 0%,#e4c36a 42%,#c9a227 78%,#f0d78a 100%);
  color:#161616;
}
.tools-offer-aff{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:4px;
  margin:0;
  padding:2px 7px;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--bg);
  color:var(--muted);
  font-size:10px;
  font-weight:700;
  line-height:1.3;
  white-space:nowrap;
}
.tools-offer-aff-info{
  display:inline-grid;
  place-items:center;
  width:16px;
  height:16px;
  padding:0;
  border:1px solid color-mix(in srgb,var(--muted) 45%,var(--line));
  border-radius:50%;
  background:var(--paper);
  color:var(--muted);
  font:italic 700 11px/1 Georgia,"Times New Roman",serif;
  cursor:pointer;
}
.tools-offer-aff.is-open .tools-offer-aff-info,
.tools-offer-aff-info:hover{
  border-color:var(--accent);
  color:var(--accent);
}
.tools-offer-aff-tip{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  z-index:8;
  width:max-content;
  max-width:min(240px,70vw);
  padding:8px 10px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--paper);
  color:var(--ink);
  font-size:12px;
  font-weight:600;
  line-height:1.45;
  white-space:normal;
  box-shadow:0 10px 24px rgba(22,70,47,.12);
}
.tools-offer-aff-tip[hidden]{display:none!important}
.tools-offer-until{
  flex:1 1 100%;
  margin:0;
  color:var(--muted);
  font-size:11px;
  font-weight:650;
  line-height:1.4;
}
.tools-offer-bonus{
  flex:1 1 auto;
  min-width:0;
  margin:0;
  color:#f3d98a;
  font-family:Inter,"Helvetica Neue",Arial,sans-serif;
  font-weight:800;
  font-size:18px;
  line-height:1.3;
  letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum" 1,"ss01" 1;
  writing-mode:horizontal-tb;
  overflow-wrap:anywhere;
  word-break:break-word;
  background:linear-gradient(180deg,#fff4c4 0%,#f0d078 45%,#d4a017 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.tools-offer-bonus-wrap.is-high .tools-offer-bonus{
  padding:8px 0;
  background:linear-gradient(180deg,#3a3a3a 0%,#161616 52%,#000 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:#111;
}
.tools-offer-high{
  display:inline-flex;
  align-items:center;
  gap:4px;
  flex:0 0 auto;
  align-self:stretch;
  margin:0;
  padding:0 10px;
  border-radius:10px 0 0 10px;
  background:linear-gradient(180deg,#6b2d9e 0%,#4a1578 45%,#2a0848 100%);
  color:#fff;
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
  line-height:1.2;
}
.tools-offer-high b{font-weight:800}
.tools-offer-high-ico{display:block;flex:0 0 18px}
.tools-offer-high .high-star{
  transform-origin:16.2px 5.2px;
  animation:high-star 1.4s ease-in-out infinite;
}
.tools-offer-high .high-spark-a{animation:high-spark 1.4s ease-in-out infinite}
.tools-offer-high .high-spark-b{animation:high-spark 1.4s ease-in-out .35s infinite}
.tools-offer-high .high-line{
  stroke-dasharray:22;
  stroke-dashoffset:0;
  animation:high-line 2.2s ease-in-out infinite;
}
@keyframes high-star{
  0%,100%{transform:translateY(0) scale(1);opacity:1}
  50%{transform:translateY(-1.2px) scale(1.18);opacity:1}
}
@keyframes high-spark{
  0%,100%{opacity:.25;transform:scale(.8)}
  50%{opacity:1;transform:scale(1)}
}
@keyframes high-line{
  0%{stroke-dashoffset:22}
  28%,100%{stroke-dashoffset:0}
}
@media (prefers-reduced-motion:reduce){
  .tools-offer-high .high-star,
  .tools-offer-high .high-spark-a,
  .tools-offer-high .high-spark-b,
  .tools-offer-high .high-line{animation:none}
}
.tools-offer-bonus-sub{
  flex:1 1 100%;
  margin:0;
  color:#e8c56b;
  font-size:12px;
  font-weight:650;
  line-height:1.45;
  opacity:.9;
}
.tools-offer-bonus-wrap.is-high .tools-offer-bonus-sub{color:#161616}
body.dark .tools-offer-bonus-wrap{
  background:linear-gradient(125deg,#3a3a3a 0%,#1c1c1c 28%,#0a0a0a 58%,#242018 82%,#121212 100%);
}
body.dark .tools-offer-bonus-wrap.is-high{
  background:linear-gradient(135deg,#f8e7a8 0%,#e4c36a 42%,#c9a227 78%,#f0d78a 100%);
}
.tools-offer-metrics{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:0;
  margin:10px 0 0;
  padding:0;
  background:none;
}
.tools-offer-metrics div{
  background:none;
  border-radius:0;
  padding:8px 12px;
  border-left:1px solid var(--line);
}
.tools-offer-metrics div:first-child{
  border-left:0;
  padding-left:0;
}
.tools-offer-metrics span{
  display:block;
  font-size:12px;
  font-weight:400;
  color:var(--muted);
  margin-bottom:3px;
}
.tools-offer-metrics b{font-size:17px;font-weight:800;color:var(--accent)}
.tools-offer-tip{
  display:inline-block;
  margin-left:4px;
  font-style:normal;
  font-size:12px;
  color:var(--muted);
  cursor:help;
}
.tools-offer-rates{
  display:flex;
  flex-wrap:nowrap;
  align-items:stretch;
  width:100%;
  margin:0 0 8px;
  padding:8px 0 0;
  border-top:1px solid var(--line);
  background:none;
}
.tools-offer-rate{
  flex:1 1 0;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:2px;
  margin:0;
  padding:8px 12px;
  border:0;
  border-left:1px solid var(--line);
  border-radius:0;
  background:none;
  font-size:12px;
  font-weight:400;
  color:var(--ink);
}
.tools-offer-rate:first-child{
  border-left:0;
  padding-left:0;
}
.tools-offer-rate span{
  display:block;
  color:var(--muted);
  font-size:12px;
  font-weight:400;
  margin-bottom:3px;
}
.tools-offer-rate b{font-size:17px;font-weight:800}
.tools-offer-rate small{
  margin-left:4px;
  font-weight:650;
  color:var(--muted);
}
.tools-offer-detail,
.tools-offer-note,
.tools-offer-line{
  margin:0 0 8px;
  font-size:13px;
  line-height:1.6;
  color:var(--muted);
}
.tools-offer-review{
  margin:12px 0 10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--paper);
  overflow:hidden;
}
.tools-offer-review details{margin:0}
.tools-offer-review summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:11px 14px;
  font-weight:800;
  font-size:14px;
  color:var(--ink);
  background:color-mix(in srgb,var(--accent) 8%,var(--paper));
}
.tools-offer-review summary::-webkit-details-marker{display:none}
.tools-offer-review summary::after{
  content:"";
  width:8px;
  height:8px;
  border-right:2px solid var(--accent);
  border-bottom:2px solid var(--accent);
  transform:rotate(45deg);
  margin-top:-4px;
  flex:0 0 auto;
}
.tools-offer-review details[open] summary{
  border-bottom:1px solid var(--line);
}
.tools-offer-review details[open] summary::after{
  transform:rotate(225deg);
  margin-top:4px;
}
.tools-offer-review-body{padding:0}
.tools-offer-table{
  width:100%;
  border-collapse:collapse;
  font-size:13px;
  line-height:1.55;
}
.tools-offer-table th,
.tools-offer-table td{
  padding:10px 12px;
  border-top:1px solid var(--line);
  vertical-align:top;
  text-align:left;
}
.tools-offer-table tr:first-child th,
.tools-offer-table tr:first-child td{border-top:0}
.tools-offer-table th{
  width:7.5em;
  color:var(--ink);
  font-size:12px;
  font-weight:800;
  background:color-mix(in srgb,var(--paper) 70%,var(--bg));
  white-space:nowrap;
}
.tools-offer-table td{color:var(--muted);font-weight:550}
.tools-offer-ul{
  margin:0;
  padding:0 0 0 1.1em;
}
.tools-offer-ul li{margin:0 0 4px}
.tools-offer-ul li:last-child{margin-bottom:0}
@media (max-width:640px){
  .tools-offer-table th,
  .tools-offer-table td{display:block;width:auto;padding:8px 12px}
  .tools-offer-table th{padding-bottom:0;border-top:1px solid var(--line);background:transparent}
  .tools-offer-table td{padding-top:4px}
  .tools-offer-table tr:first-child th{border-top:0}
}
.tools-offer-bottom{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  justify-content:space-between;
  max-width:none;
  margin-top:10px;
}
.tools-offer-save{
  position:static;
  flex:0 0 auto;
  margin-left:auto;
  z-index:1;
}
.tools-offer-actions-left{
  display:flex;
  align-items:center;
  justify-content:flex-start;
}
.tools-offer-actions-right{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  margin-left:auto;
}
.tools-offer-actions-right .wallet-btn{
  min-width:148px;
  min-height:38px;
  box-sizing:border-box;
}
.tools-offer-card .wallet-compare-check{
  min-height:34px;
  padding:0 10px;
  border:1px solid var(--line);
  border-radius:9px;
  background:var(--paper);
}
.tools-pager{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  margin-top:14px;
}
.tools-pager-meta{
  margin-right:8px;
  color:var(--muted);
  font-size:13px;
  font-weight:650;
}
.tools-pager-gap{padding:8px 4px;color:var(--muted)}
.tools-offer-metrics b{word-break:break-word}

@media (max-width:900px){
  .tools-filters{grid-template-columns:1fr 1fr}
  .tools-stats-row .tools-field-search,
  .tools-field-search{flex:1 1 100%;max-width:none;margin-left:0}
  .tools-meta-row .tools-sort-btns{width:100%;justify-content:flex-start}
  .tools-filters-offers{grid-template-columns:1fr 1fr}
  .tools-offer-metrics{grid-template-columns:1fr 1fr}
  .tools-offer-metrics div{border-left:1px solid var(--line);padding:8px 12px}
  .tools-offer-metrics div:nth-child(odd){border-left:0;padding-left:0}
  .tools-offer-metrics div:nth-child(n+3){border-top:1px solid var(--line)}
  .tools-offer-rates{flex-wrap:wrap}
  .tools-offer-rate{flex:1 1 25%}
  .tools-offers-layout{
    grid-template-columns:1fr;
    gap:14px;
  }
  .tools-offers-page{
    padding-top:58px;
  }
  .tools-offers-fab{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    position:fixed;
    top:calc(var(--header-offset, 56px) + 8px);
    left:16px;
    right:16px;
    z-index:80;
    height:44px;
    padding:0 14px;
    border:1px solid var(--line);
    border-radius:12px;
    background:var(--paper);
    box-shadow:0 10px 24px rgba(22,70,47,.12);
    color:var(--ink);
    font:inherit;
    font-weight:800;
  }
  .tools-offers-fab small{
    font-size:12px;
    font-weight:650;
    color:var(--muted);
  }
  .tools-offers-scrim{
    display:block;
    position:fixed;
    inset:0;
    z-index:85;
    background:rgba(12,38,27,.38);
  }
  .tools-offers-scrim[hidden]{display:none}
  .tools-offers-drawer-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:4px 2px 10px;
  }
  .tools-offers-drawer-head strong{font-size:15px}
  .tools-offers-drawer-done{
    border:0;
    background:transparent;
    color:var(--accent);
    font:inherit;
    font-weight:800;
    cursor:pointer;
  }
  .tools-offers-aside{
    display:none;
    position:fixed;
    top:calc(var(--header-offset, 56px) + 60px);
    left:12px;
    right:12px;
    z-index:90;
    max-height:min(72vh, calc(100vh - var(--header-offset, 56px) - 76px));
    overflow:auto;
    overscroll-behavior:contain;
  }
  body.offers-drawer-open .tools-offers-aside{display:block}
  body.offers-drawer-open{overflow:hidden}
}
@media (max-width:640px){
  .tools-filters{grid-template-columns:1fr}
  .tools-addr-bottom{flex-direction:column;align-items:flex-start}
  .tools-meta time{font-size:15px}
  .tools-filters-offers{grid-template-columns:1fr}
  .tools-offer-top{grid-template-columns:1fr}
  .tools-offer-img{width:100%}
  .tools-offer-img img,
  .tools-offer-img-empty{width:100%;height:auto;min-height:184px}
}
