:root{--bg:#f3f1ec;--paper:#fbfaf7;--ink:#171815;--muted:#6d7167;--line:#d9d7cf;--green:#203a2c;--orange:#c9652a;--panel:410px}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{overflow:hidden;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body.plan-modal-open{overflow:hidden}
button,input{font:inherit}
button{color:inherit}
.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}
.topbar{position:fixed;z-index:20;inset:0 0 auto;height:64px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 22px;background:rgba(251,250,247,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.wordmark{display:inline-flex;width:max-content}.wordmark img{display:block;width:auto;height:22px}
.title-wrap{display:flex;align-items:center;gap:10px}.title-wrap strong{font-size:15px}.title-wrap span{padding:5px 8px;border-radius:999px;background:#ebe8df;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.top-actions{justify-self:end;display:flex;align-items:center;gap:7px}
.top-back{color:var(--muted);font-size:14px;font-weight:700;text-decoration:none;white-space:nowrap}.top-back:hover{color:var(--ink)}
.download-button{height:38px;display:inline-flex;align-items:center;gap:7px;padding:0 14px;border:1px solid var(--ink);border-radius:999px;background:transparent;color:var(--ink);font-size:11px;font-weight:800;cursor:pointer}.download-button:hover{background:#ebe8df}.download-button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.save-button{border:0;border-radius:999px;padding:12px 22px;background:var(--ink);color:white;font-weight:800;cursor:pointer}.save-button:hover{background:#000}.save-button.wide{width:100%;padding:15px}
.constructor-shell{position:fixed;inset:64px 0 0;display:grid;grid-template-columns:minmax(0,1fr) var(--panel)}
.workspace{min-width:0;display:flex;flex-direction:column;padding:20px 22px 22px;overflow:hidden}
.workspace-heading{display:flex;justify-content:space-between;gap:30px;align-items:flex-end;margin:0 auto 14px;width:min(100%,1120px)}
.eyebrow{display:block;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.workspace-heading h1{margin:4px 0 0;font-size:clamp(24px,3vw,40px);line-height:1;letter-spacing:-.04em}.workspace-heading p{max-width:410px;margin:0;color:var(--muted);font-size:12px;line-height:1.45}
.canvas-wrap{position:relative;min-height:0;flex:1;display:grid;place-items:center;overflow:hidden;border:1px solid var(--line);border-radius:22px;background:radial-gradient(circle at 50% 45%,#fff 0,#f2f1ed 62%,#e7e4dd 100%)}
.yard-canvas{position:relative;width:min(100%,calc((100vh - 160px)*1.5));aspect-ratio:3/2;overflow:hidden;transform:scale(var(--canvas-scale,1.2));transform-origin:center;transition:transform .18s ease;isolation:isolate}
.material-layer{position:absolute;left:0;width:100%;z-index:0}
.base-material-layer{inset:0;background-image:url('opt/constructor/materials/Grass background.png');background-position:0 0;background-size:19.8%;background-repeat:repeat}
.stripe-material-layer{top:72.8%;height:10.9%;background-image:url('opt/constructor/materials/Stripe Grass background.png');background-position:0 0;background-size:19.8% auto;background-repeat:repeat;z-index:1}
.material-layer::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.04)}
.house-render{position:absolute;z-index:2;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}
.object-layer{position:absolute;z-index:3;inset:0}
.placed-object{position:absolute;left:0;top:0;width:120px;transform:translate(-50%,-50%);cursor:grab;touch-action:none;filter:drop-shadow(0 8px 7px rgba(28,28,25,.18));user-select:none}.placed-object:active{cursor:grabbing}.placed-object.selected{outline:2px solid var(--orange);outline-offset:4px;border-radius:8px}.placed-object img{display:block;width:100%;height:auto;pointer-events:none}
.zoom-tools{position:absolute;right:14px;top:14px;z-index:7;display:flex;align-items:center;padding:4px;border:1px solid var(--line);border-radius:999px;background:rgba(251,250,247,.94);box-shadow:0 8px 24px rgba(0,0,0,.08)}.zoom-tools button{height:30px;min-width:30px;border:0;border-radius:999px;background:transparent;cursor:pointer;font-weight:800}.zoom-tools #fitBtn{font-size:10px}.zoom-tools button:hover{background:#ebe8df}.zoom-tools button:disabled{opacity:.3;cursor:not-allowed}.zoom-tools i{width:1px;height:20px;margin:0 4px;background:var(--line)}.zoom-tools span{width:46px;text-align:center;font-size:10px;font-weight:700;color:var(--muted)}
.history-icon{display:block;width:16px;height:16px;margin:auto;object-fit:contain}
.object-toolbar{position:absolute;z-index:8;left:50%;bottom:14px;transform:translateX(-50%);display:flex;align-items:center;gap:7px;width:min(900px,calc(100% - 40px));padding:7px 9px 7px 14px;border:1px solid var(--line);border-radius:999px;background:rgba(251,250,247,.96);box-shadow:0 12px 35px rgba(0,0,0,.14)}.object-toolbar[hidden]{display:none}.object-toolbar>span{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:800}.object-toolbar label{display:flex;align-items:center;gap:6px;flex:1;min-width:90px;color:var(--muted);font-size:10px;font-weight:700}.object-toolbar input{width:100%;accent-color:var(--ink)}.object-toolbar button{border:0;border-radius:999px;padding:8px 10px;background:#ebe8df;font-size:10px;font-weight:800;white-space:nowrap;cursor:pointer}.object-toolbar button:disabled{opacity:.4;cursor:not-allowed}.object-toolbar .danger{color:#a63c27}
.toolbar-icon{display:none;width:16px;height:16px;object-fit:contain}
.library{min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--paper);border-left:1px solid var(--line);overflow:hidden}
.library-head{display:flex;align-items:center;justify-content:space-between;padding:22px 22px 13px}.library-head h2{margin:3px 0 0;font-size:25px;letter-spacing:-.035em}.mobile-close{display:none;border:0;background:transparent;font-size:26px}
.yard-switcher{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin:0 16px 14px;padding:4px;border:1px solid var(--line);border-radius:14px;background:#efede7}.yard-switcher button{border:0;border-radius:10px;padding:10px 7px;background:transparent;color:var(--muted);font-size:11px;font-weight:800}.yard-switcher button.active{background:#fff;color:var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.08)}.yard-switcher button:disabled{cursor:not-allowed}.yard-switcher span{margin-left:4px;padding:3px 6px;border-radius:999px;background:#dedbd2;font-size:8px;text-transform:uppercase;letter-spacing:.06em}
.category-tabs{position:relative;z-index:8;flex:0 0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:0 16px 8px;padding:4px;border:1px solid var(--line);border-radius:14px;background:#efede7}.category-tabs button{position:relative;z-index:9;display:flex;align-items:center;justify-content:center;min-width:0;border:0;border-radius:10px;padding:10px 5px;background:transparent;color:var(--muted);font-size:10px;font-weight:800;cursor:pointer;white-space:nowrap;pointer-events:auto}.category-tabs button:hover{color:var(--ink);background:rgba(255,255,255,.55)}.category-tabs button span{display:none}.category-tabs button.active{color:var(--ink);background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.category-panel{min-height:120px;flex:1 1 320px;display:flex;flex-direction:column;margin:0 16px;border-bottom:1px solid var(--line);overflow:hidden}.category-panel[hidden]{display:none}.library-meta{flex:0 0 auto;display:flex;align-items:center;justify-content:flex-end;min-height:0}.library-meta:has(.search-wrap:not([hidden])){padding:3px 0 8px}.search-wrap input{width:150px;border:1px solid var(--line);border-radius:999px;padding:8px 12px;background:#fff;font-size:11px;outline:none}.search-wrap input:focus{border-color:var(--ink)}
.catalog{min-height:0;flex:1 1 auto;overflow-x:hidden;overflow-y:scroll;overscroll-behavior:contain;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:9px;padding:3px 5px 18px 0;scrollbar-gutter:stable}.catalog::-webkit-scrollbar{width:8px}.catalog::-webkit-scrollbar-thumb{background:#d2cfc6;border:2px solid var(--paper);border-radius:99px}.material-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;grid-column:1/-1}.material-group h3{grid-column:1/-1;margin:8px 2px 0;font-size:11px;letter-spacing:.08em;text-transform:uppercase}.material-group p{grid-column:1/-1;margin:-4px 2px 2px;color:var(--muted);font-size:9px;line-height:1.35}
.catalog-card{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-height:145px;padding:11px 8px;border:1px solid var(--line);border-radius:15px;background:#fff;cursor:grab;text-align:center}.catalog-card:hover{border-color:#a9a69d;box-shadow:0 8px 18px rgba(35,34,29,.08);transform:translateY(-1px)}.catalog-card.active{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink) inset}.catalog-card img{display:block;width:92px;height:82px;object-fit:contain;pointer-events:none}.catalog-card strong{max-width:100%;font-size:11px;line-height:1.2}.catalog-card small{color:var(--muted);font-size:9px}.catalog-card.material{min-height:125px}.catalog-card.material img{width:100%;height:67px;border-radius:9px;object-fit:cover}
.library-footer{position:relative;z-index:5;flex:0 0 auto;margin-top:auto;padding:12px 16px 16px;border-top:1px solid var(--line);background:var(--paper);box-shadow:0 -10px 22px rgba(251,250,247,.96)}.plan-count{display:flex;justify-content:space-between;align-items:center;margin:0 2px 10px;color:var(--muted);font-size:10px;font-weight:700}.plan-count button{border:0;background:transparent;color:var(--muted);font-size:10px;text-decoration:underline;cursor:pointer}.plan-count button:hover{color:var(--ink)}
.open-library{display:none}.toast{position:fixed;z-index:50;left:50%;top:82px;transform:translate(-50%,-14px);padding:12px 18px;border-radius:999px;background:var(--ink);color:#fff;font-size:12px;font-weight:700;opacity:0;pointer-events:none;transition:.2s ease}.toast.show{opacity:1;transform:translate(-50%,0)}
.plan-modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px}.plan-modal[hidden]{display:none}.plan-modal-backdrop{position:absolute;inset:0;border:0;background:rgba(23,24,21,.58);backdrop-filter:blur(5px)}.plan-sheet{position:relative;width:min(760px,100%);max-height:calc(100vh - 40px);overflow:auto;padding:30px;border-radius:24px;background:var(--paper);box-shadow:0 30px 80px rgba(0,0,0,.3)}.plan-close{position:absolute;right:22px;top:22px;width:36px;height:36px;border:0;border-radius:50%;background:#ebe8df;font-size:21px;cursor:pointer}.plan-sheet h2{margin:6px 50px 5px 0;font-size:30px;letter-spacing:-.04em}.plan-lede{max-width:56ch;margin:0 0 22px;color:var(--muted);font-size:13px;line-height:1.5}.plan-options{display:grid;grid-template-columns:1fr 1fr;gap:16px}.plan-option{display:flex;flex-direction:column;padding:20px;border:1px solid var(--line);border-radius:18px;background:#fff}.plan-option.featured{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink) inset}.plan-tag{color:var(--orange);font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.plan-tag.free{color:var(--green)}.plan-option h3{margin:8px 0 2px;font-size:19px}.plan-option:first-child h3{margin-top:0}.plan-price{margin:5px 0;font-size:30px;font-weight:800;letter-spacing:-.04em}.plan-price small{color:var(--muted);font-size:12px}.plan-option p{margin:0 0 14px;color:var(--muted);font-size:12px;line-height:1.45}.plan-option ul{display:flex;flex-direction:column;gap:7px;margin:0 0 18px;padding:0;list-style:none}.plan-option li{display:flex;gap:9px;font-size:12px;line-height:1.35}.plan-option li::before{content:"";flex:none;width:10px;height:7px;border-left:2px solid var(--green);border-bottom:2px solid var(--green);transform:rotate(-45deg)}.plan-preview{appearance:none;align-self:center;margin:auto 0 14px;padding:0;border:0;background:transparent;color:var(--green);font:inherit;font-size:12px;font-weight:800;text-decoration:underline;text-underline-offset:4px;cursor:pointer}.plan-preview:hover{color:var(--ink)}.plan-action{margin-top:auto;border:0;border-radius:999px;padding:13px 16px;background:var(--ink);color:#fff;font-size:12px;font-weight:800;cursor:pointer}.plan-preview+.plan-action{margin-top:0}.plan-action:hover{background:#000}.plan-action.secondary{background:#ebe8df;color:var(--ink)}.plan-action.secondary:hover{background:#dedbd2}.constructor-legal{margin:18px 0 0;color:var(--muted);font-size:10.5px;line-height:1.5;text-align:center}.constructor-legal a,.constructor-contact a{color:inherit;text-decoration:underline;text-underline-offset:2px}.constructor-contact{margin:13px 0 0;padding-top:13px;border-top:1px solid var(--line);color:var(--muted);font-size:10.5px;text-align:center}
.sample-modal{position:fixed;inset:0;z-index:110;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(23,24,21,.62);backdrop-filter:blur(6px)}.sample-modal.on{display:flex}.sample-sheet{position:relative;width:min(760px,100%);max-height:92vh;overflow-y:auto;background:var(--paper);border-radius:22px;padding:30px 30px 18px;box-shadow:0 30px 80px rgba(0,0,0,.3)}.sample-back{appearance:none;border:0;background:transparent;color:var(--muted);padding:5px 0;font:inherit;font-size:13px;font-weight:800;cursor:pointer}.sample-back:hover{color:var(--ink)}.sample-layout{display:grid;grid-template-columns:1fr;gap:18px;align-items:stretch}.sample-copy{padding:16px 0 0;display:flex;flex-direction:column;align-items:flex-start}.sample-copy h2{font-size:clamp(36px,3.7vw,46px);line-height:1.02;letter-spacing:-.045em;margin:10px 0 0;max-width:620px}.sample-copy>p{color:var(--muted);font-size:16px;line-height:1.5;max-width:620px;margin:14px 0 20px}.sample-copy ul{list-style:none;margin:0 0 10px;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 22px;width:100%}.sample-copy li{display:flex;align-items:center;gap:12px;font-size:16px}.sample-copy li::before{content:'✓';display:grid;place-items:center;flex:0 0 auto;width:25px;height:25px;border-radius:50%;background:#e5e2da;color:#326145;font-weight:900;font-size:14px}.sample-copy small{display:block;color:#8a8d85;font-size:11px;margin-top:4px;max-width:620px}.sample-art{position:relative;min-height:250px;border-radius:22px;background:#ebe8e0;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:42px 12px 18px}.sample-art img{display:block;width:min(72%,460px);height:auto;max-height:220px;object-fit:contain;transform:scale(1.22)}.sample-pill{position:absolute;z-index:1;background:var(--paper);border:1px solid rgba(217,215,207,.8);border-radius:999px;padding:10px 18px;font-size:12px;font-weight:800;box-shadow:0 8px 20px rgba(24,29,24,.06)}.sample-steps{left:22px;top:18px}.sample-layout-pill{right:22px;top:18px}.sample-quantities{right:22px;bottom:18px}
@media(max-width:980px){:root{--panel:360px}.workspace{padding-left:12px;padding-right:12px}.workspace-heading p{display:none}.catalog{grid-template-columns:1fr}.material-group{grid-template-columns:1fr}.object-toolbar{width:calc(100% - 28px);bottom:58px;flex-wrap:nowrap;padding:7px 9px}.object-toolbar>span{display:none}.object-toolbar label{flex:1 1 120px;min-width:74px}.object-toolbar label input{min-width:0}.object-toolbar button{flex:0 0 32px;width:32px!important;height:32px;padding:0!important;display:grid;place-items:center}.object-toolbar button .toolbar-text{display:none!important}.object-toolbar button .toolbar-icon{display:block!important}}
@media(max-width:760px){body{overflow:auto}.topbar{grid-template-columns:1fr auto;height:60px;padding:0 14px}.title-wrap{display:none}.top-actions .icon-button{display:none}.constructor-shell{position:relative;inset:auto;padding-top:60px;display:block;min-height:100vh}.workspace{height:calc(100vh - 60px);padding:15px 10px 72px}.workspace-heading{align-items:center;margin-bottom:10px}.workspace-heading h1{font-size:26px}.canvas-wrap{border-radius:17px}.yard-canvas{width:100%;max-width:100%;}.library{position:fixed;z-index:30;inset:60px 0 0;transform:translateY(105%);transition:transform .25s ease;border-left:0;border-top:1px solid var(--line)}.library.open{transform:translateY(0)}.mobile-close{display:block}.category-panel{max-height:none}.catalog{grid-template-columns:repeat(2,minmax(0,1fr))}.material-group{grid-template-columns:repeat(2,minmax(0,1fr))}.open-library{position:fixed;z-index:18;display:block;left:16px;right:16px;bottom:14px;border:0;border-radius:999px;padding:15px;background:var(--ink);color:#fff;font-weight:800;box-shadow:0 10px 28px rgba(0,0,0,.22)}.object-toolbar{bottom:12px;width:calc(100% - 20px);left:10px;transform:none;border-radius:999px;flex-wrap:nowrap}.object-toolbar label{flex:1 1 70px;min-width:54px;font-size:9px;gap:4px}.zoom-tools{right:10px;top:12px}.zoom-tools span{display:none}.zoom-tools button{min-width:28px}.toast{top:72px}.plan-modal{padding:10px}.plan-sheet{padding:28px 18px 20px;max-height:calc(100vh - 20px)}.plan-options{grid-template-columns:1fr}.sample-modal{padding:10px}.sample-sheet{padding:28px 18px 20px;border-radius:22px;max-height:calc(100vh - 20px)}.sample-layout{gap:18px}.sample-copy{padding:4px 0}.sample-copy h2{font-size:34px;line-height:1.04;margin-right:36px}.sample-copy>p{font-size:15px;margin:14px 0 22px}.sample-copy ul{grid-template-columns:1fr;gap:12px;margin-bottom:12px}.sample-copy li{font-size:14px}.sample-art{min-height:260px;border-radius:20px;padding:46px 5px 20px}.sample-art img{width:82%;max-height:225px;transform:scale(1.1)}.sample-pill{padding:8px 12px;font-size:10px}.sample-steps{left:10px;top:12px}.sample-layout-pill{right:10px;top:12px}.sample-quantities{right:10px;bottom:10px}}
@media(max-width:430px){.top-back{font-size:10px}.download-button span{display:none}.download-button{width:38px;padding:0;justify-content:center}.workspace-heading .eyebrow{display:none}.canvas-wrap{min-height:0}.catalog-card{min-height:138px}.catalog-card img{width:84px;height:76px}.category-tabs button{font-size:9px;padding-inline:2px}.object-toolbar button{padding:7px 9px}}
.plan-sheet>[hidden]{display:none!important}
.constructor-confirmation{display:flex;min-height:430px;align-items:center;justify-content:center;text-align:center;padding:26px 16px 10px}.constructor-confirmation[hidden]{display:none}.constructor-confirmation-inner{width:min(460px,100%)}.constructor-purchase-check{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 18px;border-radius:50%;background:var(--green);color:#fff;font-size:29px;font-weight:800}.constructor-purchase-check.download-pop{animation:constructorCheckPop .55s cubic-bezier(.2,.9,.3,1)}@keyframes constructorCheckPop{0%{transform:scale(1)}35%{transform:scale(.82)}70%{transform:scale(1.16);box-shadow:0 0 0 10px rgba(31,73,54,.12)}100%{transform:scale(1);box-shadow:0 0 0 0 rgba(31,73,54,0)}}.constructor-confirmation h2{margin:8px 0 10px;font-size:34px}.constructor-confirmation p{max-width:44ch;margin:0 auto 20px;color:var(--muted);font-size:13px;line-height:1.5}.constructor-design-id{display:inline-block;margin:0 0 22px;padding:8px 12px;border-radius:9px;background:#efede7;color:#555a52;font-size:11px;font-weight:800;letter-spacing:.03em}.constructor-confirmation .plan-action{display:block;width:100%}.constructor-return{appearance:none;border:0;background:transparent;color:var(--muted);margin-top:12px;padding:7px;font-size:12px;font-weight:800;cursor:pointer}.constructor-return:hover{color:var(--ink)}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}.constructor-purchase-check.download-pop{animation:none}}