/* 2.3.34: existing functional planner component rules scoped above theme button defaults. Native page layout remains in Elementor. */
body[class] .lab-page{padding-top: 36px; padding-bottom: 70px;}
body[class] .lab-page > h1{font-size: clamp(32px, 4vw, 52px); max-width: 980px; margin: 12px 0px;}
body[class] .lab-page > .lead{max-width: 900px; font-size: 19px;}
body[class] .lab-switch{display: flex; justify-content: space-between; gap: 24px; align-items: center; margin: 28px 0px 22px;}
body[class] .lab-switch h2{font-size: 24px; margin: 7px 0px;}
body[class] .lab-switch [role="group"]{display: flex; flex-wrap: wrap; gap: 6px; padding: 6px; background: rgb(244, 244, 244); border-radius: 28px;}
body[class] .lab-switch button,body[class] .lab-stage button,body[class] .lab-step-actions > button:not(.button){min-height: 44px; border: 1px solid rgb(212, 212, 212); border-radius: 24px; padding: 10px 17px; background: white; color: rgb(33, 33, 33); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 15px; cursor: pointer;}
body[class] .lab-switch [aria-pressed="true"],body[class] .lab-stage [aria-pressed="true"]{background: rgb(33, 33, 33); color: white; border-color: rgb(33, 33, 33);}
body[class] .lab-layout{display: grid; grid-template-columns: minmax(0px, 1.15fr) minmax(360px, 0.85fr); gap: 24px; align-items: start; position: relative;}
body[class] .lab-stage{background: rgb(247, 248, 248); border: 1px solid rgb(223, 225, 225); border-radius: 20px; overflow: hidden; position: sticky; top: 110px; min-width: 0px;}
body[class] .lab-stage-top{padding: 18px 20px; display: flex; justify-content: space-between; align-items: center; gap: 12px; background: white;}
body[class] .lab-stage-top b{font-size: 20px;}
body[class] .lab-stage-top > div{display: flex; gap: 5px;}
body[class] .lab-stage svg{display: block; width: 100%; height: auto; min-height: 270px; max-height: 60vh;}
body[class] .lab-svg-label{font: 600 17px Inter, sans-serif; fill: rgb(33, 33, 33); stroke: rgb(248, 249, 249); stroke-width: 5px; paint-order: stroke;}
body[class] .lab-svg-angle{font: 600 16px Inter, sans-serif; fill: rgb(33, 33, 33); stroke: white; stroke-width: 5px; paint-order: stroke;}
body[class] .lab-stage-caption{display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; padding: 14px 20px; font-size: 14px; border-top: 1px solid rgb(221, 221, 221);}
body[class] .lab-stage-note{padding: 22px; background: rgb(255, 246, 210);}
body[class] .lab-stage-note p{margin: 8px 0px 0px; font-size: 15px; line-height: 1.5;}
body[class] .lab-controls{border: 1px solid rgb(221, 221, 221); background: white; border-radius: 20px; overflow: hidden; min-width: 0px;}
body[class] .lab-tabs{display: flex; gap: 4px; padding: 12px; border-bottom: 1px solid rgb(221, 221, 221);}
body[class] .lab-tabs button{flex: 1 1 0%; min-width: 0px; padding: 10px 4px; border: 0px; background: rgb(245, 245, 245); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 14px; line-height: 1.35; border-radius: 10px; color: rgb(33, 33, 33); cursor: pointer;}
body[class] .lab-tabs span{display: block; font-weight: 600; font-size: 19px; margin-bottom: 5px;}
body[class] .lab-tabs [aria-current="step"]{background: rgb(255, 202, 34);}
body[class] .lab-panels > details{border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgb(221, 221, 221); border-image: none;}
body[class] .lab-panels summary{cursor: pointer; font-size: 18px; font-weight: 600; padding: 18px 22px; display: flex; align-items: center; gap: 12px;}
body[class] .lab-panels summary::after{content: "+"; margin-left: auto;}
body[class] .lab-panels [open] > summary::after{content: "−";}
body[class] .lab-panels summary > span{color: rgb(119, 119, 119); font-size: 14px;}
body[class] .lab-panel-body{padding: 0px 22px 24px;}
body[class] .lab-panel-body p{font-size: 16px; line-height: 1.6;}
body[class] .lab-panel-body h3{font-size: 18px; margin: 22px 0px 12px;}
body[class] .studio .lab-panels summary{display: none;}
body[class] .studio .lab-panels details:not([open]){display: none;}
body[class] .studio .lab-panel-body{padding-top: 22px;}
body[class] .compact .lab-tabs{display: none;}
body[class] .lab-fields{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 18px;}
body[class] .lab-controls label{display: flex; flex-direction: column; gap: 8px; font-size: 15px; font-weight: 600; min-width: 0px;}
body[class] .lab-controls input,body[class] .lab-controls select{width: 100%; min-width: 0px; border: 1px solid rgb(197, 200, 200); background: rgb(255, 255, 255); border-radius: 9px; padding: 12px; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 16px; color: rgb(33, 33, 33); min-height: 46px;}
body[class] .lab-controls input:focus,body[class] .lab-controls select:focus{outline: rgb(255, 202, 34) solid 3px; outline-offset: 1px;}
body[class] .lab-unit{position: relative;}
body[class] .lab-unit input{padding-right: 48px;}
body[class] .lab-unit > span{position: absolute; right: 12px; top: 14px; font-size: 14px; color: rgb(102, 102, 102);}
body[class] .lab-choices{display: flex; flex-wrap: wrap; gap: 9px;}
body[class] .lab-choices button{padding: 12px 17px; border-radius: 10px; border: 1px solid rgb(184, 188, 188); background: rgb(255, 255, 255); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 16px; min-height: 48px; cursor: pointer;}
body[class] .lab-choices [aria-pressed="true"]{border: 2px solid rgb(33, 33, 33); background: rgb(255, 243, 196); padding: 11px 16px;}
body[class] .lab-colors{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 10px;}
body[class] .lab-colors button{border: 1px solid rgb(214, 214, 214); padding: 10px; background: white; border-radius: 10px; font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 13px; cursor: pointer; color: rgb(33, 33, 33); line-height: 1.4;}
body[class] .lab-colors i{display: flex; align-items: center; justify-content: center; height: 42px; border-radius: 5px; margin-bottom: 9px; font-size: 25px; font-style: normal; border: 1px solid rgb(187, 187, 187);}
body[class] .lab-colors [aria-pressed="true"]{border: 2px solid rgb(33, 33, 33); background: rgb(255, 246, 215);}
body[class] .lab-controls .lab-check{flex-direction: row; gap: 12px; align-items: flex-start; margin: 18px 0px; font-size: 16px; font-weight: 400; line-height: 1.5;}
body[class] .lab-check input{width: 22px; min-height: 22px; margin: 1px 0px; flex-shrink: 0; accent-color: rgb(33, 33, 33);}
body[class] .lab-help{color: rgb(90, 90, 90); line-height: 1.55; font-size: 14px !important;}
body[class] .lab-step-actions{display: flex; gap: 12px; padding: 18px 22px; justify-content: space-between;}
body[class] .lab-step-actions .button{min-height: 46px;}
body[class] .lab-price-bar{grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-width: 3px 1px 1px; border-style: solid; border-color: rgb(255, 202, 34) rgb(221, 221, 221) rgb(221, 221, 221); border-image: none; border-radius: 16px; padding: 20px 24px; background: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.03) 0px 6px 22px; position: sticky; bottom: 16px; z-index: 9;}
body[class] .lab-price-bar strong{font-size: 32px; display: block; line-height: 1.3;}
body[class] .lab-price-bar small,body[class] .lab-price-bar span{font-size: 13px; display: block; line-height: 1.5; color: rgb(85, 85, 85);}
body[class] .lab-price-bar b{font-size: 23px;}
body[class] .lab-price-bar .button{max-width: 380px; min-height: 50px;}
body[class] .lab-controls .field-error{padding: 0px 22px;}
body[class] .lab-tiers{margin-top: 28px; border: 1px solid rgb(221, 221, 221); border-radius: 14px; padding: 18px 22px;}
body[class] .lab-tiers summary{font-size: 18px; font-weight: 600; cursor: pointer;}
body[class] .lab-tiers table{width: 100%; border-collapse: collapse; margin-top: 16px;}
body[class] .lab-tiers td,body[class] .lab-tiers th{padding: 12px; text-align: left; border-bottom: 1px solid rgb(221, 221, 221); font-size: 16px;}
body[class] .lab-tiers .active{background: rgb(255, 244, 196); font-weight: 600;}
body[class] .lab-tiers p{font-size: 14px;}
body[class] .lab-summary > div{display: flex; justify-content: space-between; gap: 16px; padding: 12px 0px; border-bottom: 1px solid rgb(221, 221, 221); font-size: 15px;}
body[class] .lab-summary dd{margin: 0px; text-align: right; font-weight: 600; overflow-wrap: anywhere;}
body[class] .lab-bom > span{display: inline-block; padding: 8px; background: rgb(245, 245, 245); margin: 4px; border-radius: 6px; font-size: 14px;}
body[class] .lab-export{display: flex; flex-wrap: wrap; gap: 12px;}
body[class] .lab-export button,body[class] .lab-draw-tools button{font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 14px; border: 1px solid rgb(204, 204, 204); padding: 10px 12px; border-radius: 8px; background: white; min-height: 44px; cursor: pointer;}
body[class] .lab-draw-tools{display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 20px;}
body[class] .lab-document-links,body[class] .lab-comparison-links{display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0px;}
body[class] .lab-document-links a{border: 1px solid rgb(204, 204, 204); border-radius: 12px; padding: 14px 20px; line-height: 1.5; background: rgb(255, 255, 255); font-size: 16px;}
body[class] .lab-comparison-grid{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 24px; margin: 28px 0px;}
body[class] .lab-comparison-grid article{border: 1px solid rgb(221, 221, 221); border-radius: 20px; padding: 28px; background: white;}
body[class] .lab-comparison-grid h2{font-size: 25px; line-height: 1.2;}
body[class] .lab-comparison-grid p{font-size: 17px; line-height: 1.6;}
body[class] .lab-comparison-grid .variant-number{font-size: 60px; line-height: 1.4; color: rgb(33, 33, 33); border-bottom: 5px solid rgb(255, 202, 34); display: inline-block;}
@media (min-width: 1400px){
body[class] .studio .lab-stage svg{min-height: 480px;}
}
@media (max-width: 1100px){
body[class] .lab-layout{grid-template-columns: minmax(0px, 1fr) minmax(320px, 0.9fr);}
body[class] .lab-switch{align-items: flex-start; flex-direction: column;}
body[class] .lab-tabs{flex-wrap: wrap;}
body[class] .lab-tabs button{flex-basis: 28%;}
body[class] .lab-comparison-grid{gap: 15px;}
}
@media (max-width: 800px){
body[class] .lab-layout{grid-template-columns: 1fr; gap: 16px;}
body[class] .lab-stage{position: static;}
body[class] .lab-stage svg{min-height: 0px; max-height: 360px;}
body[class] .lab-stage-note{display: none;}
body[class] .lab-tabs{flex-wrap: nowrap; overflow: auto;}
body[class] .lab-tabs button{flex-basis: auto; flex-shrink: 0; min-width: 76px;}
body[class] .lab-tabs span{font-size: 16px;}
body[class] .lab-switch h2{font-size: 22px;}
body[class] .lab-switch button{font-size: 14px; padding: 10px 13px;}
body[class] .lab-price-bar{bottom: 8px; padding: 14px; border-radius: 14px; gap: 12px; flex-wrap: wrap;}
body[class] .lab-price-bar strong{font-size: 28px;}
body[class] .lab-price-bar .button{flex: 1 1 0%; min-width: 180px; padding: 13px 16px; font-size: 15px;}
body[class] .lab-price-bar small{font-size: 12px;}
body[class] .lab-price-bar span{font-size: 12px;}
body[class] .lab-stage-top{padding: 14px;}
body[class] .lab-stage-top b{font-size: 18px;}
body[class] .lab-stage-top button{font-size: 13px; padding: 9px 12px;}
body[class] .lab-comparison-grid{grid-template-columns: 1fr;}
body[class] .lab-page{padding-top: 20px;}
body[class] .lab-page > .lead{font-size: 17px;}
body[class] .lab-panel-body{padding: 0px 18px 20px;}
body[class] .studio .lab-panel-body{padding: 20px 18px;}
body[class] .lab-step-actions{padding: 18px;}
body[class] .lab-tiers{padding: 18px 12px;}
body[class] .lab-tiers td,body[class] .lab-tiers th{font-size: 14px; padding: 10px 7px;}
}
@media (max-width: 420px){
body[class] .lab-fields{grid-template-columns: 1fr;}
body[class] .lab-colors{grid-template-columns: repeat(2, minmax(0px, 1fr));}
body[class] .lab-price-bar{position: static;}
body[class] .lab-price-bar .button{max-width: none; width: 100%;}
body[class] .lab-summary > div{flex-direction: column; gap: 4px;}
body[class] .lab-summary dd{text-align: left;}
body[class] .lab-stage-caption{font-size: 12px;}
}
@media (prefers-reduced-motion: reduce){
body[class] .lab-layout *{scroll-behavior: auto !important; transition: none !important;}
}
body[class] .lab-cut-tools{display: flex; flex-wrap: wrap; gap: 8px; padding: 14px;}
body[class] .lab-cut-tools button{min-height: 44px; font-size: 15px;}
body[class] .lab-panel-body [data-cut-action]{min-height: 46px; border-radius: 10px; padding: 10px 16px; border: 1px solid rgb(198, 204, 200); background: rgb(255, 202, 34); font: inherit;}
body[class] .lab-panel-body [data-cut-length],body[class] .lab-panel-body [data-cut-angle]{min-height: 46px; width: 100%; font-size: 16px;}
@media (max-width: 600px){
body[class] .lab-stage .lab-svg-label{font-size: 29px;}
body[class] .lab-stage .lab-svg-angle{font-size: 27px;}
body[class] .lab-stage [data-cut-canvas] > text{font-size: 23px;}
}
body[class] .alu-draw{--draw-gold: #ffca22; --draw-ink: #202727; color: var(--draw-ink); background: white; border: 1px solid rgb(219, 224, 221); border-radius: 22px; overflow: hidden; margin: 24px 0px; font: 400 16px / 1.5 Inter, Arial, sans-serif; isolation: isolate;}
body[class] .alu-draw *{box-sizing: border-box;}
body[class] .alu-draw button,body[class] .alu-draw input,body[class] .alu-draw select{font: inherit; color: inherit;}
body[class] .alu-draw button{cursor: pointer; border: 1px solid rgb(209, 216, 212); border-radius: 10px; background: white; min-height: 46px; padding: 10px 14px; line-height: 1.3; transition: background 0.15s;}
body[class] .alu-draw button:hover{background: rgb(255, 246, 209);}
body[class] .alu-draw button:disabled{opacity: 0.45; cursor: not-allowed;}
body[class] .alu-draw :focus-visible{outline: rgb(212, 155, 0) solid 3px; outline-offset: 3px;}
body[class] .alu-draw [hidden]{display: none !important;}
body[class] .alu-draw .draw-primary{background: var(--draw-gold); border-color: var(--draw-gold); font-weight: 650; min-height: 50px;}
body[class] .alu-draw button[aria-pressed="true"]{background: var(--draw-ink); color: white; border-color: var(--draw-ink);}
body[class] .draw-topline{display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 17px 22px;}
body[class] .draw-topline > div{display: flex; align-items: center; gap: 10px; flex-wrap: wrap;}
body[class] .draw-topline strong{font-size: 20px;}
body[class] .draw-live-dot{width: 9px; height: 9px; border-radius: 50%; background: rgb(217, 167, 28); box-shadow: rgb(255, 246, 210) 0px 0px 0px 5px;}
body[class] .draw-version{font-size: 13px; background: rgb(241, 244, 242); padding: 4px 10px; border-radius: 20px;}
body[class] .draw-topline button{font-size: 14px;}
body[class] .draw-workflow{display: flex; background: rgb(243, 245, 243); border-top: 1px solid rgb(225, 228, 225); border-bottom: 1px solid rgb(225, 228, 225); gap: 10px; padding: 12px 22px;}
body[class] .draw-workflow button{flex: 1 1 0%; border: 0px; background: transparent; text-align: left; font-size: 16px; font-weight: 600;}
body[class] .draw-workflow span{display: inline-flex; border-radius: 50%; background: white; border: 1px solid rgb(211, 217, 213); width: 31px; height: 31px; align-items: center; justify-content: center; margin-right: 8px; font-size: 13px;}
body[class] .draw-workspace{display: grid; grid-template-columns: minmax(0px, 1fr) 360px;}
body[class] .draw-stage{min-width: 0px; border-right: 1px solid rgb(220, 226, 222);}
body[class] .draw-tools{display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding: 12px; border-bottom: 1px solid rgb(225, 230, 227);}
body[class] .draw-tools > div{display: flex; gap: 5px; flex-wrap: wrap;}
body[class] .draw-tools button{padding: 8px 11px; font-size: 14px; min-height: 44px;}
body[class] .draw-tools > div + div button{min-width: 44px; font-size: 20px;}
body[class] .draw-viewport{position: relative; height: clamp(340px, 52vh, 660px); min-width: 0px; overflow: hidden; background: rgb(248, 250, 249);}
body[class] .draw-viewport > svg{width: 100%; height: 100%; display: block; touch-action: none; user-select: none;}
body[class] .alu-draw[data-tool="draw"] .draw-viewport > svg{cursor: crosshair;}
body[class] .alu-draw[data-tool="pan"] .draw-viewport > svg{cursor: grab;}
body[class] .draw-svg-label{cursor: pointer;}
body[class] .draw-svg-label rect{fill: white; stroke: rgb(208, 216, 211); stroke-width: 1;}
body[class] .draw-svg-label text{fill: rgb(40, 51, 47); font: 600 14px Inter, Arial, sans-serif; pointer-events: none;}
body[class] .draw-svg-label.angle rect{fill: rgb(255, 243, 191); stroke: rgb(223, 190, 99);}
body[class] .draw-node{pointer-events: none;}
body[class] .draw-start-help,body[class] .draw-material-mask{position: absolute; inset: 0px; display: flex; justify-content: center; align-items: center; flex-direction: column; text-align: center; pointer-events: none; padding: 24px;}
body[class] .draw-start-help{background: linear-gradient(90deg, rgba(248, 250, 249, 0.565), transparent, rgba(248, 250, 249, 0.565));}
body[class] .draw-cross{display: grid; place-items: center; width: 60px; height: 60px; border-radius: 20px; background: rgb(255, 202, 34); box-shadow: rgba(204, 171, 55, 0.25) 0px 14px 36px; font-size: 34px; line-height: 1;}
body[class] .draw-start-help h2,body[class] .draw-material-mask h2{font-size: clamp(25px, 2.5vw, 38px); letter-spacing: -0.035em; line-height: 1.15; margin: 18px 0px 10px;}
body[class] .draw-start-help p,body[class] .draw-material-mask p{font-size: 16px; line-height: 1.7; max-width: 390px; margin: 0px;}
body[class] .draw-material-mask{background: linear-gradient(135deg, rgba(250, 252, 251, 0.933), rgba(242, 246, 243, 0.933)); z-index: 2;}
body[class] .draw-material-mask > span{font-size: 28px; color: rgb(179, 132, 8); border-bottom: 4px solid rgb(255, 202, 34);}
body[class] .draw-live-measure{position: absolute; bottom: 12px; left: 12px; right: 12px; border: 1px solid rgb(226, 194, 99); box-shadow: rgba(41, 53, 35, 0.047) 0px 4px 20px; background: rgb(255, 246, 216); border-radius: 12px; text-align: center; padding: 10px 15px; font-size: 16px; font-weight: 600; pointer-events: none;}
body[class] .draw-canvas-footer{display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; border-top: 1px solid rgb(220, 226, 223); padding: 12px;}
body[class] .draw-inline{display: flex; flex-wrap: wrap; gap: 5px;}
body[class] .draw-canvas-footer button{font-size: 14px; padding: 9px 12px;}
body[class] .draw-canvas-footer > label{display: flex; gap: 8px; align-items: center; font-size: 14px;}
body[class] .draw-canvas-footer select{min-height: 44px; padding: 8px; border-radius: 8px; border: 1px solid rgb(211, 219, 213); background: white;}
body[class] .draw-metrics{display: grid; grid-template-columns: repeat(4, 1fr); padding: 20px 16px; gap: 12px; border-top: 1px solid rgb(226, 232, 228);}
body[class] .draw-metrics span{min-width: 0px;}
body[class] .draw-metrics small{display: block; font-size: 12px; color: rgb(90, 104, 97); line-height: 1.4;}
body[class] .draw-metrics b{display: block; font-size: 17px; white-space: nowrap;}
body[class] .draw-instructions{color: rgb(87, 103, 94); padding: 0px 16px 16px; font-size: 13px !important; line-height: 1.6 !important; margin: 0px !important;}
body[class] .draw-finish-row{display: flex; justify-content: space-between; gap: 10px; padding: 4px 16px 18px;}
body[class] .draw-finish-row button{font-size: 14px;}
body[class] .draw-inspector{background: white; min-width: 0px; max-height: 900px; overflow: auto; scrollbar-width: thin; overscroll-behavior: contain;}
body[class] .draw-panel-tabs{display: flex; position: sticky; top: 0px; z-index: 2; overflow-x: auto; background: white; border-bottom: 1px solid rgb(226, 231, 228); gap: 3px; padding: 10px;}
body[class] .draw-panel-tabs button{min-width: 60px; padding: 10px 9px; border: 0px; font-size: 14px; flex-shrink: 0;}
body[class] .draw-inspector > section{padding: 24px;}
body[class] .draw-kicker{letter-spacing: 0.08em; font-weight: 650; color: rgb(98, 115, 102); font-size: 12px !important; margin: 0px 0px 10px !important;}
body[class] .draw-inspector h2{font-size: 26px; line-height: 1.15; letter-spacing: -0.03em; margin: 0px 0px 15px;}
body[class] .draw-inspector p{font-size: 16px; line-height: 1.6; margin: 12px 0px 20px;}
body[class] .draw-inspector h3{font-size: 18px; line-height: 1.3; margin: 23px 0px 12px;}
body[class] .draw-inspector label{display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 600; margin-bottom: 15px;}
body[class] .draw-inspector input,body[class] .draw-inspector select{min-height: 46px; width: 100%; min-width: 0px; padding: 11px; border: 1px solid rgb(189, 201, 193); border-radius: 9px; background: white; font-size: 16px;}
body[class] .draw-inspector input[aria-invalid="true"]{border-color: rgb(186, 54, 54);}
body[class] .draw-inspector .draw-check{flex-direction: row; align-items: flex-start; font-size: 15px; font-weight: 400; gap: 10px; line-height: 1.5; margin-top: 22px;}
body[class] .draw-check input{flex-shrink: 0; width: 22px; height: 22px; min-height: 0px; accent-color: rgb(37, 47, 40);}
body[class] .draw-input-unit{position: relative;}
body[class] .draw-input-unit input{padding-right: 42px;}
body[class] .draw-input-unit > span{position: absolute; right: 12px; top: 12px; font-size: 14px; color: rgb(92, 106, 97);}
body[class] .draw-field-grid{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 0px 12px;}
body[class] .draw-swatches{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 9px; margin-bottom: 24px;}
body[class] .draw-swatches button{padding: 10px; font-size: 12px; text-align: left; border-radius: 12px; font-weight: 500; min-width: 0px;}
body[class] .draw-swatches i{display: block; height: 34px; border-radius: 7px; margin-bottom: 9px; border: 1px solid rgb(174, 183, 179);}
body[class] .draw-spectrum{background: linear-gradient(110deg, rgb(138, 101, 88), rgb(189, 197, 184), rgb(73, 91, 98));}
body[class] .draw-swatches button[aria-pressed="true"]{background: rgb(255, 244, 198); color: rgb(32, 39, 39); border: 2px solid rgb(32, 39, 39); padding: 9px;}
body[class] .draw-inspector .draw-primary{width: 100%;}
body[class] .draw-segment{border: 1px solid rgb(221, 227, 222); border-radius: 12px; margin-top: 12px; padding: 13px;}
body[class] .draw-segment.selected{border-color: rgb(180, 138, 22); box-shadow: rgb(255, 242, 191) 0px 0px 0px 2px;}
body[class] .draw-segment-head{display: flex; align-items: center; justify-content: space-between; gap: 5px; margin-bottom: 12px;}
body[class] .draw-segment-head button{padding: 6px 9px; min-height: 38px; font-size: 15px; font-weight: 650; background: rgb(244, 246, 243); border: 0px;}
body[class] .draw-segment-head span{font-size: 11px; color: rgb(104, 116, 107);}
body[class] .draw-segment label{font-size: 13px; margin-bottom: 6px;}
body[class] .draw-segment .draw-field-grid{gap: 10px;}
body[class] .draw-exact{border-top: 1px solid rgb(220, 227, 221); margin-top: 24px; padding-top: 4px;}
body[class] .draw-exact > button{width: 100%;}
body[class] .draw-inspector .draw-note{font-size: 13px; line-height: 1.55; color: rgb(103, 118, 106);}
body[class] .draw-templates{display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 20px 0px;}
body[class] .draw-templates button{padding: 12px;}
body[class] .draw-templates svg{width: 100%; height: 70px;}
body[class] .draw-templates span{display: block; font-weight: 600; font-size: 15px;}
body[class] .draw-status{padding: 10px 22px; color: rgb(55, 96, 73); background: rgb(242, 247, 242); min-height: 40px; font-size: 14px; border-top: 1px solid rgb(222, 229, 222);}
body[class] .draw-status.is-error{color: rgb(163, 39, 35); background: rgb(255, 243, 238);}
body[class] .draw-order{display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 24px; border-top: 1px solid rgb(224, 230, 223); background: rgb(255, 253, 245);}
body[class] .draw-order strong{font-size: 29px; line-height: 1.35; display: block;}
body[class] .draw-order small{font-size: 13px; color: rgb(89, 102, 93); display: block;}
body[class] .draw-order > button{min-width: 235px;}
body[class] .draw-summary{margin: 16px 0px;}
body[class] .draw-summary > div{display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid rgb(226, 231, 225); padding: 9px 0px; font-size: 14px;}
body[class] .draw-summary dd{font-weight: 650; text-align: right; margin: 0px;}
body[class] .draw-part-list{display: flex; flex-wrap: wrap; gap: 6px; font-size: 13px;}
body[class] .draw-part-list span{background: rgb(243, 246, 242); border-radius: 5px; padding: 6px;}
body[class] .draw-export{display: flex; flex-wrap: wrap; gap: 8px;}
body[class] .draw-export button{font-size: 14px; flex: 1 1 0%; min-width: 115px;}
body[class] .draw-inspector table{width: 100%; font-size: 14px; margin-top: 10px; border-collapse: collapse;}
body[class] .draw-inspector td,body[class] .draw-inspector th{padding: 8px; text-align: left; border-bottom: 1px solid rgb(220, 227, 222);}
body[class] .draw-inspector details{margin-top: 20px;}
body[class] .draw-orbit{padding: 12px 20px; background: rgb(242, 245, 240);}
body[class] .draw-orbit label{display: flex; align-items: center; gap: 12px; font-size: 14px;}
body[class] .draw-orbit input{flex: 1 1 0%; accent-color: rgb(57, 62, 58); min-height: 32px;}
body[class] .draw-orbit span{font-size: 12px; color: rgb(93, 108, 97);}
body[class] .draw-expanded{position: fixed; inset: 12px; z-index: 10000; margin: 0px; overflow: auto; box-shadow: rgba(32, 39, 39, 0.667) 0px 0px 0px 30px;}
body[class] .draw-expanded .draw-viewport{height: 60vh;}
@media (min-width: 1450px){
body[class] .draw-workspace{grid-template-columns: minmax(0px, 1fr) 420px;}
}
@media (max-width: 1050px){
body[class] .draw-workspace{grid-template-columns: minmax(0px, 1fr) 330px;}
body[class] .draw-tools{justify-content: center;}
body[class] .draw-field-grid{grid-template-columns: 1fr;}
body[class] .draw-inspector > section{padding: 19px;}
body[class] .draw-metrics{grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 780px){
body[class] .alu-draw{border-radius: 16px; margin: 18px 0px;}
body[class] .draw-topline{padding: 14px;}
body[class] .draw-topline strong{font-size: 18px;}
body[class] .draw-version{display: none;}
body[class] .draw-topline button{font-size: 12px; max-width: 140px;}
body[class] .draw-workflow{gap: 0px; padding: 8px;}
body[class] .draw-workflow button{font-size: 12px; padding: 8px 5px; text-align: center;}
body[class] .draw-workflow span{display: block; margin: 0px auto 6px;}
body[class] .draw-workspace{grid-template-columns: 1fr;}
body[class] .draw-stage{border-right: 0px;}
body[class] .draw-viewport{height: min(52dvh, 460px); min-height: 310px;}
body[class] .draw-inspector{max-height: none; overflow: visible; border-top: 1px solid rgb(218, 227, 218);}
body[class] .draw-panel-tabs{position: static; padding: 9px;}
body[class] .draw-panel-tabs button{flex: 1 1 0%;}
body[class] .draw-inspector > section{padding: 23px;}
body[class] .draw-field-grid{grid-template-columns: repeat(2, minmax(0px, 1fr));}
body[class] .draw-swatches{grid-template-columns: repeat(3, minmax(0px, 1fr));}
body[class] .draw-inspector h2{font-size: 28px;}
body[class] .draw-tools{justify-content: space-between; padding: 9px;}
body[class] .draw-tools button{font-size: 13px; padding: 8px;}
body[class] .draw-metrics{grid-template-columns: repeat(4, 1fr); gap: 8px;}
body[class] .draw-metrics b{font-size: 15px;}
body[class] .draw-metrics small{font-size: 11px;}
body[class] .draw-order{padding: 16px; flex-wrap: wrap;}
body[class] .draw-order > button{flex: 1 1 0%; min-width: 180px;}
body[class] .draw-order strong{font-size: 26px;}
body[class] .draw-finish-row{flex-wrap: wrap;}
body[class] .draw-finish-row .draw-primary{flex: 1 1 0%;}
body[class] .draw-start-help h2{font-size: 29px;}
body[class] .draw-start-help p{font-size: 14px;}
body[class] .draw-live-measure{font-size: 14px;}
body[class] .draw-expanded{inset: 4px;}
body[class] .draw-expanded .draw-viewport{height: 52dvh;}
}
@media (max-width: 420px){
body[class] .draw-tools{justify-content: center;}
body[class] .draw-metrics{grid-template-columns: repeat(2, 1fr);}
body[class] .draw-field-grid{grid-template-columns: 1fr;}
body[class] .draw-swatches{grid-template-columns: repeat(2, 1fr);}
body[class] .draw-topline{align-items: flex-start;}
body[class] .draw-topline strong{font-size: 16px;}
body[class] .draw-topline > div:first-child{max-width: 180px;}
body[class] .draw-topline button{max-width: 110px; min-height: 44px;}
body[class] .draw-finish-row > button{width: 100%; flex: 1 1 auto;}
body[class] .draw-canvas-footer .draw-inline{display: grid; grid-template-columns: repeat(2, 1fr); width: 100%;}
body[class] .draw-canvas-footer > label{width: 100%; justify-content: space-between;}
body[class] .draw-order > button{width: 100%;}
body[class] .draw-viewport{min-height: 320px;}
}
@media (prefers-reduced-motion: reduce){
body[class] .alu-draw *{transition: none !important; scroll-behavior: auto !important;}
}
body[class] .lab-product-photo{margin: 0px; background: rgb(242, 245, 241);}
body[class] .lab-product-photo img{width: 100%; height: 440px; object-fit: cover; display: block;}
body[class] .lab-product-photo figcaption{padding: 15px 20px; font-size: 14px; line-height: 1.5;}
body[class] .product-planner .lab-stage-top{flex-wrap: wrap;}
body[class] .product-planner .lab-stage-top > div{flex-wrap: wrap;}
body[class] .product-planner .lab-layout{grid-template-columns: minmax(0px, 1.1fr) minmax(350px, 0.9fr);}
@media (max-width: 800px){
body[class] .product-planner .lab-layout{grid-template-columns: 1fr;}
body[class] .lab-product-photo img{height: 310px;}
body[class] .product-planner .lab-stage-top button{font-size: 14px;}
}
body[class] .draw-radius-row{display: grid; grid-template-columns: minmax(0px, 1fr) 110px; align-items: end; gap: 12px; margin: 16px 0px;}
body[class] .draw-radius-row small{display: block; font-size: 14px; line-height: 1.45; font-weight: 400; margin-top: 7px;}
body[class] .draw-radius-row button{min-height: 52px;}
body[class] .draw-svg-label.radius rect{fill: rgb(255, 243, 187); stroke: rgb(184, 135, 22);}
body[class] .draw-svg-label.radius text{font-weight: 750;}
body[class] .draw-node{pointer-events: none;}
body[class] .draw-mobile-jump{display: none;}
body[class] .mfg-editor label.draw-check{flex-direction: row; align-items: center; gap: 12px;}
body[class] .mfg-editor button.draw-primary{background: rgb(255, 206, 35); border-color: rgb(255, 206, 35);}
body[class] .draw-svg-label:focus{outline: none;}
body[class] .draw-svg-label:focus rect{stroke: rgb(153, 114, 13); stroke-width: 3;}
@media (max-width: 780px){
body[class] .draw-mobile-jump{display: block; width: 100%; padding: 14px; min-height: 48px; margin: 10px 0px; border: 1px solid rgb(187, 194, 189); border-radius: 8px; background: rgb(255, 255, 255); font-size: 16px; font-weight: 650;}
body[class] .alu-draw .draw-workflow button,body[class] .alu-draw .draw-panel-tabs button,body[class] .alu-draw .draw-tools button,body[class] .alu-draw .draw-canvas-footer button,body[class] .alu-draw .draw-topline button{font-size: 14px; min-height: 44px;}
body[class] .alu-draw .draw-metrics small,body[class] .alu-draw .draw-note,body[class] .alu-draw .draw-instructions{font-size: 14px; line-height: 1.55;}
body[class] .alu-draw .draw-workflow{flex-wrap: wrap; display: flex;}
body[class] .alu-draw .draw-workflow button{flex: 1 1 120px;}
body[class] .alu-draw .draw-panel-tabs{flex-wrap: wrap; display: flex;}
body[class] .alu-draw .draw-panel-tabs button{flex: 1 1 90px;}
body[class] .alu-draw .draw-inspector{min-width: 0px;}
body[class] .draw-radius-row{grid-template-columns: minmax(0px, 1fr) 104px;}
body[class] .draw-radius-row button{font-size: 14px;}
}
@media (max-width: 370px){
body[class] .draw-radius-row{grid-template-columns: 1fr;}
body[class] .draw-radius-row button br{display: none;}
}
body[class] .alu-draw .draw-svg-label text{font-size: 16px;}
body[class] .alu-draw{max-width: 100%; min-width: 0px; scroll-margin-top: 20px;}
body[class] .alu-draw .draw-workspace{grid-template-columns: minmax(0px, 1fr) minmax(300px, 370px);}
body[class] .alu-draw .draw-stage,body[class] .alu-draw .draw-inspector{min-width: 0px;}
body[class] .alu-draw .draw-inspector{max-height: 900px;}
body[class] .alu-draw .draw-viewport{width: 100%; height: 560px; overflow: hidden; min-width: 0px;}
body[class] .draw-label-index{padding: 12px 16px; background: rgb(255, 255, 255); border-top: 1px solid rgb(220, 225, 221);}
body[class] .draw-label-index[hidden]{display: none;}
body[class] .draw-label-index p{font-size: 14px; line-height: 1.45; margin: 0px 0px 9px;}
body[class] .draw-label-index > div{display: flex; flex-wrap: wrap; gap: 8px;}
body[class] .draw-label-index button{min-height: 44px; padding: 9px 13px; border: 1px solid rgb(191, 197, 192); border-radius: 7px; background: rgb(250, 251, 249); font-style: inherit; font-variant: inherit; font-weight: inherit; font-stretch: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-language-override: inherit; font-size: 15px; line-height: 1.3; cursor: pointer;}
body[class] .draw-auto-fit{display: flex; align-items: center; gap: 10px; min-height: 44px; font-size: 14px; padding: 5px 12px;}
body[class] .draw-auto-fit input{width: 20px; height: 20px; accent-color: rgb(225, 173, 0);}
body[class] .alu-draw .draw-tools{flex-wrap: wrap; gap: 10px;}
body[class] .alu-draw .draw-tools > div{display: flex; flex-wrap: wrap; gap: 6px;}
body[class] .alu-draw .draw-svg-label text{font-family: Inter, sans-serif; letter-spacing: 0px;}
body[class] .alu-draw .draw-panel-tabs button{font-size: 15px; line-height: 1.35; min-height: 44px; white-space: normal;}
body[class] .alu-draw .draw-radius-row{grid-template-columns: minmax(0px, 1fr) 104px;}
body[class] .alu-draw .draw-expanded{z-index: 200;}
@media (max-width: 1150px){
body[class] .alu-draw .draw-workspace{grid-template-columns: minmax(0px, 1fr) 320px;}
}
@media (max-width: 1000px){
body[class] .alu-draw .draw-workspace{grid-template-columns: 1fr;}
body[class] .alu-draw .draw-inspector{max-height: none; overflow: visible; border-top: 1px solid rgb(220, 225, 221);}
body[class] .alu-draw .draw-mobile-jump{display: block; min-height: 48px; width: 100%; font-size: 16px;}
}
@media (max-width: 640px){
body[class] .alu-draw .draw-viewport{height: 440px; max-height: 62dvh; min-height: 340px;}
body[class] .alu-draw .draw-tools button{min-width: 44px; min-height: 44px; font-size: 14px;}
body[class] .draw-auto-fit{font-size: 15px; width: 100%;}
body[class] .alu-draw .draw-inspector > section{padding: 22px 16px;}
body[class] .alu-draw .draw-topline{gap: 12px; flex-wrap: wrap;}
}
body[class] .alu-draw .draw-workspace{grid-template-columns: minmax(0px, 1fr) 390px;}
body[class] .alu-draw .draw-inspector{max-height: 830px;}
body[class] .alu-draw .draw-viewport{height: 590px;}
body[class] .alu-draw .draw-viewport[data-scroll-mode="page"]{touch-action: pan-y;}
body[class] .draw-orbit-controls{display: flex; flex-wrap: wrap; gap: 10px; align-items: center;}
body[class] .draw-orbit-controls button{min-height: 42px; padding: 8px 12px;}
body[class] .draw-orbit-controls label{flex: 1 1 220px;}
body[class] .draw-orbit-controls input{width: 100%;}
body[class] .draw-wheel-hint{font-size: 13px; color: rgb(99, 112, 101); margin: 0px; padding: 7px 14px;}
body[class] .draw-start-options{display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; max-width: 580px; margin: 22px auto 0px;}
body[class] .draw-start-options button{min-height: 44px; padding: 10px 17px; border-radius: 10px; background: rgb(255, 255, 255); border: 1px solid rgb(197, 207, 198); font-size: 16px; color: rgb(32, 41, 35);}
body[class] .draw-start-options button:first-child{background: rgb(255, 202, 34); border-color: rgb(255, 202, 34);}
body[class] .draw-material-summary{display: flex; gap: 12px; align-items: center; flex-wrap: wrap; padding: 12px 18px; background: rgb(255, 249, 223); font-size: 15px;}
body[class] .draw-material-summary button{margin-left: auto; font-size: 14px; min-height: 40px; background: rgb(255, 255, 255); border: 1px solid rgb(217, 204, 143); border-radius: 7px; padding: 6px 12px;}
body[class] .draw-wall-summary{display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 14px 18px; background: rgb(255, 255, 255); border-bottom: 1px solid rgb(221, 221, 221);}
body[class] .draw-wall-summary b{display: block; font-size: 19px;}
body[class] .draw-wall-summary small{font-size: 13px; color: rgb(96, 105, 96);}
body[class] .draw-request-button{font-size: 15px; min-height: 46px; padding: 11px 15px; border: 1px solid rgb(203, 208, 199); border-radius: 8px; background: rgb(255, 255, 255);}
body[class] .lab-view-controls{display: flex; gap: 8px; flex-wrap: wrap; align-items: center; padding: 12px; background: rgb(255, 255, 255); border-top: 1px solid rgb(226, 230, 223);}
body[class] .lab-view-controls button{min-height: 42px; padding: 8px 13px; border: 1px solid rgb(203, 210, 200); border-radius: 7px; background: rgb(255, 255, 255);}
body[class] .lab-view-controls label{font-size: 14px; flex: 1 1 180px;}
body[class] .lab-view-controls input{width: 100%;}
body[class] .lab-label-button{cursor: pointer;}
body[class] .lab-label-button rect{fill: white; stroke: rgb(186, 197, 187);}
body[class] .lab-label-button text{fill: rgb(34, 43, 36);}
body[class] .lab-radius-fields{padding: 18px; background: rgb(255, 247, 214); border-radius: 10px; margin-top: 16px;}
body[class] .lab-radius-fields h3{margin: 0px 0px 14px; font-size: 20px;}
@media (max-width: 1200px){
body[class] .alu-draw .draw-workspace{grid-template-columns: minmax(0px, 1fr) 340px;}
}
@media (max-width: 1000px){
body[class] .alu-draw .draw-workspace{grid-template-columns: 1fr;}
body[class] .alu-draw .draw-inspector{max-height: none;}
}
@media (max-width: 640px){
body[class] .alu-draw .draw-viewport{height: 450px; min-height: 340px;}
body[class] .draw-wall-summary{grid-template-columns: 1fr 1fr;}
body[class] .draw-material-summary{font-size: 14px;}
body[class] .draw-material-summary button{margin-left: 0px;}
}
body[class] .alu-draw .draw-start-options{pointer-events: auto;}
body[class] .alu-draw .draw-start-help{max-width: 95%; width: 620px;}
body[class] .alu-draw .draw-start-help p{font-size: 16px; line-height: 1.6;}
body[class] .alu-draw .draw-start-help .draw-cross{display: none;}
body[class] .alu-draw .draw-start-help h2{font-size: 36px;}
body[class] .alu-draw .draw-wall-summary{display: block; border: 1px solid rgb(229, 222, 191); border-radius: 10px; background: rgb(255, 248, 219);}
body[class] .draw-wall-summary h3{font-size: 20px; line-height: 1.35; margin: 0px 0px 14px;}
body[class] .draw-wall-summary p{font-size: 14px; margin-top: 12px;}
body[class] .alu-draw .draw-orbit{display: block; padding: 15px 18px;}
body[class] .alu-draw .draw-orbit[hidden]{display: none;}
body[class] .draw-orbit > label{display: block; font-size: 15px; margin-top: 12px;}
body[class] .draw-orbit input[type="range"]{width: 100%;}
body[class] .draw-orbit > span{display: block; margin-top: 8px;}
body[class] .lab-orbit-controls{padding: 12px 18px; background: rgb(255, 250, 240);}
body[class] .lab-orbit-controls > label{display: block; font-size: 15px; margin: 10px 0px;}
body[class] .lab-orbit-controls input{width: 100%;}
body[class] .lab-hidden-labels{display: flex; gap: 8px; flex-wrap: wrap; padding: 12px;}
body[class] .lab-hidden-labels button{background: rgb(255, 248, 220); border: 1px solid rgb(213, 207, 174); padding: 10px; border-radius: 8px; min-height: 44px;}
body[class] .lab-radius-fields small{font-size: 13px; line-height: 1.5; font-weight: 400;}
body[class] .lab-stage svg{touch-action: pan-y;}
body[class] .lab-stage:has([data-lab-projection="3d"][aria-pressed="true"]) svg{touch-action: none;}
body[class] .alu-draw .draw-order,body[class] .lab-price-bar{flex-wrap: wrap; gap: 12px;}
body[class] .draw-request-button{font-weight: 500; white-space: normal;}
@media (max-width: 640px){
body[class] .alu-draw .draw-start-help h2{font-size: 28px;}
body[class] .alu-draw .draw-start-help p{font-size: 15px;}
body[class] .alu-draw .draw-order > button,body[class] .lab-price-bar > button{width: 100%;}
body[class] .alu-draw .draw-start-options{gap: 7px;}
body[class] .alu-draw .draw-start-options button{font-size: 14px; padding: 9px 12px;}
}
body[class] .alu-draw [hidden]{display: none !important;}
body[class] .alu-draw .draw-start-help{margin-inline: auto;}
@media (max-width: 780px){
body[class] .alu-wp-runtime .lab-stage{position: static;}
}