[hidden]{display:none!important}
/* Concept: an instrument, not a brochure. Scene → Who's your dog (instrument) → Three houses → Spec sheet → Four finishes → Customers' dogs → The honest part → Parts / Guides / Next. Every number comes from a record; every image routes to a model page; the dog you describe follows you through the page and into the URL. Type: Bricolage Grotesque (display, wdth 85) + Hanken Grotesk (body) + JetBrains Mono (read-outs, sparingly). Palette: bone paper, ink green-black, oxide blue, copper signal. */
:root{
  --paper:#FFFFFF; --paper2:#F4F2EE; --ink:#0F1A17; --ink2:#4E5A55; --rule:#CFC6B8;
  --copper:#B9622F; --oxide:#2E4B5E; --oxide2:#24404F; --walnut:#5A3A24; --oak:#C9A77A; --white:#F3F1EC; --black:#1B1B1B;
  --mono:'JetBrains Mono',ui-monospace,Menlo,monospace; --disp:'Inter Tight',system-ui,sans-serif; --body:'Inter',system-ui,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box;min-width:0}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.5;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--disp);font-weight:600;line-height:1.02;margin:0;letter-spacing:-.025em;text-wrap:balance} /* founder 20.10: FONT A, Inter Tight 600 */
h1{font-size:clamp(3rem,8.5vw,8.4rem);font-weight:600}
h2{font-size:clamp(2rem,4.6vw,4rem)}
h3{font-size:1.4rem;font-variation-settings:'opsz' 40,'wdth' 92}
p{margin:0}
.wrap{max-width:1440px;margin:0 auto;padding-inline:clamp(16px,3vw,48px)}
.mono{font-family:var(--mono);font-size:.74rem;letter-spacing:.06em;text-transform:uppercase}
.k{color:var(--copper)}
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:1rem 1.5rem;border-radius:999px;border:1px solid var(--ink);background:var(--ink);color:var(--paper);font:600 .92rem var(--body);text-decoration:none;cursor:pointer}
.btn.ghost{background:transparent;color:inherit;border-color:currentColor}
.btn.paper{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn.copper{background:var(--copper);border-color:var(--copper);color:#fff}
:focus-visible{outline:2px solid var(--copper);outline-offset:3px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.src{display:none}
body.debug .src{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.05em;text-transform:uppercase;color:var(--ink2);margin-top:.5rem}
[data-src]{position:relative}
body.debug [data-src]::after{content:attr(data-src);position:absolute;top:6px;left:6px;font:500 .62rem/1 var(--mono);letter-spacing:.04em;background:#FFF2DF;color:#7A4E12;border:1px solid var(--copper);padding:.3rem .45rem;border-radius:3px;z-index:40;max-width:calc(100% - 12px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.srcbar{position:fixed;right:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:90;display:flex;gap:.4rem;align-items:center;background:var(--ink);color:var(--paper);border-radius:999px;padding:.35rem .5rem .35rem .9rem;font:500 .72rem var(--mono);letter-spacing:.05em;text-transform:uppercase}
.srcbar button{border:1px solid rgba(255,255,255,.3);background:transparent;color:var(--paper);border-radius:999px;padding:.35rem .7rem;font:inherit;cursor:pointer}
/* strip + header */
.strip{background:var(--ink);color:var(--paper)}
.strip .wrap{display:flex;justify-content:space-between;gap:1.5rem;min-height:34px;align-items:center;font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase}
.strip b{color:#E7C7A8;font-weight:500}
.strip .r{display:flex;gap:1.5rem}
@media (max-width:900px){.strip .wrap{font-size:.66rem;padding-block:.35rem}.strip .r{display:none}}
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:60;background:color-mix(in srgb,var(--paper) 86%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--rule)}
.nav{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:2rem;min-height:76px}
.nav .logo img{height:54px;width:auto}
.nav ul{display:flex;gap:2.2rem;list-style:none;margin:0;padding:0;justify-content:center;font-weight:500;font-size:.95rem}
.nav ul a{text-decoration:none}
.nav{position:relative}.nav li{position:static}
.nav .tools{display:flex;gap:1.2rem;align-items:center;font-size:.9rem}
.burger{display:none;border:0;background:none;cursor:pointer;padding:.4rem;color:var(--ink)}
.burger svg{width:24px;height:24px}
.mdrawer{position:fixed;inset:0;background:var(--paper);z-index:100;display:none;flex-direction:column;padding:1rem clamp(16px,4vw,32px) 2rem;overflow:auto}
.mdrawer.on{display:flex}
.mdrawer .mtop{display:flex;justify-content:space-between;align-items:center;min-height:60px}
.mdrawer .mtop img{height:44px}
.mdrawer .mtop button{border:0;background:none;font:600 1.1rem var(--body);cursor:pointer}
.mdrawer nav a{display:block;padding:1rem 0;border-top:1px solid var(--rule);font:500 1.4rem var(--disp);text-decoration:none}
.mdrawer nav a small{display:block;font:400 .85rem var(--body);color:var(--ink2);margin-top:.2rem}
.mdrawer .sub{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;padding:.4rem 0 .9rem}.mdrawer .sub a{border:0;padding:0;font:500 .85rem var(--body)}.mdrawer .sub img{width:100%;aspect-ratio:4/3;object-fit:cover;margin-bottom:.3rem}
.mdrawer .mfoot{margin-top:auto;padding-top:1.4rem;font-size:.85rem;color:var(--ink2);display:grid;gap:.4rem}
.lightbox{position:fixed;inset:0;background:rgba(15,26,23,.94);z-index:110;display:none;align-items:center;justify-content:center;padding:1rem}
.lightbox.on{display:flex}
.lightbox img{max-width:100%;max-height:88vh;object-fit:contain}
.lightbox button{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.4);width:48px;height:48px;border-radius:50%;font-size:1.4rem;cursor:pointer}
.lightbox .lp{left:16px}.lightbox .ln{right:16px}.lightbox .lx{top:16px;right:16px;transform:none}
.lightbox .lcap{position:absolute;left:0;right:0;bottom:16px;text-align:center;color:#D9D2C6;font-size:.85rem}
.nav .tools a{text-decoration:none;display:inline-flex;gap:.35rem;align-items:center;min-width:44px;min-height:44px;justify-content:center}.tools .burger{min-width:44px;min-height:44px}
.nav .tools svg{width:20px;height:20px}
@media (max-width:1100px){.nav ul{display:none}.nav{grid-template-columns:auto 1fr auto}.burger{display:inline-flex}.nav .tools{gap:.8rem}} /* W0 22.10 (iPad landscape 1024): the menu wrapped onto two lines; the hamburger takes over below 1100 */
/* HERO */
.hero{position:relative;background:var(--ink);color:var(--paper);min-height:clamp(520px,52vw,780px);display:grid;grid-template-rows:1fr auto;overflow:hidden}
.hero .scene{position:absolute;inset:0}
.hero .scene img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s ease,transform 9s linear;transform:scale(1.06)}
.hero .scene img.on{opacity:1;transform:scale(1)}
.hero .scene::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,26,23,.74) 0%,rgba(15,26,23,.32) 30%,rgba(15,26,23,0) 42%),linear-gradient(0deg,rgba(15,26,23,.82) 0%,rgba(15,26,23,0) 40%)}
.hero.side-right .scene::after{background:linear-gradient(270deg,rgba(15,26,23,.74) 0%,rgba(15,26,23,.32) 30%,rgba(15,26,23,0) 42%),linear-gradient(0deg,rgba(15,26,23,.82) 0%,rgba(15,26,23,0) 40%)}
.hero .top{position:relative;z-index:2;padding-top:clamp(2.5rem,7vh,5rem);display:grid;grid-template-columns:minmax(0,33%);justify-content:start}.hero.side-right .top{justify-content:end}.hero .copy{max-width:34rem}
.hero .mono{color:#E7C7A8}
.hero h1{color:#fff;margin-top:.8rem;max-width:11ch;font-size:clamp(2.2rem,3.5vw,3.8rem)}
.hero .lede{color:#E6E1D7;font-size:clamp(.95rem,1.05vw,1.12rem);max-width:26rem;margin-top:1.1rem}
.hero .ctas{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.8rem}
.hero .ctas .ghost{border-color:#fff;color:#fff}
.hero .bottom{position:relative;z-index:2;display:grid;grid-template-columns:1fr auto;gap:1.4rem;align-items:end;padding-block:1.6rem}
.scenes{display:flex;gap:.6rem;flex-wrap:wrap}
.scenes button{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.32);color:#fff;border-radius:999px;padding:.55rem .9rem;font:500 .8rem var(--body);cursor:pointer;display:inline-flex;gap:.6rem;align-items:center}
.scenes button[aria-pressed="true"]{background:#fff;color:var(--ink)}
.scenes button i{font-style:normal;font-family:var(--mono);font-size:.68rem;opacity:.85}
.readout{display:grid;grid-template-columns:repeat(4,auto);gap:2rem;text-align:right;justify-content:end;font-family:var(--body);font-size:.82rem;color:#D9D2C6}
.readout a{text-decoration:none}
.readout b{display:block;font:600 clamp(2rem,3.2vw,3.2rem)/1 var(--disp);letter-spacing:-.03em;color:#fff;margin-bottom:.25rem}
@media (max-width:980px){.hero .top{grid-template-columns:minmax(0,100%)}.hero .scene::after,.hero.side-right .scene::after{background:linear-gradient(0deg,rgba(15,26,23,.92) 0%,rgba(15,26,23,.55) 45%,rgba(15,26,23,.1) 75%)}}
@media (max-width:600px){.hero h1{font-size:2.6rem}.hero .lede{font-size:.98rem;max-width:26rem}.hero .scenes{display:none}}
@media (max-width:900px){.hero .bottom{grid-template-columns:1fr}.readout{text-align:left;grid-template-columns:repeat(2,1fr);gap:.8rem;justify-content:start}.readout b{font-size:1.5rem}}
/* INSTRUMENT */
.inst{padding-block:clamp(3.5rem,8vh,6rem)}
.head2{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:end;margin-bottom:2rem}
.head2 p{color:var(--ink2);max-width:34rem;font-size:1.05rem}
@media (max-width:960px){.head2{grid-template-columns:1fr}}
.panel{background:var(--oxide);color:#F3EEE6;border-radius:28px;padding:clamp(1.2rem,2.5vw,2.2rem);display:grid;grid-template-columns:1.15fr .85fr;gap:2rem}
.panel .mono{color:#C9D8E0}
.msel{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:.8rem}
.msel button{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:.7rem;cursor:pointer;color:#fff;text-align:left;display:grid;gap:.5rem;font-family:var(--body)}
.msel button img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;opacity:.85}
.msel button[aria-pressed="true"]{border-color:#E7C7A8;background:rgba(231,199,168,.14)}
.msel button[aria-pressed="true"] img{opacity:1}
.msel b{font-family:var(--disp);font-weight:500;font-size:1.15rem;display:block}
.msel small{font-size:.78rem;color:#C9D8E0}
.weight{margin-top:1.4rem}
.weight label{display:flex;justify-content:space-between;align-items:baseline;font-size:.82rem;color:#C9D8E0}
.weight output{font:300 2.8rem/1 var(--disp);color:#fff;letter-spacing:-.02em;}
.weight input[type=range]{width:100%;margin:.6rem 0 .2rem;accent-color:var(--copper)}
.bands{display:grid;grid-template-columns:1fr 1fr 1fr;gap:4px;margin-top:.4rem}
.bands div{height:8px;border-radius:4px;background:rgba(255,255,255,.14)}
.bands div.on{background:var(--copper)}
.bands span{display:block;font-size:.74rem;color:#C9D8E0;margin-top:.4rem}
.name{margin-top:1.2rem;display:grid;grid-template-columns:1fr auto;gap:.6rem}
.name input{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.22);border-radius:999px;color:#fff;padding:.8rem 1.1rem;font:500 1rem var(--body)}
.name input::placeholder{color:#A9B9C2}
.verdict{background:var(--paper);color:var(--ink);border-radius:20px;padding:1.4rem;display:grid;gap:1rem;align-content:start}
.fitview{width:100%;height:auto;background:var(--paper2);border-radius:12px}
.verdict .big{font:300 clamp(1.7rem,2.8vw,2.4rem)/1.05 var(--disp);letter-spacing:-.02em;}
.spec{display:grid;grid-template-columns:1fr 1fr;gap:.35rem 1rem;font-size:.86rem;color:var(--ink2)}
.spec b{color:var(--ink);font-weight:600}
.verdict .warn{font-size:.84rem;color:var(--ink2);border-top:1px solid var(--rule);padding-top:.8rem}
.verdict .act{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}
.verdict .share{font-size:.84rem;text-decoration:underline;background:none;border:0;cursor:pointer;color:var(--ink2);font-family:var(--body)}
@media (max-width:960px){.panel{grid-template-columns:1fr}}
@media (max-width:560px){.msel{grid-template-columns:repeat(3,1fr);gap:.4rem}.msel button{padding:.4rem}.msel b{font-size:.9rem}.msel small{font-size:.66rem}}
/* THREE HOUSES */
.houses{padding-block:clamp(3rem,8vh,6rem) 0}
.hgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.house{position:relative;overflow:hidden;background:var(--paper2);min-height:640px;display:grid;align-items:end;color:#fff}
.house > a.cover{position:absolute;inset:0;z-index:1}
.house img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.house:hover img{transform:scale(1.03)}
.house::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,26,23,.92) 0%,rgba(15,26,23,.35) 45%,rgba(15,26,23,0) 70%);pointer-events:none}
.house .info{position:relative;z-index:2;padding:1.4rem;display:grid;gap:.7rem}
.house .n{font:500 clamp(2rem,3.4vw,3rem)/1 var(--disp);letter-spacing:-.02em;}
.house .n a{text-decoration:none}
.house .geo{font-size:.8rem;color:#E7C7A8}
.house .row{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap}
.house .price{font:300 1.7rem/1 var(--disp);}
.house .rate{font-size:.8rem;color:#D9D2C6;text-decoration:none}
.house .rate i{color:#E7C7A8;font-style:normal}
.fins{display:flex;gap:.5rem;align-items:center}
.fins button{width:24px;height:24px;border-radius:50%;border:2px solid rgba(255,255,255,.6);cursor:pointer;padding:0}
.fins button[aria-pressed="true"]{border-color:#fff;box-shadow:0 0 0 3px rgba(15,26,23,.7)}
.fins .lbl{font-size:.78rem;color:#D9D2C6;margin-left:.3rem}
.house .ship{font-size:.86rem;color:#E6E1D7}
.house .ship.rec{color:#CDE8C4}
@media (max-width:960px){.hgrid{grid-template-columns:1fr}.house{min-height:520px}}
/* SPEC SHEET */
.specsheet{padding-block:clamp(3.5rem,9vh,7rem)}
.specsheet .grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:start}
.specsheet .pin{position:sticky;top:calc(76px + env(safe-area-inset-top,0px) + 16px);overflow:hidden;aspect-ratio:4/5;max-width:100%;border-radius:4px}
.specsheet .pin img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
body.ready .specsheet .pin img{transition:opacity .7s}
.specsheet .pin img.on{opacity:1}
.sheet{border-top:1px solid var(--ink)}
.sheet .row{display:grid;grid-template-columns:56px 1fr;gap:1.2rem;padding:1.6rem 0;border-bottom:1px solid var(--rule)}
.sheet .row .no{font-family:var(--mono);font-size:.74rem;color:var(--copper);letter-spacing:.06em;padding-top:.4rem}
.sheet .row h3{font-size:clamp(1.4rem,2.2vw,2rem);font-weight:500;letter-spacing:-.02em}
.sheet .row p{color:var(--ink2);margin-top:.5rem;max-width:34rem}
.sheet .row ul{margin:.6rem 0 0;padding-left:1.1rem;display:grid;gap:.25rem;font-size:.95rem}
@media (max-width:960px){.specsheet .grid{grid-template-columns:1fr}.specsheet .pin{position:relative;top:auto;aspect-ratio:4/3}}
/* value strip */
.value{background:var(--paper2);padding-block:2.2rem}
.value .wrap{display:grid;grid-template-columns:auto 1fr;gap:2rem;align-items:center}
.value ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}
.value li{font-size:.9rem;color:var(--ink2);border-left:2px solid var(--copper);padding-left:.8rem}
.value li b{display:block;color:var(--ink);font-family:var(--disp);font-size:1.2rem;font-weight:500;font-variation-settings:'opsz' 40,'wdth' 90}
.value h3{font-size:clamp(1.3rem,2vw,1.8rem);max-width:12ch}
@media (max-width:960px){.value .wrap{grid-template-columns:1fr}.value ul{grid-template-columns:1fr 1fr}}
/* FINISHES */
.finishes{padding-block:clamp(3.5rem,9vh,7rem);transition:background .6s ease,color .6s ease;background:#3A2718 url(img/r/tex-walnut.ebc0b987-800.webp) center/280px repeat;color:#F3EEE6;position:relative}.finishes>.wrap{position:relative;z-index:1}.finishes::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.42),rgba(0,0,0,.12))}
.finishes[data-f="oak"]{background:#C9A878 url(img/r/tex-oak.c5dd6468-800.webp) center/280px repeat;color:var(--ink)}.finishes[data-f="oak"]::before{background:linear-gradient(90deg,rgba(255,255,255,.35),rgba(255,255,255,.1))}
.finishes[data-f="white"]{background:#F3F1EC url(img/r/tex-white.00c306db-800.webp) center/280px repeat;color:var(--ink)}.finishes[data-f="white"]::before{background:linear-gradient(90deg,rgba(255,255,255,.3),rgba(255,255,255,0))}
.finishes[data-f="black"]{background:#1B1B1B url(img/r/tex-black.eb78639f-800.webp) center/280px repeat;color:#F3EEE6}.finishes[data-f="black"]::before{background:linear-gradient(90deg,rgba(0,0,0,.2),rgba(0,0,0,0))}
.finishes .head{display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:end;margin-bottom:1.6rem}
.finishes .head p{max-width:34rem;opacity:.9}
.ftabs{display:flex;gap:.5rem;flex-wrap:wrap}
.ftabs button{border:1px solid currentColor;background:transparent;color:inherit;border-radius:999px;padding:.6rem 1rem;font:500 .85rem var(--body);cursor:pointer;display:inline-flex;gap:.5rem;align-items:center}
.ftabs button i{width:12px;height:12px;border-radius:50%;display:inline-block;border:1px solid rgba(0,0,0,.25)}
.ftabs button[aria-pressed="true"]{outline:2px solid currentColor;outline-offset:2px}
.fshot{position:relative;margin-inline:calc(-1 * clamp(16px,3vw,48px))}
.fshot img{width:100%;aspect-ratio:16/8;object-fit:cover}
.fshot .cap{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding:1.2rem clamp(16px,3vw,48px);background:linear-gradient(0deg,rgba(0,0,0,.62),transparent);color:#fff;font-size:.82rem}
.fshot .cap b{display:block;font:400 1.15rem/1.1 var(--disp);letter-spacing:-.01em;margin-bottom:.3rem}
@media (max-width:900px){.finishes .head{grid-template-columns:1fr}.fshot img{aspect-ratio:4/3;object-position:50% 58%}.fshot .cap{position:static;grid-template-columns:1fr;background:none;color:inherit;padding:1rem 0 0}}
/* CUSTOMERS' DOGS */
.homes{padding-block:clamp(3.5rem,9vh,7rem)}
.mosaic{display:grid;grid-template-columns:2fr 1fr;grid-auto-rows:300px;gap:1rem}
.mosaic a{position:relative;overflow:hidden;display:block;background:var(--paper2)}
.mosaic img{width:100%;height:100%;object-fit:cover;transition:transform .8s}
.mosaic a:hover img{transform:scale(1.03)}
.mosaic .tag{position:absolute;left:12px;bottom:12px;background:rgba(15,26,23,.8);color:#fff;font-size:.78rem;padding:.4rem .6rem}
.mosaic .big{grid-row:span 2}
@media (max-width:900px){.mosaic{grid-template-columns:1fr;grid-auto-rows:220px}.mosaic .big{grid-row:auto}}
.quotes{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;margin-top:1rem}
.q{border:1px solid var(--rule);padding:1.1rem;display:grid;gap:.8rem;background:#fff;align-content:space-between}
.q p{font-size:.95rem}
.q .who{display:flex;justify-content:space-between;gap:.5rem;font-size:.78rem;color:var(--ink2)}
.q .who a{color:var(--ink2)}
@media (max-width:1100px){.quotes{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.quotes{grid-template-columns:1fr}}
/* HONEST */
.order{background:var(--ink);color:var(--paper);padding-block:clamp(3.5rem,9vh,7rem)}
.order .grid{display:grid;grid-template-columns:1fr 1.4fr;gap:3rem;align-items:start}
.order .mono{color:#E7C7A8}
.order p.lede{color:#D9D2C6;font-size:1.05rem;max-width:30rem;margin-top:1rem}
.clock{margin-top:1.6rem;border:1px solid rgba(255,255,255,.18);padding:1.2rem;display:grid;gap:.3rem}
.clock small{font-size:.8rem;color:#D9D2C6}
.clock b{font:300 clamp(1.6rem,2.6vw,2.4rem)/1.05 var(--disp);letter-spacing:-.02em;}
.terms{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.14)}
.term{background:var(--ink);padding:1.3rem;display:grid;gap:.5rem;align-content:start}
.term b{font:400 1.45rem/1.1 var(--disp);letter-spacing:-.02em}
.term p{color:#D9D2C6;font-size:.9rem}
.term .src{color:#AFA69A}
@media (max-width:900px){.order .grid,.terms{grid-template-columns:1fr}}
/* TRIPLE */
.triple{padding-block:clamp(3.5rem,9vh,7rem)}
.tgrid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--rule);border:1px solid var(--rule)}
.triple > .wrap.tgrid{background:transparent;border:0;gap:1rem}.triple > .wrap.tgrid .tile{border:1px solid var(--rule)}
.tile{padding:1.6rem;background:var(--paper);display:grid;gap:.8rem;align-content:start;min-height:380px}
.tile h3{font-size:clamp(1.5rem,2.4vw,2.1rem);font-weight:500;letter-spacing:-.02em}
.tile p{color:var(--ink2)}
.tile ul{margin:0;padding-left:1.1rem;display:grid;gap:.3rem;font-size:.95rem}
.tile.dark{background:var(--oxide);color:#F3EEE6}
.tile.dark p{color:#D6DEE3}
.tile form{display:flex;gap:.5rem;margin-top:auto}
.tile input{flex:1;border:1px solid var(--rule);border-radius:999px;padding:.8rem 1rem;font:500 .95rem var(--body)}
.post{display:grid;gap:.3rem;text-decoration:none;padding:.8rem 0;border-top:1px solid var(--rule)}
.post small{font-size:.76rem;color:var(--ink2)}
.post b{font-weight:600}
@media (max-width:960px){.tgrid{grid-template-columns:1fr}}
/* FOOTER */
footer.site{border-top:1px solid var(--rule);padding-block:3rem 2rem;font-size:.9rem;color:var(--ink2)}
.fgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr;gap:1.4rem}
.fgrid b{display:block;color:var(--ink);font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;margin-bottom:.6rem}
.fgrid ul{list-style:none;margin:0;padding:0;display:grid;gap:.28rem}
.fgrid a{text-decoration:none}
.fgrid .flogo{height:56px;width:auto;margin-bottom:.6rem}
.claims{margin-top:2rem;padding-top:1rem;border-top:1px solid var(--rule);font-size:.78rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
@media (max-width:1024px){.fgrid{grid-template-columns:repeat(4,1fr);gap:1.4rem 1rem}.fgrid>div:first-child{grid-column:1/-1}}
@media (max-width:600px){.fgrid{grid-template-columns:1fr 1fr;gap:1.3rem 1rem}}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(70px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--paper);padding:.6rem 1rem;border-radius:999px;font-size:.85rem;z-index:95}

.bonewrap{display:grid;grid-template-columns:200px 1fr;gap:.8rem;align-items:center}.bonewrap small{font-size:.78rem;color:var(--ink2)}.bone{width:200px;height:auto}


/* quick buy on the home page: the listing's top half in an iframe */
.quick{border:1px solid var(--rule);border-radius:24px;overflow:hidden;background:#fff}.quick iframe{display:block;width:100%;height:1200px;border:0}

@media (min-width:981px){.hero{height:clamp(540px,50vw,760px);min-height:0} /* fixed frame height (hero180: the product box must stay whole); the column is shrunk on 981–1366 so the readout fits, see below */.hero .ctas{margin-top:1.3rem}}

.hero>.wrap{width:100%}
body.quick .pdp{padding-bottom:.4rem}

/* ---- reviews module (shared: home, /reviews; product page keeps its own copy) ---- */


/* reviews module (founder's ProductReviews, pdp variant) */
.rv{display:grid;gap:1rem}

.rv .eyebrow{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2)}

.rv h2{font-size:clamp(1.5rem,2.4vw,2.1rem)}

.rv .ai{font-size:.85rem;color:var(--ink2);display:flex;gap:.4rem;flex-wrap:wrap;align-items:center}
.rv .ai span{border:1px solid var(--rule);border-radius:999px;padding:.25rem .6rem;color:var(--ink)}


.score .big{font:300 3rem/1 var(--disp);letter-spacing:-.02em;display:flex;align-items:baseline;gap:.4rem}
.score .big i{color:#C9A062;font-style:normal;font-size:1.6rem}

.score .avglink{font-size:.82rem;color:var(--ink2)}
.score .avglink button{background:none;border:0;padding:0;text-decoration:underline;cursor:pointer;font:inherit;color:var(--ink)}


.rings>div{display:grid;justify-items:center;gap:.3rem;text-align:center}

.ring{width:58px;height:58px;border-radius:50%;border:2px solid #C9A062;display:grid;place-items:center;font:500 .95rem var(--body)}

.rings small{font-size:.64rem;color:var(--ink2);line-height:1.2}

.cat{display:flex;gap:.4rem;flex-wrap:wrap}
.cat button{border:1px solid var(--rule);background:#fff;border-radius:999px;padding:.4rem .8rem;font:500 .8rem var(--body);cursor:pointer}
.cat button[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}


.cards{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}

.card{border:1px solid var(--rule);border-radius:12px;padding:.9rem;display:grid;gap:.45rem;font-size:.9rem;background:#fff}

.card .top{display:flex;justify-content:space-between;gap:.5rem;align-items:center;flex-wrap:wrap}
.card .stars{color:#C9A062;letter-spacing:.05em;font-size:.85rem}
.card .nr{color:var(--ink2);font-size:.8rem}

.card .inc{font-size:12.5px;color:var(--ink2);margin:.15rem 0}
.card .bdg{font-size:.7rem;border:1px solid var(--rule);border-radius:999px;padding:.15rem .5rem;color:var(--ink2)}
.card .rec{font-size:.7rem;color:#2F6B3A;font-weight:600}

.card .var{font-size:.76rem;color:var(--ink2)}
.card .body{display:-webkit-box;-webkit-line-clamp:8;-webkit-box-orient:vertical;overflow:hidden}.card .body.open{display:block;-webkit-line-clamp:unset;overflow:visible}.card .more{border:0;background:none;padding:.15rem 0;margin-top:.1rem;color:var(--ink);font:600 .86rem var(--body);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.card .foot{font-size:.78rem;color:var(--ink2)}
.card .foot b{color:var(--ink)}


.rv .viewall{justify-self:center}

.rv .empty{color:var(--ink2);font-size:.9rem}


/* modal A: all reviews, slides in from the right */
.prm{position:fixed;inset:0;z-index:140;display:none}
.prm.on{display:block}

.prm .bd{position:absolute;inset:0;background:rgba(15,26,23,.5)}

.prm .panel{position:absolute;top:0;right:0;bottom:0;width:min(560px,100vw);background:#fff;color:var(--ink);overflow:auto;transform:translateX(20px);opacity:0;transition:transform .22s,opacity .22s;display:block}

.prm.on .panel{transform:none;opacity:1}

.prm .ph{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.2rem;border-bottom:1px solid var(--rule);position:sticky;top:0;background:#fff;z-index:2}
.prm .ph h3{font-size:1.2rem}
.prm .ph button{border:1px solid var(--rule);background:#fff;width:36px;height:36px;border-radius:50%;cursor:pointer}

.prm .in{padding:1rem 1.2rem;display:grid;grid-template-columns:minmax(0,1fr);gap:1rem;align-content:start}
.prm .in > *{min-width:0}

.prm .sum{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start}

.prm .sum .avg{font:300 2.2rem/1 var(--disp)}
.prm .sum .avg i{color:#C9A062;font-style:normal;font-size:1.3rem}
.prm .sum small{display:block;text-decoration:underline;color:var(--ink2);font-size:.8rem;margin-top:.3rem}

.dist{display:grid;gap:.3rem}
.dist button{display:grid;grid-template-columns:3.2rem 1fr 2.6rem;gap:.5rem;align-items:center;border:0;background:none;padding:.2rem .3rem;font:500 .8rem var(--body);cursor:pointer;border-radius:6px;text-align:left}
.dist button[aria-pressed="true"]{background:#FFF2DF}
.dist i{display:block;height:8px;background:var(--paper2);border-radius:4px;overflow:hidden;min-width:60px}
.dist i b{display:block;height:100%;background:#C9A062;min-width:2px}

.prm .grid5{display:grid;grid-template-columns:repeat(5,1fr);gap:.3rem}
.prm .grid5 button{border:0;padding:0;aspect-ratio:1/1;overflow:hidden;background:var(--paper2);cursor:zoom-in;position:relative}
.prm .grid5 img{width:100%;height:100%;object-fit:cover}
.prm .grid5 .more{position:absolute;inset:0;display:grid;place-items:center;background:rgba(15,26,23,.55);color:#fff;font-weight:600}

.prm .list{display:grid;grid-template-columns:minmax(0,1fr);gap:.9rem}

.pager{display:flex;gap:.3rem;justify-content:center;flex-wrap:wrap;padding-top:.5rem}
.pager button{border:1px solid var(--rule);background:#fff;border-radius:999px;min-width:34px;height:34px;padding:0 .6rem;cursor:pointer;font:500 .8rem var(--body)}
.pager button[aria-current="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}

/* modal B: media */
.prp{position:fixed;inset:0;z-index:150;background:rgba(15,26,23,.88);display:none;align-items:center;justify-content:center;padding:1rem}
.prp.on{display:flex}

.prp .shell{width:min(1200px,100%);max-height:720px;background:#fff;display:grid;grid-template-columns:1fr 360px;overflow:hidden;border-radius:12px}

.prp .stage{background:#000;position:relative;display:grid;place-items:center;min-height:420px}
.prp .stage img{max-width:100%;max-height:720px;object-fit:contain}

.prp .stage button{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.85);border:0;width:42px;height:42px;border-radius:50%;cursor:pointer;font-size:1.2rem}
.prp .stage .p{left:12px}
.prp .stage .n{right:12px}

.prp .side{padding:1.2rem;display:grid;gap:.6rem;align-content:start;font-size:.9rem;overflow:auto}

.prp .pi{border:1px solid var(--rule);border-radius:10px;padding:.7rem;display:grid;grid-template-columns:64px 1fr;gap:.6rem;align-items:center;font-size:.82rem}
.prp .pi img{width:64px;height:64px;object-fit:cover;border-radius:6px}

.cards.three{grid-template-columns:repeat(3,1fr)}.rvhome{padding-block:clamp(2.5rem,6vh,4.5rem);border-top:1px solid var(--rule)}.rv .card .bdg{text-decoration:none;justify-self:start}
@media (max-width:980px){.cards.three{grid-template-columns:1fr 1fr}}
@media (max-width:720px){.cards,.cards.three{grid-template-columns:1fr}.wall,.rv .wall,.rvhome .wall{grid-template-columns:repeat(2,1fr)}}
@media (max-width:900px){.prp .shell{grid-template-columns:1fr}.prp .stage{min-height:0;max-height:55vh}}
/* campaign slots (data-driven; see campaigns.js, slots.json) */
.cmp-ann{background:var(--copper);color:#fff;font:600 .82rem var(--body);text-align:center;padding:.55rem 1rem;letter-spacing:.01em}.cmp-ann a{color:#fff;text-decoration:underline;text-underline-offset:3px;margin-left:.4rem}
.cmp-band{background:var(--paper2);padding:3.2rem 0}.cmp-band .wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:2.4rem;align-items:center}.cmp-band h2{font:600 clamp(1.5rem,3vw,2.3rem)/1.1 var(--disp);margin:.5rem 0 .8rem}.cmp-band p{max-width:52ch;color:var(--ink2);margin-bottom:1.1rem}.cmp-band .art img,.cmp-band .ph{width:100%;aspect-ratio:2/1;object-fit:cover;border-radius:14px}.cmp-band .ph,.cmp-coll .ph{display:grid;place-items:center;background:repeating-linear-gradient(45deg,#E9E4DB 0 10px,#F4F2EE 10px 20px);color:var(--ink2);font:500 .8rem var(--mono);border:1px dashed var(--rule)}
.cmp-coll{display:grid;grid-template-columns:1fr 1.2fr;gap:1.6rem;align-items:center;border:1px solid var(--rule);border-radius:16px;padding:1.4rem 1.6rem;margin-bottom:2rem;background:#fff}.cmp-coll h3{font:600 1.35rem/1.15 var(--disp);margin:.4rem 0 .5rem}.cmp-coll p{color:var(--ink2);margin-bottom:.9rem}.cmp-coll img,.cmp-coll .ph{width:100%;aspect-ratio:3/1;object-fit:cover;border-radius:12px}
.cmp-note{border-left:3px solid var(--copper);background:var(--paper2);padding:.6rem .8rem;font:500 .84rem var(--body);border-radius:0 10px 10px 0;margin:.6rem 0}
.cmp-ugc{margin-bottom:2rem}.cmp-ugc .row{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.6rem}.cmp-ugc img{width:100%;aspect-ratio:1;object-fit:contain;background:var(--paper2);border-radius:12px} /* founder 18.10: no crop */
.buy .sale.cmp-info{background:var(--oxide);color:#fff}
@media (max-width:780px){.cmp-band .wrap,.cmp-coll{grid-template-columns:1fr}.cmp-band{padding:2.2rem 0}}

.rvform{border:1px solid var(--rule);border-radius:14px;padding:1.4rem;margin-top:2rem;max-width:720px}.rvform h3{font:600 1.3rem var(--disp);margin-bottom:.4rem}.rvform label.cb{display:grid;grid-template-columns:auto 1fr;gap:.6rem;align-items:start;font-size:.84rem;color:var(--ink2);margin:.8rem 0}.rvform input[type=text],.rvform textarea{width:100%;border:1px solid var(--rule);border-radius:10px;padding:.6rem .8rem;font:500 .95rem var(--body);margin:.3rem 0 .6rem}

/* founder 17.10: larger type on tablets and desktops */
@media (min-width:900px){body{font-size:17px}}@media (min-width:1300px){body{font-size:18px}}
.strip{font-size:.78rem}
.pricebox .off{background:var(--copper);color:#fff;font-weight:700;font-size:.9rem;padding:.2rem .55rem;border-radius:6px}
footer.site{background:var(--ink);color:#C9C4BA;border-top:0;padding-block:2.4rem 1.4rem}footer.site a{color:#F3F1EC}footer.site b{color:#fff}footer.site .foot{color:#8F8A82}
.house img{object-position:50% 62%}.house .kspec{font-size:.8rem;color:var(--ink2);margin:.35rem 0 .2rem;line-height:1.4}
.rvhome .card,.rv .card{font-size:1rem}.rvhome .card .body,.rv .card .body{font-size:18px;line-height:1.6}
@media (min-width:981px){.buy .chips button{font-size:.9rem}.buy .lab{font-size:.95rem}.buy .sizenote,.buy small{font-size:.86rem}}
.cmp-ann{background:var(--cmp-bar,var(--copper));color:var(--cmp-bar-text,#fff)}.cmp-ann a{color:var(--cmp-bar-text,#fff)}
/* founder 17.10 night: flat matte white and black (no wood grain), gentler crop; review photos large */
.finishes[data-f="white"]{background:radial-gradient(120% 90% at 30% 20%,#FBFAF7 0,#F1EEE8 55%,#E6E2DA 100%);color:var(--ink)}
.finishes[data-f="black"]{background:radial-gradient(120% 90% at 30% 20%,#2A2A2C 0,#1B1B1D 55%,#121214 100%);color:#F3EEE6}
.fshot img{aspect-ratio:3/2;object-fit:cover;object-position:50% 58%}
.rv .card .ph{margin:.6rem 0 .4rem}

/* model selector cards (founder 17.10: bigger, better) */
.mswitch{gap:.8rem;margin-bottom:.9rem}.mswitch a{padding:.55rem;border-radius:16px;gap:.25rem;transition:transform .25s ease,box-shadow .25s ease}.mswitch a:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(15,26,23,.12)}.mswitch a img{aspect-ratio:16/11;border-radius:12px}.mswitch a b{font-size:1.02rem;margin-top:.15rem}.mswitch a small{font-size:.78rem}.mswitch a .meta{display:flex;justify-content:space-between;align-items:center;font-size:.76rem;color:var(--ink2);margin-top:.1rem}.mswitch a .meta em{font-style:normal;color:#C9A062}.mswitch a .meta i{font-style:normal;font-weight:600;color:var(--ink)}
/* key facts under the gallery */
.galspec{display:grid;grid-template-columns:repeat(2,1fr);gap:.45rem .9rem;margin-top:1rem;padding:1rem 1.1rem;border:1px solid var(--rule);border-radius:14px;background:var(--paper2)}.galspec div{display:grid;gap:.1rem;font-size:.82rem}.galspec span{color:var(--ink2);font-size:.72rem;text-transform:uppercase;letter-spacing:.05em}.galspec b{font-weight:600}
@media (max-width:980px){.galspec{display:none}}
/* A+ content */
.aplus{padding-block:2.5rem;border-top:1px solid var(--rule)}.aplus .ap{display:grid;grid-template-columns:1fr 1fr;gap:2.2rem;align-items:center;margin-bottom:2.6rem}.aplus .ap img{width:100%;aspect-ratio:4/3;object-fit:contain;background:var(--paper2);border-radius:18px} /* founder 22.10: every image shows the whole product, no chopped edges */.aplus .ap h2{font:600 clamp(1.6rem,3vw,2.4rem)/1.1 var(--disp);margin:.5rem 0 .8rem}.aplus .ap h3{font:600 1.35rem/1.15 var(--disp);margin:.4rem 0 .6rem}.aplus .ap p,.aplus .ap li{color:var(--ink2);font-size:1rem;line-height:1.55}.aplus .ap ul{padding-left:1.1rem;margin:0}.aplus .ap li{margin:.25rem 0}
.aplus .zero{grid-template-columns:repeat(3,1fr);gap:1rem;background:var(--ink);color:var(--paper);border-radius:18px;padding:1.6rem}.aplus .zero div{display:grid;gap:.3rem}.aplus .zero b{font:600 1.3rem var(--disp)}.aplus .zero span{color:#C9C4BA;font-size:.9rem}
.aplus .feats{grid-template-columns:repeat(6,1fr);gap:.7rem}.aplus .feats div{display:grid;place-items:center;gap:.35rem;border:1px solid var(--rule);border-radius:14px;padding:.9rem .5rem;text-align:center}.aplus .feats i{font-style:normal;font-size:1.5rem}.aplus .feats b{font-size:.8rem;font-weight:600}
@media (max-width:780px){.aplus .ap{grid-template-columns:1fr;gap:1.2rem}.aplus .ap img{order:-1}.aplus .zero{grid-template-columns:1fr}.aplus .feats{grid-template-columns:repeat(3,1fr)}}
.mswitch a .meta{font-size:.78rem;gap:.4rem;flex-wrap:wrap}.mswitch a .meta em{font-size:.9rem}

.mswitch a img[src*="gabled"]{object-position:50% 92%} /* founder 18.10: crop the top, keep the feet, so the three cards line up */

/* reviews left, product info right (founder 17.10); on narrow screens the info comes first */
/* footer: white logo lines, newsletter, payment marks, policies (founder 18.10) */
footer.site .flogo{filter:brightness(0) invert(1);opacity:.95}
footer.site .news{margin-top:.8rem;max-width:22rem}footer.site .news label{display:grid;gap:.4rem;font-size:.84rem;color:#C9C4BA}footer.site .news .row{display:flex;gap:.4rem}footer.site .news input{flex:1;min-width:0;border:1px solid #3A3F3C;background:#141F1B;color:#fff;border-radius:999px;padding:.55rem .9rem;font:500 .9rem var(--body)}footer.site .news .btn{background:#fff;color:var(--ink);border:0;padding:.5rem 1rem}footer.site .news small{color:#8FBF9F}
footer.site .fbot{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;border-top:1px solid #2A2F2C;margin-top:1.4rem;padding-top:1rem}
footer.site .pay{display:flex;gap:.45rem;flex-wrap:wrap}footer.site .pm{display:inline-block;width:42px;height:26px;border-radius:5px;background:#fff;position:relative;overflow:hidden}
footer.site .pm::after{content:'';position:absolute;inset:0;background-position:center;background-repeat:no-repeat;background-size:30px}
footer.site .pm-visa::after{content:'VISA';font:800 .62rem/26px var(--body);color:#1A1F71;text-align:center}
footer.site .pm-mastercard::after{background:radial-gradient(circle at 15px 13px,#EB001B 0 7px,transparent 7.5px),radial-gradient(circle at 27px 13px,#F79E1B 0 7px,transparent 7.5px)}
footer.site .pm-amex{background:#2E77BC}footer.site .pm-amex::after{content:'AMEX';font:800 .58rem/26px var(--body);color:#fff;text-align:center}
footer.site .pm-discover::after{content:'DISCOVER';font:800 .42rem/26px var(--body);color:#231F20;text-align:center}
footer.site .pm-applepay{background:#000}footer.site .pm-applepay::after{content:' Pay';font:600 .64rem/26px var(--body);color:#fff;text-align:center}
footer.site .pm-googlepay::after{content:'G Pay';font:600 .64rem/26px var(--body);color:#3C4043;text-align:center}
footer.site .pm-link{background:#00D66F}footer.site .pm-link::after{content:'link';font:800 .66rem/26px var(--body);color:#011E0F;text-align:center}
footer.site .pol{display:flex;gap:1.1rem;flex-wrap:wrap;font-size:.8rem}footer.site .pol a{color:#C9C4BA;text-decoration:none}footer.site .pol a:hover{color:#fff}
footer.site .claims{margin-top:1rem;font-size:.76rem;color:#8F8A82}

.srcbar{display:none}body.devsrc .srcbar{display:flex}

/* critic pass (18.10): rings wrap, cards top-aligned, hero strip scrim, patent captions, selected card outline */
.cards,.rvhome .cards,.rv .cards{align-items:start}
.hero .bottom{background:linear-gradient(transparent,rgba(0,0,0,.38));padding-top:2.4rem}
.pat .cap small,.pat figcaption,.pat .mono{font-size:.72rem}
.mswitch a[aria-current="true"]{border-color:var(--rule);outline:2px solid var(--ink);outline-offset:-2px;box-shadow:none}
.galspec{grid-template-columns:repeat(3,1fr)}.galspec div:nth-child(7){grid-column:span 3}
.pricebox{display:flex;align-items:baseline;gap:.7rem;flex-wrap:wrap}
.bdg{white-space:nowrap}
.tile article .ph:empty{display:none}
@media (max-width:1100px){.rv .cards,.rvhome .cards{grid-template-columns:1fr}}
.buy .btn.primary,.buy .add{font-size:1.02rem}
/* guides: compact "in progress" cards, same anatomy as the published one */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;align-items:start}.post.soon{min-height:0;background:var(--paper2);border:1px dashed var(--rule)}.post.soon h3{font-size:1.1rem}.post.soon small{color:var(--copper);font-weight:600;letter-spacing:.05em;text-transform:uppercase;font-size:.7rem}
@media (max-width:780px){.posts{grid-template-columns:1fr}}


/* W10/founder 18.10: review photos as uploaded, no crop; natural ratio with a height cap, lightbox shows the original */

.cmp-ugc figure{margin:0;display:grid;gap:.25rem}.cmp-ugc small{font:500 .7rem var(--mono);color:var(--ink2)}
/* PDP customers' dogs: uniform 4:5 tiles, no spans (founder 18.10) */
/* media pool tiles: 4:5, caption + credit (founder 17.10: credit always) */
.mt-empty{grid-column:1/-1;border:1px dashed var(--rule);border-radius:12px;padding:1.2rem;color:var(--ink2);font-size:.9rem}
.filters .sep{width:1px;background:var(--rule);margin:0 .4rem;align-self:stretch}

/* ===== customer photos: one tile engine, two layouts (founder 18.10: uniform scale, no redirect, earlier wood version marked) ===== */
.ugc{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}
.phomes .ugc{grid-template-columns:repeat(5,1fr);gap:.7rem}
@media (max-width:980px){.ugc,.phomes .ugc{grid-template-columns:repeat(3,1fr)}}
@media (max-width:600px){.ugc,.phomes .ugc{grid-template-columns:repeat(2,1fr);gap:.5rem}}
.mt{position:relative;display:block;width:100%;overflow:hidden;border-radius:12px;background:var(--paper2);aspect-ratio:4/5;border:0;padding:0;cursor:zoom-in;text-align:left;font:inherit;color:inherit}
.mt img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease}.mt:hover img{transform:scale(1.03)}
.mt .cap{position:absolute;left:0;right:0;bottom:0;padding:1.6rem .7rem .6rem;background:linear-gradient(transparent,rgba(0,0,0,.6));color:#fff;display:grid;gap:.1rem;pointer-events:none}
.mt .cap b{font-size:.84rem;font-weight:600;line-height:1.25}.mt .cap small{font-family:var(--mono);font-size:.62rem;letter-spacing:.04em;opacity:.85}
.mt .era{position:absolute;left:.55rem;top:.55rem;font:600 .62rem/1 var(--mono);letter-spacing:.05em;text-transform:uppercase;background:rgba(255,255,255,.92);color:var(--ink);padding:.35rem .5rem;border-radius:999px;font-style:normal;pointer-events:none}
.mt.sq{aspect-ratio:1/1;border-radius:8px}.mt.sq .era{font-size:.55rem;padding:.28rem .4rem}
.mt-h{grid-column:1/-1;display:grid;gap:.25rem;padding:1.2rem 0 .3rem;border-top:1px solid var(--rule);margin-top:.6rem}.mt-h b{font:600 1.1rem/1.2 var(--disp)}.mt-h span{color:var(--ink2);font-size:.92rem;max-width:60ch}
.mt-empty{grid-column:1/-1;border:1px dashed var(--rule);border-radius:12px;padding:1.2rem;color:var(--ink2);font-size:.9rem}
/* review photo walls: square tiles from the media pool */
.wall{display:grid;grid-template-columns:repeat(4,1fr);gap:.45rem}.rvhome .wall{grid-template-columns:repeat(8,1fr)}
.wall:empty{display:none}
@media (max-width:980px){.rvhome .wall{grid-template-columns:repeat(4,1fr)}}
/* gallery viewer */
.mlb{position:fixed;inset:0;z-index:160;background:rgba(15,26,23,.9);display:none;align-items:center;justify-content:center;padding:max(1rem,env(safe-area-inset-top,0px)) 1rem max(1rem,env(safe-area-inset-bottom,0px))}
.mlb.on{display:flex}
.mlb .shell{position:relative;width:min(1180px,100%);max-height:100%;background:#fff;display:grid;grid-template-columns:minmax(0,1fr) 300px;overflow:hidden;border-radius:14px}
.mlb .stage{background:#111;position:relative;display:grid;place-items:center;min-height:360px;max-height:86vh}
.mlb .stage img{max-width:100%;max-height:86vh;object-fit:contain;display:block}
.mlb .stage button{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.9);border:0;width:42px;height:42px;border-radius:50%;cursor:pointer;font-size:1.3rem;line-height:1}.mlb .stage .p{left:12px}.mlb .stage .n{right:12px}.mlb .stage button:disabled{opacity:.3;cursor:default}
.mlb .x{position:absolute;right:10px;top:10px;z-index:2;border:1px solid var(--rule);background:#fff;width:36px;height:36px;border-radius:50%;cursor:pointer}
.mlb .side{padding:1.4rem 1.2rem;display:grid;gap:.55rem;align-content:start;font-size:.92rem;overflow:auto}
.mlb .side .cnt{font-family:var(--mono);font-size:.68rem;letter-spacing:.08em;color:var(--ink2)}.mlb .side h3{font:600 1.5rem/1.1 var(--disp)}.mlb .side .era{color:var(--ink2)}
.mlb .side .tags{display:flex;flex-wrap:wrap;gap:.35rem}.mlb .side .tags span{border:1px solid var(--rule);border-radius:999px;padding:.25rem .6rem;font-size:.78rem}
.mlb .side .meta{font-size:.8rem;color:var(--ink2)}.mlb .side .btn{justify-self:start;margin-top:.4rem}
@media (max-width:860px){.mlb{padding:0}.mlb .shell{grid-template-columns:1fr;height:100%;max-height:100%;border-radius:0}.mlb .stage{min-height:0;max-height:58vh}.mlb .stage img{max-height:58vh}.mlb .side{padding:1rem 1rem 1.4rem}}
.card .ttl{font-weight:600;margin:.2rem 0 .1rem}.card .reply{margin-top:.5rem;padding:.5rem .7rem;background:var(--paper2);border-radius:8px;font-size:.85rem;color:var(--ink2)}.card .reply b{color:var(--ink)}
/* four rings fit the narrow listing column */
@media (max-width:720px){.score{grid-template-columns:1fr}}
/* reviews v3: era segment, filter rows, show more, era tags (W10 spec, founder 18.10: no pager rows) */
.rv .seg{display:inline-flex;border:1px solid var(--rule);border-radius:999px;padding:.25rem;gap:.2rem;justify-self:start}.rv .seg button{border:0;background:none;border-radius:999px;padding:.5rem .9rem;font:500 .9rem var(--body);cursor:pointer;color:var(--ink2)}.rv .seg button[aria-selected="true"]{background:var(--ink);color:var(--paper)}.rv .seg small{opacity:.75}
.rv .filters{display:grid;gap:.5rem}.rv .rvFilt{display:none;justify-self:start}
.rv .incl{font-size:.8rem;color:var(--ink2);margin-top:.2rem}
.rv .more{justify-self:center;text-align:center;color:var(--ink2);font-size:.85rem}.rv .more .btn small{opacity:.7;margin-left:.3rem}
.card .era-tag{display:inline-block;font:500 .7rem var(--mono);letter-spacing:.03em;color:var(--ink2);background:var(--paper2);border-radius:6px;padding:.2rem .45rem;justify-self:start}
.card .ph.small{display:flex;gap:.4rem;flex-wrap:wrap}.card .ph.small img{width:112px;height:112px;object-fit:contain;background:var(--paper2);border-radius:8px;cursor:zoom-in} /* founder 20.10: Amazon-style thumbnails, tap opens the review viewer; no crop */.card .ph.small img:only-child{width:140px;height:140px}
.rv .viewall{justify-self:center}
@media (max-width:720px){.rv .rvFilt{display:inline-flex}.rv .filters{display:none;position:fixed;left:0;right:0;bottom:0;z-index:120;background:#fff;border-top:1px solid var(--rule);border-radius:18px 18px 0 0;padding:1rem 1rem calc(1rem + env(safe-area-inset-bottom,0px));max-height:70vh;overflow:auto;box-shadow:0 -12px 30px rgba(0,0,0,.15)}.rv .filters.open{display:grid}}

.card .ph{margin:.6rem 0 .4rem}
/* review link flow */
.rvform .rvnote{background:#EAF4EC;color:#2F6B3A;border-radius:12px;padding:.8rem 1rem;margin-bottom:.8rem;font-weight:500}.rvform form{display:grid;gap:.7rem;max-width:40rem}.rvform .removal summary{cursor:pointer;color:var(--ink2);font-size:.9rem}

/* ===== review score block (single definition) ===== */
.score{display:flex;flex-wrap:wrap;gap:.8rem 1.2rem;align-items:center;border:1px solid var(--rule);border-radius:14px;padding:1rem 1.2rem}.score>div:first-child{flex:0 0 auto}.score .rings{flex:1 1 230px}
.rings{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.3rem;justify-items:center}.rings>div{display:grid;justify-items:center;gap:.3rem;text-align:center}.rings .ring{width:50px;height:50px;font-size:.8rem}.rings small{font-size:.64rem;color:var(--ink2);line-height:1.2;white-space:normal}
@media (max-width:720px){.score{display:grid;grid-template-columns:1fr}}

.mt-more{grid-column:1/-1;text-align:center;margin-top:.9rem;color:var(--ink2);font-size:.85rem}.mt-more .btn small{opacity:.7;margin-left:.3rem}
.mlb .side .rvtext{font-size:.95rem;line-height:1.5;max-height:40vh;overflow:auto}
/* critic 18.10: masonry review cards (no row gaps beside tall photo cards), photos keep their own shape, filter rows collapse */
.cards,.cards.three{display:grid;grid-template-columns:repeat(var(--cols,2),minmax(0,1fr));gap:13px;align-items:start}.cards.cols-1{--cols:1}.cards.cols-2{--cols:2}.cards.cols-3{--cols:3}.cards .col{display:grid;gap:13px;align-content:start;min-width:0}.cards .card{margin:0}.cards .empty{grid-column:1/-1}

.rv .filters{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;align-items:center}.rv .filters .cat{display:inline-flex;flex-wrap:wrap;gap:.35rem}.rv .filters .cat:empty{display:none}
@media (max-width:720px){.rv .filters{display:none}.rv .filters.open{display:grid}}
/* listing A+ four-photo block: one grid, equal gutters */
.ap .four,.ap-four{display:grid;grid-template-columns:1fr 1fr;gap:12px}.ap .four img,.ap-four img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px}

/* review card type (founder/W10 18.10): 18 px body, 18 px stars; phone wall 2 across */
.card .body{font-size:18px;line-height:1.6}.card .stars{font-size:18px;letter-spacing:.05em}.card .ttl{font-size:18px}
@media (max-width:720px){.wall,.rv .wall,.rvhome .wall{grid-template-columns:repeat(2,1fr)!important;gap:.6rem}}
/* cart drawer: slides in from the left (founder 18.10) */
.cdr{position:fixed;inset:0;z-index:170;display:none}.cdr.on{display:block}.cdr-bd{position:absolute;inset:0;background:rgba(15,26,23,.45)}
.cdr-p{position:absolute;top:0;bottom:0;left:0;width:min(440px,92vw);background:var(--paper);display:grid;grid-template-rows:auto auto 1fr auto;box-shadow:12px 0 40px rgba(0,0,0,.2);transform:translateX(-100%);transition:transform .32s cubic-bezier(.2,.8,.2,1);padding-top:env(safe-area-inset-top,0px)}.cdr.on .cdr-p{transform:none}
.cdr-h{display:flex;align-items:center;gap:.6rem;padding:1rem 1.2rem;border-bottom:1px solid var(--rule)}.cdr-h b{font:600 1.25rem var(--disp)}.cdr-n{color:var(--ink2);font-size:.85rem;flex:1}.cdr-x{border:1px solid var(--rule);background:#fff;width:34px;height:34px;border-radius:50%;cursor:pointer}
.cdr-note{margin:.8rem 1.2rem 0;background:var(--paper2);border-left:3px solid var(--copper);padding:.55rem .8rem;font-size:.85rem}
.cdr-l{overflow:auto;padding:.4rem 1.2rem}.cdr-i{display:grid;grid-template-columns:72px 1fr auto;gap:.8rem;align-items:start;padding:.9rem 0;border-bottom:1px solid var(--rule)}.cdr-i img{width:72px;height:72px;object-fit:contain;object-position:center;background:var(--paper2);border-radius:8px} /* founder 18.10: cushion and cover thumbnails were cut in half */.cdr-i b{display:block;font-weight:600}.cdr-i small{display:block;color:var(--ink2);font-size:.8rem;margin-top:.15rem}.cdr-pr{font-family:var(--mono);font-size:.9rem}
.cdr-q{display:flex;align-items:center;gap:.4rem;margin-top:.5rem}.cdr-q button{border:1px solid var(--rule);background:#fff;width:26px;height:26px;border-radius:50%;cursor:pointer;font-size:.95rem;line-height:1}.cdr-q span{min-width:1.2rem;text-align:center;font-size:.9rem}.cdr-q .cdr-rm{width:auto;height:auto;border:0;background:none;color:var(--ink2);font-size:.78rem;text-decoration:underline;margin-left:.4rem;padding:0}
.cdr-empty{color:var(--ink2);padding:1.5rem 0}
.cdr-f{padding:1rem 1.2rem calc(1.2rem + env(safe-area-inset-bottom,0px));border-top:1px solid var(--rule);display:grid;gap:.6rem;background:var(--paper)}.cdr-sub{display:flex;justify-content:space-between;font:600 1.1rem var(--disp)}.cdr-hint{font-size:.8rem;color:var(--ink2)}.cdr-go{justify-content:center;font-size:1.05rem;padding:1rem}.cdr-keep{justify-content:center}.cdr-p{grid-template-rows:auto auto minmax(0,1fr) auto}.cdr-l{min-height:0}.cdr-f{align-self:end;align-content:start}.cdr-f .btn{height:3.25rem;min-height:0;max-height:3.25rem;padding-top:0;padding-bottom:0;align-self:start;width:100%;box-sizing:border-box} /* iPad Safari: the footer buttons stretched to the free grid space (founder 18.10 screenshot); fixed heights */.cdr-trust{font-size:.74rem;color:var(--ink2);text-align:center;line-height:1.4}
/* checkout: no distractions (founder 18.10) */
body.ck .nav,body.ck .strip,body.ck .cmp-ann,body.ck #cmpBand,body.ck .tools .burger,body.ck .tools a[href="cart.html"],body.ck .search{display:none!important}body.ck #site-footer .cols,body.ck #site-footer .news{display:none}
.ck-trust{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;font-size:.82rem;color:var(--ink2);margin:.6rem 0 1.2rem}.ck-trust span::before{content:'✓ ';color:#2F6B3A}
.sum .save{display:flex;justify-content:space-between;color:#9FE0B0;font-weight:600}.sum .cmp{background:rgba(255,255,255,.08);border-left:3px solid var(--copper);padding:.5rem .7rem;font-size:.85rem;border-radius:6px}

/* review Report form (W10 removal path) and perk lines */
.rvReport{margin-top:.4rem;font-size:.76rem}.rvReport a{color:var(--ink2);text-decoration:underline}.rvRep{display:grid;gap:.4rem;margin-top:.4rem;font-size:.8rem}.rvRep input,.rvRep textarea{font:inherit;padding:.4rem .5rem;border:1px solid var(--rule);border-radius:6px;width:100%}.rvRep .btn{padding:.4rem .7rem;font-size:.8rem;justify-self:start}.rvRepMsg{color:var(--ink2)}.perk small{display:block;color:var(--ink2);font-weight:400}.perk-badge{display:inline-block;margin-top:.4rem;font:600 .72rem var(--body);color:var(--copper);border:1px solid var(--copper);border-radius:999px;padding:.1rem .5rem}

.rv .rvbar{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}.rvSortLab{display:inline-flex;align-items:center;gap:.4rem;font:500 .85rem var(--body);color:var(--ink2)}.rvSortLab select{font:500 .9rem var(--body);color:var(--ink);background:#fff;border:1px solid var(--rule);border-radius:999px;padding:.45rem 2rem .45rem .9rem;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%230F1A17' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .8rem center;cursor:pointer}
.rv .topics{display:block}.rv .topics>button[data-tog]{border:1px solid var(--rule);background:#fff;border-radius:999px;padding:.45rem .9rem;font:500 .85rem var(--body);cursor:pointer}.rv .topics .tmenu{display:none;flex-wrap:wrap;gap:.35rem;margin-top:.5rem}.rv .topics.open .tmenu{display:flex}

/* social feed (founder 18.10): posts from our accounts; tiles open the post where it lives */
.sptabs{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1rem}.sptabs button{border:1px solid var(--rule);background:#fff;border-radius:999px;padding:.5rem .9rem;font:500 .85rem var(--body);cursor:pointer}.sptabs button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.spgrid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:260px;grid-auto-flow:dense;gap:.8rem;margin-bottom:1.2rem}.spgrid.home{grid-template-columns:repeat(6,1fr);grid-auto-rows:220px}
.sp-tile{position:relative;display:block;overflow:hidden;border-radius:12px;background:var(--paper2);text-decoration:none;color:#fff}.sp-tile.tall{grid-row:span 2}.sp-tile img,.sp-tile video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}.sp-tile:hover img,.sp-tile:hover video{transform:scale(1.03)}
.sp-tile .sp-kind{position:absolute;top:10px;right:10px;background:rgba(15,26,23,.75);color:#fff;font-style:normal;font-size:.8rem;width:28px;height:28px;border-radius:50%;display:grid;place-items:center}
.sp-tile .sp-cap{position:absolute;left:0;right:0;bottom:0;padding:1.6rem .7rem .6rem;background:linear-gradient(transparent,rgba(0,0,0,.65));display:grid;gap:.1rem;pointer-events:none}.sp-tile .sp-cap b{font-size:.8rem}.sp-tile .sp-cap small{font-size:.7rem;opacity:.85}.sp-tile .sp-cap em{font-style:normal;font-size:.76rem;line-height:1.3;opacity:.95}
.sp-more{text-align:center;margin:.4rem 0 1.4rem}.spnote{display:grid;gap:.3rem;margin-bottom:1rem}.spnote p{color:var(--ink2);font-size:.92rem;margin:0}
@media (max-width:980px){.spgrid,.spgrid.home{grid-template-columns:repeat(3,1fr);grid-auto-rows:200px}}@media (max-width:600px){.spgrid,.spgrid.home{grid-template-columns:repeat(2,1fr);grid-auto-rows:170px}}

.lightbox .lf{top:16px;right:76px;transform:none;font-size:1.2rem}.gal .main .fsb{position:absolute;right:.8rem;bottom:.8rem;z-index:3;width:44px;height:44px;border-radius:50%;border:1px solid var(--rule);background:rgba(255,255,255,.92);font-size:1.1rem;cursor:pointer}.mlb .stage .fs{position:absolute;right:12px;top:12px;transform:none;width:40px;height:40px;border-radius:50%;font-size:1.1rem;cursor:pointer;z-index:2}.lightbox:fullscreen,.lightbox:-webkit-full-screen{display:flex}.mlb:fullscreen,.mlb:-webkit-full-screen{display:flex} /* founder 18.10: full screen for photos, like the 3D view */
\n.cmpb{padding:4rem 0}.cmpb table{width:100%;border-collapse:collapse;font-size:.88rem}.cmpb th,.cmpb td{padding:.65rem .5rem;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}.cmpb th{font:500 .72rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}.cmpb tr.me td{background:var(--paper2);font-weight:600}.cmpb .diff{display:block;color:var(--ink2);font-weight:400;font-size:.8rem;margin-top:.15rem}.cmpb .note{font-size:.8rem;color:var(--ink2);margin-top:.7rem}.cmpb a{color:var(--ink)}@media (max-width:860px){.cmpb thead{display:none}.cmpb table,.cmpb tbody,.cmpb tr,.cmpb td{display:block}.cmpb tr{border-bottom:1px solid var(--rule);padding:.7rem 0}.cmpb td{border:0;padding:.12rem 0}.cmpb td[data-l]:not([data-l=Brand]):before{content:attr(data-l) ': ';color:var(--ink2)}} /* home compare block (W8 brands, W7: no brand images, dated) */\n
.cmpb td.src a,.cmpTbl a.src{font-size:.75rem;color:var(--ink2);text-decoration:underline;text-underline-offset:2px;white-space:nowrap}

.cmpb .tick{color:var(--copper,#B5612E);font-weight:700}

#cmpBrands{overflow-x:auto;-webkit-overflow-scrolling:touch}.cmpb table{font-size:.84rem;min-width:900px}@media (max-width:860px){.cmpb table{min-width:0}}

.crown{color:var(--copper,#B5612E);font-size:1.05em}.cmpb .legend{font-size:.78rem;color:var(--ink2);margin-top:.5rem}.cmpb .ckl{margin-bottom:2rem}.cmpb .cklhead{display:grid;grid-template-columns:1fr 1.2fr;gap:1rem;align-items:end;margin-bottom:.8rem}.cmpb .cklhead h3{font-size:clamp(1.4rem,2.4vw,2rem);margin:0;line-height:1.1}.cmpb .cklhead p{margin:0;color:var(--ink2);font-size:.9rem}.cmpb .ckl table{min-width:0}.cmpb .ckl td,.cmpb .ckl th{text-align:center}.cmpb .ckl td:first-child,.cmpb .ckl th:first-child{text-align:left}.cmpb .ckl td.ok{color:var(--copper,#B5612E);font-weight:700;font-size:1.1rem}.cmpb .ckl td.na{color:var(--ink2);font-size:.8rem}.cmpb .ckl td.tot{font-weight:600;white-space:nowrap}.cmpb .ckl tr.me td{background:var(--paper2)}@media (max-width:860px){.cmpb .cklhead{grid-template-columns:1fr}.cmpb .ckl td,.cmpb .ckl th{text-align:left}.cmpb .ckl td.no{display:none}.cmpb .ckl td.ok:before{content:attr(data-l) ' ';color:var(--ink);font-weight:500;font-size:.85rem}}

.cmpband{width:100%;border-collapse:collapse;font-size:.86rem;font-variant-numeric:tabular-nums}.cmpband th,.cmpband td{padding:.55rem .5rem;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}.cmpband th{font:500 .7rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}.cmpband tr.me td{background:var(--paper2)}.cmpband .dog{display:block;font-weight:400;font-size:.78rem;color:var(--ink2)}.cmpband td.num{white-space:nowrap}.cmpband td.vs{font-weight:600}.cmpband .bar{display:block;height:6px;margin-top:.35rem;background:var(--rule);border-radius:3px;min-width:110px}.cmpband .bar i{display:block;height:100%;background:var(--ink2);border-radius:3px}.cmpband tr.me .bar i{background:var(--copper,#B5612E)}.cmpband a.src{font-size:.75rem;color:var(--ink2)}
.cmpb .cmp-bands{display:block;margin-top:2.4rem}.cmpb .cmp-bands h3{font-size:clamp(1.4rem,2.4vw,2rem);margin:0 0 .4rem;line-height:1.1}.cmpb .crit,.cmpTbl .crit{color:var(--ink2);font-size:.9rem;max-width:80ch;margin:0 0 1rem}.cmpb .cmp-band{display:block;height:auto;margin-top:1.4rem;overflow-x:auto;background:none;border-radius:0}.cmpb .cmp-band h4{margin:0 0 .5rem;font-size:1rem}.cmpb .cmp-band h4 span{color:var(--ink2);font-weight:400;margin-left:.4rem}
@media (max-width:860px){.cmpband{min-width:560px}}

/* compare blocks (compare.html, PDP #roomier) */
.cmpsec{margin:3rem 0 1rem;padding:clamp(1rem,3vw,1.8rem);border:1px solid var(--rule);border-radius:16px;background:#fff;display:grid;gap:1.3rem}.cmpsec .secH{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:end}.cmpsec .secH h2{font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.05}.cmpsec .secH p{color:var(--ink2);margin:0}
.cmptabs{display:flex;gap:.4rem;flex-wrap:wrap}.cmptabs button{font:500 .85rem var(--body);border:1px solid var(--rule);background:#fff;color:var(--ink);border-radius:999px;padding:.45rem .9rem;cursor:pointer}.cmptabs button[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.cmpgrid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:1.5rem;align-items:start}.cmpdraw{border:1px solid var(--rule);border-radius:12px;padding:.9rem;display:grid;gap:.5rem;min-width:0}.cmpdraw .cap{font-size:.78rem;color:var(--ink2)}
svg.fp{width:100%;height:auto;display:block}.fp .wlo{fill:var(--paper2);stroke:var(--copper,#B5612E);stroke-width:2}.fp .c{fill:none;stroke:var(--ink2);stroke-width:1.2;stroke-dasharray:5 4}.fp .c.on{stroke:var(--copper,#B5612E);stroke-width:2.6;stroke-dasharray:none}.fp text{fill:var(--ink2);font:12px var(--body)}.fp .lbl{fill:var(--ink);font-weight:700}
.cmprank{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}.cmprank li{border:1px solid var(--rule);border-radius:10px;padding:.6rem .8rem;display:grid;grid-template-columns:1fr auto;gap:.1rem .6rem;cursor:pointer}.cmprank li:hover,.cmprank li.on{border-color:var(--copper,#B5612E)}.cmprank li.me{background:var(--paper2);border-color:var(--copper,#B5612E);cursor:default}.cmprank .nm{font-weight:600}.cmprank .pct{font-weight:700;text-align:right;white-space:nowrap}.cmprank .meta{grid-column:1/-1;font-size:.78rem;color:var(--ink2);font-variant-numeric:tabular-nums}.cmprank .bar{grid-column:1/-1;height:6px;background:var(--rule);border-radius:3px;overflow:hidden}.cmprank .bar i{display:block;height:100%;background:var(--ink2)}.cmprank .me .bar i{background:var(--copper,#B5612E)}.cmprank a.src{font-size:.72rem;color:var(--ink2);font-weight:400;margin-left:.3rem}
.cmpsix{display:grid;gap:.7rem;border-top:1px solid var(--rule);padding-top:1.2rem}.cmpsix h3{margin:0;font-size:1.3rem}.cmpsix .chips{display:flex;flex-wrap:wrap;gap:.45rem}.cmpsix .chip{border:1px solid var(--copper,#B5612E);color:var(--copper,#B5612E);border-radius:999px;padding:.3rem .75rem;font-size:.8rem;font-weight:600}.cmpsix details{border:1px solid var(--rule);border-radius:10px}.cmpsix summary{cursor:pointer;padding:.6rem .9rem;font-weight:600}.cmpsix .scroll{overflow-x:auto}.cmpsix table{border-collapse:collapse;width:100%;font-size:.8rem;font-variant-numeric:tabular-nums}.cmpsix th,.cmpsix td{padding:.5rem .6rem;border-top:1px solid var(--rule);text-align:center;white-space:nowrap}.cmpsix th:first-child,.cmpsix td:first-child{text-align:left}.cmpsix thead th{font:500 .66rem var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--ink2);white-space:normal;min-width:80px}.cmpsix tr.me td{background:var(--paper2);font-weight:600}.cmpsix .ok{color:var(--copper,#B5612E);font-weight:700}.cmpsix .na{color:var(--ink2);font-size:.7rem}.cmpsix a.src{color:var(--ink2);font-size:.7rem;margin-left:.3rem}
.cmpfoot{font-size:.76rem;color:var(--ink2);display:grid;gap:.25rem}.valline{font-size:.82rem;color:var(--ink);margin-top:.4rem;line-height:1.7}.valline span{display:inline-block;margin-right:.6rem;white-space:nowrap}.cmprank .pct small{display:block;font-weight:600;font-size:.78rem;color:var(--ink2)}.cmpjump{display:inline-block;margin-top:.3rem;font:600 .85rem var(--body);color:var(--copper,#B5612E);text-decoration:none;border-bottom:1px solid currentColor}
@media (max-width:760px){.cmpgrid,.cmpsec .secH{grid-template-columns:1fr}}
.cmpall{display:inline-block;margin-top:.6rem;font:600 .9rem var(--body);color:var(--copper,#B5612E);text-decoration:none;border-bottom:1px solid currentColor}.cmpsix .cklt,.cmpsix .dett{width:100%}.cmpsec .legend{font-size:.76rem;color:var(--ink2);margin:.5rem 0 0}.cmpsec .dett th,.cmpsec .dett td{text-align:left;white-space:normal;vertical-align:top}.cmpsec .dett td.src a{font-size:.75rem;color:var(--ink2)}.cmpsec .dett tr.me td{background:var(--paper2);font-weight:600}.cmpsec .dett .diff{display:block;color:var(--ink2);font-weight:400;font-size:.78rem}.cmpsec .dett .tick{color:var(--copper,#B5612E);font-weight:700}.cmpsec .scroll{overflow-x:auto}.cmpteaser{display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;align-items:center}.cmpteaser .figs{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.cmpteaser .fig b{display:block;font-size:clamp(1.8rem,3.4vw,2.8rem);line-height:1;font-weight:600}.cmpteaser .fig span{display:block;color:var(--ink2);font-size:.85rem;margin-top:.3rem}@media (max-width:860px){.cmpteaser{grid-template-columns:1fr}.cmpteaser .figs{grid-template-columns:1fr 1fr 1fr;gap:.6rem}}

.cmpsec.card{padding:clamp(1rem,3vw,1.6rem)}.cmpcard{display:grid;grid-template-columns:240px 1fr;gap:1.6rem;align-items:start}.cmpmini{display:grid;gap:.5rem}.cmpmini .fp.mini{width:100%;max-width:220px}.cmpmini .cap{font-size:.74rem;color:var(--ink2)}.cmptext h2{font-size:clamp(1.6rem,2.8vw,2.3rem);line-height:1.05;margin:.3rem 0 .2rem}.cmptext .set{font-family:inherit;font-weight:500;margin:0 0 .9rem;color:var(--ink)}.cmptext .rows{display:grid;gap:.45rem;margin-bottom:1rem}.cmptext .row{display:grid;grid-template-columns:auto auto 1fr;gap:.2rem .9rem;align-items:baseline;border-top:1px solid var(--rule);padding-top:.45rem}.cmptext .row b{font-size:clamp(1.3rem,2.4vw,1.8rem);line-height:1;color:var(--copper,#B5612E)}.cmptext .row .g{font-weight:600;white-space:nowrap}.cmptext .row .who{color:var(--ink2);font-size:.82rem}.cmptext .row a.src{font-size:.72rem;color:var(--ink2);margin-left:.3rem}.cmptext .six{margin:0 0 .5rem;font-size:.95rem}.cmptext .six a{color:var(--copper,#B5612E);font-weight:600;text-decoration:none;border-bottom:1px solid currentColor}.cmptext .fn{font-size:.72rem;color:var(--ink2);margin:0}@media (max-width:760px){.cmpcard{grid-template-columns:1fr}.cmpmini .fp.mini{max-width:200px}.cmptext .row{grid-template-columns:auto 1fr}.cmptext .row .who{grid-column:1/-1}}
/* gallery tiles: platform badge, video play mark, video cover (founder 19.10 customer gallery) */
.mt video{width:100%;height:100%;object-fit:cover;display:block;background:#111}
.mt .pf{position:absolute;right:.55rem;top:.55rem;font:600 .62rem/1 var(--mono);letter-spacing:.05em;text-transform:uppercase;background:rgba(15,26,23,.78);color:#fff;padding:.35rem .5rem;border-radius:999px;font-style:normal;pointer-events:none}
.mt .play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.9);color:var(--ink);display:grid;place-items:center;font-size:1.1rem;font-style:normal;padding-left:3px;pointer-events:none}
.mlb .stage video{max-width:100%;max-height:86vh;display:block;background:#000}

/* review lightbox (founder's ProductReviews, W10 19.10): the review beside its photos */
.mlb .side .rvhead{display:flex;gap:.6rem;align-items:center}.mlb .side .rvhead .av{width:38px;height:38px;border-radius:50%;background:var(--paper2);display:grid;place-items:center;font-weight:600}
.mlb .side .rvhead b{display:block}.mlb .side .rvhead .meta{display:block}
.mlb .side .rvstars{color:#C9A062;letter-spacing:.06em}.mlb .side .rvstars i{color:var(--rule);font-style:normal}
.mlb .side .rvbadges{display:flex;flex-wrap:wrap;gap:.35rem}.mlb .side .rvbadges span{border:1px solid var(--rule);border-radius:999px;padding:.2rem .55rem;font-size:.74rem;color:var(--ink2)}
.mlb .side .rvbadges:empty{display:none}.mlb .side .rvttl{font:600 1.05rem/1.25 var(--body)}
.mlb .side .rvreply{font-size:.85rem;background:var(--paper2);border-radius:10px;padding:.6rem .7rem}
.mlb .side .rvthumbs{display:flex;flex-wrap:wrap;gap:.35rem}.mlb .side .rvthumbs button{border:2px solid transparent;padding:0;border-radius:8px;overflow:hidden;width:54px;height:54px;background:var(--paper2);cursor:pointer}
.mlb .side .rvthumbs button[aria-pressed="true"]{border-color:var(--ink)}.mlb .side .rvthumbs img{width:100%;height:100%;object-fit:contain}
.mlb .side .rvbuy{border-top:1px solid var(--rule);padding-top:.7rem;display:grid;gap:.4rem}.mlb .side .rvbuy a{display:flex;gap:.6rem;align-items:center;color:inherit;text-decoration:none;font-weight:500}
.mlb .side .rvbuy img{width:56px;height:56px;object-fit:contain;background:var(--paper2);border-radius:8px}
@media (min-width:821px){.mlb .side .rvtext{max-height:38vh;overflow:auto}}
.card .ph img{cursor:zoom-in}
@media (max-width:860px){.mlb .shell{grid-template-rows:auto minmax(0,1fr)}.mlb .stage{height:auto;overflow:hidden}.mlb .stage img,.mlb .stage video{max-width:100%}.mlb .side{overflow:auto;min-height:0}.mlb .side .rvtext{max-height:none}} /* W10 20.10: the stage takes the photo's own height (capped by the 58vh rules), so nothing is cut */

/* home: the best of our feed (founder 19.10) */
.best{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin-bottom:1.2rem}.best .mt{aspect-ratio:4/5}@media (max-width:900px){.best{grid-template-columns:repeat(2,1fr);gap:.5rem}}

.mlb .stage iframe.emb{width:min(100%,420px);aspect-ratio:9/16;max-height:86vh;border:0;background:#000;display:block}

/* founder 20.10: phone hero = the house in frame on top, the copy below it (no overlay hiding the product) */
@media (max-width:700px){.hero{min-height:0;grid-template-rows:auto auto}.hero .scene{position:relative;inset:auto;height:78vw;min-height:280px}.hero .scene::after{background:linear-gradient(0deg,rgba(15,26,23,.35) 0%,rgba(15,26,23,0) 35%)}.hero .scene img{object-position:50% 55%!important}.hero .top{padding-top:1.4rem;padding-bottom:1.6rem;grid-template-columns:1fr}.hero h1{font-size:2rem;max-width:none}.hero .lede{font-size:.98rem;max-width:none}}
/* founder 20.10: viewer on phones: no full-screen button (pinch zoom does it), one big close, side panel scrolls; no hover animations on touch */
.mlb .stage .fs{top:auto;bottom:12px;right:12px}.mlb .x{z-index:3}.mlb .stage{touch-action:pan-y pinch-zoom}@media (max-width:700px){.mlb{padding:0}.mlb .shell{width:100%;height:100%;max-height:none;border-radius:0;grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr)}.mlb .stage{max-height:58vh;min-height:240px}.mlb .stage img,.mlb .stage video{max-height:58vh}.mlb .stage .fs{display:none}.mlb .side{overflow:auto;-webkit-overflow-scrolling:touch}.mlb .x{width:44px;height:44px;top:10px;right:10px;font-size:1.3rem}.mlb .stage button{width:44px;height:44px}}@media (hover:none){.mt img,.hc img,.sp-tile img{transition:none}.mt:hover img,.hc:hover img{transform:none}}

/* blog: photos from customers' homes (W9 picks, founder 20.10) */
.blogpix{margin:2.2rem 0 1rem}.blogpix .row{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem;margin-top:.6rem}.blogpix figure{margin:0}.blogpix img{width:100%;aspect-ratio:4/5;object-fit:contain;background:var(--paper2);border-radius:12px;display:block}.blogpix figcaption{font-size:.82rem;margin-top:.35rem}.blogpix figcaption small{display:block;color:var(--ink2);font:500 .68rem var(--mono)}@media (max-width:700px){.blogpix .row{grid-template-columns:repeat(2,1fr)}}

/* founder 20.10: phone header = menu button far left, logo beside it, account + cart right; search lives in the menu */
@media (max-width:900px){header.site .wrap.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.5rem}header.site .burger{justify-self:start;margin-left:-.4rem}header.site .logo{justify-self:center}header.site nav{display:none}header.site .tools{justify-self:end}header.site .tools a[aria-label=Search]{display:none}.mdrawer .sub{order:0;margin:.2rem 0 .6rem}.mdrawer nav{display:flex;flex-direction:column}.mdrawer .sub a{font:600 .9rem var(--body)}.mdrawer .sub img{border-radius:10px}}
/* Compare duel (W8 design 19.10, founder 20.10) */
.picks{display:flex;flex-wrap:wrap;gap:.45rem;margin:.9rem 0 1rem}.dchip{border:1px solid var(--rule);background:#fff;border-radius:999px;padding:.4rem .8rem;font:500 .85rem var(--body);cursor:pointer;display:inline-flex;gap:.45rem;align-items:baseline}.dchip span{color:var(--ink2);font:500 .78rem var(--mono)}.dchip span.np{font-style:italic}.dchip[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.dchip[aria-pressed="true"] span{color:#E6E1D7}.dchip.more{border-style:dashed}.dchip small{font-weight:400;color:var(--ink2)}.dchip[aria-pressed="true"] small{color:#E6E1D7}.dchip.near{border-color:#B5612E}.dchip.near span{color:#B5612E}
.dcard{border:1px solid var(--rule);border-radius:16px;background:#fff;padding:1.2rem 1.4rem;display:grid;gap:1rem}
.dstage{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:stretch;min-height:300px;padding-bottom:12px}.dside{display:grid;grid-template-rows:auto 1fr;gap:.5rem;align-items:end;justify-items:center;min-width:0}.dpic{width:100%;display:flex;align-items:flex-end;justify-content:center;min-height:240px}.dpic img{height:auto;display:block}.rpic img{opacity:.92}
.dfloor{position:absolute;left:0;right:0;bottom:10px;border-bottom:2px solid var(--ink)}.tag{display:inline-flex;align-items:center;gap:.4rem;font:600 .8rem var(--body);padding:.3rem .65rem;border-radius:999px;justify-self:start}.tag .dot{width:.55rem;height:.55rem;border-radius:50%;display:inline-block}.tag.wlo{background:#E6F2E9;color:#1E5631}.tag.wlo .dot{background:#2E8B57}.tag.riv{background:#EEECE8;color:#4E5A55}.tag.riv .dot{background:#8A949B}
.ddims{display:grid;grid-template-columns:1fr 1fr;gap:1rem;font:500 .78rem var(--mono);color:var(--ink2);text-align:center}
.dprice{display:grid;grid-template-columns:1fr 1fr;gap:1rem;align-items:start;border-top:1px solid var(--rule);padding-top:.9rem}.dprice .p-big{font:600 clamp(1.6rem,3vw,2.2rem)/1 var(--disp)}.dprice .wlo .p-big{color:var(--copper,#B5612E)}.dprice .was{font-size:.6em;color:var(--ink2);text-decoration:line-through;margin-left:.3rem;font-weight:500}.dprice .p-small{font-size:.82rem;color:var(--ink2);margin-top:.35rem}.dprice .riv{text-align:right}
.dverdict{font:600 1.15rem/1.3 var(--disp)}.dverdict em{font-style:normal;color:#1E5631}.dverdict.neg em{color:var(--copper,#B5612E)}
.dtable{width:100%;border-collapse:collapse;font-size:.92rem}.dtable th{text-align:left;font:500 .72rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);padding:.6rem .6rem .6rem 0;width:7.5rem;vertical-align:top;border-top:1px solid var(--rule)}.dtable td{padding:.6rem .4rem;border-top:1px solid var(--rule);vertical-align:top}.dtable .ic{display:inline-block;width:1.2rem;font-weight:700}.dtable .ok{color:#1E5631}.dtable .bad{color:#9B2C2C}.dtable .neu{color:var(--ink2)}.dtable .blank{color:transparent}
.dwhy{border-radius:12px;padding:.9rem 1.1rem}.dwhy.pink{background:#FBECEA}.dwhy.good{background:#E9F4EC}.dwhy h4{font:600 1.05rem var(--disp);margin-bottom:.4rem}.dwhy ul{margin:0;padding-left:1.1rem;color:var(--ink2);font-size:.92rem;display:grid;gap:.25rem}
.dfoot{font:500 .72rem var(--mono);color:var(--ink2)}
@media (max-width:700px){.dstage{min-height:200px}.dpic{min-height:150px}.dtable,.dtable tbody{display:block}.dtable tr{display:grid;grid-template-columns:1fr 1fr;gap:0 .6rem;border-top:1px solid var(--rule);padding:.5rem 0}.dtable th{grid-column:1/-1;border:0;width:auto;padding:0 0 .2rem}.dtable td{border:0;padding:0;font-size:.84rem}.dprice .p-big{font-size:1.5rem}.dverdict{font-size:1.05rem}.picks{gap:.35rem}.dchip{padding:.35rem .65rem;font-size:.8rem}}
/* home: Same size. Very different crate. */
.hcmp .wrap{display:grid;grid-template-columns:1fr 1.25fr;gap:2.5rem;align-items:center}.hcmp .stats{display:flex;gap:1.4rem;margin-top:1.4rem;flex-wrap:wrap}.hcmp .stat b{display:block;font:600 1.6rem/1 var(--disp)}.hcmp .stat span{font-size:.8rem;color:var(--ink2)}
.hcmp .lineup{position:relative;display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem;align-items:end;padding-bottom:10px;min-height:220px}.hcmp .lineup .it{display:flex;justify-content:center;align-items:flex-end}.hcmp .lineup img{max-height:220px;height:auto}.hcmp .lineup .riv img{opacity:.85}.hcmp .base{position:absolute;left:0;right:0;bottom:8px;border-bottom:2px solid var(--ink)}
.hcmp .cap{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem;margin-top:1rem}.hcmp .c{border:1px solid var(--rule);border-radius:12px;padding:.8rem .9rem;background:#fff}.hcmp .c .n{font:600 .9rem var(--body)}.hcmp .c .pr{font:600 1.3rem/1.1 var(--disp);margin:.2rem 0 .4rem}.hcmp .c.w .pr{color:var(--copper,#B5612E)}.hcmp .c ul{list-style:none;margin:0;padding:0;font-size:.8rem;color:var(--ink2);display:grid;gap:.15rem}.hcmp .c i{font-style:normal;font-weight:700;margin-right:.3rem}.hcmp .c.w i{color:#1E5631}.hcmp .c.r i{color:#9B2C2C}.hcmp .note{font:500 .72rem var(--mono);color:var(--ink2);margin-top:.6rem}
@media (max-width:900px){.hcmp .wrap{grid-template-columns:1fr}.hcmp .lineup{min-height:120px}.hcmp .lineup img{max-height:150px}.hcmp .cap{gap:.5rem}.hcmp .c{padding:.6rem}.hcmp .c ul{font-size:.72rem}}
/* 20.10 W0 critique: name fee visible (not grey); campaign-styled add to cart; home compare button contrast */
#nameFee{color:var(--ink)!important;font-weight:600}
html[data-season] .buy #add{background:var(--copper);border-color:var(--copper);color:#fff}
.hcmp .btn{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* live counters (W8 20.10): calm, green dot, no blinking */
.lv{display:inline-flex;align-items:center;gap:.4rem;font-size:.82rem;color:var(--ink2);margin-right:.9rem}.lvdot{width:.5rem;height:.5rem;border-radius:50%;background:#2E8B57;display:inline-block;flex:none}#carts{display:flex;flex-wrap:wrap;gap:.2rem .4rem}#carts[hidden]{display:none}
.lvtop{display:block;font:500 .66rem var(--mono);letter-spacing:.04em;text-transform:uppercase;color:#1E5631;margin-top:.15rem}
.cdr-live{padding:.6rem 0 0;border-top:1px solid var(--rule);margin-top:.6rem}

/* Compare picker 50/50 (founder 20.10 morning): WLO model + size left, rivals right, never mixed */
.dpick{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:.9rem 0 1rem;align-items:start}.dp-l,.dp-r{min-width:0;border:1px solid var(--rule);border-radius:14px;padding:.8rem .9rem;background:#fff}.dp-h{display:flex;align-items:center;gap:.4rem;font:500 .7rem var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-bottom:.6rem}.dp-h .dot{width:.5rem;height:.5rem;border-radius:50%;display:inline-block;background:#8A949B}.dp-l .dp-h .dot{background:#2E8B57}
.dp-l .mtabs{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 .6rem}.dp-l .cmptabs{display:grid;gap:.35rem}.dp-l .cmptabs button{text-align:left;display:flex;justify-content:space-between;gap:.5rem;align-items:baseline}.dp-l .cmptabs button small{font:500 .72rem var(--mono);color:var(--ink2)}.dp-l .cmptabs button[aria-selected="true"] small{color:#E6E1D7}
.dp-r .picks{margin:0;max-height:16rem;overflow:auto;-webkit-overflow-scrolling:touch;align-content:flex-start}
@media (max-width:700px){.dpick{gap:.5rem}.dp-l,.dp-r{padding:.6rem .55rem;border-radius:10px}.dp-l .mtabs button{padding:.35rem .6rem;font-size:.8rem}.dp-l .cmptabs button{padding:.35rem .55rem;font-size:.8rem;flex-direction:column;align-items:flex-start;gap:0}.dp-r .picks{max-height:19rem}.dchip{padding:.3rem .5rem;font-size:.76rem;gap:.3rem}.dchip small{display:none}.dchip span{font-size:.72rem}}
/* 20.10 v157: the review era segment (5 tabs) must wrap on phones; it pushed the page to 404 px */
@media (max-width:700px){#rvEra.seg,.rvpage .seg{flex-wrap:wrap;max-width:100%}#rvEra.seg button{flex:1 1 auto}}

/* 20.10 founder (phone): breathing room before the footer; the hero rating reads as "48" on the phone, give the point and the star room */
main+footer.site,.page+footer.site,footer.site{margin-top:2.5rem}body.quick footer.site{margin-top:0}
.hero .stats b,.hero .sp b{font-variant-numeric:tabular-nums}#hsAvgHero::after{content:' ★';font-size:.6em;color:var(--copper,#B5612E);vertical-align:.15em}
/* PDP gallery: fade between frames instead of a hard swap */
.main img{transition:opacity .18s ease}.main img.swap{opacity:0}

/* 20.10 founder (phone): review cards — 5 lines then Read more; three square thumbnails per row; slightly smaller type */
@media (max-width:700px){.card .body{-webkit-line-clamp:5;font-size:16px;line-height:1.5}.card .ph.small{gap:.4rem}.card .ph.small img{width:calc((100% - .8rem)/3);height:auto;aspect-ratio:1/1}.card .ttl{font-size:1rem}.card .foot{font-size:.84rem}}

/* 20.10 v158 (founder phone notes): PDP viewer buttons on phones; gallery badges on two lines; History tiles show the whole product; hero rating labelled */
@media (max-width:700px){.lightbox .lf{display:none}.lightbox .lx{width:44px;height:44px;top:10px;right:10px;font-size:1.3rem}.lightbox .lp,.lightbox .ln{width:44px;height:44px}} /* scoped: the bare .ln rule collapsed the account order lines (W0 23.10) */
@media (max-width:700px){.mt .era{top:2.2rem;left:.55rem;max-width:80%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
#hsCnt::before{content:'average · '}
.dchip.ref{border-style:dotted}.dchip small.g{font:500 .66rem var(--mono);color:var(--ink2);margin-left:.2rem}

/* W10 phone spec 20.10 (v158, CSS part): name and date first, stars right; no Recommends badge or long Etsy pill on the phone; 15 px text, 4 lines then Read more; first photo card-wide, the rest a 64 px strip */
@media (max-width:700px){.card{display:flex;flex-direction:column;gap:8px;padding:14px}.card>*{margin:0}.card .foot{order:-1;font-size:12.5px;color:var(--ink2)}.card .foot b{font-size:14px;color:var(--ink)}.card .top{order:0}.card .top .rec{font-size:11.5px}.card .top .bdg{font-size:12.5px;padding:.15rem .5rem}.card .ttl{font-size:15px;font-weight:600}.card .var,.card .era-tag{font-size:12.5px;color:var(--ink2)}.card .body{font-size:15px;line-height:1.5;-webkit-line-clamp:4}.card .more{font-size:14px}
.card .ph.small{display:flex;flex-wrap:wrap;gap:6px}.card .ph.small img{width:100%;height:auto;max-height:260px;aspect-ratio:auto;object-fit:contain}.card .ph.small img:not(:first-child){width:64px;height:64px;max-height:64px;aspect-ratio:1/1}.rv .cards,.rv .col{gap:10px}}

/* W10 20.10: the review viewer's side panel scrolls as one; its rows keep their content height, so the review text is never squeezed to one line (founder phone) */
.mlb .side{grid-auto-rows:max-content}
@media (max-width:860px){.mlb .side .rvtext{max-height:none;overflow:visible}}

/* W10 card markup CSS (20.10) */
/* W10 20.10 — CSS for W10-YORUM-KART-MARKUP.patch (put it after your ≤700 px card rules) */
.card .foot{display:flex;gap:.55rem;align-items:center}
.card .foot .av{width:32px;height:32px;border-radius:50%;background:var(--paper2);display:grid;place-items:center;font:600 13px var(--body);color:var(--ink);flex:none}
.card .foot .who{display:grid;line-height:1.25}
.card .foot .who small{font-size:12.5px;color:var(--ink2)}
.card .var .m-src{display:none}.card .var.only-src{display:none}
.card .ph.small .plus{display:none}
@media (max-width:700px){
  
  .card .ph.small img:nth-of-type(n+6){display:none}
  .card .ph.small .plus{display:grid;place-items:center;width:64px;height:64px;border-radius:8px;background:var(--paper2);font:600 14px var(--body);color:var(--ink);cursor:pointer}
}
/* the viewer's side (from W10-YORUM-UI-ILK-BOYA-VE-OKUMA.patch, the hunk that was rejected — exactly these two rules) */
.mlb .side{grid-auto-rows:max-content}
@media (max-width:860px){.mlb .side .rvtext{max-height:none;overflow:visible}}
/* 20.10 parity note (W0 item 8): the gallery spec grid stays desktop-only for now; on phones its rows overlapped inside the gallery column. The phone gets the same facts in the specs section (v159 task). */
/* W9 20.10 parts set (Apple style, #F5F5F7): the card ground matches the photo ground */
.part img{background:#F5F5F7}.part{background:#F5F5F7}.plist .part,.parts .part{border-color:var(--rule)}

/* PDP compare block in the duel look (20.10) */
.dcard2{display:grid;gap:1rem}.dcard2 .dhead h2{font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.05;margin:.3rem 0 .4rem}.dcard2 .set{color:var(--ink2);margin:0;max-width:60ch}
.dminis{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.dmini{border:1px solid var(--rule);border-radius:14px;padding:.8rem;background:#fff;display:grid;gap:.6rem}
.dstage2{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:.5rem;align-items:end;min-height:150px;padding-bottom:8px}.dstage2 .dp{display:flex;justify-content:center;align-items:flex-end}.dstage2 img{height:auto;display:block}.dstage2 .dp:last-of-type img{opacity:.9}.dstage2 .fl{position:absolute;left:0;right:0;bottom:6px;border-bottom:2px solid var(--ink)}
.dmini .dm{display:grid;gap:.15rem;font-size:.9rem}.dmini .dm b{font-size:.95rem}.dmini .pc{color:#1E5631;font-weight:600}.dmini .pr{color:var(--copper,#B5612E);font-weight:600}.dmini .src{font-size:.74rem;color:var(--ink2);text-decoration:underline;text-underline-offset:2px}
.dcard2 .six{font-size:.92rem;margin:0}.dcard2 .fn{font-size:.74rem;color:var(--ink2);margin:0}
@media (max-width:860px){.dminis{grid-template-columns:1fr}.dmini{grid-template-columns:1.1fr 1fr;align-items:center}.dstage2{min-height:120px}}

/* W0 20.10: house cards readable over the photo */
.house::after{background:linear-gradient(0deg,rgba(15,26,23,.97) 0%,rgba(15,26,23,.78) 38%,rgba(15,26,23,.25) 62%,rgba(15,26,23,0) 78%)}.house .kspec{color:#D9D4CA}.house .geo{color:#F0CFAE;font-weight:600}.house .price s{font-size:.8em;color:#C9C4BA;margin-left:.35rem;font-weight:500}

/* W0 20.10 v161 contrast: live-counter lines on dark cards and in the hero; the finish tag on the pressed pill */
.house .sp .lv,.hero .sp .lv,#lastOrder .lv{color:#E6E1D7}.house .sp .lv .lvdot,#lastOrder .lvdot{background:#5FD18A}#finSw button[aria-pressed="true"] .lvtop{color:#CFE8D6}.lvtop{font-size:.68rem;font-weight:600}
.dmini .pc.neu{color:var(--ink2);font-weight:500}
/* W0 20.10 control audit: viewer tap targets 44 px everywhere, close top-right, expand bottom-right */
.mlb .x{width:44px;height:44px;font-size:1.25rem}.mlb .p,.mlb .n{width:44px;height:44px}.mlb .fs{width:44px;height:44px}.fsb{width:44px;height:44px}#gp,#gn{width:44px;height:44px}
.mlb .stage .p,.mlb .stage .n,.mlb .stage .fs{width:44px;height:44px;line-height:44px}.mlb .shell .x{width:44px;height:44px}
/* W0 20.10 control audit: viewers always above the cookie bar and sticky bars; solid backdrop so the page never shows through */
.lightbox,.mlb{z-index:120!important}.lightbox{background:#0F1A17!important}
/* W0 20.10: PDP viewer arrows and close as solid white discs (no ghost circle over the photo); the viewer loops, so both arrows always act */
.lightbox button{background:rgba(255,255,255,.94)!important;color:var(--ink)!important;border:1px solid rgba(0,0,0,.08)!important;box-shadow:0 2px 10px rgba(0,0,0,.25)}
.dchip{flex-wrap:wrap;max-width:100%}.dchip b{white-space:normal}

/* W8 20.10 marketing layout audit */
.sbar{position:fixed;left:0;right:0;bottom:0;z-index:70;background:#fff;border-top:1px solid var(--rule);padding:.45rem .9rem calc(.55rem + env(safe-area-inset-bottom,0px));box-shadow:0 -6px 18px rgba(15,26,23,.08)}.sbar[hidden]{display:none}.sb-chip{font:600 .72rem var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--copper,#B5612E);margin-bottom:.25rem}.sb-row{display:flex;align-items:center;justify-content:space-between;gap:.8rem}.sb-txt{display:grid;min-width:0}.sb-txt b{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sb-txt span{font:600 1.05rem var(--disp)}.sb-txt s{font-size:.8em;color:var(--ink2);margin-left:.3rem;font-weight:500}.sbar .btn{padding:.7rem 1.1rem;white-space:nowrap}
body.has-sbar .ckbar{bottom:auto;top:0} /* never two bars at the bottom on a phone: the cookie bar moves up while the buy bar shows */
.complete{font-size:.86rem;color:var(--ink2);margin:.4rem 0 0}.complete .k{font-weight:600;color:var(--ink)}.complete a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}.complete i{font-style:normal;margin:0 .25rem}
@media (max-width:700px){main#top{display:flex;flex-direction:column}main#top>*{order:20}main#top>#hero{order:0}main#top>#houses{order:1}main#top>#cmpBand{order:2}main#top>#fit{order:3}main#top>#reviews-home{order:4}main#top>#reviews{order:5}main#top>#compare{order:6}main#top>#value{order:7}main#top>#craft{order:8}main#top>#finishes{order:9}main#top>#homes{order:10}main#top>#order{order:11}main#top>#parts{order:12}} /* W8 (2): money and proof first on phones */

/* W8 20.10 marketing: newsletter card, phone slide-up, cart cross-sell, compare shop button, blog cta */
.ncwrap{margin:1.6rem 0}.news.ncard{display:grid;gap:.5rem;border:1px solid var(--rule);border-radius:16px;padding:1.1rem 1.2rem;background:#fff;max-width:34rem}.news.ncard .nc-h{display:block;font:600 1.05rem var(--disp)}.news.ncard .nc-s{display:block;font-size:.82rem;color:var(--ink2)}.news.ncard .row{display:flex;gap:.5rem;margin-top:.5rem}.news.ncard input[type=email]{flex:1;min-width:0;border:1px solid var(--rule);border-radius:999px;padding:.65rem .9rem;font:500 .95rem var(--body)}.news.ncard .ok{font-size:.82rem;color:var(--ink2)}
.nslide{position:fixed;left:.6rem;right:.6rem;bottom:.6rem;z-index:80;transform:translateY(120%);transition:transform .35s ease;background:#fff;border-radius:16px;box-shadow:0 10px 30px rgba(15,26,23,.22);padding:.4rem}.nslide.on{transform:none}.nslide .nx{position:absolute;right:.5rem;top:.5rem;width:36px;height:36px;border-radius:50%;border:1px solid var(--rule);background:#fff;z-index:1}.nslide .news.ncard{border:0;max-width:none}body.has-sbar .nslide{bottom:5.6rem}
.cdr-xs{border-top:1px solid var(--rule);padding:.7rem 0 .2rem}.cdr-xh{font:600 .8rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);margin-bottom:.4rem}.cdr-xg{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem}.cdr-xg a{display:grid;gap:.2rem;text-decoration:none;color:var(--ink);font-size:.78rem;border:1px solid var(--rule);border-radius:10px;padding:.4rem;background:#F5F5F7}.cdr-xg img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;background:#F5F5F7}.cdr-xg b{font-size:.82rem}.cdr-save{color:#1E5631}
.dshop{margin:.2rem 0 .4rem;justify-self:start}
.blogcta{margin:2rem 0;border:1px solid var(--rule);border-radius:16px;padding:1.2rem 1.3rem;background:var(--paper2)}.blogcta h3{font:600 1.3rem var(--disp);margin:.3rem 0 .4rem}.blogcta p{color:var(--ink2);margin:0 0 .8rem;max-width:50ch}

/* v162 fixes after the critic pass */
body.has-nslide .ckbar{bottom:auto;top:0}
.cdr-xs{margin:0 1rem}.cdr-xg a{min-width:0}.cdr-xg img{aspect-ratio:1/1;object-fit:contain}

/* W0 20.10 v162: checklist readable on phones; tablet hero copy left-aligned */
.ck th .ab{display:none}.ck th .prod,.det th .prod{display:block;font-weight:400;color:var(--ink2);font-size:.78rem;margin-top:.1rem}
@media (max-width:900px){.cmpb table.ck{min-width:0;table-layout:fixed;width:100%;font-size:.74rem}.ck th .full{display:none}.ck th .ab{display:inline} /* W0 23.10 v204b audit: at 820 the full column names pushed the table past the edge; tablets take the phone layout */.ck th:first-child{width:30%}.ck th.c{padding:.4rem .1rem;font-size:.58rem;letter-spacing:0;text-align:center;line-height:1.1}.ck td.c{text-align:center;padding:.45rem .1rem}.ck .tot{width:3.2rem;font-size:.7rem;padding:.45rem .1rem}.ck th[scope=row]{padding:.45rem .2rem;font-size:.74rem}.ck th .prod{font-size:.62rem}.ck .src{display:none}}

/* founder 20.10: the tablet hero is the desktop hero (copy over the photo); only the phone stacks. The eyebrow gets a light tone so it reads on bright photos. */
@media (min-width:701px) and (max-width:1024px){.hero .k,.hero .copy .k,.hero .top .k{color:#F0CFAE!important}.hero .top{grid-template-columns:minmax(0,46%)}}
/* checklist fits 390 px: no horizontal scroll, six icon columns */
@media (max-width:700px){#cmpChecklist{overflow:visible}.cmpb table.ck{min-width:0!important;width:100%!important;table-layout:fixed}.ck th[scope=row],.ck th .prod{white-space:normal;word-break:break-word}.ck th[scope=row] b{font-size:.76rem}.ck th .prod{display:none}.ck th:first-child{width:27%}}

/* W0 20.10: the hero eyebrow reads on any photo: light colour, soft shadow, dark pill on tablets */
.hero .top .k{color:#F0CFAE;text-shadow:0 1px 6px rgba(15,26,23,.6)}
@media (min-width:701px) and (max-width:1024px){.hero .top .k{display:inline-block;background:rgba(15,26,23,.72);color:#F7E6D2!important;padding:.3rem .6rem;border-radius:6px;text-shadow:none}}
#heroK{color:#F0CFAE!important;text-shadow:0 1px 6px rgba(15,26,23,.6)}
@media (min-width:701px) and (max-width:1024px){#heroK{display:inline-block;background:rgba(15,26,23,.72);color:#F7E6D2!important;padding:.3rem .6rem;border-radius:6px;text-shadow:none}}

/* founder 20.10 (final, via W0): text never sits on the product. Tablets stack the hero like the phone; house cards put the photo on top and the text panel below it. */
@media (min-width:701px) and (max-width:1024px){.hero{min-height:0;height:auto;grid-template-rows:auto auto}.hero .scene{position:relative;inset:auto;height:56vw;min-height:320px}.hero .scene::after,.hero.side-left .scene::after,.hero.side-right .scene::after{background:linear-gradient(0deg,rgba(15,26,23,.35) 0%,rgba(15,26,23,0) 35%)!important}.hero .scene img{object-position:50% 55%!important;filter:none!important}.hero .top{padding-top:1.6rem;padding-bottom:1.6rem;grid-template-columns:minmax(0,80%)!important;justify-content:start!important}.hero h1{font-size:2.6rem}#heroK{display:inline;background:none;padding:0;color:#F0CFAE!important}}
.house{min-height:0;display:grid;grid-template-rows:auto auto;align-items:start;background:var(--ink)}.house img{position:static;inset:auto;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;display:block}.house::after{display:none}.house .info{padding:1.1rem 1.2rem 1.3rem}.house .kspec{color:#D9D4CA}.house .cover{position:absolute;inset:0}
/* W0 20.10 (v163): the hero's bottom row (model chips + stats) follows the copy side on desktop, so nothing sits on the crate */
@media (min-width:1025px){.hero .bottom{display:flex;flex-direction:column;align-items:flex-start;gap:.9rem}.hero.side-right .bottom{align-items:flex-end}.hero.side-right .readout{flex-direction:row-reverse}}
@media (min-width:1025px){.hero .bottom{max-width:44%}.hero.side-right .bottom{max-width:32%;margin-left:auto}.hero .bottom .scenes,.hero .bottom .readout{flex-wrap:wrap;row-gap:.5rem}.hero.side-right .bottom .scenes,.hero.side-right .bottom .readout{justify-content:flex-end}}
@media (min-width:1025px){.hero .bottom{margin-left:0;margin-right:auto}.hero.side-right .bottom{margin-left:auto;margin-right:0}}

/* W0 20.10 (v164): desktop hero stats = max 2 (rating, sold) in one row, numbers never wrap; dispatch and combinations hidden there; 'Last ordered' under the CTAs */
@media (min-width:1025px){.hero .readout{display:flex;flex-wrap:nowrap;gap:1.6rem;align-items:flex-end}.hero .readout>span:not(.sp){display:none}.hero .readout>*{white-space:nowrap}.hero .readout b{font-size:clamp(1.6rem,2.2vw,2.4rem);white-space:nowrap}.hero .readout .hero-sp b{display:block}.hero .readout a,.hero .readout .hero-sp{display:block}.hero .readout a span,.hero .readout .hero-sp>span{white-space:nowrap}
#lastOrder.under-cta{display:block;margin-top:.9rem;font-size:.84rem;white-space:nowrap}#lastOrder.under-cta .lv{color:#E6E1D7;margin:0}.hero.side-right .readout{flex-direction:row-reverse}.hero .bottom{row-gap:.6rem}}
@media (min-width:1025px) and (max-height:820px){.hero .top{padding-top:1.6rem}.hero h1{font-size:clamp(2rem,3vw,3rem)}.hero .bottom{padding-block:1rem}.hero .readout b{font-size:1.6rem}}
/* founder 20.10: FONT A (Inter Tight / Inter / JetBrains Mono); display weights that were 300 become 500 */
.hero h1,.readout b,.stat b,.dprice .p-big,.price{font-weight:600}
/* Font A settling: icon buttons (arrows, close, expand, quantity) use the body face so nothing falls back to Arial */
button,.arrow,.fsb,.lx,.lf,.lp,.ln,.qty button,.mlb .x,.mlb .p,.mlb .n,.mlb .fs{font-family:var(--body)}

/* Font A settling: page titles were sized for a 300-weight face; at 600 they cap lower */
main .phead h1,main .hd h1,.cpage h1{font-size:clamp(2.4rem,5.2vw,4.6rem)!important;letter-spacing:-.03em}

/* W0 20.10 v166 desktop hero: no seam (the bottom block carries no background of its own), numbers left-aligned with their labels, chips on one row */
@media (min-width:1025px){.hero .bottom{background:none!important;padding-top:1rem}.hero .readout{text-align:left}.hero.side-right .readout{text-align:right}.hero .readout b{text-align:inherit;margin-left:0}.hero .scenes button i{display:none}.hero .scenes button{padding:.45rem .8rem}.hero .bottom .scenes{flex-wrap:nowrap}}
@media (min-width:1600px){.hero .scenes button i{display:inline}}
/* Compare chips: one line each, smaller price on phones */
.dchip{flex-wrap:nowrap;white-space:nowrap}.dchip b{white-space:nowrap}@media (max-width:700px){.dchip span{font-size:.68rem}.dchip small.g{display:none}}
/* live status strip (footer, founder 20.10) */
.sysbar{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;padding:.9rem 0 .6rem;border-top:1px solid rgba(255,255,255,.12);font-family:var(--mono);font-size:.72rem;letter-spacing:.02em;color:#B9C1BD}
.sys-dots{display:inline-flex;gap:.42rem;align-items:center}
.sys-dot{width:9px;height:9px;border-radius:50%;background:#6B7571;display:inline-block;position:relative}
.sys-dot.ok{background:#2EB872;box-shadow:0 0 0 0 rgba(46,184,114,.55);animation:syspulse 2.4s ease-out infinite}
.sys-dot.slow{background:#E0A526}.sys-dot.down{background:#E04B3A;animation:sysblink 1s steps(2,start) infinite}.sys-dot.wait{background:#6B7571;opacity:.6}
.sys-sum{color:#E6E1D7}.sys-last{opacity:.85}
@keyframes syspulse{0%{box-shadow:0 0 0 0 rgba(46,184,114,.55)}70%{box-shadow:0 0 0 6px rgba(46,184,114,0)}100%{box-shadow:0 0 0 0 rgba(46,184,114,0)}}
@keyframes sysblink{to{opacity:.35}}
@media (prefers-reduced-motion:reduce){.sys-dot.ok,.sys-dot.down{animation:none}}
@media (max-width:700px){.sysbar{font-size:.68rem;gap:.4rem .8rem}}
/* v169 CWV + founder device notes (20.10) */
.ckbar{bottom:auto;top:0} /* the cookie bar never moves (it sat at the bottom first, then jumped up when a bar appeared: layout shift) */
.hero .scene img{transition:opacity .38s ease;z-index:0}.hero .scene img.on{z-index:2}.hero .scene img.was{opacity:1;z-index:1} /* clean crossfade: the outgoing frame stays opaque under the incoming one, two houses never ghost through each other */
@media (max-width:700px){.hero .scene::after,.hero.side-left .scene::after,.hero.side-right .scene::after{display:none!important}.hero .scene img{filter:none!important}} /* phone: no dark film on the photo; the copy is stacked below */
/* Compare picker chips, founder 20.10 (iPhone screenshot): one consistent pill, no blue button tint, no dashed/copper borders; name left, price right */
.dchip{color:var(--ink);-webkit-appearance:none;appearance:none;border:1px solid var(--rule)!important;border-style:solid!important;background:#fff;display:inline-flex;align-items:baseline;justify-content:space-between;gap:.6rem;line-height:1.2;-webkit-tap-highlight-color:transparent}
.dchip.near span{color:var(--ink2)}.dchip.near::before{content:"";width:6px;height:6px;border-radius:50%;background:#B5612E;align-self:center;flex:0 0 6px}
.dchip[aria-pressed="true"]{background:var(--ink)!important;color:var(--paper)!important;border-color:var(--ink)!important}.dchip[aria-pressed="true"]::before{background:#E6A06B}
.dp-r .dchip{width:100%}.dp-r .chips,.dp-r .dchips{display:grid;gap:.45rem}
.dp-l .mtabs{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem}.dp-l .mtabs button{width:100%;text-align:center}
@media (max-width:700px){.dpick{grid-template-columns:1fr;gap:.7rem}.dp-l .mtabs{grid-template-columns:repeat(3,1fr)}.dp-r .dchip{font-size:.86rem;padding:.5rem .8rem}}
#mswitch a.tap{opacity:.55;transform:scale(.985);transition:opacity .08s,transform .08s} /* pressed state before the navigation */
#mswitch a{-webkit-tap-highlight-color:rgba(185,98,47,.25);touch-action:manipulation}#thumbs button,#galMain,.dchip,.mtabs button,.sizes button{touch-action:manipulation}
/* status strip drop-down (founder 20.10) */
.sys-toggle{display:inline-flex;align-items:center;gap:.6rem;background:none;border:0;padding:0;color:inherit;font:inherit;cursor:pointer}
.sys-chev{width:7px;height:7px;border-right:1.5px solid #B9C1BD;border-bottom:1.5px solid #B9C1BD;transform:rotate(45deg);margin-left:.1rem;transition:transform .2s}.sys-toggle[aria-expanded="true"] .sys-chev{transform:rotate(-135deg)}
.sys-panel{flex-basis:100%;margin-top:.4rem;padding:.7rem .9rem;border:1px solid rgba(255,255,255,.12);border-radius:12px;background:rgba(255,255,255,.03)}
.sys-table{width:100%;border-collapse:collapse;font:500 .74rem var(--mono);color:#E6E1D7}.sys-table th{text-align:left;font-weight:500;color:#8E9994;padding:.25rem 0;border-bottom:1px solid rgba(255,255,255,.1)}.sys-table td{padding:.38rem 0;border-bottom:1px solid rgba(255,255,255,.06);vertical-align:middle}.sys-table td .sys-dot{width:7px;height:7px;margin-right:.3rem;vertical-align:middle;animation:none}.sys-table td.ms{text-align:right;color:#B9C1BD}
.sys-note{margin:.6rem 0 0;font:400 .7rem var(--body);color:#8E9994}
/* founder note 4 (20.10): on the phone the quick-buy selector comes right after the hero */
@media (max-width:700px){main#top>#fit{order:1}main#top>#houses{order:2}main#top>#cmpBand{order:3}}
/* founder note 2: lighter film on the desktop photo (the copy sits in the free zone, the product stays bright) */
@media (min-width:701px){.hero .scene::after{background:linear-gradient(90deg,rgba(15,26,23,.58) 0%,rgba(15,26,23,.22) 28%,rgba(15,26,23,0) 40%),linear-gradient(0deg,rgba(15,26,23,.6) 0%,rgba(15,26,23,0) 32%)}.hero.side-right .scene::after{background:linear-gradient(270deg,rgba(15,26,23,.58) 0%,rgba(15,26,23,.22) 28%,rgba(15,26,23,0) 40%),linear-gradient(0deg,rgba(15,26,23,.6) 0%,rgba(15,26,23,0) 32%)}}
/* iOS Safari paints unstyled <button> text in the system blue; every button inherits the page ink unless a class says otherwise (founder screenshots 20.10) */
button{color:var(--ink);-webkit-tap-highlight-color:transparent}
/* W9 home frames (2000² squares, product in the lower 60%): anchor the crop a little below centre */
.house img,#fImg,.fin img{object-position:50% 60%}
/* founder 20.10 (phone menu + parts tiles): the whole house must sit in the frame, like the listing: square tiles, no cropped roofs */
.sub img{aspect-ratio:1/1;object-fit:cover;object-position:50% 58%;border-radius:10px}
.pick.pm button img,.pm button img{aspect-ratio:1/1!important;object-fit:cover;object-position:50% 58%}
/* History year rail (founder 20.10, iPhone): one scrolling row, the "live" pill sits beside its year, nothing overlaps */
nav.tabs[aria-label="Years"]{display:flex;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:1.4rem;padding:.6rem .2rem}nav.tabs[aria-label="Years"]::-webkit-scrollbar{display:none}
nav.tabs[aria-label="Years"] a{flex:0 0 auto;display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap}nav.tabs[aria-label="Years"] a i{position:static;margin:0;transform:none}
/* parts page: cover colour chips on the cover card (W9 folded photos, 20.10) */
.covpick{display:flex;flex-wrap:wrap;gap:.35rem;margin:.35rem 0 .5rem}.covpick button{display:inline-flex;align-items:center;gap:.35rem;border:1px solid var(--rule);border-radius:999px;background:#fff;padding:.28rem .6rem .28rem .34rem;font:500 .74rem var(--body);color:var(--ink);cursor:pointer}.covpick button i{width:14px;height:14px;border-radius:50%;border:1px solid rgba(0,0,0,.12)}.covpick button[aria-checked="true"]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}.covpick.need{outline:2px solid #B9622F;outline-offset:3px;border-radius:999px}
/* section headers (W0 20.10): one column on phones, heading then paragraph; balanced headings */
.secH h2{text-wrap:balance}@media (max-width:700px){.secH{grid-template-columns:1fr!important;gap:.5rem;align-items:start}}
/* W0 critic v169 (20.10): desktop hero stats on their own subtle scrim, on the copy side, never on the product */
@media (min-width:1025px){.hero .bottom .readout{background:rgba(15,26,23,.52);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:.75rem 1rem;border-radius:12px}.hero .bottom #lastOrder.under-cta{text-shadow:0 1px 2px rgba(0,0,0,.5)}}
/* quick-buy frame: the baked campaign bar never shows inside the configurator (18.10 rule: every new block joins the quick hide list) */
body.quick .cmp-ann,body.quick #cmpAnn{display:none!important}
/* hero fade-through: the scene ground is the page ink, outgoing frame fades to it, incoming fades in; no blend */
.hero .scene{background:var(--ink)}.hero .scene img{transition:opacity .4s ease!important}.hero .scene img.out{opacity:0!important}.hero .scene img.was{opacity:1;z-index:1} /* 24.10: the outgoing frame stays opaque under the incoming one; no dark dip between frames */
.lv-fade .lv{opacity:0;transition:opacity .2s}#carts .lv,#lastOrder .lv{transition:opacity .25s}
/* v172 buy box (founder 20.10 iPhone): numbered steps, one chip style, a smaller price, the dog step readable, nothing tangled */
.buy{counter-reset:step}
.buy .axis,.buy .pz{padding:.95rem 0 .2rem;border-top:1px solid var(--rule);display:grid;gap:.55rem}
.buy .axis>.lab,.buy .pz>label>b{font:600 .95rem/1.3 var(--body);color:var(--ink)}
.buy .axis>.lab[data-step]::before,.buy .pz>label>b[data-step]::before{content:attr(data-step);display:inline-grid;place-items:center;width:1.3rem;height:1.3rem;border-radius:50%;background:var(--ink);color:#fff;font:600 .7rem/1 var(--mono);margin-right:.5rem;vertical-align:-.15rem}
.buy .axis>.lab b{font-weight:600}.buy .axis>.lab span{font-weight:400}
.buy .chips button{padding:.5rem .85rem;font:500 .86rem var(--body);border-radius:999px;gap:.45rem;line-height:1.2}
.buy .chips button .lvtop{font:600 .58rem var(--mono);letter-spacing:.05em;text-transform:uppercase;color:#2F6B3A;background:#E9F3EC;padding:.16rem .4rem;border-radius:999px;margin-left:.15rem}
.buy .chips button[aria-pressed="true"] .lvtop{background:rgba(255,255,255,.14);color:#CDEFD6}
.buy .pricebox .p{font:600 1.9rem/1 var(--disp)!important;letter-spacing:-.02em}.buy .pricebox s{font-size:1rem;color:var(--ink2)}.buy .pricebox .off{background:#E9F3EC;color:#2F6B3A;font:600 .8rem var(--body);padding:.25rem .6rem;border-radius:999px}
.buy .complete{font-size:.85rem;color:var(--ink2)}.buy .complete a{color:var(--ink)}
.buy .dogrow{align-items:end}@media (max-width:700px){.buy .dogrow{grid-template-columns:1fr;gap:.5rem}.buy .dogrow select{font-size:.95rem}}
.dogrow .wt label{font:500 .8rem var(--body);color:var(--ink2)}.dogrow .wt output{font:600 .85rem var(--mono);color:var(--ink)}
#sizes{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem}#sizes button{flex-direction:column;align-items:flex-start;gap:.15rem;border-radius:12px;padding:.6rem .7rem;width:100%}#sizes button span{font:500 .74rem var(--mono)!important;opacity:.8!important}#sizes button[aria-pressed="true"] span{color:#E6E1D7}
.buy .sizenote{font-size:.8rem;color:var(--ink2)}
.buy .pz label{display:grid;gap:.4rem}.buy .pz input[type=text]{border:1px solid var(--rule);border-radius:10px;padding:.65rem .8rem;font:500 .95rem var(--body)}
.sbar #sbPrice,.sbar .sbp{font:600 1.25rem/1 var(--disp)!important;letter-spacing:-.01em}.sbar #sbPrice s,.sbar .sbp s{font-size:.85rem;color:var(--ink2);margin-left:.3rem}
/* header block height reserved before scripts mount it (Lighthouse: main shifted 0.69 on the PDP when the header arrived after first paint) */
#site-top{min-height:111px}@media (max-width:700px){#site-top{min-height:120px}}body.quick #site-top,body.embed #site-top{min-height:0}
/* v172 checkout (W0 Fable test A, 20.10) */
.ckg .sum{display:grid!important;grid-template-columns:1fr!important;gap:.5rem}.ckg .sum .tot{display:flex;justify-content:space-between;align-items:baseline;gap:.6rem;white-space:normal;font:600 1.45rem/1.2 var(--disp)}.ckg .sum .tot span:last-child{text-align:right}
.ckg .sum .l{grid-template-columns:72px minmax(0,1fr) auto}.ckg .sum .l b{display:block;overflow-wrap:anywhere}.ckg .sum .l .lp{font-size:.95rem}
.ckback{display:block!important;margin-bottom:.8rem}
@media (max-width:900px){.ckg>.sum{order:0}.ckg>#s1{order:1}.ckg>#s2{order:2}.ckg>#s3{order:3}.ckg>*{order:4}.ckg>.sum{order:0}.ckg>#s1{order:1}.ckg>#s2{order:2}.ckg>#s3{order:3}}
@media (max-width:700px){.toast{bottom:auto;top:calc(env(safe-area-inset-top,0px) + 12px)}} /* the toast never covers the next card or sits under the buy bar */
body.view3d .sbar{transform:translateY(120%);transition:transform .25s} /* the buy bar slides away while the 3D viewer is on screen */
#rates .boxes{display:block;font:500 .78rem var(--body);color:var(--ink2);margin-top:.15rem}
.ckg .sum>*{justify-self:stretch;width:100%;box-sizing:border-box;min-width:0}

/* W0 test B (7): the cookie bar lives at the bottom, above the buy bar, never over Add to cart */
.ckbar{top:auto!important;bottom:0!important}body.has-sbar .ckbar{bottom:calc(5.2rem + env(safe-area-inset-bottom,0px))!important}body.has-nslide .ckbar{bottom:0!important}
/* W0 test B (2): the Photos / 3D / Drawing / Assembly pills show on phones too (they lead to the 3D block below the gallery) */
@media (max-width:700px){.gtog{display:none!important;left:.6rem;top:.6rem}.gtog button{font-size:.72rem;padding:.3rem .55rem}}
/* W0 test B (9): craft hero as a split, the heading beside the photo, never on the product */
.hero2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);min-height:0;background:var(--paper2);color:var(--ink);align-items:center;overflow:visible}
.hero2 img{position:static;inset:auto;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;object-position:50% 60%;opacity:1;order:2}
.hero2 .wrap{position:static;padding:3rem 2rem;order:1}.hero2 .wrap *{color:inherit}.hero2 .mono{color:var(--copper)!important}
@media (max-width:700px){.hero2{grid-template-columns:1fr}.hero2 img{order:1}.hero2 .wrap{order:2;padding:1.6rem 1rem 2rem}}
.pricebox .p.skel{display:inline-block;min-width:8ch;height:1.15em;border-radius:8px;background:linear-gradient(90deg,#EEE9E0,#F7F4EE,#EEE9E0);background-size:200% 100%;animation:skel 1.2s linear infinite}@keyframes skel{to{background-position:-200% 0}}
/* W0 test B (2): gallery mode pills on phones and iPads (house.html hides them below 980 px with !important; this wins by specificity) */
@media (max-width:1199px){#galMain .gtog{display:none!important;left:.6rem;top:.6rem}#galMain .gtog button{font-size:.72rem;padding:.3rem .55rem}}
/* W0 test B (9): craft hero split, overriding the page's own absolute image */
section.hero2{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);min-height:0!important;background:var(--paper2)!important;color:var(--ink)!important;align-items:center;overflow:visible!important}
section.hero2 img{position:static!important;inset:auto!important;width:100%!important;height:auto!important;aspect-ratio:1/1;object-fit:cover;object-position:50% 60%;opacity:1!important;order:2}
section.hero2 .wrap{position:static!important;padding:3rem 2rem!important;order:1}section.hero2 .wrap h1,section.hero2 .wrap h2,section.hero2 .wrap p{color:var(--ink)!important}section.hero2 .wrap .mono{color:var(--copper)!important}
@media (max-width:700px){section.hero2{grid-template-columns:1fr}section.hero2 img{order:1}section.hero2 .wrap{order:2;padding:1.6rem 1rem 2rem!important}}
/* W0 critic v176 (2, 3): rotating hero frames = the sets' square room + dog photos. Desktop/iPad: photo contained on the right over a paper ground, dark copy on the left; no film, no text over the product. Phone keeps the stacked layout. */
@media (min-width:701px){
.hero.square{background:var(--paper2);color:var(--ink)}
.hero.square .scene{background:var(--paper2)}.hero.square .scene img{object-fit:contain!important;object-position:100% 50%!important;filter:none!important}
.hero.square .scene::after,.hero.square.side-left .scene::after,.hero.square.side-right .scene::after{display:none!important}
.hero.square h1,.hero.square .copy p,.hero.square .readout,.hero.square .readout b,.hero.square .readout small,.hero.square #lastOrder,.hero.square #lastOrder .lv{color:var(--ink)!important;text-shadow:none!important}
.hero.square .copy p{color:var(--ink2)!important}.hero.square #heroK{color:var(--copper)!important;background:none!important;text-shadow:none!important}
.hero.square .btn.primary,.hero.square .btn.white,.hero.square .btn:not(.ghost){background:var(--ink)!important;color:var(--paper)!important;border-color:var(--ink)!important}
.hero.square .btn.ghost{color:var(--ink)!important;border-color:var(--ink)!important;background:transparent!important}
.hero.square .bottom .readout{background:none!important;backdrop-filter:none!important;padding:0!important}
.hero.square .scenes button{color:var(--ink)!important;border-color:rgba(15,26,23,.35)!important;background:transparent!important}.hero.square .scenes button[aria-pressed="true"]{background:var(--ink)!important;color:var(--paper)!important}
.hero.square .lv .lvdot{background:#2E8B57}
}
@media (min-width:701px) and (max-width:1024px){.hero.square .scene img{object-position:50% 50%!important}.hero.square .scene{height:60vw}} /* iPad: the square sits centred above the copy */
@media (min-width:701px){.hero.square .bottom,.hero.square .top{background:none!important}} /* W0 v177 (iPad): flat paper ground under the pills + stats on the square frames; the full-bleed opener keeps its own treatment */
/* founder final critique v177 (package 1) */
@media (max-width:700px){main#top>#reviews-home{order:2}main#top>#houses{order:3}main#top>#cmpBand{order:4}} /* A7: reviews right after Quick Buy, as before */
.colL .reviews.pdprv.incol{padding:1.6rem 0 0;background:none}.colL .reviews.pdprv.incol .wrap{padding:0;max-width:none} /* B4: the reviews module lives under the gallery (50-50) */
@media (min-width:1200px){body.quick .live3d{display:none!important}} /* A5: in Quick Buy the 3D lives in the gallery toggle; no second block under the buy box */
.oqline{padding:.9rem 0 0;font:500 .78rem var(--mono);letter-spacing:.04em;color:#B9C1BD}.oqline b{color:#E6E1D7;font-weight:600}
@media (max-width:1024px){.pdp .reviews.pdprv.incol{order:3;width:100%}} /* B4 on phone/iPad: gallery, buy box, then the reviews (the left column is unwrapped there) */

/* founder A13: one type scale. PDP title a size smaller, its finish line a size bigger; the dispatch clock quieter */
.buy h1{font-size:clamp(1.8rem,2.4vw,2.3rem)!important;line-height:1.05}.buy h1 small{display:block!important;margin:.35rem 0 0!important;font:500 1.05rem/1.3 var(--body)!important;color:var(--ink2)!important;white-space:normal!important}
.clock b{font:500 clamp(1.15rem,1.6vw,1.45rem)/1.2 var(--disp)!important;letter-spacing:-.01em}
/* founder C3: the second History photo is a square, not a wide strip */
.half.pic.wide{grid-column:auto!important;aspect-ratio:1/1!important}.pic.wide img{object-fit:cover!important;object-position:50% 50%!important}
/* founder F1: social tiles paint from our poster at once; the video or the platform embed loads only on tap; the lightbox video fills the stage at its real ratio */
.mt .dur{position:absolute;right:.55rem;bottom:.55rem;font:600 .62rem/1 var(--mono);letter-spacing:.05em;background:rgba(15,26,23,.78);color:#fff;padding:.3rem .45rem;border-radius:999px}
.mlb .stage video{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;background:#000}
.mlb .stage .emb-tap{position:absolute;inset:0;display:grid;place-items:center;background:rgba(15,26,23,.25)}.mlb .stage .emb-tap button{background:#fff;color:var(--ink);border:0;border-radius:999px;padding:.8rem 1.3rem;font:600 .95rem var(--body);cursor:pointer}
/* founder A13: one type scale. Section titles keep their size; module titles (reviews, A+, roomier, band) share tier 2; sub-headings (spec sheet, tiles, value line) share tier 3 */
.rv h2,.aplus .ap-hero h2,.cmpsec .dhead h2,.cmp-band h2{font-size:clamp(1.7rem,2.6vw,2.3rem)}.tgrid .tile h3,.value h3,.sheet .row h3{font-size:clamp(1.35rem,2.2vw,2rem)}

/* W9 a3-heroes (founder A1/A3): full-bleed wide frames; the copy lives in the free left 43%, never over the product (47% to 95%); iPad = photo above at its own ratio, text below; phone = square photo, text below */
@media (min-width:1025px){.hero .bottom{max-width:42%}.hero .top{grid-template-columns:minmax(0,36%)}}
@media (min-width:701px) and (max-width:1024px){.hero .scene{height:auto;aspect-ratio:1600/679;min-height:0}}
@media (max-width:700px){.hero .scene{height:auto;aspect-ratio:1/1;min-height:0}}

/* W8 page map 20.10 (founder C3/C6): the 1:1 campaign card, the in-the-box proof strip, the History proof chip */
.ncwrap.with-side{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;align-items:stretch}@media (max-width:700px){.ncwrap.with-side{grid-template-columns:1fr}} /* founder 21.10: iPad keeps the 50/50 row; the phone stacks, newsletter first */
.cmp-sq{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:1.2rem;align-items:center;border:1px solid var(--rule);border-radius:16px;padding:1.2rem;background:#fff}.cmp-sq img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:12px;display:block}.cmp-sq h3{margin:.35rem 0 .3rem;font-size:clamp(1.15rem,1.8vw,1.45rem);line-height:1.2}.cmp-sq p{color:var(--ink2);margin:0 0 .9rem;font-size:.92rem}.cmp-sq .btn{display:inline-block}@media (max-width:480px){.cmp-sq{grid-template-columns:1fr}}
.inbox-strip{border:1px solid var(--rule);border-radius:12px;padding:.9rem 1.1rem;margin:0 0 1.6rem;font-size:.95rem;background:var(--paper2);line-height:1.5}
.hchip{display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:baseline;border:1px solid var(--rule);border-radius:999px;padding:.75rem 1.25rem;margin:1.4rem 0 .4rem;width:max-content;max-width:100%;background:#fff}.hchip .num{font-weight:700;font-size:1.35rem;letter-spacing:-.01em}.hchip a{font-weight:600}
/* W0 20.10: the gallery pill never covers a frame's text; frames 2 to 10 → bottom-left */
#galMain .gtog.low,.gtog.low{top:auto!important;bottom:.6rem}
/* founder 21.10: the review photo viewer keeps ONE stage size; the photo is never cropped (contain); the empty sides show a blurred, darkened copy of the same photo; arrows, close, counter and text are anchored to the stage */
.mlb .stage{height:min(80vh,760px);min-height:0;max-height:none;overflow:hidden}
.mlb .stage .bg{position:absolute;inset:-6%;background:#111 center/cover no-repeat;filter:blur(24px) brightness(.5);z-index:0;pointer-events:none}
.mlb .stage img,.mlb .stage video,.mlb .stage iframe.emb{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;z-index:1;background:transparent}
.mlb .stage button{z-index:2}
.mlb .stage .emb-tap{z-index:3}
.mlb .shell{grid-template-rows:auto;align-items:start}
.mlb .side{max-height:min(80vh,760px)}
@media (max-width:700px){.mlb .stage{height:58vh}.mlb .side{max-height:none}}
.mlb:fullscreen .stage,.mlb:-webkit-full-screen .stage{height:100vh}
/* review cards: every photo sits in a fixed square box, contain + blurred backdrop, so the cards never change height */
.ph.small .pxb{position:relative;overflow:hidden;border-radius:8px;background:#1b1b1b;width:112px;height:112px;flex:0 0 auto;cursor:zoom-in;display:block}
.ph.small .pxb::before{content:"";position:absolute;inset:-12%;background:var(--bg) center/cover no-repeat;filter:blur(16px) brightness(.55)}
.ph.small .pxb img,.ph.small .pxb img:only-child,.ph.small .pxb img:not(:first-child){position:relative;width:100%!important;height:100%!important;max-height:none!important;aspect-ratio:auto!important;object-fit:contain!important;background:transparent;border-radius:0;display:block}
.ph.small .pxb:only-child{width:140px;height:140px}
@media (max-width:700px){.ph.small .pxb{width:calc((100% - .8rem)/3);height:auto;aspect-ratio:1/1}.ph.small .pxb:first-child{width:100%;height:auto;aspect-ratio:1/1}.ph.small .pxb:not(:first-child){width:64px;height:64px;aspect-ratio:auto}.ph.small .pxb:nth-of-type(n+6){display:none}}
/* founder 21.10: on the phone the top gallery is photos only; 3D, Drawing and Assembly live in step 5 */
@media (max-width:1199px){#galMain .gtog,.gtog{display:none!important}}
.mlb .stage img.lo{filter:blur(6px);transform:scale(1.02)}.mlb .stage img{transition:filter .25s ease}
/* founder 21.10 (W0): live signal slots keep a fixed height on the PDP; nothing arrives late and pushes the buy button */
.buy .pricebox{min-height:2.3rem;align-content:flex-start}
.buy .rate{display:inline-block;min-height:1.35em;line-height:1.35;max-width:100%;white-space:normal;text-align:left;vertical-align:top} /* founder 22.10: no cut text */
#carts,.buy .urg{display:block!important;min-height:1.6em;line-height:1.6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#carts .lv,.buy .urg .lv{display:inline;margin-right:.6rem}
#perks{display:block!important;min-height:3.3rem}#perks:empty{min-height:3.3rem}
#ownLine{display:block!important;min-height:1.3em}
#finTop{display:block;min-height:1.1rem;font:500 .66rem var(--mono);letter-spacing:.04em;text-transform:uppercase;color:#1E5631;margin-top:.2rem}
/* W0 21.10 (iPhone "›" tab over the price line): the gallery never collapses to zero height in a 3D mode on the phone, so its Previous/Next arrows (the only "‹ ›" glyphs on the page) cannot float over the content below; the photo viewer stays fully hidden until opened */
@media (max-width:1199px){#galMain.is3d{min-height:60vw}.gal .main.is3d .arrow{display:none!important}}
.lightbox:not(.on){display:none!important;visibility:hidden}

/* founder 21.10: cart "Complete it" cards: compatible parts, colour dots, one-tap Add */
.cdr-xh{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.cdr-xh small{font-weight:400;color:var(--ink2)}.cdr-xsel{font:500 .8rem var(--body);padding:.2rem .4rem;border:1px solid var(--rule);border-radius:8px;background:#fff}
.cdr-xg{grid-template-columns:repeat(3,1fr)}@media (max-width:420px){.cdr-xg{grid-template-columns:1fr 1fr}}
.cdr-xc{display:grid;gap:.3rem;align-content:start;border:1px solid var(--rule);border-radius:10px;padding:.45rem;background:#F5F5F7;font-size:.76rem}.cdr-xc img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:6px;background:#F5F5F7}.cdr-xt{line-height:1.25;min-height:2.5em}
.cdr-cov{display:flex;gap:.3rem}.cdr-cov button{width:22px;height:22px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--rule);cursor:pointer;padding:0}.cdr-cov button[aria-checked="true"]{box-shadow:0 0 0 2px var(--ink)}
.cdr-name{font:500 .8rem var(--body);padding:.35rem .45rem;border:1px solid var(--rule);border-radius:8px;width:100%;min-width:0}.cdr-name.need{border-color:#B3261E}
.cdr-xp{display:flex;align-items:center;justify-content:space-between;gap:.4rem}.cdr-xadd{padding:.4rem .7rem;font-size:.78rem;min-height:32px}

/* founder 21.10: Parts & Care never adds a part with a silent wrong fit */
body.needpick #plist button[data-add]{opacity:.45;pointer-events:none}body.needpick #listH::after{content:' · pick your house and size first';font-weight:400;color:var(--copper);font-size:.8em}
.cdr-xhide{margin-left:auto;background:none;border:0;cursor:pointer;color:var(--ink2);font-size:.9rem;padding:.2rem .4rem}
.cdr-xs{border-top:1px solid var(--rule);padding:.7rem 0 .6rem;margin-top:.4rem}
#nameFee{display:block;min-height:1.25em}
/* founder 21.10: reserved heights for everything above the add-to-cart button */
.buy .mswitch{min-height:238px}#valLine{display:block!important;min-height:3.2em}@media (max-width:700px){#valLine{min-height:4.6em}}#nameFee{min-height:1.5em}#carts,.buy .urg{height:1.6em;min-height:0}
#ownLine{margin-top:.6rem}
#valLine{min-height:3.4em}@media (max-width:700px){#valLine{min-height:4.8em}}
/* founder 21.10: the campaign/perk notes are one fixed-height row of chips under the button; one, two or three notes never change the height */
#perks{display:flex!important;flex-wrap:wrap;gap:.4rem;overflow:visible;min-height:5.7rem;align-items:flex-start;align-content:flex-start;margin:.5rem 0 0} /* three lines reserved (W8: at most 3 perks), so the late perks never move the steps below */ /* founder 22.10 (v188c review): the guarantee items show open, no sideways scroll; the reserved height stays */#perks::-webkit-scrollbar{display:none}#perks .cmp-note{flex:0 0 auto;white-space:nowrap;margin:0;padding:.35rem .65rem;font-size:.78rem;border-radius:999px;border-left:0;background:var(--paper2)}#perks .cmp-note small{display:none}
/* founder 21.10: phone drawer, Dog Houses expands to the three houses */
.mdrawer .mhouses summary{list-style:none;cursor:pointer;display:block;padding:.9rem 0;border-bottom:1px solid var(--rule);font-weight:600}.mdrawer .mhouses summary::-webkit-details-marker{display:none}.mdrawer .mhouses summary small{display:block;font-weight:400;color:var(--ink2);font-size:.8rem}.mdrawer .mhouses a{padding-left:1rem}
/* founder 21.10: the buy box is invisible until its first full render (no pre-script skeleton jump); a 2.5 s fallback reveals it regardless */
.pdp .buy:not(.ready) .pricebox,.pdp .buy:not(.ready) #valLine,.pdp .buy:not(.ready) #finTop{visibility:hidden} /* founder 22.10 (v188c review #3): only the amounts wait for the price door; the title, the stars and the chips paint first, in their reserved space */
#sizes .meta{display:block;min-height:3em}#sizes button b,#sizes .sz b{display:block;min-height:1.6em}
/* founder 21.10: the shipping result card (PDP estimate, cart, checkout rates): one height from first paint, no shift when the door answers */
.estOut{margin-top:.5rem}.shipcard{display:grid;gap:.45rem;align-content:start;min-height:9.6rem;border:1px solid var(--rule);border-radius:14px;padding:.85rem .95rem;background:#fff}
.shipcard .sc-top{display:flex;align-items:baseline;gap:.55rem;flex-wrap:wrap;min-height:1.6rem}.shipcard .sc-pay{font:600 1.25rem/1.25 var(--body);color:var(--ink)}.shipcard .sc-carrier{font-size:.85rem;color:var(--ink2)}
.shipcard .sc-badge{display:inline-block;width:max-content;max-width:100%;background:#E6F3EA;color:#1E5631;border-radius:999px;padding:.25rem .6rem;font:600 .74rem/1.3 var(--body);min-height:1.4rem}
.shipcard .sc-when{display:flex;gap:.55rem;align-items:center;min-height:2.4rem;color:var(--ink)}.shipcard .sc-when b{display:block;font-size:.92rem}.shipcard .sc-when small{display:block;color:var(--ink2);font-size:.76rem}.shipcard .sc-truck{flex:0 0 auto;color:#1E5631}
.shipcard .sc-chips{display:flex;flex-wrap:wrap;gap:.4rem;min-height:1.7rem}.shipcard .chip{border:1px solid var(--rule);border-radius:999px;padding:.25rem .6rem;font-size:.74rem;color:var(--ink)}.shipcard .sc-extra{color:var(--ink2);font-size:.74rem}
.shipcard.note .sc-note{font:500 .88rem/1.4 var(--body);color:var(--ink2)}.shipcard .sk{display:inline-block;background:linear-gradient(90deg,#EEE9E0,#F7F4EE,#EEE9E0);background-size:200% 100%;animation:skel 1.2s linear infinite;border-radius:6px;color:transparent}.shipcard .sc-pay.sk{width:9ch;height:1.25rem}.shipcard .sc-badge.sk{width:14ch}.shipcard .sc-when .sk{width:12ch;height:.9rem;margin:.1rem 0}.shipcard .chip.sk{width:13ch;height:1.4rem}
.rate.shipcard-row .p{display:grid;gap:.25rem;justify-items:end}.rate.shipcard-row .sc-pay{font-size:1rem}.rate.shipcard-row .sc-badge{background:#E6F3EA;color:#1E5631;border-radius:999px;padding:.2rem .5rem;font:600 .7rem/1.3 var(--body)}
@media (max-width:700px){#valLine{min-height:5.2em}}
#perks:empty{min-height:2.5rem}
.buy .meta{display:block;min-height:3.4em}.buy button[data-s] b{display:block;min-height:1.7em}
.shipcard{min-height:10.75rem}
/* founder 21.10: step 4 (name on the tag) looks exactly like steps 1 to 3 and 5: badge outside, title line, short description, no own frame */
.buy .axis.pz{display:grid;gap:.45rem}.buy .pz .lab .opt{font-weight:400;color:var(--ink2);font-size:.85em}.buy .pz .lab{order:1}.buy .pz .pzdesc{order:2;margin:0;padding:0;border:0;color:var(--ink2);font-size:.8rem;line-height:1.45}.buy .pz label.namebox{order:3}.buy .pz label.namebox{display:grid;gap:.35rem;font-size:.85rem}.buy .pz .cnt{text-align:right}.buy .pz #nameFee{text-align:left;color:var(--ink2);font-size:.8rem}
/* founder 21.10: the phone sticky buy bar has its final height from the first paint (it slides in, it never grows) */
@media (max-width:700px){.sbar{min-height:78px;box-sizing:border-box}.sbar:empty{min-height:78px}}
@media (max-width:700px){.sbar .sb-txt{display:grid;min-height:2.6em;align-content:center}}
@media (max-width:700px){.sbar .sb-chip{display:block!important;min-height:19px}}
/* founder 21.10 (W0 iPhone test): the hero copy appears once the web fonts are in, measured with them, so the swap never changes the hero height */
.hero .top{visibility:hidden}html.fontsin .hero .top{visibility:visible}
/* W0 21.10 (iPhone test): the home hero's live line keeps one reserved line from the first paint; the live door fills it later without moving anything */
#lastOrder{display:block!important;height:1.7em;line-height:1.7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}#lastOrder .lv{display:inline;white-space:nowrap}

/* founder 21.10 round 2: Complete it cards: price above, full-width Add on one baseline; Added ✓ · Undo state */
.cdr-xc{grid-template-rows:auto auto auto 1fr auto}.cdr-xp{justify-content:flex-start;font-size:.9rem}.cdr-xadd{width:100%;min-height:36px}
.cdr-xc.added{outline:2px solid #2F6B3A;outline-offset:-2px}.cdr-xok{font-weight:600;color:#2F6B3A;display:flex;justify-content:space-between;align-items:center;font-size:.78rem}.cdr-undo{background:none;border:0;color:var(--ink2);text-decoration:underline;cursor:pointer;font:500 .76rem var(--body);padding:0}
.cdr-xc{display:flex;flex-direction:column;gap:.3rem}.cdr-xc .cdr-xadd{margin-top:auto;align-self:stretch;height:36px;flex:0 0 auto}.cdr-xc img{flex:0 0 auto}
/* founder 21.10: review sections open 4 cards; Show more reviews adds 4 below (twice), then View all N reviews; new cards fade in under the existing ones, nothing above moves */
.rv .pdpmore{justify-self:center;display:grid;gap:.5rem;justify-items:center}.rv .col .card{animation:rvIn .35s ease both}@keyframes rvIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* founder 21.10: the viewer's thumbnail strip never shows an empty gray box: a blurred copy of the cached tile variant (or a warm tone) sits under each 160 px thumbnail until it lands */
.mlb .side .rvthumbs button{position:relative;background:#E9E2D6}.mlb .side .rvthumbs button::before{content:"";position:absolute;inset:-15%;background:var(--bg,none) center/cover no-repeat;filter:blur(6px) brightness(.9)}.mlb .side .rvthumbs button img{position:relative;width:100%;height:100%;object-fit:cover;display:block}

/* founder 21.10 round 3: ONE part card (PDP grid, Parts & Care, cart Complete it): flex column, equal heights, buttons on one baseline */
.pc{display:flex!important;flex-direction:column;gap:.35rem;align-items:stretch;height:100%;box-sizing:border-box;min-width:0}
.pc .pc-img{display:block;width:100%;aspect-ratio:4/3;background:#F5F5F7;border-radius:10px;overflow:hidden;flex:0 0 auto}.pc .pc-img img{width:100%;height:100%;object-fit:contain!important;display:block;margin:0!important;aspect-ratio:auto!important;border-radius:0}
.pc .pc-t{font-weight:600;font-size:.9rem;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:1.25em}
.pc .pc-f{color:var(--ink2);font-size:.78rem;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pc .pc-dots{display:flex;flex-wrap:nowrap;align-items:center;gap:.3rem;margin:0;min-height:20px}.pc .pc-dot{width:18px;height:18px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px var(--rule);padding:0;cursor:pointer;flex:0 0 auto;display:inline-block}.pc .pc-dot[aria-checked="true"],.pc .pc-dot.on{box-shadow:0 0 0 2px var(--ink)}.pc .pc-sel{font-size:.74rem;color:var(--ink2);margin-left:.2rem;white-space:nowrap}
.pc .pc-pr{font:500 1.2rem/1 var(--disp);letter-spacing:-.01em;font-variation-settings:'opsz' 96,'wdth' 85;color:var(--ink);display:flex;align-items:baseline;gap:.4rem;margin-top:.1rem}.pc .pc-pr b{font-weight:500}.pc .pc-pr s{font:400 .8rem var(--body);color:var(--ink2)}
.pc .pc-btn{margin-top:auto!important;width:100%;justify-self:stretch;align-self:stretch;text-align:center;justify-content:center;min-height:36px;box-sizing:border-box}
.plist{align-items:stretch}.cdr-xg{align-items:stretch}@media (max-width:700px){.plist{grid-template-columns:repeat(2,1fr)!important}.cdr-xg{grid-template-columns:1fr 1fr}}
.cdr-xc.pc{padding:.45rem}.part.pc{padding:1rem}.cdr-xc .cdr-name{flex:0 0 auto}

/* founder 21.10: Find my house v2: one field with a WLO prefix chip, masked address step, the site's pill inputs and buttons */
.findbox{display:grid;gap:.7rem;margin-top:.9rem}.findbox .fb-lead{font-size:.9rem;margin:0}.findbox .fb-step{display:grid;gap:.5rem}.findbox .fb-field{display:flex;align-items:center;border:1px solid var(--rule);border-radius:999px;background:#fff;padding:0 .3rem 0 .9rem}.findbox .fb-field:focus-within{border-color:var(--ink)}.findbox .fb-prefix{font:600 .85rem var(--mono);letter-spacing:.06em;color:var(--ink2);padding-right:.35rem;border-right:1px solid var(--rule);margin-right:.5rem}.findbox .fb-field input{border:0;background:transparent;flex:1;min-width:0;padding:.75rem .4rem;font:500 .95rem var(--body);outline:none}.findbox input[type=text]:not(.fb-field input){border:1px solid var(--rule);border-radius:999px;padding:.75rem 1rem;font:500 .95rem var(--body);background:#fff}.findbox .fb-two{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.findbox .fb-masked{margin:0;font:600 1rem var(--body);letter-spacing:.02em}.findbox .fb-hint{margin:0;font-size:.85rem;color:var(--ink2)}.findbox .fb-msg{color:var(--ink2);min-height:1.2em}.findbox .fb-back{background:none;border:0;color:var(--ink2);font:500 .85rem var(--body);text-decoration:underline;cursor:pointer;justify-self:start;padding:0}.findbox details summary{cursor:pointer;font-size:.9rem}.findbox .fb-help{color:var(--ink2)}.owned .shipsto{color:#5FD18A;font-weight:600}
/* founder 21.10 (W0, ~850 px window): one left edge for everything in the hero; the dynamic elements form one fixed-height info row at the bottom; the copy block's reserve sits under the buttons */
.hero .top{align-content:start}.hero .copy{display:grid;align-content:start;gap:.55rem}
.hero .bottom{display:flex!important;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:.5rem 1.1rem;max-width:none!important;margin:0!important;min-height:4.6rem}
.hero .bottom .scenes,.hero .bottom .readout{display:inline-flex;flex-wrap:wrap;align-items:center;gap:.4rem .8rem;justify-content:flex-start}
.hero .bottom #lastOrder,#lastOrder.under-cta{display:block!important;margin:0;flex:1 1 100%;min-width:0;height:1.7em;line-height:1.7}
@media (min-width:1025px){.hero .bottom{max-width:none!important}.hero .bottom #lastOrder{flex:1 1 100%}}
@media (max-width:1024px){.hero .bottom{min-height:5.4rem}}

/* founder 21.10: History story cards and year tags (the empty side of a row is filled, the text column gets the tag) */
.erap .half.card.story{background:#fff;border:1px solid var(--rule);border-radius:16px;padding:1.3rem 1.4rem;display:grid;align-content:start;gap:.7rem;height:100%;box-sizing:border-box}.erap .story .k{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2)}.erap .story h3{margin:0;font-size:clamp(1.3rem,2vw,1.7rem);line-height:1.15}.erap .story p{margin:0;color:var(--ink2);line-height:1.55}
.erap .tagrow{display:flex;align-items:center}.erap .bone{width:min(220px,70%);height:auto;display:block}.erap .chips.yr{display:flex;flex-wrap:wrap;gap:.4rem}.erap .chips.yr span{border:1px solid var(--rule);border-radius:999px;padding:.3rem .7rem;font:500 .78rem var(--body);color:var(--ink)}
.erap .half.txt .ytag{display:grid;gap:.7rem;margin-top:1.1rem}.erap .half.stack{display:grid;gap:1.2rem;align-content:start}.erap .half.stack>.card.story{height:auto}
@media (max-width:1024px){.erap .r50{grid-template-columns:1fr}.erap .r50 .story{order:9}.erap .half.stack{gap:1rem}} /* iPad and phone: every History row stacks, the story card under the photo; no half-empty columns */
.erap .story .livecount{display:block;margin-top:.4rem;font-weight:600;color:var(--ink)}
@media (min-width:1025px){.erap .r50:first-of-type>.half.pic:not(.portrait){aspect-ratio:auto;align-self:stretch;height:100%}.erap .r50:first-of-type>.half.pic:not(.portrait) img{height:100%;object-fit:cover}} /* the lead photo fills the text column's height on desktop; the founder's portrait keeps its own ratio */
.erap .chips.yr span.live{background:var(--ink);color:#F3EEE6;border-color:var(--ink)}
.erap .half.card.story .tagrow{margin-top:auto;padding-top:.6rem}.erap .half.card.story .chips.yr{margin-top:.2rem}.erap .bone{width:min(100%,360px)}
.hero .bottom>*{margin-left:0!important;margin-right:0!important}.hero .bottom .scenes{flex:1 1 100%}.hero .bottom .readout{flex:1 1 100%;justify-content:flex-start;text-align:left}

/* founder 21.10: desktop-only "check it in live 3D" notice + confirmation above Add to cart; reserved height from first paint; hidden below 1200 */
.chk3d{display:none}
@media (min-width:1200px){.chk3d{display:block;height:7.6rem;box-sizing:border-box;margin:.2rem 0 .6rem;overflow:hidden}.chk3d-n{display:flex;gap:.6rem;align-items:flex-start;background:#FFF4DC;border:1px solid #E6B85C;border-radius:10px;padding:.6rem .75rem;font-size:.82rem;line-height:1.4;color:var(--ink)}.chk3d-n i{flex:0 0 18px;width:18px;height:18px;border-radius:50%;background:#C98A1B;color:#fff;font:700 .72rem/18px var(--body);text-align:center;font-style:normal;margin-top:.1rem}.chk3d-n p{margin:0}.chk3d-n a{font-weight:600;text-decoration:underline;text-underline-offset:2px}.chk3d-c{display:flex;gap:.5rem;align-items:center;font-size:.84rem;margin-top:.5rem;cursor:pointer}.chk3d-c input{width:18px;height:18px;accent-color:var(--ink)}
 .buy .btn.soft{opacity:.45;filter:saturate(.6)}.chk3d.blink .chk3d-n{animation:chkblink .9s ease 1}@keyframes chkblink{0%,100%{background:#FFF4DC}40%{background:#FFD98A}}.buy .btn.shake{animation:btnshake .4s ease 1}@keyframes btnshake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}}
.erap .half.card.story{display:flex;flex-direction:column}
.erap .half.card.story{justify-content:center;gap:.9rem;padding:1.6rem 1.8rem}.erap .half.card.story h3{font-size:clamp(1.5rem,2.4vw,2.1rem)}.erap .half.card.story p{font-size:1.02rem;line-height:1.6}.erap .half.card.story .tagrow{margin-top:.4rem;padding-top:1.1rem;border-top:1px solid var(--rule)}
/* v187: the model cards' rating/price line keeps its height before the numbers land */
.mswitch .meta{align-items:baseline}.mswitch .meta>span,.mswitch .meta>i{display:inline-block;min-height:1.5em}
.hero .bottom{flex-direction:row!important;align-items:center!important;justify-content:flex-start!important}.hero .bottom .scenes,.hero .bottom .readout{justify-content:flex-start!important;align-self:flex-start!important;width:100%;flex:1 1 100%!important}
/* founder 21.10 (Compare): the newsletter card and the campaign card sit 50/50 at the same height; the footnote runs full width below */
.ncwrap.with-side{align-items:stretch}.ncwrap.with-side>*{height:100%;box-sizing:border-box}.ncwrap.with-side .news,.ncwrap.with-side [data-news-card]{display:flex;flex-direction:column;justify-content:center;height:100%}.ncwrap.with-side [data-news-card]>*{width:100%}.ncwrap.with-side .cmp-sq{height:100%;align-items:center}.ncwrap.with-side .cmp-sq img{aspect-ratio:1/1;object-fit:cover}
body.quick .chk3d{display:none!important} /* the home Quick Buy frame has no gate: the notice stays on the full PDP */
.mswitch .meta>span,.mswitch .meta>i{line-height:1.5}.mswitch .meta em{line-height:0;display:inline-block;vertical-align:-.08em}
/* W0 21.10 (item 41): the home model cards share one left edge and one height; rating line before the price, live line and ship line in reserved slots */
.houses .house{display:flex;flex-direction:column}.houses .house .info{display:flex;flex-direction:column;align-items:flex-start;gap:.3rem;flex:1 1 auto}.houses .house .row{display:flex;flex-direction:column;align-items:flex-start;gap:.15rem;width:100%}.houses .house .row .rate{order:-1;text-align:left;margin:0}.houses .house .row .price{text-align:left;margin:0}.houses .house .sp{min-height:1.6em;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%}.houses .house .ship{min-height:1.6em;margin-top:auto;width:100%}#hgrid{align-items:stretch}
@media (max-width:700px){.houses .house .kspec{min-height:3.3em}.houses .house .geo{min-height:1.4em}.houses .house .n{min-height:1.5em}}
/* W0 21.10 (item 43): one live-dot component everywhere: 8 px dot, 6 to 8 px flex gap, centered on the text */
.lv{display:inline-flex!important;align-items:center;gap:.45rem;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.lvdot,.lv .lvdot,.sys-dot{flex:0 0 8px;width:8px;height:8px;border-radius:50%;display:inline-block;margin:0}
#carts .lv,.buy .urg .lv,#lastOrder .lv{display:inline-flex!important}
/* founder 21.10: the gallery viewer sits above every site bar; the sticky bars hide while it is open; the close × is 44 px and always inside the viewport; wheel/pinch zoom on the image */
.mlb{z-index:300}.mlb .x{width:44px;height:44px;font-size:1.1rem}body.mlb-open .sbar,body.mlb-open .ckbar,body.mlb-open .cart-drawer{display:none!important}.mlb .stage img{transform-origin:center center;transition:transform .08s linear;touch-action:none;user-select:none;-webkit-user-drag:none}
.mlb .stage img.lo{transition:filter .25s ease}
/* the Photos/3D/Drawing/Assembly pill lives in its own row under the image on desktop; hidden below 1200 as before */
.gtogrow{display:none}@media (min-width:1200px){.gtogrow{display:flex;margin-top:.5rem}.gtogrow .gtog{position:static!important;display:flex!important;left:auto!important;top:auto!important;bottom:auto!important}.gtogrow+.thumbs{margin-top:.5rem}}
.houses .house .ship{min-height:2.9em}@media (min-width:701px){.houses .house .ship{min-height:1.6em}}
@media (max-width:700px){.mlb .stage img{left:4vw;right:4vw;width:92vw}} /* founder 21.10: the phone viewer keeps a 4vw breathing edge; the blurred backdrop fills the rest */
@media (min-width:1025px){.hero .bottom{max-width:43%!important}} /* the info rows stay inside the free text zone (W9 free_left_pct ≤43), never over the product */
/* W0 21.10: exactly one full-screen control in the 3D box. In the 3D, Drawing and Assembly modes the frame's top-right "Full screen" is the one; the gallery's round button belongs to the photo viewer only */
#galMain.is3d #galFs{display:none!important}
/* W0 live check v187 (item 39): the two Compare cards are exactly 50/50 and the campaign photo renders on desktop */
.ncwrap.with-side{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.6rem;align-items:stretch}.ncwrap.with-side>*{width:100%!important;max-width:none!important;min-width:0;box-sizing:border-box}.ncwrap.with-side .news,.ncwrap.with-side form.news{max-width:none!important;width:100%}.ncwrap.with-side .cmp-sq{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);height:auto;min-height:100%}.ncwrap.with-side .cmp-sq img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;min-height:120px}
@media (max-width:480px){.ncwrap.with-side .cmp-sq{grid-template-columns:1fr}}
/* founder 21.10: the card title keeps one reserved line; long names shrink instead of clipping */
.houses .house .info{width:100%;min-width:0;box-sizing:border-box}.houses .house .n{white-space:nowrap;overflow:hidden;max-width:100%}.houses .house .n a{display:inline-block;max-width:100%;white-space:nowrap}

/* 21.10 house card live line: two signals stack on two reserved lines, never cut, never an ellipsis (the line used to spill past the card) */.houses .house .sp{white-space:normal;overflow:visible;text-overflow:clip;min-height:3.2em;line-height:1.6}.houses .house .sp>span{display:inline-block;white-space:nowrap;max-width:100%;vertical-align:top}.houses .house .sp .lv{margin-right:0}

/* 21.10 W0 live check: the Compare side-by-side rule above re-declared two columns after the phone rule; phones stack to one full-width column */@media (max-width:700px){.ncwrap.with-side{grid-template-columns:1fr!important}.ncwrap.with-side>*{width:100%!important}}

/* 22.10 lookup: detected input type under the field; the phone / Etsy choice for a bare 10-digit number */.fb-kind{margin:.35rem 0 0;font-size:.82rem;color:var(--ink2)}.fb-kind.warn{color:#B42318}.fb-kind .kpick{border:1px solid var(--rule);background:#fff;border-radius:999px;padding:.15rem .6rem;font:inherit;cursor:pointer}.fb-kind .kpick.on{background:var(--ink);color:#fff;border-color:var(--ink)}
/* founder 22.10 (v188c review): the hero eyebrow badges (Live 3D · Drawing · Assembly, Original · Patented · Made in USA, campaign eyebrow) sat in pale cream on the photo and vanished against light walls; now an ink pill with cream text at every width */#heroK,.hero .k{display:inline-block!important;width:fit-content!important;inline-size:fit-content!important;max-width:100%;background:rgba(15,26,23,.82)!important;color:#F7E6D2!important;padding:.32rem .62rem!important;border-radius:6px!important;text-shadow:none!important;box-sizing:border-box} /* W0 22.10: the pill hugs its text, never the column */

.fb-two.one{grid-template-columns:1fr}

.pxb.noblur::before{display:none}.pxb.noblur{background:#EDE9E2}

/* 22.10 spec sheet: square frame so the listing photos are never cropped; the active row is marked */.specsheet .pin{aspect-ratio:1/1}.specsheet .pin img{object-fit:cover}.sheet .row{border-left:3px solid transparent;padding-left:.6rem;margin-left:-.6rem;transition:border-color .3s}.sheet .row.on{border-left-color:var(--copper)}.sheet .row.on .no{color:var(--copper)}
/* 22.10 (founder #3, pdpstable): the late lines under Buy keep their final height from first paint: perks 3 lines, owner line 2 lines, hints box fixed */#perks{min-height:5.7rem!important}body.quick #perks,body.quick #ownLine{min-height:0!important;margin:0!important}body.quick #ownLine{display:none!important} /* W0 23.10: the frame has no review module for "Of these" to refer to */#ownLine{min-height:2.5rem!important;display:block!important}#hints{min-height:5.5rem;max-height:5.5rem;overflow:hidden;box-sizing:border-box}

/* 22.10 (founder #3): the model cards at the top of the buy box keep their space from first paint; the script fills them a few ms later */@media (min-width:1200px){.mswitch:empty{min-height:238px}}@media (min-width:701px) and (max-width:1199px){.mswitch:empty{min-height:200px}}
/* 22.10 (founder #3, 1440): the value line and the carts line keep their height from first paint; a hidden carts line keeps its space */#valLine{min-height:2.8rem;display:block}#carts[hidden]{display:block!important;visibility:hidden}#carts{min-height:1.25rem}

/* 22.10 (founder #3): the buy box has its scripted height from first paint: the title (two lines), the stars line and the four step rows reserve the space the script fills a few ms later; pdpstable guards it */
.buy h1#title{min-height:56px}.buy .rate{display:block;min-height:19px}
.buy .axis[data-ax="1"]{min-height:159px}.buy .axis[data-ax="2"]{min-height:130px}.buy .axis[data-ax="3"]{min-height:323px}.buy .axis[data-ax="4"]{min-height:185px}
@media (min-width:701px){.buy .axis[data-ax="1"]{min-height:117px}.buy .axis[data-ax="2"]{min-height:87px}.buy .axis[data-ax="3"]{min-height:249px}.buy .axis[data-ax="4"]{min-height:167px}}
@media (min-width:1200px){.buy h1#title{min-height:62px}.buy .axis[data-ax="1"]{min-height:159px}.buy .axis[data-ax="2"]{min-height:87px}.buy .axis[data-ax="3"]{min-height:271px}.buy .axis[data-ax="4"]{min-height:167px}}
/* 22.10 (founder #3): the sold line under the stars keeps its line from first paint (the social door fills it from its cache at script time) */#buySp{display:block!important;min-height:27px}

/* founder 22.10 (phone review of v190) */
@media (max-width:700px){.gal .main .fsb{display:none!important}}
@media (max-width:1024px){.gal .main .arrow{background:transparent!important;border:0!important;box-shadow:none!important;color:#0F1A17!important;font-size:2.6rem!important;line-height:1!important;text-shadow:0 0 6px rgba(255,255,255,.95),0 0 2px rgba(255,255,255,1)!important;width:48px!important;height:48px!important}} /* arrows only, no white disc; a white halo keeps them readable on dark photos */
#perks .cmp-note{white-space:normal!important;max-width:100%;box-sizing:border-box;border-radius:12px;padding:.4rem .7rem;font-size:.78rem;line-height:1.35} /* the name tag and guarantee notes wrap inside the box, never widen the page */
@media (max-width:1024px){.hero .top p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}@media (max-width:700px){.hero .top p{font-size:.95rem;line-height:1.45}}.hero .top h1{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;padding-bottom:.08em}.hero .top p{padding-bottom:.1em}}@media (min-width:701px) and (max-width:1024px){.hero .top h1{-webkit-line-clamp:4}} /* the long Lakota headline takes four lines on a tablet */ /* a headline may take three lines (never cut words); phones and tablets: every slide's copy has the same height, so the reserve under the paragraph is a few pixels, not a hole */ /* every slide's copy has the same height on phones, so the reserve under the buttons shrinks to a few pixels */

/* 22.10 UI audit H1: the live lines under the price (sale note, carts, last order) each keep a full line, never an ellipsis */.buy .urg{white-space:normal!important;height:auto!important;min-height:3.3em!important;text-overflow:clip!important;overflow:visible!important}.buy .urg>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:1.6em}#carts{min-height:1.6em!important}

/* 22.10 UI audit M10: 44 px hit areas on phones and tablets (footer links, cart Remove, swatches, 3D tabs); M9: topic pills are labels, not buttons; M3: the compare table shows it scrolls */
@media (max-width:1024px){.cdr-rm,.cart .rm,button[data-rm],.cdr-x{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}.fin button,.cov button,.sw button,#finSw button,#covSw button{min-width:44px;min-height:44px}.tabs button{min-height:44px}}
.topics .pill,.pills span,.gtopic{cursor:default;pointer-events:none;opacity:.9}
@media (max-width:700px){.cmpwrap,.table-wrap,.cmp-scroll{position:relative}.cmpwrap::after,.table-wrap::after,.cmp-scroll::after{content:'Swipe for more';position:absolute;right:.4rem;top:.3rem;font:600 .68rem/1 var(--mono);letter-spacing:.06em;color:var(--ink2);background:rgba(255,255,255,.9);padding:.25rem .45rem;border-radius:999px;pointer-events:none}}

/* 22.10 UI audit M7: the cart upsell cards wrap their text, nothing is cut */.cdr-xg a{white-space:normal;min-width:0}.cdr-xg a *{white-space:normal;overflow-wrap:anywhere}

/* 22.10 W0 v192 critic #1: the hero copy block is a column; the buttons sit at its bottom, the reserved space sits between the paragraph and the buttons, never inside the text */#heroCopy{display:flex;flex-direction:column}#heroCopy #heroC{margin-top:auto}#heroCopy #lastOrder{flex:0 0 auto!important} /* the live line no longer swallows the free space, so the buttons really sit at the block's bottom */
/* #4: account hero heading to body gap */.hd h1{margin-bottom:.6rem}
/* 22.10 W0 v192 critic #1 (desktop): the text block is bottom-aligned in its reserved height, so the words stay together just above the buttons and the free space sits above the eyebrow, on the photo, not as a hole inside the copy */@media (min-width:1025px){#heroCopy{justify-content:flex-end}#heroCopy #heroC{margin-top:1.3rem}}
/* v195 (founder 22.10 via W0): ONE shared viewer for gallery and review photos. The stage is a reserved box whose size never depends on the photo (desktop: the shell's fixed height; phones and tablets: 58vh); the photo is contained inside it; prev/next, keyboard and swipe never change the box; arrows are black translucent rounds like the gallery, the close is solid black; the page under it is frozen (media.js lockScroll) and lands on the same scroll. Gate: pup/gate-viewer.mjs */
.mlb{padding:max(1rem,env(safe-area-inset-top,0px)) 1rem max(1rem,env(safe-area-inset-bottom,0px));background:rgba(10,14,13,.96)}
.mlb .shell{width:min(1180px,100%);height:min(calc(100vh - 2rem),800px);max-height:none;grid-template-columns:minmax(0,1fr) 300px;grid-template-rows:minmax(0,1fr);align-items:stretch;border-radius:14px;overflow:hidden}
.mlb .stage{position:relative;height:100%;min-height:0;max-height:none;overflow:hidden;background:#111;display:block;touch-action:pan-y pinch-zoom}
.mlb .stage img,.mlb .stage video,.mlb .stage iframe.emb{position:absolute;left:0;right:0;top:0;bottom:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain}
.mlb .stage iframe.emb{left:50%;right:auto;transform:translateX(-50%);width:min(100%,420px)}
.mlb .side{overflow:auto;min-height:0;max-height:none;-webkit-overflow-scrolling:touch}
.mlb .stage .p,.mlb .stage .n,.mlb .stage .fs{background:rgba(0,0,0,.55)!important;color:#fff!important;border:0!important;box-shadow:none!important;width:44px!important;height:44px!important;border-radius:50%!important;font-size:1.7rem!important;line-height:44px!important;text-shadow:none;padding:0}
.mlb .stage .fs{font-size:1.15rem!important}
.mlb .stage .p:hover,.mlb .stage .n:hover,.mlb .stage .fs:hover{background:rgba(0,0,0,.75)!important}
.mlb .x{background:#000!important;color:#fff!important;border:0!important;width:44px!important;height:44px!important;border-radius:50%!important;font-size:1.15rem!important;top:10px;right:10px;z-index:5;padding:0}
@media (max-width:860px){.mlb{padding:0}.mlb .shell{width:100%;height:100%;max-height:none;border-radius:0;grid-template-columns:1fr;grid-template-rows:58vh minmax(0,1fr)}.mlb .stage{height:100%}.mlb .side{padding:1rem 1rem 1.4rem}}
.mlb:fullscreen .shell,.mlb:-webkit-full-screen .shell{height:100%;width:100%;max-height:none;border-radius:0}
@media (max-width:700px){.mlb .stage img{left:4vw;right:4vw;width:92vw}} /* founder 21.10 kept: the phone viewer's 4vw breathing edge, still inside the reserved stage */
.mlb .stage button:focus,.mlb .x:focus{outline:none}.mlb .stage button:focus-visible,.mlb .x:focus-visible{outline:2px solid #fff;outline-offset:2px} /* no orange ring left on an arrow after a tap or click; keyboard focus keeps a white ring */
@media (min-width:701px) and (max-width:1024px) and (orientation:portrait){.mlb.short .shell{grid-template-rows:72vh minmax(0,1fr)}} /* W0 critic 22.10: no blank half under a gallery caption on a portrait tablet; the box is still photo-independent */

.list .post img{height:auto} /* W8 v2 22.10: the card image carries width/height for layout reservation; the height attribute must not stretch it */
/* founder 22.10 (via W0): the confirmation shows on every device (chk3d on every device); its height is reserved per breakpoint so the buy box never shifts; the name-tag clause may add a line, reserved too */
.chk3d{display:block;height:8.3rem;box-sizing:border-box;margin:.2rem 0 .6rem;overflow:hidden} /* measured 22.10: 126 px at 390 with the name clause */
.chk3d-c{align-items:flex-start;min-height:2.6rem}.chk3d-c input{margin-top:.15rem;flex:0 0 18px}
@media (min-width:701px){.chk3d{height:7.2rem}} /* 90 px at 820 with Natural Oak; Classic Walnut + the name clause needs a third line */
@media (min-width:1025px){.chk3d{height:7.2rem}} /* 108 px at 1440 (narrower buy column) */
/* W8 PDP tabs 22.10: stat strip, swatch row, 3-step strip, care icons, one real photo per tab; numbers from the doors, nothing typed in */
.tabpane h3{font:600 1.35rem/1.2 var(--disp);margin:0 0 .5rem}.tabpane .tlead{color:var(--ink2);margin:0 0 .6rem}.tabpane p{margin:.55rem 0}
.tstat{display:grid;grid-template-columns:repeat(5,1fr);gap:.4rem;margin:.8rem 0 1rem;padding:.8rem .6rem;border:1px solid var(--rule);border-radius:12px;background:var(--paper2)}.tstat div{display:grid;gap:.1rem;text-align:center}.tstat b{font:600 1.05rem/1.2 var(--disp);color:var(--ink)}.tstat span{font:500 .68rem/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}
.tstat:has(div:nth-child(4):last-child){grid-template-columns:repeat(4,1fr)}.tstat:has(div:nth-child(3):last-child){grid-template-columns:repeat(3,1fr)}.tstat:has(div:nth-child(2):last-child){grid-template-columns:repeat(2,1fr)}
@media (max-width:700px){.tstat{grid-template-columns:repeat(3,1fr)!important}.tstat div:nth-child(4),.tstat div:nth-child(5){grid-column:span 1}}
.tsw{display:flex;gap:1rem;flex-wrap:wrap;margin:.6rem 0 .8rem}.tsw div{display:grid;justify-items:center;gap:.3rem;font-size:.78rem;color:var(--ink2)}.tsw i{width:34px;height:34px;border-radius:50%;border:1px solid var(--rule);box-sizing:border-box}.tsw div.on i{outline:2px solid var(--ink);outline-offset:2px}.tsw div.on span{color:var(--ink);font-weight:600}
.tsteps{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:.6rem 0 .8rem}.tsteps div{display:grid;gap:.3rem;padding:.7rem .6rem;border:1px solid var(--rule);border-radius:12px;background:var(--paper2);text-align:center}.tsteps b{width:26px;height:26px;border-radius:50%;background:var(--ink);color:#fff;font:600 .8rem/26px var(--body);margin:0 auto}.tsteps span{font-size:.85rem;color:var(--ink)}
.ticons{display:flex;gap:1.4rem;margin:.6rem 0 .8rem}.ticons div{display:grid;justify-items:center;gap:.3rem;font-size:.8rem;color:var(--ink2)}.ticons svg{width:34px;height:34px;fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.tabpane figure.tph{margin:.8rem 0}.tabpane figure.tph img{width:100%;max-width:420px;height:auto;max-height:min(70vh,560px);object-fit:contain;aspect-ratio:auto;border-radius:12px;display:block} /* W9 #6: each tab photo keeps its own aspect */.tabpane figure.tph figcaption{font-size:.78rem;color:var(--ink2);margin-top:.3rem}
.tabpane .tguar{border-left:3px solid var(--copper,#B5612E);padding-left:.8rem}.tabpane .tret{font-size:.9rem;color:var(--ink2)}

/* W0 critic 22.10 (v198 on the phone): the notice is a proper row with the icon on every device, the locked buttons look locked, the reserved height is exact */
.chk3d-n{display:flex;gap:.6rem;align-items:flex-start;background:#FFF4DC;border:1px solid #E6B85C;border-radius:10px;padding:.6rem .75rem;font-size:.82rem;line-height:1.4;color:var(--ink)}
.chk3d-n i{flex:0 0 18px;width:18px;height:18px;border-radius:50%;background:#C98A1B;color:#fff;font:700 .72rem/18px var(--body);text-align:center;font-style:normal;margin-top:.1rem}
.chk3d-n p{margin:0}.chk3d-n a{font-weight:600;text-decoration:underline;text-underline-offset:2px}
.chk3d-c{display:flex;gap:.5rem;align-items:flex-start;font-size:.84rem;margin-top:.5rem;cursor:pointer}.chk3d-c input{width:18px;height:18px;accent-color:var(--ink)}
.buy .btn.soft,.buy .btn.soft:hover{background:var(--paper2)!important;color:var(--ink2)!important;border:1px solid var(--rule)!important;box-shadow:none!important;opacity:1;filter:none;cursor:not-allowed}

/* founder 22.10: Complete it cards wrap, nothing is cut: title and fit line in full, the colour name under the swatches, two columns on a phone, the name field fits its card */
.cdr-xc .pc-t,.cdr-xc .pc-f{display:block;-webkit-line-clamp:unset;overflow:visible;min-height:0;white-space:normal}.cdr-xc .pc-dots{flex-wrap:wrap;row-gap:.2rem}.cdr-xc .pc-sel{flex-basis:100%;margin-left:0;white-space:normal}.cdr-xc .cdr-name{font-size:.78rem;padding:.35rem .4rem;width:100%;min-width:0}.cdr-xc .cdr-name::placeholder{font-size:.74rem}
.cdr-xg{grid-template-columns:repeat(2,1fr)} /* founder 22.10: the drawer is 440 px at most, so two columns always: titles and fit lines stay within two lines, nothing is cut */

/* W9 image audit 22.10 (founder: every image shows the whole product) */
.aplus .ap .apcap{display:block;font-size:.76rem;color:var(--ink2);margin-top:.35rem}
.aplus .ap-hero img#apHero{aspect-ratio:1/1} /* #1 */
/* W9 #10 (object-position right center) withheld: hero180 measures the product box from W9's text-zones file and right-center cut 16% of it on two frames at 1440; W9 to give per-frame positions */
#hcLine .it.w img{object-fit:contain} /* #12 */
.list a.post img{aspect-ratio:16/9;object-fit:cover;width:100%;height:auto} /* #13 */
/* founder 23.10 (phone, v205b): the customer-photo strips keep their uniform grid tiles; the natural-width row was reverted */

/* founder 22.10 (iPad landscape 1024–1366): the hero column must fit inside the fixed frame, readout included */
@media (min-width:981px) and (max-width:1366px){.hero .top{padding-top:1.1rem}.hero h1{font-size:clamp(1.8rem,3vw,2.5rem);line-height:1.02}.hero .lede{font-size:.9rem;line-height:1.4;margin:.5rem 0 0}.hero .ctas{margin-top:.8rem}.hero .ctas .btn{padding:.6rem 1rem;font-size:.9rem}.hero .pills{margin-top:.5rem}.hero .readout b{font-size:1.45rem;margin-bottom:.15rem}.hero .readout{gap:1.1rem}.hero .k,.hero .eyebrow{font-size:.68rem}}

/* W9 #10 per frame (22.10, zones re-measured to the house only): wide hero frames at >=1180 keep the house whole; below 1180 the frame has the image's own aspect */
@media (min-width:1180px){.hero .scene img[src*="hero-pueblo-walnut-wide"]{object-position:60% 50%}.hero .scene img[src*="hero-gabled-oak-wide"]{object-position:57% 50%}.hero .scene img[src*="hero-lakota-walnut-wide"]{object-position:56% 50%}.hero .scene img[src*="hero-gabled-black-wide"]{object-position:80% 50%}}

/* W0 22.10 v203b audit */
@media (min-width:701px) and (max-width:1100px){.strip .wrap{flex-wrap:nowrap}.strip .wrap>span{white-space:nowrap;min-width:0}.strip .wrap .r{display:none}} /* #2 (tablets): the black strip keeps one line, the right half drops; phones keep their wrapped strip, nothing is clipped */
@media (max-width:980px){.hero .copy{min-height:300px}.hero .ctas{margin-top:1rem}} /* #3: no empty gap between the subtitle and the buttons on tablets; the reserve still covers the tallest copy */
.aplus .ap .apfig{margin:0;display:block}.aplus .ap .apfig img{display:block;width:100%}.aplus .ap .apfig .apcap{display:block;margin-top:.35rem} /* #4: caption under its photo */

.tbl{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch} /* W0 23.10 v205 check: blog tables scroll inside their box on phones instead of pushing past the edge */

/* footer, phones and tablets (founder 23.10): the same tight rhythm as the desktop footer. Links keep a 44 px hit area through padding that overlaps the row instead of stretching it. */
@media (max-width:1024px){
footer.site{padding-block:2rem 1.2rem}
footer.site .fgrid .flogo{height:44px;margin-bottom:.4rem}
footer.site .fgrid>div:first-child p{margin:.3rem 0 .6rem;line-height:1.45}
footer.site .fgrid b{margin-bottom:.45rem}
footer.site .fgrid ul{gap:.1rem}
footer.site .fgrid ul a,footer.site .pol a,footer.site .claims a{display:inline-block;line-height:1.4;padding:.7rem 0;margin:-.7rem 0;position:relative}
footer.site .news{margin-top:.6rem;max-width:26rem}
footer.site .news label{gap:.3rem}
footer.site .fbot{margin-top:1.2rem;padding-top:.9rem;gap:.8rem 1rem}
footer.site .pol{gap:.55rem .9rem}
footer.site .claims{margin-top:.8rem}
footer.site .oqline{padding-top:.7rem}
footer.site .sysbar{padding:.7rem 0 .4rem}
}

/* W0 audit 23.10 (phone): the home reviews block and the houses block sat 118 px apart; one tighter seam */
@media (max-width:700px){.rvhome{padding-bottom:1.6rem}.houses{padding-top:2.2rem}}

/* grid filler (founder 23.10, v209): the card the grid fills an empty last-row cell with; same box as its neighbours, text never over a picture */
.pc.fill{text-decoration:none;color:inherit;background:var(--paper2);border:1px solid var(--rule);display:grid;align-content:start;gap:.35rem}.pc.fill .fill-mark{display:grid;place-items:center;aspect-ratio:1/1;border-radius:12px;background:linear-gradient(160deg,var(--paper) 0%,var(--paper2) 100%);font:500 1.1rem/1 var(--disp);letter-spacing:.18em;color:var(--ink2)}.pc.fill .pc-t{font-size:.95rem;line-height:1.3;-webkit-line-clamp:3}.pc.fill .pc-f{color:var(--ink2);line-height:1.4;-webkit-line-clamp:4;min-height:0}.pc.fill:hover{border-color:var(--ink)}
.posts .pc.fill{min-height:0;border-radius:14px;padding:.9rem}.posts .pc.fill .fill-mark{aspect-ratio:16/9}

/* quiet buy bar (founder 23.10, v209): one line, about 56 px plus the safe area; the x hides it for the session */
.sbar.sbar-q{padding:.5rem .7rem calc(.5rem + env(safe-area-inset-bottom,0px));min-height:0!important}.sbar-q .sb-row{gap:.6rem}.sbar-q .sb-txt{display:flex;align-items:baseline;gap:.45rem;min-height:0;flex-wrap:nowrap;overflow:hidden}.sbar-q .sb-txt b{font-size:.92rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.sbar-q .sb-txt span{font:600 1.05rem/1 var(--disp);white-space:nowrap}.sbar-q .sb-txt s{font-size:.78rem;color:var(--ink2);margin-left:.25rem;font-weight:500}.sbar-q .btn{padding:.6rem .95rem;min-height:40px}.sbar-q .sb-x{width:36px;height:36px;border-radius:50%;border:1px solid var(--rule);background:#fff;color:var(--ink2);font-size:.85rem;flex:none;display:grid;place-items:center}
@media (max-width:700px){.sbar.sbar-q .sb-txt{display:flex;min-height:0}}
body.has-sbar .ckbar{bottom:calc(3.9rem + env(safe-area-inset-bottom,0px))!important}

/* phone header (founder 23.10, v209): menu, logo and cart only; search and account live in the drawer and the footer */
@media (max-width:700px){.nav .tools a[href="help.html#search"],.nav .tools a[href="account.html"],.nav .tools .ic-search,.nav .tools .ic-account{display:none}} /* v212: by class, the build rewrites the hrefs */
/* phone menu: the three houses first (founder 23.10, v209), the shared model cards in a compact row */
.mdrawer .mcards{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin:.2rem 0 1rem}.mdrawer .mcards a{display:grid;gap:.25rem;border:1px solid var(--rule);border-radius:12px;padding:.45rem;text-decoration:none;color:inherit;background:#fff}.mdrawer .mcards a img{width:100%;aspect-ratio:16/11;object-fit:cover;border-radius:8px}.mdrawer .mcards a b{font-size:.92rem}.mdrawer .mcards a small{display:none}.mdrawer .mcards .meta{display:flex;flex-wrap:wrap;gap:0 .4rem;font-size:.74rem;color:var(--ink2);line-height:1.3}.mdrawer .mcards .meta em{font-style:normal;color:var(--copper,#B5612E)}.mdrawer .mcards i{font-style:normal;font-weight:600;color:var(--ink)}

/* desktop pass (founder 23.10, note 10) */
@media (min-width:981px){.fshot{margin-inline:auto;max-width:960px}.fshot img{aspect-ratio:3/2;object-fit:cover;object-position:50% 58%;border-radius:18px}.fshot .cap{position:static;grid-template-columns:repeat(3,1fr);background:none;color:inherit;padding:1rem 0 0}} /* 10a: the finish photo is contained (max 900 px), the caption sits under it, never over the product */
@media (min-width:781px){.aplus .ap{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(1.6rem,3vw,3rem);align-items:center;margin-bottom:2rem}.aplus .ap>img,.aplus .ap .apfig img{aspect-ratio:1/1!important;width:100%;max-height:520px;object-fit:contain;background:var(--paper2);border-radius:18px}.aplus .ap .apfig{margin:0;max-width:100%}.aplus .ap .txt{max-width:36rem}.aplus .ap:nth-of-type(odd) .txt{padding-left:.5rem}} /* 10c: image + text side by side, alternating, one square frame per block (whole house, no crop), equal row heights, no dead space */
@media (min-width:1500px){.aplus{max-width:1180px;margin-inline:auto}}
@media (min-width:1025px) and (max-height:860px){.hero{height:max(500px,min(clamp(540px,50vw,760px),calc(100vh - 150px)));min-height:0}.hero .top{padding-top:.8rem}.hero h1{font-size:clamp(1.7rem,2.3vw,2.3rem);line-height:1.05}.hero .lede{font-size:.95rem;line-height:1.4;margin-top:.6rem}.hero .ctas{margin-top:.6rem}.hero .ctas .btn{padding-block:.6rem}.hero .bottom{padding-top:.8rem;padding-bottom:.7rem;row-gap:.45rem}.hero .readout b{font-size:1.35rem}.hero .chips{margin-top:.2rem}} /* 10d: on a short laptop screen the hero takes the height of its own content (headline, CTAs, chips, stats) instead of a fixed frame, so nothing is cut by the fold */
.tph{aspect-ratio:1/1;overflow:hidden;background:var(--paper2);border-radius:14px}.tph img{width:100%;height:100%;object-fit:cover;display:block}#ecoSw button{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--rule);border-radius:999px;background:#fff;padding:.35rem .7rem;font:500 .84rem var(--body);cursor:pointer}#ecoSw button[aria-checked="true"]{outline:2px solid var(--ink);outline-offset:1px}#ecoSw button i{width:12px;height:12px;border-radius:50%;display:inline-block;border:1px solid rgba(0,0,0,.2)} /* 13: fixed box, the close-up swaps in place */

/* account (founder 23.10, note 15): sign-in card centred with a benefits panel; the houses first */
.gate{display:grid;grid-template-columns:minmax(0,34rem) minmax(0,1fr);gap:2rem;align-items:start;max-width:64rem;margin-inline:auto}.gate .login{max-width:none}.gate .why{padding:1.6rem;border:1px solid var(--rule);border-radius:16px;background:var(--paper2)}.gate .why h3{font:600 1.15rem var(--disp);margin:0 0 .8rem}.gate .why ul{list-style:none;margin:0;padding:0;display:grid;gap:.8rem}.gate .why li{display:grid;gap:.15rem}.gate .why li b{font-size:.98rem}.gate .why li span{font-size:.9rem;color:var(--ink2)}
@media (max-width:1023px){.gate{grid-template-columns:1fr;max-width:34rem}} /* the benefits panel sits beside the card only where it gets real width */
.hcards{display:grid;gap:1rem}.hcard{display:grid;grid-template-columns:minmax(0,160px) 1fr;gap:1rem;align-items:center;border:1px solid var(--rule);background:#fff;border-radius:16px;padding:1rem;color:var(--ink)}.hcard img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:12px}.hcard .hb{display:grid;gap:.4rem;min-width:0}.hcard .hb b{font:600 1.15rem var(--disp);color:var(--ink)}.hcard .hb small{color:var(--ink2);font-size:.86rem}.hcard .acts{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.3rem}.hcard .acts .btn{padding:.6rem .9rem;font-size:.9rem}.hcard .acts .note{align-self:center;font-size:.86rem;color:var(--ink2)}
@media (max-width:600px){.hcard{grid-template-columns:96px 1fr}.hcard .hb b{font-size:1.02rem}} /* 'house' is the home page's dark card class; the account cards have their own */

@media (min-width:1600px){.hero .top{padding-top:2rem}.hero h1{font-size:clamp(2.6rem,2.4vw,3.2rem)}.hero .bottom{padding-top:1.3rem;padding-bottom:1.2rem}} /* 10d wide: */ /* at 1920 the stats row sat below the fixed frame; tighter type keeps it inside */

.mswitch .meta>*{display:block;min-height:1.25em}.mswitch .meta>span:empty{min-height:1.25em} /* pdpstable 23.10: the rating and from-price lines keep their height before the texts arrive, so the buy box never moves */

.buy .urg #sale{display:block;min-height:1.65em} /* pdpstable 23.10: the sale line keeps its row before the campaign text arrives, so the carts line never drops a row (1440: 0.003 CLS) */

/* earlier-house size table on Parts & Care (founder 24.10) */
.sizetbl{margin:.7rem 0 0;max-width:30rem}.sizetbl table{width:100%;border-collapse:collapse;font-size:.88rem;background:#fff;border:1px solid var(--rule);border-radius:12px;overflow:hidden}.sizetbl caption{text-align:left;font:600 .78rem var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);padding:0 0 .4rem}.sizetbl th,.sizetbl td{padding:.5rem .7rem;text-align:left;border-top:1px solid var(--rule)}.sizetbl thead th{border-top:0;background:var(--paper2);font-weight:600;font-size:.8rem;color:var(--ink2)}.sizetbl tbody th{font-weight:600}.sizetbl .note{margin:.45rem 0 0;font-size:.82rem;color:var(--ink2)}

/* Parts & Care, signed in (founder 24.10): who, and the houses as chips */
.signedbox{display:grid;gap:.6rem}.signedbox .who{margin:0;font-size:.95rem}.hchips{display:flex;flex-wrap:wrap;gap:.5rem}.hchips button{display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--rule);border-radius:999px;background:#fff;padding:.35rem .8rem .35rem .35rem;font:500 .9rem var(--body);cursor:pointer;min-height:44px}.hchips button img{width:34px;height:34px;border-radius:50%;object-fit:cover}.hchips button[aria-pressed="true"]{border-color:var(--ink);box-shadow:0 0 0 2px var(--ink) inset}.signedbox .note{margin:0;font-size:.84rem;color:var(--ink2)}

/* founder 24.10 (via W0, 1920 desktop): the hero's chips and stats share the copy column's left edge (the .wrap gutter plus the centered 1440 offset); the stats box is sized to its content */
@media (min-width:1025px){.hero .bottom{margin-left:max(0px,calc((100% - 1440px)/2))!important;box-sizing:border-box}.hero .bottom .readout{width:auto!important;flex:0 0 auto!important;display:inline-flex}.hero .bottom .scenes{width:auto!important;flex:1 1 100%!important}}

/* Fable UX 24.10: the Add-to-cart gate has a 44 px target and one plain line when it is skipped */
.chk3d-c{min-height:44px;align-items:center;padding:.3rem 0}.chk3d-c input{width:24px;height:24px;flex:0 0 24px;margin:0 .2rem 0 0}.chk3d-msg{margin:.3rem 0 0;font-size:.84rem;color:#B42318;font-weight:600}.chk3d-msg[hidden]{display:none}

/* Fable UX 24.10 mediums: 40 px tap targets on phones; even drawer cards; the finish band shows the house, not a wall of grain; the guides grid never leaves empty cells */
@media (max-width:700px){.scenes button,.dchip,.gbar .chips button,#rvCat button,#rvF button,.covpick button,.rvbar .btn,.rvbar select,.card .more,.rv .rep,.pc .add,.pc button,#sizes button,.chips button,.ftabs button{min-height:40px}.covpick button i{width:18px;height:18px}.sb-x{width:40px;height:40px}.burger{padding:.6rem;margin:-.6rem 0}.burger svg{width:26px;height:26px}.mtop button{min-height:44px;padding:.5rem .6rem}.mdrawer .mcards a{height:100%;box-sizing:border-box}}
.mdrawer .mcards{align-items:stretch}
@media (min-width:981px){.fshot img{aspect-ratio:16/9}}
@media (min-width:981px){.gpage .list,.guides .list{grid-template-columns:repeat(6,minmax(0,1fr))}.gpage .list>.post,.guides .list>.post{grid-column:span 2}.gpage .list>.post:nth-last-child(1):nth-child(3n+1),.guides .list>.post:nth-last-child(1):nth-child(3n+1){grid-column:span 6;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:1.4rem;align-items:center}.guides .list>.post:nth-last-child(1):nth-child(3n+1)>img{grid-column:1;grid-row:1/span 6}.guides .list>.post:nth-last-child(1):nth-child(3n+1)>*:not(img){grid-column:2} /* one leftover card spans the row as picture left, text right; its cover is never blown up */.gpage .list>.post:nth-last-child(2):nth-child(3n+1),.gpage .list>.post:nth-last-child(1):nth-child(3n+2),.guides .list>.post:nth-last-child(2):nth-child(3n+1),.guides .list>.post:nth-last-child(1):nth-child(3n+2){grid-column:span 3}}

/* Fable UX 24.10 CLS reservations: late-filled blocks keep their height from the first paint (founder: nothing shifts) */
#allReviews:not(.rv-ready){min-height:4300px}@media (min-width:701px) and (max-width:1024px){#allReviews:not(.rv-ready){min-height:5800px}}@media (max-width:700px){#allReviews:not(.rv-ready){min-height:12600px}}
#allReviews .score{min-height:124px}@media (max-width:700px){#allReviews .score{min-height:224px}}#allReviews #rvAI{min-height:30px}@media (min-width:701px) and (max-width:1024px){#allReviews #rvAI{min-height:67px}}@media (max-width:700px){#allReviews #rvAI{min-height:131px}}#allReviews .rvbar{min-height:33px}@media (max-width:700px){#allReviews .rvbar{min-height:52px}}
#cmpScene{min-height:1350px}@media (min-width:701px) and (max-width:1024px){#cmpScene{min-height:1325px}}@media (max-width:700px){#cmpScene{min-height:2148px}}
#cmpChecklist{min-height:601px}@media (min-width:701px) and (max-width:1024px){#cmpChecklist{min-height:472px}}@media (max-width:700px){#cmpChecklist{min-height:420px}}
@media (min-width:701px) and (max-width:1024px){#plist{min-height:1268px}}
@media (max-width:700px){.ckbar{bottom:auto;top:0}} /* the cookie bar sits at the top of a phone screen from the start; it never jumps when the buy bar appears */

/* Fable UX 24.10: the Guides campaign band slot keeps its height from the first paint (band heights measured 24.10; drop when the campaign ends) */
#blogBand{min-height:361px}@media (min-width:701px) and (max-width:1024px){#blogBand{min-height:349px}}@media (max-width:700px){#blogBand{min-height:542px}}

#allReviews:not(.rv-ready) #rvCards{min-height:3073px}@media (min-width:701px) and (max-width:1024px){#allReviews:not(.rv-ready) #rvCards{min-height:4780px}}@media (max-width:700px){#allReviews:not(.rv-ready) #rvCards{min-height:11054px}} /* v213c: reviews PAGE only (the home rail and the PDP block are a fraction of this), released once the cards have rendered */
@media (max-width:700px){#ckbar.ckbar{bottom:auto!important;top:0!important}}

#allReviews:not(.rv-ready) #rvWall{min-height:673px}#allReviews #rvF{min-height:30px}#allReviews #rvCat{min-height:32px}@media (min-width:701px) and (max-width:1024px){#allReviews:not(.rv-ready) #rvWall{min-height:382px}#allReviews #rvF{min-height:66px}}@media (max-width:700px){#site-top{min-height:120px}}

#allReviews #rvWall[hidden]{display:grid} /* the wall slot is laid out (as the grid it is) from the first paint on the reviews page; hidden-then-shown pushed the cards down */
@media (max-width:700px){#allReviews #rvEra{min-height:115px}}@media (min-width:701px) and (max-width:1024px){#allReviews #rvEra{min-height:43px}} /* the era tabs wrap once their counts arrive */

@media (max-width:700px){.cdr button,#cdrXs button,.cdr-q button{min-height:0}} /* the cart drawer keeps its own compact controls (gate-cart) */

@media (min-width:1200px){.chk3d{height:auto;min-height:7.6rem}} /* the gate box keeps its first-paint reserve but may grow for the one-line hint after a click (user input, not a layout shift) */
@media (max-width:1199px){.chk3d{height:auto;overflow:visible}}

/* v214 CLS reservations (Fable iPad/desktop profile): the patent figure grid, the cart lines and the parts policy block keep their height from the first paint */
@media (min-width:1025px){#list.pat3{min-height:841px}.parts .policy,#plist~.policy,.policy{min-height:139px}}
@media (min-width:701px) and (max-width:1024px){#list.pat3{min-height:5656px}.policy{min-height:214px}}
#lines{min-height:93px}

/* v215: the size-table caption's first letter was clipped by the table's overflow:hidden; the radius moves to the cells */
.sizetbl table{overflow:visible;border-radius:0;border:0}.sizetbl thead th,.sizetbl td{border:1px solid var(--rule)}.sizetbl caption{padding:0 0 .45rem 1px;letter-spacing:.08em}

.finder{align-items:start} /* v215 (founder iPad): the Find-my-house panel is content-height; the pick panel does not stretch it */

/* v215: finder cards are two independent, content-height cards (no shared beige ground showing under the shorter one); a filler tile always fills its row */
.finder{background:transparent;border:0;gap:1rem;align-items:start}.finder>.fbox{border:1px solid var(--rule);border-radius:14px}
.plist .pc.fill{height:100%;box-sizing:border-box}.plist .pc.fill.fill-img{grid-template-rows:minmax(0,1fr) auto auto;align-content:stretch}.plist .pc.fill.fill-img .pc-img{height:auto;align-self:stretch;aspect-ratio:auto;min-height:120px}.plist .pc.fill.fill-img .pc-img img{object-fit:cover!important}

.cdr-xp .from{font:500 .72rem var(--body);color:var(--ink2);letter-spacing:0}

/* v215: one rival (Lakota) never leaves two empty thirds; the minis share the row, a single one sits centred at reading width */
.dminis{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.dminis:has(> :only-child){max-width:760px;margin-inline:auto;width:100%}

/* v215 status board (founder): grouped, uptime-style, tabular numbers */
.sys-table tr.sys-g th{padding:.7rem 0 .25rem;font:600 .62rem var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#8E9994;border-bottom:0}
.sys-table td b{display:block;font-weight:600;color:#F3EEE6;font-size:.76rem}.sys-table td small{display:block;font:400 .66rem var(--body);color:#8E9994;margin-top:.1rem}
.sys-table th.r,.sys-table td.r{text-align:right;font-variant-numeric:tabular-nums}.sys-table td.st{white-space:nowrap}
.sys-panel{padding:.9rem 1.1rem;border-radius:14px;background:rgba(255,255,255,.035)}
/* v215: a colour swatch is always a perfect circle (the phone tap-target rule must not stretch it) */
.pc-dot,.covpick button i,#covSw button i,.cdr-cov .pc-dot{aspect-ratio:1/1;flex:0 0 auto;min-height:0!important;border-radius:50%}
@media (max-width:700px){.pc .pc-dot,.pc-dot{width:22px;height:22px;min-height:22px!important;flex:0 0 22px}.pc button.pc-dot{min-height:22px!important}}
/* v215: the review rating circles wrap and never overflow on tablets */
.score{min-width:0}.score .rings{min-width:0;flex:1 1 230px}.rings>div{min-width:0}.rings small{overflow-wrap:anywhere}
@media (min-width:701px) and (max-width:1180px){.rings{grid-template-columns:repeat(auto-fit,minmax(76px,1fr))}}

/* v215: signed-in parts panel links; guest size hint */
.acclinks{display:grid;grid-template-columns:1fr 1fr;gap:.4rem .8rem;margin-top:.9rem;padding-top:.9rem;border-top:1px solid var(--rule)}.acclinks a,.acclinks button{font:500 .92rem var(--body);color:var(--ink);text-decoration:none;background:none;border:1px solid var(--rule);border-radius:999px;padding:.55rem .9rem;text-align:left;cursor:pointer;min-height:44px;display:inline-flex;align-items:center}.acclinks a:hover,.acclinks button:hover{border-color:var(--ink)}
.sizehint{margin:.6rem 0 0;font-size:.86rem;color:var(--ink2)}
/* v215: the rating circles wrap inside any score card width (PDP two-column layouts included) */
.rings,#pdpReviews .rings,.rv .rings{grid-template-columns:repeat(auto-fit,minmax(76px,1fr))!important;width:100%;min-width:0}.rings>div{overflow:hidden;min-width:0}.score>div:first-child{flex:1 1 180px;min-width:0}.score .big{flex-wrap:wrap}.score .avglink,.score .avglink button{white-space:normal}

/* v215: score card = wrapping flex row above 720 px on every page (a grid column squeezed the rings to 24 px on the two-column PDP) */
@media (min-width:721px){.score,#pdpReviews .score{display:flex!important;flex-wrap:wrap;grid-template-columns:none}.score .rings{flex:1 1 260px;min-width:0}}