@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#273b36;--muted:#7d8680;--green:#315b4c;--accent:#dce8cf;--paper:#f7f7f2;--line:#e1e4dc;--white:#fff;--orange:#a75a2b}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px 'DM Sans',Segoe UI,sans-serif}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;background:white;border:1px solid var(--line);border-radius:7px;padding:9px 13px;transition:.15s}button:hover{border-color:#829b88;background:#f0f5eb}button:disabled{opacity:.4;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #8fae69;outline-offset:2px}button.primary{background:var(--green);border-color:var(--green);color:white}button.primary:hover{background:#254739}button.soft{background:#edf2e6;border-color:#e3ead9}button.danger{color:#ab513e}button.selected{background:#e0ebd6;border-color:#78916d}header{height:90px;padding:0 30px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:40px;background:white}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--ink);letter-spacing:2px;font-weight:800;font-family:Manrope,sans-serif}.brand small{display:block;letter-spacing:2.8px;font-size:9px;font-weight:500;margin-top:4px}.mark{font-size:40px;letter-spacing:-5px;background:#e2ebd9;line-height:44px;width:47px;height:47px;border-radius:11px;text-align:center;padding-right:5px}.project-heading{border-left:1px solid var(--line);padding-left:28px}.project-heading input{border:0;padding:0;background:transparent;width:220px;font-weight:600}.project-heading span{display:block;font-size:11px;color:var(--muted);margin-top:5px}.header-actions{margin-left:auto;display:flex;align-items:center;gap:7px}.beta{font-size:9px;color:#7c896e;letter-spacing:1.5px;margin-right:14px}nav{display:flex;padding:0 30px;gap:8px;border-bottom:1px solid var(--line);background:white}nav button{border:0;border-radius:0;background:transparent;padding:18px 22px;color:var(--muted);border-bottom:3px solid transparent;display:flex;gap:12px;align-items:center}nav button.active{border-bottom-color:var(--green);color:var(--green);font-weight:700}nav button em{font-style:normal;font-size:11px;opacity:.6}nav .admin-nav{margin-left:auto}main{max-width:1800px;margin:auto;padding:25px 28px}.eyebrow{color:#7e8e70;font-size:10px;text-transform:uppercase;letter-spacing:2px;font-weight:700}h1,h2,h3,p{margin-top:0}h1{font:600 29px Manrope,sans-serif;letter-spacing:-1px;margin-bottom:8px}h2{font:600 19px Manrope,sans-serif;letter-spacing:-.4px}h3{font-size:13px;margin-bottom:14px}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:23px}.intro p{color:var(--muted);margin:0;font-size:12px}.tag{font-size:10px;padding:5px 9px;border-radius:4px;background:#edf2e6;color:#627954}.grid{display:grid;gap:20px}.materials{grid-template-columns:1fr 1fr 320px}.card{background:white;border:1px solid var(--line);border-radius:12px;overflow:hidden}.pad{padding:23px}.material-card{cursor:pointer;position:relative}.material-card.active{border:2px solid #527253}.material-image{height:240px;overflow:hidden;background:#363934;position:relative}.material-image img{width:100%;height:100%;object-fit:cover}.material-image .tag{position:absolute;bottom:15px;left:18px;background:#ffffffed}.material-card h2{margin-bottom:6px}.material-card .code{font-size:11px;color:var(--muted)}.check-badge{position:absolute;right:15px;top:15px;background:#e3edce;border-radius:50%;padding:6px 10px}.formats{display:flex;gap:6px;flex-wrap:wrap;margin-top:16px}.formats span{font-size:11px;background:#f4f5ef;padding:7px;border-radius:4px}.divider{height:1px;background:var(--line);margin:20px 0}.field{display:block;font-size:11px;color:#737e76;margin:13px 0 5px}.input,input[type=number],input[type=text],input[type=date],select,textarea{width:100%;padding:9px 10px;border:1px solid var(--line);background:#fff;border-radius:6px;min-width:0}textarea{resize:vertical;min-height:75px}.row{display:flex;gap:10px}.row>*{flex:1;min-width:0}.stack{display:flex;flex-direction:column;gap:8px}.note{font-size:11px;line-height:1.7;color:var(--muted)}.notice{padding:12px 14px;border:1px solid #e4d9c5;background:#faf6ee;border-radius:7px;color:#8d6e40;font-size:11px;line-height:1.6}.good{border-color:#dbe5cc;background:#f2f6ec;color:#567348}.next{display:flex;justify-content:flex-end;margin-top:20px}.editor{display:grid;grid-template-columns:240px minmax(420px,1fr) 285px;gap:16px;min-height:640px}.library,.inspector{align-self:start;max-height:77vh;overflow:auto}.section-label{font-size:10px;text-transform:uppercase;letter-spacing:1.8px;color:var(--muted);margin:22px 0 11px}.section-label:first-child{margin-top:0}.insert{width:100%;text-align:left;display:flex;align-items:center;gap:12px;margin:7px 0;padding:12px}.insert span.icon{font-size:22px;color:#647d5c;min-width:25px;text-align:center}.insert strong{font-weight:500;font-size:12px;display:block}.insert small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.piece-item{display:flex;align-items:center;gap:8px;border-radius:6px;cursor:pointer;padding:11px 7px;border-bottom:1px solid #edf0e7}.piece-item.active{background:#edf3e5}.piece-item strong{font-size:11px;padding:5px;background:#dce7d1;border-radius:4px}.piece-item small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.piece-item button{margin-left:auto;padding:3px 7px}.canvas-card{display:flex;flex-direction:column;min-width:0}.toolbar{display:flex;align-items:center;padding:13px 16px;border-bottom:1px solid var(--line);gap:6px;flex-wrap:wrap}.toolbar button{padding:7px 10px;font-size:11px}.toolbar .right{margin-left:auto}.drawing-wrap{background-color:#fafbf7;background-image:radial-gradient(#cfd7c8 .75px,transparent .75px);background-size:18px 18px;min-height:450px;flex:1;position:relative;overflow:hidden}.drawing-wrap svg{width:100%;height:100%;min-height:450px;display:block;touch-action:none}.drawing-wrap svg text{font-family:'DM Sans',sans-serif}.canvas-footer{display:flex;gap:15px;padding:13px 18px;font-size:10px;color:var(--muted);border-top:1px solid var(--line)}.canvas-footer .dot{display:inline-block;width:7px;height:7px;background:#78a364;border-radius:50%;margin-right:5px}.svg-piece{cursor:grab}.svg-piece:active{cursor:grabbing}.svg-comp{cursor:move}.selection-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.selection-title h2{margin:0}.switch{display:flex;gap:8px;align-items:center;font-size:12px;line-height:1.5;margin:10px 0}.switch input{accent-color:var(--green);width:15px;height:15px}.subtle{color:var(--muted)}.small{font-size:11px}.component-list button{width:100%;text-align:left;margin-top:6px;font-size:11px}.edge-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px}.bottom-strip{margin-top:16px;display:flex;gap:12px}.bottom-strip>.notice{flex:1}.split{grid-template-columns:minmax(0,1fr) 320px}.summary-line{display:flex;justify-content:space-between;gap:15px;font-size:12px;padding:10px 0;border-bottom:1px solid #eef0e8}.price{font:600 30px Manrope,sans-serif;letter-spacing:-1px;margin:12px 0 4px}.price small{font:12px 'DM Sans',sans-serif;letter-spacing:0}.big-price{font-size:38px}.variant{padding:18px;border:1px solid var(--line);border-radius:9px;background:#fff;cursor:pointer}.variant.active{border-color:#527253;background:#f5f8ef}.variant strong{font-size:13px}.packing-svg{width:100%;height:auto;max-height:420px;display:block}.packing-svg text{font:11px 'DM Sans',sans-serif}.stock-label{display:flex;justify-content:space-between;font-size:12px;margin-bottom:10px}.stock{margin-bottom:16px}.service{display:flex;align-items:center;gap:12px;padding:15px 0;border-bottom:1px solid var(--line)}.service input{accent-color:var(--green);width:17px;height:17px}.service strong{font-size:13px;font-weight:500}.service small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.service .tag{margin-left:auto}.service input[type=number]{width:70px;margin-left:auto}.services-grid{grid-template-columns:1fr 1fr}.table{width:100%;border-collapse:collapse;font-size:12px}.table th,.table td{padding:12px 8px;border-bottom:1px solid var(--line);text-align:left}.table th{color:var(--muted);font-size:10px;text-transform:uppercase;font-weight:500}.table input{max-width:110px}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px}.metric{background:#f4f6ee;border-radius:9px;padding:17px}.metric strong{font:600 23px Manrope;display:block;margin-top:7px}.instructions details{border-bottom:1px solid var(--line);padding:14px 0}.instructions summary{cursor:pointer;font-size:13px}.instructions p{font-size:12px;line-height:1.8;margin:12px 0;color:#6f7c73}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#284d3d;color:white;padding:12px 22px;border-radius:8px;box-shadow:0 6px 30px #243f3022;display:none;z-index:20;font-size:12px}.print-only{display:none}.attachment{font-size:11px;margin:8px 0;color:var(--muted)}.pill-buttons{display:flex;gap:6px}.delete{float:right}.elevation{margin-top:20px}.empty{padding:70px 25px;text-align:center;color:var(--muted)}@media(min-width:1400px){.drawing-wrap{min-height:550px}}@media(max-width:1150px){header{gap:20px;padding:15px;height:auto}.beta{display:none}.project-heading{padding-left:16px}.header-actions{flex-wrap:wrap;justify-content:end}.editor{grid-template-columns:190px minmax(300px,1fr) 250px;gap:10px}main{padding:20px 15px}.pad{padding:17px}.materials{grid-template-columns:1fr 1fr}.materials>aside{grid-column:1/-1}nav{padding:0 12px}nav button{padding:15px 12px}}@media(max-width:850px){header{flex-wrap:wrap}.header-actions{width:100%;justify-content:start}.project-heading{margin-left:auto}.editor{grid-template-columns:180px minmax(0,1fr)}.inspector{grid-column:1/-1;max-height:none}.library{max-height:none}.split{grid-template-columns:1fr}.services-grid{grid-template-columns:1fr}nav{overflow:auto}nav button{white-space:nowrap}.intro{gap:12px}.materials{grid-template-columns:1fr}.materials>aside{grid-column:auto}}@media(max-width:560px){.editor{display:flex;flex-direction:column}.library{order:1}.inspector{order:2}.canvas-card{order:0}.brand{font-size:12px}.project-heading{border:0;padding:0;margin:0}.project-heading input{width:160px}.header-actions button{font-size:11px;padding:7px}h1{font-size:24px}.metric-grid{grid-template-columns:1fr 1fr}.material-image{height:200px}.intro{display:block}.intro .tag{display:inline-block;margin-top:10px}}@media print{header,nav,.no-print,#toast{display:none!important}body{background:white;font-size:11px}main{padding:0;max-width:none}.print-only{display:block}.print-sheet{page-break-after:always}.print-sheet:last-child{page-break-after:auto}.print-sheet h1{font-size:24px}.print-sheet svg{width:100%;max-height:600px}.print-sheet .price{font-size:26px}.card{border:0}.print-sheet table{width:100%;border-collapse:collapse}.print-sheet td,.print-sheet th{text-align:left;padding:8px;border-bottom:1px solid #ddd}.screen-content{display:none!important}@page{size:A4 landscape;margin:14mm}}

.radius-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.radius-control{min-width:0}.radius-presets{display:flex;gap:4px;margin-top:6px}.radius-presets button{flex:1;min-width:0;padding:7px 4px;font-size:11px}.canvas-footer{flex-wrap:wrap}

.grain-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:14px 18px;border-bottom:1px solid #e2e8dd;background:#f6f8f2}.grain-controls strong{font-size:13px}.grain-controls p{margin:4px 0 0;font-size:11px;color:#798774}.grain-options{display:flex;gap:6px}.grain-options button{white-space:nowrap}.grain-hint{font-size:11px;color:#60735e;flex:1;min-width:160px}

.panel-set{border-top:1px solid #e2e8dd;margin-top:18px;padding-top:4px}.panel-set .switch{margin:8px 0}.panel-set>button{width:100%;margin-top:8px;font-size:12px}

.elevation-piece{cursor:pointer}.elevation-piece .svg-comp{cursor:move}

/* Material catalogue: three equally sized cards and separate project settings. */
@media(min-width:1201px){.materials{grid-template-columns:repeat(3,minmax(0,1fr)) 280px}}
@media(min-width:761px) and (max-width:1200px){.materials{grid-template-columns:repeat(3,minmax(0,1fr))}.materials>aside{grid-column:1/-1}}

/* Keep every material card in the two catalogue columns, regardless of catalogue size. */
@media(min-width:1201px){.materials{grid-template-columns:repeat(2,minmax(0,1fr)) 280px}.materials>.material-card:nth-of-type(odd){grid-column:1}.materials>.material-card:nth-of-type(even){grid-column:2}.materials>aside{grid-column:3;grid-row:1 / span 3;align-self:start}}
/* Dedicated large-format report pages; the JPG uses the same SVG pages. */
@media print{
 @page{size:A3 portrait;margin:10mm}
 .print-only .report-sheet{width:277mm;height:391.2625mm;margin:0;padding:0;break-after:page;page-break-after:always;overflow:hidden}
 .print-only .report-sheet:last-child{break-after:auto;page-break-after:auto}
 .print-only .report-sheet>svg{display:block;width:100%;height:100%;max-height:none}
 .print-only .report-sheet svg{max-height:none}
 .print-only .report-sheet .utility-dimension text{paint-order:stroke;stroke:#fff;stroke-width:3px}
}
.header-actions{flex-wrap:wrap}

@media print{.print-only .report-sheet svg svg{width:revert;height:revert;max-height:none}}