/* A single app bar and a quiet, floating view shelf. */
:root{--navy:#1c203b;--line:#e5e6e9;--muted:#747780}
body{background:#f6f7f8}
body>header.studio-header{height:58px;min-height:58px;padding:0 20px;gap:26px;background:#fff;border-bottom:1px solid var(--line)}
body>header .brand-logo{width:116px;height:40px;object-fit:contain;filter:none}
.studio-header .steps{flex:1;height:100%;min-height:0;padding:0;border:0;background:transparent;flex-wrap:nowrap;gap:2px;min-width:0}
.studio-header .steps>[data-tab]{font-size:13px;letter-spacing:0;padding:0 15px;height:34px;min-height:34px;border:0;border-radius:8px;background:transparent;align-self:center}
.studio-header .steps>[data-tab].active{background:#eeeef3;color:var(--navy);box-shadow:none}
.studio-header .design-actions{gap:5px;flex-wrap:nowrap;height:100%;width:auto;min-width:0}
.studio-header .design-actions>button,.studio-header .design-actions>details>summary{font-size:12px;height:32px;min-height:32px;padding:0 11px;border-radius:9px;letter-spacing:0;background:#fff;border:1px solid #e4e5e9;color:var(--navy);white-space:nowrap}
.studio-header #save-design{background:var(--navy);color:#fff;border-color:var(--navy)}
.studio-header #help{gap:6px}.studio-header #help svg{width:15px;height:15px}
#designs-list{top:calc(100% + 12px)}
#design-summary{position:relative}
.design-summary-content{position:absolute;right:0;top:calc(100% + 12px);width:310px;padding:22px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 14px 44px #16213a20;z-index:50}
#design-summary:not([open]) .design-summary-content{display:none}
.design-summary-content .design-summary-data{position:static;display:block!important;height:auto;min-height:0;padding:0;background:transparent;border:0}
.design-summary-content .design-summary-data>div:first-child{display:flex!important;flex-direction:column;align-items:flex-start;gap:12px}
.design-summary-content .design-summary-data span,.design-summary-content .design-summary-data strong{border:0;padding:0;margin:0!important;font-size:13px!important;white-space:normal}
.design-summary-content .local-note{display:block;margin-top:18px!important;font-size:11px!important;line-height:1.6;max-width:none}
#studio-main>aside{width:272px;background:#fff;border-right:1px solid var(--line)}
#panel{background:#fff;padding:23px 18px}
#panel h2{font-size:22px;letter-spacing:-.03em;line-height:1.25;margin:0 0 10px}
#panel>p{font-size:12px;margin-bottom:20px;line-height:1.6}
.catalog-tabs{gap:5px}.catalog-tabs button{font-size:11px;min-height:28px;padding:5px 9px;border-radius:7px}
.catalog-card{border-color:#e6e7eb;border-radius:10px;box-shadow:none}.catalog-card strong{font-size:11px;line-height:1.45}.catalog-card small{font-size:10px;color:#777c86}
.catalog-card img{height:100px;background:#f6f6f7}.catalog-card .add{font-size:18px}
.sidebar-foot{padding:12px 18px;background:#fff}.sidebar-foot>span{display:none}.sidebar-foot button{font-size:11px}
.workspace{background:#eef0f2}
.workspace .scene-top.header-views{position:absolute;top:14px;left:14px;right:14px;min-height:0;padding:0;background:none;border:0;align-items:center;gap:8px;pointer-events:none;z-index:8}
.workspace .header-views .view-actions{max-width:none;gap:5px;flex-wrap:nowrap;justify-content:flex-end;pointer-events:auto;flex:0 1 auto;margin-left:auto}
.workspace .header-views>button,.workspace .header-views .view-actions>button,.workspace .header-views details>summary{height:32px!important;min-height:32px!important;font-size:12px!important;padding:0 10px!important;border:1px solid #ffffffc9;border-radius:10px;box-shadow:0 2px 8px #1823340c;background:#ffffffdb;backdrop-filter:blur(20px);pointer-events:auto}
.workspace .header-views #toggle-sidebar{width:34px;padding:0!important;justify-content:center}.workspace .header-views #toggle-sidebar span{display:none}
.workspace .header-views .time-menu>summary{min-width:100px}
.workspace .header-views .view-toggle{height:34px;padding:3px;background:#ffffffdf;border:1px solid #fff;border-radius:10px;margin-left:5px;backdrop-filter:blur(20px)}
.workspace .header-views .view-toggle button{height:26px;min-height:26px;font-size:11px;padding:0 10px;border-radius:7px}
.workspace .header-views .quality-label{font-size:9px;color:#777d8c}
.scene-tools{top:61px;left:14px;padding:4px;border:1px solid #fff;background:#ffffffd9;border-radius:11px;box-shadow:0 3px 14px #19203310}
.scene-tools button{width:40px;min-height:34px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;border:0;background:transparent}
.scene-tools #undo,.scene-tools #redo{min-height:42px}.scene-tools svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.scene-tools button span{font-size:9px;line-height:1}
.scene-tools button:disabled{opacity:.3}
.scene-bottom{bottom:12px;left:16px;right:16px;font-size:10px;pointer-events:none}.scene-bottom span{background:#ffffffa6;padding:5px 8px;border-radius:6px;color:#737983}.scene-bottom .scale-note{display:none}
#selection-panel{top:62px;right:14px;width:280px;padding:18px;max-height:calc(100% - 104px);background:#ffffffee;border:1px solid #fff;border-radius:14px;box-shadow:0 8px 32px #1c203b13}
#selection-panel h3{font-size:16px;line-height:1.3;letter-spacing:-.025em;margin:8px 24px 7px 0}
#selection-panel .selected-label{font-size:9px;letter-spacing:1.1px;color:#8a8d96}
#selection-panel .position-note{font-size:11px;line-height:1.5;margin:0 0 15px}
#selection-panel .field{font-size:11px;margin-bottom:12px}#selection-panel .field input,#selection-panel .field select{font-size:13px;min-height:34px;padding:8px 10px;border:1px solid #dddfe5;border-radius:7px}
#selection-panel .field input:disabled{background:#f4f5f7;color:#8b8f97;border-color:#edeef1}
#selection-panel .cabinet-colour{display:flex;align-items:center;justify-content:space-between;margin:5px 0 13px}
#selection-panel .cabinet-colour input{width:46px;height:28px;min-height:28px;padding:2px}
.inspector-details{border-top:1px solid #e7e8ec;margin-top:10px;padding-top:11px}.inspector-details>summary{cursor:pointer;font-size:12px;padding:0 0 10px;list-style-position:inside}.inspector-details .joinery-controls{border:0;margin:0;padding:0}.inspector-details .joinery-controls>span,.inspector-details .joinery-controls>p{display:none}
#selection-panel .actions{display:flex;flex-wrap:wrap;gap:5px;margin-top:15px}#selection-panel .actions button{font-size:11px;padding:6px 9px;min-height:30px;border-radius:7px}.gap-advice{padding:10px;font-size:11px}.gap-advice p{font-size:11px;line-height:1.5}.gap-advice button{font-size:11px;min-height:30px}
.elevation-control{top:62px;left:75px}#elevation-drawing{inset:98px 0 20px}#plan{top:48px;height:calc(100% - 66px)}
.camera-toolbar{top:62px;max-height:calc(100% - 80px)}
body.is-walking .workspace .scene-top{display:none}
body.walk-locked,body.walk-locked *{cursor:none!important}
body.walk-paused #scene,body.walk-paused #scene canvas{cursor:default!important}
.walk-paused .walk-reticle{opacity:0}.walk-reticle{width:3px;height:3px;opacity:.42}
@media(max-width:1150px){body>header.studio-header{gap:14px;padding-inline:14px}.studio-header .steps>[data-tab]{padding-inline:10px}.studio-header .design-actions>button,.studio-header .design-actions>details>summary{padding-inline:8px}.studio-header #help span{display:none}.workspace .header-views .quality-label{display:none}#studio-main>aside{width:250px}.workspace .header-views .view-actions{gap:4px}.workspace .header-views .view-toggle button{padding-inline:7px}.workspace .header-views .time-menu>summary{min-width:85px}}
@media(max-width:900px){body>header.studio-header{gap:8px}.studio-header .brand-logo{width:88px}.studio-header .steps>[data-tab]{font-size:12px;padding-inline:8px}.studio-header .design-actions>button,.studio-header .design-actions>details>summary{font-size:11px;padding-inline:7px}.workspace .header-views .view-actions{flex-wrap:wrap;max-width:calc(100% - 43px)}.workspace .header-views .view-actions>button,.workspace .header-views details>summary{font-size:11px!important}.workspace .header-views .view-toggle{order:-1;margin-left:0}#selection-panel{top:98px}.scene-tools{top:98px}}
@media(max-width:680px){body>header.studio-header{height:auto;min-height:54px;flex-wrap:wrap;padding:8px 10px;gap:6px}.studio-header .brand{display:none}.studio-header .steps{flex-wrap:wrap;height:auto;gap:4px}.studio-header .design-actions{margin-left:auto;border:0;width:auto;height:32px}.studio-header #presentation-export{display:none}#studio-main>aside{width:220px;position:absolute;left:0;top:0;bottom:0;z-index:12;box-shadow:8px 0 24px #19203315}#studio-main{position:relative}#studio-main:not(.is-sidebar-collapsed) .workspace .header-views{left:230px}#studio-main:not(.is-sidebar-collapsed) .view-actions{display:none}#selection-panel{width:245px}.workspace .header-views{left:10px;right:10px}}
@media(prefers-reduced-transparency:reduce){.workspace .header-views button,.workspace .header-views summary,.workspace .header-views .view-toggle,#selection-panel,.scene-tools{background:#fff;backdrop-filter:none}}

.design-summary-content #room-summary,.design-summary-content #finish-summary{display:block!important}

/* Dialogs remain within the visible viewport, including short app panels. */
#modal[open]{position:fixed;inset:0;margin:auto;width:min(680px,calc(100vw - 32px));max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px);overflow:auto;padding:30px;border-radius:16px;background:#fff;opacity:1;visibility:visible;box-shadow:0 18px 70px #18233426}
#modal::backdrop{background:rgb(20 28 44 / 12%);backdrop-filter:none}
#modal h2{padding-right:28px;font-size:24px}#modal .close-modal{position:sticky;top:0;float:right;right:0;z-index:1;background:#fff}
#walk-status{max-width:230px;line-height:1.55}

body.walk-hover:not(.walk-paused) #scene canvas{cursor:none!important}
body.walk-hover:not(.walk-paused) #scene canvas:active{cursor:none!important}
body.walk-hover .walk-help{opacity:1;pointer-events:auto;max-width:350px}
body.walk-hover #scene canvas:focus{outline:none}

.time-menu[data-mode="studio"]>summary .time-orb,[data-time="studio"] .time-orb{background:radial-gradient(circle at 32% 25%,#fff 8%,#e9e4dc 48%,#bcb6ad 85%);box-shadow:inset 0 0 0 1px #a6a5a530}
#walk-editor{max-height:calc(100% - 36px);overflow-y:auto}
.is-walking #walk-overlay:has(#walk-editor:not([hidden])) .walk-help{display:none}
.colour-scope-actions{display:grid;gap:6px;margin:14px 0 8px}
#walk-editor .colour-scope-actions button{min-height:32px;padding:7px 10px;border:1px solid #dcdfe5;border-radius:9px;background:#fff9;font-size:11px;text-align:left;color:#292d43}
#walk-editor .colour-scope-actions button:hover{background:#e9edf3}
#walk-editor small{font-size:10px;line-height:1.5;color:#6a7180;display:block}
#walk-editor #walk-apply-status{margin:8px 0;font-size:11px}
.walk-size{margin:12px 0}.walk-size summary{font-size:11px;cursor:pointer;margin-bottom:8px}