/* Suite role colours apply to chrome; Plan's root drawing palette stays its own. */
@media(prefers-color-scheme:light){html[data-theme="auto"]{--bg:#eef2f7;--panel:rgba(255,255,255,.94);--panel-solid:#fff;--line:rgba(15,23,42,.12);--hair:rgba(15,23,42,.06);--txt:#0f172a;--mut:#5b6675;--input:rgba(15,23,42,.05)}}
#app{font-family:var(--nd-font);color:var(--nd-text);background:var(--nd-bg)}
#top,#ribbon,#statusbar,.workspace-panel,#plan-command-dialog,#workspace-more-menu,#plan-phone-bar{--bg:var(--nd-bg);--panel:var(--nd-surface);--panel-solid:var(--nd-surface);--panel2:var(--nd-surface-raised);--input:var(--nd-surface-raised);--txt:var(--nd-text);--mut:var(--nd-text-muted);--line:var(--nd-border);--gold:var(--nd-accent);--gold-soft:var(--nd-surface-raised);--gold-line:var(--nd-border-strong);--red:var(--nd-danger);background:var(--nd-surface);color:var(--nd-text)}
#app .fpanel,#palette,#tools,#cmdbar,#cmd-hints,#ctxmenu,#zoom,#framebar,#dyn,#anno-ed,#toast,#welcome,#elev-modal{--bg:var(--nd-bg);--panel:var(--nd-surface);--panel-solid:var(--nd-surface);--panel2:var(--nd-surface-raised);--input:var(--nd-surface-raised);--txt:var(--nd-text);--mut:var(--nd-text-muted);--line:var(--nd-border);--gold:var(--nd-accent);--gold-soft:var(--nd-surface-raised);--gold-line:var(--nd-border-strong);--red:var(--nd-danger)}
#top{height:44px;padding:0 10px;gap:8px;backdrop-filter:none}
#top .brand{font:600 14px var(--nd-font);gap:6px}
html[data-nd-bar][data-nd-host="plan"] #top .brand{display:flex}
#app button,#app input,#app select{font-family:var(--nd-font)}
#ribbon *, .workspace-panel *{font-family:var(--nd-font)}
#top svg,.workspace-panel svg,#tools svg{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8}
#top .spacer{display:none}
#workspace-name{width:140px;min-width:70px;background:transparent;border:1px solid transparent;color:var(--nd-text);padding:7px;font:600 14px var(--nd-font);border-radius:4px}
#workspace-name:focus{border-color:var(--nd-focus)}
#command-search{margin-left:auto;min-width:230px;text-align:left;color:var(--nd-text-muted);background:var(--nd-surface-raised);border:1px solid var(--nd-border-strong);border-radius:4px;padding:7px 12px;font:14px var(--nd-font)}
#top .tbtn,#workspace-more{border-radius:4px;font:13px var(--nd-font);height:32px}
#workspace-more{display:flex;align-items:center;gap:4px;border:1px solid var(--nd-border);background:transparent;color:var(--nd-text);padding:0 8px}
#workspace{flex:1;display:flex;min-height:0;min-width:0}
#body{min-width:0;min-height:0;background:var(--bg)}
.workspace-panel{width:240px;flex:0 0 240px;border-right:1px solid var(--nd-border);display:flex;flex-direction:column;min-height:0;overflow:hidden;z-index:21}
#plan-properties{width:320px;flex-basis:320px;border-right:0;border-left:1px solid var(--nd-border)}
.workspace-panel>header,#plan-command-dialog>header{height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;border-bottom:1px solid var(--nd-border);flex-shrink:0;font-size:14px}
.workspace-panel button,#plan-command-dialog button,#workspace-more-menu button{font-family:var(--nd-font);color:var(--nd-text);border:1px solid var(--nd-border);background:transparent;border-radius:4px;cursor:pointer}
.panel-collapse{font-size:12px;padding:5px 8px;min-height:28px}
.workspace-panel.collapsed{width:40px;flex-basis:40px}
#plan-properties.collapsed{width:40px;flex-basis:40px}
.workspace-panel.collapsed .panel-content,.workspace-panel.collapsed header>strong{display:none}
.workspace-panel.collapsed>header{padding:0;justify-content:center;height:100%}
.workspace-panel.collapsed .panel-collapse{writing-mode:vertical-rl;padding:8px}
.panel-content{overflow-y:auto;overflow-x:hidden;flex:1;min-height:0;scrollbar-width:thin}
.sheet-handle{display:none}
#workspace-floor-tools{display:flex;flex-wrap:wrap;gap:6px;padding:10px;border-bottom:1px solid var(--nd-border)}
#workspace-floor-tools #floors{width:100%;justify-content:space-between;gap:2px;padding:2px;border-radius:4px}
#workspace-floor-tools .floor{min-width:28px;border-radius:3px}
#copy-below{padding:0 8px;font-size:12px}
.browser-search-row{display:flex;gap:6px;padding:10px}
.browser-search-row input{width:0;min-width:0;flex:1;background:var(--nd-surface-sunken);color:var(--nd-text);border:1px solid var(--nd-border-strong);border-radius:4px;padding:8px;font:12px var(--nd-font)}
.browser-search-row input::placeholder{color:var(--nd-text-muted)}
.browser-search-row button{padding:6px;font-size:12px}
#plan-tree{padding:0 0 12px}
.tree-row{display:flex;align-items:center;gap:2px;min-height:46px;padding:3px 5px 3px calc(6px + min(var(--depth),2)*10px);border-bottom:1px solid var(--nd-border);list-style:none}
.tree-row::-webkit-details-marker{display:none}
summary.tree-row::before{content:'▾';font-size:12px;color:var(--nd-text-muted)}
details:not([open])>summary.tree-row::before{content:'▸'}
.tree-row[aria-selected=true]{background:var(--nd-surface-raised);outline:1px solid var(--nd-selection);outline-offset:-1px}
.tree-pick{display:flex;flex:1;flex-direction:column;min-width:0;align-items:flex-start;padding:3px 0;border:0!important;text-align:left}
.tree-pick span{font-size:12px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tree-pick small{font:10px var(--nd-mono);color:var(--nd-text-muted);margin-top:3px}
.tree-action{font-size:10px;min-height:28px;padding:3px;flex:none}
.tree-action[aria-pressed=true]{color:var(--nd-accent);border-color:var(--nd-border-strong)}
.workspace-empty{font-size:13px;color:var(--nd-text-muted);padding:12px}
#plan-properties .panel-content{padding:12px}
#property-title{font:600 16px var(--nd-font);margin:0 0 12px}
#property-notice{font-size:13px;color:var(--nd-warn);margin:0 0 12px}
#property-notice:empty{display:none}
#plan-properties .fpanel{position:static!important;inset:auto!important;transform:none!important;width:100%!important;max-height:none!important;min-width:0;margin:0;padding:0;box-shadow:none;border:0;border-radius:0;background:transparent;backdrop-filter:none;display:none!important;overflow:visible}
#plan-properties .fpanel.workspace-active{display:block!important}
#plan-properties .fpanel::before{display:none}
#plan-properties .efield label{font-family:var(--nd-font);font-size:12px;line-height:1.4}
#plan-properties #e-name{font:600 14px var(--nd-font)}
#plan-properties .efield input,#plan-properties .efield select{width:100%;min-width:0;font:14px var(--nd-font);min-height:36px;border-radius:4px}
#plan-properties .ebtn{border-radius:4px;min-height:36px}
#plan-properties .ebtn svg{vertical-align:middle;margin-right:6px}
#plan-properties .hint{font:12px/1.6 var(--nd-font);color:var(--nd-text-muted)}
#plan-properties .px{display:none}
#plan-properties #plot-panel>.eh{display:none}
#plan-properties button:disabled,#plan-properties input:disabled,#plan-properties select:disabled{opacity:.55;cursor:default}
#statusbar{position:relative!important;height:28px;min-height:28px;display:flex!important;gap:12px;padding:0 12px;border-top:1px solid var(--nd-border);flex-shrink:0}
#statusbar #info{position:static;transform:none;flex:1;min-width:0;max-width:calc(50% - 70px);background:transparent;border:0;border-radius:0;padding:0;box-shadow:none;backdrop-filter:none;font:12px var(--nd-font);text-align:left}
#statusbar .nd-honesty{position:absolute;left:50%;transform:translateX(-50%);flex:none}
#workspace-save{margin-left:auto}
#statusbar #plan-estimate{min-width:0;flex:0 1 auto;display:inline-flex;align-items:center}#plan-estimate>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#workspace-save,#workspace-units-zoom{font:11px var(--nd-font);color:var(--nd-text-muted);white-space:nowrap}
#workspace-save.save-failed{color:var(--nd-danger)}
#workspace-precision{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:11px}
#workspace-precision .sbt{min-height:27px}
#workspace-precision .sb-toggles{margin-left:0}
#cmdbar{bottom:12px;width:min(400px,80%)}
#zoom{bottom:12px}
#workspace-more-menu{position:fixed;right:12px;top:48px;z-index:110;width:210px;border:1px solid var(--nd-border-strong);padding:6px;border-radius:6px}
#workspace-more-menu[hidden]{display:none}
#workspace-more-menu button{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;padding:8px 10px;text-align:left;margin:2px 0}
#workspace-more-menu #xray-btn .xl{display:inline}
#workspace-more-menu #xray-btn{justify-content:flex-start;min-width:100%}
#plan-command-dialog{width:min(620px,calc(100vw - 24px));max-height:min(650px,85dvh);padding:0;border:1px solid var(--nd-border-strong);border-radius:8px;color:var(--nd-text);box-shadow:none}
#plan-command-dialog::backdrop{background:var(--nd-scrim)}
#plan-command-dialog header button{min-height:32px;padding:4px 10px}
#workspace-command-input{display:block;width:calc(100% - 24px);margin:12px;border:1px solid var(--nd-border-strong);border-radius:4px;padding:12px;background:var(--nd-surface-sunken);color:var(--nd-text);font:14px var(--nd-font)}
#workspace-command-list{max-height:480px;overflow:auto;padding:0 8px 8px}
.workspace-command-row{display:flex;width:100%;align-items:center;gap:12px;padding:10px;border:0!important;text-align:left;min-height:54px}
.workspace-command-row span{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.workspace-command-row strong{font-size:14px;font-weight:500}
.workspace-command-row small{font-size:12px;line-height:1.5;color:var(--nd-text-muted)}
.workspace-command-row kbd{font:10px var(--nd-mono);color:var(--nd-text-muted);max-width:150px;text-align:right;overflow-wrap:anywhere}
.workspace-command-row[aria-selected=true],.workspace-panel button:hover,#workspace-more-menu button:hover{background:var(--nd-surface-raised)}
#plan-phone-bar{display:none}
#app button:focus-visible,#app input:focus-visible,#app select:focus-visible{outline:2px solid var(--nd-focus);outline-offset:-2px}
@media(min-width:768px) and (max-width:1050px){#top .brand span{display:none}#workspace-name{width:100px}#command-search{min-width:160px;font-size:12px}#plan-properties{width:280px;flex-basis:280px}#plan-properties.collapsed{flex-basis:40px;width:40px}}
@media(max-width:767px){
  #top{height:48px;padding:0 6px;gap:4px}
  html[data-nd-bar][data-nd-host="plan"] #top .brand,#top .brand,#top .spacer,#top #undo,#top #redo,#top #menu-btn{display:none}
  #workspace-name{width:0;flex:1;min-width:70px;font-size:14px}
  #command-search{margin:0;min-width:60px;width:60px;height:44px;overflow:hidden;font-size:0;padding:0;display:inline-flex;align-items:center;justify-content:center;text-align:center}
  #command-search::before{content:'Search';font-size:12px;line-height:1}   /* his 6 Oct screenshot: the label sat left in a 44 px box */
  #workspace-more{width:44px;height:44px;padding:0;justify-content:center}
  #workspace-more span{display:none}
  #top #extrude{display:flex;min-height:44px;padding:0 8px;font-size:12px;gap:3px}
  #top #extrude svg{width:16px}
  #ribbon{display:none!important}
  #workspace{display:block;position:relative}
  #body{position:absolute;inset:0;width:100%;height:100%}
  .workspace-panel,.workspace-panel.collapsed,#plan-properties,#plan-properties.collapsed{display:none;position:fixed;bottom:calc(76px + env(safe-area-inset-bottom,0px));left:0;right:0;width:100%;height:48dvh;max-height:calc(100dvh - 130px);border:1px solid var(--nd-border-strong);border-radius:12px 12px 0 0;z-index:80}
  .workspace-panel.sheet-open,#plan-properties.sheet-open{display:flex}
  .workspace-panel.full,#plan-properties.full{height:calc(100dvh - 130px)}
  .workspace-panel.collapsed .panel-content,.workspace-panel.collapsed header>strong{display:block}
  .workspace-panel.collapsed>header{height:44px;padding:0 12px;justify-content:space-between}
  .workspace-panel.collapsed .panel-collapse{writing-mode:horizontal-tb}
  .sheet-handle{display:block;flex:none;width:100%;height:44px;min-height:44px!important;font-size:0;border:0!important;border-radius:0!important;touch-action:none}
  .sheet-handle::before{content:'';display:block;width:40px;height:4px;border-radius:4px;margin:auto;background:var(--nd-text-muted)}
  .panel-collapse{min-height:44px;min-width:44px;font-size:14px}
  #plan-phone-bar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));height:calc(52px + env(safe-area-inset-bottom,0px));flex:none;padding:0 4px env(safe-area-inset-bottom,0px);border-top:1px solid var(--nd-border);gap:4px;z-index:90}
  #plan-phone-bar button{border:0;background:none;color:var(--nd-text);font:12px var(--nd-font);min-height:48px;min-width:44px;padding:0}
  #plan-phone-bar button[aria-expanded=true]{color:var(--nd-accent);background:var(--nd-surface-raised)}
  #statusbar{height:24px;min-height:24px;padding:0 8px;gap:8px}
  #statusbar #info{font-size:11px;max-width:calc(50% - 40px)}
  /* SUITE-136 7c: six items on a 375 px line - the centred honesty label sat on top of the account chip and the
     Estimate; on a phone it takes its place in the row (never hidden), and the hint (cut to a few letters here) goes */
  #statusbar #info{display:none}
  #statusbar .nd-honesty{font-size:10px;padding:0 4px;line-height:16px;position:static;transform:none}
  #workspace-save{display:inline;font-size:10px}
  #workspace-units-zoom{display:none}   /* SUITE-136 7c: units and zoom stay in View; the line has no room for them on a phone */
  #tools{display:none;position:fixed;left:0;right:0;bottom:76px;top:auto;max-width:100%;background:var(--nd-surface);padding:8px;z-index:81;border-top:1px solid var(--nd-border);border-bottom:1px solid var(--nd-border);overflow-x:auto;flex-direction:row;gap:8px;max-height:60px}
  #tools.phone-draw-open{display:flex}
  #tools .tool{min-width:70px;height:44px;width:auto;padding:6px 10px;display:flex;flex-direction:row;gap:6px;border-radius:4px;background:var(--nd-surface-raised);color:var(--nd-text);backdrop-filter:none;flex:none}
  #tools .tool small{font:14px var(--nd-font);color:var(--nd-text)}
  #tools #cadbar,#tools #morebar{position:static;max-height:none;flex-direction:row;flex-wrap:nowrap;gap:8px}
  #plan-browser .tree-row{min-height:52px;gap:8px;padding-left:calc(8px + min(var(--depth),2)*12px)}
  #plan-browser .tree-pick{min-height:44px}
  #plan-browser .tree-pick span{font-size:14px}
  #plan-browser .tree-pick small{font-size:12px}
  #plan-browser .tree-action{min-width:44px;min-height:44px;font-size:12px}
  #plan-browser input,.browser-search-row button{min-height:44px;font-size:14px}
  #workspace-floor-tools .floor,#workspace-floor-tools .tbtn{height:44px;min-width:44px;font-size:14px}
  #plan-properties .efield input,#plan-properties .efield select,#plan-properties .ebtn,#plan-properties .seg button,#plan-properties .road-seg button{min-height:44px;font-size:14px}
  #plan-properties .efield label,#plan-properties .hint{font-size:14px}
  #workspace-more-menu{top:52px}
  #plan-command-dialog header button{min-height:44px}
  #plan-command-dialog .workspace-command-row kbd{max-width:85px}
  #workspace-command-list{max-height:65dvh}
  #cmdbar{display:none}
  #zoom{bottom:12px;right:8px}
  #sug-empty{max-width:calc(100% - 32px)}
  #palette{max-width:calc(100vw - 24px)}
}
@media(prefers-reduced-motion:reduce){#app *{scroll-behavior:auto!important;transition:none!important}}
/* His 5 Oct ask, "no realistic real estate to draw": the ribbon is ONE row (tabs, the tool-set switch, then the
   open tab's tools) instead of three - 119 px down to about 40. Group names are dropped; every tool keeps its label. */
@media (min-width:900px) and (pointer:fine){
  #ribbon{display:flex;align-items:center;gap:6px;padding:3px 8px;min-height:40px;box-sizing:border-box}
  #rtabs{flex:0 0 auto;padding:0;gap:2px}
  #rtabs .rtab{border-radius:6px;padding:6px 10px}
  #rmode{margin-left:6px}
  .rpane{padding:0;scrollbar-width:thin}
  .rpane.on{flex:1 1 auto;min-width:0;align-items:center;border-left:1px solid var(--nd-border)}
  .rgroup{flex-direction:row;align-items:center;gap:3px;padding:0 8px}
  .rlbl{display:none}
}
/* His 6 Oct ask: floor switching on the drawing, top-left, one tap - desktop and phone (44 px targets on touch) */
#plan-floorbar{position:absolute;top:10px;left:10px;z-index:15;display:flex}
#plan-floorbar #floors{background:var(--nd-surface);border:1px solid var(--nd-border-strong);border-radius:8px;padding:3px;gap:2px;box-shadow:0 1px 4px rgba(0,0,0,.14)}
#plan-floorbar .floor{min-width:36px;height:32px;padding:0 8px;border:1px solid transparent;border-radius:6px;background:transparent;font:600 13px var(--nd-font);color:var(--nd-text-muted)}
#plan-floorbar .floor.active{background:var(--gold);color:#fff}
@media (max-width:767px),(pointer:coarse){#plan-floorbar{top:8px;left:8px}#plan-floorbar .floor{min-width:44px;height:44px;font-size:14px}}
/* His 6 Oct phone review: the status-line chips (account, Estimate) stay 22 px to the eye but take a 44 px touch */
@media (pointer:coarse){#statusbar :is(#plan-cloud,#plan-estimate){position:relative}#statusbar :is(#plan-cloud,#plan-estimate)::after{content:'';position:absolute;left:0;right:0;top:-11px;bottom:-11px}}
/* His 6 Oct ask: a small pencil after the plan name says it can be renamed (44 px touch on phones) */
#workspace-name-edit{flex:none;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;margin-left:-6px;padding:0;border:0;border-radius:4px;background:transparent;color:var(--nd-text-muted);cursor:pointer}
#workspace-name-edit svg{width:15px;height:15px}
#workspace-name-edit:hover,#workspace-name-edit:focus-visible{color:var(--nd-text);background:var(--nd-surface-raised)}
@media (max-width:767px),(pointer:coarse){#workspace-name-edit{width:44px;height:44px;margin-left:-8px}#workspace-name-edit svg{width:17px;height:17px}}

/* SUITE-110 sweep (8 Oct): phone targets under the 44 px floor - the zoom buttons (40), the plan name field (35) and the welcome skip (37) */
@media (max-width:767px),(pointer:coarse){.zbtn{width:44px;height:44px}#workspace-name{min-height:44px;box-sizing:border-box}.wskip{min-height:44px}}

/* SUITE-144: readable plan previews and direct view shortcuts. */
#ribbon-shortcuts{display:flex;gap:4px;margin-left:8px;flex:none}
#workspace-more-menu #ribbon-shortcuts{display:flex;flex-direction:column;margin:0}
.rshortcut{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:6px 10px;border:1px solid var(--nd-border-strong);border-radius:6px;background:var(--nd-surface-raised);color:var(--nd-text);font:600 13px var(--nd-font);cursor:pointer;white-space:nowrap}
.rshortcut svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8}
.rshortcut:hover{border-color:var(--nd-accent)}
#xray-btn .xl{display:inline;margin:0}
#tpl-panel{width:min(560px,calc(100% - 24px));box-sizing:border-box;background:var(--nd-surface);border-color:var(--nd-border-strong);backdrop-filter:none}
#tpl-panel .pt{font:700 16px var(--nd-font)}
#tpl-panel .hint{font:12px/1.5 var(--nd-font);color:var(--nd-text-muted)}
#tpl-panel .tpl-honesty{margin:0 0 12px}
#tpl-panel .sug-card{align-items:center;background:var(--nd-accent);color:var(--nd-on-accent);border:0;border-radius:8px;padding:12px;margin:0 0 12px;min-height:64px}
#tpl-panel .sug-card .tnm{font:700 15px var(--nd-font)}
#tpl-panel .sug-card .tds{display:block;color:var(--nd-on-accent);font:12px/1.5 var(--nd-font);margin-top:4px}
#tpl-filters{display:flex;gap:12px;margin-bottom:12px}
#tpl-filters[hidden],#tpl-empty[hidden],.tpl-card[hidden]{display:none}
#tpl-filters label{display:flex;align-items:center;gap:6px;font:12px var(--nd-font);color:var(--nd-text)}
#tpl-filters select{min-height:36px;padding:4px 8px;min-width:64px;border:1px solid var(--nd-border-strong);border-radius:4px;background:var(--nd-surface-raised);color:var(--nd-text)}
#tpl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.tpl-card{border:1px solid var(--nd-border-strong);border-radius:8px;overflow:hidden;background:var(--nd-surface-raised)}
#tpl-panel .tpl-load{display:flex;flex-direction:column;gap:9px;border:0;border-radius:0;margin:0;padding:12px;background:transparent;color:var(--nd-text)}
#tpl-panel .tpl-load:hover,#tpl-panel .tpl-load:focus-visible{background:var(--nd-surface)}
#tpl-panel .tpl-load .tnm{font:700 14px/1.3 var(--nd-font)}
.tpl-preview{display:block;width:100%;height:112px;background:var(--nd-surface-sunken);border-radius:4px}
.tpl-room{fill:var(--nd-surface-raised);stroke:var(--nd-text-muted);stroke-width:1;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.tpl-room-bed{fill:var(--nd-surface);stroke:var(--nd-text)}
.tpl-room-toilet{fill:var(--nd-border-strong)}
.tpl-room-open,.tpl-room-garden,.tpl-room-tree{fill:var(--nd-surface-sunken)}
.tpl-facts{display:flex;flex-wrap:wrap;gap:4px;font:11px/1.4 var(--nd-font)}
.tpl-facts>span{border:1px solid var(--nd-border);border-radius:4px;padding:3px 5px}
.tpl-fit{font:12px var(--nd-font);color:var(--nd-text-muted)}
.tpl-card details{border-top:1px solid var(--nd-border);font:12px/1.5 var(--nd-font);color:var(--nd-text-muted)}
.tpl-card summary{padding:8px 12px;cursor:pointer;color:var(--nd-text);min-height:36px;box-sizing:border-box}
.tpl-card details p{padding:0 12px 12px;margin:0}
@media(max-width:767px){
  #workspace-more-menu #xray-btn{width:100%;padding:8px 10px;gap:8px}
  #tpl-grid{grid-template-columns:minmax(0,1fr)}
  #tpl-panel{width:100%;max-height:calc(100% - 12px)}
  #tpl-filters{gap:8px}
  #tpl-filters label{flex:1;flex-direction:column;align-items:stretch}
  #tpl-filters select,.tpl-card summary{min-height:44px}
  .tpl-preview{height:128px}
}
@media(pointer:coarse){.rshortcut,#tpl-filters select,.tpl-card summary{min-height:44px}}