*,*::before,*::after{box-sizing:border-box}
:root{
  --bg:#0b0b0d;--bg-rgb:11,11,13;--fg:#f3efe8;--fg-rgb:243,239,232;--mut:#8a8790;--dim:#838089;
  /* Ember + Indigo: warm = the human + the brand, cool = agents being alive */
  --live:#7c8cff;--live-rgb:124,140,255;--focus:var(--live);--surface-solid:#151518;--surface-solid2:#1b1b1f;
  --line:rgba(160,156,190,.13);--line2:rgba(168,164,200,.21);--surface:#151518;--surface2:#1b1b1f;
  --acc:#ff5a36;--acc-rgb:255,90,54;
  --sans:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Helvetica Neue","Segoe UI",Roboto,Inter,Arial,sans-serif;
  --serif:"New York",ui-serif,"Iowan Old Style","Apple Garamond",Baskerville,Georgia,"Times New Roman",serif;
  --ease:cubic-bezier(.16,1,.3,1);--pad:16px;--max:1120px;--r:14px;
}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:120px;background:var(--bg)}
body{margin:0;background:transparent;color:var(--fg);font-family:var(--sans);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-x:clip;min-height:100vh}
img,svg,canvas{display:block}
a{color:inherit}
em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--acc);letter-spacing:-.01em}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px;border-radius:10px}
[hidden]{display:none!important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-60px;z-index:60;background:var(--fg);color:var(--bg);padding:10px 14px;border-radius:10px;text-decoration:none}
.skip:focus{top:12px}
.dot{width:8px;height:8px;border-radius:50%;background:var(--acc);display:inline-block;box-shadow:0 0 0 4px rgba(var(--acc-rgb),.14)}

/* liquid light: fixed, behind everything */
#liquid,.liquid-fallback{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
#liquid{opacity:0;transition:opacity 1.6s ease}
#liquid.on{opacity:1}
.liquid-fallback{z-index:-2;background:
  radial-gradient(60% 40% at 80% 0%,rgba(var(--acc-rgb),.10),transparent 70%),
  radial-gradient(50% 35% at 0% 30%,rgba(var(--fg-rgb),.05),transparent 70%),var(--bg)}

/* top */
.top{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:calc(12px + env(safe-area-inset-top)) var(--pad) 12px}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;font-weight:600;letter-spacing:-.01em;font-size:15px}
.nav{display:flex;gap:2px}
.nav a{text-decoration:none;color:var(--mut);font-size:13.5px;padding:7px 9px;border-radius:9px;transition:color .2s,background .2s}
.nav a:hover{color:var(--fg);background:var(--surface2)}

/* hero */
.hero{position:relative;padding:calc(76px + env(safe-area-inset-top)) 0 18px;isolation:isolate}
#dust{position:absolute;left:0;top:0;width:100%;height:100%;z-index:0;pointer-events:none}
.hero-in{position:relative;z-index:1;max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.eyebrow{margin:0 0 6px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.dust-title{margin:0;font-size:clamp(68px,22vw,168px);line-height:.95;font-weight:700;letter-spacing:-.055em;padding:2px 0 8px;touch-action:pan-y}
.dust-title .acc{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--acc);letter-spacing:-.03em;padding-left:.04em}
.dust-on .dust-title,.dust-on .dust-title .acc{color:transparent}
.lede{margin:2px 0 0;font-size:19px;line-height:1.3;letter-spacing:-.015em;color:var(--mut)}
.lede em{color:var(--fg)}
.intro .eyebrow,.intro .lede{animation:rise .9s var(--ease) both}
.intro .eyebrow{animation-delay:.1s}.intro .lede{animation-delay:.9s}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* directory */
.dir{position:relative;max-width:var(--max);margin:0 auto;padding:0 0 28px}
.tools{position:sticky;top:0;z-index:20;padding:10px var(--pad) 8px;margin-bottom:6px;
  background:rgba(var(--bg-rgb),.9);-webkit-backdrop-filter:saturate(1.5) blur(16px);backdrop-filter:saturate(1.5) blur(16px);
  border-bottom:1px solid transparent;transition:border-color .3s,box-shadow .3s}
.tools.stuck{border-bottom-color:var(--line);box-shadow:0 10px 30px -18px rgba(0,0,0,.8)}
.search{position:relative;display:flex;align-items:center}
.search-ic{position:absolute;left:12px;width:17px;height:17px;fill:none;stroke:var(--dim);stroke-width:2;stroke-linecap:round;pointer-events:none}
.search input{width:100%;height:42px;padding:0 40px 0 38px;border-radius:12px;border:1px solid var(--line2);background:rgba(var(--fg-rgb),.05);font-size:16px;outline:none;transition:border-color .2s,background .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.search input::placeholder{color:var(--dim)}
.search input:focus{border-color:rgba(var(--live-rgb),.6);background:rgba(var(--fg-rgb),.07);box-shadow:0 0 0 4px rgba(var(--live-rgb),.14)}
.search input::-webkit-search-cancel-button{-webkit-appearance:none}
.clear{position:absolute;right:6px;width:32px;height:32px;border:0;border-radius:9px;background:transparent;color:var(--mut);font-size:20px;line-height:1}
.clear:hover{background:var(--surface2)}
.chips-wrap{margin:8px calc(var(--pad) * -1) 0;position:relative}
.chips-wrap::after{content:"";position:absolute;right:0;top:0;bottom:0;width:28px;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(var(--bg-rgb),.9))}
.chips{position:relative;display:flex;gap:6px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;padding:0 28px 2px var(--pad);scroll-padding:0 var(--pad);-webkit-overflow-scrolling:touch}
.chips::-webkit-scrollbar{display:none}
.chip{position:relative;z-index:1;flex:0 0 auto;height:32px;padding:0 12px;border-radius:999px;border:1px solid var(--line2);background:transparent;color:var(--mut);font-size:13px;white-space:nowrap;transition:color .25s,border-color .25s}
.chip:hover{color:var(--fg)}
.chip[aria-pressed="true"]{color:#140804;border-color:transparent;font-weight:600}
.chip-ind{position:absolute;z-index:0;left:0;top:0;height:32px;width:0;border-radius:999px;background:var(--fg);opacity:0;transition:transform .45s var(--ease),width .45s var(--ease),opacity .2s;will-change:transform,width}
.no-ind .chip[aria-pressed="true"]{background:var(--fg)}

.row-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:0 var(--pad);margin:14px 0 8px}
.row-head h2{margin:0;font-size:17px;font-weight:600;letter-spacing:-.015em}
.sub{margin:0;color:var(--dim);font-size:12.5px}

/* featured rail */
.featured{margin-bottom:6px}
.rail{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px var(--pad) 8px;scroll-padding:0 var(--pad);scrollbar-width:none;overscroll-behavior-x:contain}
.rail::-webkit-scrollbar{display:none}
.feat{flex:0 0 72%;max-width:260px;scroll-snap-align:start;display:flex;flex-direction:column;gap:8px;text-align:left;padding:12px;border-radius:var(--r);border:1px solid var(--line);
  background:linear-gradient(160deg,rgba(var(--fg-rgb),.06),rgba(var(--fg-rgb),.02));transition:border-color .25s,transform .25s var(--ease)}
.feat:hover{border-color:var(--line2)}
.feat:active{transform:scale(.985)}
.feat-top{display:flex;align-items:center;gap:10px;min-width:0}
.feat .nm{font-weight:600;font-size:15px;letter-spacing:-.01em}
.feat .mk{font-size:12px;color:var(--dim)}
.feat .tl{margin:0;font-size:13px;line-height:1.38;color:var(--mut);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* logo tile */
.logo{position:relative;flex:0 0 auto;width:40px;height:40px;border-radius:10px;overflow:hidden;background:#1a1a1d;box-shadow:0 0 0 1px rgba(var(--fg-rgb),.08) inset}
.logo img{width:100%;height:100%;object-fit:cover}
.logo::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 1px rgba(255,255,255,.07) inset;pointer-events:none}
.logo.mono{display:grid;place-items:center;font-weight:600;font-size:15px;color:var(--fg);background:linear-gradient(140deg,#2a2a2e,#151517)}
.logo.big{width:60px;height:60px;border-radius:15px}
.feat .logo{width:36px;height:36px;border-radius:9px}

/* results head */
.results-head{align-items:center;margin-top:10px;flex-wrap:wrap;row-gap:6px}
.results-head h2{font-size:13px;font-weight:500;color:var(--dim);width:100%}
.opts{display:flex;align-items:center;gap:5px;width:100%;flex-wrap:wrap;row-gap:6px;min-width:0}
.opts-r{display:flex;align-items:center;gap:5px;margin-left:auto;flex:none}
.seg{display:flex;padding:2px;border-radius:10px;background:rgba(var(--fg-rgb),.05);border:1px solid var(--line)}
.seg button{height:28px;padding:0 7px;white-space:nowrap;border:0;border-radius:8px;background:transparent;color:var(--mut);font-size:12.5px;transition:background .2s,color .2s}
.seg button[aria-pressed="true"]{background:rgba(var(--fg-rgb),.12);color:var(--fg)}
.sort{position:relative;display:inline-grid;place-items:center;width:34px;height:32px;flex:none;border-radius:10px;border:1px solid var(--line);background:rgba(var(--fg-rgb),.05);color:var(--mut)}
.sort .s-ic{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.sort.on{color:var(--fg);border-color:rgba(var(--acc-rgb),.5);background:rgba(var(--acc-rgb),.1)}
.sort select{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:10px;background:transparent;color:transparent;font-size:16px;opacity:0;cursor:pointer;-webkit-appearance:none;appearance:none}
.sort select:focus-visible{opacity:1;outline:2px solid rgba(var(--live-rgb),.8);outline-offset:1px}
.sort select option{background:var(--surface-solid);color:var(--fg)}
.view{flex:none;width:32px;height:32px;display:grid;place-items:center;border-radius:10px;border:1px solid var(--line);background:rgba(var(--fg-rgb),.05);color:var(--mut);padding:0}
.view svg{width:16px;height:16px;fill:currentColor}
.view .v-list{display:none}
.view[aria-pressed="true"] .v-grid{display:none}
.view[aria-pressed="true"] .v-list{display:block}

/* grid: list on phones by default */
.grid{padding:0 var(--pad);display:grid;gap:0}
.card{position:relative;display:flex;align-items:center;gap:12px;width:100%;min-width:0;text-align:left;border:0;background:transparent;padding:9px 0;border-bottom:1px solid var(--line);border-radius:0;transition:background .2s}
.card:last-child{border-bottom-color:transparent}
.card .body{min-width:0;flex:1}
.card .l1{display:flex;align-items:center;gap:6px;min-width:0}
.card .nm{font-weight:600;font-size:15px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .tl,.card .meta,.card .nm{display:block}
.card .tl{margin:1px 0 0;font-size:13px;line-height:1.35;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .meta{margin:2px 0 0;font-size:11.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.price-dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin:0 5px 1px 0;vertical-align:middle;background:var(--dim)}
.price-dot.Free{background:#7fd6a4}.price-dot.Freemium{background:#f2c46b}.price-dot.Paid{background:var(--acc)}
.badge{flex:0 0 auto;font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:2px 6px;border-radius:6px;color:var(--acc);background:rgba(var(--acc-rgb),.13)}
.chev{flex:0 0 auto;width:16px;height:16px;fill:none;stroke:var(--dim);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.7}
@media (hover:hover){.card:hover{background:linear-gradient(90deg,transparent,rgba(var(--fg-rgb),.035),transparent)}.card:hover .chev{stroke:var(--fg)}}
.card:active .logo{transform:scale(.94)}
.logo{transition:transform .25s var(--ease)}

/* 2-column tiles */
.grid.tiles{grid-template-columns:1fr 1fr;gap:8px}
.grid.tiles .card{flex-direction:column;align-items:flex-start;gap:8px;padding:12px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
.grid.tiles .card:last-child{border-bottom-color:var(--line)}
.grid.tiles .card .chev{display:none}
.grid.tiles .card .tl{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:2.7em}
.grid.tiles .card .body{width:100%}
.grid.tiles .card .logo{width:36px;height:36px;border-radius:9px}

/* reveal */
.js .card.pre,.js .rv.pre{opacity:0;transform:translateY(14px)}
.js .card.in,.js .rv.in{opacity:1;transform:none;transition:opacity .6s var(--ease),transform .7s var(--ease);transition-delay:var(--d,0ms)}

.empty{text-align:center;padding:40px var(--pad)}
.empty-t{font-size:18px;margin:0 0 14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:12px;border:0;background:var(--fg);color:#111;font-weight:600;font-size:15px;text-decoration:none;transition:transform .2s var(--ease),opacity .2s}
.btn:active{transform:scale(.98)}
.btn.ghost{background:transparent;color:var(--fg);border:1px solid var(--line2)}
.btn.wide{width:100%}

/* sections */
.sec{max-width:var(--max);margin:0 auto;padding:36px var(--pad) 8px}
.sec h2{margin:0 0 12px;font-size:26px;letter-spacing:-.025em;font-weight:600}
.submit-card,.submit-form{border:1px solid var(--line);border-radius:var(--r);padding:16px;background:rgba(var(--fg-rgb),.03)}
.pill{display:inline-block;margin:0 0 8px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:999px;color:var(--acc);background:rgba(var(--acc-rgb),.12)}
.soon-t{margin:0 0 4px;font-weight:600;font-size:16px}
.soon-b{margin:0;color:var(--mut);font-size:14px}
.submit-form{display:grid;gap:12px}
.submit-form label{display:grid;gap:6px;font-size:13px;color:var(--mut)}
.submit-form input,.submit-form select,.submit-form textarea{padding:11px 12px;border-radius:10px;border:1px solid var(--line2);background:rgba(var(--fg-rgb),.04);font-size:16px;color:var(--fg)}
.fine{margin:8px 0 0;font-size:12px;color:var(--dim)}
.about-big{font-size:21px;line-height:1.3;letter-spacing:-.015em;margin:0 0 10px}
.about-body p{color:var(--mut);font-size:14.5px}
.about-body .about-big{color:var(--fg)}
.legend{display:grid;gap:8px;margin:14px 0 0}
.legend div{display:flex;gap:12px;align-items:baseline;padding:10px 0;border-top:1px solid var(--line)}
.legend dt{flex:0 0 78px;font-weight:600;font-size:14px}
.legend dd{margin:0;color:var(--mut);font-size:13.5px}
.foot{max-width:var(--max);margin:0 auto;padding:28px var(--pad) calc(30px + env(safe-area-inset-bottom));border-top:1px solid var(--line);color:var(--dim);font-size:13px}
.foot p{margin:0 0 6px}
.foot-name{display:flex;align-items:center;gap:9px;color:var(--fg);font-weight:600;font-size:15px}
.foot a{color:var(--mut);text-decoration:none}

/* sheet */
.sheet{padding:0;border:0;background:transparent;color:var(--fg);max-width:none;max-height:none;width:100%;height:100%;margin:0;inset:0;overflow:hidden}
.sheet::backdrop{background:rgba(0,0,0,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.sheet[open]{display:flex;align-items:flex-end;justify-content:center}
.sheet-in{position:relative;width:100%;max-height:88vh;max-height:88svh;overflow-y:auto;overscroll-behavior:contain;background:var(--surface-solid);border:1px solid var(--line2);border-bottom:0;border-radius:22px 22px 0 0;padding:10px 18px calc(22px + env(safe-area-inset-bottom));box-shadow:0 -30px 80px -20px rgba(0,0,0,.7)}
.sheet.anim .sheet-in{animation:sheetUp .5s var(--ease) both}
.sheet.anim::backdrop{animation:fade .35s ease both}
.sheet.closing .sheet-in{animation:sheetDown .28s cubic-bezier(.4,0,1,1) both}
.sheet.closing::backdrop{animation:fade .28s ease reverse both}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:none}}
@keyframes sheetDown{to{transform:translateY(100%)}}
@keyframes fade{from{opacity:0}to{opacity:1}}
.grab{width:38px;height:5px;border-radius:3px;background:var(--line2);margin:0 auto 12px}
.x{position:absolute;right:12px;top:12px;width:34px;height:34px;border-radius:50%;border:0;background:var(--surface2);color:var(--fg);font-size:20px;line-height:1}
.sheet-top{display:flex;align-items:center;gap:14px;margin:4px 40px 10px 0}
.sheet-top h3{margin:0;font-size:24px;letter-spacing:-.02em;line-height:1.1}
.maker{margin:3px 0 0;color:var(--dim);font-size:13.5px}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.tag{font-size:12px;padding:4px 9px;border-radius:999px;border:1px solid var(--line2);color:var(--mut)}
.tag.new{color:var(--acc);border-color:rgba(var(--acc-rgb),.35)}
.sheet-desc{margin:0 0 14px;font-size:15px;line-height:1.55;color:rgba(var(--fg-rgb),.86)}
.sheet h4{margin:14px 0 6px;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);font-weight:600}
.caps{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.caps li{position:relative;padding-left:16px;font-size:14.5px}
.caps li::before{content:"";position:absolute;left:2px;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--acc)}
.sheet-price{margin:0 0 18px;font-size:14.5px;color:var(--mut)}
::view-transition-group(*){animation-duration:.42s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
::view-transition-old(root),::view-transition-new(root){animation-duration:.3s}
::view-transition-group(pk-sheet){animation:none}
::view-transition-new(pk-sheet){animation:vtUp .5s var(--ease) both}
::view-transition-old(pk-sheet){animation:vtDown .28s cubic-bezier(.4,0,1,1) both}
@keyframes vtUp{from{transform:translateY(100%)}}
@keyframes vtDown{to{transform:translateY(100%)}}

/* progress hairline (scroll-driven where supported) */
.progress{position:fixed;left:0;top:0;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,rgba(var(--acc-rgb),.0),var(--acc));z-index:30;pointer-events:none;opacity:.8}
@supports (animation-timeline: scroll()){
  .progress{animation:grow linear both;animation-timeline:scroll(root)}
  @keyframes grow{to{transform:scaleX(1)}}
}

@media (min-width:640px){
  :root{--pad:28px}
  .hero{padding-top:110px;padding-bottom:26px}
  .lede{font-size:22px}
  .feat{flex-basis:260px}
  .grid.list{grid-template-columns:1fr 1fr;column-gap:28px}
  .grid.list .card:nth-last-child(2){border-bottom-color:transparent}
  .grid.tiles{grid-template-columns:repeat(3,1fr);gap:12px}
  .tools{border-radius:0 0 16px 16px}
  .results-head h2{width:auto}
  .opts{width:auto;margin-left:auto}
  .sheet[open]{align-items:center}
  .sheet-in{max-width:560px;border-radius:22px;border-bottom:1px solid var(--line2);padding:22px 26px 26px}
  .grab{display:none}
  @keyframes sheetUp{from{transform:translateY(24px) scale(.98);opacity:0}to{transform:none;opacity:1}}
  @keyframes sheetDown{to{transform:translateY(16px) scale(.98);opacity:0}}
  @keyframes vtUp{from{transform:translateY(28px) scale(.98);opacity:0}}
  @keyframes vtDown{to{transform:translateY(18px) scale(.98);opacity:0}}
}
@media (min-width:1000px){
  .grid.list{grid-template-columns:1fr 1fr 1fr}
  .grid.list .card:nth-last-child(3){border-bottom-color:transparent}
  .grid.tiles{grid-template-columns:repeat(4,1fr)}
  .tools{display:flex;gap:14px;align-items:center}
  .search{flex:0 0 320px}
  .chips-wrap{margin:0;flex:1;min-width:0}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0ms!important}
  .js .card.pre,.js .rv.pre{opacity:1;transform:none}
  #liquid{display:none}
  .progress{display:none}
}

/* v3: pros/cons, platform, sources, chip counts */
.chip .n{margin-left:3px;font-size:.82em;opacity:.5;font-variant-numeric:tabular-nums}
.pc ul,.src ul{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.pc li{position:relative;padding-left:18px;font-size:14px;line-height:1.45;color:rgba(var(--fg-rgb),.82)}
.pc li::before{position:absolute;left:1px;top:0;font-weight:600}
.pros li::before{content:"+";color:#7fd6a4}
.cons li::before{content:"–";color:var(--acc)}
.sheet-plat{margin:0;font-size:14px;line-height:1.45;color:var(--mut)}
.src{margin-top:4px}
.src ul{display:flex;flex-wrap:wrap;gap:6px}
.src a{display:inline-block;font-size:12px;padding:4px 9px;border-radius:999px;border:1px solid var(--line2);color:var(--mut);text-decoration:none;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.src a:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
/* logos live in three sprites (one file per 48); a sprite only loads once a logo from it is on screen */
.logo.sp{background-repeat:no-repeat;background-size:800% 600%}
.logo.sp1{background-image:url(../logos/logos-1.webp?v=0a8eb1153a)}
.logo.sp2{background-image:url(../logos/logos-2.webp?v=0a8eb1153a)}
.logo.sp3{background-image:url(../logos/logos-3.webp?v=01ee636466)}
/* sprite cell by class (no style attributes): column lcN, row lrN */
.logo.sp.lc0{background-position-x:0.000%}.logo.sp.lc1{background-position-x:14.286%}.logo.sp.lc2{background-position-x:28.571%}.logo.sp.lc3{background-position-x:42.857%}.logo.sp.lc4{background-position-x:57.143%}.logo.sp.lc5{background-position-x:71.429%}.logo.sp.lc6{background-position-x:85.714%}.logo.sp.lc7{background-position-x:100.000%}.logo.sp.lr0{background-position-y:0.000%}.logo.sp.lr1{background-position-y:20.000%}.logo.sp.lr2{background-position-y:40.000%}.logo.sp.lr3{background-position-y:60.000%}.logo.sp.lr4{background-position-y:80.000%}.logo.sp.lr5{background-position-y:100.000%}

/* ---------- market view (default list): icons only, CoinGecko-style rows ---------- */
.ic{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.ic .f,.ic path.f{fill:currentColor;stroke:none}
.mi{position:relative;display:inline-grid;place-items:center;flex:0 0 auto;width:32px;height:32px;color:rgba(var(--fg-rgb),.5);border-radius:9px}
.mi .ic{width:16px;height:16px}
.pi.Free{color:#4ade80}.pi.Freemium{color:#facc15}.pi.Paid{color:#ff7a52}
/* a link icon: brighter, with a short accent underline and a press state; a plain icon has neither */
a.il{z-index:2;color:rgba(var(--fg-rgb),.86);text-decoration:none;-webkit-tap-highlight-color:transparent;transition:background .18s,color .18s,transform .18s}
a.il::after,.mi.kl::after,.kl-demo::after{content:"";position:absolute;left:50%;bottom:4px;width:10px;height:1.5px;margin-left:-5px;border-radius:2px;background:rgba(var(--acc-rgb),.75)}
a.il.pi.Free,.mi.kl.pi.Free{color:#4ade80}a.il.pi.Freemium,.mi.kl.pi.Freemium{color:#facc15}a.il.pi.Paid,.mi.kl.pi.Paid{color:#ff7a52}
a.il:active{transform:scale(.9);background:rgba(var(--fg-rgb),.1)}
a.il:focus-visible{outline:2px solid rgba(var(--live-rgb),.9);outline-offset:-2px}
@media (hover:hover){a.il:hover{background:rgba(var(--fg-rgb),.09);color:var(--fg)}}
/* the whole row opens the sheet through one full-size button; icon links sit above it */
.card>.hit{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:inherit;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}
.card>.hit:focus-visible{outline:2px solid rgba(var(--live-rgb),.8);outline-offset:-2px}
.card>.logo,.card>.body,.card>.mc,.card>.chev{pointer-events:none}
.card .strip a.il,.card .mc a.il{pointer-events:auto}
.card:active>.logo{transform:scale(.94)}
.card .strip,.card .mc{display:none}
.grid.market .card{gap:12px;padding:8px 0;min-height:68px}
.grid.market .card .logo{width:44px;height:44px;border-radius:12px}
.grid.market .card .tl,.grid.market .card .meta{display:none}
.grid.market .card .nm{font-size:15.5px;font-weight:650}
.grid.market .card .strip{display:flex;flex-wrap:wrap;align-items:center;margin:1px 0 -2px -8px;min-height:32px}
.grid.market .card .chev{width:14px;height:14px}
.dash{color:var(--dim)}
/* the key: a folding panel, closed on every load, four folding sections inside */
.keybtn{flex:none;height:32px;min-width:32px;padding:0 7px 0 8px;display:inline-flex;align-items:center;gap:4px;border-radius:10px;border:1px solid var(--line);background:rgba(var(--fg-rgb),.05);color:var(--mut);font-size:12.5px;font-weight:600;white-space:nowrap}
.keybtn .k-ic{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.keybtn .k-chev{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .32s cubic-bezier(.2,.8,.2,1)}
.keybtn[aria-expanded="true"]{color:var(--fg);border-color:rgba(var(--acc-rgb),.5);background:rgba(var(--acc-rgb),.1)}
.keybtn[aria-expanded="true"] .k-chev{transform:rotate(180deg)}
.key{display:grid;grid-template-rows:0fr;margin:0 var(--pad);transition:grid-template-rows .32s cubic-bezier(.2,.8,.2,1),margin .32s}
.key.open{grid-template-rows:1fr;margin:0 var(--pad) 10px}
.key-in{min-height:0;overflow:hidden}
.key-box{padding:4px 4px 6px;border-radius:var(--r);border:1px solid var(--line2);background:rgba(18,18,20,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;transform:translateY(-6px);transition:opacity .22s,transform .32s cubic-bezier(.2,.8,.2,1)}
.key.open .key-box{opacity:1;transform:none}
.key:not(.open) .key-in{visibility:hidden;transition:visibility 0s .32s}
.key-top,.key-bot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:2px 2px 2px 10px}
.key-t{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--dim)}
.key-x{flex:none;height:32px;padding:0 10px;display:inline-flex;align-items:center;gap:5px;border-radius:9px;border:1px solid var(--line);background:rgba(var(--fg-rgb),.06);color:var(--fg);font-size:12.5px;font-weight:600;cursor:pointer}
.key-x span{font-size:11px;color:var(--mut)}
.key-x:focus-visible,.ks-h:focus-visible,.keybtn:focus-visible,.view:focus-visible{outline:2px solid rgba(var(--live-rgb),.8);outline-offset:1px}
@media (hover:hover){.key-x:hover{background:rgba(var(--fg-rgb),.11)}.ks-h:hover{background:rgba(var(--fg-rgb),.04)}}
.key-acc{margin:2px 0}
.ks{border-top:1px solid var(--line2)}
.ks:last-child{border-bottom:1px solid var(--line2)}
.ks-h{width:100%;min-height:42px;display:flex;align-items:center;gap:8px;padding:0 8px 0 10px;border:0;background:none;color:var(--fg);font-size:13.5px;font-weight:600;text-align:left;cursor:pointer;border-radius:8px}
.ks-t{flex:1;min-width:0}
.ks-p{display:flex;align-items:center;gap:0;opacity:.75}
.ks-p .mi{width:22px;height:22px;pointer-events:none}
.ks-c{flex:none;width:15px;height:15px;fill:none;stroke:var(--mut);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.ks.on .ks-c{transform:rotate(180deg);stroke:var(--fg)}
.ks-b{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.2,.8,.2,1)}
.ks.on .ks-b{grid-template-rows:1fr}
.ks-in{min-height:0;overflow:hidden;padding:0 10px;opacity:0;transition:opacity .2s,padding .3s}
.ks.on .ks-in{opacity:1;padding:0 10px 8px}
.ks:not(.on) .ks-in{visibility:hidden;transition:opacity .2s,padding .3s,visibility 0s .3s}
.ks-n{margin:0 0 4px;font-size:11.5px;color:var(--dim);line-height:1.35}
.key-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 8px}
.key-list li{display:flex;align-items:center;gap:2px;font-size:12.5px;color:var(--mut);min-width:0;line-height:1.25}
.key-list li .mi{width:28px;height:28px}
.key-list li i{font-style:normal;color:var(--dim);font-size:11.5px}
.key-list li i::before{content:"→ "}
.key-f{position:relative;margin:0;font-size:11px;color:var(--dim);line-height:1.35;min-width:0}
@media (prefers-reduced-motion:reduce){.key,.key-box,.key-in,.keybtn .k-chev,.ks-b,.ks-in,.ks-c{transition:none!important}.key-box{transform:none}}
.kl-demo{display:none}
.mhead{display:none}
@media (min-width:760px){
  .key-list{grid-template-columns:repeat(3,1fr)}
  .key,.key.open{max-width:600px;margin-left:auto}
  .mhead{position:sticky;top:var(--tools-h,0px);z-index:15;display:grid;grid-template-columns:minmax(0,1fr) 40px 40px 136px 136px 16px;gap:14px;align-items:center;margin:0 var(--pad);padding:4px 0 4px 58px;border-bottom:1px solid var(--line2);background:rgba(var(--bg-rgb),.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
  .mhead button,.mhead span{border:0;background:none;padding:0 2px;height:30px;text-align:left;color:var(--dim);display:flex;align-items:center;gap:3px;cursor:pointer;border-radius:8px}
  .mhead span{cursor:default}
  .mhead .ic{width:16px;height:16px}
  .mhead button:hover,.mhead button.on{color:var(--fg)}
  .mhead button:focus-visible{outline:2px solid rgba(var(--live-rgb),.8)}
  .mhead button::after{content:"";width:0;height:0;border:4px solid transparent;border-top-color:currentColor;margin-top:4px;opacity:0;transition:opacity .2s,transform .2s}
  .mhead button.on::after{opacity:1}
  .mhead button.on:not(.desc)::after{transform:rotate(180deg);margin-top:-4px}
  .mhead .mh-price,.mhead .mh-cat{padding-left:8px}
  .grid.market{grid-template-columns:1fr!important}
  .grid.market .card{display:grid;grid-template-columns:44px minmax(0,1fr) 40px 40px 136px 136px 16px;gap:14px;padding:8px 0;min-height:60px}
  .grid.market .card:last-child{border-bottom-color:var(--line)}
  .grid.market .card .strip{display:none}
  .grid.market .card .mc{display:flex;align-items:center;gap:0;min-width:0;margin-left:0}
  .grid.market .card .c-plat,.grid.market .card .c-flags{margin-left:-8px}
  .grid.market .card .mc .dash{padding-left:12px}
}
@media (hover:hover){.grid.market .card:hover{background:rgba(var(--fg-rgb),.03)}}

/* ===================== v6: full-screen agent page ===================== */
.ag:focus{outline:none}
.ag{position:fixed;inset:0;z-index:80;background:var(--bg);color:var(--fg);--tint:255,90,54}
.ag-sc{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y pinch-zoom}
html.ag-open,html.ag-open body{overflow:hidden}
.ag .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.ag .ic .f,.ag .ic path.f{fill:currentColor;stroke:none}
.ag-bar{position:sticky;top:0;z-index:5;display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:6px;height:calc(54px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 10px 0;transition:background .25s,box-shadow .25s,-webkit-backdrop-filter .25s,backdrop-filter .25s}
.ag-bar.solid{background:rgba(var(--bg-rgb),.82);-webkit-backdrop-filter:saturate(140%) blur(14px);backdrop-filter:saturate(140%) blur(14px);box-shadow:0 1px 0 var(--line)}
.ag-btn{width:40px;height:40px;border-radius:50%;border:0;display:grid;place-items:center;background:rgba(var(--fg-rgb),.07);color:var(--fg);transition:background .2s,transform .2s var(--ease)}
.ag-btn:active{transform:scale(.92)}
@media (hover:hover){.ag-btn:hover{background:rgba(var(--fg-rgb),.13)}}
.ag-mini{margin:0;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:15px;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .35s var(--ease)}
.ag-mini b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:650;letter-spacing:-.01em}
.ag-bar.named .ag-mini{opacity:1;transform:none}
.logo.xs{width:24px;height:24px;border-radius:7px;font-size:10px}
.logo.sm{width:36px;height:36px;border-radius:10px;font-size:13px}
.logo.xl{width:96px;height:96px;border-radius:24px;font-size:32px;box-shadow:0 0 0 1px rgba(255,255,255,.08) inset,0 22px 50px -14px rgba(var(--tint),.65),0 0 70px -6px rgba(var(--tint),.35)}
.ag-body{max-width:720px;margin:0 auto;padding:0 18px calc(40px + env(safe-area-inset-bottom));will-change:auto}
/* hero */
.ag-hero{position:relative;overflow:hidden;margin:-54px -18px 0;padding:calc(64px + env(safe-area-inset-top)) 18px 26px;text-align:center;isolation:isolate}
.ag-glow{position:absolute;left:50%;top:-30px;width:600px;height:520px;margin-left:-300px;z-index:-1;pointer-events:none;will-change:transform;-webkit-mask-image:radial-gradient(closest-side,#000 62%,transparent);mask-image:radial-gradient(closest-side,#000 62%,transparent)}
.ag-glow i{position:absolute;border-radius:50%;will-change:transform}
.ag-glow i:nth-child(1){left:150px;top:30px;width:300px;height:300px;background:radial-gradient(closest-side,rgba(var(--tint),.42),rgba(var(--tint),0));animation:agB1 16s ease-in-out infinite alternate}
.ag-glow i:nth-child(2){left:250px;top:110px;width:260px;height:230px;background:radial-gradient(closest-side,rgba(var(--tint),.26),rgba(var(--tint),0));animation:agB2 19s ease-in-out infinite alternate}
.ag-glow i:nth-child(3){left:110px;top:150px;width:240px;height:220px;background:radial-gradient(closest-side,rgba(var(--acc-rgb),.14),rgba(var(--acc-rgb),0));animation:agB3 23s ease-in-out infinite alternate}
@keyframes agB1{to{transform:translate3d(-46px,26px,0) scale(1.12)}}
@keyframes agB2{to{transform:translate3d(-70px,-30px,0) scale(.9)}}
@keyframes agB3{to{transform:translate3d(80px,-20px,0) scale(1.15)}}
.ag-lw{display:flex;justify-content:center;margin:6px 0 16px;will-change:transform}
.ag-name{margin:0;font-size:34px;line-height:1.08;font-weight:700;letter-spacing:-.03em;overflow-wrap:anywhere}
.ag-maker{margin:6px 0 0;color:var(--dim);font-size:13.5px}
.ag-tag{margin:12px auto 0;max-width:30em;font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.35;color:rgba(var(--fg-rgb),.86);text-wrap:balance}
.ag-chips{margin:14px 0 0;display:flex;flex-wrap:wrap;justify-content:center;gap:7px}
.ag-chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px 0 9px;border-radius:99px;background:rgba(var(--fg-rgb),.06);box-shadow:0 0 0 1px var(--line) inset;font-size:13px;color:var(--mut)}
.ag-chip .ic{width:16px;height:16px}
.ag-chip b{font-weight:500}
.ag-chip.new{color:var(--acc);padding:0 11px}
.ag .pi.Free{color:#4ade80}.ag .pi.Freemium{color:#facc15}.ag .pi.Paid{color:#ff7a52}
.ag-cta{margin:20px auto 0;max-width:340px}
.ag-go{width:100%;height:50px;border-radius:14px;font-size:15.5px}
.ag-go .ic{width:18px;height:18px}
.ag-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 4px;margin:16px auto 0;max-width:380px}
.ag-ib{display:flex;flex-direction:column;align-items:center;gap:5px;width:70px;padding:2px 0;text-decoration:none;color:var(--mut);font-size:11.5px}
.ag-ibc{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(var(--fg-rgb),.06);box-shadow:0 0 0 1px var(--line) inset;color:var(--fg);transition:background .2s,transform .2s var(--ease)}
.ag-ib:active .ag-ibc{transform:scale(.92)}
@media (hover:hover){.ag-ib:hover .ag-ibc{background:rgba(var(--fg-rgb),.12)}.ag-ib:hover{color:var(--fg)}}
.ag-host{margin:14px 0 0;font-size:12px;color:var(--dim);letter-spacing:.02em}
/* glance */
.ag-glance{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:8px;margin:6px 0 8px}
.ag-tile{display:flex;flex-direction:column;align-items:center;text-align:center;gap:3px;padding:13px 6px 11px;border-radius:16px;background:rgba(var(--fg-rgb),.035);box-shadow:0 0 0 1px var(--line) inset;min-width:0}
.ag-ti{height:24px;display:flex;align-items:center;justify-content:center;color:var(--fg);margin-bottom:3px}
.ag-ti .ic{width:22px;height:22px}
.ag-pl{display:flex;gap:4px}.ag-pl .ic{width:18px;height:18px}
.ag-tv{font-size:13.5px;font-weight:600;line-height:1.2;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ag-tk{font-size:11px;color:var(--dim);line-height:1.25}
/* sections */
.ag-sec{padding:26px 0 4px;border-top:1px solid var(--line);margin-top:22px}
.ag-glance+.ag-sec{border-top:0;margin-top:10px}
.ag-h{margin:0 0 12px;font-size:22px;font-weight:650;letter-spacing:-.02em}
.ag-h em{font-size:1.08em}
.ag-desc{margin:0;font-size:16px;line-height:1.6;color:rgba(var(--fg-rgb),.88)}
.ag-feats{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:8px}
.ag-feats li{position:relative;padding:11px 12px 11px 34px;border-radius:12px;background:rgba(var(--fg-rgb),.035);font-size:14.5px;line-height:1.4}
.ag-feats li::before{content:"";position:absolute;left:14px;top:17px;width:8px;height:8px;border-radius:50%;background:rgb(var(--tint));box-shadow:0 0 0 4px rgba(var(--tint),.16)}
.ag-pc{display:grid;gap:10px}
.ag-pcc{padding:14px 14px 6px;border-radius:16px;background:rgba(var(--fg-rgb),.035);box-shadow:0 0 0 1px var(--line) inset}
.ag-pcc h3{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:14px;font-weight:650;letter-spacing:.01em}
.ag-pci{width:24px;height:24px;border-radius:50%;display:grid;place-items:center}
.ag-pci .ic{width:15px;height:15px;stroke-width:2.2}
.pro .ag-pci{background:rgba(74,222,128,.14);color:#4ade80}.con .ag-pci{background:rgba(255,122,82,.14);color:#ff7a52}
.ag-pcc ul{margin:0;padding:0 0 0 2px;list-style:none}
.ag-pcc li{padding:8px 0;border-top:1px solid var(--line);font-size:14.5px;line-height:1.45;color:rgba(var(--fg-rgb),.86)}
.ag-pcc li:first-child{border-top:0}
.ag-price{display:flex;align-items:center;gap:14px;padding:14px;border-radius:16px;background:rgba(var(--fg-rgb),.035);box-shadow:0 0 0 1px var(--line) inset}
.ag-pbig{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:currentColor;flex:0 0 auto}
.ag-pbig .ic{width:26px;height:26px;stroke:#111;stroke-width:2}
.ag-pbig.Free{background:rgba(74,222,128,.16)}.ag-pbig.Freemium{background:rgba(250,204,21,.15)}.ag-pbig.Paid{background:rgba(255,122,82,.16)}
.ag-pbig.Free .ic,.ag-pbig.Freemium .ic,.ag-pbig.Paid .ic{stroke:currentColor}
.ag-ptx{min-width:0}
.ag-pt{margin:0;font-weight:650;font-size:16px}
.ag-pn{margin:2px 0 0;font-size:14.5px;line-height:1.45;color:var(--mut)}
.ag-more{display:inline-flex;align-items:center;gap:6px;margin-top:12px;color:var(--fg);font-size:14px;text-decoration:none;border-bottom:1px solid var(--line2);padding-bottom:2px}
.ag-more .ic{width:15px;height:15px}
.ag-fine{display:flex;align-items:center;gap:6px;margin:12px 0 0;font-size:12.5px;color:var(--dim)}
.ag-fine .ic{width:15px;height:15px}
.ag-plats{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 12px}
.ag-ptext{margin:0;font-size:15px;line-height:1.55;color:rgba(var(--fg-rgb),.82)}
.ag-src{list-style:none;margin:0;padding:0;border-radius:16px;overflow:hidden;box-shadow:0 0 0 1px var(--line) inset}
.ag-src li+li{border-top:1px solid var(--line)}
.ag-src a{display:flex;align-items:center;gap:8px;min-height:48px;padding:10px 14px;text-decoration:none;font-size:14px}
.ag-src b{font-weight:600;flex:0 0 auto}
.ag-src span{color:var(--dim);flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ag-src .ic{width:15px;height:15px;color:var(--dim)}
@media (hover:hover){.ag-src a:hover{background:rgba(var(--fg-rgb),.04)}}
.ag-sim{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.ag-mc{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:12px;border:0;border-radius:16px;background:rgba(var(--fg-rgb),.035);box-shadow:0 0 0 1px var(--line) inset;text-align:left;color:var(--fg);min-width:0;transition:background .2s,transform .2s var(--ease)}
.ag-mc:active{transform:scale(.97)}
@media (hover:hover){.ag-mc:hover{background:rgba(var(--fg-rgb),.07)}}
.ag-mct{display:flex;flex-direction:column;gap:2px;min-width:0;width:100%}
.ag-mct b{font-size:14.5px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ag-mct span{font-size:12.5px;line-height:1.35;color:var(--mut);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ag-pn2{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}
.ag-step{display:flex;flex-direction:column;gap:8px;padding:12px;border:0;border-radius:16px;background:rgba(var(--fg-rgb),.035);box-shadow:0 0 0 1px var(--line) inset;color:var(--fg);min-width:0;text-align:left}
.ag-step.next{align-items:flex-end;text-align:right}
.ag-sk{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--dim)}
.ag-sk .ic{width:15px;height:15px}
.ag-sn{display:flex;align-items:center;gap:9px;min-width:0;max-width:100%}
.ag-sn b{font-size:14.5px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.ag-step .logo.sm{width:30px;height:30px;border-radius:9px}
.ag-hint{margin:10px 0 0;text-align:center;font-size:12px;color:var(--dim)}
@media (hover:hover) and (pointer:fine){.ag-hint{display:none}}
.ag-end{display:flex;justify-content:center;margin-top:26px}
.ag-backlist{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px;border-radius:99px;border:0;background:rgba(var(--fg-rgb),.07);color:var(--fg);font-size:14.5px}
.ag-backlist .ic{width:17px;height:17px}
.ag-toast{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translate(-50%,20px);margin:0;padding:10px 16px;border-radius:99px;background:var(--fg);color:#111;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .25s,transform .35s var(--ease);max-width:calc(100% - 40px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;z-index:6}
.ag-toast.on{opacity:1;transform:translate(-50%,0)}
/* reveal */
.ag-rv{opacity:0;transform:translate3d(0,16px,0);transition:opacity .6s ease,transform .7s var(--ease)}
.ag-rv.in{opacity:1;transform:none}
/* fallback motion (no View Transitions) */
.ag.ag-rise{animation:agRise .46s var(--ease) both}
.ag.ag-out{animation:agOut .24s cubic-bezier(.4,0,1,1) both}
.ag-body.ag-fade{animation:agFade .35s ease both}
.ag-body.ag-from-r{animation:agFromR .42s var(--ease) both}
.ag-body.ag-from-l{animation:agFromL .42s var(--ease) both}
@keyframes agRise{from{opacity:0;transform:translate3d(0,26px,0)}to{opacity:1;transform:none}}
@keyframes agOut{to{opacity:0;transform:translate3d(0,22px,0)}}
@keyframes agFade{from{opacity:0}}
@keyframes agFromR{from{opacity:0;transform:translate3d(40px,0,0)}}
@keyframes agFromL{from{opacity:0;transform:translate3d(-40px,0,0)}}
@keyframes agSlideOutL{to{opacity:0;transform:translate3d(-48px,0,0)}}
@keyframes agSlideOutR{to{opacity:0;transform:translate3d(48px,0,0)}}
/* view transitions: the shared header stays out of it, the logo morphs, the page rises over the list */
html.ag-vt .sh,html.ag-vt .sh-brand,html.ag-open .sh,html.ag-open .sh-brand{view-transition-name:none}
::view-transition-group(pk-logo){animation-duration:.52s;animation-timing-function:cubic-bezier(.16,1,.3,1)}
html.ag-vt-open::view-transition-old(root){animation:none}
html.ag-vt-open::view-transition-new(root){animation:agRise .46s var(--ease) both}
html.ag-vt-close::view-transition-old(root){animation:agOut .26s cubic-bezier(.4,0,1,1) both;z-index:2}
html.ag-vt-close::view-transition-new(root){animation:none}
html.ag-vt-swap::view-transition-old(root){animation:agOut .2s ease both}
html.ag-vt-swap::view-transition-new(root){animation:agFade .38s ease .06s both}
html.ag-vt-next::view-transition-old(root){animation:agSlideOutL .24s cubic-bezier(.4,0,1,1) both}
html.ag-vt-next::view-transition-new(root){animation:agFromR .42s var(--ease) both}
html.ag-vt-prev::view-transition-old(root){animation:agSlideOutR .24s cubic-bezier(.4,0,1,1) both}
html.ag-vt-prev::view-transition-new(root){animation:agFromL .42s var(--ease) both}
@media (min-width:640px){
  .ag-body{padding:0 28px 56px}.ag-hero{margin:0 -28px;padding-top:calc(30px + env(safe-area-inset-top))}
  .ag-name{font-size:44px}.ag-tag{font-size:21px}
  .ag-pc.two{grid-template-columns:1fr 1fr}
  .ag-feats{grid-template-columns:1fr 1fr}
  .ag-sim{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ag-bar{max-width:none;padding-left:18px;padding-right:18px}
}
@media (prefers-reduced-motion:reduce){
  .ag-glow i{animation:none!important}
  .ag-rv{opacity:1;transform:none;transition:none}
  .ag.ag-rise,.ag.ag-out,.ag-body.ag-fade,.ag-body.ag-from-r,.ag-body.ag-from-l{animation:none!important}
  .ag-mini,.ag-toast{transition:none}
}

/* ===================== v7: symmetry, save / compare, filters, magic ===================== */
:root{--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--r-sm:10px;--r-md:14px;--r-lg:18px;--spring:cubic-bezier(.34,1.56,.64,1)}
/* row actions: save + compare, stacked into one tidy 32px column on the phone */
.acts{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;flex:none;width:32px}
.act{position:relative;width:32px;height:32px;display:grid;place-items:center;padding:0;border:0;border-radius:var(--r-sm);background:transparent;color:rgba(var(--fg-rgb),.38);transition:color .2s,background .2s,transform .35s var(--spring)}
.act .ic{width:16px;height:16px}
.act:active{transform:scale(.86)}
.act.sv[aria-pressed="true"]{color:var(--acc)}
.act.sv[aria-pressed="true"] .ic path{fill:currentColor}
.act.cp .i-check,.ag-act.cp .i-check{display:none}
.act.cp[aria-pressed="true"]{color:var(--bg);background:var(--fg)}
.act.cp[aria-pressed="true"] .i-plus,.ag-act.cp[aria-pressed="true"] .i-plus{display:none}
.act.cp[aria-pressed="true"] .i-check,.ag-act.cp[aria-pressed="true"] .i-check{display:block}
.act.cp[aria-pressed="true"]{width:24px;height:24px;margin:4px;border-radius:8px}
@media (hover:hover){.act:hover{color:var(--fg);background:rgba(var(--fg-rgb),.07)}.act.cp[aria-pressed="true"]:hover{background:var(--fg);color:var(--bg)}}
.card>.acts{pointer-events:auto}
.grid.market .card{min-height:72px;padding:var(--s1) 0;gap:var(--s3)}
.grid.market .card .chev{margin-left:-4px}
.grid.tiles .card .acts{position:absolute;top:6px;right:6px;flex-direction:row;width:auto}
.grid.tiles .card{padding-right:12px}
.grid.tiles .card .l1{padding-right:56px}
@media (min-width:760px){
  .mhead{grid-template-columns:minmax(0,1fr) 40px 40px 136px 136px 72px 16px!important}
  .grid.market .card{grid-template-columns:44px minmax(0,1fr) 40px 40px 136px 136px 72px 16px!important}
  .grid.market .card .acts{flex-direction:row;width:72px;justify-content:flex-end;gap:var(--s1)}
  .grid.market .card .act.cp[aria-pressed="true"]{margin:4px}
}
/* toolbar: one even row of 32px controls */
.fbtn{position:relative;flex:none;height:32px;min-width:32px;padding:0 9px 0 8px;display:inline-flex;align-items:center;gap:5px;border-radius:var(--r-sm);border:1px solid var(--line);background:rgba(var(--fg-rgb),.05);color:var(--mut);font-size:12.5px;font-weight:600;transition:transform .3s var(--spring),border-color .2s,color .2s}
.fbtn .ic{width:16px;height:16px}
.fbtn:active{transform:scale(.93)}
.fbtn.on{color:var(--fg);border-color:rgba(var(--acc-rgb),.5);background:rgba(var(--acc-rgb),.1)}
.fdot{position:absolute;top:-3px;right:-3px;width:9px;height:9px;border-radius:50%;background:var(--acc);box-shadow:0 0 0 2px var(--bg);transform:scale(0);transition:transform .35s var(--spring)}
.fbtn.on .fdot{transform:scale(1)}
@media (max-width:420px){.fbtn-t{display:none}.fbtn{padding:0;width:32px;justify-content:center}}
.activef{display:flex;flex-wrap:wrap;gap:var(--s2);padding:0 var(--pad) var(--s3)}
.apill{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px 0 12px;border-radius:99px;border:0;background:rgba(var(--acc-rgb),.12);box-shadow:0 0 0 1px rgba(var(--acc-rgb),.35) inset;color:var(--fg);font-size:12.5px;font-weight:550;transition:transform .3s var(--spring)}
.apill i{font-style:normal;font-size:10px;color:var(--mut)}
.apill.clr{background:transparent;box-shadow:0 0 0 1px var(--line) inset;color:var(--mut);padding:0 12px}
.apill:active{transform:scale(.94)}
/* search: "/" hint on desktop, recent searches under the field */
.search{position:relative}
.slash{display:none}
@media (hover:hover) and (pointer:fine){.slash{display:grid;place-items:center;position:absolute;right:12px;top:50%;transform:translateY(-50%);width:20px;height:20px;border-radius:6px;border:1px solid var(--line2);font:600 11px/1 var(--sans);color:var(--dim);pointer-events:none}.search:focus-within .slash,.clear:not([hidden])~.slash{display:none}}
.recent{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:30;padding:var(--s3);border-radius:var(--r-md);background:rgba(22,22,24,.97);box-shadow:0 0 0 1px var(--line2) inset,0 18px 40px -12px rgba(0,0,0,.8);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);animation:pkDrop .28s var(--ease) both}
.recent-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--s2);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.recent-h button{border:0;background:none;color:var(--mut);font-size:12px;padding:4px 2px;text-transform:none;letter-spacing:0}
.recent-l{display:flex;flex-wrap:wrap;gap:var(--s2)}
.rpill{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px 0 10px;border-radius:99px;border:0;background:rgba(var(--fg-rgb),.06);box-shadow:0 0 0 1px var(--line) inset;color:var(--fg);font-size:13px}
.rpill .ic{width:14px;height:14px;color:var(--dim)}
@keyframes pkDrop{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
/* filters sheet */
.fsheet{position:fixed;inset:0;z-index:90}
.fs-scrim{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:opacity .3s ease;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.fs-card{position:absolute;left:50%;bottom:0;width:100%;max-width:520px;max-height:86svh;overflow:auto;overscroll-behavior:contain;margin-left:-260px;padding:var(--s2) var(--s5) calc(var(--s5) + env(safe-area-inset-bottom));border-radius:24px 24px 0 0;background:var(--surface-solid);box-shadow:0 0 0 1px var(--line2) inset,0 -20px 60px -20px rgba(0,0,0,.9);transform:translate3d(0,104%,0);transition:transform .42s var(--ease)}
@media (max-width:520px){.fs-card{left:0;margin-left:0}}
.fsheet.on .fs-scrim{opacity:1}.fsheet.on .fs-card{transform:none}
.fs-grab{width:40px;height:5px;border-radius:3px;background:rgba(var(--fg-rgb),.22);margin:0 auto var(--s3)}
.fs-top{display:grid;grid-template-columns:32px 1fr 32px;align-items:center;margin-bottom:var(--s2)}
.fs-t{grid-column:2;margin:0;text-align:center;font-size:17px;font-weight:650;letter-spacing:-.01em}
.fs-x{grid-column:3;width:32px;height:32px;border-radius:50%;border:0;background:rgba(var(--fg-rgb),.08);color:var(--mut);font-size:12px}
.fs-sec{padding:var(--s4) 0;border-top:1px solid var(--line)}
.fs-sec:first-of-type{border-top:0}
.fs-sec h3{margin:0 0 var(--s3);font-size:11px;font-weight:650;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);text-align:center}
.fs-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s2)}
.fchip{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border-radius:99px;border:0;background:rgba(var(--fg-rgb),.05);box-shadow:0 0 0 1px var(--line2) inset;color:var(--mut);font-size:13.5px;font-weight:550;transition:background .2s,color .2s,box-shadow .2s,transform .35s var(--spring)}
.fchip .ic{width:15px;height:15px}
.fchip[aria-pressed="true"]{background:var(--fg);color:var(--bg);box-shadow:none}
.fchip:active{transform:scale(.93)}
.fs-foot{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3);padding-top:var(--s4);border-top:1px solid var(--line)}
.fs-clear,.fs-done{height:48px;border-radius:var(--r-md);border:0;font-size:15px;font-weight:650;transition:transform .3s var(--spring)}
.fs-clear{background:rgba(var(--fg-rgb),.07);color:var(--fg)}
.fs-done{background:var(--acc);color:#140804}
.fs-clear:active,.fs-done:active{transform:scale(.96)}
/* compare tray: a floating, centered pill */
.tray{position:fixed;left:50%;bottom:calc(12px + env(safe-area-inset-bottom));z-index:95;width:calc(100% - 24px);max-width:420px;transform:translate(-50%,0)}
.tray-in{display:grid;grid-template-columns:auto 1fr 40px;align-items:center;gap:var(--s2);padding:var(--s2);border-radius:20px;background:rgba(24,24,27,.92);box-shadow:0 0 0 1px var(--line2) inset,0 18px 50px -12px rgba(0,0,0,.9),0 0 40px -18px rgba(var(--acc-rgb),.6);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4)}
.tray-slots{display:flex;gap:6px}
.ts{position:relative;width:40px;height:40px;border-radius:12px;box-shadow:0 0 0 1.5px rgba(var(--fg-rgb),.16) inset;background:transparent;border:0;padding:0;display:grid;place-items:center}
span.ts{background-image:linear-gradient(rgba(var(--fg-rgb),.04),rgba(var(--fg-rgb),.04));box-shadow:none;outline:1.5px dashed rgba(var(--fg-rgb),.18);outline-offset:-1.5px}
.ts.on{box-shadow:none}
.ts .logo{width:40px;height:40px;border-radius:12px}
.ts i{position:absolute;top:-5px;right:-5px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:#2a2a2e;box-shadow:0 0 0 2px #18181b;color:var(--fg);font-size:8px;font-style:normal}
.tray-go{height:40px;border-radius:12px;border:0;background:var(--acc);color:#140804;font-size:14.5px;font-weight:700;letter-spacing:-.005em;transition:transform .3s var(--spring),opacity .2s}
.tray-go:disabled{background:rgba(var(--fg-rgb),.08);color:var(--mut);font-weight:600}
.tray-go:not(:disabled):active{transform:scale(.95)}
.tray-x{width:40px;height:40px;border-radius:12px;border:0;background:transparent;color:var(--dim);font-size:13px}
html.has-tray .foot,html.has-tray .sf{padding-bottom:96px}
html.fs-open .tray{opacity:0;pointer-events:none}
/* toast */
.pk-toast{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));z-index:120;margin:0;max-width:calc(100% - 48px);padding:10px 16px;border-radius:99px;background:var(--fg);color:var(--bg);font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transform:translate(-50%,16px);opacity:0;pointer-events:none;transition:transform .4s var(--spring),opacity .25s}
.pk-toast.on{transform:translate(-50%,0);opacity:1}
/* ---------- agent page: strict rhythm ---------- */
.ag-sec{padding:var(--s5) 0 0;margin-top:var(--s5)}
.ag-h{margin:0 0 var(--s4);font-size:22px;line-height:1.2}
.ag-glance{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s2);margin:var(--s2) 0}
.ag-glance .ag-tile{flex:0 0 calc((100% - (var(--cols,3) - 1) * var(--s2)) / var(--cols,3));min-height:96px;justify-content:center;padding:var(--s3) var(--s2)}
.ag-acts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s2);max-width:380px;margin:var(--s3) auto 0}
.ag-act{display:flex;align-items:center;justify-content:center;gap:6px;height:40px;padding:0 var(--s2);border-radius:var(--r-md);border:0;background:rgba(var(--fg-rgb),.06);box-shadow:0 0 0 1px var(--line) inset;color:var(--fg);font-size:13px;font-weight:600;white-space:nowrap;min-width:0;transition:background .2s,box-shadow .2s,transform .35s var(--spring)}
.ag-act span{overflow:hidden;text-overflow:ellipsis}
.ag-act .ic{width:16px;height:16px}
.ag-act:active{transform:scale(.95)}
.ag-act .t-on{display:none}
.ag-act[aria-pressed="true"] .t-on{display:inline}.ag-act[aria-pressed="true"] .t-off{display:none}
.ag-act.sv[aria-pressed="true"]{color:var(--acc);box-shadow:0 0 0 1px rgba(var(--acc-rgb),.45) inset;background:rgba(var(--acc-rgb),.1)}
.ag-act.sv[aria-pressed="true"] .ic path{fill:currentColor}
.ag-act.cp[aria-pressed="true"]{background:var(--fg);color:var(--bg);box-shadow:none}
.ag-act.cw[aria-expanded="true"]{box-shadow:0 0 0 1px rgba(var(--fg-rgb),.35) inset}
.ag-cw{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .4s var(--ease),opacity .3s;max-width:380px;margin:0 auto}
.ag-cw.open{grid-template-rows:1fr;opacity:1}
.ag-cwi{overflow:hidden}
.ag-cw.open .ag-cwi{padding-top:var(--s3)}
.ag-cwl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}
.ag-cwb{display:flex;align-items:center;gap:var(--s2);height:44px;padding:0 var(--s3) 0 var(--s2);border-radius:var(--r-md);border:0;background:rgba(var(--fg-rgb),.045);box-shadow:0 0 0 1px var(--line) inset;color:var(--fg);font-size:13px;font-weight:600;min-width:0;text-align:left;transition:transform .35s var(--spring)}
.ag-cwb span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ag-cwb::before{content:"vs";font:italic 400 13px var(--serif);color:var(--acc);order:-1}
.ag-cwb:active{transform:scale(.96)}
.ag-cws{display:flex;align-items:center;justify-content:space-between;gap:var(--s3);margin-top:var(--s2);height:44px;padding:0 var(--s3);border-radius:var(--r-md);box-shadow:0 0 0 1px var(--line) inset;font-size:13px;color:var(--mut);position:relative}
.ag-cws select{flex:1;min-width:0;max-width:60%;height:32px;border:0;border-radius:8px;background:rgba(var(--fg-rgb),.07);color:var(--fg);font-size:16px;padding:0 8px;text-align-last:right}
.ag-cws select option,.ag-cws select optgroup{background:var(--surface-solid);color:var(--fg)}
.ag-tags{display:flex;flex-wrap:wrap;gap:var(--s2);margin:0}
.ag-tagc{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:6px 12px;border-radius:99px;background:rgba(var(--fg-rgb),.05);box-shadow:0 0 0 1px var(--line) inset;font-size:13.5px;line-height:1.3;color:rgba(var(--fg-rgb),.88)}
.ag-tagc.m .ic{width:13px;height:13px;color:rgb(var(--tint))}
#ag-h-best+.ag-tags .ag-tagc{background:rgba(var(--tint),.1);box-shadow:0 0 0 1px rgba(var(--tint),.3) inset}
.ag-maker-c{position:relative;padding:var(--s4);border-radius:var(--r-lg);background:rgba(var(--fg-rgb),.035);box-shadow:0 0 0 1px var(--line) inset;overflow:hidden}
.ag-mkh{display:flex;align-items:center;gap:var(--s3)}
.ag-mkm{flex:none;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-weight:650;font-size:16px;background:linear-gradient(140deg,rgba(var(--tint),.35),rgba(var(--tint),.08));box-shadow:0 0 0 1px rgba(var(--tint),.35) inset}
.ag-mkn{margin:0;font-size:17px;font-weight:650;letter-spacing:-.01em}
.ag-mkn a{display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.ag-mkn .ic{width:14px;height:14px;color:var(--dim)}
.ag-mku{margin:2px 0 0;font-size:12.5px;color:var(--dim)}
.ag-mkd{display:grid;grid-template-columns:1fr 1fr;gap:var(--s2);margin:var(--s4) 0 0}
.ag-mkd div{padding:var(--s3);border-radius:var(--r-md);background:rgba(var(--fg-rgb),.035);text-align:center}
.ag-mkd div:only-child{grid-column:1/-1}
.ag-mkd dt{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.ag-mkd dd{margin:2px 0 0;font-size:14.5px;font-weight:600}
.ag-mkq{margin:var(--s4) 0 0;padding:var(--s4) 0 0;border-top:1px solid var(--line);font:italic 400 17px/1.45 var(--serif);color:rgba(var(--fg-rgb),.9);text-align:center}
.ag-mkq cite{display:block;margin-top:var(--s2);font:500 11px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--dim);font-style:normal}
.ag-ft{display:inline-block;margin-left:var(--s2);padding:2px 8px;border-radius:99px;background:rgba(74,222,128,.12);color:#4ade80;font-size:11px;font-weight:650;vertical-align:2px}
.ag-plans{margin-top:var(--s4);border-radius:var(--r-lg);overflow:hidden;box-shadow:0 0 0 1px var(--line) inset}
.ag-plr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s3);align-items:center;padding:var(--s3) var(--s4);border-top:1px solid var(--line)}
.ag-plr:first-child{border-top:0}
.ag-plh{padding-top:var(--s2);padding-bottom:var(--s2);background:rgba(var(--fg-rgb),.04);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.ag-plh span:last-child{text-align:right}
.ag-pln,.ag-plp{display:flex;flex-direction:column;min-width:0}
.ag-plp{align-items:flex-end;text-align:right}
.ag-pln b,.ag-plp b{font-size:15px;font-weight:650}
.ag-plp b{font-variant-numeric:tabular-nums;white-space:nowrap}
.ag-pln i,.ag-plp i{font-style:normal;font-size:12.5px;color:var(--dim);line-height:1.35}
.ag-pm{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s2)}
.ag-pmc{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;height:68px;border-radius:var(--r-md);background:rgba(var(--fg-rgb),.02);box-shadow:0 0 0 1px rgba(var(--fg-rgb),.05) inset;color:rgba(var(--fg-rgb),.24);text-align:center;padding:0 2px}
.ag-pmc .ic{width:18px;height:18px}
.ag-pmc b{font-size:11px;font-weight:600;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.ag-pmc.on{color:var(--fg);background:rgba(var(--tint),.1);box-shadow:0 0 0 1px rgba(var(--tint),.35) inset}
.ag-pmc.on .ic{color:rgb(var(--tint))}
.ag-plats+.ag-ptext,.ag-pm+.ag-fine+.ag-ptext{margin-top:var(--s3)}
.ag-priv{margin:0;padding:0;list-style:none;display:grid;gap:var(--s2)}
.ag-priv li{display:flex;gap:var(--s3);align-items:flex-start;padding:var(--s3);border-radius:var(--r-md);background:rgba(var(--fg-rgb),.035);font-size:14px;line-height:1.45}
.ag-priv .ic{width:18px;height:18px;margin-top:1px;color:#4ade80}
.ag-soc{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s3);margin:0}
.ag-sci{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:rgba(var(--fg-rgb),.06);box-shadow:0 0 0 1px var(--line) inset;color:var(--fg);transition:transform .35s var(--spring),background .2s}
.ag-sci .ic{width:19px;height:19px}
.ag-sci:active{transform:scale(.9)}
@media (hover:hover){.ag-sci:hover{background:rgba(var(--tint),.18)}}
#ag-h-soc{text-align:center}
.ag-pc.two{grid-template-columns:1fr 1fr}
.ag-pc.two .ag-pcc{padding:var(--s3) var(--s3) var(--s1)}
.ag-pc.two .ag-pcc li{font-size:13.5px}
.ag-sim[data-n="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:760px){.ag-sim[data-n="4"]{grid-template-columns:repeat(4,minmax(0,1fr))}.ag-sim[data-n="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* ---------- compare view ---------- */
.ag.is-cmp #ag-share{visibility:visible}
.cmp-top{text-align:center;padding:calc(var(--s7) + env(safe-area-inset-top)) 0 var(--s4)}
.cmp-top .kicker{margin:0 0 var(--s1);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim)}
.cmp-h{margin:0;font-size:40px;line-height:1;font-weight:680;letter-spacing:-.035em}
.cmp-head{position:sticky;top:52px;z-index:3;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:var(--s2);padding:var(--s2) 0;background:linear-gradient(var(--bg) 82%,rgba(var(--bg-rgb),0))}
.cmp-head:has(.cmp-add){grid-template-columns:repeat(calc(var(--n) + 1),minmax(0,1fr))}
.cmp-col{position:relative;min-width:0;border-radius:var(--r-lg);background:rgba(var(--fg-rgb),.035);box-shadow:0 0 0 1px var(--line) inset}
.cmp-open{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;padding:var(--s4) var(--s1) var(--s3);border:0;background:none;color:var(--fg);text-align:center;transition:transform .35s var(--spring)}
.cmp-open:active{transform:scale(.96)}
.cmp-open .logo{width:48px;height:48px;border-radius:14px}
.cmp-open b{font-size:14px;font-weight:650;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmp-open span{font-size:11.5px;color:var(--dim);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cmp-rm{position:absolute;top:6px;right:6px;z-index:2;width:24px;height:24px;border-radius:50%;border:0;background:rgba(var(--fg-rgb),.08);color:var(--mut);font-size:9px;display:grid;place-items:center}
.cmp-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:transparent;box-shadow:none;outline:1.5px dashed rgba(var(--fg-rgb),.18);outline-offset:-1.5px;color:var(--mut);font-size:13px;cursor:pointer}
.cmp-add b{font-weight:600}
.cmp-plus{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:rgba(var(--fg-rgb),.05)}
.cmp-add select{position:absolute;inset:0;width:100%;height:100%;opacity:0;font-size:16px;cursor:pointer}
.cmp-rows{display:grid;gap:0;margin-top:var(--s2)}
.cr{padding:var(--s4) 0;border-top:1px solid var(--line)}
.cr:first-child{border-top:0}
.cr-l{margin:0 0 var(--s3);font-size:11px;font-weight:650;letter-spacing:.1em;text-transform:uppercase;color:var(--dim);text-align:center}
.cr-c{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:var(--s2)}
.cmp-head:has(.cmp-add)~.cmp-rows .cr-c{grid-template-columns:repeat(calc(var(--n) + 1),minmax(0,1fr))}
.cc{min-width:0;display:flex;justify-content:center;text-align:center;font-size:13px;line-height:1.4;color:rgba(var(--fg-rgb),.88);overflow-wrap:anywhere}
.cc-na{color:var(--dim)}
.cc-pr{display:inline-flex;flex-direction:column;align-items:center;gap:2px}.cc-pr .ic{width:20px;height:20px}.cc-pr b{font-size:13px;color:var(--fg)}
.cc-pl,.cc-kf{margin:0;padding:0;list-style:none;display:grid;gap:6px;width:100%}
.cc-pl li{display:flex;flex-direction:column;padding:6px 4px;border-radius:10px;background:rgba(var(--fg-rgb),.035)}
.cc-pl li span{font-size:11.5px;color:var(--dim)}.cc-pl li b{font-size:13.5px;font-weight:650;font-variant-numeric:tabular-nums}.cc-pl li i{font-style:normal;font-weight:400;font-size:11px;color:var(--dim)}
.cc-kf li{font-size:12.5px;line-height:1.35;padding-bottom:6px;border-bottom:1px solid var(--line)}.cc-kf li:last-child{border-bottom:0}
.cc-y{display:inline-flex;align-items:center;gap:5px;color:#4ade80;font-weight:600}.cc-y .ic{width:15px;height:15px}
.cc-n{color:var(--mut)}
.cc-t{display:flex;flex-direction:column;gap:2px}.cc-t i{font-style:normal;font-size:11.5px;color:var(--dim)}
.cc-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}.cc-tags span{padding:3px 8px;border-radius:99px;background:rgba(var(--fg-rgb),.06);font-size:11.5px;line-height:1.3}
.cc-pf{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}.cc-pf span{display:inline-flex;align-items:center;gap:3px;height:24px;padding:0 7px;border-radius:99px;background:rgba(var(--fg-rgb),.06);font-size:11px}.cc-pf .ic{width:12px;height:12px}.cc-pf b{font-weight:550}
.cc-lks{display:flex;flex-wrap:wrap;justify-content:center;gap:4px}
.cc-lk{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:rgba(var(--fg-rgb),.06);box-shadow:0 0 0 1px var(--line) inset;color:var(--fg);transition:transform .35s var(--spring)}
.cc-lk:active{transform:scale(.9)}
.cmp-fine{text-align:center;margin-top:var(--s5)}
@media (min-width:760px){.cmp-h{font-size:52px}.cc{font-size:14px}.cr-l{text-align:left}}
/* ---------- magic: magnetic glow (all), tilt (fine pointers only), spring press ---------- */
.mg{position:relative;isolation:isolate;transition:transform .5s var(--ease),box-shadow .3s;will-change:auto}
.mg::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s;background:radial-gradient(160px circle at var(--mx,50%) var(--my,50%),rgba(var(--tint,255,90,54),.16),transparent 70%)}
.mg.mg-on::before{opacity:1}
.ag-tile.mg-on,.cmp-col.mg-on{box-shadow:0 0 0 1px rgba(var(--tint,255,90,54),.28) inset}
.ag-tile:active,.ag-mc:active{transform:scale(.97);transition:transform .2s var(--spring)}
/* ---------- shimmer skeleton while the logo sheets load ---------- */
.logo.sp::before{content:"";position:absolute;inset:0;border-radius:inherit;opacity:0;pointer-events:none;background:linear-gradient(100deg,#1a1a1d 30%,#2a2a2f 50%,#1a1a1d 70%) 0 0/250% 100%;transition:opacity .45s ease}
html.logos-loading:not(.logos-ready) .logo.sp::before{opacity:1;animation:pkShim 1.25s linear infinite}
@keyframes pkShim{from{background-position:120% 0}to{background-position:-130% 0}}
/* view transitions: list ↔ compare share the same calm crossfade */
html.ag-vt.ag-vt-open::view-transition-new(root){animation:pkVtIn .42s var(--ease) both}
@keyframes pkVtIn{from{opacity:0;transform:translateY(14px) scale(.99)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .act,.fbtn,.fdot,.apill,.fchip,.fs-card,.fs-scrim,.tray-go,.pk-toast,.ag-act,.ag-cw,.ag-cwb,.ag-sci,.cmp-open,.cc-lk,.mg,.mg::before,.logo.sp::before{transition:none!important;animation:none!important}
  .recent{animation:none}
  .mg::before{display:none}
}

/* v7 pass 2: one-row toolbar, single-line rows, tidy agent actions */
@media (max-width:420px){
  .keybtn .k-w{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .keybtn{padding:0 5px 0 7px;gap:2px}
  .opts{flex-wrap:nowrap}
  .seg button{padding-left:8px;padding-right:8px}
}
@media (max-width:759px){
  .grid.market .card>.chev{display:none}
  .grid.market .card .strip .mi:not(.il){width:22px}
  .grid.market .card .strip a.il{width:30px}
  .grid.market .card .strip{margin-left:-6px}
}
.ag-acts{grid-template-columns:repeat(2,minmax(0,1fr))}
.ag-act.cw{grid-column:1/-1;height:36px;background:transparent;box-shadow:none;color:var(--mut);font-weight:550}
.ag-act.cw .ic{width:15px;height:15px}
.ag-act.cw::after{content:"";width:7px;height:7px;margin-left:2px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .3s var(--ease)}
.ag-act.cw[aria-expanded="true"]{box-shadow:none;color:var(--fg)}
.ag-act.cw[aria-expanded="true"]::after{transform:rotate(-135deg) translateY(-1px)}
.ag-cw.open .ag-cwi{padding-top:var(--s1)}
.ag-cws span{white-space:nowrap}
html.has-tray .ag-body{padding-bottom:calc(112px + env(safe-area-inset-bottom))}
.cmp-head{background:var(--bg);box-shadow:0 1px 0 var(--line)}

.ag-via{margin:var(--s4) 0 calc(-1 * var(--s2));font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim);text-align:center}
.cc-via{display:block;width:100%;margin-bottom:4px;font-size:11px;color:var(--dim)}
.cc:has(.cc-via){flex-direction:column}


/* ===================== v7b: list sections as tile grids (no orphans) ===================== */
/* 6-track grid: phone = 2 columns (span 3), wide = 3 columns (span 2). A lone last tile spans the row; a last row of 2 in 3-col splits it in half. */
.ag-g{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:var(--s2)!important;margin:var(--s4) 0 0;padding:0;list-style:none}
p.ag-g{margin-top:0}
.ag-g>*{grid-column:span 3;min-width:0;overflow-wrap:anywhere;hyphens:auto}
.ag-g>:last-child:nth-child(odd){grid-column:1/-1}
.ag-feats.ag-g li{display:flex;align-items:flex-start;gap:var(--s2);padding:var(--s3) var(--s3) var(--s3) 30px;border-radius:var(--r-md);background:rgba(var(--fg-rgb),.035);box-shadow:0 0 0 1px var(--line) inset;font-size:13.5px;line-height:1.38;min-height:52px}
.ag-feats.ag-g li::before{left:13px;top:18px;width:7px;height:7px;box-shadow:0 0 0 3px rgba(var(--tint),.16)}
.ag-tags.ag-g .ag-tagc{display:flex;align-items:center;justify-content:flex-start;min-height:44px;height:100%;padding:var(--s2) var(--s3);border-radius:var(--r-md);font-size:13px;line-height:1.3;text-align:left}
.ag-tags.ag-g .ag-tagc.m{gap:6px}
.ag-tags.ag-g .ag-tagc.m .ic{flex:none}
.ag-priv.ag-g li{flex-direction:column;gap:var(--s2);padding:var(--s3);font-size:13px;line-height:1.4;box-shadow:0 0 0 1px var(--line) inset}
.ag-priv.ag-g li .ic{margin:0}
/* short items (integrations, models): 3 across on phone (12 tracks), 4 across wide */
.ag-g.ag-gs{grid-template-columns:repeat(12,minmax(0,1fr))!important;grid-auto-rows:1fr}
.ag-g.ag-gs>*{grid-column:span 4}
.ag-g.ag-gs>:last-child:nth-child(odd){grid-column:span 4}
.ag-g.ag-gs>:last-child:nth-child(3n+1){grid-column:1/-1}
.ag-g.ag-gs>:nth-last-child(2):nth-child(3n+1),.ag-g.ag-gs>:nth-last-child(2):nth-child(3n+1)+*{grid-column:span 6}
.ag-tags.ag-gs .ag-tagc{justify-content:center;text-align:center;padding:var(--s2)}
@media (min-width:640px){
  .ag-feats.ag-g{grid-template-columns:repeat(6,minmax(0,1fr))!important}
  .ag-g>*,.ag-g>:last-child:nth-child(odd){grid-column:span 2}
  .ag-g>:last-child:nth-child(3n+1){grid-column:1/-1}
  .ag-g>:nth-last-child(2):nth-child(3n+1),.ag-g>:nth-last-child(2):nth-child(3n+1)+*{grid-column:span 3}
  .ag-g.ag-gs>*,.ag-g.ag-gs>:last-child:nth-child(odd),.ag-g.ag-gs>:nth-last-child(2):nth-child(3n+1),.ag-g.ag-gs>:nth-last-child(2):nth-child(3n+1)+*,.ag-g.ag-gs>:last-child:nth-child(3n+1){grid-column:span 3}
  .ag-g.ag-gs>:last-child:nth-child(4n+1){grid-column:1/-1}
  .ag-g.ag-gs>:nth-last-child(2):nth-child(4n+1),.ag-g.ag-gs>:nth-last-child(2):nth-child(4n+1)+*{grid-column:span 6}
  .ag-g.ag-gs>:nth-last-child(3):nth-child(4n+1),.ag-g.ag-gs>:nth-last-child(3):nth-child(4n+1)~*{grid-column:span 4}
}

/* ---------- SEO pages (SEO-NOTES.md): cards, chips and agent links are real <a href> now; they keep the exact button look ---------- */
a.hit,a.feat,a.ag-mc,a.ag-step,a.chip,a.ag-chip{text-decoration:none;-webkit-tap-highlight-color:transparent;cursor:pointer}
a.feat{color:inherit}
a.chip{display:inline-flex;align-items:center;line-height:1}
.cat-head{padding:0 var(--pad);margin:20px 0 6px;max-width:44em}
.cat-head h1{margin:0;font-size:clamp(28px,6.4vw,44px);font-weight:600;letter-spacing:-.03em;line-height:1.06}
.cat-head h1 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--acc);letter-spacing:-.02em}
.cat-head p{margin:10px 0 0;color:var(--mut);font-size:15px;line-height:1.55}
.cat-head[hidden]{display:none}
/* reserve the grid before the script runs (layout shift): cards are pre-rendered, this keeps an empty grid from collapsing */
#grid:empty{min-height:100vh}

.pk-sprite{display:none!important}
.act.sv[aria-pressed="true"] .ic,.ag-act.sv[aria-pressed="true"] .ic{fill:currentColor}

/* SEO (SEO-NOTES.md): the directory's H1 keeps the lede's look; "How to choose" under a category's list; correction link */
h1.lede{font-weight:400}
.cat-how{padding:0 var(--pad);margin:34px 0 10px;max-width:44em}
.cat-how h2{margin:0 0 8px;font-size:20px;font-weight:600;letter-spacing:-.02em}
.cat-how h2 em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--acc)}
.cat-how p{margin:0;color:var(--mut);font-size:15px;line-height:1.6}
.cat-how a{color:var(--fg)}
.ag-fix a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(var(--acc-rgb),.5)}
.ag-cmpl span{white-space:normal}
