:root{--ink:#333333;--muted:#6e6e6e;--paper:#f9f9f9;--line:#e1e1e1;--green:#4e4e4e;--accent:#707070;--soft:#f0f0f0;--white:#ffffff;--radius:18px;font-family:var(--font-text);color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}a{color:inherit}button,a,input,summary{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #777777;outline-offset:4px}button{cursor:pointer}button:disabled{opacity:.45;cursor:default}.wrap{max-width:1152px;margin:auto;padding:0 28px}.skip{position:absolute;left:-10000px}.skip:focus{left:20px;top:10px;background:white;z-index:5;padding:12px}
header{border-bottom:1px solid var(--line);background:#f9f9f9f2}header .wrap{display:flex;align-items:center;justify-content:space-between;min-height:84px;gap:24px}.brand{text-decoration:none;font-weight:800;letter-spacing:-1.5px;font-size:29px;display:flex;align-items:center;gap:11px}.brand svg{width:29px;height:29px}nav{display:flex;gap:28px;align-items:center;font-size:14px}nav a{text-decoration:none}nav a:hover{color:var(--accent)}.nav-note{border-left:1px solid var(--line);padding-left:24px;color:var(--muted);font-size:12px}
.hero{padding:56px 0 30px;display:grid;grid-template-columns:1fr 320px;gap:40px;align-items:end}.eyebrow{text-transform:uppercase;font-size:11px;letter-spacing:2px;font-weight:bold;color:var(--accent);margin:0 0 16px}h1{font-size:49px;line-height:1.12;letter-spacing:-2px;margin:0 0 18px;font-weight:750}.hero p{font-size:16px;line-height:1.7;color:var(--muted);max-width:670px;margin:0}.hero-aside{border-left:2px solid #d1d1d1;padding-left:22px;margin-bottom:8px;font-size:14px;line-height:1.7}.hero-aside strong{display:block;margin-bottom:5px}.hero-aside span{color:var(--muted)}.tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin-top:16px;margin-bottom:28px;overflow-x:auto}.tabs a{padding:16px 20px;text-decoration:none;white-space:nowrap;font-size:14px;border-bottom:3px solid transparent}.tabs a.active{border-color:var(--green);font-weight:bold;color:var(--green)}.tabs a:hover{background:var(--soft)}.tabs small{color:var(--muted);margin-right:10px}
.workspace{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:28px;align-items:start}.form-panel{border:1px solid var(--line);border-radius:var(--radius);background:white;padding:28px}.section-heading{display:flex;gap:12px;align-items:center;margin:2px 0 24px}.section-heading span{font-size:11px;color:var(--accent);border:1px solid #d6d6d6;width:25px;height:25px;display:grid;place-items:center;border-radius:50%;flex-shrink:0}.section-heading h2{font-size:19px;margin:0;letter-spacing:-.4px}.small{font-size:12px;color:var(--muted);line-height:1.65}.lead-note{margin:-9px 0 20px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:block;min-width:0;font-size:13px;font-weight:600}.field input,.field select{display:block;width:100%;height:45px;margin-top:8px;border:1px solid #d6d6d6;background:#ffffff;border-radius:8px;padding:9px 12px;color:var(--ink);font-size:16px}.field input:hover{border-color:#9a9a9a}.field input:invalid:not(:placeholder-shown){border-color:#757575}.field .hint{display:block;font-weight:400;color:var(--muted);font-size:11px;line-height:1.6;margin-top:7px}.room{border-bottom:1px solid #ebebeb;padding:0 0 20px;margin-bottom:20px}.room-title{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-bottom:12px;font-weight:bold}.text-btn{border:0;background:transparent;padding:8px 0;color:var(--green);font-size:13px;font-weight:bold;text-decoration:underline;text-underline-offset:4px}.remove{color:#5c5c5c;font-size:12px}.divider{border:0;border-top:1px solid #e7e7e7;margin:27px 0}.preset{display:flex;gap:8px;margin:12px 0 20px;flex-wrap:wrap}.preset button{border:1px solid var(--line);border-radius:6px;background:var(--paper);padding:7px 10px;font-size:11px;color:var(--ink)}.preset button:hover{background:var(--soft)}.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:25px}.btn{display:inline-flex;justify-content:center;align-items:center;gap:8px;border:1px solid var(--line);background:white;border-radius:8px;color:var(--ink);padding:12px 17px;font-size:13px;font-weight:600;text-decoration:none}.btn:hover{background:var(--soft)}.btn-primary{background:var(--green);color:white;border-color:var(--green)}.btn-primary:hover{background:#3f3f3f}.btn-wide{width:100%}.save-note{margin:13px 0 0;font-size:11px;color:var(--muted)}#notice{min-height:22px;font-size:12px;color:var(--green);margin:12px 0 0}#error{color:#505050;background:#f3f3f3;padding:14px;border-radius:8px;font-size:13px;line-height:1.5;margin-bottom:20px}#error:empty{display:none}
.result{position:sticky;top:22px;border:1px solid #d5d5d5;border-radius:var(--radius);background:var(--soft);overflow:hidden}.result-main{padding:27px}.result-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:1.6px;color:var(--green);margin:0 0 8px}.big-result{font-size:74px;font-weight:750;letter-spacing:-4px;line-height:1.1;display:flex;align-items:baseline;gap:12px;margin:0 0 7px}.big-result span{font-size:22px;font-weight:400;letter-spacing:-.5px}.result-sub{font-size:13px;line-height:1.6;margin:0 0 20px;color:var(--muted)}.result dl{margin:0}.result dl div{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid #dddddd;gap:15px;font-size:13px}.result dd{margin:0;font-weight:bold;text-align:right}.result dt{color:var(--muted)}.result .total{font-size:17px;border:0;padding:17px 0 10px}.total dt{color:var(--ink)}.diagram-wrap{padding:0 26px 20px}.diagram-wrap svg{display:block;width:100%;height:155px;background:#eaeaea;border-radius:10px}.diagram-caption{font-size:10px;color:var(--muted);margin:10px 0 0;line-height:1.5}.result-foot{background:#e8e8e8;padding:16px 26px;display:flex;gap:10px;align-items:flex-start;font-size:11px;line-height:1.65;color:#5a5a5a}.result-foot svg{flex-shrink:0;margin-top:2px}.stale{opacity:.45}.below{padding:65px 0 30px}.below>h2,.guide-heading{font-size:28px;letter-spacing:-.8px;margin:0 0 26px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-bottom:60px}.steps .number{font-size:34px;font-weight:300;color:#adadad;letter-spacing:-1px}.steps h3{font-size:16px;margin:14px 0 10px}.steps p{color:var(--muted);font-size:13px;line-height:1.8;margin:0}.content-row{display:grid;grid-template-columns:1.3fr 1fr;gap:64px;border-top:1px solid var(--line);padding-top:40px}.content-row h2{font-size:23px;letter-spacing:-.7px;line-height:1.3}.content-row p,.content-row li{font-size:14px;line-height:1.85;color:var(--muted)}.formula{background:#eaeaea;padding:18px 20px;font-family:monospace;font-size:13px;border-radius:8px;line-height:1.7}.reading a{display:block;padding:17px 0;border-bottom:1px solid var(--line);text-decoration:none;font-weight:600;font-size:14px;line-height:1.55}.reading a:hover{color:var(--accent)}.reading span{display:block;color:var(--muted);font-size:11px;font-weight:400;margin-top:5px}.faq{padding:45px 0 55px}.faq h2{font-size:26px}.faq details{border-bottom:1px solid var(--line);padding:18px 0}.faq summary{font-size:14px;font-weight:bold;cursor:pointer}.faq details p{color:var(--muted);font-size:14px;line-height:1.8;max-width:800px}.related{margin:40px 0;border-top:1px solid var(--line);padding-top:24px}.affiliate{padding:20px;border:1px solid var(--line);border-radius:12px;margin:28px 0}.affiliate h2{font-size:20px}.affiliate p{font-size:12px;line-height:1.6;color:var(--muted)}.ad-unit{margin:40px 0;min-height:140px;text-align:center}.ad-unit>span{font-size:10px;color:var(--muted)}
footer{border-top:1px solid var(--line);padding:35px 0;background:#f1f1f1}footer .wrap{display:flex;justify-content:space-between;align-items:start;gap:28px}footer .brand{font-size:23px}footer p{font-size:12px;line-height:1.8;color:var(--muted);max-width:400px}footer nav{font-size:12px;gap:22px;flex-wrap:wrap}.article{max-width:790px;margin:auto;padding:55px 28px 70px}.article h1{font-size:40px;line-height:1.2}.article h2{font-size:24px;letter-spacing:-.6px;margin-top:35px}.article p,.article li{font-size:15px;line-height:1.9;color:#595959}.article li{padding-bottom:8px}.article .meta{font-size:12px;color:var(--muted);margin-bottom:28px}.article table{border-collapse:collapse;width:100%;font-size:13px}.article td,.article th{text-align:left;border-bottom:1px solid var(--line);padding:13px 8px;line-height:1.5}.article th{background:var(--soft)}.guide-index{display:grid;gap:20px;margin:30px 0}.guide-index a{padding:24px;background:white;border:1px solid var(--line);border-radius:12px;text-decoration:none;font-size:20px;font-weight:bold}.guide-index a span{font-size:13px;font-weight:normal;display:block;margin-top:8px;color:var(--muted)}.breadcrumbs{font-size:12px;color:var(--muted);margin:0 0 22px}.sources{font-size:12px!important;border-top:1px solid var(--line);padding-top:20px}.empty-price{font-size:14px!important;color:var(--muted)}.nojs{background:#f2f2f2;padding:18px;border-radius:8px;margin:16px 0}
@media(max-width:960px){.workspace{grid-template-columns:minmax(0,1fr) 340px;gap:18px}.form-panel{padding:22px}.result-main{padding:22px}.hero{grid-template-columns:1fr}.hero-aside{display:none}h1{font-size:43px}.content-row{gap:30px}}
@media(max-width:730px){.wrap{padding:0 18px}header .wrap{min-height:70px;gap:14px}.brand{font-size:26px}header nav{gap:16px;font-size:12px}.nav-note{display:none}.hero{padding:34px 0 15px;gap:0}h1{font-size:35px;letter-spacing:-1.3px}.hero p{font-size:14px;line-height:1.75}.eyebrow{font-size:10px;margin-bottom:13px}.tabs{margin-bottom:20px}.tabs a{font-size:12px;padding:14px 11px}.tabs small{margin-right:6px}.workspace{grid-template-columns:1fr;gap:18px}.result{position:static}.form-panel{padding:22px 18px}.field-grid{gap:12px}.section-heading h2{font-size:18px}.steps{grid-template-columns:1fr;gap:26px;margin-bottom:35px}.steps>div{display:grid;grid-template-columns:45px 1fr;gap:0 15px}.steps .number{grid-row:1/3}.steps h3{margin:3px 0 8px}.content-row{grid-template-columns:1fr;gap:24px}.below{padding-top:38px}.below>h2{font-size:24px}.big-result{font-size:64px}.diagram-wrap svg{height:175px}footer .wrap{flex-direction:column}footer nav{gap:20px}.article{padding:35px 20px 50px}.article h1{font-size:32px}.article table{font-size:11px}.article td,.article th{padding:10px 5px}.actions .btn{flex:1}.result-main{padding:24px}}
@media(prefers-reduced-motion:no-preference){.btn,a{transition:background .15s,color .15s}}
@media print{header,.tabs,.form-panel,.below,.faq,footer,.actions,.affiliate,.ad-unit,.hero-aside,.breadcrumbs{display:none!important}.workspace{display:block}.result{position:static;break-inside:avoid;background:white;max-width:650px;border:1px solid #cccccc}.hero{display:block;padding:10px 0 20px}.hero h1{font-size:25px}.hero p{font-size:11px}.wrap{max-width:none}.result-foot{background:white}.result-main{padding:20px}.big-result{font-size:45px}.diagram-wrap{max-width:350px}.article{max-width:none}}
.brand-dot{color:var(--accent);margin-left:-10px}select:focus-visible{outline:3px solid #777777;outline-offset:4px}.big-result{overflow-wrap:anywhere;flex-wrap:wrap}.big-result span{font-size:19px}.formula{overflow-wrap:anywhere}.result-main .actions{margin-top:18px}.article .btn{color:white}.nav-guide{white-space:nowrap}@media(max-width:480px){header .brand{font-size:23px;gap:7px}header .brand svg{width:23px;height:23px}.nav-guide{display:none}header nav{font-size:11px;gap:0}.brand-dot{margin-left:-7px}.tabs a{font-size:11px;padding:13px 8px}.tabs small{margin-right:4px}.field{font-size:12px}.big-result span{font-size:19px}}
/* RoomQuanta visual planner: calm hierarchy, a large live scene, secondary controls. */
:root{--ink:#1d1d1d;--muted:#6e6e6e;--paper:#f5f5f5;--line:#e6e6e6;--green:#181818;--accent:#181818;--soft:#f5f5f5;--radius:24px;font-family:var(--font-text);background:var(--paper);color:var(--ink)}
body{background:#f5f5f5}.wrap{max-width:1240px;padding:0 32px}header{background:#ffffffd9;backdrop-filter:blur(18px);border-bottom:1px solid #e5e5e5}header .wrap{min-height:72px}.brand{font-size:24px;letter-spacing:-1px;font-weight:700;gap:9px}.brand svg{width:25px;height:25px}.brand-dot{color:#181818}nav{font-size:12px;gap:26px}.hero{display:block;text-align:center;padding:55px 0 24px}.hero>div{max-width:830px;margin:auto}.eyebrow{font-size:11px;color:#6e6e6e;letter-spacing:1.7px;margin-bottom:17px}h1{font-size:59px;line-height:1.08;letter-spacing:-2.8px;font-weight:700;margin:0 0 20px}.hero p{font-size:17px;line-height:1.6;max-width:630px;margin:auto;color:#6e6e6e}.hero-aside{display:none}.tabs{justify-content:center;gap:5px;border:0;margin:12px auto 30px;max-width:max-content;background:#e9e9e9;padding:5px;border-radius:30px}.tabs a{padding:12px 21px;border:0;border-radius:24px;font-size:13px;color:#6e6e6e}.tabs small{display:none}.tabs a.active{background:white;box-shadow:0 2px 5px #0000000b;color:#1d1d1d;font-weight:600}.tabs a:hover{background:#ffffff8c}
.workspace{grid-template-columns:minmax(0,1.7fr) minmax(315px,1fr);grid-template-areas:'studio form' 'studio result';gap:22px;align-items:start}.room-studio{grid-area:studio;background:white;border:1px solid #e7e7e7;border-radius:26px;overflow:hidden;min-width:0;box-shadow:0 4px 24px #21212103}.studio-top{padding:25px 26px 14px;display:flex;justify-content:space-between;align-items:center;gap:15px}.overline{font-size:9px;letter-spacing:1.5px;color:#868686;font-weight:600;margin:0 0 8px}.studio-top h2{font-size:21px;letter-spacing:-.65px;margin:0;font-weight:650}.segmented{display:flex;padding:3px;background:#ededed;border-radius:10px;gap:2px}.segmented button{background:none;border:0;color:#6e6e6e;padding:7px 13px;border-radius:8px;font-size:12px;font-weight:600}.segmented button[aria-pressed=true]{background:white;color:#1d1d1d;box-shadow:0 1px 4px #00000013}.shape-presets{display:flex;align-items:center;gap:7px;padding:0 26px 18px;flex-wrap:wrap}.shape-presets>span{font-size:11px;color:#868686;margin-right:4px}.shape-presets button{font-size:11px;background:white;border:1px solid #e1e1e1;border-radius:20px;padding:7px 11px;color:#525252}.shape-presets button:hover{border-color:#181818;color:#181818;background:#f9f9f9}.scene-frame{position:relative;background:radial-gradient(ellipse at 50% 44%,#ffffff 5%,#f7f7f7 95%);overflow:hidden;border-top:1px solid #f1f1f1;border-bottom:1px solid #ececec}#room-canvas{display:block;width:100%;height:405px;touch-action:none;outline-offset:-5px}.scene-badge{position:absolute;left:22px;top:18px;z-index:1;pointer-events:none;display:flex;align-items:baseline;gap:8px}.scene-badge strong{font-size:13px;font-weight:650}.scene-badge span{font-size:10px;color:#868686}.scene-zoom{position:absolute;right:16px;bottom:17px;display:flex;background:#ffffffec;padding:3px;border:1px solid #e4e4e4;border-radius:11px;box-shadow:0 3px 12px #00000005;gap:2px}.scene-zoom button,.history-controls button{width:30px;height:29px;border:0;border-radius:7px;background:transparent;color:#636363;font-size:17px}.scene-zoom button:hover,.history-controls button:hover{background:#eeeeee;color:#1d1d1d}.draw-tools{position:absolute;left:14px;bottom:17px;display:flex;gap:3px;background:#ffffffed;padding:4px;border:1px solid #e4e4e4;border-radius:10px;box-shadow:0 3px 12px #00000005;max-width:calc(100% - 130px);flex-wrap:wrap}.draw-tools[hidden],.history-controls[hidden]{display:none}.draw-tools button{border:0;background:transparent;padding:7px 8px;font-size:10px;border-radius:7px;color:#616161}.draw-tools button[aria-pressed=true]{background:#181818;color:white}.studio-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 22px}.studio-bottom p{font-size:11px;color:#6e6e6e;line-height:1.5;margin:0;min-height:16px}.history-controls{display:flex;gap:3px}.scene-settings{border-top:1px solid #eeeeee;margin:0 22px;padding:13px 0 5px;display:flex;flex-wrap:wrap;align-items:center;gap:14px}.swatches{display:flex;align-items:center;gap:7px}.swatches button{width:20px;height:20px;background:var(--swatch);border:3px solid white;border-radius:50%;box-shadow:0 0 0 1px #d8d8d8;padding:0}.swatches button[aria-pressed=true]{box-shadow:0 0 0 2px #181818}.swatches span{font-size:9px;color:#868686;margin-left:3px}.wall-toggle,.wall-height{font-size:10px;color:#787878;display:flex;gap:6px;align-items:center}.wall-toggle input{accent-color:#181818}.wall-height select{border:1px solid #e1e1e1;border-radius:6px;font-size:10px;color:#555555;padding:3px;background:white}.scene-disclaimer{font-size:9px;color:#8b8b8b;line-height:1.5;margin:11px 22px 17px}.form-panel{grid-area:form;padding:25px 24px;border-radius:24px;border:1px solid #e7e7e7;box-shadow:0 4px 24px #21212103;background:white}.section-heading{gap:9px;margin:0 0 17px}.section-heading span{width:22px;height:22px;border:0;background:#f0f0f0;color:#6e6e6e;font-size:10px}.section-heading h2{font-size:17px;font-weight:650;letter-spacing:-.4px}.lead-note{font-size:11px;line-height:1.6;margin:0 0 19px}.field-grid{gap:13px}.field{font-size:11px;font-weight:500;color:#676767}.field input,.field select{height:43px;margin-top:7px;padding:10px 11px;border-radius:9px;border:1px solid #d8d8d8;color:#1d1d1d;background:#ffffff;font-size:16px;letter-spacing:-.25px}.field input:hover{border-color:#a5a5a5}.field input:focus{outline:3px solid #18181826;outline-offset:1px;border-color:#181818}.field .hint{font-size:9px;line-height:1.5;color:#8b8b8b}.room{padding:0 0 17px;margin-bottom:14px;border-color:#eeeeee}.room-title{font-size:11px;color:#1d1d1d;margin-bottom:10px}.text-btn{font-size:11px;color:#181818;text-decoration:none;padding:6px 0;font-weight:500}.text-btn:hover{text-decoration:underline}.remove{color:#5a5a5a}.divider{border-color:#eeeeee;margin:22px 0}.budget-details{border-top:1px solid #e8e8e8;margin-top:23px;padding-top:17px}.budget-details summary{cursor:pointer;color:#181818;font-size:12px;list-style:disclosure-closed;line-height:1.5}.budget-details[open] summary{margin-bottom:21px;list-style:disclosure-open}.budget-details .section-heading{display:none}.btn{border-radius:22px;border:1px solid #dcdcdc;font-size:12px;font-weight:500;padding:11px 16px;background:white;color:#343434}.btn:hover{background:#f5f5f5}.btn-primary{background:#181818;border-color:#181818;color:white}.btn-primary:hover{background:#303030}.actions{margin-top:21px;gap:10px}.form-panel>.actions:nth-last-of-type(1){gap:13px;justify-content:space-between;flex-wrap:wrap;margin-top:16px}.form-panel .btn-primary{flex:1}.save-note{font-size:9px;line-height:1.6;margin:13px 0 0;color:#868686}#notice{font-size:10px;line-height:1.5;margin-top:9px;min-height:0}#notice:empty{display:none}#error{font-size:11px;border-radius:10px;padding:12px;margin-bottom:18px;line-height:1.6}.result{grid-area:result;position:static;background:white;border:1px solid #e7e7e7;border-radius:24px;box-shadow:0 4px 24px #21212103;overflow:hidden}.result-main{padding:23px 25px}.result-eyebrow{font-size:10px;letter-spacing:1.2px;color:#868686;margin-bottom:14px}#result-content{display:grid;grid-template-columns:.8fr 1.2fr;gap:0 24px}.big-result{font-size:58px;font-weight:650;letter-spacing:-2.5px;display:block;grid-column:1;grid-row:1;margin:0 0 9px}.big-result span{display:block;font-size:14px;color:#787878;font-weight:400;letter-spacing:-.2px;margin-top:4px}.result-sub{font-size:10px;line-height:1.6;color:#868686;grid-column:1;grid-row:2;margin-bottom:8px}.result dl{grid-column:2;grid-row:1/4}.result dl div{font-size:10px;padding:8px 0;border-color:#eeeeee}.result dt{color:#868686}.result dd{font-weight:600}.result .total{font-size:12px;padding:13px 0 0}.result .total dt{color:#1d1d1d}.result .empty-price{font-size:10px!important;color:#868686}#result-content>.small{font-size:9px;grid-column:1;grid-row:3;line-height:1.6;align-self:start;margin:0;color:#9a9a9a}.result-main>.actions{border-top:1px solid #eeeeee;margin-top:18px;padding-top:16px;gap:10px}.result .btn{font-size:11px;padding:9px 15px}.result-foot{background:#fbfbfb;font-size:9px;line-height:1.6;color:#8b8b8b;padding:13px 25px;border-top:1px solid #f1f1f1}.below{padding:70px 0 15px}.below>h2{text-align:center;font-size:32px;letter-spacing:-1px;margin-bottom:38px}.steps{gap:35px}.steps .number{color:#b0b0b0;font-size:32px}.steps h3{font-weight:600;font-size:16px;letter-spacing:-.3px}.steps p{font-size:12px;color:#868686}.content-row{border-color:#dedede;padding-top:35px;gap:55px}.content-row h2{font-size:23px;font-weight:650}.content-row p,.content-row li{color:#787878;font-size:13px}.formula{font-size:11px;background:#eaeaea;border-radius:12px;padding:18px;line-height:1.9;color:#565656}.reading a{font-size:13px;border-color:#dedede;font-weight:500}.reading span{color:#868686;font-size:10px}.faq{max-width:850px;margin:auto;padding:35px 0 60px}.faq h2{font-size:26px;text-align:center;margin-bottom:27px;letter-spacing:-.6px}.faq details{border-color:#dedede;padding:19px 0}.faq summary{font-size:13px;font-weight:600}.faq details p{font-size:13px;color:#787878}.article h1{font-size:44px;letter-spacing:-1.8px}.article h2{font-weight:650;letter-spacing:-.7px}.article p,.article li{color:#636363}.article .btn{color:white}.article table th{background:#eaeaea}.sources{color:#868686!important}.article a:not(.btn){color:#181818}footer{background:#eeeeee;border-color:#e1e1e1;padding:30px 0}footer .brand{font-size:21px}footer .brand svg{width:23px;height:23px}footer p{font-size:11px;line-height:1.7;color:#868686}footer nav{font-size:11px;color:#787878}
@media(max-width:1020px){.wrap{padding:0 24px}.workspace{grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr);gap:17px}.studio-top{padding:22px 19px 14px}.studio-top h2{font-size:18px}.shape-presets{padding:0 19px 15px}.shape-presets>span{display:none}.form-panel{padding:22px 19px}.scene-settings{gap:10px}.wall-height{display:none}#room-canvas{height:375px}.draw-tools{max-width:calc(100% - 115px)}.draw-tools button{font-size:9px;padding:6px}.result-main{padding:22px 20px}#result-content{gap:0 15px}.big-result{font-size:50px}}
@media(max-width:760px){.wrap{padding:0 17px}header .wrap{min-height:66px}.brand{font-size:23px;gap:8px}.hero{padding:36px 0 20px}h1{font-size:40px;letter-spacing:-1.7px;line-height:1.13;margin-bottom:15px}.hero p{font-size:13px;line-height:1.65;max-width:480px}.eyebrow{font-size:9px;letter-spacing:1.3px;margin-bottom:14px}.tabs{margin:8px auto 23px;gap:3px;padding:4px;max-width:100%}.tabs a{font-size:11px;padding:11px 16px}.workspace{display:flex;flex-direction:column;gap:17px}.room-studio,.form-panel,.result{width:100%}.room-studio{order:0;border-radius:22px}.form-panel{order:1}.result{order:2}.studio-top{padding:22px 18px 15px}.studio-top h2{font-size:19px}.shape-presets{padding:0 18px 15px;gap:6px}.shape-presets button{font-size:10px;padding:6px 10px}.scene-badge{left:16px;top:15px}#room-canvas{height:340px}.draw-tools{left:10px;bottom:12px;max-width:calc(100% - 104px);gap:1px}.scene-zoom{right:10px;bottom:12px}.scene-zoom button{width:25px;height:26px}.draw-tools button{font-size:9px;padding:7px 6px}.studio-bottom{padding:10px 15px}.studio-bottom p{font-size:10px}.scene-settings{margin:0 16px;justify-content:space-between}.scene-disclaimer{margin:10px 16px 15px}.form-panel{padding:24px 21px;border-radius:22px}.field{font-size:12px}.field input,.field select{height:46px}.field .hint{font-size:10px}.room-title{font-size:12px}.lead-note{font-size:12px}.section-heading h2{font-size:19px}.text-btn{font-size:12px}.save-note{font-size:10px}.btn{font-size:13px}.result-main{padding:24px 21px}.big-result{font-size:60px}.result dl div{font-size:11px}.result .total{font-size:12px}.result-sub{font-size:11px}.result-eyebrow{font-size:10px}#result-content>.small{font-size:10px}.result .btn{font-size:12px}.result-foot{font-size:10px;padding:14px 21px}.below{padding-top:48px}.below>h2{font-size:27px;line-height:1.2}.steps{gap:27px}.steps h3{margin:2px 0 8px}.steps p{font-size:12px}.content-row{gap:25px}.faq{padding-bottom:45px}.article h1{font-size:33px;letter-spacing:-1px}.article p,.article li{font-size:14px}}
@media print{.room-studio,.budget-details{display:none!important}.workspace{display:block}.result{width:100%;max-width:700px}.result-main{padding:20px}#result-content{display:block}.big-result span{display:inline;margin-left:8px}.hero{text-align:left}.hero h1{font-size:27px}.hero p{margin:0}.result-foot{background:white}.result:before{content:'RoomQuanta';display:block;padding:18px 20px 0;font-size:15px;font-weight:bold}}

.empty-result{grid-column:1/-1;font-size:14px;line-height:1.7;color:#868686;min-height:90px;display:flex;align-items:center}

.scene-purchase{position:absolute;right:20px;top:15px;background:#ffffffdb;border:1px solid #e5e5e5;border-radius:18px;padding:7px 11px;font-size:11px;color:#181818;font-weight:600;z-index:1;backdrop-filter:blur(8px);pointer-events:none}.scene-purchase:empty{display:none}.mobile-estimate{display:none}#material-result{scroll-margin-top:18px}@media(max-width:760px){body:has(.mobile-estimate:not([hidden])){padding-bottom:75px}.mobile-estimate:not([hidden]){position:fixed;bottom:12px;left:17px;right:17px;background:#fffffff0;border:1px solid #e2e2e2;border-radius:18px;padding:12px 17px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 4px 25px #00000016;z-index:10;backdrop-filter:blur(16px);text-decoration:none;font-size:11px;color:#181818}.mobile-estimate strong{display:block;font-size:15px;color:#1d1d1d;font-weight:650}.mobile-estimate small{display:block;font-size:9px;color:#868686;margin-top:3px}.scene-purchase{right:13px;top:12px;font-size:10px;padding:6px 9px}}@media print{.mobile-estimate{display:none!important}}

/* Compact drawing tools and editable dimensions. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.room-measurements[hidden]{display:none}.polygon-summary{margin:0 0 12px;font-size:11px;color:#181818}.polygon-hint{font-size:10px;line-height:1.6;color:#868686}.corner-tools{position:absolute;left:13px;top:44%;transform:translateY(-50%);z-index:4;display:flex;flex-direction:column;align-items:flex-start;gap:7px}.corner-tools[hidden]{display:none}.corner-tools button{display:flex;align-items:center;gap:0;width:42px;height:42px;overflow:hidden;padding:10px;border:1px solid #e6e6e6;border-radius:12px;background:#fffffff5;color:#181818;box-shadow:0 2px 8px #2e2e2e0a;text-align:left;white-space:nowrap;transition:width .18s ease,gap .18s ease}.corner-tools button svg{width:21px;height:21px;flex-shrink:0;fill:white;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.corner-tools button span{font-size:11px;opacity:0;transition:opacity .18s}.corner-tools button:is(:hover,:focus-visible){width:127px;gap:10px}.corner-tools button:is(:hover,:focus-visible) span{opacity:1}.corner-tools #corner-delete{color:#5a5a5a}.corner-tools button:disabled{opacity:.4;cursor:not-allowed}.room-dimensions{position:absolute;inset:0;pointer-events:none;z-index:2}.dimension-chip{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:3px;border-radius:8px;border:1px solid #e6e6e6;background:#fffffff0;padding:4px 7px;box-shadow:0 1px 4px #29292910;pointer-events:auto;white-space:nowrap;color:#181818;font-size:11px;min-height:32px}.dimension-chip input{width:52px;min-width:0;padding:0;border:0;background:transparent;color:inherit;font:600 12px var(--font-text);text-align:center;outline:none;-moz-appearance:textfield}.dimension-chip input::-webkit-inner-spin-button,.material-dimension input::-webkit-inner-spin-button{-webkit-appearance:none}.dimension-chip:focus-within,.material-dimension:focus-within{outline:3px solid #1818182b;border-color:#181818;background:white}.dimension-chip input:focus{outline:none}.pattern-picker{margin:0 22px;padding:14px 0;border-top:1px solid #eeeeee}.pattern-picker>p:first-child{font-size:11px;color:#6e6e6e;margin:0 0 11px}.pattern-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.pattern-options button{min-width:0;padding:9px 8px 7px;border:1px solid #e4e4e4;border-radius:11px;background:#ffffff;color:#8c8c8c;display:flex;flex-direction:column;align-items:center;gap:6px}.pattern-options button svg{width:64px;max-width:100%;height:39px;border-radius:4px}.pattern-options button span{font-size:10px;color:#6e6e6e;white-space:nowrap}.pattern-options button[aria-pressed=true]{border-color:#181818;background:#f7f7f7;color:#181818;box-shadow:0 0 0 1px #1818181a}.pattern-options button[aria-pressed=true] span{color:inherit}.pattern-options button:hover{border-color:#bdbdbd}.pattern-note{font-size:9px;line-height:1.5;color:#868686;margin:10px 0 0}.scene-settings{padding-top:11px}.material-drawing{position:relative;margin:0 0 21px;background:linear-gradient(160deg,#fbfbfb,#f5f5f5);border-radius:15px;min-width:0}.material-drawing>p{position:absolute;top:13px;left:15px;font-size:10px;color:#868686;margin:0}.material-drawing>svg{display:block;width:100%;height:auto}.material-dimension{position:absolute;display:flex;align-items:center;justify-content:center;gap:3px;transform:translate(-50%,-50%);border:1px solid #e3e3e3;border-radius:8px;padding:5px 6px;background:#ffffff;color:#181818;font-size:10px;min-height:34px}.material-dimension input{border:0;background:none;width:49px;min-width:0;text-align:center;color:#181818;font:600 14px var(--font-text);padding:0;outline:none;-moz-appearance:textfield}.material-dimension input:focus{outline:0}.material-length{left:57%;top:79%}.material-width{left:17%;top:46%}.draw-tools button{min-height:34px}
@media(max-width:760px){.corner-tools{left:9px}.corner-tools button{width:40px;height:40px;padding:9px;border-radius:10px}.dimension-chip{min-height:40px;padding:4px 5px;font-size:10px}.dimension-chip input{width:64px;font-size:16px}.pattern-picker{margin:0 16px}.pattern-options{gap:6px}.pattern-options button{padding:8px 5px}.pattern-options button svg{height:35px}.pattern-options button span{font-size:9px}.material-dimension{min-height:39px}.material-dimension input{font-size:16px}.draw-tools button{min-height:36px}}
@media(hover:none){.corner-tools button:is(:hover,:focus-visible){width:40px;gap:0}.corner-tools button span{display:none}}
@media(prefers-reduced-motion:reduce){.corner-tools button,.corner-tools button span{transition:none}}
@media print{.corner-tools,.pattern-picker,.room-dimensions{display:none!important}}


.product-price{margin-top:16px}

.big-result .piece-alternative{font-size:14px;line-height:1.5;letter-spacing:0;margin-top:12px;color:#6e6e6e}.piece-alternative strong{color:#1d1d1d;font-weight:600}

/* Scannable purchase summary: quantities, coverage, then cost. */
#result-content{display:block}.purchase-options{display:flex;align-items:center;gap:24px;padding:4px 0 24px}.purchase-option{flex:1;min-width:0}.purchase-number{display:block;font-size:54px;font-weight:650;line-height:1.08;letter-spacing:-2px;overflow-wrap:anywhere}.purchase-unit{display:block;font-size:14px;color:#6e6e6e;margin-top:7px}.purchase-or{font-size:12px;color:#868686}.purchase-loose{padding-left:20px;border-left:1px solid #e6e6e6}.purchase-loose .purchase-number{font-size:44px;letter-spacing:-1.5px}.result .estimate-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;margin:0}.result .estimate-stats>div{display:block;padding:16px 0;border-top:1px solid #eeeeee;border-bottom:0;min-width:0}.result .estimate-stats dt{font-size:11px;line-height:1.4;color:#6e6e6e}.result .estimate-stats dd{text-align:left;margin:7px 0 0;font-size:17px;line-height:1.25;color:#1d1d1d;font-weight:600;overflow-wrap:anywhere}.estimate-cost{display:flex;justify-content:space-between;align-items:baseline;gap:20px;border-top:1px solid #e6e6e6;margin-top:5px;padding-top:20px}.estimate-cost>span{font-size:12px;color:#1d1d1d;flex-shrink:0}.estimate-cost>strong{font-size:24px;letter-spacing:-.6px;text-align:right;color:#181818;overflow-wrap:anywhere;min-width:0}.estimate-cost>strong.is-empty{font-size:14px;font-weight:400;letter-spacing:0;color:#868686}.result-main>.actions{justify-content:flex-end;border:0;margin-top:19px;padding-top:0}.result-foot{font-size:10px}
@media(max-width:760px){.purchase-options{gap:18px;padding-bottom:23px}.purchase-number{font-size:48px}.purchase-loose{padding-left:16px}.purchase-loose .purchase-number{font-size:40px}.purchase-unit{font-size:13px}.result .estimate-stats{gap:0 18px}.result .estimate-stats dt{font-size:11px}.result .estimate-stats dd{font-size:16px}.estimate-cost{gap:12px}.estimate-cost>strong{font-size:21px}.estimate-cost>span{font-size:11px}}
@media print{.purchase-options{display:flex}.result .estimate-stats{display:grid;grid-template-columns:repeat(2,1fr)}.estimate-cost>strong{color:#1d1d1d}}

/* Shared columns, insets and baselines across the planner and summary. */
.workspace{gap:24px}.room-studio,.form-panel,.result{border-radius:24px}.form-panel,.result-main{padding:24px}.result-foot{padding:14px 24px}.studio-top{padding:24px 24px 16px}.shape-presets{padding:0 24px 18px}.studio-bottom{padding:12px 24px}.pattern-picker{margin:0 24px}.scene-settings{margin:0 24px}.scene-disclaimer{margin:12px 24px 20px}.field-grid{gap:16px}.product-price{margin-top:16px}.result-heading{margin-bottom:24px}
.purchase-options{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:20px;padding:0 0 24px}.purchase-number,.purchase-loose .purchase-number{font-size:48px;line-height:1.1;letter-spacing:-1.8px}.purchase-loose{padding-left:0;border:0}.purchase-unit{margin-top:8px;font-size:13px}.purchase-options:has(.purchase-loose)::before{content:'';position:absolute;left:50%;top:3px;bottom:25px;border-left:1px solid #e6e6e6}.purchase-or{position:absolute;left:50%;top:35px;transform:translate(-50%,-50%);background:white;padding:5px;font-size:11px}.result .estimate-stats{gap:0 20px}.result .estimate-stats dt{min-height:31px}.result .estimate-stats dd{margin-top:4px}.estimate-cost{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:center}.estimate-cost>span{line-height:1.5}.estimate-cost>strong{font-size:23px;line-height:1.2}.result-main>.actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:20px}.result-main>.actions .btn{width:100%;min-height:38px;margin:0}
@media(min-width:761px){.room-studio{align-self:stretch;display:flex;flex-direction:column}.room-studio>.scene-frame{flex:1;min-height:405px}.room-studio #room-canvas{position:absolute;inset:0;height:100%;width:100%}.studio-top,.shape-presets,.studio-bottom,.pattern-picker,.scene-settings,.scene-disclaimer{flex-shrink:0}}
@media(max-width:1020px) and (min-width:761px){.workspace{gap:20px}.form-panel,.result-main{padding:20px}.result-foot{padding:14px 20px}.studio-top{padding:20px 20px 16px}.shape-presets{padding:0 20px 16px}.studio-bottom{padding:12px 20px}.pattern-picker,.scene-settings{margin-left:20px;margin-right:20px}.scene-disclaimer{margin:12px 20px 20px}.estimate-cost>strong{font-size:20px}}
@media(max-width:760px){.workspace{gap:20px}.form-panel,.result-main{padding:22px 20px}.result-foot{padding:14px 20px}.room-studio,.form-panel,.result{border-radius:22px}.purchase-number,.purchase-loose .purchase-number{font-size:44px}.purchase-options,.result .estimate-stats,.estimate-cost,.result-main>.actions{column-gap:20px}.estimate-cost>strong{font-size:21px}.result-heading{margin-bottom:23px}}

/* Keep controls compact, with enough clearance for their actual rendered size. */
.dimension-chip,.material-dimension{min-height:30px;padding:3px 5px;border-radius:7px;gap:3px;font-size:10px}
.dimension-chip input{width:3ch;font-size:13px}.material-dimension input{width:42px;font-size:13px}
.purchase-options:has(.purchase-loose){padding-top:22px}
.purchase-options:has(.purchase-loose)::before{top:24px}
.purchase-loose{position:relative}
.purchase-or{left:0;top:-21px;transform:none;padding:0;background:none;line-height:16px}
@media(max-width:760px){.dimension-chip,.material-dimension{min-height:32px;padding:3px 5px}.dimension-chip input,.material-dimension input{font-size:16px}.material-dimension input{width:44px}}
@media(max-width:380px){.result-main>.actions{gap:10px}.result-main>.actions .btn{padding-inline:10px;font-size:11px}.estimate-cost{grid-template-columns:1fr;gap:7px}.estimate-cost>strong{text-align:left}}

.field-grid{align-items:end}

/* Use Apple platform fonts locally; no Apple font files are redistributed. */
:root{--font-text:"SF Pro Text","SF Pro",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,sans-serif;--font-display:"SF Pro Display","SF Pro",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,sans-serif;font-optical-sizing:auto;-webkit-font-smoothing:antialiased}
.hero h1,.studio-top h2,.below>h2,.article h1,.article h2,.brand,.purchase-number,.estimate-cost>strong{font-family:var(--font-display)}
.hero h1{font-weight:600;letter-spacing:-.005em}
.purchase-number,.purchase-loose .purchase-number{font-weight:600;letter-spacing:-.025em}
.dimension-chip input,.material-dimension input,.estimate-stats dd,.estimate-cost>strong{font-variant-numeric:tabular-nums}

/* Relevant affiliate products follow the calculator, without changing its columns. */
.affiliate{padding:28px;margin:24px 0 0;background:white;border:1px solid #e7e7e7;border-radius:24px}
.affiliate-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.affiliate-heading h2{margin:0;font-size:23px;font-weight:600;letter-spacing:-.4px;font-family:var(--font-display)}.affiliate-heading>span{white-space:nowrap;font-size:12px;color:#868686}
.affiliate .affiliate-disclosure{margin:12px 0 22px;font-size:11px;line-height:1.6;color:#6e6e6e}
.affiliate-products{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;list-style:none;padding:0;margin:0}
.affiliate-product{display:flex;flex-direction:column;padding:20px;border:1px solid #e8e8e8;border-radius:16px;min-width:0}
.affiliate-product h3{font-size:14px;font-weight:600;line-height:1.4;margin:0 0 8px;letter-spacing:-.2px}
.affiliate .affiliate-spec{font-size:12px;line-height:1.5;margin:0;color:#515151}.affiliate .affiliate-note{font-size:11px;line-height:1.5;margin:8px 0 0;color:#868686}
.affiliate-product-head{display:flex;align-items:flex-start;gap:14px}.affiliate-thumbnail{display:block;width:72px;height:72px;flex:0 0 72px;border-radius:10px;object-fit:cover;border:1px solid #eeeeee;background:#f5f5f5}.affiliate-thumbnail-empty{display:grid;place-items:center;color:#b2b2b2}.affiliate-thumbnail-empty svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.5}.affiliate-product-info{min-width:0}.affiliate .affiliate-price{font-size:16px;font-weight:600;color:#1d1d1d;margin:10px 0 0;font-variant-numeric:tabular-nums}.affiliate-price span{font-size:11px;font-weight:400;color:#868686}.affiliate .affiliate-price.is-unavailable{font-size:11px;font-weight:400;color:#868686}.affiliate-product-actions{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding-top:20px;margin-top:auto}.affiliate-link{font-size:12px;color:#ee4d2d;text-align:center;text-decoration:none;padding:4px}.apply-product{font-size:12px;min-height:40px;background:#181818;color:white;border-color:#181818}.apply-product:hover{background:#303030;color:white}.apply-product[hidden]{display:none}
.affiliate .affiliate-price-note{font-size:11px;color:#868686;margin:18px 0 0;line-height:1.5}
@media(max-width:1020px){.affiliate-products{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.affiliate{padding:22px 20px;border-radius:22px}.affiliate-heading{align-items:flex-start}.affiliate-heading h2{font-size:20px}.affiliate-products{grid-template-columns:1fr}.affiliate-product{padding:18px}.affiliate-product-actions{flex-direction:column;gap:10px}.affiliate-product-head{gap:12px}.affiliate-thumbnail{width:64px;height:64px;flex-basis:64px}.affiliate-heading>span{font-size:10px}}
@media print{.affiliate{display:none!important}}

.affiliate .affiliate-variant{margin:6px 0 0;font-size:11px;line-height:1.45;color:#6e6e6e}.affiliate .affiliate-voucher{display:inline-block;margin:6px 0 0;padding:3px 6px;border-radius:5px;background:#f5f5f5;color:#5c5c5c;font-size:10px;line-height:1.3}

/* Optional offcut planning stays beside the live purchase quantities. */
.optimize-button{display:flex;align-items:center;gap:9px;width:100%;margin:0 0 24px;border-radius:11px!important;justify-content:flex-start;min-height:42px!important;background:#f9f9f9;color:#5c5c5c;border-color:#e4e4e4;font-size:12px!important}
.optimize-button[hidden]{display:none}.optimize-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5}.optimize-check{margin-left:auto;opacity:0}.optimize-button[aria-pressed=true]{background:#f2f2f2;color:#181818;border-color:#d5d5d5}.optimize-button[aria-pressed=true] .optimize-check{opacity:1}
#cut-summary{border-top:1px solid #e6e6e6;margin-top:18px;padding-top:16px}.cut-saving strong,.cut-saving span{display:block;line-height:1.5}.cut-saving strong{font-size:12px;font-weight:600;color:#545454}.cut-saving span{font-size:11px;color:#6e6e6e;margin-top:4px}.cut-view{margin-top:12px;font-size:12px}.cut-unavailable{font-size:11px;line-height:1.6;margin:0;color:#6e6e6e}
.cut-dialog{padding:0;width:min(940px,calc(100vw - 32px));max-width:none;max-height:90vh;border:1px solid #e0e0e0;border-radius:18px;color:#1d1d1d;box-shadow:0 16px 80px #00000022;background:#ffffff}.cut-dialog::backdrop{background:#1a1a1a66;backdrop-filter:blur(3px)}.cut-dialog-toolbar{display:flex;align-items:center;gap:12px;padding:16px 24px;border-bottom:1px solid #e6e6e6;background:#ffffff;position:sticky;top:0;z-index:1}.cut-dialog-toolbar strong{flex:1;font-size:14px}.cut-dialog-toolbar .btn{font-size:12px;padding:8px 14px}.cut-dialog-toolbar #cut-close{font-size:22px;line-height:1;width:36px;height:36px;padding:0}
.cut-report{padding:32px 40px;color:#2f2f2f;background:#ffffff;font-size:13px;line-height:1.6}.cut-report-header{position:static;border:0;box-shadow:none;display:flex;justify-content:space-between;padding:0 0 20px;background:none;font-size:11px;letter-spacing:.08em;color:#737373}.cut-report-header span:first-child{font-size:19px;font-weight:600;letter-spacing:-.5px;color:#2f2f2f}.cut-report h1{font-size:29px;letter-spacing:-.5px;line-height:1.2;margin:14px 0}.cut-report h2{font-size:17px;letter-spacing:-.2px;margin:26px 0 12px}.cut-report h3{font-size:13px;margin:0;display:flex;justify-content:space-between;gap:16px}.cut-report h3 span{font-weight:400;color:#737373}.cut-report-spec{font-size:12px;color:#737373}.cut-report-totals{display:grid;grid-template-columns:1fr 1fr 1.5fr;gap:20px;padding:20px 0;border-block:1px solid #e6e6e6;margin:22px 0 18px}.cut-report-totals strong,.cut-report-totals span{display:block}.cut-report-totals strong{font-size:24px;line-height:1.3;overflow-wrap:anywhere}.cut-report-totals span{font-size:11px;color:#737373}.cut-report-comparison{font-size:12px}.cut-guide ol{padding-left:20px}.cut-guide li{margin:9px 0}.cut-report-note{font-size:11px;color:#737373;line-height:1.6}.cut-legend{display:flex;gap:20px;font-size:11px;color:#737373}.assembly-svg,.stock-svg{display:block;width:100%;height:auto;font-family:var(--font-text)}.assembly-svg{border:1px solid #e6e6e6;border-radius:8px;background:#ffffff}.cut-stock{padding:18px 0;border-top:1px solid #e6e6e6;break-inside:avoid}.stock-svg{margin:10px 0}.cut-stock table{width:100%;border-collapse:collapse;font-size:11px;font-variant-numeric:tabular-nums;table-layout:fixed}.cut-stock th,.cut-stock td{padding:7px 10px;text-align:left;border-bottom:1px solid #ebebeb}.cut-stock th{font-weight:500}.cut-stock thead{background:#f7f7f7}.cut-stock th:first-child{width:15%}
@media(max-width:540px){.cut-dialog{width:calc(100vw - 16px)}.cut-dialog-toolbar{padding:12px;gap:8px}.cut-dialog-toolbar strong{font-size:12px}.cut-dialog-toolbar .btn{font-size:11px;padding:8px 10px}.cut-report{padding:20px 16px}.cut-report h1{font-size:24px}.cut-report-header{font-size:8px;gap:10px}.cut-report-totals{gap:12px}.cut-report-totals strong{font-size:18px}.cut-stock th,.cut-stock td{padding:6px}.cut-stock table{font-size:10px}}
@media print{
 @page{size:A4 portrait;margin:14mm}
 body.print-cutting{background:white!important;padding:0!important}
 body.print-cutting>*:not(#cut-dialog){display:none!important}
 body.print-cutting #cut-dialog{display:block!important;position:static!important;inset:auto!important;width:100%!important;max-width:none!important;max-height:none!important;height:auto!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:visible!important}
 body.print-cutting #cut-dialog::backdrop{display:none!important}
 body.print-cutting .cut-dialog-toolbar{display:none!important}
 .cut-report{padding:0!important;font-size:10pt;print-color-adjust:exact;-webkit-print-color-adjust:exact}
 .cut-report .cut-report-header{display:flex!important;font-size:8pt;padding-bottom:12pt}
 .cut-report h1{font-size:24pt}.cut-report h2{font-size:14pt;break-after:avoid}.cut-report h3{break-after:avoid}
 .cut-report-totals strong{font-size:20pt}.cut-report-totals span,.cut-report-note,.cut-stock table{font-size:8pt}
 .cut-assembly{break-before:page;break-inside:avoid}.cut-stock-section{break-before:page}
 .cut-stock{break-inside:avoid;page-break-inside:avoid}.cut-stock thead{display:table-header-group}
 .cut-report svg{max-width:100%}.cut-report .assembly-svg{max-height:180mm}
 .cut-report p,.cut-report li{orphans:3;widows:3}
}
.cut-contours{font-size:10px;line-height:1.6;margin:12px 0}.cut-contours dt{font-weight:600}.cut-contours dd{margin:3px 0 10px;color:#737373;overflow-wrap:anywhere}

.cut-saving.is-baseline strong{color:#626262}

/* Prominent controls for drawing, optimizing and exporting the plan. */
.button-icon{width:18px;height:18px;flex:0 0 18px}
.shape-presets{gap:10px}
.shape-presets>span{color:#6e6e6e;font-size:12px}
.shape-presets button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 16px;border-radius:12px;border:1px solid #bdbdbd;background:#f2f2f2;color:#181818;font-size:13px;font-weight:650;line-height:1.3}
.shape-presets button:hover{background:#e7e7e7;border-color:#181818;color:#181818}
.shape-presets button[aria-pressed=true],.btn.btn-export,.result .optimize-button{background:#181818;border-color:#181818;color:#ffffff;box-shadow:0 3px 8px #1818181a}
.shape-presets button[aria-pressed=true]:hover,.btn.btn-export:hover,.result .optimize-button:hover{background:#303030;border-color:#303030;color:#ffffff}
.btn.btn-export{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 16px;border-radius:12px;font-size:13px;font-weight:650;line-height:1.3}
.result-main>.actions .btn{min-height:44px}
.result .optimize-button{min-height:48px!important;padding:12px 16px;font-size:14px!important;font-weight:650;line-height:1.3;gap:10px}
.result .optimize-button svg{width:20px;height:20px;flex:0 0 20px;stroke-width:1.7}
.result .optimize-button[aria-pressed=true]{background:#181818;border-color:#181818;color:#ffffff;box-shadow:0 3px 8px #1818181a}
.result .optimize-button[aria-pressed=true]:hover{background:#303030;border-color:#303030}
.optimize-check{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#ffffff26;font-size:14px;flex-shrink:0}
.shape-presets button:focus-visible,.btn.btn-export:focus-visible,.result .optimize-button:focus-visible{outline:3px solid #181818;outline-offset:3px}
.shape-presets button:active,.btn.btn-export:active,.result .optimize-button:active{box-shadow:none}
.btn.btn-export:disabled,.result .optimize-button:disabled{background:#ececec;border-color:#e4e4e4;color:#757575;box-shadow:none;opacity:1;cursor:not-allowed}
@media(prefers-reduced-motion:no-preference){.shape-presets button,.btn.btn-export,.optimize-button{transition:background .16s,border-color .16s,color .16s,box-shadow .16s}}
@media(max-width:380px){.shape-presets{gap:8px}.shape-presets button{padding-inline:12px}.result .btn.btn-export{padding-inline:12px;font-size:12px}}

/* Soft raised controls, retaining the established layout and dimensions. */
@media screen{
 :root{--button-surface:linear-gradient(155deg,#424242 0%,#1b1b1b 42%,#080808 100%);--button-shadow:inset 0 1px 1px #ffffff55,inset 1px 0 2px #ffffff1a,0 5px 11px #00000024,0 1px 2px #0000001a}
 .tabs{background:#ffffff;border:1px solid #ebebeb}
 .segmented{background:#f1f1f1}
 .tabs a:not(.active){background:transparent;color:#666}
 :is(.tabs a.active,.segmented button[aria-pressed=true],.shape-presets button[aria-pressed=true],.btn.btn-export,.result .optimize-button,.pattern-options button[aria-pressed=true]):not(:disabled){background:var(--button-surface);color:#fff;border-color:#333;box-shadow:var(--button-shadow)}
 :is(.tabs a.active,.segmented button[aria-pressed=true],.shape-presets button[aria-pressed=true],.btn.btn-export,.result .optimize-button,.pattern-options button[aria-pressed=true]):not(:disabled):active{background:linear-gradient(155deg,#171717,#292929);box-shadow:inset 0 2px 5px #00000055,0 1px 2px #0000001a;transform:translateY(1px)}
 .shape-presets button:not([aria-pressed=true]),.btn:not(.btn-export):not(.optimize-button){background:linear-gradient(#fff,#f3f3f3);color:#333;border-color:#ddd;box-shadow:inset 0 1px 1px #fff,0 2px 4px #00000008}
 .optimize-check{background:#ffffff26;box-shadow:inset 0 1px 1px #ffffff22}
 .tabs a:focus-visible,.segmented button:focus-visible{outline:2px solid #555;outline-offset:4px}
 .btn:disabled{box-shadow:none}
}
@media screen and (hover:hover){
 :is(.tabs a.active,.segmented button[aria-pressed=true],.shape-presets button[aria-pressed=true],.btn.btn-export,.result .optimize-button,.pattern-options button[aria-pressed=true]):not(:disabled):hover:not(:active){background:linear-gradient(155deg,#4b4b4b,#222 42%,#101010);box-shadow:inset 0 1px 1px #ffffff66,inset 1px 0 2px #ffffff1a,0 6px 13px #0000002b}
 .tabs a:not(.active):hover{background:#f3f3f3}
 .shape-presets button:not([aria-pressed=true]):hover{background:#e9e9e9;border-color:#ccc;color:#333}
}
@media screen and (prefers-reduced-motion:no-preference){.tabs a,.segmented button,.shape-presets button,.btn,.optimize-button,.pattern-options button{transition:background .16s,color .16s,box-shadow .16s,transform .12s}}

/* Offcut reuse is a switch; the full row remains a comfortable tap target. */
.optimize-toggle{display:flex;align-items:center;gap:10px;width:100%;min-height:56px;margin:0 0 24px;padding:12px 14px;border:1px solid #e4e4e4;border-radius:12px;background:#f8f8f8;color:#222;font-size:14px;font-weight:600;line-height:1.4;text-align:left}
.optimize-toggle[hidden]{display:none}
.optimize-toggle>svg{width:20px;height:20px;flex:0 0 20px;fill:none;stroke:currentColor;stroke-width:1.7}
.optimize-toggle #optimize-label{min-width:0}
.optimize-control{margin-left:auto;display:flex;align-items:center;gap:9px;flex-shrink:0}
#optimize-status{font-size:11px;font-weight:500;color:#757575}
.optimize-track{position:relative;display:block;width:48px;height:28px;border:1px solid #cdcdcd;border-radius:20px;background:#dcdcdc;box-shadow:inset 0 1px 3px #00000012}
.optimize-track::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:linear-gradient(#fff,#f8f8f8);box-shadow:0 1px 3px #00000030}
.optimize-toggle[aria-checked=true] .optimize-track{background:linear-gradient(155deg,#414141,#111);border-color:#222;box-shadow:inset 0 1px 1px #ffffff55,0 2px 5px #00000018}
.optimize-toggle[aria-checked=true] .optimize-track::after{transform:translateX(20px)}
.optimize-toggle[aria-checked=true] #optimize-status{color:#222}
.optimize-toggle:not(:disabled):hover{border-color:#bcbcbc}
.optimize-toggle:focus-visible{outline:2px solid #555;outline-offset:3px}
.optimize-toggle:disabled{opacity:.45;cursor:not-allowed}
.affiliate-link:hover{color:#d83c20;text-decoration:underline;text-underline-offset:3px}
.affiliate-link:focus-visible{outline-color:#ee4d2d}
@media(prefers-reduced-motion:no-preference){.optimize-track,.optimize-track::after{transition:background .18s,transform .18s,box-shadow .18s}}
@media(max-width:380px){.optimize-toggle{padding:12px 10px;gap:8px;font-size:13px}.optimize-control{gap:6px}}
@media(hover:hover){.affiliate .apply-product:not(:disabled):hover{background:#e6e6e6;border-color:#c9c9c9;color:#222;box-shadow:inset 0 1px 1px #ffffff80,0 2px 5px #0000000d}}

/* Keep secondary text readable on the existing white/grey surfaces. */
.overline,.pattern-note,.wall-toggle,.scene-disclaimer,.section-heading>span,
#optimize-status,.purchase-or,.estimate-cost strong.is-empty,.result-foot,
.affiliate-heading>span,.affiliate-price span,.affiliate .affiliate-note,
.affiliate .affiliate-price.is-unavailable,.affiliate .affiliate-price-note,
.steps .number,.steps p,footer p,footer nav a{color:#666}
.affiliate-link{color:#ce351a}
.affiliate-link:hover{color:#ac2c16}

/* Guides live on their own routes; calculator panels remain uncluttered. */
.article .breadcrumbs{font-size:12px;line-height:1.7;color:#666;overflow-wrap:anywhere}
.article .article-meta{font-size:12px;color:#666;margin:18px 0 28px}
.article-toc{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:20px 24px;border:1px solid #e4e4e4;border-radius:14px;background:#fafafa;margin-bottom:32px;font-size:13px}
.article-toc a,.guide-related a{color:#333;text-decoration:none;line-height:1.6}
.article-toc a:hover,.guide-related a:hover{text-decoration:underline;text-underline-offset:4px}
.article h2[id]{scroll-margin-top:90px}
.table-scroll{overflow-x:auto;margin:24px 0;border:1px solid #e3e3e3;border-radius:12px}
.article .table-scroll table{margin:0;min-width:440px;width:100%;border-collapse:collapse;font-size:13px}
.article table caption{text-align:left;padding:16px;background:#f5f5f5;color:#555;font-size:12px}
.article table th,.article table td{padding:14px;text-align:left;vertical-align:top;line-height:1.5}
.article table th[scope=row]{font-weight:500}
.article .guide-diagram{display:block;width:100%;height:auto;margin:24px 0;background:#fafafa;border:1px solid #e7e7e7;border-radius:14px;font-size:16px;fill:#333}
.guide-related{display:flex;flex-direction:column;align-items:flex-start;gap:14px;border-top:1px solid #ddd;padding-top:28px;margin-top:40px;font-size:14px}
.article .guide-related h2{margin:0 0 6px;font-size:22px}
.article .guide-cta{margin:32px 0}
.guide-list{display:grid;gap:0;margin-top:36px;border-top:1px solid #ddd}
.guide-list>a{display:grid;grid-template-columns:26px minmax(0,1fr) 20px;gap:18px;padding:27px 0;text-decoration:none;border-bottom:1px solid #ddd;color:#222}
.article .guide-list h2{font-size:21px;line-height:1.35;margin:0 0 10px;letter-spacing:-.3px}
.article .guide-list p{font-size:14px;line-height:1.7;margin:0;color:#666}
.guide-index{font-size:12px;color:#666;padding-top:4px;font-variant-numeric:tabular-nums}
.guide-list>a:hover h2{text-decoration:underline;text-underline-offset:5px}
.guide-tools{display:flex;flex-wrap:wrap;gap:14px 24px;margin-top:40px}
.guide-tools h2{width:100%;margin:0 0 4px;font-size:22px}
.guide-tools>a{font-size:14px;color:#333}
@media(max-width:540px){.article{padding-inline:20px}.article .guide-list h2{font-size:19px}.guide-list>a{gap:12px;grid-template-columns:22px minmax(0,1fr) 16px}.article-toc{padding:18px}.article .table-scroll table{font-size:12px}.article .guide-diagram{font-size:17px}footer nav{row-gap:16px}}
@media print{.article-toc,.guide-related,.guide-tools,.guide-cta{display:none}.table-scroll{overflow:visible}.article .table-scroll table{min-width:0}.article{max-width:none}.article h2{break-after:avoid}.article table,.guide-diagram{break-inside:avoid}}

@media(min-width:761px){.wall-studio{align-self:start}.wall-studio>.scene-frame{flex:none;height:clamp(360px,45vw,520px);min-height:360px}}