*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.6 var(--bf);}
a{color:var(--accent)}a:hover{text-decoration-thickness:2px}
img,svg{max-width:100%}
h1,h2,h3{font-family:var(--hf);line-height:1.15;margin:1.4em 0 .5em}h1{font-size:clamp(2rem,5vw,3.2rem);margin-top:.3em}h2{font-size:1.6rem}h3{font-size:1.2rem}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}.narrow{max-width:820px}
.skip{position:absolute;left:-999px}.skip:focus{left:10px;top:10px;background:var(--surface);padding:8px;z-index:9}
.muted{color:var(--muted)}.small{font-size:.85rem}.center{text-align:center}
.site-header{border-bottom:1px solid var(--line);background:var(--bg);position:sticky;top:0;z-index:5}
.hdr{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;font:700 1.15rem var(--hf);color:var(--text);text-decoration:none}.logo{width:34px;height:34px}
.site-header nav{display:flex;gap:4px;flex-wrap:wrap}.site-header nav a{color:var(--text);text-decoration:none;padding:6px 12px;border-radius:var(--r);font-size:.95rem}
.site-header nav a:hover,.site-header nav a[aria-current]{background:var(--surface);color:var(--accent)}
.btn{display:inline-block;background:var(--accent);color:var(--onaccent);padding:11px 20px;border-radius:var(--r);text-decoration:none;font-weight:700;border:2px solid var(--accent);cursor:pointer;font-size:1rem;font-family:inherit}
.btn.ghost{background:transparent;color:var(--accent)}.btn:hover{filter:brightness(1.08)}
.btn.amz{background:#ffb703;border-color:#ffb703;color:#111}
.hero{padding:48px 0 36px;border-bottom:1px solid var(--line)}.hero-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:32px;align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.8rem;color:var(--accent2);font-weight:700;margin:0}
.lede{font-size:1.2rem;color:var(--muted)}.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0 8px}.updated{font-size:.85rem;color:var(--muted)}
.hero-art svg{width:100%;height:auto;max-height:340px}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:40px;margin-top:20px}
.content{min-width:0;display:flex;flex-direction:column}
.sidebar .toc{position:sticky;top:84px;display:flex;flex-direction:column;gap:2px;background:var(--surface);padding:16px;border-radius:var(--r);border:1px solid var(--line);font-size:.92rem}
.toc a{color:var(--text);text-decoration:none;padding:3px 0}.toc a:hover{color:var(--accent)}
.notice{background:var(--surface);border-left:5px solid var(--accent2);padding:14px 18px;margin:20px 0;border-radius:var(--r)}
.intro{font-size:1.08rem}
.products{display:grid;gap:18px}
.product{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px}
.p-head{display:flex;gap:14px;align-items:flex-start}.rank{font:800 1.6rem var(--hf);color:var(--accent);min-width:2.2ch}
.product h3{margin:.1em 0 0}.best{margin:0;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--accent2);font-weight:700}.maker{margin:0;color:var(--muted);font-size:.9rem}
.price{font-weight:700;margin:.8em 0 .3em}.price small{font-weight:400;color:var(--muted)}.price.none{font-weight:400;color:var(--muted);font-style:italic}
.specs{list-style:none;padding:0;margin:10px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.specs li{background:var(--bg);border:1px solid var(--line);border-radius:calc(var(--r)/2);padding:6px 10px;font-size:.88rem}.specs span{display:block;color:var(--muted);font-size:.75rem}
.pc{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:.92rem}.pc ul{margin:.2em 0;padding-left:1.1em}
.how{font-size:.93rem;background:var(--bg);padding:8px 12px;border-radius:calc(var(--r)/2)}
.buy{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}.buy .btn{padding:8px 14px;font-size:.92rem}
.teaser{display:flex;gap:20px;align-items:center;justify-content:space-between;background:var(--surface);border:2px solid var(--accent);border-radius:var(--r);padding:20px 24px;margin:30px 0}.teaser h2{margin:0 0 .2em}.teaser p{margin:0}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r)}
table.compare{border-collapse:collapse;width:100%;font-size:.9rem;min-width:640px}.compare caption{text-align:left;padding:10px 12px;font-weight:700}
.compare th,.compare td{padding:9px 12px;border-top:1px solid var(--line);text-align:left;vertical-align:top}.compare thead th{background:var(--surface);cursor:pointer;white-space:nowrap}.compare thead th[aria-sort]::after{content:" ↕";color:var(--muted)}
.compare tbody th a{color:var(--text)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}.card{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;color:var(--text);text-decoration:none}.card h3{margin:0 0 .4em;font-size:1.05rem}.card p{margin:0;color:var(--muted);font-size:.92rem}.card .more{color:var(--accent);font-weight:700;font-size:.9rem}
details{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 16px;margin:8px 0}summary{cursor:pointer;font-weight:700}
.sources ol{font-size:.88rem;padding-left:1.4em}.cite a{text-decoration:none;font-size:.75em}
.ad{margin:24px auto;text-align:center;min-height:60px}.ad-label{display:block;font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.ad-off{border:1px dashed var(--line);border-radius:var(--r);padding:14px;color:var(--muted);font-size:.85rem;max-width:728px}
.crumbs{margin-top:20px;font-size:.9rem;color:var(--muted)}.crumbs a{color:var(--muted)}
.prose{max-width:760px}.prose li{margin:.3em 0}
.picker .q{border:1px solid var(--line);background:var(--surface);border-radius:var(--r);margin:0 0 14px;padding:14px 18px}.picker .q.missing{border-color:#e63946;box-shadow:0 0 0 2px #e6394640}
.picker legend{font-weight:700;font-family:var(--hf);padding:0 6px}.qn{display:inline-grid;place-items:center;width:1.7em;height:1.7em;border-radius:50%;background:var(--accent);color:var(--onaccent);margin-right:8px;font-size:.85rem}
.help{margin:.2em 0 .6em;font-size:.9rem;color:var(--muted)}.opts{display:flex;flex-wrap:wrap;gap:8px}
.opts label{display:flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--bg);padding:8px 12px;border-radius:var(--r);cursor:pointer;font-size:.95rem}
.opts input{accent-color:var(--accent)}.opts label:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.actions{display:flex;gap:12px;margin:18px 0}
.results .product{margin:14px 0}.results .why{margin:.4em 0;padding-left:1.1em;font-size:.93rem}.results .rk{font:800 .8rem var(--hf);text-transform:uppercase;letter-spacing:.1em;color:var(--accent2)}
.calc{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px}.calc label{display:block;margin:10px 0 4px;font-weight:700}.calc input,.calc select{font:inherit;padding:8px 10px;border-radius:calc(var(--r)/2);border:1px solid var(--line);background:var(--bg);color:var(--text);width:100%;max-width:360px}
.calc .grid2{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:4px 16px}.calc output,.calc .out{display:block;margin-top:16px;font-size:1.1rem;background:var(--bg);padding:14px;border-radius:var(--r);border:1px solid var(--line)}
.site-footer{margin-top:60px;border-top:1px solid var(--line);padding:24px 0;font-size:.88rem;color:var(--muted)}.site-footer a{color:var(--muted)}
.cookie{position:fixed;bottom:12px;left:12px;right:12px;max-width:720px;margin:auto;background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:var(--r);padding:14px 18px;box-shadow:0 10px 40px #0005;z-index:20;display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:.9rem}.cookie[hidden]{display:none}.cookie p{margin:0;flex:1 1 300px}.cookie button{font:inherit;background:var(--accent);color:var(--onaccent);border:0;padding:8px 14px;border-radius:var(--r);cursor:pointer;margin-right:6px}.cookie button.ghost{background:transparent;color:var(--accent);border:1px solid var(--accent)}
.art404 svg{max-width:280px}
@media (max-width:900px){.hero-grid,.layout{grid-template-columns:1fr}.sidebar{order:2}.hero-art{max-width:420px}.pc{grid-template-columns:1fr}.teaser{flex-direction:column;align-items:flex-start}}

/* ---------- variants ---------- */
/* road: robotaxi dashboard */
[data-v=road] h1,[data-v=road] h2{text-transform:uppercase;letter-spacing:.04em}
[data-v=road] .hero{background:linear-gradient(180deg,#000 0,var(--bg) 100%);border-bottom:6px solid var(--accent)}
[data-v=road] .product{display:grid;grid-template-columns:1fr;border-left:6px solid var(--accent)}
[data-v=road] .site-header{border-bottom:3px dashed var(--accent)}
/* topo: survey field-book */
[data-v=topo] body,[data-v=topo]{background-image:repeating-radial-gradient(circle at 80% -10%,transparent 0 38px,var(--line) 39px 40px);background-attachment:fixed}
[data-v=topo] .product{border-left:5px solid var(--accent2);border-radius:2px}
[data-v=topo] .products{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
[data-v=topo] h2{border-bottom:2px solid var(--accent);padding-bottom:.2em}
/* soft: friendly vacuum guide */
[data-v=soft] .hero-grid{grid-template-columns:1fr;text-align:center;justify-items:center}[data-v=soft] .hero-cta{justify-content:center}[data-v=soft] .hero-art{max-width:360px;order:-1}
[data-v=soft] .products{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}[data-v=soft] .product{box-shadow:0 8px 30px #6b5bd51a;border:0}
[data-v=soft] .layout{grid-template-columns:1fr}[data-v=soft] .sidebar .toc{position:static;flex-direction:row;flex-wrap:wrap;gap:6px 16px}
/* lawn: striped yard */
[data-v=lawn] .hero{background:repeating-linear-gradient(90deg,var(--surface) 0 60px,var(--bg) 60px 120px)}
[data-v=lawn] h1{font-weight:900}[data-v=lawn] .rank{background:var(--accent);color:var(--onaccent);border-radius:50%;width:2.2em;height:2.2em;display:grid;place-items:center;font-size:1rem}
[data-v=lawn] .product{border-top:6px solid var(--accent)}
/* aqua: pool */
[data-v=aqua] .hero{background:linear-gradient(160deg,var(--accent2) -40%,var(--bg) 60%);border:0}
[data-v=aqua] .product{background:linear-gradient(180deg,var(--surface),var(--bg));border-color:var(--accent2)}
[data-v=aqua] .site-header{backdrop-filter:blur(6px);background:color-mix(in srgb,var(--bg) 85%,transparent)}
/* mono: humanoid magazine */
[data-v=mono] h1{font-size:clamp(2.6rem,8vw,5.4rem);letter-spacing:-.03em;text-transform:uppercase;line-height:.95}
[data-v=mono] .hero{border-bottom:10px solid var(--text)}[data-v=mono] .product{border:2px solid var(--text);border-radius:0;box-shadow:8px 8px 0 var(--accent)}
[data-v=mono] .rank{font-size:3rem;line-height:1}[data-v=mono] .btn{border-radius:0;text-transform:uppercase;letter-spacing:.06em}
[data-v=mono] .products{grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:26px}
/* blueprint: mapping */
[data-v=blueprint]{background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:32px 32px}
[data-v=blueprint] .product,[data-v=blueprint] .toc,[data-v=blueprint] .teaser,[data-v=blueprint] .calc{border-style:dashed;border-width:2px}
[data-v=blueprint] h1,[data-v=blueprint] h2,[data-v=blueprint] h3{font-weight:600}[data-v=blueprint] .eyebrow::before{content:"// "}
/* cozy: home robots */
[data-v=cozy] .hero{background:var(--surface);border-radius:0 0 40px 40px;border:0}
[data-v=cozy] .layout{grid-template-columns:240px minmax(0,1fr)}[data-v=cozy] .sidebar{order:-1}
[data-v=cozy] .product{border-radius:22px;border-width:2px}[data-v=cozy] h2{font-style:italic}
@media (max-width:900px){[data-v=cozy] .layout{grid-template-columns:1fr}[data-v=cozy] .sidebar{order:2}}
/* b2b: delivery/business robots — table first */
[data-v=b2b] #compare{order:-1}[data-v=b2b] .intro{order:-2}
[data-v=b2b] .hero{padding:30px 0}[data-v=b2b] h1{font-size:clamp(1.8rem,4vw,2.6rem)}
[data-v=b2b] .product{border-radius:4px}[data-v=b2b] .products{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}
[data-v=b2b] .site-header{background:var(--text)}[data-v=b2b] .site-header a,[data-v=b2b] .brand{color:var(--bg)}
[data-v=b2b] .site-header nav a[aria-current],[data-v=b2b] .site-header nav a:hover{background:var(--accent);color:var(--onaccent)}