:root{--bg:#f4f1ea;--panel:#fffdf8;--ink:#1d1b18;--mute:#6f6a60;--line:#ddd6c8;--acc:#800020;--acc2:#5e0018;--ok:#2e7d4f;--warn:#b86e00;--err:#b3261e;--r:10px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--acc)}h1,h2,h3{line-height:1.2;letter-spacing:-.01em}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px max(20px,calc((100% - 1120px)/2));background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.brand{display:flex;align-items:center;gap:9px;font-weight:700;font-size:18px;color:var(--ink);text-decoration:none}
.top nav{display:flex;align-items:center;gap:20px;font-size:15px}.top nav a:not(.btn){color:var(--ink);text-decoration:none}.top nav a:not(.btn):hover{color:var(--acc)}
.btn{display:inline-block;background:var(--acc);color:#fff!important;padding:10px 18px;border-radius:8px;text-decoration:none;font-weight:600;border:0;cursor:pointer;font:inherit;font-weight:600}
.btn:hover{background:var(--acc2)}.btn.ghost{background:transparent;color:var(--acc)!important;border:1.5px solid var(--acc)}.btn.ghost:hover{background:#80002010}.btn.sm{padding:6px 12px;font-size:14px}.btn[disabled]{opacity:.5;cursor:default}
.btn.big{padding:14px 26px;font-size:17px}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
section{padding:64px 0}section.alt{background:var(--panel);border-block:1px solid var(--line)}
.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center;padding:64px 0 56px}
.hero h1{font-size:clamp(34px,4.6vw,52px);margin:0 0 16px}.hero p.lead{font-size:19px;color:#3d3a34;margin:0 0 26px;max-width:34em}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.hero small{display:block;color:var(--mute);margin-top:14px}
.shot{background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 18px 50px #3b2a1a22;overflow:hidden}.shot img{display:block;width:100%;height:auto}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:12px;color:var(--acc);font-weight:700;margin-bottom:10px}
h2.sec{font-size:clamp(26px,3.2vw,36px);margin:0 0 12px}.sub{color:var(--mute);max-width:40em;margin:0 0 32px;font-size:17px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:22px}section.alt .card{background:var(--bg)}
.card h3{margin:0 0 8px;font-size:18px}.card p{margin:0;color:#4b463d;font-size:15px}
.step{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--acc);color:#fff;font-weight:700;margin-bottom:12px}
.price{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}.price .card{display:flex;flex-direction:column}.price .card.hi{border:2px solid var(--acc);position:relative}
.price .amt{font-size:38px;font-weight:700;margin:6px 0}.price .amt small{font-size:15px;font-weight:400;color:var(--mute)}
.price ul{padding:0;margin:14px 0 22px;list-style:none;flex:1}.price li{padding:5px 0 5px 24px;position:relative;font-size:15px}.price li:before{content:"✓";position:absolute;left:0;color:var(--ok);font-weight:700}
.badge{position:absolute;top:-12px;left:20px;background:var(--acc);color:#fff;font-size:12px;font-weight:700;padding:3px 10px;border-radius:99px}
.faq details{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:14px 18px;margin-bottom:10px}.faq summary{cursor:pointer;font-weight:600}.faq p{margin:10px 0 0;color:#4b463d}
.note{background:#fff7e6;border:1px solid #f0d9a8;border-radius:var(--r);padding:14px 18px;font-size:15px;color:#5a4410}
.foot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:26px max(20px,calc((100% - 1120px)/2));border-top:1px solid var(--line);color:var(--mute);font-size:14px}.foot a{color:var(--mute);margin-left:18px}
.doc{max-width:760px;margin:0 auto;padding:44px 20px 70px}.doc h1{font-size:34px}.doc h2{font-size:20px;margin-top:30px}.doc li{margin:5px 0}
/* forms */
.authbox{max-width:440px;margin:56px auto;padding:0 20px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:28px;box-shadow:0 10px 34px #3b2a1a14}
.panel h1{font-size:26px;margin:0 0 6px}.panel p.hint{color:var(--mute);margin:0 0 18px;font-size:15px}
label{display:block;font-size:13px;font-weight:600;margin:14px 0 5px}input,select,textarea{width:100%;padding:11px 12px;border:1px solid #cfc7b6;border-radius:8px;font:inherit;background:#fff;color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid #80002033;border-color:var(--acc)}input[type=checkbox]{width:auto;margin-right:8px}
.chk{font-weight:400;display:flex;align-items:flex-start;font-size:14px}
.msg{margin-top:14px;font-size:14px;min-height:20px}.msg.err{color:var(--err)}.msg.ok{color:var(--ok)}
.alt-links{margin-top:18px;font-size:14px;color:var(--mute);display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.hp{position:absolute;left:-9999px}
/* account / admin */
.page{max-width:1000px;margin:0 auto;padding:30px 20px 70px}.page.wide{max-width:1240px}.page h1{font-size:28px;margin:0 0 4px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin:18px 0}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px}.kpi b{display:block;font-size:26px}.kpi span{color:var(--mute);font-size:13px}
.meter{height:9px;background:#e8e1d2;border-radius:9px;overflow:hidden;margin:8px 0 4px}.meter i{display:block;height:100%;background:var(--acc)}.meter.warn i{background:var(--warn)}
.sect{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px;margin-bottom:18px}.sect h2{margin:0 0 12px;font-size:19px}
table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--mute)}
td.r,th.r{text-align:right}.tw{overflow:auto}
.tag{display:inline-block;padding:2px 9px;border-radius:99px;font-size:12px;font-weight:600;background:#e8e1d2;color:#4b463d}.tag.ok{background:#dff1e5;color:#1d6b3c}.tag.warn{background:#fbebc9;color:#8a5200}.tag.err{background:#f8dcd9;color:#9a1c14}.tag.acc{background:#f3d9df;color:var(--acc2)}
.tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin:18px 0}.tabs button{background:none;border:0;padding:10px 14px;font:inherit;cursor:pointer;color:var(--mute);border-bottom:3px solid transparent;font-weight:600}.tabs button.on{color:var(--acc);border-color:var(--acc)}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.row>*{width:auto}.mut{color:var(--mute);font-size:13px}
.banner{background:#fff7e6;border:1px solid #f0d9a8;border-radius:10px;padding:14px 18px;margin:16px 0;color:#5a4410}.banner.err{background:#fdecea;border-color:#f3c3be;color:#8a1b13}.banner.ok{background:#e9f6ee;border-color:#bfe3cc;color:#1d6b3c}
.form2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.ck{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px solid var(--line)}.ck:last-child{border:0}.ck .dot{flex:0 0 20px;height:20px;border-radius:50%;background:#e8e1d2;display:grid;place-items:center;font-size:12px;color:#fff;margin-top:2px}.ck .dot.y{background:var(--ok)}
dialog{border:1px solid var(--line);border-radius:12px;padding:24px;max-width:560px;width:calc(100% - 32px);background:var(--panel);color:var(--ink)}dialog::backdrop{background:#0006}
@media(max-width:860px){.hero,.grid3,.grid2,.price,.form2{grid-template-columns:1fr}.hero{padding-top:36px}.top nav a:not(.btn){display:none}section{padding:44px 0}}

.genbar{display:flex;flex-direction:column;gap:4px;align-items:flex-start;padding:10px 14px;border-bottom:1px solid var(--line);font-size:13px;background:#faf7f1}
.gprompt{color:#3d3a34;white-space:normal;min-height:2.6em;line-height:1.3;font-size:14px}.gprompt.typing:after{content:"|";animation:gblink .7s steps(1) infinite}
.gstage{color:#6b1320;font-weight:600;white-space:nowrap}
.gprog{height:3px;background:#eee8dc}.gprog i{display:block;height:100%;width:0;background:#6b1320}
.gsheet svg{display:block;width:100%;height:auto}
@keyframes gblink{50%{opacity:0}}
#navauth{display:flex;align-items:center;gap:20px}

/* ---- v1.3 refresh ---- */
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.top{background:#fffdf8ee;backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px)}
.top nav{gap:22px}.top nav a.navguide{color:var(--acc);font-weight:600}
.btn{box-shadow:0 1px 2px #5e001822;transition:transform .12s,box-shadow .12s,background .12s}.btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px #80002030}
.btn.ghost{box-shadow:none}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #80002055;outline-offset:2px;border-radius:6px}
.hero{padding:76px 0 64px;gap:56px}.hero h1{letter-spacing:-.025em}
.trust{display:flex;gap:6px 18px;flex-wrap:wrap;list-style:none;padding:0;margin:20px 0 0;font-size:14px;color:#3d3a34;font-weight:500}
.trust li:before{content:"\2713";color:var(--ok);font-weight:700;margin-right:6px}
.shot{border-radius:14px;box-shadow:0 24px 60px #3b2a1a26}
.card{transition:box-shadow .15s,transform .15s}.card:hover{box-shadow:0 10px 28px #3b2a1a14;transform:translateY(-2px)}
section{padding:80px 0}h2.sec{letter-spacing:-.02em}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.gallery figure{margin:0;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 8px 26px #3b2a1a10;transition:transform .15s,box-shadow .15s}
.gallery figure:hover{transform:translateY(-3px);box-shadow:0 16px 38px #3b2a1a1c}
.gimg{background:#fff;aspect-ratio:4/3;display:grid;place-items:center;border-bottom:1px solid var(--line);overflow:hidden}.gimg img{width:100%;height:100%;object-fit:contain;display:block}
.gallery figcaption{padding:14px 16px}.gallery figcaption b{display:block;font-size:15px}.gallery figcaption span{display:block;color:var(--mute);font-size:13.5px;margin-top:3px;line-height:1.45}
.guidegrid{display:grid;grid-template-columns:260px 1fr;gap:48px;align-items:center}
.gcover{display:block;border-radius:6px;box-shadow:0 18px 44px #3b2a1a33;transform:rotate(-2.5deg);transition:transform .2s;max-width:260px;overflow:hidden;border:1px solid var(--line)}.gcover:hover{transform:rotate(0) translateY(-4px)}.gcover img{display:block;width:100%;height:auto}
.foot a{margin-left:20px}
@media(max-width:860px){.gallery{grid-template-columns:1fr}.guidegrid{grid-template-columns:1fr;gap:26px}.gcover{margin:0 auto}.hero{padding:40px 0 36px}section{padding:52px 0}
 .top nav a.navguide{display:inline-block!important;font-size:14px}.top nav #navauth a:not(.btn){display:inline}.top nav a:not(.btn):not(.navguide){display:none}}
.brand,.top nav a,.top nav .btn{white-space:nowrap}
@media(max-width:560px){.top nav a.navguide{display:none!important}.top{padding:10px 14px}.brand{font-size:16px}.top nav{gap:12px}}
/* gallery hover: enlarge + live redraw */
.gallery{position:relative}
.gallery figure{position:relative;transform-origin:center;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;cursor:zoom-in}
.gallery figure:hover,.gallery figure:focus-visible,.gallery figure.playing{transform:scale(1.28) translateZ(0);z-index:6;box-shadow:0 30px 70px #3b2a1a38}
.gallery figure:first-child:hover,.gallery figure:first-child.playing{transform-origin:left center}
.gallery figure:last-child:hover,.gallery figure:last-child.playing{transform-origin:right center}
.gimg{position:relative}.gsvg{position:absolute;inset:0;background:#fff}
.gallery figcaption .hint{display:block;color:var(--acc);font-size:12px;font-weight:600;margin-top:6px}
@media(max-width:860px){.gallery figure:hover,.gallery figure.playing{transform:scale(1.04)}}
@media(prefers-reduced-motion:reduce){.gallery figure{transition:none}.gallery figure:hover{transform:none}}

.fpill{background:var(--acc);color:#fff;font-size:12px;font-weight:700;padding:3px 10px;border-radius:99px;margin:8px 0 0;width:max-content}
.price .amt .was{font-size:20px;font-weight:400;color:var(--mute);text-decoration:line-through;margin-right:2px}

/* sample sheet viewer (sample-viewer.js) */
html.sv-lock{overflow:hidden}
.sv{position:fixed;inset:0;z-index:100;background:#171513;color:#f4f1ea;display:flex;flex-direction:column}.sv[hidden]{display:none}
.sv-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;border-bottom:1px solid #ffffff22;flex-wrap:wrap}
.sv-ttl b{display:block;font-size:17px}.sv-ttl span{font-size:13px;color:#cfc8b8}
.sv-ctl{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.sv-ctl button{background:#ffffff14;color:#fff;border:1px solid #ffffff33;border-radius:8px;min-width:38px;height:36px;padding:0 10px;font:inherit;font-size:16px;cursor:pointer}
.sv-ctl button:hover{background:#ffffff2a}.sv-ctl button:focus-visible,.sv-link:focus-visible,.sv-stage:focus-visible,.sv .btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
.sv-x{font-size:24px!important}.sv-z{min-width:52px;text-align:center;font-size:14px;color:#e7e0d0}.sv-sep{width:1px;height:22px;background:#ffffff33;margin:0 4px}.sv-link{color:#fff;font-size:14px;margin:0 6px}
.sv-main{flex:1;min-height:0;display:flex}.sv-stage{flex:1;min-width:0;overflow:auto;display:flex;background:#24211f;touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none}.sv-stage.drag{cursor:grabbing}
.sv-paper{margin:auto;flex:none;background:#fff;box-shadow:0 10px 50px #000a;position:relative}.sv-paper svg{display:block}.sv-load{color:#222;padding:40px;text-align:center;position:absolute;inset:0;margin:0;display:grid;place-items:center}
.sv-side{width:330px;flex:none;overflow:auto;padding:18px 20px;border-left:1px solid #ffffff22;background:#1f1c1a}.sv-side h3{margin:0 0 10px;font-size:16px}.sv-side ul{margin:0 0 14px;padding-left:18px;font-size:14.5px;line-height:1.5}.sv-side li{margin:0 0 8px}
.sv-note{font-size:13px;color:#cfc8b8;margin:0 0 16px}.sv-side .btn{display:block;text-align:center}.sv-keys{font-size:12px;color:#a8a191;margin:16px 0 0}
@media(max-width:860px){.sv-main{flex-direction:column}.sv-side{width:auto;max-height:38vh;border-left:0;border-top:1px solid #ffffff22}.sv-keys{display:none}.sv-link{display:none}}
@media(prefers-reduced-motion:reduce){.sv *{transition:none!important}}

/* one-line "how it works" directly under the home headline */
.how1{margin:14px 0 16px;font-size:15px;line-height:1.45;color:var(--mute)}.how1 b{color:var(--ink);font-weight:600}
@media(max-width:560px){.how1{font-size:14px;margin:8px 0 12px}}

/* Phone layout (2026-11-05): data showed phone visitors mostly saw the headline and left: 15 of 87 stayed 5 s, 4 tapped anything, 4 scrolled past half way (desktop: 76 of 93 stayed). Phone-only; desktop unchanged. */
.midcta{display:none}
@media(max-width:560px){
 body{font-size:16px}
 .hero{display:grid;gap:12px;padding:20px 0 24px}
 .hero>div:first-child{display:contents}
 .hero .eyebrow{order:1;margin:0}.hero h1{order:2;font-size:28px;line-height:1.15;margin:0}.hero .how1{order:3;margin:0}
 .hero .cta{order:4;flex-direction:column;align-items:stretch;gap:10px}.hero .cta .btn{width:100%;text-align:center;box-sizing:border-box}.hero .cta .btn.big{padding:15px 18px;font-size:17px}
 .hero .shot{order:5;margin:4px 0}.hero .trust{order:6;margin:4px 0 0;font-size:14px}.hero p.lead{order:7;font-size:16px;line-height:1.55;margin:4px 0 0}.hero small{order:8;margin-top:6px;font-size:12.5px}
 section{padding:34px 0}h2.sec{font-size:24px}.sub{font-size:16px;margin-bottom:20px}
 .gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0 -20px;padding:4px 20px 14px;-webkit-overflow-scrolling:touch}
 .gallery figure{flex:0 0 84%;scroll-snap-align:center}
 .midcta{display:block;text-align:center;margin-top:18px}.midcta .btn{display:block;box-sizing:border-box}.midcta small{display:block;color:var(--mute);margin-top:8px;font-size:13px}
 .grid3{gap:12px}.card{padding:16px}
}
@media(hover:none){.gallery figcaption .hint{font-size:0}.gallery figcaption .hint::after{content:"Tap to watch it being drawn";font-size:12px}}

/* Comparison table (2026-11-05) */
.cmp{width:100%;border-collapse:separate;border-spacing:0;background:var(--panel);border:1px solid var(--line);border-radius:14px;overflow:hidden;font-size:15px}
.cmp th,.cmp td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.cmp tbody tr:last-child th,.cmp tbody tr:last-child td{border-bottom:0}
.cmp thead th{background:#faf7f1;font-size:14px}.cmp thead th.us{background:var(--acc);color:#fff}
.cmp tbody th{width:17%;font-weight:600;color:var(--ink)}
.cmp td b{display:block;font-weight:650}.cmp td span{display:block;color:var(--mute);font-size:13.5px;margin-top:3px;line-height:1.45}
.cmp td.us{background:#80002008}
.cmpnote{margin:16px 0 6px;font-size:16px}.cmpsrc{color:var(--mute);font-size:12.5px;line-height:1.55;margin:0}
@media(max-width:860px){.cmp,.cmp tbody,.cmp tr,.cmp th,.cmp td{display:block}.cmp{border:0;background:none;overflow:visible}.cmp thead{display:none}
 .cmp tbody tr{background:var(--panel);border:1px solid var(--line);border-radius:14px;margin-bottom:12px;overflow:hidden}
 .cmp tbody th{width:auto;background:#faf7f1;padding:11px 16px;font-size:15px}
 .cmp td{padding:11px 16px 11px 16px;border-bottom:1px solid var(--line)}.cmp td:last-child{border-bottom:0}
 .cmp td:before{content:attr(data-l);display:block;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);font-weight:700;margin-bottom:3px}
 .cmp td.us:before{color:var(--acc)}}

/* revision card: three frames of one plan cross-fade; the badge names the revision */
.revbox{position:relative}.revbox img.rv{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;transition:opacity .7s ease}.revbox img.rv.on{opacity:1}
.revbadge{position:absolute;left:2.2cqw;top:2.2cqw;background:#800020;color:#fff;border-radius:1.8cqw;padding:1.3cqw 2.2cqw;font-size:2.9cqw;line-height:1.35;box-shadow:0 1cqw 3cqw #00000030;max-width:60%}.revbadge b{display:block;font-size:1.05em}.revbadge span{display:block;opacity:.92}
.revbadge.pop{animation:revpop .5s ease}@keyframes revpop{0%{transform:translateY(-6px);opacity:0}100%{transform:none;opacity:1}}
.revdots{position:absolute;left:0;right:0;bottom:8px;display:flex;justify-content:center;gap:7px}.revdots i{width:9px;height:9px;border-radius:50%;background:#c9c2b6;cursor:pointer;transition:background .3s,transform .3s}.revdots i.on{background:#800020;transform:scale(1.25)}
@media(prefers-reduced-motion:reduce){.revbox img.rv{transition:none}.revbadge.pop{animation:none}}

/* revision demo: focus box and the AI chat panel. Everything inside is sized in em from one font size, which comes from the width of the card (2.55cqw) or of the large sheet (1.5cqw) */
.revbox,.sv-paper{container-type:inline-size}
.revfocus{position:absolute;border:2px dashed #800020;background:#80002018;border-radius:3px;pointer-events:none;opacity:0;transform:scale(1.08);transition:opacity .35s,transform .35s,left .6s,top .6s,width .6s,height .6s;z-index:3}.revfocus.on{opacity:1;transform:none}
.revchat{position:absolute;left:66.5%;right:1.5%;top:13%;bottom:2.2%;display:flex;flex-direction:column;background:#fff;border:1px solid #d8d2c6;border-radius:1em;box-shadow:0 .25em 1.2em #3b2a1a2e;font-size:2.55cqw;line-height:1.3;z-index:4;overflow:hidden;color:#2a2118}
.rc-h{padding:.6em .8em;border-bottom:1px solid #e6e0d4}.rc-h b{font-size:1em}
.rc-log{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;gap:.45em;padding:.6em;overflow:hidden}
.rc-b{border-radius:.7em;padding:.45em .65em;max-width:96%;animation:revpop .35s ease}.rc-b.me{align-self:flex-end;background:#800020;color:#fff}.rc-b.ai{align-self:flex-start;background:#f3eee4}.rc-b b{display:block;color:#1d5c2b}
.rc-b ul{margin:.2em 0 0;padding-left:1.1em}.rc-b li{margin:.12em 0;animation:revpop .35s ease}
.rc-dots i{display:inline-block;width:.38em;height:.38em;border-radius:50%;background:#800020;margin:0 .15em;animation:revdot 1s infinite ease-in-out}.rc-dots i:nth-child(2){animation-delay:.15s}.rc-dots i:nth-child(3){animation-delay:.3s}
@keyframes revdot{0%,80%,100%{opacity:.25;transform:scale(.8)}40%{opacity:1;transform:scale(1.1)}}
.rc-chip{display:none;align-self:flex-start;margin:0 .6em .4em;white-space:nowrap;background:#80002014;color:#800020;border-radius:999px;padding:.16em .63em;font-size:.9em;font-weight:600}.rc-chip.on{display:inline-block;animation:revpop .4s ease}
.rc-in{display:flex;align-items:center;gap:.47em;border-top:1px solid #e6e0d4;padding:.5em .6em}
.rc-txt{flex:1;min-width:0;color:#2a2118;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rc-txt.ph{color:#8b8272}.rc-txt.typing::after{content:"";display:inline-block;width:1px;height:1em;background:#800020;margin-left:1px;vertical-align:-.15em;animation:revblink .8s steps(1) infinite}
.rc-send{flex:0 0 auto;width:1.8em;height:1.8em;border-radius:50%;background:#800020;color:#fff;display:grid;place-items:center;font-size:1em;transition:transform .2s}.rc-send.hit{transform:scale(.8);background:#5e0017}
.revbadge{font-size:2.9cqw}.revbadge{left:.8em;top:.8em;padding:.45em .75em;border-radius:.6em;box-shadow:0 .3em 1em #00000030}
.sv-paper .revchat{font-size:1.45cqw}.sv-paper .revbadge{font-size:1.7cqw}
@keyframes revblink{50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.revfocus{transition:none}}

/* viewer: revision demo frames stack inside the paper */
.sv-paper svg.rvf{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .7s ease}.sv-paper svg.rvf.on{opacity:1}


/* bottom-docked chat panel (member detail sheet: its content sits in the upper part of the paper) */
.revchat.bottom{left:2%;right:2%;top:57%;bottom:2.2%}.revchat.bottom .rc-log{justify-content:flex-start}
.sv-paper .revchat.bottom{font-size:1.45cqw}
.revbox .gsvg,.gimg .gsvg{background:#fff}

.gallery .gimg{container-type:inline-size}
.revchat.bottom{top:55%}.revchat.bottom .rc-h{display:none}.revchat.bottom .rc-log{flex-direction:row;align-items:flex-start;justify-content:flex-start;gap:.6em}
.revchat.bottom .rc-b.me{flex:0 0 33%;align-self:flex-start}.revchat.bottom .rc-b.ai{flex:1;align-self:flex-start}
.revchat.tall{top:6%}.revchat.bottom{top:52%}

/* Feedback dialog on the home page (2026-11-05) */
.fbov{position:fixed;inset:0;z-index:80;background:#1d1b1880;display:flex;align-items:center;justify-content:center;padding:16px}.fbov[hidden]{display:none}
.fbbox{position:relative;background:#fffdf8;color:var(--ink);border-radius:14px;max-width:460px;width:100%;max-height:92vh;overflow:auto;padding:22px 22px 18px;box-shadow:0 20px 60px #0004}
.fbbox h2{margin:0 0 6px;font-size:21px}.fbbox label{display:block;font-weight:600;font-size:14px;margin:12px 0 4px}.fbbox select,.fbbox textarea,.fbbox input[type=email]{width:100%;box-sizing:border-box;font:inherit;font-size:16px;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:#fff}
.fbx{position:absolute;right:10px;top:6px;border:0;background:none;font-size:26px;line-height:1;cursor:pointer;color:var(--mute)}
.fbrow{display:flex;align-items:center;gap:10px;margin-top:14px}.fbrow .mut{flex:1;font-size:13px}.fbbox [hidden]{display:none}
.foot a.fblink{cursor:pointer}

/* Phone layout, round 2 (2026-11-05): the page was about 11,000 px long on a phone (13 screens). Long card stacks become swipe rows, the comparison starts short, buttons and links are thumb-sized. */
.cmpmore{display:none}
@media(max-width:560px){
 #how .grid3,#inside .grid3,#who .grid3,#who .grid2,#inside .grid2{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;margin:0 -20px;padding:2px 20px 14px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
 #how .grid3::-webkit-scrollbar,#inside .grid3::-webkit-scrollbar,#who .grid3::-webkit-scrollbar,#who .grid2::-webkit-scrollbar,#inside .grid2::-webkit-scrollbar{display:none}
 #how .grid3>.card,#inside .grid3>.card,#who .grid3>.card,#who .grid2>.card,#inside .grid2>.card{flex:0 0 82%;scroll-snap-align:center;box-sizing:border-box}
 #how h2.sec:after,#inside h2.sec:after,#who h2.sec:after{content:"Swipe \2192";display:block;font-size:12px;font-weight:600;color:var(--acc);letter-spacing:.04em;margin-top:4px}
 .cmp tbody tr:nth-child(n+3){display:none}.cmp.open tbody tr:nth-child(n+3){display:block}
 .cmpmore{display:block;width:100%;box-sizing:border-box;margin:4px 0 12px;padding:13px 16px}
 .price{display:flex;flex-direction:column}.price .card.hi{order:-1}
 .faq details{padding:0}.faq summary{padding:16px 18px;min-height:24px;list-style-position:inside}.faq details p{padding:0 18px 16px;margin:0}
 .foot{flex-direction:column;align-items:flex-start;gap:4px}.foot a{display:inline-block;margin:0 18px 0 0;padding:11px 0}
 .btn.sm{padding:9px 14px}.top nav .btn{min-height:40px;box-sizing:border-box;display:inline-flex;align-items:center}
 .hero .trust{gap:4px 14px}.midcta .btn,.cta .btn{min-height:48px}
}

/* language switcher (2026-11-05) */
.langsel{font:inherit;font-size:14px;color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:8px;padding:5px 8px;cursor:pointer;max-width:120px}
.langnav{margin-right:4px}.langfoot{margin-left:16px}
@media(max-width:860px){.langnav{display:none}.langfoot{margin:6px 0 0;min-height:44px;font-size:16px}}
/* CJK line breaking (2026-11-05): break between phrases, not in the middle of a word */
:lang(ja),:lang(zh-Hans){line-break:strict;word-break:auto-phrase}
:lang(ja) h1,:lang(ja) h2,:lang(zh-Hans) h1,:lang(zh-Hans) h2{text-wrap:balance}
:lang(de) h1,:lang(de) h2,:lang(de) .btn,:lang(de) .cmp td b{hyphens:auto;overflow-wrap:anywhere}

/* phones: the chat panel sits below the drawing at normal size instead of on top of it */
.rc-b ul{padding-left:1.35em}.rc-b li{padding-left:.1em}
.sv-chat:empty{display:none}
.revchat.docked{position:static;left:auto;right:auto;top:auto;bottom:auto;margin:10px 12px 14px;font-size:14px;max-height:36vh;box-shadow:none;border-radius:12px}
.revchat.docked .rc-log{justify-content:flex-start;min-height:7em;overflow:auto}
.revchat.docked.bottom .rc-h{display:block}.revchat.docked.bottom .rc-log{flex-direction:column}.revchat.docked.bottom .rc-b.me{flex:0 0 auto}
.revchat.docked .rc-b{max-width:100%}
.sv-chat .revchat.docked{margin:8px 12px;max-height:30vh}
@media(max-width:860px){.sv-side{max-height:24vh}}

.gallery figure .revchat.docked{max-height:none;min-height:15em;margin:10px 12px 8px}.gallery figure .revchat.docked .rc-log{overflow:visible}
.sv-chat .revchat.docked{font-size:13px;max-height:32vh}.sv-chat .revchat.docked .rc-log{overflow:auto;min-height:5em}
@media(max-width:860px){.sv-side{max-height:20vh}}

/* Submission pack section (2026-11-05) */
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0 0 14px}
.chips li{background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-weight:600;font-size:15px}
#submission .cmpsrc{max-width:46em}

.subgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}.subcard{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px 20px}.subcard h3{margin:0 0 8px;font-size:17px}.subk{margin:12px 0 4px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--mute,#6f6a60)}.subcard ul{margin:0;padding-left:18px}.subcard li{margin:3px 0;font-size:15px;line-height:1.45}@media(max-width:760px){.subgrid{grid-template-columns:1fr}}

/* Submission pack card in the sample gallery (2026-11-06) */
.subbox{position:relative;container-type:inline-size;background:#fff}
.subbox img.sp{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top;opacity:0;transition:opacity .7s ease}.subbox img.sp.on{opacity:1}
.subbadge{position:absolute;left:.8em;top:.8em;background:#800020;color:#fff;border-radius:.6em;padding:.45em .75em;font-size:2.9cqw;line-height:1.35;box-shadow:0 .3em 1em #00000030;max-width:80%;z-index:2}.subbadge b{display:block;font-size:1.05em}.subbadge span{display:block;opacity:.92}
.subbadge.pop{animation:revpop .5s ease}
.subfig{cursor:pointer}
.sublb{position:fixed;inset:0;z-index:90;background:#1d1b18d9;display:flex;align-items:center;justify-content:center;padding:16px}.sublb[hidden]{display:none}
.sublb-box{position:relative;background:#fffdf8;color:var(--ink);border-radius:14px;max-width:980px;width:100%;max-height:94vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 70px #0006}
.sublb-top{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line)}
.sublb-tabs{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;flex:1}.sublb-tabs::-webkit-scrollbar{display:none}
.sublb-tabs button{flex:none;font:inherit;font-size:14px;font-weight:600;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 13px;cursor:pointer;white-space:nowrap}.sublb-tabs button[aria-selected=true]{background:var(--acc);border-color:var(--acc);color:#fff}
.sublb-x{flex:none;font:inherit;font-size:26px;line-height:1;border:0;background:none;cursor:pointer;color:var(--mute);width:40px;height:40px}
.sublb-body{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;padding:16px;overflow:auto}
.sublb-img{border:1px solid var(--line);border-radius:10px;background:#fff;overflow:hidden}.sublb-img img{display:block;width:100%;height:auto}
.sublb h3{margin:0 0 4px;font-size:21px}.sublb h3 small{display:block;font-size:14px;font-weight:500;color:var(--mute);margin-top:3px}
.sublb .substat{list-style:none;padding:0;margin:12px 0 6px;display:grid;gap:8px}.sublb .substat li{display:flex;align-items:center;gap:12px;font-size:15px}
.sublb .substat b{flex:none;min-width:32px;text-align:center;background:#80002010;color:var(--acc);border-radius:8px;padding:4px 0;font-size:16px}
.sublb .subk{margin:14px 0 6px;font-size:12px;letter-spacing:.07em;text-transform:uppercase;font-weight:700;color:var(--mute)}
.sublb .subex{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}.sublb .subex li{background:#fff;border:1px solid var(--line);border-radius:999px;padding:4px 11px;font-size:13px}
.sublb .subnote{font-size:13px;color:var(--mute);margin:14px 0 0;line-height:1.5}
.sublb-nav{display:flex;gap:8px;margin-top:14px}.sublb-nav button{font:inherit;font-size:18px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:#fff;cursor:pointer}
@media(max-width:760px){.sublb-body{grid-template-columns:1fr}.sublb-img{order:2}}
@media(prefers-reduced-motion:reduce){.subbox img.sp{transition:none}.subbadge.pop{animation:none}}

/* Rotating feature gallery in "See a real set" (2026-11-06): the cards sit in one scrolling row (3 at a time on a desktop, swipeable on a phone) that advances by itself */
.fgal{position:relative}
#samples .gallery{display:flex;grid-template-columns:none;gap:22px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;padding:8px 4px 20px;margin:0 -4px;-webkit-overflow-scrolling:touch}
#samples .gallery::-webkit-scrollbar{display:none}
#samples .gallery figure{flex:0 0 calc((100% - 44px)/3);min-width:0;scroll-snap-align:start;cursor:default}
#samples .gallery figure[data-sheet]{cursor:pointer}
#samples .gallery figure:hover,#samples .gallery figure:focus-visible,#samples .gallery figure.playing{transform:translateY(-3px);box-shadow:0 14px 34px #3b2a1a1c}
@media(max-width:860px){#samples .gallery{gap:12px;margin:0 -20px;padding:4px 20px 14px}#samples .gallery figure{flex:0 0 84%}}
.fgal-ctl{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:2px}
.fgal-nav{font:inherit;font-size:18px;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer}.fgal-nav:hover:not(:disabled){background:#fff}.fgal-nav:disabled{opacity:.35;cursor:default}
.fgal-dots{display:flex;gap:8px;align-items:center}.fgal-dots button{width:9px;height:9px;padding:0;border-radius:50%;border:0;background:var(--line);cursor:pointer;transition:background .25s,transform .25s}.fgal-dots button.on{background:var(--acc);transform:scale(1.25)}
.gallery figcaption .ftag{display:inline-block;margin:0 0 6px;padding:2px 9px;border-radius:999px;background:var(--acc);color:#fff;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.fxnew{box-shadow:0 8px 26px #3b2a1a10,0 0 0 2px #80002033}
.fxfig .gimg{position:relative;background:#fffdf8}
/* animated scenes */
.fx-scene{position:absolute;inset:0;display:grid;grid-template-columns:46% 54%;font-size:3.1cqw;color:#1b1b1b;transition:opacity .45s}.fx-scene.fade{opacity:0}
.fx-left{display:grid;place-items:center;padding:2cqw 0 0 2cqw}.fx-svg{width:100%;height:auto;max-height:100%;overflow:visible}
.fx-rot{transform-origin:100px 100px;transform-box:view-box;transition:transform .35s ease}
.fx-t{font:500 9px/1 system-ui,sans-serif;fill:#444}.fx-b{font-weight:700;fill:#111;font-size:9.5px}.fx-ang{fill:#800020;font-weight:700}
.fx-svg circle{transition:r .3s,cx .3s,cy .3s,fill .3s}
.fx-panel{margin:2.4cqw 2.6cqw 2.4cqw 1.2cqw;padding:2cqw 2.4cqw;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:2cqw;box-shadow:0 1cqw 3cqw #3b2a1a14;display:flex;flex-direction:column;gap:1cqw;min-width:0}
.fx-panel.shake{animation:fxshake .45s}@keyframes fxshake{20%{transform:translateX(-5px)}45%{transform:translateX(5px)}70%{transform:translateX(-3px)}}
.fx-h{font-weight:700;font-size:3.2cqw}
.fx-row{display:flex;align-items:center;justify-content:space-between;gap:1.5cqw}.fx-row>span{color:var(--mute);font-size:2.6cqw;white-space:nowrap}
.fx-stp{display:flex;align-items:center;gap:.8cqw}.fx-stp b,.fx-sel{border:1px solid var(--line);border-radius:1.2cqw;background:#fff;font-weight:600;display:grid;place-items:center;transition:background .15s,color .15s,transform .15s}
.fx-stp b{width:5cqw;height:5cqw;font-size:3.3cqw;line-height:1}.fx-stp i{font-style:normal;min-width:6.5cqw;text-align:center;font-weight:700}
.fx-sel{display:flex;align-items:center;white-space:nowrap;padding:.7cqw 1.8cqw;min-width:10cqw;font-size:2.6cqw}.fx-sel::after{content:"\25be";margin-left:1cqw;color:var(--mute)}
.fx-stp b.hit,.fx-sel.hit{background:var(--ink);color:#fff;transform:scale(.94)}
.fx-pill{padding:1.1cqw 1.8cqw;border-radius:1.2cqw;font-size:2.5cqw;line-height:1.25;font-weight:600;transition:background .3s,color .3s}.fx-pill.ok{background:#e7f3ea;color:#23603a}.fx-pill.bad{background:#fbe6e6;color:#a02020}
.fx-steel{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 1.2cqw;font-size:2.5cqw}.fx-steel span{color:var(--mute)}.fx-steel b{font-size:3.2cqw}.fx-steel small{flex-basis:100%;color:#23603a;font-weight:600;min-height:1.2em}
.fx-msg{display:none;font-size:2.3cqw;line-height:1.35;color:#a02020;background:#fff4f2;border:1px solid #f0c6c0;border-radius:1.3cqw;padding:1.3cqw 1.8cqw}.fx-msg.on{display:block;animation:fxin .3s}
.fx-apply{margin-top:auto;text-align:center;padding:1.3cqw;border-radius:1.2cqw;background:var(--acc);color:#fff;font-weight:600;font-size:2.7cqw;transition:transform .15s,opacity .2s}.fx-apply.hit{transform:scale(.95)}.fx-apply.off{opacity:.35}
.fx-done{list-style:none;margin:auto 0 0;padding:0;max-height:0;overflow:hidden;opacity:0;font-size:2.5cqw;line-height:1.5;color:#23603a;transition:max-height .4s,opacity .4s}.fx-done.on{max-height:14cqw;opacity:1}.fx-panel.fin .fx-apply{display:none}.fx-done li::before{content:"\2713  ";font-weight:700}
@keyframes fxin{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.fx-cur{position:absolute;left:0;top:0;width:4.6cqw;height:5.5cqw;pointer-events:none;opacity:0;transform:translate(70%,120%);transition:transform .75s cubic-bezier(.4,.1,.2,1),opacity .3s;z-index:3;filter:drop-shadow(0 1px 2px #0004)}.fx-cur.on{opacity:1}
/* whole-set card */
.fx-set{display:block;background:#fff}.fx-sheet{position:absolute;inset:6% 7% 14%;width:86%;height:80%;object-fit:contain;opacity:0;transform:translateY(5%) scale(.97);transition:opacity .5s,transform .6s;border:1px solid var(--line);box-shadow:0 1.4cqw 4cqw #3b2a1a22;background:#fff}.fx-sheet.on{opacity:1;transform:none}
.fx-chip{position:absolute;left:4cqw;top:3cqw;background:var(--ink);color:#fff;border-radius:1.4cqw;padding:1.1cqw 2.4cqw;display:flex;gap:1.8cqw;align-items:baseline;font-size:2.9cqw;z-index:2}.fx-chip b{font-size:3.4cqw}.fx-chip.pop{animation:fxin .4s}
.fx-fmts{position:absolute;left:0;right:0;bottom:2.4cqw;display:flex;justify-content:center;gap:1.6cqw;z-index:2}.fx-fmts i{font-style:normal;font-size:2.7cqw;font-weight:700;border:1px solid var(--line);background:#fff;border-radius:1.2cqw;padding:.8cqw 2.2cqw;opacity:0;transform:translateY(40%);transition:opacity .35s,transform .35s}.fx-fmts i.on{opacity:1;transform:none;border-color:var(--acc);color:var(--acc)}
@media(prefers-reduced-motion:reduce){.fx-scene,.fx-rot,.fx-svg circle,.fx-cur,.fx-sheet,.fx-fmts i,.fx-done{transition:none}.fx-panel.shake,.fx-msg.on,.fx-chip.pop{animation:none}}
@media(hover:none){.fxfig .hint{font-size:12px!important}.fxfig .hint::after{content:none!important}}

/* Gallery controls, quieter (2026-11-06): borderless arrows and a thin segmented progress bar instead of round buttons and dots */
.fgal-ctl{gap:6px;margin-top:6px}
.fgal-nav{width:40px;height:40px;border:0;background:transparent;font-size:21px;color:var(--mute);border-radius:8px;transition:color .2s}
.fgal-nav:hover:not(:disabled){background:transparent;color:var(--acc)}.fgal-nav:disabled{opacity:.25}
.fgal-dots{gap:5px}
.fgal-dots button{width:30px;height:3px;padding:11px 0;box-sizing:content-box;border-radius:0;background-color:var(--line);background-clip:content-box;transform:none;transition:background-color .3s}
.fgal-dots button.on{background-color:var(--acc);background-clip:content-box;transform:none}
.fgal-dots button:focus-visible{outline-offset:0}

/* Phone: the sample cards are centred. One card (86% wide) sits in the middle with an equal sliver of its neighbours on each side (2026-11-06) */
@media(max-width:860px){#samples .gallery{margin:0 -20px;padding:4px 8vw 14px;gap:10px;scroll-padding-inline:8vw}#samples .gallery figure{flex:0 0 84vw;scroll-snap-align:center;scroll-snap-stop:always}}

/* Floor capacity preview card in the sample gallery (2026-11-06) */
.capbox{position:relative;width:100%;aspect-ratio:1.35;overflow:hidden;container-type:inline-size;background:#fff}
.cpsvg{position:absolute;inset:0;width:100%;height:100%;display:block;border:0;border-radius:0}
.cprooms{transition:opacity .6s}
.cppill{position:absolute;left:3cqw;top:3cqw;z-index:3;background:#fff;color:#800020;border:1.5px solid #800020;border-radius:2cqw;font-size:3cqw;font-weight:700;padding:.9cqw 2.6cqw;box-shadow:0 1cqw 3cqw #0002;transition:background .3s,color .3s}.cppill.on{background:#800020;color:#fff}
.cppanel{position:absolute;right:2.2cqw;top:2.2cqw;bottom:2.2cqw;width:38cqw;background:rgba(255,253,248,.97);border:1px solid #ddd6c8;border-radius:2cqw;box-shadow:0 1.6cqw 5cqw #0003;padding:2.2cqw 2.4cqw;font-size:2.55cqw;line-height:1.35;color:#1d1b18;opacity:0;transform:translateX(3cqw);transition:opacity .4s,transform .4s;z-index:3;overflow:hidden;display:flex;flex-direction:column;gap:1.5cqw}
.cppanel.on{opacity:1;transform:none}.cppanel b{font-size:3.1cqw;display:block}.cppanel p{margin:0;color:#6f6a60}
.cpa{background:#efe9db;border-radius:1.6cqw;padding:1.3cqw 1.8cqw;align-self:flex-start}.cpu{background:#800020;color:#fff;border-radius:1.8cqw;padding:1.3cqw 1.9cqw;align-self:flex-end;min-height:1em}
.cpq{display:flex;flex-wrap:wrap;gap:1.2cqw}.cpq i{font-style:normal;border:1px solid #800020;color:#800020;border-radius:99px;padding:.6cqw 1.6cqw;font-weight:600;font-size:2.3cqw;transition:background .2s,color .2s}.cpq i.hit{background:#800020;color:#fff}
.cpg{border:1px solid #ddd6c8;border-left:1cqw solid #e09a1a;border-radius:1.6cqw;padding:1.5cqw 1.8cqw;background:#fff}.cpg strong{display:block;font-size:4cqw;letter-spacing:-.01em}.cpg span{display:block;color:#6f6a60;font-size:2.2cqw;margin:.6cqw 0 1.2cqw}.cpg u{text-decoration:none;display:inline-block;background:#800020;color:#fff;border-radius:1.4cqw;padding:.8cqw 1.8cqw;font-weight:700}
.cpv{border-radius:1.8cqw;padding:1.5cqw 1.8cqw;font-weight:700;font-size:2.8cqw}.cpv i{display:inline-block;width:2.2cqw;height:2.2cqw;border-radius:50%;margin-right:1.2cqw;vertical-align:-.2cqw}.cpv span{display:block;font-weight:400;color:#4b463d;font-size:2.3cqw;margin-top:.5cqw}
.cpv.bad{background:#fcebe9}.cpv.bad i{background:#b3261e}.cpv.ok{background:#eaf4ee}.cpv.ok i{background:#2e7d4f}
.cpb{background:#800020;color:#fff;border-radius:1.6cqw;padding:1.4cqw 1.6cqw;text-align:center;font-weight:700}
.cpr{background:#fff0f6;border:1px solid #f3b8d1;border-radius:1.6cqw;padding:1.4cqw 1.8cqw;color:#1d1b18;font-size:2.3cqw}.cpr b{display:inline;color:#d6246e;font-size:2.6cqw;margin-right:1cqw}
.cptag{position:absolute;left:3cqw;bottom:3cqw;z-index:3;background:#d6246e;color:#fff;border-radius:99px;font-weight:700;font-size:2.7cqw;padding:.8cqw 2.4cqw;opacity:0;transform:translateY(2cqw);transition:opacity .4s,transform .4s}.cptag.on{opacity:1;transform:none}
.cpcur{position:absolute;width:5cqw;height:6cqw;z-index:6;pointer-events:none;transition:left .9s cubic-bezier(.4,.1,.2,1),top .9s cubic-bezier(.4,.1,.2,1);left:70%;top:110%;opacity:0;filter:drop-shadow(0 .4cqw .6cqw #0006)}.cpcur.on{opacity:1}
.cpcur.hit::after{content:"";position:absolute;left:-2cqw;top:-2cqw;width:6cqw;height:6cqw;border:.7cqw solid #800020;border-radius:50%;animation:cprip .5s ease-out forwards}@keyframes cprip{from{opacity:1;transform:scale(.4)}to{opacity:0;transform:scale(1.6)}}
@media(prefers-reduced-motion:reduce){.cppanel,.cptag,.cprooms{transition:none}}

/* Gallery controls on a desktop (2026-11-06): big round arrows at the left and right edge of the row, vertically centred; no bar under the cards. Touch screens keep the swipe row and the thin progress bar. */
@media(hover:hover) and (min-width:861px){
.fgal-ctl{display:contents}
.fgal-dots{display:none}
.fgal-nav{position:absolute;top:calc(50% - 34px);z-index:8;width:54px;height:54px;border-radius:50%;border:1px solid var(--line);background:#fffdf8;color:var(--ink);box-shadow:0 8px 24px #3b2a1a33;font-size:0;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .18s,background .18s,box-shadow .18s,opacity .2s}
.fgal-nav::before{content:"";width:12px;height:12px;border-top:2.5px solid currentColor;border-right:2.5px solid currentColor;display:block}
.fgal-ctl>.fgal-nav:first-child{left:-27px}.fgal-ctl>.fgal-nav:first-child::before{transform:rotate(-135deg);margin-left:5px}
.fgal-ctl>.fgal-nav:last-child{right:-27px}.fgal-ctl>.fgal-nav:last-child::before{transform:rotate(45deg);margin-right:5px}
.fgal-nav:hover:not(:disabled){background:var(--acc);color:#fff;border-color:var(--acc);transform:scale(1.08);box-shadow:0 12px 30px #80002040}
.fgal-nav:disabled{opacity:0;pointer-events:none}
.fgal-nav:focus-visible{outline:3px solid #80002055;outline-offset:3px}
}
@media(hover:hover) and (min-width:861px) and (max-width:1180px){.fgal-ctl>.fgal-nav:first-child{left:-12px}.fgal-ctl>.fgal-nav:last-child{right:-12px}.fgal-nav{width:48px;height:48px}}

.fx-cap{position:absolute;left:0;right:0;bottom:0;padding:2.6cqw 4cqw;background:linear-gradient(transparent,#fffdf8 38%);font-size:3.1cqw;font-weight:600;text-align:center;color:#1b1b1b;z-index:2}.fx-cap.pop{animation:fxin .4s}.fxfig[data-fx=structure] .fx-sheet{inset:11% 5% 14%;width:90%;height:75%}

/* move-a-pillar card */
.fx-mv{background:#fff}.fx-mvsvg{position:absolute;left:0;top:0;width:100%;height:76%}
.fx-pg{transition:transform .9s cubic-bezier(.4,.1,.2,1)}
.fx-pg .fx-sel,.fx-pg .fx-tag,.fx-pg .fx-tagt{opacity:0;transition:opacity .25s}.fx-pg.picked .fx-sel,.fx-pg.picked .fx-tag,.fx-pg.picked .fx-tagt{opacity:1}
.fx-tagt{font:700 3px/1 system-ui,sans-serif;fill:#fff}
.fx-ghost{opacity:0;transition:opacity .3s}.fx-ghost.on{opacity:1}.fx-ghost:not(.on) rect:first-child,.fx-ghost:not(.on) line{display:none}
.fx-chat{position:absolute;left:3cqw;right:3cqw;bottom:2.4cqw;z-index:2;font-size:3cqw}
.fx-rep{min-height:7cqw;margin-bottom:1.4cqw;background:#f4eee6;border-radius:2cqw;padding:1.6cqw 2.6cqw;color:#1b1b1b;opacity:0;transition:opacity .3s}.fx-rep.on{opacity:1}
.fx-in{display:flex;align-items:center;gap:2cqw;background:#fff;border:.4cqw solid var(--line);border-radius:2cqw;padding:1.3cqw 1.6cqw 1.3cqw 2.6cqw;min-height:6.5cqw}
.fx-typed{flex:none;color:#1b1b1b}.fx-caret{flex:1;border-left:.35cqw solid #800020;height:3.4cqw;margin-left:.3cqw;max-width:0;animation:fxcar 1s steps(1) infinite}@keyframes fxcar{50%{border-color:transparent}}
.fx-send{margin-left:auto;background:#800020;color:#fff;border-radius:1.6cqw;padding:1cqw 2.6cqw;font-size:2.8cqw}.fx-send.hit{transform:scale(.93)}
.fx-mv .fx-chip{display:none}

/* sample viewer: 'Try it on your own plan' sits first in the side panel so it is seen without scrolling, also on a phone */
.sv-side .sv-own{margin:0 0 6px;font-weight:700}.sv-ownh{font-size:12.5px;color:#cfc8b8;margin:0 0 14px}@media(max-width:860px){.sv-ownh{display:none}.sv-side .sv-own{margin-bottom:10px}}
#samples .gallery figure[data-keephint] figcaption::after{content:"Click the card to open the full sheet";display:block;margin-top:6px;font-size:12.5px;font-weight:600;color:#800020}
#samples .gallery figure[data-keephint]:hover .gimg{box-shadow:0 6px 22px #0003}

/* How it works: on phones the free-try button is the 4th swipe card; on desktop it stays a button under the row (2026-11-09) */
.how4{display:none}
@media(max-width:560px){.how4{display:block}#how .howcta{display:none}.how4 .btn{margin-top:6px}}

/* "What's in every set" on phones: a compact tap-to-open list, plus a try button (2026-11-09) */
.insidecta{display:none}
@media(max-width:560px){
 #inside .grid3{display:block;overflow:visible;margin:0;padding:0;scroll-snap-type:none}
 #inside .grid3>.card{display:block;flex:none;margin:0 0 8px;padding:0;cursor:pointer}
 #inside .grid3>.card h3{margin:0;padding:14px 44px 14px 16px;font-size:16px;position:relative}
 #inside .grid3>.card h3:after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:22px;font-weight:400;color:var(--acc)}
 #inside .grid3>.card.open h3:after{content:"\2212"}
 #inside .grid3>.card p{display:none;margin:0;padding:0 16px 14px;font-size:14.5px}
 #inside .grid3>.card.open p{display:block}
 #inside h2.sec:after{content:"Tap a line to open it"}
 .insidecta{display:block}
}

/* Home free try box (2026-11-09): prompt box in the hero runs a real free drawing in place. */
.trybox{background:var(--panel);border:1.5px solid var(--acc);border-radius:14px;padding:16px;box-shadow:0 10px 30px #80002018;max-width:520px;margin:2px 0 0}
.tb-h{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}.tb-h b{font-size:17px;color:var(--acc);letter-spacing:-.01em}.tb-h span{font-size:13.5px;color:var(--mute)}
.tb-l{display:block;font-size:13px;font-weight:600;margin:0 0 6px;color:var(--ink)}
.trybox textarea{display:block;width:100%;font:16px/1.45 inherit;font-family:inherit;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:10px;padding:12px 13px;resize:none;min-height:84px;-webkit-appearance:none;appearance:none}
.trybox textarea:focus{outline:0;border-color:var(--acc);box-shadow:0 0 0 3px #80002020}
.tb-cnt{font-size:12px;color:var(--mute);text-align:right;margin:4px 2px 0}.tb-cnt.over{color:var(--err);font-weight:700}
.tb-ex{display:flex;gap:8px;overflow-x:auto;margin:8px -16px 12px;padding:2px 16px 4px;scroll-snap-type:x proximity;scroll-padding-left:16px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.tb-ex::-webkit-scrollbar{display:none}
.tb-ex button{flex:0 0 auto;scroll-snap-align:start;min-height:38px;padding:0 14px;border:1px solid var(--line);background:#fff;border-radius:99px;font:500 14px inherit;font-family:inherit;color:var(--ink);cursor:pointer;white-space:nowrap}
.tb-ex button:hover,.tb-ex button:active{border-color:var(--acc);color:var(--acc);background:#80002008}
.tb-go{display:block;width:100%;min-height:52px;font-size:17px;text-align:center;border-radius:10px;box-shadow:0 4px 14px #80002030}
.tb-go[disabled]{opacity:.55;box-shadow:none}
.tb-more{display:block;text-align:center;font-size:13.5px;margin-top:11px;color:var(--mute)}
.ft-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.shot .res{display:none}.shot .res.on{display:block}.shot.has-res .genbar,.shot.has-res .gsheet,.shot.has-res .gprog{display:none}
.rmsg{padding:18px 16px;font-size:15px;line-height:1.5}.rmsg b{display:block;font-size:16px;margin-bottom:3px}.rmsg.bad b{color:var(--err)}.rmsg small{display:block;color:var(--mute);margin-top:8px;font-size:13px}
.rbar{height:5px;background:#eee8dc;border-radius:3px;overflow:hidden;margin:12px 0 0}.rbar i{display:block;height:100%;width:4%;background:var(--acc);transition:width .7s ease}
.rtabs{display:flex;gap:6px;padding:10px 12px;border-bottom:1px solid var(--line);overflow-x:auto;background:#faf7f1;scrollbar-width:none}.rtabs::-webkit-scrollbar{display:none}
.rtabs button{flex:0 0 auto;min-height:36px;padding:0 12px;border:1px solid var(--line);background:#fff;border-radius:8px;font:600 13px inherit;font-family:inherit;color:var(--ink);cursor:pointer;white-space:nowrap}
.rtabs button small{color:var(--mute);font-weight:500}.rtabs button.on{background:var(--acc);border-color:var(--acc);color:#fff}.rtabs button.on small{color:#ffffffcc}
.rimg{background:#fff;max-height:min(70vh,520px);overflow:auto}.rimg img{display:block;width:100%;height:auto}
.rfull{display:flex;flex-wrap:wrap;gap:4px 12px;justify-content:space-between;padding:9px 14px;font-size:12.5px;color:var(--mute);border-top:1px solid var(--line)}.rfull a{font-weight:600}
.rcta{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-top:1px solid var(--line);background:#faf7f1;font-size:14px}.rcta .btn{flex:0 0 auto;padding:10px 16px}
.trybar{display:none}
@media(max-width:860px){
 .trybar:not([hidden]){display:flex;position:fixed;left:0;right:0;bottom:0;z-index:20;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--panel);border-top:1px solid var(--line);box-shadow:0 -6px 20px #3b2a1a1a;font-size:14px;font-weight:600}
 .trybar .btn{flex:0 0 auto;min-height:44px;display:flex;align-items:center;padding:0 20px}
}
@media(max-width:560px){
 .hero .trybox{order:4;max-width:none;margin:2px 0;padding:14px;border-radius:16px}
 .hero .shot{scroll-margin-top:68px}
 .rcta{flex-direction:column;align-items:stretch;text-align:center}.rcta .btn{display:block;text-align:center;min-height:46px;line-height:26px}
}
@media(prefers-reduced-motion:reduce){.rbar i{transition:none}}
.hero>*,.trybox{min-width:0}
@media(max-width:860px){.hero{grid-template-columns:minmax(0,1fr)}}
@media(min-width:861px){.hero{padding:44px 0 40px;gap:44px}.hero h1{font-size:clamp(34px,3.6vw,44px)}.hero p.lead{font-size:17px;margin-bottom:20px}.trybox textarea{min-height:68px}.trybox{padding:14px 16px}.tb-ex{margin-bottom:10px}}
/* desktop alignment (2026-11-09): picture panel starts level with the headline and stays in view beside the box */
@media(min-width:861px){.hero{align-items:start;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr)}.hero h1{font-size:clamp(32px,3.3vw,44px);margin-bottom:12px}.hero .shot{position:sticky;top:92px;margin-top:22px}}
