/* A quiet canvas with one next step and contextual editing. */
#planner{padding:20px 0 104px!important;overflow:hidden!important;background:#f5f3ec}
#planner>.wrap{max-width:1440px;padding:0 32px;gap:10px}
#planner>.wrap>.screen-back,#planner .steps,#planner .sectionhead,#planner .toolbar,#planner .fineprint,#planner .panelviews,#planner .moving-status{display:none!important}
#planner .planner-heading{display:flex;align-items:center;justify-content:space-between;flex:none;gap:16px}
#planner .planner-heading h2{font-size:26px;margin:4px 0 6px;letter-spacing:-1px;line-height:1.3}
#planner .planner-heading p:not(.eyebrow){font-size:13px;margin:0;line-height:1.5}
#planner #planner-more{min-width:48px;min-height:48px;font-size:20px;border-radius:50%;background:#fffdf8}
#planner .studio{display:block;flex:1;border:0;background:transparent;min-height:0}
#planner .workspace{padding:0;gap:8px;overflow:hidden;height:100%;display:flex;flex-direction:column}
#planner #viewport{flex:1;min-height:130px;border-radius:16px;background:#fffdf8;border:1px solid #d7dace;order:2}
#planner .chips{order:1;margin:0;min-height:44px;flex-shrink:0;align-items:center}
#planner .chips button{min-height:40px;font-size:13px;padding:8px 18px;background:#fffdf8}
#planner .chips button.active{background:#43634b;color:white;border-color:#43634b}
#planner .planner-quick-tools{order:4;display:flex;justify-content:center;align-items:center;gap:8px;flex-shrink:0}
#planner .planner-quick-tools button{min-height:44px;min-width:44px;font-size:12px;background:#fffdf8}
#planner .planner-quick-tools button.active{background:#43634b;color:white}
#planner .planner-action-rail{position:fixed;bottom:0;left:0;right:0;z-index:24;display:flex;gap:12px;justify-content:center;background:#f8f5eef5;border-top:1px solid #dbd7cb;padding:14px 24px calc(14px + env(safe-area-inset-bottom));backdrop-filter:blur(12px)}
#planner .planner-action-rail button{position:static;min-height:56px;border-radius:12px;font-size:15px;margin:0;width:auto;flex:1;max-width:460px;padding:14px 20px}
#planner #layout-finish{background:#43634b;color:white;border-color:#43634b}
#planner #add-open{background:#fffdf8;color:#43634b;border-color:#adb9a7;max-width:230px}
#planner #panel{display:none;position:fixed;z-index:51;top:90px;right:24px;left:auto;bottom:100px;width:400px;max-width:calc(100vw - 32px);height:auto;max-height:none;overflow:auto;border:1px solid #d6dacd;border-radius:20px;padding:20px;background:#fffdf8;box-shadow:0 16px 60px #253b3230}
#planner #panel.open{display:block}
#planner .panelhead{top:-20px;padding:12px 0;background:#fffdf8;margin-bottom:12px}
#planner .panelhead strong{font-size:20px}
#planner #close-panel{display:block;min-height:44px;padding:10px 14px}
.planner-panel-backdrop{display:none;position:fixed;inset:64px 0 0;z-index:50;border:0;background:#242d2440;border-radius:0}
.planner-sheet-open .planner-panel-backdrop{display:block}
#planner .catalog{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#planner .card{padding:12px;border-radius:12px;background:#fff}
#planner .card svg,#planner .card img{height:80px;object-fit:contain}
#planner .card strong{font-size:14px;margin:10px 0 5px}
#planner .card small{font-size:11px}
#planner .card button{min-height:46px;font-size:13px;background:#eef2e8;color:#354e39;border:0;margin-top:10px}
#planner .tabs{gap:8px}
#planner .tabs button{min-height:48px;font-size:13px}
#planner .filters{display:flex;flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;gap:6px}
#planner .filters button{flex-shrink:0;min-height:40px;padding:7px 12px;font-size:12px}
#planner .catalog-pager{bottom:-20px;padding:12px 0;background:#fffdf8}
#planner .catalog-pager button{min-height:44px;font-size:13px}
#planner .panel-note{font-size:12px;line-height:1.65}
#planner .top-item-controls{position:absolute;left:12px;right:12px;bottom:12px;display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;background:#fffdf8f5;border:1px solid #d6dacd;box-shadow:0 3px 18px #0001;border-radius:12px;padding:8px;transform:none;width:auto;max-width:none}
#planner .top-item-controls strong{font-size:12px;margin-right:auto}
#planner .top-item-controls button{font-size:12px;min-height:44px;padding:8px 12px}
#planner #view-label{top:10px;left:10px;font-size:11px}
#planner #fullscreen{top:8px;right:8px;min-height:40px}
#planner #notice{font-size:12px;padding:8px 12px;border-radius:8px;margin:0}
#planner #furniture-form{display:grid;gap:4px 10px}
#planner #furniture-form input,#planner #furniture-form select{font-size:16px;min-height:44px}
#planner #furniture-form>button{position:sticky;bottom:-12px;margin-top:8px;min-height:52px}
#planner #furniture-form label{font-size:12px}
.planner-extra-dialog,.layout-review-dialog{width:min(640px,calc(100vw - 24px));max-height:calc(100dvh - 24px)}
.planner-extra-content{padding:20px;display:grid;gap:12px}
.planner-extra-content>button{min-height:48px}
.planner-extra-content .statusbar{display:grid;gap:12px}
.planner-extra-content .statusbar button,.planner-extra-content .statusbar label{min-height:48px;display:flex;align-items:center;justify-content:center;font-size:13px;border:1px solid #dbd7cb;border-radius:8px}
.layout-review-dialog[open]{display:flex;flex-direction:column}
.layout-review-content{padding:20px;overflow:auto;min-height:0}
.layout-review-content h2{font-size:28px;line-height:1.4;margin:8px 0 12px}
.layout-review-content p{font-size:13px;line-height:1.6}
.review-rooms{display:grid;gap:12px;margin-top:20px}
.review-rooms article{border:1px solid #dedfd5;background:#f9f8f2;border-radius:12px;padding:16px}
.review-rooms article>strong{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:16px}
.review-rooms article>strong span{font-size:11px;font-weight:400;color:#687363}
.review-rooms ul{list-style:none;padding:0;margin:12px 0 0}
.review-rooms li{display:flex;justify-content:space-between;gap:12px;border-top:1px solid #e0e2d8;padding:10px 0;font-size:13px}
.review-rooms li small{font-size:11px;letter-spacing:0}
.layout-review-actions{padding:16px;display:grid;gap:8px;border-top:1px solid #dbd7cb;background:#fffdf8;flex-shrink:0}
.layout-review-actions button{min-height:48px;border-radius:10px}
.layout-review-actions .dark{background:#43634b}
@media(max-width:760px){
 #planner{padding:12px 0 calc(88px + env(safe-area-inset-bottom))!important}
 #planner>.wrap{padding:0 16px;gap:8px}
 #planner .planner-heading h2{font-size:21px}
 #planner .planner-heading p:not(.eyebrow){font-size:12px}
 #planner .planner-heading .eyebrow{font-size:10px;letter-spacing:1px}
 #planner #panel{top:auto;bottom:0;left:0;right:0;width:100%;max-width:none;max-height:calc(100dvh - 90px);border-radius:22px 22px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom))}
 #planner .panelhead{top:-16px}
 #planner .planner-action-rail{padding:12px 16px calc(12px + env(safe-area-inset-bottom));gap:8px}
 #planner .planner-action-rail button{min-height:52px;font-size:14px;padding:12px}
 #planner #add-open{flex:.85}
 #planner .top-item-controls{left:6px;right:6px;bottom:6px;gap:4px;padding:6px}
 #planner .top-item-controls strong{flex-basis:100%;text-align:center;font-size:11px}
 #planner .top-item-controls button{flex:1;padding:6px;font-size:11px;min-height:40px}
 #planner .catalog-pager{bottom:-16px}
 #planner .card svg,#planner .card img{height:70px}
 .layout-review-content{padding:16px}
 .layout-review-content h2{font-size:24px}
 .layout-review-actions{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
}
@media(max-width:760px) and (max-height:680px){#planner .card svg,#planner .card img{height:55px}#planner .card{padding:8px}#planner .planner-heading h2{font-size:19px}#planner .planner-heading p:not(.eyebrow){font-size:11px}#planner .chips{min-height:36px}#planner .chips button{min-height:36px}}
#planner .space-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;padding:24px;max-height:100%;overflow:auto}
#planner .space-tiles button{display:grid;gap:12px;text-align:left;padding:22px;border-radius:16px;background:#edf1e6;min-height:140px}
#planner .space-tiles strong{font-size:20px}#planner .space-tiles span{font-size:12px}#planner .space-tiles b{font-size:13px;color:#43634b}
.planner-panel-backdrop:hover{background:#242d2440!important}
#planner .catalog-category{display:flex;align-items:center;gap:14px;font-size:12px;margin:12px 0}
#planner .catalog-category select{flex:1;min-height:44px;font-size:14px}
body[data-screen=planner] #toast{bottom:auto;top:72px;pointer-events:none}
#prepare>.screen-back{display:none!important}
.editor-dialog{max-width:520px}
#selection-editor .item-advanced{padding:4px 0;font-size:12px}
#selection-editor .item-advanced summary{min-height:48px}
#selection-editor .item-save{padding:0;background:transparent;margin:12px 0 0}
#selection-editor .item-save button{width:100%;min-height:52px;background:#43634b;color:white;font-size:14px}
/* Panel actions are fixed rows; only longer forms scroll. */
#planner #panel{overflow:hidden;padding:16px;gap:10px}
#planner #panel.open{display:flex;flex-direction:column}
#planner .panelhead{position:static;flex-shrink:0;margin:0;padding:0;min-height:44px;gap:12px}
#planner .panelhead strong{font-size:18px}
#planner #panel-content{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain}
#planner .planner-panel-footer{flex-shrink:0;min-height:0;border-top:1px solid #e0e2d7;padding-top:10px;background:#fffdf8}
#planner .planner-panel-footer>button{width:100%;min-height:52px;margin:0;border-radius:10px;font-size:14px;padding:12px;background:#43634b;color:#fff}
#planner .planner-panel-footer .catalog-pager{position:static;margin:0;padding:0;min-height:44px;gap:10px}
#planner .planner-panel-footer .catalog-pager button{min-height:44px;flex:1;background:#f1f4eb;font-size:13px}
#planner .planner-panel-footer .catalog-pager span{min-width:48px;text-align:center}
#planner #panel[data-panel-mode=catalog] #panel-content{display:flex;flex-direction:column;gap:8px;overflow:hidden}
#planner #panel[data-panel-mode=catalog] #panel-content>.panel-note{display:none}
#planner #panel[data-panel-mode=catalog] .tabs{flex-shrink:0;margin:0;gap:8px}
#planner #panel[data-panel-mode=catalog] .tabs button{min-height:44px;padding:8px;font-size:12px}
#planner #panel[data-panel-mode=catalog] .catalog-category{flex-shrink:0;margin:0;gap:10px;min-height:44px;font-size:12px}
#planner #panel[data-panel-mode=catalog] .catalog-category select{min-height:44px;font-size:14px;padding:8px 10px}
#planner #panel[data-panel-mode=catalog] .catalog{flex:1;min-height:0;gap:10px;align-content:stretch;grid-auto-rows:minmax(0,1fr)}
#planner #panel[data-panel-mode=catalog] .card{display:flex;flex-direction:column;min-height:0;padding:10px;overflow:hidden}
#planner #panel[data-panel-mode=catalog] .card svg,#planner #panel[data-panel-mode=catalog] .card img{flex:1;min-height:20px;height:auto;max-height:125px;width:100%}
#planner #panel[data-panel-mode=catalog] .card strong{flex-shrink:0;font-size:13px;margin:6px 0 4px;line-height:1.3}
#planner #panel[data-panel-mode=catalog] .card small{flex-shrink:0;font-size:10px;letter-spacing:0;line-height:1.4}
#planner #panel[data-panel-mode=catalog] .card button{flex-shrink:0;min-height:44px;padding:8px 4px;font-size:12px;margin-top:8px}
#planner #panel[data-panel-mode=form] #panel-content>.panel-note,#planner #furniture-form>.panel-note{display:none}
#planner #panel[data-panel-mode=form] .tabs{margin:0 0 8px;gap:8px}
#planner #panel[data-panel-mode=form] .tabs button{min-height:44px;padding:8px;font-size:12px}
#planner #furniture-form{margin:0;gap:4px 10px}
#planner #furniture-form label{margin:4px 0;font-size:12px}
#planner #furniture-form .formgrid{gap:0 10px}
#planner #furniture-form input,#planner #furniture-form select{min-height:44px;padding:8px;font-size:16px}
#planner #furniture-form .furniture-photo-options{order:3;margin:2px 0;padding:0}
#planner #furniture-form .furniture-photo-options summary{min-height:44px;font-size:12px}
#planner #panel[data-panel-mode=form] .catalog{margin-top:12px}
@media(max-width:760px){
 #planner{padding-bottom:calc(108px + env(safe-area-inset-bottom))!important}
 #planner .planner-action-rail{padding-bottom:calc(28px + env(safe-area-inset-bottom))}
 .layout-review-actions{padding-bottom:calc(28px + env(safe-area-inset-bottom))}
 #planner #panel{height:min(520px,calc(100dvh - 76px));max-height:calc(100dvh - 76px);padding:14px 16px calc(28px + env(safe-area-inset-bottom));gap:10px}
 #planner #panel[data-panel-mode=other]{height:min(640px,calc(100dvh - 76px))}
 #planner #panel[data-panel-mode=catalog] .card svg,#planner #panel[data-panel-mode=catalog] .card img{max-height:110px}
 #planner[data-panel-keyboard=true] #panel{bottom:var(--panel-keyboard-bottom);height:calc(var(--panel-visible-height) - 12px);max-height:calc(var(--panel-visible-height) - 12px);padding-bottom:12px}
 #planner[data-panel-keyboard=true] #panel-content{overflow:auto}
 #planner .top-item-controls button{min-height:44px}
}
@media(max-width:760px) and (max-height:680px){
 #planner #panel{gap:8px;padding-top:12px}
 #planner .panelhead strong{font-size:17px}
 #planner #panel[data-panel-mode=catalog] .card{padding:8px}
 #planner #panel[data-panel-mode=catalog] .card svg,#planner #panel[data-panel-mode=catalog] .card img{max-height:90px}
 #planner #panel[data-panel-mode=form] .tabs{margin-bottom:4px}
 #planner #panel[data-panel-mode=form] .tabs button{font-size:11px}
 #planner #furniture-form label{gap:3px;font-size:11px}
}
.planner-reference-dialog{width:min(780px,calc(100vw - 24px));max-height:calc(100dvh - 28px)}
.planner-reference-dialog[open]{display:flex;flex-direction:column}
.planner-reference-dialog .dialog-heading{position:static;flex-shrink:0}
.planner-reference-content{overflow:auto;padding:16px;min-height:0}
.planner-reference-content img{display:block;width:100%;height:auto;object-fit:contain;max-height:65dvh}
.planner-reference-content p{font-size:12px;line-height:1.5;margin:12px 0 0}
#planner .planner-quick-tools{flex-wrap:wrap}

/* Full floor plan: every room remains visible while furniture is edited. */
#render3d:has(.whole-plan-canvas){display:flex;align-items:center;justify-content:center;padding:38px 18px 28px;overflow:auto;background:#ddd5c4;}
#render3d[hidden]{display:none!important;}
.whole-plan-canvas{position:relative;width:100%;max-width:850px;max-height:100%;background-size:100% 100%;background-repeat:no-repeat;flex-shrink:0;}
.whole-plan-room{position:absolute;min-width:0;border:2px solid #a79b84;border-radius:3px;box-shadow:0 3px 8px #51432a20;}
.whole-plan-room[data-active="true"]{border-color:#e7744c;box-shadow:0 0 0 2px #e7744c55;z-index:1;}
.whole-plan-room-surface{width:100%;height:100%;touch-action:none;}
.whole-plan-room-label{position:absolute;top:5px;left:5px;padding:4px 8px!important;min-height:30px;border:0!important;border-radius:6px;background:#fff9!important;color:#334c41;font-size:12px!important;backdrop-filter:blur(4px);}
.whole-plan-room[data-active="true"] .whole-plan-room-label{background:#334c41!important;color:white;}
@media(max-width:600px){#render3d:has(.whole-plan-canvas){padding:36px 10px 30px;}.whole-plan-room-label{font-size:11px!important;padding:3px 6px!important;}}

/* Uploaded plans retain their original proportions and remain visible under furniture. */
#render3d:has(.whole-plan-content){display:block;overflow:auto;}
.whole-plan-content{width:100%;max-width:850px;margin:auto;}
.whole-plan-content .whole-plan-canvas{max-height:none;margin:0 auto;box-shadow:0 2px 12px #534a3020;}
.whole-plan-content .whole-plan-canvas[hidden],.whole-plan-grid[hidden],.whole-plan-unassigned[hidden]{display:none;}
.whole-plan-canvas>.whole-plan-room{border:0;box-shadow:inset 0 0 0 1px #64765288;}
.whole-plan-canvas>.whole-plan-room[data-active="true"]{box-shadow:inset 0 0 0 2px #e7744c;}
.whole-plan-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start;}
.whole-plan-grid[data-single="true"]{grid-template-columns:minmax(0,1fr);max-width:650px;margin:0 auto;}
.whole-plan-grid .whole-plan-tile{position:relative;box-sizing:border-box;width:100%;min-height:100px;}
.whole-plan-grid .whole-plan-room-surface{position:absolute;inset:0;}
.whole-plan-unassigned{margin:20px 0 10px;font-size:12px;line-height:1.5;color:#4f594b;}
@media(max-width:600px){.whole-plan-grid{gap:9px;}.whole-plan-grid .whole-plan-tile{min-height:80px;}}

/* Give the plan a readable canvas, letting the page scroll on short screens. */
#planner{overflow-x:hidden!important;overflow-y:auto!important;}
#planner>.wrap{height:auto;min-height:100%;}
#planner .studio:not(.expanded){flex:none;overflow:visible;}
#planner .studio:not(.expanded) .workspace{height:auto;overflow:visible;}
#planner .studio:not(.expanded) #viewport{flex:none;height:clamp(420px,60dvh,680px);min-height:420px;}
#planner .studio.expanded .workspace{height:calc(100dvh - 24px);}
#planner .studio.expanded #viewport{flex:1;height:auto;min-height:280px;}
#render3d:has(.whole-plan-content){touch-action:pan-y;}
@media(max-width:760px){
 #planner .studio:not(.expanded) #viewport{height:clamp(360px,58dvh,600px);min-height:360px;}
 #planner .studio.expanded .workspace{height:100dvh;}
}