/* Generated by scripts/build-assets.cjs. Do not edit. */
/* SOURCE: css/style.css */
@font-face{font-family:'Be Vietnam Pro';src:url('../fonts/be-vietnam-pro-400-vi.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:'Be Vietnam Pro';src:url('../fonts/be-vietnam-pro-400-latin.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Be Vietnam Pro';src:url('../fonts/be-vietnam-pro-500-vi.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:'Be Vietnam Pro';src:url('../fonts/be-vietnam-pro-500-latin.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Be Vietnam Pro';src:url('../fonts/be-vietnam-pro-600-vi.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:'Be Vietnam Pro';src:url('../fonts/be-vietnam-pro-600-latin.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Be Vietnam Pro';src:url('../fonts/be-vietnam-pro-700-vi.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:'Be Vietnam Pro';src:url('../fonts/be-vietnam-pro-700-latin.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Inter;src:url('../fonts/inter-500-700-vi.woff2') format('woff2');font-weight:500 700;font-style:normal;font-display:swap;unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:Inter;src:url('../fonts/inter-500-700-latin.woff2') format('woff2');font-weight:500 700;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* Kho Offer — world-class light board
   Affplus density · Linear chrome · Airbnb chips · Apple/Sakana calm · Stripe accent */

:root{
  color-scheme:light;
  /* Selectify craft → light board */
  --bg:#f3f2ef;
  --bg-soft:#ebe8e2;
  --surface:#ffffff;
  --surface-2:#fafaf8;
  --surface-3:#f1efe9;
  --surface-hover:#f7f6f3;
  --elev:#ffffff;
  --glass:rgba(243,242,239,.78);
  --line:rgba(23,21,19,.08);
  --line-soft:rgba(23,21,19,.055);
  --line-strong:rgba(23,21,19,.14);
  --text:#171513;
  --text-2:#5c574f;
  --text-3:#7d776e;
  --text-faint:#a59f95;
  --mute:var(--text-3);
  --faint:var(--text-faint);
  --brand:#171513;
  --brand-strong:#0a0908;
  --brand-ink:#f7f6f2;
  --brand-wash:rgba(23,21,19,.06);
  --accent:#2f6fed;
  --accent-soft:rgba(47,111,237,.09);
  --accent-strong:#1f58c8;
  --accent-ring:rgba(47,111,237,.2);
  --green:#1f7a4c;
  --green-soft:rgba(31,122,76,.1);
  --red:#b42318;
  --amber:#b54708;
  --amber-soft:rgba(181,71,8,.12);
  --cps:var(--accent);--cpa:var(--accent);--cpo:var(--accent);
  --r-xs:7px;--r-sm:10px;--r:12px;--r-lg:14px;--r-xl:18px;
  --radius:14px;
  --shadow-sm:0 1px 2px rgba(23,21,19,.04);
  --shadow:0 2px 10px -3px rgba(23,21,19,.08),0 1px 2px rgba(23,21,19,.04);
  --shadow-lg:0 18px 50px -20px rgba(23,21,19,.22),0 6px 16px rgba(23,21,19,.06);
  --font:"Be Vietnam Pro",Inter,ui-sans-serif,system-ui,sans-serif;
  --display:"Be Vietnam Pro",Inter,ui-sans-serif,system-ui,sans-serif;
  --mono:Inter,ui-monospace,monospace;
  --header-h:56px;
  --dock-h:60px;
  --maxw:1120px;
  --ease:cubic-bezier(.25,.1,.25,1);
  --border:var(--line);
  --row-h:72px;
}

.page-reviews{
  --warm:#c4785a;
  --warm-strong:#b56748;
  --warm-ink:#fffaf7;
  --warm-wash:rgba(196,120,90,.1);
  --warm-line:rgba(196,120,90,.28);
  --warm-line-soft:rgba(196,120,90,.14);
  --accent:var(--warm);
  --accent-soft:var(--warm-wash);
  --accent-strong:var(--warm-strong);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0}
body{
  min-height:100dvh;
  background:
    radial-gradient(1100px 480px at 85% -8%, rgba(47,111,237,.07), transparent 55%),
    radial-gradient(900px 420px at 0% 0%, rgba(23,21,19,.035), transparent 50%),
    var(--bg);
  color:var(--text);
  font-family:var(--font);
  font-size:15px;
  line-height:1.55;
  letter-spacing:-.011em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
  scrollbar-gutter:stable;
}
body::before,body::after{content:none;display:none}
body.menu-open,body.filters-open,body.cmdk-open{overflow:hidden}

::selection{background:var(--accent-ring);color:var(--text)}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{color:inherit}
h1,h2,h3,h4{font-family:var(--display);margin:0 0 .45em;line-height:1.15;letter-spacing:-.02em;font-weight:600}
h1{letter-spacing:-.02em;font-weight:700}
h2,h3,h4{letter-spacing:-.015em;font-weight:600}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0}
.container{width:min(100% - 40px,var(--maxw));margin-inline:auto}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;font-feature-settings:"cv01","ss03"}
.text-dim{color:var(--text-2)}.text-faint{color:var(--text-3)}

:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
  border-radius:var(--r-xs);
}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:36px;padding:9px 14px;
  border:1px solid transparent;border-radius:10px;
  font-size:13px;font-weight:500;letter-spacing:-.01em;line-height:1.1;
  cursor:pointer;white-space:nowrap;
  transition:background .15s var(--ease),border-color .15s,color .15s,box-shadow .15s,opacity .15s,transform .12s;
}
.btn:active{transform:scale(.985)}
.btn-primary{background:var(--brand);color:var(--brand-ink);box-shadow:var(--shadow-sm);border-color:transparent}
.btn-primary:hover{background:var(--brand-strong)}
.btn-accent{background:var(--accent);color:#fff;box-shadow:0 1px 2px rgba(47,111,237,.25)}
.btn-accent:hover{background:var(--accent-strong)}
.btn-outline{background:var(--surface);border-color:var(--line);color:var(--text-2)}
.btn-outline:hover{border-color:var(--line-strong);background:var(--surface-2);color:var(--text)}
.btn-ghost{background:transparent;border-color:transparent;color:var(--text-3)}
.btn-ghost:hover{color:var(--text);background:var(--surface-3)}
.btn-sm{min-height:30px;padding:5px 11px;font-size:12px}
.btn-block{width:100%}
.btn[disabled],.btn:disabled{opacity:.42;cursor:not-allowed;transform:none;box-shadow:none}

.ticker{display:none!important}

/* Header — Apple/Attio slim bar */
.site-header{
  position:sticky;top:0;z-index:50;height:var(--header-h);
  background:var(--glass);
  backdrop-filter:blur(16px) saturate(1.2);
  -webkit-backdrop-filter:blur(16px) saturate(1.2);
  border-bottom:1px solid var(--line);
}
.header-inner{height:100%;display:flex;align-items:center;gap:12px}
.brand{display:flex;align-items:center;gap:10px;margin-right:auto;font-family:var(--display);font-size:14.5px;font-weight:600;letter-spacing:-.025em;color:var(--text);text-decoration:none}
.brand:hover{color:var(--text)}
.brand-logo{
  width:28px;height:28px;border-radius:8px;flex:0 0 auto;
  box-shadow:0 1px 2px rgba(23,21,19,.12),0 0 0 1px rgba(23,21,19,.04);
}
.brand-word{line-height:1;padding-top:1px}
.brand-mark{display:none}
.nav{display:flex;align-items:center;gap:1px}
.nav a{position:relative;padding:6px 10px;border-radius:7px;color:var(--text-3);font-size:12.5px;font-weight:500;letter-spacing:-.01em;transition:color .15s,background .15s}
.nav a:hover{color:var(--text);background:var(--surface-3)}
.nav a.is-active{color:var(--text);background:transparent;font-weight:600}
.nav a.is-active::after{content:"";position:absolute;left:10px;right:10px;bottom:3px;height:1.5px;border-radius:1px;background:var(--accent)}
.nav a.nav-highlight{color:var(--text-2)}
.nav-toggle{display:none;width:36px;height:36px;border:1px solid var(--line);border-radius:10px;background:var(--surface);align-items:center;justify-content:center;cursor:pointer}
.nav-toggle:hover{border-color:var(--line-strong);background:var(--surface-2)}

.cmdk-trigger{
  display:inline-flex;align-items:center;gap:7px;
  min-height:32px;padding:3px 9px 3px 10px;
  border:1px solid var(--line);border-radius:999px;
  background:var(--surface);color:var(--text-3);cursor:pointer;
  box-shadow:var(--shadow-sm);
  transition:border-color .15s,background .15s,color .15s;
}
.cmdk-trigger:hover{border-color:var(--line-strong);color:var(--text-2)}
.cmdk-trigger .cmdk-label{font-size:12px;font-weight:500}
.cmdk-trigger kbd,.cmdk kbd{
  padding:1px 5px;border:1px solid var(--line);border-radius:5px;
  background:var(--bg);color:var(--text-3);
  font-family:var(--mono);font-size:9.5px;font-weight:600;
}

/* Hero — short, board-first (no sparse empty marketing) */
.hero{
  position:relative;
  padding:clamp(36px,5vw,56px) 0 28px;
}
.hero::after{content:none;display:none}
.hero>.container{position:relative;z-index:1}
.hero-kicker,.page-head::before{
  display:block;margin-bottom:8px;
  color:var(--text-3);font-size:11px;font-weight:600;letter-spacing:-.005em;
}
.hero-kicker{font-family:var(--font);text-transform:none}
.page-head::before{font-family:var(--mono);letter-spacing:.1em;text-transform:uppercase;font-size:10px;font-weight:500;content:"Kho Offer"}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:10px;
  color:var(--text-3);font-size:12px;font-weight:500;
}
.hero-eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--accent)}
.hero h1{
  max-width:560px;
  font-size:clamp(32px,5.5vw,44px);
  font-weight:600;line-height:1.12;letter-spacing:-.045em;text-wrap:balance;
  color:var(--text);margin:0;
}
.hero p.lead,.warm-hero p.lead{
  max-width:42em;margin-top:12px;margin-bottom:0;
  color:var(--text-3);font-size:15px;line-height:1.55;font-weight:400;text-wrap:pretty;
}
.hero-nets{display:none}

/* Airbnb-style prominent search — floating shadow only here */
.search-bar{
  display:flex;align-items:center;gap:10px;max-width:560px;margin-top:20px;
  min-height:48px;padding:5px 5px 5px 16px;
  background:var(--elev);border:1px solid var(--line);border-radius:14px;
  box-shadow:var(--shadow);
  transition:border-color .15s,box-shadow .15s;
}
.search-bar:focus-within{
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-soft),var(--shadow);
}
.search-bar svg{flex:0 0 auto;color:var(--text-3)}
.search-bar input{flex:1;min-width:0;padding:8px 0;background:none;border:0;outline:0;color:var(--text);font-size:14px}
.search-bar input::placeholder{color:var(--text-faint)}
.search-bar .btn{min-height:32px;padding:6px 14px;font-size:12.5px}

/* Compact stats — inline strip, not big marketing blocks */
.stats-strip{
  display:flex;flex-wrap:wrap;align-items:baseline;gap:0;margin-top:16px;
  padding-top:12px;border-top:1px solid var(--line);
}
.stat-cell{display:flex;align-items:baseline;gap:6px;padding:0 16px 0 0}
.stat-cell + .stat-cell{padding-left:16px;border-left:1px solid var(--line)}
.stat-num{font-family:var(--mono);font-size:15px;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:-.02em;font-feature-settings:"cv01","ss03"}
.stat-label{color:var(--text-3);font-size:11.5px;font-weight:500}
.disclaimer{
  display:flex;align-items:flex-start;gap:8px;margin:0;padding:10px 0;
  border-bottom:1px solid var(--line);color:var(--text-3);font-size:11.5px;line-height:1.45;
}
.disclaimer .ico-svg,.disclaimer .ico{
  flex:0 0 auto;width:18px;height:18px;border-radius:999px;
  display:grid;place-items:center;padding:2px;box-sizing:border-box;
  background:var(--surface-3);color:var(--text-3);
}
.disclaimer .ico-svg{stroke:currentColor}

.page-head{position:relative;padding:clamp(28px,4vw,40px) 0 10px}
.page-head h1{max-width:720px;font-size:clamp(32px,3.2vw,40px);font-weight:700;letter-spacing:-.02em;margin:0 0 8px;line-height:1.15}
.page-head p{max-width:540px;color:var(--text-2);font-size:15px;margin:0;line-height:1.55}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:12px;flex-wrap:wrap}
.section-head h2{margin:0;font-size:clamp(16px,1.6vw,18px);font-weight:600;letter-spacing:-.02em}
.section-sub{color:var(--text-3);font-size:12px}

/* Chips */
.chip{
  display:inline-flex;align-items:center;gap:4px;
  padding:2px 7px;border:0;border-radius:999px;
  background:var(--surface-3);color:var(--text-3);
  font-size:11px;font-weight:500;line-height:1.35;white-space:nowrap;
}
.chip-cps,.chip-cpa,.chip-cpo{background:var(--accent-soft);color:var(--accent)}
.chip-hot{background:var(--accent-soft);color:var(--accent);font-weight:600}
.badge-mark{
  width:26px;height:26px;display:inline-grid;place-items:center;flex:none;
  border-radius:7px;color:#fff;font-family:var(--display);font-size:8.5px;font-weight:700;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.06);
}
.badge-mark.lg{width:28px;height:28px;border-radius:8px;font-size:9.5px}

.kind-chip{
  display:inline-flex;align-items:center;padding:2px 7px;margin-top:3px;
  border-radius:999px;border:1px solid var(--line);background:var(--surface-2);
  font-size:10px;font-weight:600;letter-spacing:.01em;line-height:1.3;white-space:nowrap;
  color:var(--text-3);
}
.kind-platform{background:var(--accent-soft);border-color:transparent;color:var(--accent)}
.kind-platform::before{content:none}
.score-card .kind-chip,.net-cell-name .kind-chip{margin-top:0}

/* Workspace — board is the product */
.workspace{
  display:grid;grid-template-columns:176px minmax(0,1fr);gap:20px;
  align-items:start;padding:16px 0 96px;
}
body.has-tray .workspace,body.has-tray main{padding-bottom:220px}

/* Linear-like compact sticky sidebar */
.filters{
  position:sticky;top:calc(var(--header-h) + 12px);
  padding:18px;
  background:var(--elev);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
}
.filters::before{
  content:"Bộ lọc";display:block;margin:0 0 14px;
  color:var(--faint);font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;
}
.filter-group{padding:0 0 10px;margin-bottom:10px;border-bottom:1px solid var(--line-soft)}
.filter-group:last-of-type{padding-bottom:0;margin-bottom:0;border:0}
.filter-group h3{
  margin:0 0 6px;color:var(--faint);font-family:var(--font);
  font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:500;
}
.filter-row{
  display:flex;align-items:center;gap:7px;min-height:26px;padding:2px 4px;
  border-radius:6px;color:var(--text-2);font-size:12px;cursor:pointer;user-select:none;
  transition:background .12s,color .12s;
}
.filter-row:hover{background:var(--surface-3);color:var(--text)}
.filter-row input{
  appearance:none;width:13px;height:13px;display:grid;place-items:center;flex:none;margin:0;
  border:1.5px solid var(--line-strong);border-radius:3.5px;background:var(--surface);
}
.filter-row input:checked{background:var(--accent);border-color:var(--accent)}
.filter-row input:checked::after{
  content:"";width:6.5px;height:3.5px;border:solid #fff;border-width:0 0 1.5px 1.5px;
  transform:translateY(-1px) rotate(-45deg);
}
.filter-row .fr-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.filter-row .fr-count{color:var(--text-faint);font-family:var(--mono);font-size:10px}
.net-dot{width:6px;height:6px;border-radius:50%;flex:none}
.filters-close{display:none!important;width:100%;margin-top:12px}

/* Results panel — Affplus white board */
.results-panel{
  background:var(--elev);
  border:1px solid var(--line);
  border-radius:var(--radius);
  min-width:0;
  overflow:clip;
  box-shadow:var(--shadow-sm);
}
.featured-rail{display:none}

/* Sticky filter chrome while scrolling */
.results-chrome{
  position:sticky;top:var(--header-h);z-index:20;
  padding:12px 14px 8px;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line-soft);
}
.results-panel > .quick-chips,
.results-panel > .toolbar,
.results-panel > .active-filters,
.results-panel > .result-count{
  /* fallback if chrome wrapper absent — still padded */
}

.quick-chips{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.quick-label{color:var(--text-3);font-size:11px;font-weight:600;margin-right:2px}
.quick-sep{width:1px;height:14px;background:var(--line);margin-inline:2px}
/* Airbnb chips ~30–32px */
.qchip{
  display:inline-flex;align-items:center;gap:5px;
  min-height:30px;padding:4px 11px;
  border:1px solid var(--line);border-radius:999px;
  background:var(--surface);color:var(--text-2);
  font-size:12px;font-weight:500;cursor:pointer;
  transition:background .12s,border-color .12s,color .12s,box-shadow .12s;
}
.qchip:hover{color:var(--text);border-color:var(--line-strong);background:var(--surface-2)}
.qchip.is-on{
  background:var(--accent-soft);border-color:transparent;color:var(--accent);
  box-shadow:inset 0 0 0 1px rgba(47,111,237,.22);
}
.qchip .net-dot{width:6px;height:6px}

.toolbar{
  display:flex;align-items:center;gap:8px;margin-bottom:8px;padding:0;
}
.toolbar input[type=search],.toolbar select,.review-toolbar select{
  height:34px;padding:5px 10px;background:var(--surface);
  border:1px solid var(--line);border-radius:8px;color:var(--text);font-size:12.5px;outline:0;
  transition:border-color .15s,box-shadow .15s;
}
.toolbar input[type=search]{flex:1;min-width:0}
.toolbar input:focus,.toolbar select:focus,.review-toolbar select:focus{
  border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);
}
select{color-scheme:light}
.filter-toggle{display:none}
.view-toggle{display:flex;flex:none;padding:2px;border:1px solid var(--line);border-radius:8px;background:var(--surface-2)}
.view-toggle button{
  width:28px;height:26px;display:grid;place-items:center;
  border:0;border-radius:6px;background:transparent;color:var(--text-3);cursor:pointer;
}
.view-toggle button:hover{color:var(--text)}
.view-toggle button.is-on{background:var(--surface);color:var(--text);box-shadow:var(--shadow-sm)}

.result-bar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  flex-wrap:wrap;margin-bottom:4px;
}
.result-count{margin:0;color:var(--text-3);font-size:12px}
.result-count b{color:var(--text);font-family:var(--mono);font-weight:600}
.active-filters{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.active-filters:empty{display:none;margin:0}
.active-filters .chip{cursor:pointer;padding:4px 9px;border:1px solid var(--line);background:var(--surface);font-size:11px}
.active-filters .chip:hover{border-color:var(--red);color:var(--red)}
.active-filters .x{opacity:.7}
.clear-all{align-self:center;color:var(--accent);font-size:12px;font-weight:500;cursor:pointer}
.clear-all:hover{text-decoration:underline;text-underline-offset:3px}

/* ===== Affplus dense offer rows ===== */
.offer-grid{
  display:flex;flex-direction:column;gap:8px;
  padding:10px 12px 14px;
}
.offer-grid.is-compact{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:8px;padding:8px 12px 12px;
}
.offer-grid.is-entering .offer-card{animation:card-in .14s var(--ease) both}
@keyframes card-in{from{opacity:0;transform:translateY(2px)}to{opacity:1;transform:none}}

.offer-card{
  position:relative;display:flex;align-items:center;gap:12px;
  min-height:var(--row-h);
  padding:12px 14px;
  margin:0;
  background:var(--surface-2);
  border:1px solid var(--line);
  border-radius:12px;
  transition:background .12s,border-color .12s,box-shadow .12s,transform .12s;
}
.offer-card::before{content:none;display:none}
.offer-card:last-child{border-bottom-color:var(--line)}
.offer-card:hover{
  background:var(--surface);
  border-color:var(--line-strong);
  box-shadow:var(--shadow-sm);
}
.offer-card.is-compared{
  background:var(--accent-soft);
  border-color:rgba(47,111,237,.28);
  box-shadow:inset 0 0 0 1px rgba(47,111,237,.12);
}
.offer-card > .badge-mark,
.offer-card > .badge-mark.lg{
  width:28px;height:28px;border-radius:8px;font-size:9px;
}
.offer-card-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.offer-card-top{display:flex;align-items:center;gap:7px;flex-wrap:nowrap;min-width:0}
.offer-card h3{
  margin:0;font-family:var(--font);font-size:15px;font-weight:600;
  letter-spacing:-.016em;line-height:1.3;color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;
}
.offer-card h3 a{color:inherit}
.offer-card h3 a:hover{color:var(--accent)}
.offer-card h3 a::after{content:"";position:absolute;inset:0}
.offer-card-chips{display:none} /* folded into meta for density */
.offer-card-meta{
  display:flex;align-items:center;gap:0;flex-wrap:wrap;
  color:var(--text-3);font-size:12px;font-weight:500;line-height:1.3;min-width:0;
}
.offer-card-meta > span{white-space:nowrap}
.offer-card-meta .meta-sep{margin:0 6px;color:var(--text-faint);opacity:.7}
.offer-card-meta .meta-type{
  color:var(--accent);font-weight:600;font-size:11px;
  letter-spacing:.02em;
}
.offer-card-side{
  display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:4px;
  min-width:112px;flex:none;text-align:right;position:relative;z-index:1;
}
.commission-figure{
  font-family:var(--mono);font-size:17px;font-weight:700;
  letter-spacing:-.03em;font-variant-numeric:tabular-nums;
  font-feature-settings:"cv01","ss03";
  color:var(--accent)!important;line-height:1.1;
}
.commission-figure.cps,.commission-figure.cpa,.commission-figure.cpo{color:var(--accent)!important}
.commission-figure small{
  display:block;margin-top:1px;color:var(--text-faint);
  font-family:var(--font);font-size:9.5px;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;
}
.offer-card-side a{display:none}

.compare-toggle{
  position:relative;z-index:2;
  min-height:22px;padding:1px 7px;
  border:1px solid transparent;border-radius:999px;
  background:transparent;color:var(--text-faint);
  font-size:11px;font-weight:500;cursor:pointer;
  transition:background .12s,color .12s,border-color .12s;
}
.compare-toggle:hover{color:var(--text-2);background:var(--surface-3);border-color:var(--line)}
.compare-toggle.is-on{background:var(--accent-soft);border-color:transparent;color:var(--accent)}
.compare-toggle:disabled{opacity:.35;cursor:not-allowed}

.offer-grid.is-compact .offer-card{
  flex-direction:column;align-items:stretch;min-height:0;padding:12px;
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r);
}
.offer-grid.is-compact .offer-card:hover{background:var(--surface);border-color:var(--line-strong)}
.offer-grid.is-compact .offer-card.is-compared{background:var(--accent-soft)}
.offer-grid.is-compact .offer-card h3{white-space:normal}
.offer-grid.is-compact .offer-card-chips{display:flex;gap:5px;flex-wrap:wrap}
.offer-grid.is-compact .offer-card-side{
  width:100%;min-width:0;flex-direction:row;flex-wrap:wrap;
  align-items:center;justify-content:space-between;text-align:left;
  padding-top:10px;border-top:1px solid var(--line-soft);margin-top:4px;
}
.offer-grid.is-compact .offer-card-side a{display:none}

/* Skeleton */
.skel{background:linear-gradient(90deg,var(--surface-3) 25%,var(--bg-soft) 50%,var(--surface-3) 75%);background-size:220% 100%;animation:shimmer 1.2s linear infinite;border-radius:6px}
.skel-badge{width:28px;height:28px;border-radius:8px;flex:none}
.skel-title{width:58%;height:12px;margin-bottom:0}
.skel-chips{width:42%;height:9px}
.skel-meta{width:36%;height:8px}
.skel-fig{width:72px;height:22px}
.offer-card.is-skel{pointer-events:none;min-height:72px}
.offer-card.is-skel .offer-card-main{gap:8px}
@keyframes shimmer{to{background-position:-220% 0}}

.featured-rail-head,.featured-rail-track,.featured-pill{display:none}

.empty-state{
  width:100%;padding:48px 24px;text-align:center;color:var(--text-2);
  background:var(--surface-2);border:1px dashed var(--line);border-radius:var(--r);
  margin:8px;
}
.empty-state h3{margin:8px 0 6px;font-size:16px;color:var(--text)}
.empty-state p{max-width:340px;margin:0 auto 14px;font-size:13px}
.empty-art{color:var(--text-faint);margin-bottom:6px}

/* Detail — title + network + freshness + dominant CTA */
.breadcrumb{margin:16px 0 12px;color:var(--text-3);font-size:12px}
.breadcrumb a{color:var(--accent);font-weight:500}
.breadcrumb a:hover{text-decoration:underline;text-underline-offset:3px}
.detail-head{
  display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:16px;
  padding:4px 0 18px;border-bottom:1px solid var(--line);
}
.detail-head-left{flex:1;min-width:240px}
.detail-net-line{display:flex;align-items:center;gap:8px;margin-bottom:10px;color:var(--text-2);font-size:12.5px;font-weight:600;flex-wrap:wrap}
.detail-net-line a{color:var(--accent)}
.detail-fresh{color:var(--text-3);font-weight:500;font-size:11.5px}
.detail-fresh::before{content:"·";margin-right:8px;color:var(--text-faint)}
.detail-head h1{max-width:700px;font-size:clamp(22px,2.8vw,28px);font-weight:600;letter-spacing:-.028em;margin:0 0 10px;line-height:1.18}
.detail-head .offer-card-chips{display:flex;gap:6px;flex-wrap:wrap}
.detail-head-figure{min-width:168px;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.detail-head-figure .commission-figure{font-size:clamp(26px,3.4vw,34px)}
.detail-head-figure .btn{min-width:148px}
.detail-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.85fr);gap:16px;align-items:start}
.card{
  padding:16px;margin-bottom:10px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
}
.card h2{color:var(--text-3);font-family:var(--font);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin:0 0 4px}
.facts-table{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:4px}
.facts-table .fact-row{padding:9px 12px 9px 0}
.facts-table .fact-row:nth-child(even){padding-left:12px;border-left:1px solid var(--line-soft)}
.fact-row{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line-soft);color:var(--text-2);font-size:12.5px}
.fact-row:last-child{border:0}
.fact-row .fv{color:var(--text);font-family:var(--mono);font-weight:600;text-align:right;font-variant-numeric:tabular-nums;font-feature-settings:"cv01","ss03"}
.term-list li,.step-list li{position:relative;padding:8px 0 8px 24px;border-bottom:1px solid var(--line-soft);color:var(--text-2);font-size:12.5px}
.term-list li:last-child,.step-list li:last-child{border:0}
.term-list li::before{content:"";position:absolute;left:4px;top:15px;width:5px;height:5px;border:1.5px solid var(--text-3);border-radius:50%}
.step-list{counter-reset:step}
.step-list li::before{
  counter-increment:step;content:counter(step);position:absolute;left:0;top:9px;
  width:17px;height:17px;display:grid;place-items:center;border-radius:5px;
  background:var(--surface-3);color:var(--text-2);font-family:var(--mono);font-size:10px;font-weight:600;
}
.sticky-col{position:sticky;top:calc(var(--header-h) + 14px)}
.related-section{margin:20px 0 48px}
.related-rail{
  display:flex;gap:10px;overflow-x:auto;padding:4px 2px 12px;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
}
.related-rail .rail-card{flex:0 0 min(280px,82vw);scroll-snap-align:start}
.related-rail .offer-card{
  flex-direction:column;align-items:stretch;min-height:0;padding:12px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
}
.related-rail .offer-card-chips{display:flex;gap:5px}
.related-rail .offer-card-side{
  width:100%;min-width:0;flex-direction:row;align-items:center;justify-content:space-between;
  padding-top:8px;border-top:1px solid var(--line-soft);margin-top:2px;
}
.related-rail .offer-card-side a{display:inline;color:var(--accent);font-size:12px;font-weight:600}
.related-rail .offer-card h3{font-size:13.5px;white-space:normal}
.detail-cta-bar{display:none}

/* Networks */
.score-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));gap:8px;margin-bottom:8px}
.score-card{
  padding:12px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  border-left:3px solid color-mix(in srgb, var(--net, var(--line-strong)) 55%, var(--line));
}
.score-card:hover{border-color:var(--line-strong)}
.score-card-top{display:flex;gap:8px;align-items:flex-start;margin-bottom:8px}
.score-card h3{margin:0;font-family:var(--font);font-size:12.5px;font-weight:600}
.score-overall{color:var(--text-3);font-size:11px;margin-top:2px}
.score-overall b{color:var(--text);font-family:var(--mono);font-size:17px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-feature-settings:"cv01","ss03"}
.score-bar{display:grid;grid-template-columns:60px 1fr;gap:8px;align-items:center;margin-top:5px;color:var(--text-3);font-size:10px;font-weight:600}
.score-bar i{display:block;height:3px;border-radius:99px;background:var(--surface-3);overflow:hidden}
.score-bar b{display:block;height:100%;border-radius:99px;background:var(--text-faint);opacity:.7}

.compare-wrap{
  position:relative;overflow:auto;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
}
.compare-wrap::after{
  content:"Kéo ngang →";display:none;position:sticky;left:16px;bottom:10px;width:max-content;
  padding:4px 8px;background:var(--bg);border:1px solid var(--line);border-radius:6px;
  color:var(--text-3);font-size:10px;
}
table.compare{width:100%;min-width:840px;border-collapse:separate;border-spacing:0}
table.compare th,table.compare td{padding:12px 14px;border-bottom:1px solid var(--line-soft);color:var(--text-2);font-size:12.5px;text-align:left;vertical-align:top}
table.compare thead th{
  position:sticky;top:0;z-index:1;background:var(--surface-2);
  color:var(--text-3);font-size:10px;text-transform:uppercase;letter-spacing:.06em;font-weight:600;
}
table.compare th:first-child,table.compare td:first-child{
  position:sticky;left:0;z-index:2;min-width:148px;background:var(--surface);
  color:var(--text-2);font-weight:600;box-shadow:1px 0 var(--line-soft);
}
table.compare thead th:first-child{z-index:3;background:var(--surface-2)}
table.compare tbody tr:last-child td{border-bottom:0}
table.compare tbody tr:hover td{background:var(--surface-hover)}
table.compare tbody tr:hover td:first-child{background:var(--surface-hover)}
.net-cell-name{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--text);font-weight:600}
.strength-list{padding-left:15px;color:var(--text-2);font-size:12px}
.strength-list li{margin-bottom:4px}
.network-links{display:flex;gap:7px;margin-top:10px;flex-wrap:wrap}
.value-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:16px 0 32px}
.value-card{
  padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  transition:border-color .15s;
}
.value-card:hover{border-color:var(--line-strong)}
.value-card .vc-ico{
  width:32px;height:32px;display:grid;place-items:center;margin-bottom:10px;
  background:var(--surface-3);border:1px solid var(--line);border-radius:8px;font-size:15px;
}
.value-card h3{font-family:var(--font);font-size:13.5px;font-weight:600;margin:0 0 6px}
.value-card p{margin:0;color:var(--text-2);font-size:12.5px}

.pill-group{display:flex;gap:6px;flex-wrap:wrap}
.pill{
  min-height:30px;padding:5px 11px;border:1px solid var(--line);border-radius:999px;
  background:var(--surface);color:var(--text-2);font-size:12px;font-weight:500;cursor:pointer;
  transition:background .12s,border-color .12s,color .12s;
}
.pill:hover{color:var(--text);border-color:var(--line-strong);background:var(--surface-2)}
.pill.is-active{background:var(--brand);border-color:var(--brand);color:var(--brand-ink)}

/* Reviews */
.warm-hero{position:relative;padding:clamp(28px,4vw,40px) 0 20px}
.warm-hero::before,.warm-hero::after{content:none;display:none}
.warm-hero h1{
  max-width:560px;font-size:clamp(1.7rem,3.4vw,2.25rem);
  font-weight:600;line-height:1.1;letter-spacing:-.034em;text-wrap:balance;margin:0;
}
.page-reviews .warm-hero .btn-primary{background:var(--warm);color:var(--warm-ink)}
.page-reviews .warm-hero .btn-primary:hover{background:var(--warm-strong)}
.page-reviews .review-fab{background:var(--warm);color:var(--warm-ink)}
.page-reviews .pill.is-active{background:var(--warm);border-color:var(--warm);color:var(--warm-ink)}
.page-reviews .stars{color:var(--warm)}
.page-reviews .star-input button.is-on{color:var(--warm)}
.page-reviews .star-input button:hover{color:var(--warm-strong)}
.page-reviews .submit-section .btn-primary{background:var(--warm);color:var(--warm-ink)}
.page-reviews .submit-section .btn-primary:hover{background:var(--warm-strong)}
.page-reviews .radio-card input{accent-color:var(--warm)}
.page-reviews .radio-card.is-active{border-color:var(--warm-line);background:var(--warm-wash);color:var(--text)!important}
.page-reviews .field input:focus,.page-reviews .field select:focus,.page-reviews .field textarea:focus{
  box-shadow:0 0 0 3px var(--warm-wash);border-color:var(--warm-line);
}
.trust-cta{display:flex;gap:12px;margin-top:16px;flex-wrap:wrap;align-items:center}
.trust-cta .btn-outline{border:0;color:var(--text-3);min-height:auto;padding:0;background:transparent;box-shadow:none}
.trust-cta .btn-outline:hover{background:transparent;color:var(--warm);border:0}
.trust-stats{display:flex;flex-wrap:wrap;gap:0;margin-top:20px;padding-top:12px;border-top:1px solid var(--line)}
.trust-stat{display:flex;align-items:baseline;gap:6px;padding:0 16px 0 0}
.trust-stat + .trust-stat{padding-left:16px;border-left:1px solid var(--line)}
.trust-stat .num{color:var(--text);font-family:var(--mono);font-size:16px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.02em;font-feature-settings:"cv01","ss03"}
.trust-stat .lbl{color:var(--text-3);font-size:11px}
.review-toolbar{display:flex;align-items:center;gap:8px;margin:20px 0 10px;flex-wrap:wrap}
.review-toolbar .pill-group:first-child{flex:1}
.review-toolbar select{margin-left:auto;height:34px;padding:5px 10px;background:var(--surface);border:1px solid var(--line);border-radius:8px}
.review-grid{column-count:3;column-gap:10px;margin-bottom:40px}
.review-card{
  break-inside:avoid;display:flex;flex-direction:column;gap:8px;
  margin-bottom:10px;padding:14px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  transition:border-color .15s;
}
.page-reviews .review-card{border-color:var(--warm-line-soft)}
.review-card:hover{border-color:var(--line-strong)}
.page-reviews .review-card:hover{border-color:var(--warm-line)}
.review-top{display:flex;align-items:center;gap:9px}
.avatar{
  width:32px;height:32px;display:grid;place-items:center;flex:none;border-radius:8px;
  color:#fff;font-family:var(--display);font-size:10.5px;font-weight:600;
}
.review-who{flex:1;min-width:0}
.review-who .name{font-size:12.5px;font-weight:600}
.review-who .sub{color:var(--text-3);font-size:11px}
.stars{color:var(--amber);font-size:12px;letter-spacing:1.5px}
.review-quote{margin:0;color:var(--text);font-size:13.5px;line-height:1.45;letter-spacing:-.01em}
.proof-box{
  display:flex;align-items:center;gap:9px;padding:10px;
  background:var(--surface-2);border:1px dashed var(--line);border-radius:var(--r-sm);
  color:var(--text-2);font-size:12px;
}
.proof-box .ico{font-size:15px;color:var(--accent)}
.proof-amount{color:var(--text);font-family:var(--mono);font-size:12.5px;font-weight:600;font-variant-numeric:tabular-nums;font-feature-settings:"cv01","ss03"}
.review-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:2px}
.helpful-btn{
  padding:4px 9px;background:var(--surface);border:1px solid var(--line);border-radius:999px;
  color:var(--text-2);font-size:11px;cursor:pointer;
}
.helpful-btn:hover{color:var(--text);border-color:var(--line-strong)}
.helpful-btn.is-liked{background:var(--accent-soft);border-color:transparent;color:var(--accent)}
.review-grid .empty-state{column-span:all}

.review-fab{
  display:none;position:fixed;right:16px;bottom:calc(var(--dock-h) + 16px);z-index:60;
  align-items:center;gap:8px;min-height:44px;padding:0 14px;
  background:var(--brand);color:var(--brand-ink);border-radius:999px;
  font-weight:600;box-shadow:var(--shadow-lg);
  transition:opacity .2s,transform .2s;
}
.review-fab.is-hidden{opacity:0;pointer-events:none;transform:translateY(12px)}

/* Forms */
.submit-section{
  scroll-margin-top:90px;padding:clamp(18px,2.5vw,24px);
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
}
.submit-section h2{font-size:clamp(17px,2vw,22px);font-weight:600}
.form-note{
  margin:14px 0 18px;padding:11px 12px;background:var(--surface-2);
  border-left:3px solid var(--amber);border-radius:0 var(--r-sm) var(--r-sm) 0;
  color:var(--text-2);font-size:12px;
}
.field{margin-bottom:14px}
.field label{display:block;margin-bottom:5px;color:var(--text-2);font-size:12px;font-weight:600}
.field .hint,.hint{margin-top:5px;color:var(--text-3);font-size:11px}
.field input[type=text],.field input[type=email],.field input[type=tel],.field input[type=url],.field select,.field textarea{
  width:100%;min-height:40px;padding:9px 11px;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r-sm);outline:0;color:var(--text);font-size:13.5px;
  transition:border .15s,box-shadow .15s;
}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--line-strong)}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);
}
.field input::placeholder,.field textarea::placeholder{color:var(--text-faint)}
.field textarea{min-height:100px;resize:vertical}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.radio-grid{display:flex;gap:8px;flex-wrap:wrap}
.radio-card{
  display:flex!important;align-items:center;gap:8px;flex:1 1 170px;min-height:42px;margin:0!important;
  padding:8px 11px;border:1px solid var(--line);border-radius:var(--r-sm);
  background:var(--surface);color:var(--text-2)!important;font-size:12px!important;cursor:pointer;
}
.radio-card:hover{border-color:var(--line-strong)}
.radio-card input{accent-color:var(--brand)}
.radio-card.is-active{background:var(--brand-wash);border-color:var(--line-strong);color:var(--text)!important}
.star-input{display:flex;gap:4px;width:max-content;font-size:24px;cursor:pointer}
.star-input button{appearance:none;border:0;background:transparent;padding:0;margin:0;color:var(--line-strong);font-size:24px;line-height:1;cursor:pointer}
.star-input button.is-on{color:var(--amber)}
.file-drop{
  display:block!important;padding:18px!important;background:var(--surface-2);
  border:1px dashed var(--line)!important;border-radius:var(--r)!important;
  text-align:center;color:var(--text-2)!important;font-size:12.5px!important;cursor:pointer;
}
.file-drop:hover{background:var(--surface);border-color:var(--line-strong)!important}
.file-preview{display:flex;align-items:center;gap:10px;margin-top:10px}
.file-preview img{width:60px;height:60px;object-fit:cover;border:1px solid var(--line);border-radius:8px}
.pending-list{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.pending-item{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 12px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm);
}
.pi-title{font-size:13px;font-weight:600}
.pi-sub{color:var(--text-3);font-size:11px}
.status-pill{padding:3px 8px;border-radius:999px;background:var(--amber-soft);color:var(--amber);font-size:10px;font-weight:700;white-space:nowrap}

/* Toast / footer */
.toast-host{position:fixed;bottom:22px;left:50%;z-index:200;width:min(92vw,480px);display:flex;flex-direction:column;gap:8px;transform:translateX(-50%)}
body.has-tray .toast-host{bottom:168px}
.toast{
  width:100%;padding:12px 16px;background:var(--text);border:0;border-radius:var(--r);
  box-shadow:var(--shadow-lg);color:#fff;font-size:13px;text-align:center;
  opacity:0;transform:translateY(10px);transition:.22s var(--ease);
}
.toast.is-visible{opacity:1;transform:none}
.toast--success{background:var(--text)}
.site-footer{margin-top:48px;padding:24px 0 40px;border-top:1px solid var(--line);color:var(--text-faint);font-size:12px}
.site-footer .container{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.site-footer a{color:var(--text-3)}
.site-footer a:hover{color:var(--accent)}

.filters-backdrop{position:fixed;inset:0;z-index:65;background:rgba(23,21,19,.32);opacity:0;pointer-events:none;transition:opacity .2s var(--ease)}
.filters-backdrop.is-visible{opacity:1;pointer-events:auto}

/* Command palette — floating shadow */
.cmdk{position:fixed;inset:0;z-index:120;display:grid;place-items:start center;padding:12vh 16px 16px}
.cmdk[hidden]{display:none}
.cmdk-backdrop{position:absolute;inset:0;background:rgba(23,21,19,.38);backdrop-filter:blur(3px)}
.cmdk-panel{
  position:relative;width:min(100%,520px);
  background:var(--surface);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow-lg);
  opacity:0;transform:translateY(6px);
  transition:opacity .15s var(--ease),transform .15s var(--ease);
}
.cmdk.is-open .cmdk-panel{opacity:1;transform:none}
.cmdk-search{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line)}
.cmdk-search svg{color:var(--text-3)}
.cmdk-search input{flex:1;min-width:0;background:none;border:0;outline:0;color:var(--text);font-size:14.5px}
.cmdk-list{max-height:min(52vh,400px);overflow:auto;margin:5px;padding:0;list-style:none}
.cmdk-item{
  width:100%;display:grid;grid-template-columns:68px 1fr;grid-template-rows:auto auto;gap:0 10px;
  padding:9px 11px;border:0;border-radius:8px;background:transparent;color:var(--text);text-align:left;cursor:pointer;
}
.cmdk-item:hover,.cmdk-item.is-active{background:var(--surface-3)}
.cmdk-type{grid-row:1 / span 2;align-self:center;color:var(--text-3);font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.cmdk-title{font-size:13px;font-weight:600}
.cmdk-sub{color:var(--text-3);font-size:11px}
.cmdk-empty{padding:20px;color:var(--text-3);text-align:center}
.cmdk-hint{padding:8px 14px 11px;color:var(--text-3);font-size:11px}

/* Compare tray — max 4, floating shadow */
.compare-tray{
  position:fixed;left:0;right:0;bottom:0;z-index:80;
  transform:translateY(110%);transition:transform .28s var(--ease);pointer-events:none;
}
.compare-tray.is-open{transform:none;pointer-events:auto}
.compare-tray-inner{
  width:min(100% - 24px,var(--maxw));margin:0 auto 12px;padding:12px 14px;
  background:var(--surface);border:1px solid var(--line);border-radius:12px;
  box-shadow:var(--shadow-lg);
}
.compare-tray-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.compare-tray-title{font-size:13px;font-weight:600}
.compare-tray-title b{font-family:var(--mono);color:var(--accent);font-variant-numeric:tabular-nums;font-feature-settings:"cv01","ss03"}
.compare-tray-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.compare-col{padding:10px;background:var(--surface-2);border:1px solid var(--line);border-radius:10px}
.compare-col-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px}
.compare-x{width:24px;height:24px;border:1px solid var(--line);border-radius:7px;background:var(--surface);color:var(--text-3);cursor:pointer}
.compare-x:hover{color:var(--red);border-color:var(--red)}
.compare-col h4{margin:0 0 6px;font-family:var(--font);font-size:12.5px;font-weight:600;line-height:1.3}
.compare-col dl{margin:0 0 8px}
.compare-col dl div{display:flex;justify-content:space-between;gap:8px;padding:2px 0;font-size:11px}
.compare-col dt{color:var(--text-3)}
.compare-col dd{margin:0;color:var(--text);font-weight:600;text-align:right}
.compare-col dd.cps,.compare-col dd.cpa,.compare-col dd.cpo{color:var(--accent)}
.compare-hint{margin:0;color:var(--text-3);font-size:11.5px}
.compare-tray.is-hint .compare-tray-cols{grid-template-columns:1fr}

.mobile-dock{display:none}

/* Responsive */
@media(max-width:1100px){
  .score-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
  .review-grid{column-count:2}
}
@media(max-width:980px){
  .workspace{grid-template-columns:1fr;gap:12px;padding-top:12px}
  .filter-toggle{display:inline-flex}
  .filters{
    position:fixed;inset:0 auto 0 0;z-index:70;width:min(88vw,320px);
    padding:18px 16px;overflow:auto;border:0;border-right:1px solid var(--line);
    border-radius:0;transform:translateX(-104%);transition:transform .28s var(--ease);
    background:var(--surface);box-shadow:var(--shadow-lg);
  }
  .filters::before{margin-bottom:12px}
  .filters.is-open{transform:none}
  .filters-close{display:flex!important;position:sticky;bottom:0}
  .detail-grid{grid-template-columns:1fr}
  .sticky-col{position:static}
  .compare-wrap::after{display:block}
  .score-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .results-chrome{top:var(--header-h)}
  .facts-table{grid-template-columns:1fr}
  .facts-table .fact-row:nth-child(even){padding-left:0;border-left:0}
}
@media(max-width:860px){
  .nav-toggle{display:none}
  .nav{display:none}
  .cmdk-trigger .cmdk-label,.cmdk-trigger kbd{display:none}
  .cmdk-trigger{width:38px;height:38px;padding:0;justify-content:center;border-radius:10px}
  .mobile-dock{
    display:flex;position:fixed;left:12px;right:12px;bottom:10px;z-index:70;
    height:var(--dock-h);padding:5px;
    background:var(--surface);border:1px solid var(--line);border-radius:14px;
    box-shadow:var(--shadow-lg);
    transition:transform .22s var(--ease),opacity .22s;
  }
  .mobile-dock.is-hidden{transform:translateY(120%);opacity:0}
  .dock-item{
    flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    border-radius:10px;color:var(--text-3);font-size:10px;font-weight:600;
  }
  .dock-item:hover,.dock-item:active{color:var(--text);background:var(--surface-3)}
  .dock-item.is-active{color:var(--text);background:var(--surface-3)}
  body.has-dock{padding-bottom:calc(var(--dock-h) + 18px)}
  .compare-tray{bottom:calc(var(--dock-h) + 6px)}
  .toast-host{bottom:88px}
  body.has-tray .toast-host{bottom:230px}
  .review-fab{display:inline-flex}
  .detail-cta-bar{
    display:flex;gap:8px;position:fixed;left:12px;right:12px;bottom:calc(var(--dock-h) + 12px);z-index:55;
    padding:8px;background:var(--surface);border:1px solid var(--line);border-radius:12px;
    box-shadow:var(--shadow-lg);
  }
  .detail-cta-bar .btn{flex:1}
  body.page-offer.has-tray .compare-tray{bottom:calc(var(--dock-h) + 72px)}
  .related-section{margin-bottom:88px}
}
@media(max-width:700px){
  .container{width:min(100% - 28px,var(--maxw))}
  .hero{padding:20px 0 12px}
  .hero h1,.warm-hero h1{font-size:clamp(1.65rem,7.5vw,2.05rem)}
  .search-bar{align-items:stretch;flex-wrap:wrap;padding:6px;border-radius:var(--r);min-height:0}
  .search-bar svg{margin:10px 0 0 4px}
  .search-bar input{width:calc(100% - 32px)}
  .search-bar .btn{width:100%;border-radius:var(--r-sm)}
  .stat-cell + .stat-cell,.trust-stat + .trust-stat{padding-left:0;border-left:0}
  .stats-strip,.trust-stats{gap:8px 16px}
  .stat-cell,.trust-stat{padding:0}
  .results-chrome{padding:10px 10px 6px}
  .workspace{padding-bottom:48px}
  .toolbar{align-items:stretch;flex-wrap:wrap}
  .toolbar input[type=search]{order:-1;flex-basis:100%;width:100%}
  .toolbar select{flex:1;min-width:0}
  .offer-grid{padding:0 4px 4px}
  .offer-card{align-items:center;flex-wrap:nowrap;min-height:72px;padding:8px 6px;gap:10px}
  .offer-card-main{min-width:0;flex:1}
  .offer-card h3{white-space:nowrap}
  .offer-card-meta{overflow:hidden;max-height:1.35em}
  .offer-card-side{
    width:auto;min-width:96px;flex-direction:column;
    align-items:flex-end;justify-content:center;
    padding-top:0;border-top:0;
  }
  .commission-figure{font-size:15px}
  .offer-grid.is-compact{grid-template-columns:1fr 1fr;gap:8px;padding:8px}
  .offer-grid.is-compact .offer-card-meta,.offer-grid.is-compact .offer-card-chips{display:none}
  .offer-grid.is-compact .commission-figure{font-size:15px}
  .detail-head{flex-direction:column}
  .detail-head-figure{text-align:left;align-items:flex-start}
  .review-grid{column-count:1}
  .field-row{grid-template-columns:1fr}
  .site-footer .container{flex-direction:column}
  .compare-wrap{margin-inline:-14px;border-radius:0;border-inline:0}
  .compare-tray-cols{display:flex;overflow-x:auto;padding-bottom:2px}
  .compare-col{flex:0 0 160px}
  .score-strip{grid-template-columns:1fr}
  .review-toolbar{align-items:stretch;flex-direction:column}
  .review-toolbar select{margin-left:0;width:100%}
}
@media(max-width:420px){
  .brand{font-size:13.5px}
  .page-head{padding-top:24px}
  .pill{font-size:11px;padding-inline:10px}
  .fact-row{flex-direction:column;gap:2px}
  .fact-row .fv{text-align:left}
  .commission-figure{font-size:16px}
  .offer-grid.is-compact{grid-template-columns:1fr}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .ticker-track{animation:none}
  .offer-card:hover,.review-card:hover,.value-card:hover,.score-card:hover,.btn:hover{transform:none}
  .cmdk-panel,.compare-tray,.mobile-dock{transition:none}
}


/* —— Brand / icon polish 2026-09-04 —— */
.site-header .brand{min-height:28px}
.hero-kicker{
  display:inline-flex;align-items:center;gap:8px;
  padding:4px 10px;border-radius:999px;
  background:var(--surface);border:1px solid var(--line);
  box-shadow:var(--shadow-sm);
  width:fit-content;
}
.proof-box .ico-svg{color:var(--accent);flex:0 0 auto}
.mobile-dock{
  backdrop-filter:blur(16px) saturate(1.2);
  -webkit-backdrop-filter:blur(16px) saturate(1.2);
}
.dock-item svg{opacity:.88}
.dock-item.is-active svg{opacity:1;color:var(--accent)}
.review-fab{gap:8px}.review-fab svg{display:block;flex:0 0 auto}
.empty-state .empty-art{color:var(--text-faint)}
.badge-mark{
  font-feature-settings:"tnum";
  letter-spacing:-.02em;
}


/* —— Selectify-inspired polish (light) 2026-09-04 —— */
.search-bar .btn-primary{border-radius:10px;min-height:38px;padding-inline:16px;font-weight:600}
.hero-kicker{
  background:var(--elev)!important;
  border:1px solid var(--line)!important;
  color:var(--faint)!important;
  font-weight:500!important;
  letter-spacing:.02em;
}
.qchip,.chip,.pill{
  border-color:var(--line);
  background:transparent;
}
.qchip.is-on,.pill.is-active{
  background:var(--brand)!important;
  border-color:transparent!important;
  color:var(--brand-ink)!important;
  box-shadow:none!important;
}
.stats-strip{
  margin-top:22px;
  padding:14px 0 0;
  border-top:1px solid var(--line);
}
.disclaimer{
  border-bottom-color:var(--line)!important;
  color:var(--faint)!important;
}
.page-head h1,.warm-hero h1{
  font-weight:600!important;
  letter-spacing:-.04em!important;
}
.score-card,.review-card,.value-card,.net-table-wrap,.form-card{
  border-radius:var(--radius)!important;
  border:1px solid var(--line)!important;
  background:var(--elev)!important;
  box-shadow:var(--shadow-sm);
}
.mobile-dock{
  border:1px solid var(--line);
  background:rgba(255,255,255,.86)!important;
}
.cmdk-trigger{
  background:transparent;
  box-shadow:none;
}
.brand-word{letter-spacing:-.03em}
.offer-card-side .payout{
  letter-spacing:-.03em;
}
@media (max-width:880px){
  .search-bar{border-radius:12px}
}


/* Brand logos */
.badge-mark.brand-logo-mark{
  background:#fff!important;
  color:transparent;
  box-shadow:inset 0 0 0 1px var(--line);
  overflow:hidden;
}
.badge-mark.brand-logo-mark img{
  width:100%;height:100%;object-fit:contain;display:block;
  padding:3px;box-sizing:border-box;
}
.badge-mark.brand-logo-mark.lg img{padding:4px}
.filter-row .brand-logo-mark,.qchip .brand-logo-mark{
  width:16px;height:16px;border-radius:4px;flex:none;
}
.filter-row .brand-logo-mark img,.qchip .brand-logo-mark img{padding:1.5px}
.qchip .net-dot{display:none}
.filter-row .net-dot{display:none}

/* SOURCE: css/design-system.css */
/* Kho Offer · shared visual system, 2026-09-06.
   Loaded after style.css on every public page. Replaces ui-2026 / ux-refresh.
   Layout: 1200px canvas, 8px spacing rhythm, 14px controls, 20px panels. */
:root, .page-reviews {
  --bg:#f7f8f6; --bg-soft:#eef1ed; --surface:#fff; --surface-2:#f8faf7;
  --surface-3:#edf1ed; --surface-hover:#f4f7f3; --elev:#fff;
  --text:#192e3a; --text-2:#50616a; --text-3:#61717a; --text-faint:#61717a;
  --mute:var(--text-3); --faint:var(--text-3);
  --line:#dde4df; --line-soft:#eaf0eb; --line-strong:#abbab0; --border:var(--line);
  --brand:#192e3a; --brand-strong:#0e222c; --brand-ink:#fff; --brand-wash:#edf2f0;
  --accent:#b94b30; --accent-strong:#993c24; --accent-soft:#fbede6; --accent-ring:#efb5a2;
  --green:#286d53; --green-soft:#eaf4ed; --amber:#99601a; --amber-soft:#faf1df;
  --warm:var(--accent); --warm-strong:var(--accent-strong); --warm-ink:#fff;
  --warm-wash:var(--accent-soft); --warm-line:var(--line-strong); --warm-line-soft:var(--line);
  --r-xs:6px; --r-sm:10px; --r:14px; --r-lg:18px; --r-xl:24px; --radius:18px;
  --shadow-sm:0 2px 3px #192e3a04; --shadow:0 8px 30px #192e3a08;
  --shadow-lg:0 20px 64px #192e3a1a; --header-h:76px; --dock-h:64px; --maxw:1200px;
}
body { background:var(--bg); font-size:14px; letter-spacing:-.015em; overflow-x:clip; }
body, button, input, textarea, select { font-family:var(--font); }
[hidden] { display:none!important; }
main { min-height:60vh; }
section, [id] { scroll-margin-top:100px; }
button, a, input, select, textarea { -webkit-tap-highlight-color:transparent; }
button:disabled { cursor:not-allowed; opacity:.45; }
button, .btn { touch-action:manipulation; }
img { height:auto; }
h1, h2, h3 { color:var(--text); text-wrap:pretty; }
.container { width:min(100% - 64px,var(--maxw)); }
.btn { min-height:44px; padding:11px 17px; border-radius:10px; font-size:13px; font-weight:600; box-shadow:none; }
.btn-icon-label { display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.btn-icon-only { display:inline-grid; width:40px; min-width:40px; padding:0; place-items:center; font-size:22px; }
.ui-icon { display:block; flex:none; }
.btn-icon-label .ui-icon { transition:transform .18s ease; }
a.btn-icon-label:hover .ui-icon { transform:translateX(2px); }
button.btn-icon-label:hover .ui-icon { transform:scale(1.06); }
.btn-primary { background:var(--brand); color:#fff; }
.page-reviews .submit-section .btn-primary { background:var(--brand); color:#fff; }
.page-reviews .submit-section .btn-primary:hover { background:var(--brand-strong); }
:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.btn-accent { background:var(--accent); color:#fff; box-shadow:none; }
.btn-sm { min-height:36px; padding:8px 12px; font-size:12px; }
.btn-outline { background:#fff; border-color:var(--line); color:var(--text); }
.btn-ghost { color:var(--text-2); }
.skip-link { position:fixed; top:8px; left:16px; z-index:300; padding:12px 16px; background:var(--text); color:#fff; border-radius:8px; transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.site-header { height:var(--header-h); background:#ffffffed; border-bottom:1px solid var(--line); backdrop-filter:blur(18px); }
.header-inner { gap:14px; }
.brand { font-size:19px; font-weight:700; letter-spacing:-.045em; gap:11px; }
.brand-logo { width:32px; height:32px; border-radius:9px; box-shadow:none; }
.nav { gap:4px; margin-right:20px; }
.nav a { padding:10px 14px; font-size:13px; color:var(--text-2); border-radius:8px; }
.nav a:hover, .nav a.is-active { background:var(--surface-3); color:var(--text); }
.nav a.is-active::after { content:none; }
.header-trust, .site-disclosure, #pubTipBanner { display:none; }
.header-saved, .cmdk-trigger { display:inline-flex; align-items:center; justify-content:center; height:40px; min-width:40px; padding:9px; gap:7px; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--text-2); cursor:pointer; box-shadow:none; }
.header-saved [data-saved-count] { font-size:11px; font-weight:700; }
.header-saved.has-saved { color:var(--accent); }
.cmdk-trigger { padding-inline:12px; }
.cmdk-trigger kbd { border:0; background:var(--bg); padding:3px 5px; }
.co-eyebrow, .hero-kicker { color:var(--text-3); font-size:10px; font-weight:600; letter-spacing:.16em; text-transform:uppercase; margin:0 0 13px; }
.co-eyebrow::before, .co-eyebrow::after, .page-head::before { content:none; }
.section-head { display:block; margin:36px 0 18px; }
.section-head-row { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; }
.section-head-title, .section-head h2 { font-size:24px; font-weight:600; letter-spacing:-.045em; line-height:1.3; text-transform:none; }
.section-head-link { color:var(--accent); font-size:12px; font-weight:600; }
.sec-workspace { padding-bottom:24px; }
.page-head { padding:58px 0 32px; margin-bottom:28px; border-bottom:1px solid var(--line); }
.page-head h1 { max-width:850px; font-size:clamp(30px,4vw,46px); line-height:1.23; margin:0 0 16px; }
.page-head p.lead { max-width:680px; color:var(--text-2); font-size:15px; line-height:1.75; }
.page-head .co-eyebrow { color:var(--text-3); font-size:10px; margin-bottom:14px; }
.sec-head-actions { margin:0 0 24px; }
.disclaimer { padding:12px 0; font-size:12px; }
.sec-workspace > .disclaimer, .catalog-note { display:none; }

/* Home: a single search task, then the working catalog. */
.hero { padding:58px 0 48px; background:#edf1e9; border-bottom:1px solid #dbe3d7; }
.hero-forsale-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr); align-items:center; gap:64px; }
.hero-copy, .hero-card, .detail-grid > * { min-width:0; }
.hero-kicker { border:0!important; background:transparent!important; box-shadow:none; padding:0; color:#5b7064!important; letter-spacing:.12em; font-weight:600!important; }
.hero h1 { font-size:clamp(34px,4.4vw,54px); font-weight:600; line-height:1.21; letter-spacing:-.055em; max-width:650px; }
.hero h1 .em { color:var(--accent); }
.hero p.lead { margin-top:20px; max-width:430px; font-size:14px; color:var(--text-2); line-height:1.8; }
.hero-card { background:#fff; border:1px solid #d5dfd3; border-radius:20px; padding:30px; box-shadow:0 12px 40px #19382c08; }
.hero-badges { display:flex; align-items:center; gap:8px; margin-bottom:18px; }
.hb { display:inline-flex; align-items:center; gap:6px; font-size:10px; font-weight:500; color:var(--green); }
.hb-premium { display:none; }
.hero-card-title { font-size:23px; font-weight:600; letter-spacing:-.045em; margin:0 0 10px; }
.hero-card-sub { color:var(--text-3); font-size:12px; margin-bottom:22px; }
.platform-pills { display:flex; background:var(--surface-3); padding:4px; gap:4px; border-radius:10px; margin-bottom:18px; }
.platform-pills button { min-height:36px; flex:1; padding:7px 10px; border:0; border-radius:7px; color:var(--text-2); background:transparent; font-size:12px; font-weight:500; cursor:pointer; }
.platform-pills button.is-on { background:#fff; color:var(--text); box-shadow:0 1px 4px #192e3a15; }
.search-bar { min-height:52px; margin:0; padding:5px 5px 5px 12px; border-color:var(--line); border-radius:11px; box-shadow:none; }
.search-bar input { font-size:13px; }
.search-bar .btn-primary { min-height:40px; border-radius:7px; padding:9px 15px; background:var(--accent); color:#fff; }
.search-bar .btn-primary:hover { background:var(--accent-strong); }
.stats-strip { display:flex; flex-wrap:wrap; gap:22px; border:0; padding:0; margin-top:28px; }
.stat-cell { display:flex; flex-direction:column; align-items:start; gap:4px; padding:0; }
.stat-cell + .stat-cell { border:0; padding:0; }
.stat-num { font-size:22px; color:var(--text); letter-spacing:-.04em; font-weight:600; }
.stat-label { color:var(--text-3); font-size:10px; font-weight:400; }
.stat-cell-dual { display:none; }
.hero-cats-wrap, .spotlight-wrap, .logo-wall, .campaign-strip, .fresh-rail-section, .recent-rail-section, .saved-rail-section { display:none; }
.catalog-desk { padding:42px 0 20px; }
.catalog-head { margin:0 0 25px; }
.catalog-head .co-eyebrow { display:none; }
.catalog-title { font-size:28px!important; margin-bottom:8px!important; }
.catalog-sub { font-size:13px; color:var(--text-3); margin:0; }
.workspace { grid-template-columns:218px minmax(0,1fr); gap:28px; padding:0 0 32px; }
.filters { top:calc(var(--header-h) + 20px); padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; max-height:calc(100dvh - 120px); overflow-y:auto; scrollbar-width:thin; }
.filters::before { content:none; }
.filters-head { font-size:13px; font-weight:600; margin-bottom:20px; }
.filter-group { padding:0 0 18px; margin-bottom:18px; border-color:var(--line); }
.filter-group h3 { font-size:10px; font-weight:600; color:var(--text-3); letter-spacing:.1em; margin-bottom:8px; }
.filter-row { min-height:32px; padding:5px 4px; gap:8px; font-size:11px; }
.filter-row input { width:15px; height:15px; border-width:1px; border-radius:4px; }
.filter-row input:checked { background:var(--text); border-color:var(--text); }
.filter-row .fr-label { white-space:normal; line-height:1.4; }
.filter-row .fr-count { font-size:10px; color:var(--text-3); }
.results-panel { background:transparent; border:0; border-radius:0; box-shadow:none; overflow:visible; }
.results-chrome { position:relative; top:auto; z-index:2; padding:16px 18px 12px; background:#fff; border:1px solid var(--line); border-radius:14px; margin-bottom:16px; backdrop-filter:none; }
.filter-bar-title { display:none; }
.quick-chips { flex-wrap:nowrap; overflow-x:auto; gap:7px; scrollbar-width:thin; padding-bottom:3px; margin-bottom:13px; }
.quick-chips > * { flex-shrink:0; }
.quick-label, .quick-sep { display:none; }
.qchip { min-height:32px; padding:6px 11px; font-size:11px; border-radius:7px; background:var(--bg); border-color:transparent; }
.qchip.is-on { background:var(--brand)!important; color:#fff!important; }
.toolbar { gap:9px; margin-bottom:10px; }
.toolbar input[type=search], .toolbar select, .review-toolbar select { height:42px; font-size:12px; border-color:var(--line); border-radius:8px; }
.view-toggle { padding:3px; border-radius:8px; }
.view-toggle button { width:32px; height:32px; }
.result-count { font-size:11px; }
.offer-grid { gap:10px; padding:0; }
.offer-card { min-height:122px; padding:20px; background:#fff; border:1px solid var(--line); border-radius:14px; gap:16px; }
.offer-card:hover { border-color:var(--line-strong); box-shadow:var(--shadow); }
.offer-card.is-compared { border-color:var(--accent); background:#fffaf7; }
.offer-card > .badge-mark, .offer-card > .badge-mark.lg, .offer-spot-panel .badge-mark { width:44px; height:44px; border-radius:11px; }
.offer-spot-panel { flex:none; }
.card-rank, .offer-hook, .offer-card-facts, .offer-benefits, .offer-card .cf-label { display:none; }
.offer-card h3 { font-size:14px; white-space:normal; line-height:1.5; font-weight:600; }
.offer-card-top { align-items:start; }
.pill-hot { flex:none; display:inline-block; padding:3px 5px; margin-top:3px; border-radius:4px; color:var(--accent); background:var(--accent-soft); font-size:8px; line-height:1.3; font-weight:700; letter-spacing:.05em; }
.offer-card-meta { font-size:10px; line-height:1.7; color:var(--text-3); margin-top:4px; gap:0 5px; max-height:none; overflow:visible; }
.offer-card-meta > span { white-space:normal; }
.offer-card-meta .meta-sep { margin:0; }
.offer-card-meta .meta-item:nth-child(5), .offer-card-meta .meta-sep:nth-child(4), .offer-card-meta .meta-sep:nth-child(6) { display:none; }
.meta-updated { flex-basis:100%; font-size:10px; }
.offer-card-side { flex:0 0 205px; min-width:0; gap:12px; }
.commission-figure { display:flex; flex-direction:column; gap:4px; font-size:17px; line-height:1.4; color:var(--accent)!important; max-width:100%; }
.commission-figure .cf-label { color:var(--text-3); font:500 10px var(--font); letter-spacing:.06em; text-transform:uppercase; }
.cf-label svg { display:none; }
.cf-value { overflow-wrap:anywhere; }
.source-payout-icon { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); color:var(--accent); vertical-align:middle; }
.source-payout-icon svg { display:block; }
.commission-amount { display:inline-flex; flex-wrap:wrap; align-items:baseline; column-gap:2px; font-variant-numeric:tabular-nums; line-height:1.05; }
.commission-amount .amount-prefix { color:var(--text-3); font-size:.7em; font-weight:500; margin-right:1px; }
.commission-amount .amount-number { color:var(--accent); font-weight:650; letter-spacing:-.035em; }
.commission-amount .amount-symbol { color:var(--accent); font-size:.72em; font-weight:600; }
.commission-amount .amount-unit { flex-basis:100%; margin-top:5px; color:var(--text-3); font-size:9px; font-weight:500; letter-spacing:.01em; line-height:1.2; }
.commission-note { display:inline-flex; max-width:180px; flex-direction:column; gap:4px; line-height:1.25; }
.commission-note strong { color:var(--text); font-size:15px; font-weight:650; }
.commission-note small { color:var(--text-3); font-size:9px; font-weight:500; }
.commission-status { display:inline-flex; align-items:center; gap:8px; color:var(--text-2); }
.commission-status > span { display:flex; flex-direction:column; gap:2px; }
.commission-status strong { color:var(--text); font-size:12px; line-height:1.2; }
.commission-status small { color:var(--text-3); font-size:9px; line-height:1.2; }
.commission-figure:has(.source-payout-icon) > .cf-label,
.commission-figure:has(.source-payout-icon) > small,
.commission-figure:has(.commission-amount) > small,
.commission-figure:has(.commission-note) > small,
.commission-figure:has(.commission-status) > small { display:none; }
.commission-figure small { font-size:9px; color:var(--text-3); margin:0; }
.offer-card-actions { display:flex; align-items:center; gap:8px; }
.offer-card-tools { display:flex; align-items:center; gap:4px; }
.offer-card-side .card-cta { display:inline-flex; min-height:32px; align-items:center; padding:6px 9px; color:var(--text); border:1px solid var(--line); border-radius:7px; font-size:10px; font-weight:600; }
.save-btn, .copy-btn, .compare-toggle { position:relative; z-index:2; display:inline-flex; align-items:center; justify-content:center; gap:4px; min-width:32px; min-height:32px; border:1px solid var(--line); padding:5px 7px; border-radius:7px; background:#fff; color:var(--text-3); cursor:pointer; font-size:10px; }
.offer-card .copy-btn { display:none; }
.save-btn.is-on, .compare-toggle.is-on, .save-btn-detail.is-on { color:var(--accent); background:var(--accent-soft); border-color:#e8baa9; }
.offer-grid.is-compact { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; padding:0; }
.offer-grid.is-compact .offer-card { padding:20px; min-height:230px; background:#fff; gap:14px; }
.offer-grid.is-compact .offer-card-main { flex:1; }
.offer-grid.is-compact .offer-card-meta { display:flex; }
.offer-grid.is-compact .offer-card-side { flex:none; flex-direction:column; align-items:start; gap:12px; padding-top:14px; }
.offer-grid.is-compact .offer-card-side a { display:inline-flex; }
.offer-grid.is-compact .offer-card-actions { width:100%; justify-content:space-between; }
.empty-state { padding:48px 24px; margin:0; width:100%; background:#fff; border:1px solid var(--line); border-radius:18px; }
.empty-art { opacity:.5; }
.active-filters { gap:6px; }
.active-filters button.chip { font:500 11px var(--font); color:var(--text-2); }
.clear-all { background:none; border:0; padding:6px; }

/* Networks share the same panel and type scale as catalog and detail. */
.score-strip { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:36px; }
.score-card { padding:18px; }
.score-card-top { gap:12px; margin:0; }
.score-card h3 { font-size:12px; line-height:1.5; }
.score-overall { margin:8px 0; }
.score-overall b { font-size:24px; }
.score-meta { font-size:10px; line-height:1.6; }
.badge-mark { width:28px; height:28px; }
.badge-mark.lg { width:44px; height:44px; border-radius:11px; }
.badge-mark img { width:100%; height:100%; object-fit:contain; }
.compare-wrap { margin:0 0 40px; border-radius:16px; }
table.compare { min-width:900px; }
table.compare th, table.compare td { padding:20px; font-size:12px; line-height:1.7; min-width:210px; }
table.compare th:first-child, table.compare td:first-child { min-width:175px; max-width:190px; }
table.compare thead th { font-size:11px; text-transform:none; letter-spacing:0; }
table.compare tbody th { font-weight:500; background:var(--surface-2); color:var(--text-2); text-align:left; }
.comparison-hint { color:var(--text-3); font-size:12px; line-height:1.8; margin:0 0 16px; }
.table-empty { text-align:left; padding:32px; color:var(--text-2); background:#fff; }
.net-cell-name { gap:9px; }
.kind-chip { font-size:9px; padding:3px 6px; color:var(--text-3); background:var(--surface-3); border:0; }
.kind-platform { color:var(--green); background:var(--green-soft); }
#networkToggles { width:100%; gap:7px; }
.pill { min-height:36px; border-radius:8px; font-size:11px; padding:8px 12px; background:#fff; }
.pill.is-active, .page-reviews .pill.is-active { background:var(--brand); border-color:var(--brand); color:#fff; }
.net-cards-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:0; }
.net-profile-card { display:flex; flex-direction:column; padding:24px; border-top-color:var(--line)!important; scroll-margin-top:100px; }
.net-card-top { display:flex; gap:13px; align-items:center; margin-bottom:18px; }
.net-card-top h3 { font-size:14px; line-height:1.4; }
.net-card-meta { display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:10px; }
.net-card-meta .text-faint { display:block; }
.net-profile-card p { line-height:1.8; font-size:12px; flex:1; }
.net-fact-chips { display:flex; flex-wrap:wrap; gap:5px; margin:16px 0; }
.chip { background:var(--surface-3); border:0; padding:5px 8px; font-size:10px; color:var(--text-2); white-space:normal; }
.chip-hot { color:var(--accent); background:var(--accent-soft); }
.net-card-stars { font-size:11px; margin-bottom:12px; }
.network-links { border-top:1px solid var(--line-soft); padding-top:16px; gap:8px; }
.network-links .btn { padding:8px 10px; font-size:11px; }

/* Offer details, including missing IDs, use the global shell. */
.page-offer .sec-workspace > .page-head { display:none; }
.breadcrumb { padding:28px 0 18px; margin:0; font-size:11px; line-height:1.8; }
.detail-head { border:1px solid var(--line); background:#edf1e9; border-radius:20px; padding:34px; gap:40px; margin-bottom:26px; }
.detail-head h1 { font-size:clamp(27px,3.4vw,40px); line-height:1.28; font-weight:600; margin:18px 0; }
.detail-net-line { font-size:12px; }
.detail-head-left { min-width:0; }
.detail-head-figure { flex:0 0 300px; min-width:0; gap:16px; }
.detail-head-figure .commission-figure { font-size:27px; line-height:1.35; }
.detail-head-figure .btn-accent { width:100%; }
.detail-tool-row { display:flex; width:100%; justify-content:flex-end; flex-wrap:wrap; gap:7px; }
.detail-tool-row .btn { flex:1; min-width:0; min-height:40px; font-size:10px; padding:8px; }
.detail-grid { grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr); gap:24px; }
.card { padding:26px; margin-bottom:20px; border-radius:16px; }
.card h2 { font-size:17px; text-transform:none; letter-spacing:-.03em; color:var(--text); margin-bottom:16px; line-height:1.4; }
.detail-desc { font-size:14px; line-height:1.9; margin:0; color:var(--text-2); }
.term-list, .step-list { list-style:none; }
.term-list li, .step-list li { padding:12px 0 12px 26px; font-size:12px; line-height:1.8; }
.term-list li::before { top:21px; }
.step-list li::before { top:14px; background:var(--surface-3); color:var(--text); }
.fact-row { font-size:11px; gap:15px; padding:13px 0; }
.fact-row .fv { font-family:var(--font); font-size:11px; }
.source-link { color:var(--accent); font-weight:600; text-decoration:underline; text-underline-offset:3px; }
.facts-table { grid-template-columns:1fr; }
.facts-table .fact-row:nth-child(even) { border-left:0; padding-left:0; }
.detail-action-stack { display:grid; gap:8px; margin-top:20px; }
.detail-action-stack .btn { white-space:normal; text-align:center; }
.payout-card .detail-action-stack .btn-outline { display:none; }
.detail-hint { line-height:1.8; margin-bottom:0; }
.related-section { margin-top:44px; }
.related-rail { gap:16px; }
.related-rail .offer-card { padding:22px; gap:16px; min-height:245px; }
.related-rail .offer-card-main { flex:1; }
.related-rail .offer-card-side { flex:none; align-items:start; flex-direction:column; gap:14px; }
.related-rail .offer-card h3 { font-size:14px; }
.related-rail .offer-card-chips { margin-top:10px; flex-wrap:wrap; }
.related-rail .pill-hot { display:none; }
#notFound { margin:40px auto; max-width:720px; }

/* Reviews and submissions: comfortable readable forms and restrained feedback. */
.trust-stats { gap:0; padding:22px 0; margin:0 0 30px; border-block:1px solid var(--line); }
.trust-stat { flex:1; flex-direction:column; gap:5px; }
.trust-stat .num { font-size:26px; }
.trust-stat .lbl { font-size:11px; }
.trust-cta .btn-outline { min-height:44px; padding:11px 17px; border:1px solid var(--line); background:#fff; color:var(--text); }
.review-toolbar { padding:20px; border:1px solid var(--line); border-radius:16px; background:#fff; gap:16px; margin-bottom:24px; }
.review-toolbar #networkFilter { flex-basis:100%; gap:6px; }
.review-grid { column-count:3; column-gap:16px; margin-bottom:40px; }
.review-card { padding:24px; gap:14px; margin-bottom:16px; }
.review-top { gap:12px; }
.avatar { width:38px; height:38px; border-radius:12px; }
.review-who .name { font-size:13px; }
.review-who .sub { font-size:10px; line-height:1.7; margin-top:4px; }
.review-quote { font-size:14px; line-height:1.9; }
.proof-box { border:1px solid var(--line); background:var(--surface-2); padding:14px; line-height:1.6; }
.review-foot { padding-top:12px; border-top:1px solid var(--line-soft); }
.helpful-btn { min-height:34px; }
.review-fab { display:none!important; }
.submit-section { max-width:800px; margin:0 auto; padding:36px; border-radius:20px; }
.submit-section .section-head { margin:0 0 18px; }
.submit-section .section-head h2 { font-size:24px; }
.form-lead { line-height:1.8; font-size:13px; }
.form-note { display:flex; align-items:start; gap:9px; margin:20px 0 28px; padding:13px 15px; border:1px solid #e8d7b6; background:#fffaf0; border-radius:10px; color:#7e6534; font-size:12px; line-height:1.7; }
.form-note svg { flex:none; margin-top:3px; }
.field { margin-bottom:24px; }
.field label { font-size:12px; color:var(--text); margin-bottom:8px; }
.field input[type=text], .field input[type=email], .field input[type=tel], .field input[type=url], .field select, .field textarea { min-height:46px; font-size:14px; border-color:var(--line); padding:12px; border-radius:9px; }
.field-row { gap:20px; }
.field textarea { min-height:126px; line-height:1.7; }
.field input::placeholder, .field textarea::placeholder { color:var(--text-3); font-size:12px; }
.radio-card { min-height:52px; padding:12px; line-height:1.6; }
.radio-card:has(input:checked) { border-color:var(--text); background:var(--surface-3); }
.page-reviews .radio-card.is-active { border-color:var(--text); background:var(--surface-3); }
.radio-card input { accent-color:var(--text); }
.star-input button { width:44px; height:44px; font-size:28px; }
.page-submit .submit-layout { display:grid; grid-template-columns:minmax(0,1fr) 290px; gap:36px; align-items:start; }
.page-submit .submit-section { width:100%; margin:0; }
.submit-aside { position:sticky; top:100px; }
.submit-aside h2 { font-size:17px; margin-bottom:18px; }
.submit-aside p { font-size:12px; line-height:1.9; color:var(--text-2); }
.submit-aside .term-list { margin-bottom:28px; }
.submit-aside .term-list li { font-size:12px; }
.pending-wrap { margin-top:28px; }
.pending-title { font-size:17px; }
.form-status { color:var(--text-3); font-size:11px; line-height:1.7; margin-top:12px; text-align:center; }

/* Shared footer and global interaction surfaces. */
.site-footer { padding:42px 0 26px; margin-top:60px; background:#eef1ed; border-top:1px solid var(--line); color:var(--text-3); }
.site-footer .footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:60px; }
.footer-brand { display:flex; flex-direction:column; gap:12px; }
.footer-brand strong { font-size:19px; color:var(--text); letter-spacing:-.045em; }
.footer-brand p { max-width:330px; line-height:1.9; font-size:12px; margin:0; }
.footer-col { display:flex; flex-direction:column; gap:12px; }
.footer-col-title { font-size:11px; color:var(--text); margin-bottom:3px; }
.site-footer a { font-size:12px; width:fit-content; }
.site-footer a.brand { font-size:19px; color:var(--text); }
.footer-col > strong { color:var(--text); font-size:12px; }
.site-footer .footer-bottom { display:flex; justify-content:space-between; gap:20px; padding-top:26px; margin-top:30px; border-top:1px solid #d9e1d8; font-size:10px; line-height:1.8; }
.compare-dock-inner { display:flex; align-items:center; gap:18px; padding:16px; border-radius:16px; }
.compare-dock-main { display:flex; align-items:center; gap:16px; min-width:0; flex:1; }
.compare-dock-label { flex:none; font-size:12px; font-weight:600; }
.compare-dock-thumbs { display:flex; min-width:0; gap:8px; overflow-x:auto; }
.compare-dock-thumb { position:relative; flex:0 0 195px; padding:10px 28px 10px 10px; background:var(--bg); border-radius:10px; }
.cdt-link { display:flex; gap:8px; align-items:center; }
.cdt-body { display:flex; flex-direction:column; gap:3px; min-width:0; font-size:10px; }
.cdt-title { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cdt-pay { color:var(--accent); font-weight:600; }
.cdt-net { color:var(--text-3); font-size:9px; }
.compare-dock-thumb .compare-x { position:absolute; top:6px; right:4px; width:24px; height:24px; font-size:10px; }
.compare-dock-actions { flex:none; }
.cmdk-panel { border-radius:16px; overflow:hidden; }
.cmdk-search { padding:20px; }
.cmdk-search input { font-size:16px; }
.cmdk-item { min-height:58px; }
.toast { font-size:12px; line-height:1.7; }

@media(min-width:981px) {
  .filters { transform:none; }
}
@media(max-width:1100px) {
  .hero-forsale-grid { gap:32px; }
  .nav { margin-right:0; }
  .nav a { padding:10px; }
  .offer-card { padding:16px; gap:12px; }
  .offer-card-side { flex-basis:180px; }
  .score-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .net-cards-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .review-grid { column-count:2; }
}
@media(max-width:980px) {
  .workspace { grid-template-columns:1fr; }
  .filters { background:#fff; position:fixed; inset:0 auto 0 0; max-height:100dvh; width:min(88vw,340px); padding:24px; box-shadow:var(--shadow-lg); z-index:90; border-radius:0; }
  .filter-row { min-height:40px; font-size:12px; }
  .filters-close { min-height:46px; bottom:0; }
  .filters-backdrop { z-index:85; }
  .filter-toggle { display:inline-flex; min-height:42px; }
  .detail-grid { grid-template-columns:minmax(0,1fr); }
  .detail-head-figure { flex-basis:260px; }
  .page-submit .submit-layout { grid-template-columns:minmax(0,1fr) 240px; gap:24px; }
}
@media(max-width:860px) {
  :root, .page-reviews { --header-h:64px; }
  .container { width:min(100% - 40px,var(--maxw)); }
  .hero { padding:38px 0; }
  .hero-forsale-grid { grid-template-columns:minmax(0,1fr); gap:30px; }
  .hero h1 { font-size:44px; max-width:650px; }
  .hero p.lead { max-width:520px; }
  .hero-card { padding:26px; }
  .stats-strip { margin-top:24px; }
  .page-head { padding-top:40px; }
  .detail-head { flex-direction:column; padding:28px; gap:24px; }
  .detail-head-figure { flex-basis:auto; width:100%; align-items:start; text-align:left; }
  .detail-head-figure .btn-accent { width:auto; }
  .detail-tool-row { justify-content:start; }
  .detail-cta-bar { gap:8px; bottom:calc(var(--dock-h) + 18px + env(safe-area-inset-bottom)); }
  .detail-cta-bar #copyOfferBtnMobile, .detail-cta-bar #addCompareBtnMobile { display:none; }
  .mobile-dock { left:16px; right:16px; bottom:calc(10px + env(safe-area-inset-bottom)); border-radius:16px; background:#ffffffed!important; box-shadow:var(--shadow-lg); z-index:70; }
  .dock-item { border-radius:10px; font-size:10px; color:var(--text-3); }
  .dock-item.is-active { background:var(--surface-3); color:var(--text); }
  body.has-dock { padding-bottom:calc(var(--dock-h) + 24px + env(safe-area-inset-bottom)); }
  .compare-tray { bottom:calc(var(--dock-h) + 20px + env(safe-area-inset-bottom)); }
  .page-offer.has-compare-dock .detail-cta-bar { display:none; }
  body.page-offer.has-tray .compare-tray { bottom:calc(var(--dock-h) + 20px + env(safe-area-inset-bottom)); }
  .compare-dock-main { flex-direction:column; align-items:start; gap:8px; }
  .compare-dock-thumbs { max-width:100%; width:100%; }
  .page-submit .submit-layout { grid-template-columns:1fr; }
  .submit-aside { position:static; margin-top:6px; padding:24px; border:1px solid var(--line); border-radius:16px; }
  .site-footer .footer-grid { gap:32px; }
}
@media(max-width:600px) {
  .btn-sm, .pill, .qchip, .save-btn, .compare-toggle, .detail-tool-row .btn { min-height:44px; }
  .save-btn, .compare-dock-thumb .compare-x { min-width:44px; min-height:44px; }
  .compare-dock-thumb { padding-right:48px; }
  .container { width:calc(100% - 32px); }
  .header-inner { gap:8px; }
  .brand { font-size:17px; }
  .brand-logo { width:30px; height:30px; }
  .hero { padding:30px 0; }
  .hero h1 { font-size:35px; line-height:1.24; letter-spacing:-.055em; }
  .hero-kicker { font-size:9px; letter-spacing:.08em; }
  .hero p.lead { font-size:13px; margin-top:16px; }
  .hero-forsale-grid { gap:24px; }
  .hero-card { padding:22px 18px; border-radius:16px; }
  .hero-card-title { font-size:21px; }
  .hero-card-sub { font-size:11px; margin-bottom:18px; }
  .search-bar { flex-wrap:nowrap; align-items:center; padding:5px 5px 5px 10px; }
  .search-bar svg { margin:0; width:16px; }
  .search-bar input { width:auto; font-size:16px; }
  .search-bar input::placeholder { font-size:11px; }
  .search-bar .btn { width:auto; font-size:11px; padding-inline:11px; flex:none; }
  .stats-strip { gap:28px; margin-top:22px; }
  .stat-num { font-size:21px; }
  .stat-label { font-size:9px; }
  .catalog-desk { padding-top:30px; }
  .catalog-title { font-size:25px!important; }
  .catalog-sub { font-size:12px; line-height:1.8; }
  .results-chrome { padding:13px; }
  .toolbar { flex-wrap:wrap; }
  .toolbar input[type=search] { order:-1; flex-basis:100%; font-size:16px; }
  .toolbar input::placeholder { font-size:12px; }
  .toolbar select { flex:1; min-width:0; font-size:12px; }
  .view-toggle { display:none; }
  .offer-card, .offer-grid.is-compact .offer-card { display:grid; grid-template-columns:40px minmax(0,1fr); align-items:start; gap:12px; padding:16px; min-height:0; }
  .offer-card > .badge-mark, .offer-card > .badge-mark.lg, .offer-spot-panel .badge-mark { width:40px; height:40px; }
  .offer-card-main { display:block; }
  .offer-card h3 { white-space:normal; font-size:13px; }
  .offer-card-top { gap:6px; }
  .offer-card-meta { max-height:none; overflow:visible; font-size:10px; margin-top:6px; }
  .offer-card-side, .offer-grid.is-compact .offer-card-side { grid-column:1/-1; width:100%; min-width:0; display:flex; flex-direction:row; align-items:center; justify-content:space-between; text-align:left; border-top:1px solid var(--line-soft); padding-top:12px; margin:0; gap:12px; }
  .commission-figure, .offer-grid.is-compact .commission-figure { font-size:15px; line-height:1.5; }
  .offer-card-side .commission-figure { flex:1; min-width:0; }
  .offer-card-actions { flex:none; }
  .offer-card-side .card-cta { display:none; }
  .offer-grid.is-compact { grid-template-columns:1fr; }
  .offer-grid.is-compact .offer-card-actions { width:auto; }
  .offer-grid.is-compact .offer-card-side a { display:none; }
  .page-head { padding:32px 0 24px; margin-bottom:24px; }
  .page-head h1 { font-size:30px; line-height:1.32; }
  .page-head p.lead { font-size:13px; }
  .section-head { margin:28px 0 16px; }
  .section-head-title, .section-head h2 { font-size:21px; }
  .score-strip { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .score-card { padding:14px; }
  .score-card-top { display:block; }
  .score-card-top > .badge-mark { margin-bottom:10px; }
  .net-cards-grid { grid-template-columns:1fr; }
  .net-profile-card { padding:22px; }
  .compare-wrap { margin-inline:0; border:1px solid var(--line); border-radius:14px; }
  table.compare th:first-child, table.compare td:first-child { min-width:130px; max-width:130px; padding:14px; font-size:11px; }
  .detail-head { padding:22px; border-radius:16px; }
  .detail-head h1 { font-size:29px; }
  .detail-head-figure .commission-figure { font-size:24px; }
  .detail-head-figure .btn-accent { width:100%; }
  .detail-fresh { flex-basis:100%; margin-top:4px; }
  .detail-fresh::before { content:none; }
  .card { padding:22px; }
  .fact-row { flex-direction:row; }
  .fact-row .fv { text-align:right; max-width:60%; }
  .related-rail .offer-card { display:flex; flex-direction:column; padding:22px; }
  .related-rail .offer-card-side { align-items:start; flex-direction:column; }
  .related-rail .offer-card-side .card-cta { display:inline-flex; }
  .trust-stats { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
  .trust-stat, .trust-stat + .trust-stat { border:0; padding:0; }
  .trust-stat .num { font-size:24px; }
  .trust-stat .lbl { font-size:10px; }
  .review-toolbar { padding:15px; gap:12px; }
  .review-toolbar select { margin:0; width:100%; }
  .review-toolbar #networkFilter { flex-wrap:nowrap; overflow-x:auto; width:100%; padding-bottom:4px; }
  .review-toolbar #networkFilter .pill { flex-shrink:0; }
  .review-grid { column-count:1; }
  .review-card { padding:22px; }
  .submit-section { padding:24px 18px; border-radius:16px; }
  .submit-section .section-head h2 { font-size:23px; }
  .field-row { grid-template-columns:1fr; gap:0; }
  .field input[type=text], .field input[type=email], .field input[type=tel], .field input[type=url], .field select, .field textarea { font-size:16px; }
  .radio-grid { flex-direction:column; }
  .radio-card { flex:auto; }
  .site-footer { padding-top:32px; margin-top:40px; }
  .site-footer .footer-grid { grid-template-columns:1fr 1fr; gap:30px; }
  .footer-brand { grid-column:1/-1; }
  .site-footer .footer-bottom { flex-direction:column; gap:8px; margin-top:26px; padding-top:20px; }
  .compare-dock-inner { align-items:end; gap:8px; }
  .compare-dock-thumb { flex-basis:175px; }
}

/* SOURCE: css/signal-room.css */
/* Kho Offer — Signal Room art direction, 2026-09-08. */
:root,
.page-reviews {
  --bg: #f3f1e8;
  --bg-soft: #ebe8dc;
  --surface: #fffefa;
  --surface-2: #f8f7f0;
  --surface-3: #eeece2;
  --surface-hover: #f8f7f0;
  --text: #111a2d;
  --text-2: #4f596a;
  --text-3: #596273;
  --line: #dcd9cd;
  --line-soft: #ebe8df;
  --line-strong: #ada99e;
  --brand: #111a2d;
  --brand-strong: #080e1d;
  --brand-wash: #e8ebf5;
  --accent: #3157ff;
  --accent-strong: #183bd5;
  --accent-soft: #e9edff;
  --accent-ring: #aebcff;
  --green: #176f58;
  --green-soft: #e1f3ea;
  --signal: #c9f36a;
  --shadow-sm: 0 4px 12px rgba(17, 26, 45, .06);
  --shadow: 0 16px 40px rgba(17, 26, 45, .10);
  --shadow-lg: 0 32px 90px rgba(17, 26, 45, .18);
  --header-h: 68px;
  --maxw: 1240px;
}

html { background: var(--bg); }
body {
  background:
    radial-gradient(circle at 8% 12%, rgba(49, 87, 255, .08), transparent 24rem),
    radial-gradient(circle at 96% 34%, rgba(201, 243, 106, .12), transparent 22rem),
    var(--bg);
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .16;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E");
}

.container { width: min(100% - 72px, var(--maxw)); }
.site-header {
  position: sticky;
  top: 12px;
  z-index: 80;
  width: min(calc(100% - 32px), 1280px);
  height: var(--header-h);
  margin: 12px auto 0;
  border: 1px solid rgba(255, 255, 255, .75);
  border-radius: 20px;
  background: rgba(255, 254, 250, .83);
  box-shadow: 0 8px 30px rgba(17, 26, 45, .08);
  backdrop-filter: blur(22px) saturate(1.25);
}
.site-header .container { width: 100%; padding: 0 18px; }
.brand { color: var(--brand); }
.brand-logo { border-radius: 10px; box-shadow: 0 7px 18px rgba(17, 26, 45, .18); transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.brand:hover .brand-logo { transform: rotate(-7deg) scale(1.06); }
.nav { padding: 4px; border: 1px solid var(--line-soft); border-radius: 12px; background: rgba(243, 241, 232, .68); }
.nav a { position: relative; border-radius: 9px; transition: color .2s ease, background .2s ease, transform .2s ease; }
.nav a:hover { transform: translateY(-1px); }
.nav a.is-active { color: #fff; background: var(--brand); box-shadow: 0 6px 16px rgba(17, 26, 45, .16); }
.header-saved,
.cmdk-trigger { border-color: var(--line); background: rgba(255,255,255,.7); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.header-saved:hover,
.cmdk-trigger:hover { transform: translateY(-2px); border-color: var(--accent-ring); box-shadow: 0 8px 20px rgba(49,87,255,.10); }

.hero {
  position: relative;
  isolation: isolate;
  margin: 14px 16px 0;
  padding: 76px 0 68px;
  overflow: hidden;
  border: 0;
  border-radius: 34px;
  color: #fff;
  background:
    radial-gradient(circle at 88% 18%, rgba(93, 121, 255, .40), transparent 25rem),
    radial-gradient(circle at 18% 110%, rgba(201, 243, 106, .14), transparent 30rem),
    #111a2d;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .22;
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(90deg, #000, transparent 72%);
}
.hero::after {
  content: "";
  position: absolute;
  width: 180px;
  height: 180px;
  right: 8%;
  top: -115px;
  border: 34px solid var(--signal);
  border-radius: 50%;
  opacity: .9;
}
.hero-forsale-grid { grid-template-columns: minmax(0, 1.15fr) minmax(370px, .85fr); gap: clamp(44px, 7vw, 96px); }
.hero-kicker { display: inline-flex; align-items: center; gap: 10px; color: var(--signal)!important; letter-spacing: .18em; }
.hero-kicker::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--signal); box-shadow: 0 0 0 6px rgba(201,243,106,.12); animation: signal-pulse 2.4s ease-in-out 2; }
.hero h1 { max-width: 720px; color: #fff; font-size: clamp(44px, 5.2vw, 72px); line-height: 1.04; font-weight: 650; letter-spacing: -.065em; }
.hero h1 .em { color: var(--signal); }
.hero p.lead { max-width: 520px; color: #aeb8ca; font-size: 16px; line-height: 1.8; }
.stats-strip { gap: 0; margin-top: 38px; }
.stat-cell { min-width: 118px; padding: 0 24px; border-left: 1px solid rgba(255,255,255,.15); }
.stat-cell:first-child { padding-left: 0; border-left: 0; }
.stat-num { color: #fff; font-size: 30px; font-variant-numeric: tabular-nums; }
.stat-label { color: #8793a8; letter-spacing: .02em; }
.hero-card {
  position: relative;
  padding: 32px;
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 24px;
  background: rgba(255,255,255,.10);
  box-shadow: 0 30px 80px rgba(0,0,0,.24), inset 0 1px rgba(255,255,255,.14);
  backdrop-filter: blur(20px) saturate(1.2);
}
.hero-card::before { content: "01 / SEARCH"; position: absolute; top: 18px; right: 22px; color: rgba(255,255,255,.42); font: 600 9px/1.2 ui-monospace, monospace; letter-spacing: .14em; }
.hero-card-title { color: #fff; font-size: 27px; }
.hero-card-sub { color: #9eabc0; }
.hb { color: var(--signal); }
.platform-pills { background: rgba(5,10,24,.42); }
.platform-pills button { color: #abb5c7; }
.platform-pills button.is-on { color: var(--brand); background: var(--signal); box-shadow: 0 8px 20px rgba(201,243,106,.18); }
.search-bar { border-color: rgba(255,255,255,.18); background: #fff; box-shadow: 0 12px 32px rgba(0,0,0,.20); }
.search-bar .btn-primary { background: var(--accent); }
.search-bar .btn-primary:hover { background: var(--accent-strong); }

.catalog-desk { padding-top: 64px; }
.catalog-head { display: flex; align-items: end; justify-content: space-between; gap: 30px; }
.catalog-title { font-size: clamp(31px, 4vw, 48px)!important; letter-spacing: -.06em!important; }
.catalog-sub { max-width: 470px; line-height: 1.75; }
.workspace { grid-template-columns: 230px minmax(0,1fr); gap: 34px; }
.filters-head { display: flex; align-items: center; gap: 9px; }
.filters-head::before { content: ""; width: 8px; height: 8px; border-radius: 2px; background: var(--accent); transform: rotate(45deg); }
.filter-row { border-radius: 8px; transition: background .18s ease, transform .18s ease; }
.filter-row:hover { background: rgba(255,255,255,.62); transform: translateX(3px); }
.filter-row input:checked { background: var(--accent); border-color: var(--accent); }
.results-chrome {
  border-color: rgba(173,169,158,.7);
  border-radius: 18px;
  background: rgba(255,254,250,.78);
  box-shadow: 0 12px 36px rgba(17,26,45,.06);
  backdrop-filter: blur(16px);
}
.qchip { border-radius: 999px; background: #eeece4; transition: transform .18s ease, color .18s ease, background .18s ease; }
.qchip:hover { transform: translateY(-2px); }
.qchip.is-on { background: var(--accent)!important; }

.offer-grid { gap: 13px; perspective: 1000px; }
.offer-card {
  position: relative;
  overflow: hidden;
  border-color: rgba(203,199,188,.86);
  border-radius: 17px;
  background:
    radial-gradient(280px circle at var(--mx, -100px) var(--my, -100px), rgba(49,87,255,.10), transparent 62%),
    var(--surface);
  box-shadow: 0 1px 0 rgba(255,255,255,.8) inset;
  transform: translateZ(0);
  transition: transform .32s cubic-bezier(.2,.8,.2,1), border-color .25s ease, box-shadow .32s ease;
}
.offer-card::before { content: ""; position: absolute; left: 0; top: 18px; bottom: 18px; width: 3px; border-radius: 0 4px 4px 0; background: var(--accent); transform: scaleY(0); transition: transform .28s ease; }
.offer-card:hover { border-color: rgba(49,87,255,.42); box-shadow: 0 18px 44px rgba(17,26,45,.10); transform: translateY(-4px); }
.offer-card:hover::before { transform: scaleY(1); }
.offer-card h3 a { text-decoration: none; background-image: linear-gradient(var(--accent),var(--accent)); background-size: 0 1px; background-position: 0 100%; background-repeat: no-repeat; transition: background-size .25s ease, color .2s ease; }
.offer-card:hover h3 a { color: var(--accent-strong); background-size: 100% 1px; }
.pill-hot { color: var(--brand); background: var(--signal); }
.commission-figure { color: var(--accent)!important; font-variant-numeric: tabular-nums; }
.offer-card-side .card-cta { color: #fff; border-color: var(--brand); background: var(--brand); transition: transform .2s ease, background .2s ease; }
.offer-card-side .card-cta:hover { background: var(--accent); border-color: var(--accent); transform: translateX(2px); }
.save-btn:hover,
.compare-toggle:hover { color: var(--accent); border-color: var(--accent-ring); }
.offer-grid.is-compact .offer-card { border-radius: 20px; }

.page-head { position: relative; overflow: hidden; margin-top: 14px; padding: 72px 0 48px; border: 0; border-radius: 28px; color: #fff; background: var(--brand); }
.page-head::after { content: ""; position: absolute; width: 280px; height: 280px; right: -70px; top: -150px; border: 48px solid var(--signal); border-radius: 50%; opacity: .85; }
.page-head h1 { color: #fff; font-size: clamp(38px,5vw,62px); line-height: 1.08; letter-spacing: -.06em; }
.page-head p.lead { color: #aeb8ca; }
.page-head .co-eyebrow { color: var(--signal); }
.card,
.score-card,
.net-profile-card,
.review-card,
.submit-section,
.submit-aside { border-color: var(--line); background: rgba(255,254,250,.90); box-shadow: var(--shadow-sm); }
.score-card,
.net-profile-card,
.review-card { transition: transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s ease, border-color .28s ease; }
.score-card:hover,
.net-profile-card:hover,
.review-card:hover { transform: translateY(-5px); border-color: var(--accent-ring); box-shadow: var(--shadow); }
.detail-head { position: relative; overflow: hidden; border: 0; color: #fff; background: linear-gradient(135deg,#111a2d,#1e2d52); box-shadow: var(--shadow); }
.detail-head h1 { color: #fff; }
.detail-head .detail-net-line { color: #aeb8ca; }
.detail-head .commission-figure { color: var(--signal)!important; }
.detail-head .btn-accent { color: var(--brand); background: var(--signal); }
.site-footer { margin: 70px 16px 16px; border: 0; border-radius: 28px; background: var(--brand); color: #8f9bb0; }
.site-footer .footer-brand strong,
.site-footer .footer-col-title,
.site-footer .footer-col > strong,
.site-footer a.brand { color: #fff; }
.site-footer a:hover { color: var(--signal); }
.site-footer .footer-col a { color: #b4bed0; }
.site-footer .footer-col a:hover { color: var(--signal); }
.detail-head .detail-net-line a { color: #c4d0ff; }
.detail-head .detail-fresh, .detail-head .cf-label, .detail-head .commission-figure small { color: #b4bed0; }
.related-rail .offer-card .card-cta { color: #fff; }
.submit-layout { grid-template-columns: minmax(0, 1fr) 320px; gap: 32px; }
.submit-aside { padding: 26px; border: 1px solid var(--line); border-radius: var(--r-lg); }
.site-footer .footer-bottom { border-color: rgba(255,255,255,.12); }


@keyframes signal-pulse { 0%,100% { box-shadow: 0 0 0 5px rgba(201,243,106,.10); } 50% { box-shadow: 0 0 0 10px rgba(201,243,106,0); } }

@media (max-width: 980px) {
  .hero-forsale-grid { grid-template-columns: 1fr; gap: 42px; }
  .hero-copy { max-width: 760px; }
  .hero h1 { max-width: 760px; }
  .hero-card { width: min(100%, 680px); }
}

@media (max-width: 860px) {
  :root, .page-reviews { --header-h: 62px; }
  .container { width: min(100% - 40px,var(--maxw)); }
  .site-header { top: 8px; width: calc(100% - 16px); margin-top: 8px; border-radius: 16px; }
  .hero { margin: 10px 8px 0; padding: 54px 0 48px; border-radius: 26px; }
  .hero::after { right: -40px; }
  .hero h1 { font-size: clamp(42px,10vw,62px); }
  .hero-card { background: rgba(255,255,255,.08); }
  .page-head { margin: 10px 8px 0; padding: 54px 20px 40px; border-radius: 24px; }
  .site-footer { margin-inline: 8px; }
}

@media (max-width: 600px) {
  .container { width: calc(100% - 32px); }
  .site-header .container { width: 100%; padding-inline: 12px; }
  .hero { padding-top: 46px; }
  .hero h1 { font-size: 41px; }
  .hero p.lead { color: #b4bed0; }
  .stats-strip { gap: 0; }
  .stat-cell { min-width: 0; flex: 1; padding: 0 12px; }
  .stat-num { font-size: 24px; }
  .hero-card { padding: 23px 18px; }
  .hero-card::before { display: none; }
  .catalog-head { display: block; }
  .catalog-title { font-size: 34px!important; }
  .offer-card:hover { transform: none; }
  .page-head::after { right: -150px; }
  .site-footer { border-radius: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto!important; animation-duration: .01ms!important; animation-iteration-count: 1!important; transition-duration: .01ms!important; }
  .has-motion .ko-reveal { opacity: 1; transform: none; }
}

/* Marketplace hierarchy inspired by the clarity of leading service catalogs. */
.page-home .hero { min-height: 590px; display: flex; align-items: center; }
.page-home .hero::after { content: none; }
.page-home .hero-forsale-grid { display: block; }
.page-home .hero-copy { max-width: 1080px; }
.page-home .hero h1 { max-width: 900px; font-size: clamp(58px, 7vw, 92px); font-weight: 450; line-height: .98; }
.page-home .hero p.lead { max-width: 680px; margin-top: 26px; font-size: 17px; }
.page-home .hero .search-bar { width: min(100%, 980px); max-width: 980px; min-height: 68px; margin-top: 34px; padding: 7px 7px 7px 20px; border-radius: 14px; }
.page-home .hero .search-bar input { font-size: 17px; }
.page-home .hero .search-bar .btn { min-height: 52px; padding-inline: 28px; border-radius: 10px; font-size: 14px; }
.hero-popular { display: flex; align-items: center; gap: 12px; margin-top: 18px; }
.hero-popular-label { flex: none; color: #fff; font-size: 12px; font-weight: 600; }
.page-home .hero .platform-pills { display: flex; gap: 8px; margin: 0; padding: 0; background: transparent; }
.page-home .hero .platform-pills button { min-height: 35px; flex: none; padding: 7px 14px; border: 1px solid rgba(255,255,255,.55); border-radius: 999px; color: #fff; }
.page-home .hero .platform-pills button:hover { border-color: var(--signal); color: var(--signal); }
.page-home .hero .platform-pills button.is-on { color: var(--brand); border-color: var(--signal); background: var(--signal); }
.page-home .hero .stats-strip { margin-top: 42px; }

.page-home .hero-cats-wrap { display: block!important; padding-top: 58px; padding-bottom: 34px; }
.market-section-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.market-section-head h2 { font-size: clamp(28px,3vw,42px); letter-spacing: -.05em; }
.market-section-head a { color: var(--accent); font-size: 13px; font-weight: 650; }
.page-home .hero-cats { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 14px; }
.page-home .hero-cat { position: relative; display: flex; min-width: 0; min-height: 158px; padding: 20px; flex-direction: column; align-items: flex-start; justify-content: flex-end; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; color: var(--text); background: var(--surface); box-shadow: var(--shadow-sm); cursor: pointer; transition: transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s ease, border-color .28s ease; }
.page-home .hero-cat::after { content: "↗"; position: absolute; top: 15px; right: 16px; color: var(--text-3); font-size: 16px; transition: transform .25s ease, color .25s ease; }
.page-home .hero-cat:hover { transform: translateY(-7px); border-color: var(--accent-ring); box-shadow: var(--shadow); }
.page-home .hero-cat:hover::after { color: var(--accent); transform: translate(2px,-2px); }
.page-home .hero-cat.is-on { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.page-home .hero-cat .hc-ico { display: block; position: absolute; top: 20px; left: 20px; }
.page-home .hero-cat .hc-ico .badge-mark { width: 42px; height: 42px; border-radius: 11px; }
.page-home .hero-cat .hc-name { max-width: 100%; font-size: 13px; font-weight: 650; line-height: 1.35; text-align: left; }
.page-home .hero-cat .hc-badge { margin-top: 6px; color: var(--text-3); font-size: 10px; }
.page-home .hero-cat .hc-chip,
.page-home .hero-cat .hc-meta { display: none; }

.page-home .logo-wall { display: block!important; padding: 30px 0 42px; }
.page-home .logo-wall .co-eyebrow { text-align: center; margin-bottom: 24px; }
.page-home .logo-wall-track { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 24px 46px; }
.page-home .logo-wall .lw-item { display: inline-flex; min-width: 76px; min-height: 30px; align-items: center; justify-content: center; color: var(--text-3); font-size: 12px; font-weight: 700; filter: grayscale(1); opacity: .58; transition: filter .2s ease, opacity .2s ease, transform .2s ease; }
.page-home .logo-wall .lw-item:hover { filter: none; opacity: 1; transform: scale(1.05); }
.page-home .logo-wall .lw-item img { width: auto; max-width: 96px; max-height: 28px; }

.page-home .campaign-strip { display: block!important; margin: 10px 16px 34px; padding: 52px 0; border-radius: 28px; background: var(--signal); }
.campaign-balanced-inner { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 48px; }
.campaign-strip-inner { display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.campaign-copy { display: grid; gap: 10px; }
.campaign-kicker { color: var(--accent-strong); font: 700 10px/1.2 ui-monospace,monospace; letter-spacing: .15em; text-transform: uppercase; }
.campaign-lead { margin: 0; color: var(--brand); font-size: clamp(27px,3vw,42px); line-height: 1.08; letter-spacing: -.05em; }
.campaign-sub { margin: 8px 0 0; color: #34411d; font-size: 13px; line-height: 1.7; }
.campaign-cta { flex: none; padding: 13px 17px; border-radius: 10px; color: #fff; background: var(--brand); font-size: 12px; font-weight: 650; }
.campaign-method-chips { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.method-chip { display: flex; min-height: 104px; padding: 16px; flex-direction: column; justify-content: space-between; border: 1px solid rgba(17,26,45,.20); border-radius: 14px; color: var(--brand); background: rgba(255,255,255,.24); }
.method-chip .mc-ico { font-size: 20px; }
.method-chip strong { font-size: 12px; }
.method-chip span:last-child { color: #4e5c30; font-size: 9px; }

.page-home .fresh-rail-section { display: block!important; padding: 36px 0 52px; }
.page-home .fresh-rail-head { margin: 0 0 22px; }
.page-home .fresh-rail-title { font-size: clamp(28px,3vw,42px); }
.page-home .fresh-live { color: var(--green); font-size: 11px; }
.page-home .fresh-rail { display: flex; gap: 16px; padding: 4px 4px 20px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.page-home .fresh-card { position: relative; flex: 0 0 270px; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--shadow-sm); scroll-snap-align: start; transition: transform .28s ease, box-shadow .28s ease; }
.page-home .fresh-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.page-home .fresh-card-tools { position: absolute; top: 10px; right: 10px; z-index: 3; display: flex; gap: 6px; }
.page-home .fresh-card-tools button { width: 32px; height: 32px; border: 0; border-radius: 50%; background: rgba(255,255,255,.9); }
.page-home .fresh-card-link { display: block; color: inherit; }
.page-home .fresh-thumb { position: relative; display: flex; height: 145px; align-items: center; justify-content: center; background: linear-gradient(135deg, color-mix(in srgb, var(--fresh-tint,#3157ff) 22%, #f4f2ea), #fff); }
.page-home .fresh-thumb-logo .badge-mark { width: 70px; height: 70px; border-radius: 18px; box-shadow: 0 12px 30px rgba(17,26,45,.13); }
.page-home .fresh-rank { position: absolute; left: 14px; top: 13px; color: var(--text-3); font: 700 10px/1 ui-monospace,monospace; }
.page-home .fresh-pay-chip { position: absolute; left: 14px; bottom: 12px; padding: 6px 8px; border-radius: 8px; color: #fff; background: var(--brand); font-size: 10px; font-weight: 700; }
.page-home .fresh-card-body { display: grid; gap: 10px; padding: 18px; }
.page-home .fresh-card-title { min-height: 38px; font-size: 14px; font-weight: 650; line-height: 1.4; }
.page-home .fresh-chips { display: flex; gap: 5px; flex-wrap: wrap; }
.page-home .fresh-chips .chip { font-size: 9px; }
.page-home .fresh-card-meta { color: var(--text-3); font-size: 10px; }

/* Shared final component constraints; no invisible pre-animation states. */
.page-head.sec-page-head { margin-inline: 0; padding: clamp(28px, 5vw, 56px); }
.page-head > * { position: relative; z-index: 1; }
.page-head::after { opacity: .16; pointer-events: none; }
.sec-head-actions { margin-top: 24px; }
.hero .stat-label { color: #b4bed0; }
.review-grid:has(.empty-state) { column-count: 1; }
.clear-all { border: 0; background: transparent; color: var(--accent); cursor: pointer; min-height: 44px; }
.hero :focus-visible, .page-head :focus-visible, .site-footer :focus-visible { outline-color: var(--signal); }
.page-home .hero .platform-pills button, .page-home .fresh-card-tools button { min-height: 44px; min-width: 44px; }
.cmdk-search input { min-width: 0; }
.cmdk-search #cmdkClose { flex: none; }
@media (hover: none) {
  .offer-card:hover, .score-card:hover, .net-profile-card:hover, .review-card:hover,
  .page-home .hero-cat:hover, .page-home .fresh-card:hover { transform: none; }
}

@media (max-width: 1040px) {
  .page-home .hero-cats { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .campaign-balanced-inner { grid-template-columns: 1fr; }
}
@media (max-width: 980px) {
  .page-home .workspace { grid-template-columns: minmax(0,1fr); gap: 12px; }
  .page-home .results-panel { width: 100%; }
  .submit-layout { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 700px) {
  .page-home .hero { min-height: 0; }
  .page-home .hero::after { right: -12%; opacity: .55; }
  .page-home .hero h1 { font-size: 48px; }
  .page-home .hero .search-bar { min-height: 60px; padding-left: 14px; }
  .page-home .hero .search-bar input { font-size: 16px; }
  .page-home .hero .search-bar .btn { min-height: 46px; padding-inline: 16px; }
  .hero-popular { align-items: flex-start; flex-direction: column; }
  .page-home .hero .platform-pills { max-width: 100%; overflow-x: auto; padding-bottom: 4px; }
  .page-home .hero-cats-wrap { padding-top: 40px; }
  .market-section-head { align-items: flex-start; flex-direction: column; gap: 8px; }
  .page-home .hero-cats { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .page-home .hero-cat { min-height: 142px; padding: 16px; }
  .campaign-strip-inner { align-items: flex-start; flex-direction: column; }
  .campaign-method-chips { grid-template-columns: 1fr; }
  .method-chip { min-height: 88px; }
}

/* Catalog-first refinement — one clear task, less promotional furniture. */
.page-home .hero {
  min-height: 0;
  margin-top: 10px;
  padding: 48px 0 42px;
  border-radius: 24px;
  background:
    radial-gradient(circle at 88% 10%, rgba(91,119,255,.28), transparent 23rem),
    #111a2d;
}
.page-home .hero::before {
  opacity: .11;
  background-size: 72px 72px;
}
.page-home .hero-forsale-grid { display: block; }
.page-home .hero-copy { max-width: 1080px; }
.page-home .hero-kicker { margin-bottom: 16px; }
.page-home .hero h1 {
  max-width: 840px;
  font-size: clamp(42px,5.2vw,66px);
  font-weight: 550;
  line-height: 1.01;
  letter-spacing: -.065em;
}
.page-home .hero p.lead {
  max-width: 560px;
  margin-top: 18px;
  font-size: 14px;
  line-height: 1.7;
}
.page-home .hero .search-bar {
  width: min(100%,760px);
  min-height: 56px;
  margin-top: 26px;
  padding: 5px 5px 5px 16px;
  border-radius: 12px;
}
.page-home .hero .search-bar input { font-size: 14px; }
.page-home .hero .search-bar .btn {
  min-height: 44px;
  padding-inline: 20px;
  border-radius: 8px;
  font-size: 12px;
}
.page-home .hero-popular { margin-top: 14px; }
.page-home .hero-popular-label {
  color: #8f9bb0;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.page-home .hero .platform-pills button {
  min-width: 0;
  min-height: 34px;
  padding: 6px 12px;
  border-color: rgba(255,255,255,.22);
  font-size: 11px;
}
.page-home .hero .stats-strip { margin-top: 26px; }
.page-home .hero .stat-cell { min-width: 105px; padding-inline: 20px; }
.page-home .hero .stat-num { font-size: 22px; }

.page-home .hero-cats-wrap {
  display: block!important;
  padding-top: 24px;
  padding-bottom: 4px;
}
.page-home .market-section-head { margin-bottom: 12px; }
.page-home .market-section-head h2 {
  font-size: 15px;
  font-weight: 650;
  letter-spacing: -.025em;
}
.page-home .market-section-head a { font-size: 11px; }
.page-home .hero-cats {
  display: grid;
  grid-template-columns: repeat(6,minmax(0,1fr));
  gap: 8px;
}
.page-home .hero-cat {
  min-height: 66px;
  padding: 11px 10px 11px 50px;
  justify-content: center;
  border-radius: 12px;
  box-shadow: none;
}
.page-home .hero-cat::after { display: none; }
.page-home .hero-cat:hover { transform: none; border-color: var(--accent-ring); box-shadow: none; }
.page-home .hero-cat .hc-ico { top: 50%; left: 11px; transform: translateY(-50%); }
.page-home .hero-cat .hc-ico .badge-mark { width: 30px; height: 30px; border-radius: 8px; }
.page-home .hero-cat .hc-name { font-size: 11px; line-height: 1.3; }
.page-home .hero-cat .hc-badge { margin-top: 3px; font-size: 9px; }

.page-home .logo-wall,
.page-home .campaign-strip,
.page-home .fresh-rail-section { display: none!important; }
.page-home .catalog-desk { padding-top: 34px; }
.page-home .catalog-head { margin-bottom: 16px; }
.page-home .catalog-title { font-size: clamp(27px,3vw,38px)!important; }
.page-home .catalog-sub { font-size: 12px; }
.page-home .workspace { grid-template-columns: minmax(0,1fr); gap: 0; }
.page-home .filter-toggle { display: inline-flex; }
.page-home .filters {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 92;
  width: min(88vw,340px);
  max-height: 100dvh;
  padding: 24px 20px;
  overflow-y: auto;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: var(--surface);
  box-shadow: var(--shadow-lg);
  transform: translateX(-104%);
  transition: transform .25s ease;
}
.page-home .filters.is-open { transform: none; }
.page-home .filters-close { display: flex!important; position: sticky; bottom: 0; }
.page-home .results-chrome {
  position: sticky;
  top: calc(var(--header-h) + 22px);
  z-index: 20;
  padding: 12px;
  border-radius: 14px;
  box-shadow: 0 10px 30px rgba(17,26,45,.06);
}
.page-home .quick-chips { margin-bottom: 10px; }
.page-home .toolbar { margin-bottom: 4px; }
.page-home .offer-grid.is-compact {
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px;
  padding: 0;
}
.page-home .offer-grid.is-compact .offer-card {
  display: grid;
  grid-template-columns: 54px minmax(0,1fr);
  align-content: start;
  min-height: 248px;
  padding: 20px;
  gap: 16px 14px;
  border-radius: 16px;
  background: var(--surface);
}
.page-home .offer-grid.is-compact .offer-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(17,26,45,.08);
}
.page-home .offer-grid.is-compact .offer-card > .badge-mark,
.page-home .offer-grid.is-compact .offer-card > .badge-mark.lg {
  width: 54px;
  height: 54px;
  border-radius: 13px;
}
.page-home .offer-grid.is-compact .offer-card-main { min-height: 112px; }
.page-home .offer-grid.is-compact .offer-card h3 { font-size: 14px; line-height: 1.42; }
.page-home .offer-grid.is-compact .offer-card-meta {
  display: flex;
  margin-top: 7px;
  font-size: 9.5px;
}
.page-home .offer-grid.is-compact .offer-card-side {
  grid-column: 1 / -1;
  width: 100%;
  padding-top: 15px;
  margin-top: auto;
  flex-direction: row;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid var(--line-soft);
}
.page-home .offer-grid.is-compact .commission-figure { font-size: 18px; }
.page-home .offer-grid.is-compact .offer-card-actions { width: auto; flex-direction: column; align-items: flex-end; }
.page-home .offer-grid.is-compact .offer-card-side .card-cta {
  min-height: 34px;
  padding: 7px 11px;
  border-radius: 8px;
}

@media (max-width: 980px) {
  .page-home .hero-cats { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .page-home .offer-grid.is-compact { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 700px) {
  .page-home .hero { padding: 38px 0 34px; border-radius: 20px; }
  .page-home .hero h1 { font-size: clamp(37px,11vw,50px); }
  .page-home .hero p.lead { font-size: 13px; }
  .page-home .hero .search-bar { min-height: 52px; margin-top: 22px; padding-left: 12px; }
  .page-home .hero .search-bar input { font-size: 13px; }
  .page-home .hero .search-bar .btn { min-height: 40px; padding-inline: 13px; }
  .page-home .hero-popular { flex-direction: row; align-items: center; overflow-x: auto; }
  .page-home .hero-popular-label { display: none; }
  .page-home .hero .stats-strip { display: none; }
  .page-home .hero-cats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .page-home .hero-cat { min-height: 62px; }
  .page-home .catalog-desk { padding-top: 28px; }
  .page-home .catalog-head { display: block; }
  .page-home .catalog-title { font-size: 28px!important; }
  .page-home .offer-grid.is-compact { grid-template-columns: 1fr; }
  .page-home .offer-grid.is-compact .offer-card { min-height: 218px; }
}

/* Attributed commission: two readable metrics, never a wrapped sentence. */
.commission-pair { display: inline-grid; grid-template-columns: repeat(2, max-content); align-items: end; gap: 18px; text-align: left; font-variant-numeric: tabular-nums; }
.commission-rate { display: flex; flex-direction: column; gap: 5px; }
.commission-pair .rate-label { color: var(--text-2); font-size: 10px; line-height: 1.4; font-weight: 500; letter-spacing: 0; white-space: nowrap; }
.commission-pair .rate-number { color: var(--text); font-size: 23px; font-weight: 650; line-height: 1.1; letter-spacing: -.04em; white-space: nowrap; }
.commission-pair .rate-unit { font-size: .64em; margin-left: 2px; font-weight: 500; }
.commission-pair .commission-rate-secondary .rate-number { color: var(--text-2); font-weight: 500; }
.commission-figure:has(.commission-pair) > .cf-label,
.commission-figure:has(.commission-pair) > small { display: none; }
.detail-head .commission-pair { gap: 32px; }
.detail-head .commission-pair .rate-label { color: #b4bed0; }
.detail-head .commission-pair .rate-number { color: var(--signal); font-size: 34px; }
.detail-head .commission-rate-secondary .rate-number { color: #fff; }
.detail-head .commission-amount .amount-number,
.detail-head .commission-amount .amount-symbol { color: var(--signal); }
.detail-head .commission-amount .amount-unit { color: #b4bed0; font-size: 10px; }
.detail-head .commission-note strong,
.detail-head .commission-status strong { color: var(--signal); font-size: 20px; }
.detail-head .commission-note small,
.detail-head .commission-status small,
.detail-head .commission-status { color: #b4bed0; }
.cdt-pay .commission-pair { gap: 12px; margin-top: 5px; }
.cdt-pay .commission-pair .rate-number { font-size: 16px; }
.cdt-pay .commission-pair .rate-label { font-size: 9px; }
@media (max-width: 380px) {
  .commission-pair { gap: 12px; }
  .commission-pair .rate-number { font-size: 21px; }
}

/* Unified control geometry — compact cards use one coherent action cluster. */
:root {
  --control-h: 40px;
  --control-radius: 10px;
  --action-size: 40px;
}
:where(.btn, .header-saved, .cmdk-trigger, .qchip, .pill, .save-btn, .copy-btn, .compare-toggle, .card-cta, .source-payout-icon) {
  border-radius: var(--control-radius);
}
.offer-card-tools { gap: 6px; }
.page-home .offer-grid.is-compact .offer-card-actions {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px;
}
.page-home .offer-grid.is-compact :where(.card-cta, .save-btn, .copy-btn, .compare-toggle) {
  width: var(--action-size);
  min-width: var(--action-size);
  height: var(--action-size);
  min-height: var(--action-size);
  padding: 0;
  justify-content: center;
  border-radius: var(--control-radius);
}
.page-home .offer-grid.is-compact :where(.card-cta, .compare-toggle) .action-label { display: none; }
.page-home .offer-grid.is-compact .card-cta .ui-icon { margin: 0; }
.page-home .offer-grid.is-compact .source-payout-icon {
  width: var(--action-size);
  height: var(--action-size);
  border-radius: var(--control-radius);
}
@media (max-width: 700px) {
  :root { --control-h: 44px; --action-size: 44px; }
  .page-home .offer-grid.is-compact .offer-card-actions { margin-left: auto; }
}
