.step-flow{--flow-nav:72px;--flow-steps:76px;background:#f6f3ee}.step-flow main{max-width:1640px;width:auto;margin:0 auto;padding:0 28px 40px}.step-flow.workspace-wide main{max-width:none}.step-flow>header{max-width:none;padding:18px 28px;min-height:70px;gap:18px;display:flex;align-items:center}.step-flow header .header-shop{display:none}.step-flow .flow-workspace{margin-left:auto;white-space:nowrap;background:white;color:#594531;border:1px solid #d5c4af;padding:10px 16px;border-radius:5px}.step-flow .hero{display:none}.step-flow .journey-nav{top:0;margin:0 0 16px;padding:10px 0;gap:12px;min-height:var(--flow-nav);box-sizing:border-box;z-index:60}.step-flow .journey-nav a,.step-flow .journey-nav a[aria-current=true]{padding:12px 18px}.step-flow .journey-nav strong{font-size:16px;margin:0}.step-flow .journey-nav small{display:none}.step-flow .flow-progress{position:sticky;top:var(--flow-nav);z-index:55;display:flex;gap:6px;background:#f6f3ee;padding:10px 0 20px;margin:0;flex-wrap:nowrap;min-height:var(--flow-steps);box-sizing:border-box}.flow-progress button{padding:10px;min-width:0;border-radius:5px;font-size:13px;flex:1}.flow-progress button[aria-current=step]{background:#a66c34;color:#fff;border-color:#a66c34}.flow-progress button.flow-past{border-color:#a66c34}.flow-progress-track{position:absolute;bottom:0;left:0;right:0;height:3px;background:#e1d7cb}.flow-progress-track span{display:block;height:100%;background:#a66c34;transition:width .25s}.flow-progress-status{position:absolute;right:0;bottom:1px;font-size:10px;background:#f6f3ee;padding-left:12px;margin:0}.step-flow .flow-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(340px,1fr);gap:30px;align-items:start;margin-top:20px}.flow-story{min-width:0}.step-flow .flow-story>.inputs{display:block;background:transparent;border:0;padding:0;box-shadow:none;overflow:visible}.flow-stage{padding:26px 0 38px;min-height:65vh;border-bottom:1px solid #dcccba;scroll-margin-top:calc(var(--flow-nav) + var(--flow-steps) + 18px)}.flow-stage-head{display:flex;align-items:flex-start;gap:14px;margin:0 0 22px}.flow-number{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border:1px solid #ac7b4b;border-radius:50%;color:#95612d;background:#f3eadd;font-size:17px}.flow-stage-head h2{font-size:25px;line-height:1.2;margin:0 0 8px;font-weight:500}.flow-stage-head p{font-size:14px;line-height:1.6;color:#655b50;margin:0}.step-flow .flow-stage .tag,.step-flow .flow-stage .brand-intro>h2,.step-flow .flow-stage .project-picker>.tag{display:none}.step-flow .flow-stage .brand-intro{padding:0!important;background:transparent;border:0;margin:0}.step-flow .collection-terms{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.step-flow .collection-terms article{padding:14px}.step-flow .brand-intro .collection-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.step-flow .brand-intro .clear-colors{grid-template-columns:repeat(3,minmax(0,1fr))}.step-flow .clear-color img{height:95px}.step-flow .project-cards{grid-template-columns:1fr;gap:12px}.step-flow .project-cards button{min-height:90px;padding:18px}.step-flow .project-cards strong{font-size:19px}.flow-actions{display:flex;gap:12px;justify-content:space-between;margin-top:26px;align-items:center}.flow-actions button{min-height:48px;border-radius:5px;padding:12px 20px;font-size:14px;white-space:normal}.flow-next{margin-left:auto;background:#995f2b;color:white}.flow-back{background:transparent;color:#725637;border:1px solid #d3bda5}.step-flow .preview-column{position:sticky;top:calc(var(--flow-nav) + var(--flow-steps) + 20px);align-self:start}.step-flow .card.view:not(.plan-expanded){height:auto;min-height:0;overflow:hidden}.step-flow .view:not(.plan-expanded) #scene3d,.step-flow .view:not(.plan-expanded) #scene{width:100%;height:clamp(300px,51vh,660px)!important}.step-flow .view .toolbar{padding:12px;gap:8px;flex-wrap:wrap}.step-flow .view .toolbar button{min-height:38px}.step-flow .view .material-caption{padding:14px 18px}.step-flow .view .material-caption span{font-size:17px}.step-flow .view .small{font-size:11px}.step-flow #quote-step{padding:20px}.step-flow #quote-step h2{font-size:22px}.step-flow .business-table-wrap{overflow:auto}.step-flow .business-quote th,.step-flow .business-quote td{font-size:12px;padding:10px 8px}.step-flow .flow-extra{padding:18px;background:white;border:1px solid #e1d4c5;margin:18px 0;border-radius:6px}.flow-extra>summary{cursor:pointer;font-size:15px;font-weight:500}.step-flow .flow-extra .card,.step-flow .flow-extra .cad-box{padding:14px 0;border:0}.step-flow .flow-stage>details{margin:14px 0}.step-flow .flow-stage>details>summary{font-size:16px}.step-flow .delivery-disclosure{margin:16px 0;background:#f5f0e9;padding:14px;border-radius:5px}.step-flow .import-hub{margin:20px 0}.step-flow #commerce{margin:22px 0}.step-flow .flow-stage .design-choice{display:grid;gap:12px;padding:18px;margin:20px 0}.step-flow .flow-stage .design-choice button{justify-self:start}.step-flow .flow-stage .design-choice a{font-size:14px}.step-flow #raw,.step-flow #companions{max-width:1440px;margin:auto}.step-flow .flow-stage-head h2:focus-visible{outline:2px solid #a66c34;outline-offset:5px}
@media(min-width:1600px){.step-flow .flow-layout{grid-template-columns:minmax(620px,1fr) minmax(500px,1.15fr);gap:48px}.step-flow .brand-intro .clear-colors{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1000px){.step-flow{--flow-nav:64px;--flow-steps:72px}.step-flow main{padding:0 16px 30px}.step-flow .flow-layout{grid-template-columns:minmax(0,1fr);gap:0}.step-flow .preview-column{position:relative;top:auto;grid-row:1;margin:0 0 14px}.step-flow .view:not(.plan-expanded) #scene3d,.step-flow .view:not(.plan-expanded) #scene{height:300px!important}.step-flow .flow-stage{min-height:55vh}.step-flow .flow-progress button{font-size:11px;padding:9px 3px}.step-flow .journey-nav strong{font-size:12px}.step-flow .journey-nav a,.step-flow .journey-nav a[aria-current=true]{padding:12px 8px}.step-flow>header{padding:10px 16px}.step-flow>header>span{display:none}.step-flow .flow-stage-head h2{font-size:23px}}
@media(max-width:550px){.step-flow .collection-terms{display:none}.step-flow .brand-intro .collection-tabs{grid-template-columns:1fr 1fr}.step-flow .collection-tabs button{padding:12px;min-height:78px}.step-flow .collection-tabs strong{font-size:13px}.step-flow .brand-intro .clear-colors{grid-template-columns:repeat(2,minmax(0,1fr))}.step-flow .flow-actions{gap:8px}.step-flow .flow-actions button{font-size:12px;padding:12px}.step-flow #quote-step{padding:12px}.step-flow .flow-workspace{padding:8px;font-size:11px}.step-flow .flow-progress-status{font-size:9px}.step-flow .flow-number{width:34px;height:34px;flex-basis:34px}}
@media(prefers-reduced-motion:reduce){.flow-progress-track span{transition:none}}
@media print{.step-flow .flow-progress,.step-flow .flow-actions,.flow-workspace{display:none!important}.step-flow .flow-layout{display:block}.step-flow .preview-column{position:static}.flow-stage{min-height:0}}
.step-flow .journey-nav{position:sticky!important;grid-template-columns:repeat(3,minmax(0,1fr)) auto;min-height:64px}.step-flow .journey-nav .flow-workspace{font-size:12px;margin:0;padding:10px}.step-flow .collection-help{border:0;background:#f0e8dd;padding:14px;margin-bottom:18px}.collection-help>summary{cursor:pointer;font-size:13px}.flow-mobile-preview{display:none}.step-flow .flow-stage>details>summary span{display:none}.step-flow .brand-intro>button:not([id]){display:none}
@media(max-width:1000px){.step-flow .flow-mobile-preview{display:block;position:fixed;bottom:16px;right:16px;z-index:70;background:#8d582a;color:white;border:2px solid #fff;border-radius:26px;padding:12px 20px;box-shadow:0 4px 16px #0003;font-size:13px}.step-flow:has(.plan-expanded) .flow-mobile-preview{display:none}.step-flow .journey-nav{gap:5px}.step-flow .journey-nav .flow-workspace{font-size:10px;padding:6px}.step-flow .flow-stage{padding-bottom:55px}}
@media(max-width:550px){.step-flow .journey-nav{grid-template-columns:repeat(3,minmax(0,1fr))}.step-flow .journey-nav .flow-workspace{grid-column:1/-1;justify-self:end;margin:0}.step-flow .collection-help .collection-terms{display:grid;grid-template-columns:1fr}.step-flow .collection-tabs small{font-size:10px}}
@media print{.flow-mobile-preview{display:none!important}}
.step-flow>header{padding:10px 28px;min-height:60px;box-sizing:border-box}.step-flow>header img{height:44px;width:auto}.step-flow .view:not(.plan-expanded) #scene3d,.step-flow .view:not(.plan-expanded) #scene{height:clamp(220px,calc(100dvh - var(--flow-nav) - var(--flow-steps) - 300px),540px)!important}.step-flow .view button{font-size:11px;padding:9px 11px}.step-flow .view .material-caption{padding:10px 16px}.step-flow .view .material-caption span{font-size:16px}
.step-flow.workspace-embedded:not(.workspace-wide) .flow-stage{min-height:0}.step-flow.workspace-embedded:not(.workspace-wide) .view:not(.plan-expanded) #scene3d,.step-flow.workspace-embedded:not(.workspace-wide) .view:not(.plan-expanded) #scene{height:320px!important}
.step-flow .flow-story>.inputs{position:static;top:auto;height:auto;max-height:none;min-width:0}

/* V3.0.3: fluid workspace, compact navigation and readable touch controls. */
.step-flow {--flow-steps:76px}
.step-flow main {width:100%;max-width:1640px}
.step-flow>header {height:auto}
.step-flow :where(section,article,details,.row,.row>*,.brand-columns>*,.flow-stage-head>div,.flow-extra,.preview-column) {min-width:0}
.step-flow :where(input,select,textarea,button) {max-width:100%;box-sizing:border-box}
.step-flow :where(input,select,textarea,button,summary) {scroll-margin-top:calc(var(--flow-nav) + var(--flow-steps) + 20px);scroll-margin-bottom:80px}
.step-flow :where(p,h2,h3,h4,label,.producer-code,.quote-project-code) {overflow-wrap:anywhere}
.step-flow :where(button,summary) {white-space:normal;line-height:1.45}
.step-flow .row {grid-template-columns:repeat(2,minmax(0,1fr))}
.step-flow .flow-route-toggle {display:none}
.step-flow .flow-progress {min-height:76px}
.step-flow .flow-stage {min-height:0;padding-bottom:42px}
.step-flow .flow-stage-head {align-items:flex-start}
.step-flow .project-cards button {display:flex;align-items:center;text-align:left;gap:16px;min-height:88px}
.step-flow .project-cards svg {flex:0 0 55px}
.step-flow .flow-actions {align-items:stretch;flex-wrap:wrap}
.step-flow .flow-actions button {flex:1 1 180px}
.step-flow .flow-next:only-child {flex-grow:0;margin-left:auto}
.step-flow .view .material-caption {position:static}
.step-flow .journey-panel {scroll-margin-top:calc(var(--flow-nav) + 16px)}
.step-flow .view:not(.plan-expanded) #scene3d,.step-flow .view:not(.plan-expanded) #scene {height:clamp(210px,calc(100dvh - var(--flow-nav) - var(--flow-steps) - 270px),560px)!important}
.step-flow .flow-stage>details>summary {padding:16px;min-height:48px}
.step-flow .flow-stage>details>.detail-body {padding:0 16px 20px}
.step-flow .flow-stage .brand-intro #materials>.detail-body {padding:16px 0}
.step-flow .business-grand {line-height:1.6}
.step-flow .shop-products {grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}

@media screen and (max-width:1000px) {
 .step-flow main {padding:0 16px 90px}
 .step-flow>header {height:58px;min-height:58px;padding:7px 16px}
 .step-flow>header img {height:40px}
 .step-flow .journey-nav {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:8px 0;margin-bottom:8px;min-height:60px}
 .step-flow .flow-route-toggle {display:block;text-align:left;min-height:44px;padding:10px 12px;background:#fff;color:#654521;border:1px solid #bba183;border-radius:5px;font-size:14px}
 .step-flow .journey-nav .flow-workspace {grid-column:2;grid-row:1;min-height:44px;padding:8px;font-size:11px;max-width:110px}
 .step-flow .journey-nav>a {display:none}
 .step-flow .journey-nav.flow-routes-open>a {display:block;grid-column:1/-1;text-align:left;padding:14px;min-height:48px}
 .step-flow .journey-nav strong {font-size:14px}
 .step-flow .flow-progress {padding:6px 0 21px;gap:4px;min-height:72px}
 .step-flow .flow-progress button {padding:9px 2px;min-height:44px;font-size:12px;flex:1 1 0;line-height:1.3}
 .step-flow .flow-progress-status {bottom:4px;font-size:10px}
 .step-flow .flow-layout {display:block;margin-top:8px}
 .step-flow .preview-column {position:static;display:contents}
 .step-flow .view:not(.plan-expanded) {display:none}
 .step-flow .flow-stage {padding:22px 0 32px;min-height:0}
 .step-flow .flow-stage-head {gap:10px;margin-bottom:18px}
 .step-flow .flow-stage-head h2 {font-size:23px}
 .step-flow .flow-stage-head p {font-size:14px;line-height:1.5}
 .step-flow .flow-mobile-preview {display:block;bottom:max(12px,env(safe-area-inset-bottom));right:max(16px,env(safe-area-inset-right));min-height:48px;padding:12px 20px}
 .step-flow .flow-mobile-preview:focus-visible {outline:3px solid #47301b;outline-offset:3px}
 .step-flow:has(.plan-expanded) .flow-mobile-preview {display:none}
 .step-flow .plan-expanded {inset:0!important;height:100vh;height:100dvh;max-width:100%;width:100%;border-radius:0;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);z-index:10000;display:flex;flex-direction:column}
 .step-flow .plan-expanded .toolbar:first-child {position:sticky;top:0;background:#f6f2eb;z-index:2;gap:6px;padding:8px}
 .step-flow .plan-expanded .toolbar:first-child .tag {width:100%;font-size:10px}
 .step-flow .plan-expanded .toolbar button {margin:0;min-height:44px;font-size:13px}
 .step-flow .plan-expanded #expand-plan {flex:1;color:#fff;background:#8d582a}
 .step-flow .plan-expanded .camera-controls {padding:6px 8px;gap:4px}
 .step-flow .plan-expanded .camera-controls button {padding:8px;min-height:40px;font-size:12px;flex:1 1 auto}
 .step-flow .plan-expanded #scene3d,.step-flow .plan-expanded #scene {width:100%;min-height:180px;flex:1 1 240px;height:240px!important}
 .step-flow .plan-expanded .material-caption {padding:7px 12px}
 .step-flow .plan-expanded #scene3d-status {margin:0 12px}
 .step-flow .plan-expanded #scene3d-status+p {font-size:11px;line-height:1.4;margin:6px 12px}
 .step-flow .plan-expanded #dimensions {padding:10px 12px}
 .step-flow :where(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea) {font-size:16px;min-height:44px}
 .step-flow :where(input[type=checkbox],input[type=radio]) {width:20px!important;height:20px!important;flex-shrink:0}
 .step-flow label {font-size:13px;line-height:1.5}
 .step-flow :where(button,summary) {min-height:44px}
 .step-flow .small {font-size:12px}
 .step-flow .shop-products {max-height:none;overflow:visible}
 .step-flow .flow-stage .project-cards small {font-size:12px}
 .step-flow .flow-stage .design-choice {padding:16px}
 .step-flow .flow-stage .design-choice button {justify-self:stretch}
 .step-flow footer {font-size:11px}
}

@media screen and (max-width:600px) {
 .step-flow main {padding-left:12px;padding-right:12px}
 .step-flow .row {grid-template-columns:minmax(0,1fr)}
 .step-flow .flow-stage-head h2 {font-size:21px}
 .step-flow .flow-number {width:34px;height:34px;flex-basis:34px;font-size:14px}
 .step-flow .project-cards button {padding:14px;min-height:84px}
 .step-flow .project-cards strong {font-size:18px}
 .step-flow .collection-help {padding:10px}
 .step-flow .collection-help>summary {padding:8px;font-size:13px}
 .step-flow .collection-tabs button {padding:10px;min-height:84px;margin:0}
 .step-flow .collection-tabs strong {font-size:13px}
 .step-flow .collection-tabs small {font-size:11px}
 .step-flow .brand-intro button {margin-right:0}
 .step-flow .clear-color {margin:0;padding:8px}
 .step-flow .clear-color span {font-size:13px}
 .step-flow .clear-color small {font-size:11px}
 .step-flow .clear-color img {height:96px}
 .step-flow #quote-step,.step-flow .flow-extra,.step-flow .document-tools {padding:14px}
 .step-flow .flow-extra .document-tools {padding:0}
 .step-flow .quote-title {display:block}
 .step-flow .quote-title h2 {font-size:21px}
 .step-flow .quote-identity {padding:12px}
 .step-flow .quality-maker {padding:12px}
 .step-flow .actions {display:grid;grid-template-columns:minmax(0,1fr)}
 .step-flow .actions>button {width:100%;max-width:none}
 .step-flow .journey-save button {width:100%;margin:0}
 .step-flow .shop-line strong,.step-flow .cart-line p {min-width:0;flex-basis:100%}
 .step-flow .companion-tabs {gap:8px}
 .step-flow .companion-tabs a {flex:1;padding:12px 8px;text-align:center;min-width:0}
 .step-flow .brand-columns {grid-template-columns:minmax(0,1fr)}
 .step-flow .projection-ai h3 {font-size:24px}
 .step-flow .ai-consent {padding:10px}
 .step-flow .business-quote table,.step-flow .business-quote tbody {display:block}
 .step-flow .business-quote thead {position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}
 .step-flow .business-quote tbody tr {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-bottom:1px solid #d8cbbb;padding:12px 0;gap:8px}
 .step-flow .business-quote td {display:block;width:auto!important;border:0;padding:0;text-align:left;font-size:13px;overflow-wrap:anywhere}
 .step-flow .business-quote td:first-child {grid-column:1/-1;font-size:14px;line-height:1.5;padding-bottom:6px}
 .step-flow .business-quote td:not(:first-child)::before {content:attr(data-label);display:block;font-size:10px;color:#75634f;margin-bottom:5px}
 .step-flow .business-quote td:last-child {font-weight:700}
 .step-flow .business-subtotal {font-size:13px;line-height:1.5}
 .step-flow .business-grand {font-size:16px!important;padding:14px}
 .step-flow dialog {max-width:calc(100vw - 16px);padding:14px;max-height:calc(100dvh - 24px);overflow:auto}
}
@media screen and (min-width:1001px) and (max-width:1250px) {
 .step-flow main {padding-left:20px;padding-right:20px}
 .step-flow .journey-nav {gap:8px}
 .step-flow .journey-nav a,.step-flow .journey-nav a[aria-current=true] {padding:10px}
 .step-flow .journey-nav strong {font-size:14px}
 .step-flow .flow-layout {grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:22px}
}
@media print {
 .step-flow .flow-route-toggle {display:none!important}
 .step-flow .flow-stage {padding:12px 0}
}

/* One visible preview on every screen; hidden canvases must never reserve space. */
.view #scene[hidden],.view #scene3d[hidden],.view .camera-controls[hidden],
.view .toolbar[hidden],.plan-measures[hidden],.plan-measure[hidden],
.plan-measure-editor[hidden],.scene-retry[hidden] {display:none!important}
.plan-measures {position:absolute;inset:0;pointer-events:none;z-index:3;overflow:hidden}
.plan-measures svg {position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.plan-measures line {stroke:#895525;stroke-width:1.5;stroke-dasharray:4 3}
.view .plan-measure {position:absolute;transform:translate(-50%,-50%);pointer-events:auto;background:#fffefb;color:#53361d;border:1px solid #a66b32;border-radius:6px;padding:6px 8px;font:12px/1.3 Acrom,Arial,sans-serif;min-height:36px;width:max-content;max-width:150px;box-shadow:0 2px 6px #0002;white-space:normal}
.view .plan-measure:hover {background:#f4e8d8}
.plan-measure-editor {position:absolute;bottom:12px;left:12px;right:12px;z-index:6;background:white;border:1px solid #ac7b4b;box-shadow:0 4px 24px #0003;border-radius:8px;padding:16px;max-width:460px;margin:auto}
.plan-measure-editor label {margin:0 0 8px;font-size:15px}
.plan-measure-editor input {font-size:16px;min-height:44px;max-width:230px}
.measure-entry {display:flex;gap:10px;align-items:center}
.plan-measure-editor p {font-size:13px;color:#982f24;line-height:1.5}
.plan-measure-editor>div:last-child {display:flex;gap:8px}
.plan-measure-editor button {min-height:44px}
.plan-is-open .flow-mobile-preview {display:none!important}
.view .scene-retry {margin:4px 12px;align-self:flex-start;min-height:44px}
.step-flow .preview-column {width:100%}
@media screen and (max-width:1000px) {
 .step-flow .flow-layout {display:flex;flex-direction:column}
 .step-flow .preview-column {display:block;order:-1;margin:0 0 16px;position:static}
 .step-flow .flow-story {width:100%}
 .step-flow .view:not(.plan-expanded) {display:block}
 .step-flow .view:not(.plan-expanded) #scene,.step-flow .view:not(.plan-expanded) #scene3d {height:280px!important}
 .step-flow .view:not(.plan-expanded) .camera-controls,.step-flow .view:not(.plan-expanded) .scene-hint {display:none}
 .step-flow .view:not(.plan-expanded) .toolbar:first-child {padding:8px;gap:6px}
 .step-flow .view:not(.plan-expanded) .toolbar:first-child .tag {width:100%}
 .step-flow .view:not(.plan-expanded) .toolbar button {min-height:44px;flex:1;font-size:12px;margin:0}
 .step-flow .view:not(.plan-expanded) .material-caption {padding:8px 12px}
 .step-flow .view:not(.plan-expanded) #dimensions {padding:8px 12px}
 .step-flow .plan-expanded {max-height:100dvh}
 .step-flow .plan-expanded .scene-hint {padding:6px 12px;margin:0}
 .step-flow .plan-expanded .camera-controls button {min-height:36px;padding:6px}
 .step-flow .view .plan-measure {min-height:44px;font-size:11px;padding:5px;max-width:145px}
 .step-flow .plan-measure-editor {position:fixed;bottom:calc(max(12px,env(safe-area-inset-bottom)) + var(--plan-keyboard-inset,0px))}
}
@media print {.plan-measures,.plan-measure-editor,#show-measures,.scene-retry {display:none!important}}
.buy-start {padding:32px 0}
.view .basin-measure{pointer-events:none;background:#e9f0ef;color:#244743;border-color:#69857e;font-size:11px;max-width:46%;width:max-content;text-align:center}
.basin-dimension-summary{margin:0;padding:10px 16px;border-top:1px solid #d7cbbb;background:#fffaf1;font-size:12px;line-height:1.6;color:#554b3c}
.view .basin-dimension-summary[hidden],.view .basin-measure[hidden]{display:none!important}
.step-flow .view:not(.plan-expanded) .plan-measure{max-width:46%;min-height:42px;font-size:11px}
@media(min-width:1001px){.step-flow .preview-column{position:sticky;top:calc(var(--flow-nav) + var(--flow-steps) + 12px)}}
.step-flow.plan-is-open .preview-column{z-index:10001}
.buy-start h2 {font-size:30px}
.buy-start>p {font-size:15px;line-height:1.6}
.buy-journeys {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:24px 0}
.buy-journey {display:flex;flex-direction:column;border:1px solid #c9b294;border-radius:8px;background:white;padding:24px;color:#33291e;text-decoration:none;min-height:240px}
.buy-journey h3 {font-size:22px;font-weight:500;margin:0 0 12px}
.buy-journey p {font-size:15px;line-height:1.7;flex:1;margin:0 0 24px}
.buy-journey strong {font-size:15px;color:#8b5427}
.buy-journey:hover {background:#f8f0e5}
@media(max-width:800px){.buy-journeys{grid-template-columns:1fr}.buy-journey{min-height:0;padding:20px}.buy-journey p{margin-bottom:14px}}

/* Keep the drawing inside the viewport while the form scrolls. */
@media screen {
 .step-flow .preview-column {position:sticky;top:calc(var(--flow-nav) + var(--flow-steps) + 8px);z-index:45}
 .step-flow .card.view:not(.plan-expanded) {display:flex;flex-direction:column;height:calc(100vh - var(--flow-nav) - var(--flow-steps) - 24px);height:calc(100dvh - var(--flow-nav) - var(--flow-steps) - 24px);max-height:820px;min-height:0;margin:0}
 .step-flow .view:not(.plan-expanded)>* {flex-shrink:0}
 .step-flow .view:not(.plan-expanded) #scene,.step-flow .view:not(.plan-expanded) #scene3d {flex:1 1 auto;height:0!important;min-height:140px}
 .step-flow .view:not(.plan-expanded) .toolbar {margin:0;padding:6px 8px;gap:5px}
 .step-flow .view:not(.plan-expanded) .toolbar:first-child .tag {display:none}
 .step-flow .view:not(.plan-expanded) .toolbar:first-child button {flex:1 1 0;min-width:0;min-height:44px;margin:0;padding:6px;font-size:11px}
 .step-flow .view:not(.plan-expanded) .material-caption {padding:6px 12px}
 .step-flow .view:not(.plan-expanded) .material-caption span {font-size:14px}
 .step-flow .view:not(.plan-expanded) .scene-hint {display:none}
 .step-flow .view:not(.plan-expanded) #scene3d-status {margin:0 12px;font-size:11px}
 .step-flow .view:not(.plan-expanded) #scene3d-status:empty {display:none}
 .step-flow .view:not(.plan-expanded) #dimensions {padding:6px 12px}
 .step-flow .view:not(.plan-expanded) .basin-dimension-summary {padding:6px 12px;max-height:64px;overflow:auto;font-size:11px;line-height:1.5}
}
@media screen and (max-width:1000px) {
 .step-flow .preview-column {top:calc(var(--flow-nav) + var(--flow-steps));margin:0 0 12px;background:#f6f3ee;padding:4px 0 8px}
 .step-flow .card.view:not(.plan-expanded) {height:clamp(200px,30dvh,250px);max-height:none;box-shadow:0 4px 12px #33291e18}
 .step-flow .view:not(.plan-expanded) .material-caption,
 .step-flow .view:not(.plan-expanded) .basin-dimension-summary,
 .step-flow .view:not(.plan-expanded) #dimensions {display:none}
 .step-flow .view:not(.plan-expanded) .toolbar:first-child button {font-size:10px;padding:4px;min-height:44px}
 .step-flow .flow-stage {scroll-margin-top:calc(var(--flow-nav) + var(--flow-steps) + clamp(200px,30dvh,250px) + 30px)}
 .step-flow .flow-mobile-preview {display:none}
}
@media screen and (min-width:1001px) and (max-height:650px) {
 .step-flow .view:not(.plan-expanded) .camera-controls,
 .step-flow .view:not(.plan-expanded) .basin-dimension-summary {display:none}
}
.drilling-layer {z-index:4}
.step-flow .view .drilling-handle {position:absolute;transform:translate(-50%,-50%);width:32px;min-height:32px;height:32px;max-width:none;padding:0;margin:0;border:2px solid #975c28;border-radius:50%;background:#fff9;color:#573215;font:700 11px Arial,sans-serif;pointer-events:auto;touch-action:none;cursor:grab;box-shadow:0 1px 5px #0003}
.step-flow .view .drilling-handle:focus-visible {outline:3px solid #263d44;outline-offset:3px}
.step-flow .view .drilling-handle.is-dragging {cursor:grabbing;background:#f2d1a2;box-shadow:0 3px 12px #0005}
.drilling-caption {font-size:11px;line-height:1.5;margin:0;padding:6px 12px;background:#f8f1e6;color:#684829}
.drilling-editor {z-index:7}
.drilling-editor strong {display:block;margin-bottom:12px}
.drilling-editor input {width:100%}
.drilling-handle[hidden],.drilling-caption[hidden] {display:none!important}
@media(max-width:1000px){
 .step-flow .view .drilling-handle {width:44px;height:44px;min-height:44px;background:radial-gradient(circle,#fff9 0 12px,transparent 13px);border:0;box-shadow:none;color:#573215;text-shadow:0 1px white}
 .step-flow .view .drilling-handle::after {content:'';position:absolute;inset:8px;border:2px solid #975c28;border-radius:50%;pointer-events:none}
 .view:not(.plan-expanded) .drilling-caption {display:none}
}
@media print {.drilling-layer,.drilling-caption,.drilling-editor {display:none!important}}

.step-flow .module-version{position:absolute;left:0;bottom:2px;font-size:11px;font-weight:700;color:#8f5d28;line-height:16px}.step-flow .flow-progress-status{max-width:calc(100% - 64px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
