:root{
    --ink:#1c231f; --ink-faint:#6b756e; --surface:#fff; --bg:#f4f5f3;
    --line:#e2e5e0; --accent:#2f6f5e; --accent-ink:#fff;
  }
  *{box-sizing:border-box;}
  html,body{height:100%; margin:0;}
  body{
    font-family:'Public Sans',system-ui,sans-serif; color:var(--ink); background:var(--bg);
    display:flex; flex-direction:column;
  }
  h1,h2{font-family:'Fraunces',serif; font-weight:600; margin:0;}
  header{
    background:var(--surface); border-bottom:1px solid var(--line); padding:14px 20px;
    display:flex; align-items:center; justify-content:space-between; gap:16px; flex-shrink:0;
  }
  .brand{display:flex; align-items:center; gap:12px;}
  .brand-mark{
    width:34px; height:34px; border-radius:9px; background:var(--accent); color:var(--accent-ink);
    display:flex; align-items:center; justify-content:center; font-family:'Fraunces',serif; font-weight:600; font-size:15px;
  }
  .brand-text{display:flex; flex-direction:column; line-height:1.2;}
  .brand-text .name{font-family:'Fraunces',serif; font-weight:600; font-size:16px;}
  .brand-text .sub{font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-faint);}
  .session{display:flex; align-items:center; gap:14px; font-size:14px;}
  .session .whoami{display:flex; flex-direction:column; line-height:1.25; text-align:right;}
  .session .whoami .role-line{font-weight:600;}
  .session .whoami .viewing-line{font-size:12px; color:var(--ink-faint);}
  button{
    font-family:inherit; font-size:14px; font-weight:600; border-radius:8px; cursor:pointer; border:1px solid var(--line);
    background:var(--surface); color:var(--ink); padding:8px 14px;
  }
  button.primary{background:var(--accent); border-color:var(--accent); color:var(--accent-ink); width:100%;}
  [hidden]{display:none !important;}

  /* ---- login ---- */
  #loginView{flex:1; display:flex; align-items:center; justify-content:center; padding:24px;}
  .login-card{
    background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:32px;
    width:100%; max-width:360px;
  }
  .login-card h1{font-size:22px; margin-bottom:6px;}
  .login-wrap{display:flex; align-items:center; gap:56px; width:100%; max-width:960px;}
  .login-pitch{flex:1; min-width:0;}
  .login-pitch h2{font-size:34px; line-height:1.15; margin-bottom:14px;}
  .login-pitch .pitch-lead{font-size:16px; line-height:1.55; color:var(--ink); margin:0 0 22px;}
  .pitch-points{list-style:none; padding:0; margin:0 0 24px;}
  .pitch-points li{position:relative; padding-left:22px; margin-bottom:14px; font-size:14px; line-height:1.5; color:var(--ink-faint);}
  .pitch-points li::before{content:""; position:absolute; left:0; top:6px; width:10px; height:10px; border-radius:3px; background:var(--accent);}
  .pitch-points strong{color:var(--ink); font-weight:600;}
  .pitch-contact{font-size:14px; color:var(--ink-faint); margin:0;}
  .pitch-contact a{color:var(--accent); font-weight:600;}
  .login-wrap .login-card{flex:none;}
  @media (max-width:820px){
    .login-wrap{flex-direction:column; align-items:stretch; gap:28px;}
    .login-pitch h2{font-size:26px;}
    .login-wrap .login-card{max-width:none; order:-1;} /* returning users sign in without scrolling */
  }
  .login-card p{color:var(--ink-faint); font-size:14px; margin:0 0 20px;}
  label{display:block; font-size:12px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:6px;}
  input{
    width:100%; padding:10px 12px; border:1px solid var(--line); border-radius:8px; font-size:15px;
    font-family:inherit; margin-bottom:16px; background:var(--bg);
  }
  #loginError{color:#b3413a; font-size:13px; min-height:18px; margin-top:6px;}

  /* ---- map view ---- */
  #mapView{flex:1; display:flex; flex-direction:column; min-height:0;}
  #portfolioStats{
    display:flex; gap:24px; padding:10px 20px; background:var(--surface); border-bottom:1px solid var(--line);
    flex-shrink:0; flex-wrap:wrap;
  }
  .pstat{display:flex; flex-direction:column; line-height:1.2;}
  .pstat-value{font-family:'IBM Plex Mono',ui-monospace,monospace; font-weight:600; font-size:19px;}
  .pstat-label{font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-faint);}
  /* Vacant (2026-10-03): a stat that is also a button -- turns on the "Vacant units" filter. */
  .pstat-btn{background:none; border:0; padding:0; margin:0; text-align:left; font:inherit; color:inherit; cursor:pointer; align-items:flex-start;}
  .pstat-btn:hover .pstat-label, .pstat-btn:focus-visible .pstat-label{color:var(--accent); text-decoration:underline;}
  .pstat-btn.on .pstat-label{color:var(--accent);}
  .pstat-sub{font-size:11px; color:var(--ink-faint);}
  #mapBody{flex:1; display:flex; min-height:0;}
  #sidebar{
    width:260px; flex-shrink:0; background:var(--surface); border-right:1px solid var(--line);
    overflow-y:auto; padding:16px;
  }
  #sidebar h2{font-size:14px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-faint); margin-bottom:10px;}
  .layer-toggle{display:flex; align-items:center; gap:8px; font-size:13px; margin-bottom:8px; cursor:pointer;}
  /* Floating Layers widget (top-right, under the measure-tool button) --
     reuses .measure-toolbar's card chrome but lays its checkboxes out in a
     column instead of a row, and needs a touch more breathing room. */
  .layer-toggle-panel{flex-direction:column; align-items:flex-start; padding:10px 12px;}
  .layer-toggle-panel .layer-toggle{margin-bottom:6px;}
  .layer-toggle-panel .layer-toggle:last-child{margin-bottom:0;}
  .layer-toggle input{width:auto; margin:0;}
  #clientSection{margin-bottom:20px; padding-bottom:16px; border-bottom:1px solid var(--line);}
  #clientSelect{
    width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:8px; font-size:13px;
    font-family:inherit; background:var(--bg); color:var(--ink);
  }
  .bookmark-btn{
    display:block; width:100%; text-align:left; background:var(--bg); border:1px solid var(--line);
    border-radius:8px; padding:10px 12px; margin-bottom:8px; font-size:13px; cursor:pointer;
  }
  .bookmark-btn:hover{border-color:var(--accent);}
  .bookmark-btn .b-name{display:block; font-weight:600; margin-bottom:2px;}
  .bookmark-btn .b-addr{display:block; color:var(--ink-faint); font-size:12px;}
  .bookmark-btn.active{border-color:var(--accent); background:#eaf2ef;}
  .bookmark-btn.muted{opacity:.45;}
  .bookmark-btn.muted.active{opacity:.7;}
  .bookmark-btn .b-flag{display:block; margin-top:4px; font-size:11px; font-weight:600; color:#a7671e;}
  /* "All properties" (2026-10-03): back to nothing picked; set apart from the buildings below it. */
  .bookmark-btn.bookmark-all{margin-bottom:14px; border-style:dashed;}
  .bookmark-btn.bookmark-all.active{border-style:solid;}
  #floorSection{margin-bottom:20px; padding-bottom:16px; border-bottom:1px solid var(--line);}
  #floorButtons{display:flex; flex-wrap:wrap; gap:6px;}
  #floorButtons p{font-size:12px; color:var(--ink-faint); margin:0;}
  .floor-btn{
    background:var(--bg); border:1px solid var(--line); border-radius:6px; padding:6px 10px; font-size:12px;
  }
  .floor-btn.active{background:var(--accent); border-color:var(--accent); color:var(--accent-ink);}
  #workOrderSection{margin-top:20px; padding-top:16px; border-top:1px solid var(--line);}
  #workOrderTabs{display:flex; gap:6px; margin-bottom:10px;}
  .wo-tab{background:var(--bg); border:1px solid var(--line); border-radius:6px; padding:6px 10px; font-size:12px;}
  .wo-tab.active{background:var(--accent); border-color:var(--accent); color:var(--accent-ink);}
  #workOrderList p{font-size:12px; color:var(--ink-faint); margin:0;}
  .wo-item{background:var(--bg); border:1px solid var(--line); border-left:4px solid var(--line); border-radius:8px; padding:9px 11px; margin-bottom:8px;}
  /* Left-border color-codes each item by the level it's attached at,
     reusing the same hex colors as that level's map-layer labels so the
     sidebar and the map read as one consistent color language. */
  .wo-item.wo-level-structure{border-left-color:#1c2530;}
  .wo-item.wo-level-floor{border-left-color:#2c4570;}
  .wo-item.wo-level-unit{border-left-color:#1d4a3e;}
  .wo-item.wo-level-room{border-left-color:#7a4c17;}
  .wo-item .wo-top{display:flex; justify-content:space-between; align-items:center; gap:6px; font-size:12.5px; font-weight:600; margin-bottom:4px;}
  .wo-item .wo-badges{display:flex; align-items:center; gap:4px; flex-shrink:0;}
  .wo-item .wo-desc{font-size:12px; margin-bottom:4px;}
  .wo-item .wo-meta{color:var(--ink-faint); font-size:11px;}
  .wo-item .wo-vendors{font-size:11px; margin-top:4px; color:var(--accent);}
  .wo-item .wo-vendors.wo-vendors-none{color:var(--ink-faint); font-style:italic;}
  .wo-status{font-size:10px; font-weight:700; padding:2px 7px; border-radius:999px; text-transform:uppercase; white-space:nowrap;}
  .wo-status-rep{background:#fbeedd; color:#a7671e;}
  .wo-status-wip{background:#e4efec; color:#1d4a3e;}
  .wo-status-hld{background:#f3e7e1; color:#8a5a46;}
  .wo-status-cmp{background:#e3f3ea; color:#2f7d5a;}
  .wo-severity{font-size:10px; font-weight:700; padding:2px 7px; border-radius:999px; text-transform:uppercase; white-space:nowrap;}
  .wo-sev-critical{background:#fbe1df; color:#b3271f;}
  .wo-sev-high{background:#fdece0; color:#b3591b;}
  .wo-sev-medium{background:#fdf6d9; color:#8a6d00;}
  .wo-sev-low{background:#e7f0e9; color:#3f7a53;}
  .wo-actions-row{display:flex; gap:6px; margin-top:6px;}
  .wo-actions-row button{flex:1;}
  .wo-edit-btn{font-size:11px; padding:6px 8px;}
  .wo-complete-btn{
    background:var(--accent); border-color:var(--accent); color:var(--accent-ink);
    font-size:11px; padding:6px 8px;
  }
  .wo-edit-form label{font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-faint); display:block; margin:8px 0 4px;}
  .wo-edit-form label:first-child{margin-top:0;}
  .wo-edit-form .wo-loc{display:flex; gap:6px;}
  .wo-edit-form .wo-loc select{flex:1; min-width:0;}
  .wo-edit-form .wo-loc .wo-loc-level{flex:0 0 38%;}
  .wo-edit-form input, .wo-edit-form select, .wo-edit-form textarea{
    width:100%; padding:7px 9px; border:1px solid var(--line); border-radius:6px; font-size:12.5px;
    font-family:inherit; background:var(--surface); color:var(--ink); resize:vertical;
  }
  .wo-edit-form .mini-actions{display:flex; gap:8px; justify-content:flex-end; margin-top:8px;}
  .wo-edit-form .mini-actions button{padding:6px 10px; font-size:12px;}
  .wo-edit-form .mini-error{color:#b3413a; font-size:11px; min-height:14px; margin-top:4px;}
  .section-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px;}
  .section-head h2{margin-bottom:0;}
  .add-btn{background:var(--bg); border:1px solid var(--line); border-radius:6px; padding:4px 9px; font-size:11px; font-weight:600;}
  .mini-form{margin-top:10px; padding-top:10px; border-top:1px dashed var(--line);}
  .mini-form label{font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-faint); display:block; margin:8px 0 4px;}
  .mini-form input, .mini-form select, .mini-form textarea{
    width:100%; padding:7px 9px; border:1px solid var(--line); border-radius:6px; font-size:12.5px;
    font-family:inherit; background:var(--bg); color:var(--ink); resize:vertical;
  }
  .mini-actions{display:flex; gap:8px; justify-content:flex-end; margin-top:8px;}
  .mini-actions button{padding:6px 10px; font-size:12px;}
  .mini-error{color:#b3413a; font-size:11px; min-height:14px; margin-top:4px;}
  #mepSection{margin-top:20px; padding-top:16px; border-top:1px solid var(--line);}
  .scope-label{
    font-size:11px; font-weight:600; color:var(--accent); background:var(--accent-soft, #eaf2ef);
    border-radius:6px; padding:4px 8px; margin:0 0 10px; display:inline-block;
  }
  #mepList p{font-size:12px; color:var(--ink-faint); margin:0;}
  .mep-item{background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:9px 11px; margin-bottom:8px; font-size:12px;}
  .mep-item .mep-top{font-weight:600; margin-bottom:2px;}
  .mep-item .mep-meta{color:var(--ink-faint); font-size:11px;}
  .mep-target{font-size:12px; font-weight:600; padding:7px 9px; margin-bottom:8px; border-radius:6px; background:#e4efec; color:#1d4a3e;}
  .mep-target.mep-target-none{background:#fbeedd; color:#a7671e; font-weight:400;}
  #mapContainer{flex:1; position:relative;}
  #mapStatus{
    position:absolute; top:12px; left:12px; z-index:10; background:var(--surface); border:1px solid var(--line);
    border-radius:8px; padding:8px 12px; font-size:13px; color:var(--ink-faint);
  }
  #editPanel{
    position:absolute; top:12px; right:12px; z-index:20; width:280px;
    background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:16px;
    box-shadow:0 4px 16px rgba(0,0,0,.15);
  }
  #editPanel .edit-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;}
  #editPanel .edit-head h3{font-size:14px;}
  #editPanel .edit-close{background:none; border:none; padding:0; font-size:18px; line-height:1; cursor:pointer; color:var(--ink-faint);}
  #editPanel label{font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-faint); display:block; margin-bottom:4px;}
  #editPanel input, #editPanel select, #editPanel textarea{
    width:100%; padding:7px 9px; border:1px solid var(--line); border-radius:6px; font-size:13px;
    font-family:inherit; margin-bottom:10px; background:var(--bg); color:var(--ink); resize:vertical;
  }
  #editPanel input:disabled{color:var(--ink-faint);}
  .edit-actions{display:flex; gap:8px; justify-content:flex-end;}
  .edit-actions button{padding:7px 12px; font-size:13px;}
  #editUnitError{color:#b3413a; font-size:12px; min-height:16px; margin-bottom:4px;}
  #editUnitSaved{color:#2f7d5a; font-size:12px; min-height:16px; margin-bottom:4px;}
  .active-tool{background:var(--accent) !important; color:var(--accent-ink) !important;}
  .measure-toolbar{
    display:flex; gap:4px; background:var(--surface); border:1px solid var(--line); border-radius:8px;
    padding:4px; margin-bottom:6px; box-shadow:0 1px 2px rgba(0,0,0,.15);
  }
  .measure-tool-btn{background:var(--bg); border:1px solid var(--line); border-radius:6px; padding:6px 10px; font-size:12px;}

  #headerActions{display:flex; align-items:center; gap:10px;}
  /* App controls mean nothing before sign-in -- hide them until a session
     loads (main.js removes .logged-out in initMap). */
  body.logged-out #headerActions{display:none;}


  /* ---- header unit/client search ---- */
  #unitSearchWrap{position:relative;}
  #unitSearchInput{
    width:230px; padding:7px 10px; border:1px solid var(--line); border-radius:8px; font-size:12.5px;
    font-family:inherit; background:var(--bg); color:var(--ink); margin:0;
  }
  #unitSearchInput:focus{outline:2px solid var(--accent); outline-offset:1px;}
  #unitSearchResults{
    position:absolute; top:calc(100% + 6px); left:0; z-index:40; width:300px; max-height:340px;
    overflow-y:auto; background:var(--surface); border:1px solid var(--line); border-radius:10px;
    box-shadow:0 8px 24px rgba(0,0,0,.14); padding:6px;
  }
  .unit-search-result{
    display:block; width:100%; text-align:left; padding:8px 10px; border-radius:6px; border:none;
    background:none; cursor:pointer; font-size:13px; font-weight:400;
  }
  .unit-search-result:hover{background:var(--bg);}
  .unit-search-result .usr-main{display:block; font-weight:600;}
  .unit-search-result .usr-sub{display:block; font-size:11px; color:var(--ink-faint); margin-top:2px;}
  .usr-empty{padding:8px 10px; font-size:12px; color:var(--ink-faint);}

  /* ---- layout guide dropdown ---- */
  #layoutGuideWrap{position:relative;}
  #layoutGuideBtn{
    display:flex; align-items:center; gap:6px; background:var(--bg); border:1px solid var(--line);
    color:var(--ink-faint); font-size:12.5px; font-weight:600; padding:7px 12px;
  }
  #layoutGuideBtn:hover{border-color:var(--accent); color:var(--accent);}
  #layoutGuideBtn .caret{font-size:10px; transition:transform .15s ease;}
  #layoutGuideBtn.open .caret{transform:rotate(180deg);}
  #layoutGuidePanel{
    position:absolute; top:calc(100% + 8px); left:0; z-index:30; width:360px; max-width:calc(100vw - 40px);
    background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:18px 20px;
    box-shadow:0 8px 24px rgba(0,0,0,.14);
  }
  #layoutGuidePanel h3{font-size:14px; margin-bottom:4px;}
  #layoutGuidePanel .lg-sub{font-size:12px; color:var(--ink-faint); margin:0 0 14px;}
  .lg-chain{list-style:none; margin:0 0 16px; padding:0; border-left:2px solid var(--line); padding-left:14px;}
  .lg-chain li{position:relative; margin-bottom:12px;}
  .lg-chain li::before{
    content:""; position:absolute; left:-18px; top:5px; width:8px; height:8px; border-radius:50%;
    background:var(--accent); border:2px solid var(--surface); box-shadow:0 0 0 2px var(--accent);
  }
  .lg-chain li:last-child{margin-bottom:0;}
  .lg-term{font-weight:600; font-size:13px; display:block;}
  .lg-def{font-size:12px; color:var(--ink-faint); margin-top:2px; line-height:1.45;}
  .lg-related{border-top:1px dashed var(--line); padding-top:12px;}
  .lg-whats-new{margin:12px 0 0; padding-top:10px; border-top:1px dashed var(--line); font-size:13px;}
  .lg-whats-new a{color:var(--accent); font-weight:600; text-decoration:none;}
  .lg-whats-new a:hover{text-decoration:underline;}
  .lg-related h4{font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-faint); margin:0 0 8px; font-family:inherit; font-weight:600;}
  .lg-related dl{margin:0; display:grid; grid-template-columns:auto 1fr; gap:4px 10px;}
  .lg-related dt{font-size:12px; font-weight:600; white-space:nowrap;}
  .lg-related dd{font-size:12px; color:var(--ink-faint); margin:0;}

  /* ---- reports modal ---- */
  .modal-overlay{
    position:fixed; inset:0; background:rgba(28,35,31,.4); z-index:50;
    display:flex; align-items:center; justify-content:center; padding:24px;
  }
  .modal-card{
    background:var(--surface); border-radius:14px; padding:20px 24px; width:100%; max-width:760px;
    max-height:80vh; overflow-y:auto; box-shadow:0 12px 32px rgba(0,0,0,.22);
  }
  /* The title bar (with its close button) stays pinned while a long window
     scrolls -- John: "the x scrolls away". Negative margins pull it over the
     card's padding so nothing shows through above it. */
  .modal-head{
    display:flex; justify-content:space-between; align-items:center;
    position:sticky; top:-20px; z-index:5;
    margin:-20px -24px 14px; padding:20px 24px 10px;
    background:var(--surface); border-bottom:1px solid var(--line); border-radius:14px 14px 0 0;
  }
  .modal-head h3{font-size:16px;}
  .modal-controls{display:flex; align-items:center; gap:8px; margin-bottom:14px;}
  .modal-controls label{font-size:12px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-faint); margin:0;}
  .modal-controls select{
    width:auto; padding:6px 10px; border:1px solid var(--line); border-radius:6px; font-size:13px;
    font-family:inherit; background:var(--bg); color:var(--ink);
  }

  /* ---- stacking plan modal ---- */
  .stk-card{max-width:960px;}
  .stk-modes{display:flex; gap:6px; margin-left:auto; flex-wrap:wrap;}
  .stk-modes button{font-size:12px; padding:5px 10px;}
  .stk-modes button.active{background:var(--accent); color:var(--accent-ink); border-color:var(--accent);}
  .stk-row{display:flex; align-items:stretch; gap:10px; margin-bottom:4px;}
  .stk-label{width:64px; flex:none; display:flex; align-items:center; font-size:12px; color:var(--ink-faint);}
  .stk-bar{flex:1; display:flex; gap:2px; min-width:0;}
  .stk-unit{
    min-width:0; min-height:48px; padding:6px 8px; border:none; border-radius:5px;
    display:flex; flex-direction:column; justify-content:center; align-items:flex-start; text-align:left;
    font-size:12px; font-weight:400; line-height:1.3; overflow:hidden; white-space:nowrap;
  }
  .stk-unit b, .stk-unit span{max-width:100%; overflow:hidden; text-overflow:ellipsis;}
  .stk-unit b{font-weight:600;}
  .stk-unit:hover{outline:2px solid currentColor; outline-offset:-2px;}
  .stk-legend{display:flex; gap:14px; flex-wrap:wrap; margin-top:14px; font-size:12px; color:var(--ink-faint);}
  .stk-legend > span{display:flex; align-items:center; gap:6px;}
  .stk-swatch{width:12px; height:12px; border-radius:3px; border:1px solid rgba(0,0,0,.12);}
  .stk-tip{margin-top:8px; min-height:18px; font-size:12px; color:var(--ink-faint); white-space:pre-line;}

  /* Header never wraps text: the brand, every button, and the signed-in
     name stay on one line. As the window narrows, the four toolbar
     buttons drop to icon-only (their title attribute shows the label on
     hover), then the search box shrinks. */
  header{flex-wrap:nowrap; min-width:0;}
  .brand, .brand-text .name, .brand-text .sub{white-space:nowrap;}
  .brand{flex-shrink:0;}
  #headerActions{flex-shrink:0;}
  #headerActions button, #logoutBtn, #layoutGuideBtn{white-space:nowrap; flex-shrink:0;}
  .hdr-btn{display:inline-flex; align-items:center; gap:6px;}
  .session{flex-shrink:0;}
  .session .whoami .role-line{white-space:nowrap; max-width:220px; overflow:hidden; text-overflow:ellipsis;}
  .session .whoami .viewing-line:empty{display:none;}
  /* Was 1500: with seven buttons the labels overflowed up to ~1800 px. */
  @media (max-width:1840px){
    .hdr-btn .hdr-label{display:none;}
    .hdr-btn{padding:8px 10px; font-size:16px;}
  }
  /* 1250 (was 1150) and the 1100 step: the Safety & Systems button
     (2026-10-02) pushed the header past the edge at 1024-1200 px. */
  @media (max-width:1250px){
    #unitSearchInput{width:150px;}
    #layoutGuideBtn .lg-long{display:none;}
    .brand-text .sub{display:none;}
    .session .whoami .role-line{max-width:140px;}
  }
  @media (max-width:1100px){
    .hdr-btn{padding:7px 7px;}
    #unitSearchInput{width:120px;}
    .session .whoami .role-line{max-width:110px;}
  }

  /* ---- admin usage panel ---- */
  .hdr-btn[hidden]{display:none;}
  .usage-modal-card{max-width:620px;}
  .usage-updated{font-size:12px; color:var(--ink-faint); margin-right:auto;}
  #usageRefresh{font-size:12px; padding:5px 10px;}
  .usage-card{border:1px solid var(--line); border-radius:10px; padding:14px 16px; margin-bottom:12px;}
  .usage-card h4{margin:0 0 2px; font-size:14px;}
  .usage-note{margin:0 0 10px; font-size:11.5px; color:var(--ink-faint);}
  .usage-row{margin-bottom:10px;}
  .usage-row-head{display:flex; justify-content:space-between; gap:12px; font-size:13px;}
  .usage-val{font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--ink); white-space:nowrap;}
  .usage-bar{height:7px; border-radius:4px; background:var(--bg); border:1px solid var(--line); margin-top:5px; overflow:hidden;}
  .usage-fill{height:100%; border-radius:4px;}
  .usage-green{background:#2f7d5a;}
  .usage-amber{background:#d49a2a;}
  .usage-red{background:#b3413a;}
  .usage-unavailable{font-size:12px; color:#a7671e; margin:4px 0 8px;}
  .usage-link{font-size:12.5px; color:var(--accent); font-weight:600;}

/* ---- building edit (god mode) ---- */
.bookmark-row{display:flex; gap:6px; align-items:stretch; margin-bottom:8px;}
.bookmark-row .bookmark-btn{margin-bottom:0; flex:1; min-width:0;}
.bookmark-edit{
  flex:none; width:32px; background:var(--bg); border:1px solid var(--line); border-radius:8px;
  font-size:14px; cursor:pointer; color:var(--ink-faint); padding:0;
}
.bookmark-edit:hover{border-color:var(--accent); color:var(--ink);}
.building-card{max-width:560px;}
.building-note{font-size:12px; color:var(--ink-faint); margin:-6px 0 12px;}
.building-form{display:grid; grid-template-columns:repeat(4, 1fr); gap:0 12px;}
.building-form .bf-field{grid-column:span 2;}
.building-form .bf-narrow{grid-column:span 1;}
.building-form .bf-wide{grid-column:1 / -1;}
.building-form label{font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-faint); display:block; margin:8px 0 4px;}
.building-form input, .building-form textarea, .building-form select{
  width:100%; padding:7px 9px; border:1px solid var(--line); border-radius:6px; font-size:13px;
  font-family:inherit; background:var(--bg); color:var(--ink); resize:vertical;
}
.bf-saved{color:#2f7d5a; font-size:12px; min-height:14px;}
@media (max-width:520px){
  .building-form .bf-field, .building-form .bf-narrow{grid-column:1 / -1;}
}

/* ---- work order update log ---- */
.wo-updates-btn{font-size:11px; padding:6px 8px;}
.wo-updates-btn.open{border-color:var(--accent); background:#eaf2ef;}
.wo-updates{margin-top:10px; padding-top:10px; border-top:1px dashed var(--line);}
.wo-update-form textarea, .wo-complete-prompt textarea{
  width:100%; padding:7px 9px; border:1px solid var(--line); border-radius:6px; font-size:12.5px;
  font-family:inherit; background:var(--surface); color:var(--ink); resize:vertical;
}
.wo-update-row{display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:6px;}
.wo-update-row select{
  flex:1 1 200px; min-width:0; padding:6px 8px; border:1px solid var(--line); border-radius:6px;
  font-size:12px; font-family:inherit; background:var(--surface); color:var(--ink);
}
.wo-internal{font-size:12px; color:var(--ink-faint); display:flex; align-items:center; gap:4px; white-space:nowrap; cursor:pointer;}
.wo-update-row .wo-update-add{width:auto; font-size:12px; padding:6px 12px;}
.wo-timeline{list-style:none; margin:10px 0 0; padding:0 0 0 14px; border-left:2px solid var(--line);}
.wo-timeline li{position:relative; padding:0 0 10px 4px;}
.wo-timeline li::before{
  content:""; position:absolute; left:-20px; top:4px; width:10px; height:10px; border-radius:50%;
  background:var(--surface); border:2px solid var(--accent);
}
.wo-timeline li.wo-tl-origin::before{border-color:var(--ink-faint);}
.wo-tl-head{font-size:11px; color:var(--ink-faint); display:flex; align-items:center; gap:6px; flex-wrap:wrap;}
.wo-tl-status{font-size:12px; font-weight:600;}
.wo-tl-note{font-size:12.5px; white-space:pre-wrap; overflow-wrap:anywhere;}
.wo-tl-shared{font-size:10px; font-weight:700; text-transform:uppercase; padding:1px 6px; border-radius:999px; background:#e4efec; color:#1d4a3e;}
.wo-complete-prompt{margin-top:8px;}
.wo-complete-prompt label{font-size:11px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-faint); display:block;}
.wo-complete-prompt label textarea{margin-top:4px; text-transform:none; letter-spacing:normal;}
.wo-complete-prompt .mini-actions button{width:auto;}
.wo-update-row .wo-internal{text-transform:none; letter-spacing:normal; margin:0; font-size:12px;}
.wo-update-row .wo-internal input{width:auto; margin:0;}
.wo-complete-heading{font-size:12.5px; font-weight:700; margin-bottom:6px;}
.wo-vendor-select{
  width:100%; margin-top:6px; padding:6px 8px; border:1px solid var(--line); border-radius:6px;
  font-size:12px; font-family:inherit; background:var(--surface); color:var(--ink);
}
.wo-item .wo-vendors.wo-assigned{font-weight:600;}

/* ---- reports: open work orders ---- */
.reports-card{max-width:1180px;}
.reports-controls{flex-wrap:wrap; row-gap:8px;}
.reports-controls .rpt-openwo-only{display:inline-flex; align-items:center; gap:8px;}
.reports-controls .rpt-openwo-only[hidden]{display:none;}
.reports-controls .rpt-client-filter{display:inline-flex; align-items:center; gap:8px;}
.reports-controls .rpt-client-filter[hidden]{display:none;}
.reports-actions{margin-left:auto; display:inline-flex; gap:6px;}
.reports-actions button{font-size:12px; padding:6px 10px;}
.reports-summary{font-size:12px; color:var(--ink-faint); margin:-6px 0 10px;}
.report-table{width:100%; border-collapse:collapse; font-size:12.5px;}
.report-table th, .report-table td{text-align:left; padding:7px 8px; border-bottom:1px solid var(--line); vertical-align:top;}
.report-table th{font-size:11px; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-faint); font-weight:600; white-space:nowrap;}
.report-table td{white-space:normal; overflow-wrap:anywhere;}
.report-table td.rpt-tight{white-space:nowrap;}
.report-table td.rpt-last{min-width:200px; color:var(--ink-faint); font-size:12px;}
.report-table .rpt-desc{color:var(--ink-faint); font-size:11.5px;}
.report-table tr.rpt-group td{background:var(--bg); font-weight:700; font-size:12px; padding-top:12px;}
.report-table tr.rpt-old td.rpt-days{color:#b3413a; font-weight:700;}
.rpt-sev-critical{color:#b3271f; font-weight:700;}
.rpt-sev-high{color:#b3591b; font-weight:600;}

/* Print only the report. */
@media print {
  body.printing-report > *:not(#reportsModal){display:none !important;}
  body.printing-report #reportsModal{position:static; background:none; padding:0; display:block;}
  body.printing-report #reportsModal .modal-card{max-width:none; max-height:none; overflow:visible; box-shadow:none; padding:0;}
  body.printing-report .edit-close, body.printing-report .reports-controls{display:none !important;}
  body.printing-report .modal-head{position:static; margin:0 0 14px; padding:0; border:none;}
  body.printing-report .report-table td.rpt-last{max-width:none;}
}

/* ---- printable history ---- */
.wo-print-row{display:flex; justify-content:flex-end; align-items:center; gap:10px; margin-top:8px;}
.wo-print-row .wo-internal{text-transform:none; letter-spacing:normal; margin:0; font-size:12px;}
.wo-print-row .wo-internal input{width:auto; margin:0;}
.wo-print-btn{font-size:12px; padding:5px 10px;}
.reports-controls .rpt-check{display:inline-flex; align-items:center; gap:4px; text-transform:none; letter-spacing:normal; font-size:12px; color:var(--ink);}
.reports-controls .rpt-check[hidden]{display:none;}
.reports-controls .rpt-check input{width:auto; margin:0;}
.report-table tr.rpt-history td{background:var(--surface); padding:2px 8px 10px 20px; border-bottom:1px solid var(--line);}
.report-table tr.rpt-history ol{margin:0; padding-left:16px; font-size:11.5px; color:var(--ink-faint);}
.report-table tr.rpt-history li{margin:2px 0;}
#printSheet{display:none;}
@media print {
  body.printing-sheet > *:not(#printSheet){display:none !important;}
  body.printing-sheet #printSheet{display:block; font-family:inherit; color:#000; font-size:12pt;}
  #printSheet .ps-brand{font-size:9pt; color:#555; letter-spacing:.04em; text-transform:uppercase;}
  #printSheet h1{font-size:18pt; margin:4pt 0 2pt;}
  #printSheet .ps-sub{font-size:12pt; margin-bottom:10pt;}
  #printSheet .ps-facts{display:grid; grid-template-columns:auto 1fr; gap:3pt 14pt; margin:0 0 12pt; font-size:10.5pt;}
  #printSheet .ps-facts dt{font-weight:700;}
  #printSheet .ps-facts dd{margin:0;}
  #printSheet h2{font-size:13pt; border-bottom:1px solid #999; padding-bottom:2pt;}
  #printSheet .ps-timeline{list-style:none; padding:0; margin:0;}
  #printSheet .ps-timeline li{padding:5pt 0; border-bottom:1px solid #ddd; break-inside:avoid;}
  #printSheet .ps-when{font-size:9.5pt; color:#444;}
  #printSheet .ps-status{font-weight:700;}
  #printSheet .ps-foot{margin-top:14pt; font-size:9pt; color:#666;}
  body.printing-report tr.rpt-history td{padding-left:14pt;}
}

/* ---- basemap switch (bottom-left of the map) ---- */
.basemap-switch{
  display:flex; background:var(--surface); border:1px solid var(--line); border-radius:8px;
  padding:3px; gap:2px; box-shadow:0 1px 3px rgba(0,0,0,.2);
}
.basemap-switch button{
  border:none; background:none; border-radius:6px; padding:5px 10px; font-size:12px;
  font-weight:600; cursor:pointer; color:var(--ink); width:auto;
}
.basemap-switch button:hover{background:var(--bg);}
.basemap-switch button.active{background:var(--accent); color:var(--accent-ink);}

  /* Brand mark: the same stacked-layers mark as layeredinsightsgis.com,
     on the website's dark ink tile so it reads on the white header. */
  .brand-mark{background:#10151A !important; color:transparent; padding:6px;}
  .brand-mark svg{width:100%; height:100%; display:block;}
  .brand-mark .mark-top{fill:#E9E4D8; stroke:#E9E4D8; stroke-width:1;}
  .brand-mark .mark-mid{stroke:#4C97A8; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;}
  .brand-mark .mark-low{stroke:#C98A4B; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;}

/* ---- tenant contacts (tenantContacts.js) ---- */
.tenants-card{max-width:860px;}
.tc-overview tr.tc-row{cursor:pointer;}
.tc-overview tr.tc-row:hover td, .tc-overview tr.tc-row:focus td{background:var(--bg);}
.tc-overview td.tc-name{font-weight:600;}
.tc-overview td.tc-where{color:var(--ink-faint); font-size:12px;}
.tc-overview td.tc-issues{color:#a7671e; font-weight:600;}
.tc-overview td.tc-fine{color:var(--accent);}
.tc-detail-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:8px;}
.tc-back{font-size:12px; padding:5px 10px;}
.tc-tenant-name{font-family:'Fraunces',serif; font-size:18px; font-weight:600; margin:4px 0 2px;}
.tc-tenant-where{font-size:12px; color:var(--ink-faint); margin:0 0 12px;}
.tc-missing{font-size:12.5px; padding:8px 10px; margin-bottom:12px; border-radius:6px; background:#fbeedd; color:#8a5316;}
.tc-empty{font-size:13px; color:var(--ink-faint);}
.tc-list{display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:10px;}
.tc-card{background:var(--bg); border:1px solid var(--line); border-radius:10px; padding:10px 12px; font-size:12.5px; display:flex; flex-direction:column; gap:6px;}
.tc-card-top{display:flex; flex-wrap:wrap; align-items:baseline; gap:6px;}
.tc-role{font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:2px 7px; border-radius:999px; background:#e2e5e0; color:var(--ink);}
.tc-role-primary{background:#dcebe6; color:#1d4a3e;}
.tc-role-afterhrs{background:#f6e3d9; color:#8f3e1c;}
.tc-role-billing{background:#e3e6f3; color:#2f3b72;}
.tc-role-facil{background:#eee8d6; color:#5f5020;}
.tc-who{font-weight:700; font-size:13.5px;}
.tc-title{color:var(--ink-faint); font-size:12px;}
.tc-lines{display:flex; flex-direction:column; gap:2px;}
.tc-line .tc-k{display:inline-block; width:52px; color:var(--ink-faint); font-size:11px;}
.tc-line a{color:var(--accent); text-decoration:none; overflow-wrap:anywhere;}
.tc-line a:hover{text-decoration:underline;}
.tc-notes{color:var(--ink-faint); font-size:12px; font-style:italic;}
.tc-foot{display:flex; flex-direction:column; gap:6px; margin-top:auto; padding-top:6px; border-top:1px dashed var(--line);}
.tc-verified{font-size:11.5px;}
.tc-v-ok{color:var(--accent);}
.tc-v-stale{color:#a7671e; font-weight:600;}
.tc-unreach{color:#a7671e; font-weight:600; font-size:12.5px; margin:4px 0;}
.tc-card-unreach{border-color:#e4b27a;}
.tc-v-never{color:#b3413a; font-weight:600;}
.tc-actions{display:flex; gap:6px; flex-wrap:wrap;}
.tc-btn{font-size:11.5px; padding:4px 9px; border-radius:6px;}
.tc-btn:disabled{opacity:.55; cursor:default;}
.tc-btn-danger{color:#b3413a;}
.tc-form{margin-top:14px;}
.tc-form h4{margin:0 0 4px; font-size:14px;}
.tc-grid{display:grid; grid-template-columns:1fr 1fr; column-gap:12px;}
.tc-grid .tc-wide{grid-column:1 / -1;}
.tc-form .tc-check{display:flex; align-items:center; gap:6px; text-transform:none; letter-spacing:normal; font-size:12.5px; color:var(--ink); margin:10px 0 4px;}
.tc-form .tc-check input{width:auto; margin:0;}
.link-btn{background:none; border:none; padding:4px 0 0; font-size:12px; font-weight:600; color:var(--accent); cursor:pointer; text-align:left;}
.link-btn:hover{text-decoration:underline;}
.link-btn.tc-link-warn{color:#a7671e;}
.mep-verify{display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:6px; padding-top:6px; border-top:1px dashed var(--line);}
.report-table td.rpt-needs{font-weight:700;}
.report-table td.rpt-needs-0{color:#b3413a;}
.report-table td.rpt-needs-1{color:#b3413a;}
.report-table td.rpt-needs-2{color:#a7671e;}
@media (max-width:560px){
  .tc-grid{grid-template-columns:1fr;}
}
#editPanel .link-btn{display:block; margin:-6px 0 10px; padding:0;}

/* ---- tenant health (tenantHealth.js) ---- */
.th-badge{display:inline-block; font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:2px 8px; border-radius:999px; white-space:nowrap;}
.th-risk{background:#FCEBEB; color:#791F1F;}
.th-watch{background:#FAEEDA; color:#633806;}
.th-good{background:#EAF3DE; color:#27500A;}
.report-table td.th-tenant{font-weight:600;}
.report-table td.th-why{font-size:12px; color:var(--ink);}
.report-table td.th-why-good{color:var(--ink-faint);}
.th-rules{font-size:11.5px; color:var(--ink-faint); margin:10px 0 0;}
.th-strip{border:1px solid var(--line); border-left-width:4px; border-radius:8px; padding:10px 12px; margin:0 0 12px; background:var(--bg);}
.th-strip-risk{border-left-color:#c0392b;}
.th-strip-watch{border-left-color:#c98a2b;}
.th-strip-good{border-left-color:#4f8a32;}
.th-strip-top{display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; font-size:12.5px;}
.th-stats{display:flex; flex-wrap:wrap; gap:6px 22px; margin-top:8px;}
.th-stat{display:flex; flex-direction:column; font-size:11px; color:var(--ink-faint);}
.th-stat b{font-size:13px; color:var(--ink); font-weight:600;}

/* ---- maintenance history report (maintenanceHistory.js) ---- */
.reports-controls .rpt-mh-only, .reports-controls .rpt-history-opts{display:inline-flex; align-items:center; gap:8px;}
.reports-controls .rpt-mh-only[hidden], .reports-controls .rpt-history-opts[hidden]{display:none;}
.mh-wrap{overflow-x:auto;}
.mh-head{margin:4px 0 14px;}
.mh-building{font-family:'Fraunces',serif; font-size:19px; font-weight:600; margin:0 0 2px;}
.mh-facts{font-size:12px; color:var(--ink-faint); margin:0 0 2px;}
.mh-section{margin:0 0 18px;}
.mh-section h5{font-size:13.5px; margin:0 0 2px; padding-bottom:4px; border-bottom:2px solid var(--line);}
.mh-note{font-size:11.5px; color:var(--ink-faint); margin:4px 0 8px;}
.mh-empty{font-size:12.5px; color:var(--ink-faint); margin:6px 0;}
.mh-group{font-size:12.5px; font-weight:700; margin:12px 0 4px; color:var(--ink);}
.mh-table{table-layout:fixed; width:100%; min-width:760px;}
.mh-table td{overflow-wrap:anywhere;}
.mh-glance td.mh-trade{font-weight:600;}
.mh-open h5{border-bottom-color:#e2b46a;}
@media print {
  body.printing-report .mh-section{break-inside:auto;}
  body.printing-report .mh-group{break-after:avoid;}
  body.printing-report .mh-table tr{break-inside:avoid;}
  body.printing-report #reportsSummary{display:none;}
}

/* ---- Building Binder (binder.js) ---- */
.bd-wrap{font-size:13px;}
.bd-section{margin:0 0 22px;}
.bd-h{font-family:'Fraunces',serif; font-size:17px; font-weight:600; margin:0 0 4px; padding-bottom:4px; border-bottom:2px solid var(--line);}
.bd-note{font-size:11.5px; color:var(--ink-faint); margin:0 0 10px;}
.bd-cover{padding:18px 20px; border:1px solid var(--line); border-radius:10px; background:var(--bg);}
.bd-kicker{font-size:11px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); margin:0;}
.bd-title{font-family:'Fraunces',serif; font-size:26px; font-weight:600; margin:4px 0 2px;}
.bd-addr{margin:0 0 12px; color:var(--ink-faint);}
.bd-facts{display:grid; grid-template-columns:max-content 1fr; gap:4px 18px; margin:0 0 12px;}
.bd-facts dt{font-weight:600;}
.bd-facts dd{margin:0;}
.bd-contents{font-size:12px; margin:0 0 4px;}
.bd-care{font-size:11.5px; color:#8a5316; margin:0;}
.bd-tenant{margin:0 0 14px; break-inside:avoid;}
.bd-tenant-name{font-size:14px; margin:0;}
.bd-tenant-where{font-size:12px; color:var(--ink-faint); margin:0 0 4px;}
.bd-empty{font-size:12px; color:var(--ink-faint); margin:2px 0;}
.bd-gap{font-size:12px; color:#8a5316; font-weight:600; margin:4px 0 0;}
.bd-v-ok{color:var(--accent);}
.bd-v-stale{color:#a7671e; font-weight:600;}
.bd-v-never{color:#b3413a; font-weight:600;}
.bd-stack .stk-unit{cursor:default; min-height:44px;}
.bd-stack .stk-unit:hover{outline:none;}
.stk-unit .stk-lease{font-size:10.5px; opacity:.8;}
.bd-mh .mh-section h5{font-size:14px;}

@media print {
  body.printing-report .bd-wrap{font-size:10pt;}
  body.printing-report .bd-break{break-before:page;}
  body.printing-report .bd-cover{border:none; padding:0; background:none;}
  body.printing-report .modal-card:has(#binderWrap:not([hidden])) .modal-head{display:none;}
  body.printing-report .mh-table th{white-space:normal;}
  body.printing-report .bd-stack, body.printing-report .bd-stack *{-webkit-print-color-adjust:exact; print-color-adjust:exact;}
  body.printing-report .bd-tenant, body.printing-report .bd-table tr{break-inside:avoid;}
  body.printing-report .modal-card:has(#binderWrap:not([hidden])) .reports-summary{display:none;}
}

/* ---- building overview card (buildingOverview.js) ---- */
.bo-card{
  position:absolute; top:12px; left:56px; z-index:15; width:min(460px, calc(100% - 80px));
  max-height:calc(100% - 24px); overflow:auto;
  background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:14px 16px;
  box-shadow:0 6px 22px rgba(0,0,0,.18); font-size:12.5px;
}
.bo-card[hidden]{display:none;}
.bo-head{display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-bottom:8px;}
.bo-name{font-family:'Fraunces',serif; font-size:18px; font-weight:600; margin:0;}
.bo-addr{font-size:12px; color:var(--ink-faint); margin:2px 0 0;}
.bo-use{font-size:12px; color:var(--ink-faint); margin:1px 0 0;}
.bo-lines{display:flex; flex-direction:column; border-top:1px solid var(--line);}
.bo-line{display:grid; grid-template-columns:12px 92px 1fr; column-gap:8px; row-gap:2px; align-items:baseline; padding:7px 0; border-bottom:1px solid var(--line);}
.bo-dot{width:9px; height:9px; border-radius:50%; background:#c8c6bd; align-self:center;}
.bo-bad .bo-dot{background:#c0392b;}
.bo-warn .bo-dot{background:#d99a2b;}
.bo-ok .bo-dot{background:#4f8a32;}
.bo-label{font-weight:700;}
.bo-clickable{cursor:pointer;}
.bo-clickable:hover .bo-text{text-decoration:underline;}
.bo-bad .bo-text{color:#8c2318;}
.bo-link{grid-column:3; justify-self:start; background:none; border:none; padding:0; font-size:11.5px; font-weight:600; color:var(--accent); cursor:pointer;}
.bo-link:hover{text-decoration:underline;}
.bo-actions{display:flex; gap:6px; flex-wrap:wrap; margin-top:10px;}
.bo-actions button{font-size:12px; padding:5px 10px;}
@media (max-width: 700px){
  .bo-card{left:8px; right:8px; width:auto; top:8px;}
}
#floorButtons p.floor-note{flex-basis:100%; font-size:12.5px; line-height:1.45; color:var(--ink); margin:6px 0 0;
  background:#eaf2ef; border-left:3px solid var(--accent); border-radius:0 6px 6px 0; padding:8px 10px;}
#floorButtons p.floor-note strong{color:var(--accent);}
/* the floor the map is drawing while "All floors" is selected */
.floor-btn.on-map{border:2px solid var(--accent); padding:5px 9px; background:#fff;}
.floor-btn.on-map::after{content:"on map"; margin-left:6px; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--accent);}
/* floors holding the selected tenant / vacant units */
.floor-btn.has-sel::before{content:"●"; margin-right:4px; color:var(--accent); font-size:9px; vertical-align:1px;}
.floor-btn.active.has-sel::before{color:var(--accent-ink);}

/* one line under the Reports menu saying what the chosen report is for */
.reports-desc{font-size:12.5px; color:var(--ink); margin:-6px 0 6px; padding:6px 10px; background:var(--bg); border-radius:6px;}
@media print { body.printing-report .reports-desc{display:none;} }
.bd-table tr.bd-vacant td{background:#f1efe8; color:#5f5e5a;}
.bd-avail{font-size:12.5px; font-weight:600; margin:8px 0 0;}
@media print { body.printing-report .bd-table tr.bd-vacant td{-webkit-print-color-adjust:exact; print-color-adjust:exact;} }
.field-hint{font-size:11px; color:var(--ink-faint); margin:-4px 0 8px;}
.mep-actions{display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end;}
.mep-edit{margin-top:8px; padding-top:8px; border-top:1px dashed var(--line);}
.mep-edit .tc-check{display:flex; align-items:center; gap:6px; text-transform:none; letter-spacing:normal; font-size:12.5px; color:var(--ink); margin:8px 0 4px;}
.mep-edit .tc-check input{width:auto; margin:0;}
.tc-check label{display:inline-flex; align-items:center; gap:6px; text-transform:none; letter-spacing:normal; font-size:12.5px; color:var(--ink); margin:0;}
.tc-check{flex-wrap:wrap;}
.tc-check input.tc-date{width:auto; margin:0; padding:3px 6px; font-size:12.5px;}
.tc-name-row{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap;}
.tc-rename{margin:4px 0 8px; max-width:420px;}

/* ---- building safety & systems (buildingFeatures.js) ---- */
.features-card{max-width:900px;}
.bf-bar{display:flex; justify-content:flex-end; margin:4px 0 10px;}
.bf-group{margin:0 0 16px;}
.bf-group-head{display:flex; align-items:center; gap:8px; font-size:13px; margin:0 0 8px; color:var(--ink);}
.bf-list{display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:10px;}
.bf-card{background:var(--bg); border:1px solid var(--line); border-radius:10px; padding:10px 12px; font-size:12.5px; display:flex; flex-direction:column; gap:4px;}
.bf-card-top{display:flex; flex-wrap:wrap; align-items:baseline; gap:6px;}
.bf-type{font-weight:700; font-size:13px;}
.bf-pm{font-size:10.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:2px 7px; border-radius:999px; background:#ece6f3; color:#4f3a70;}
.bf-label{font-size:13px;}
.bf-where{color:var(--ink-faint); font-size:12px;}
.bf-vendor, .bf-meta{font-size:12px;}
.bf-notes{color:var(--ink-faint); font-size:12px; font-style:italic;}
.bf-verified{font-size:11.5px; margin-top:4px; padding-top:6px; border-top:1px dashed var(--line);}
.bf-warn{color:#a7671e; font-weight:600; font-size:12px;}
/* Heating / cooling systems (2026-10-03): system name, the other half, open jobs */
.bf-system{font-size:12px; font-weight:600;}
.bf-pair{font-size:12px; display:flex; flex-wrap:wrap; align-items:center; gap:6px;}
.bf-pair-missing{color:#a7671e;}
.bf-pair .tc-btn{padding:1px 8px; font-size:11px;}
.bf-jobs{font-size:12px; color:var(--accent);}
.wo-item .wo-equipment{font-size:11px; margin-top:4px; display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px;}
.wo-item .wo-equipment-other{color:var(--ink-faint);}
.wo-item .wo-equipment-show{font-size:11px; padding:0 6px;}
.bf-actions{display:flex; gap:6px; flex-wrap:wrap; margin-top:4px;}
.bf-missing{margin:0 0 16px; padding:10px 12px; border:1px solid #e3c787; border-left:4px solid #d99a2b; border-radius:10px; background:#fdf7e8; font-size:12.5px;}
.bf-missing-head{margin:0 0 6px; font-size:13px;}
.bf-missing-row{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:5px 0; border-top:1px dashed #e3c787;}
.bf-missing-text{display:flex; flex-direction:column; gap:1px;}
.bf-missing-note{color:var(--ink-faint); font-size:11.5px;}
.bf-missing-sub{margin:8px 0 2px; font-weight:700; font-size:12px; border-top:1px dashed #e3c787; padding-top:7px;}
.bf-stale-row{display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline; width:100%; text-align:left; background:none; border:none; padding:4px 0; font:inherit; color:var(--ink); cursor:pointer;}
.bf-stale-row:hover .bf-stale-name{text-decoration:underline;}
.bf-stale-name{font-weight:600;}
.bf-stale-type, .bf-stale-date{color:var(--ink-faint); font-size:12px;}
.bf-form{margin:0 0 14px; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--panel, #fff);}
.bf-form h4{margin:0 0 4px; font-size:14px;}
.bf-pos{display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-size:12.5px; margin:12px 0 4px;}
.bf-form .tc-check{display:flex; align-items:center; gap:6px; text-transform:none; letter-spacing:normal; font-size:12.5px; color:var(--ink); margin:8px 0 2px;}
.bf-form .tc-check input[type=checkbox]{width:auto; margin:0;}
.bf-form .tc-check label{display:inline-flex; align-items:center; gap:6px; margin:0; text-transform:none; letter-spacing:normal; font-size:12.5px; color:var(--ink);}
.bf-form .tc-date{width:auto;}
/* Category marker, the same shape and color as on the map. */
.bf-swatch{display:inline-block; width:11px; height:11px; background:var(--bf-color); border:1.5px solid #fff; box-shadow:0 0 0 1px rgba(0,0,0,.25); flex:none;}
.bf-shape-circle{border-radius:50%;}
.bf-shape-diamond{transform:rotate(45deg) scale(.85);}
.bf-shape-triangle{width:0; height:0; background:none; border:none; box-shadow:none; border-left:6px solid transparent; border-right:6px solid transparent; border-bottom:11px solid var(--bf-color);}
.bf-ring{background:var(--bf-color); box-shadow:0 0 0 2px #fff, 0 0 0 3px var(--bf-color);}
.bf-legend{display:flex; flex-direction:column; gap:3px; margin:2px 0 6px 22px; font-size:11.5px;}
.bf-legend-row{display:flex; align-items:center; gap:7px;}
/* Placing a feature: crosshair cursor and a banner at the top of the map. */
#mapContainer.bf-placing, #mapContainer.bf-placing .esri-view-surface{cursor:crosshair !important;}
.bf-place-banner{position:absolute; top:12px; left:50%; transform:translateX(-50%); z-index:30; background:#10151A; color:#fff; font-size:13px; padding:9px 12px 9px 14px; border-radius:8px; box-shadow:0 6px 18px rgba(0,0,0,.25); display:flex; align-items:center; gap:10px; max-width:calc(100% - 32px);}
.bf-place-banner[hidden]{display:none;}
.bf-place-banner button{font-size:12px; padding:4px 10px;}
@media (max-width:560px){
  .bf-list{grid-template-columns:1fr;}
}

  /* ---- demo banner (demo Worker only; calm blue-grey, not a warning colour) ---- */
  .demo-banner{background:#e8eef3; color:#33495a; border-bottom:1px solid #cfdae3; font-size:12px; text-align:center; padding:4px 12px;}
  .demo-banner[hidden]{display:none;}

/* Tenants overview: which building it's narrowed to (2026-10-04) */
.tc-scope{font-size:13px; color:var(--ink-faint); margin:0 0 10px; display:flex; flex-wrap:wrap; align-items:center; gap:6px;}
.tc-scope-btn{padding:2px 10px; font-size:12px;}

/* Screen size guidance (2026-10-04): the portal works on phones, but the map,
   stacking plan and reports need room. A line on the sign-in page, and on
   phone-sized screens a dismissible note once signed in. */
.login-card .pitch-device{font-size:12.5px; color:var(--ink-faint); margin:-6px 0 16px; line-height:1.4;}
.small-screen-note{display:none;}
@media (max-width:767px){
  body:not(.logged-out) .small-screen-note:not([hidden]){
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    background:#fdf7e8; color:#5c4410; border-bottom:1px solid #e3c787; font-size:13px; padding:6px 12px;
  }
  .small-screen-note button{border:0; background:transparent; font-size:18px; line-height:1; padding:2px 6px; color:inherit; cursor:pointer;}
}