/* Condo OS — a quiet, architectural workspace. */
:root {
  color-scheme: light;
  --bg-main:#f5f4ef; --bg-sidebar:#eeeFE8; --bg-card:#fff; --bg-card-hover:#fafbf7;
  --bg-surface:#f8f9f5; --border:#dfe3da; --border-color:#dfe3da; --border-accent:#a6b9aa;
  --text-main:#21352b; --text-primary:#21352b; --text-secondary:#536459; --text-muted:#657369; --text-sub:#657369;
  --primary:#284e3e; --primary-hover:#193a2b; --primary-glow:#e5ede5;
  --success:#32654b; --success-glow:#eaf2e9; --warning:#936226; --danger:#ae3f36; --info:#486879;
  --radius-sm:6px; --radius-md:10px; --radius-lg:14px; --shadow-card:none;
  --font-sans:'DM Sans',system-ui,sans-serif; --font-mono:'DM Sans',system-ui,sans-serif;
}
body { display:block; font-size:14px; line-height:1.5; height:100dvh; overflow:hidden; }
button,input,select,textarea { font:inherit; }
a { color:var(--primary); }
button,a,input,select,summary { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid #abbd9a; outline-offset:3px; }
[hidden], .hidden { display:none!important; }
.app-layout { width:100%; height:100dvh; overflow:hidden; }
.sidebar { width:238px; min-height:0; padding:28px 18px 18px; background:var(--bg-sidebar); }
.brand { padding:0 7px 28px; gap:11px; border:0; }
.brand-logo { width:35px; height:43px; border-radius:0; background:none; color:var(--primary); box-shadow:none; }
.brand-title { font-family:'Instrument Serif',Georgia,serif; font-size:29px; font-weight:400; letter-spacing:-.7px; line-height:1.1; }
.brand-badge { display:block; font-size:9px; background:none; color:var(--text-muted); padding:6px 0 0; letter-spacing:.13em; font-weight:500; }
.nav-menu { margin-top:8px; gap:4px; min-height:0; overflow-y:auto; scrollbar-width:thin; padding-bottom:24px; }
.nav-item { min-height:39px; padding:9px 12px; font-size:12px; border:1px solid transparent; gap:10px; }
.nav-item:hover { transform:none; background:#e4e8df; color:var(--text-main); }
.nav-item.active { background:#dde7dc; color:#234a35; border-color:transparent; font-weight:600; }
.nav-icon { width:18px; height:18px; flex-shrink:0; display:inline-flex; }
.nav-icon svg { width:100%; height:100%; }
.nav-group { border:0; margin-top:6px; }
.nav-group summary { cursor:pointer; list-style:none; padding:11px 12px; display:flex; gap:10px; align-items:center; color:var(--text-secondary); font-size:12px; font-weight:500; }
.nav-group summary::-webkit-details-marker { display:none; }
.nav-group summary::after { content:'›'; margin-left:auto; font-size:18px; line-height:1; transform:rotate(90deg); color:#839182; }
.nav-group[open] summary::after { transform:rotate(-90deg); }
.nav-group .nav-item { margin-left:12px; padding-left:28px; font-size:11.5px; }
.nav-divider { height:1px; background:var(--border-color); margin:18px 12px 12px; flex-shrink:0; }
.nav-caption { padding:8px 12px 2px; text-transform:uppercase; letter-spacing:.13em; font-size:9px; color:var(--text-sub); }
.sidebar-footer { flex-shrink:0; padding-top:17px; gap:12px; }
.tenant-pill { padding:0 6px; background:none; font-family:var(--font-sans); font-size:10px; }
.tenant-dot { width:5px; height:5px; box-shadow:none; }
.user-avatar { background:#dce4d8; color:var(--primary); width:33px; height:33px; font-size:11px; }
.user-name { font-size:11px; }
.user-role { font-size:9px; }
.user-info { min-width:0; }
.user-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.main-content { min-width:0; background:var(--bg-main); height:100dvh; overscroll-behavior:contain; }
.topbar { min-height:78px; padding:18px 36px; gap:18px; background:var(--bg-main); backdrop-filter:none; border-bottom:1px solid var(--border-color); }
.topbar-search { padding:0; width:310px; max-width:100%; border:0; background:none; gap:10px; }
.topbar-search input { font-size:12px; min-width:0; padding:8px 0; }
.search-icon { color:var(--text-muted); width:16px; display:flex; }
.topbar-actions { gap:16px; flex-shrink:0; }
.status-indicator { font-size:10px; white-space:nowrap; }
.pulse { width:5px; height:5px; animation:none; box-shadow:none; }
.btn { min-height:36px; padding:9px 15px; line-height:1.35; font-size:11px; font-weight:600; border:1px solid transparent; box-shadow:none; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; gap:8px; }
.btn:hover { transform:none; }
.btn-primary { background:var(--primary); color:white; box-shadow:none; }
.btn-primary:hover { background:var(--primary-hover); }
.btn-secondary,.btn-outline { border-color:var(--border-color); color:var(--text-main); background:white; }
.btn-secondary:hover,.btn-outline:hover { background:var(--bg-surface); }
.btn-danger { color:var(--danger); background:#f9e9e6; }
.btn-success { color:var(--success); background:var(--success-glow); }
.btn-sm { min-height:30px; padding:6px 10px; font-size:10px; }
.btn-icon { width:30px; height:30px; display:grid; place-items:center; color:var(--text-secondary); }
.btn-block { width:100%; min-height:44px; }
.content-body { padding:38px 36px 50px; width:100%; max-width:1540px; margin:auto; }
.view-header { display:flex; align-items:flex-start; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:28px; }
.view-header:has(> .view-title) { display:block; }
.view-title,.view-header h2,#views-container>h2 { font-size:27px; font-weight:500; letter-spacing:-.8px; line-height:1.25; }
.view-subtitle,.subtitle { font-size:12px; max-width:650px; color:var(--text-muted); margin-top:8px; }
.stats-grid { gap:0; border:1px solid var(--border-color); background:white; border-radius:var(--radius-md); margin-bottom:28px; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); }
.stat-card { background:none; box-shadow:none; backdrop-filter:none; border:0; border-right:1px solid var(--border-color); border-radius:0; padding:20px 24px; }
.stat-card:last-child { border-right:0; }
.stat-card:hover { transform:none; }
.stat-header,.stat-label,.stat-title { font-size:10px; color:var(--text-muted); font-weight:500; text-transform:none; letter-spacing:0; }
.stat-header>span:last-child:not(:first-child),.stat-icon { display:none; }
.stat-value { font-family:var(--font-sans); font-variant-numeric:tabular-nums; font-size:31px; font-weight:500; line-height:1.25; margin-top:9px; letter-spacing:-1px; }
.stat-detail,.stat-sub,.stat-change { color:var(--text-muted); font-size:10px; margin-top:7px; }
.table-container { overflow-x:auto; background:white; border-radius:var(--radius-md); box-shadow:none; }
.data-table,.table { width:100%; border-collapse:collapse; text-align:left; }
.data-table th,.table th { background:#f9faf6; padding:13px 18px; color:var(--text-muted); font-weight:500; font-size:10px; letter-spacing:.015em; text-transform:none; white-space:nowrap; border-bottom:1px solid var(--border-color); }
.data-table td,.table td { padding:16px 18px; font-size:12px; border-bottom:1px solid var(--border-color); }
.data-table tbody tr:last-child td,.table tbody tr:last-child td { border-bottom:0; }
.data-table tr:hover td { background:#f9faf6; }
.tag,.badge { display:inline-flex; padding:4px 8px; border-radius:4px; font-size:9px; font-family:var(--font-sans); font-weight:500; line-height:1.25; }
.tag-success,.badge-success { background:#e9f1e7; color:#32654b; }
.tag-primary,.badge-primary,.badge-info { background:#eaf0ee; color:#385b4b; }
.badge-warning { background:#f8eedb; color:#936226; }
.badge-danger { background:#f8e9e6; color:var(--danger); }
.badge-outline { border:1px solid var(--border-color); color:var(--text-muted); }
.card { padding:22px; background:white; border:1px solid var(--border-color); border-radius:var(--radius-md); }
.grid { display:grid; gap:24px; }
.grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.text-danger,.negative { color:var(--danger); }
.positive { color:var(--success); }
.form-group { margin-bottom:18px; }
.form-group label,dialog label { font-size:11px; font-weight:500; color:var(--text-secondary); }
input,select,textarea,.form-group input,#iot-body input,#iot-body select,#iot-condo { min-height:39px; border:1px solid #cdd6cb; border-radius:5px; background:white; padding:9px 12px; color:var(--text-main); font-size:12px; max-width:100%; }
input[type=checkbox] { min-height:0; }
textarea { resize:vertical; }
input::placeholder { color:#849084; opacity:1; }
.form-group input:focus { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-glow); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
dialog { width:min(620px,calc(100% - 32px)); max-height:calc(100dvh - 48px); overflow:auto; background:white; color:var(--text-main); padding:28px; border:1px solid var(--border-color); border-radius:12px; margin:auto; box-shadow:0 24px 70px #193a2b25; }
dialog::backdrop { background:#203a3166; backdrop-filter:blur(3px); }
dialog h3 { font-size:24px; font-weight:500; letter-spacing:-.6px; }
.dialog-header { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:8px; }
.dialog-description { color:var(--text-muted); margin-bottom:24px; font-size:12px; }
.dialog-actions { display:flex; gap:10px; justify-content:flex-end; border-top:1px solid var(--border-color); padding-top:20px; margin-top:20px; }
.modal-overlay { background:#f5f4ef; backdrop-filter:none; padding:24px; overflow:auto; }
.login-card { width:min(900px,100%); display:grid; grid-template-columns:1fr 1fr; padding:0; border:1px solid var(--border-color); border-radius:14px; overflow:hidden; background:white; box-shadow:0 30px 80px #284e3e0d; }
.login-story { padding:48px 38px; background:#284e3e; color:#edf2e7; display:flex; flex-direction:column; justify-content:space-between; gap:48px; }
.login-story .brand-title { font-size:35px; }
.login-story h2 { font-family:'Instrument Serif',Georgia,serif; font-weight:400; font-size:46px; line-height:1.1; letter-spacing:-1px; }
.login-story p { font-size:12px; color:#c5d4c0; margin-top:18px; max-width:260px; }
.login-story .architecture { width:100%; height:140px; margin:0; color:#9fb49a; }
.login-content { padding:48px 38px; }
.login-header { text-align:left; margin-bottom:28px; }
.login-header h2 { font-size:25px; font-weight:500; letter-spacing:-.6px; }
.login-header p { font-size:12px; margin-top:8px; }
.login-brand-icon { display:none; }
.login-form { margin-top:28px; }
.login-note { color:var(--text-muted); font-size:10px; margin-top:18px; }
.eyebrow { display:block; font-size:9px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--text-muted); }
.workspace-heading { display:flex; justify-content:space-between; gap:24px; align-items:end; margin-bottom:28px; }
.workspace-heading h1 { font-family:'Instrument Serif',Georgia,serif; font-size:49px; font-weight:400; line-height:1.08; letter-spacing:-1.2px; margin-top:10px; }
.workspace-heading p { color:var(--text-muted); font-size:12px; margin-top:12px; }
.workspace-date { font-size:11px; color:var(--text-muted); text-align:right; white-space:nowrap; padding-bottom:5px; }
.workspace-hero { background:#284e3e; color:#edf2e7; border-radius:10px; padding:32px 34px; display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:24px; position:relative; overflow:hidden; margin-bottom:28px; }
.workspace-hero .eyebrow { color:#bfceba; }
.workspace-hero h2 { font-size:25px; line-height:1.25; font-weight:500; letter-spacing:-.65px; max-width:450px; margin:12px 0; }
.workspace-hero p { color:#c4d4bf; font-size:12px; max-width:440px; }
.workspace-hero .btn { margin-top:23px; background:#eef2e6; color:#264a37; border:0; }
.architecture { color:#9eb59a; width:100%; height:190px; align-self:center; }
.workspace-columns { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:28px; }
.section-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:14px; }
.section-heading h2 { font-size:15px; font-weight:500; letter-spacing:-.2px; }
.section-heading a { font-size:10px; text-decoration:none; }
.workspace-panel { background:white; border:1px solid var(--border-color); border-radius:10px; }
.empty-state { padding:34px 26px; text-align:center; }
.empty-state .empty-mark { margin:0 auto 14px; height:40px; width:40px; display:grid; place-items:center; background:#edf1e7; border-radius:50%; color:#56734c; }
.empty-state h3 { font-size:14px; font-weight:500; }
.empty-state p { margin:8px auto 0; font-size:11px; line-height:1.7; max-width:285px; color:var(--text-muted); }
.empty-state .btn { margin-top:18px; }
.workflow-link { display:flex; align-items:center; gap:14px; padding:18px 20px; color:var(--text-main); text-decoration:none; border-bottom:1px solid var(--border-color); }
.workflow-link:last-child { border-bottom:0; }
.workflow-link:hover { background:var(--bg-surface); }
.workflow-link .nav-icon { color:#7d9075; }
.workflow-link strong { display:block; font-size:12px; font-weight:500; }
.workflow-link small { display:block; color:var(--text-muted); font-size:10px; margin-top:3px; }
.workflow-link .arrow { margin-left:auto; color:#8b9984; }
.portfolio-line { padding:17px 20px; border-bottom:1px solid var(--border-color); display:flex; align-items:center; gap:13px; text-decoration:none; color:var(--text-main); }
.portfolio-line:last-child { border:0; }
.portfolio-line strong { display:block; font-size:12px; font-weight:500; }
.portfolio-line small { font-size:10px; color:var(--text-muted); }
.portfolio-mark { width:34px; height:37px; background:#edf1e7; color:#54704a; display:grid; place-items:center; border-radius:5px; flex-shrink:0; }
.portfolio-line .tag { margin-left:auto; }
.workspace-footnote { margin-top:32px; border-top:1px solid var(--border-color); padding-top:14px; display:flex; justify-content:space-between; gap:16px; font-size:9px; color:var(--text-muted); }
.menu-toggle,.menu-close { display:none; }
.nav-scrim { display:none; }
.command-results { display:grid; gap:3px; margin-top:20px; }
.command-results button { width:100%; text-align:left; padding:11px 14px; border:0; background:var(--bg-surface); color:var(--text-main); cursor:pointer; border-radius:5px; display:flex; gap:12px; align-items:center; }
.command-results button:hover { background:var(--primary-glow); }
#command-search { width:100%; }
.notice { padding:12px 15px; color:var(--danger); background:#faf0ed; border-radius:6px; font-size:12px; }
#iot-body { margin-top:24px; }
#iot-body>h3 { margin:25px 0 13px; font-weight:500; font-size:16px; }
#iot-body>p { padding:18px 0; color:var(--text-muted); font-size:12px; }
#iot-body .btn { margin:4px 8px 4px 0; }
#iot-body pre { overflow:auto; padding:18px; border:1px solid var(--border-color); background:white; border-radius:8px; font-size:11px; }
#iot-body svg { max-width:100%; }
.records-toolbar { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:16px; color:var(--text-muted); font-size:11px; }
.records-toolbar input { width:240px; min-width:0; }
.record-details { display:grid; grid-template-columns:1fr 2fr; gap:10px 18px; margin-top:20px; font-size:12px; }
.record-details dt { color:var(--text-muted); }
.record-content,.message-record p { white-space:pre-wrap; overflow-wrap:anywhere; }
.message-record { border-bottom:1px solid var(--border-color); padding:16px 0; }
.message-record small { color:var(--text-muted); font-size:10px; }
.message-record p { margin-top:8px; }
.twin-layout { min-width:0; }
.twin-layout>* { min-width:0; }
@media(max-width:1000px) { #views-container [style*="grid-template-columns"] { grid-template-columns:minmax(0,1fr)!important; height:auto!important; min-height:0!important; } }
@media(min-width:1500px) { .content-body { padding:44px 56px 60px; } .topbar { padding-inline:56px; } }
@media(max-width:1100px) { .sidebar { width:210px; padding-inline:12px; } .content-body { padding:28px 24px; } .topbar { padding:16px 24px; } .status-indicator { display:none; } .workspace-hero { grid-template-columns:minmax(0,1fr) 160px; } }
@media(max-width:800px) {
  .app-layout { flex-direction:row; }
  .sidebar { position:fixed; z-index:40; left:0; top:0; bottom:0; width:260px; max-height:none; height:100dvh; padding:28px 18px 18px; overflow:hidden; transform:translateX(-100%); transition:transform .18s ease; box-shadow:15px 0 50px #1c372b15; }
  body.nav-open .sidebar { transform:translateX(0); }
  .menu-toggle,.menu-close { display:grid; flex-shrink:0; }
  .menu-close { position:absolute; top:18px; right:12px; }
  .nav-scrim { display:none; position:fixed; inset:0; z-index:30; background:#203a3166; border:0; }
  body.nav-open .nav-scrim { display:block; }
  .main-content { height:100dvh; min-height:0; width:100%; }
  .topbar { padding:12px 18px; min-height:65px; flex-wrap:nowrap; gap:14px; }
  .topbar-search { flex:1; width:auto; min-width:0; }
  .topbar-search input { font-size:11px; }
  .topbar-actions { gap:0; }
  .content-body,#views-container { padding:26px 20px 35px; }
  .workspace-heading h1 { font-size:41px; }
  .workspace-date { display:none; }
  .workspace-columns { grid-template-columns:1fr; gap:25px; }
  .workspace-hero { grid-template-columns:minmax(0,1fr) 150px; padding:26px; }
  .stats-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .stat-card { padding:17px 14px; }
  .stat-value { font-size:27px; }
  .stat-header { font-size:9px; }
  .grid-2,.twin-layout { grid-template-columns:1fr!important; }
  .view-header { gap:12px; }
  .login-content { padding:35px 26px; }
  .login-story { padding:35px 26px; }
  .login-story h2 { font-size:38px; }
}
@media(max-width:480px) {
  .topbar { padding:10px 14px; gap:9px; }
  #btn-quick-create { padding:8px 10px; font-size:10px; }
  .search-icon { display:none; }
  .content-body,#views-container { padding:24px 16px 35px; }
  .workspace-heading h1 { font-size:37px; }
  .workspace-hero { display:block; padding:26px 22px; }
  .workspace-hero h2 { font-size:23px; }
  .workspace-hero .architecture { height:110px; margin-top:20px; }
  .stat-card { padding:15px 10px; }
  .stat-detail { font-size:9px; }
  .view-title,.view-header h2,#views-container>h2 { font-size:24px; }
  .form-row { grid-template-columns:1fr; gap:0; }
  .workspace-footnote { display:block; }
  .workspace-footnote span { display:block; margin:4px 0; }
  .login-card { display:block; }
  .login-story { padding:24px; gap:22px; }
  .login-story h2 { font-size:32px; }
  .login-story .architecture,.login-story p { display:none; }
  .login-story .brand-title { font-size:27px; }
  .login-content { padding:28px 24px; }
  .modal-overlay { padding:16px; align-items:flex-start; }
  dialog { padding:22px; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; animation:none!important; } }
.import-intro {display:flex;justify-content:space-between;gap:32px;margin-bottom:24px;padding:28px;}
.import-intro h2,.import-step h2,.import-history h2 {font-family:'Instrument Serif',serif;font-weight:400;font-size:28px;margin:10px 0 14px;}
.import-intro p {max-width:620px;line-height:1.7;}
.import-models {display:flex;flex-direction:column;justify-content:center;gap:12px;flex-shrink:0;}
.import-step {padding:28px;margin-bottom:24px;scroll-margin-top:20px;}
.import-history {padding:28px;}
.import-progress {display:flex;gap:24px;padding:0 0 20px;margin:0 0 22px;list-style:none;border-bottom:1px solid var(--border);}
.import-progress li {display:flex;gap:10px;align-items:center;color:var(--text-muted);font-size:13px;}
.import-progress li[aria-current] {color:var(--primary);font-weight:600;}
.import-form-grid {display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.import-step select,.import-step input:not([type=checkbox]) {width:100%;}
.import-step [hidden] {display:none!important;}
.import-file {padding:24px;border:1px dashed #bec8bc;background:#fafbf8;border-radius:8px;}
.import-mapping {display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center;padding:16px 0;border-bottom:1px solid var(--border);}
.import-mapping label {display:block;font-weight:600;}
.import-mapping small {display:block;margin-top:4px;color:var(--text-muted);}
.import-sample {margin-top:24px;}
.import-sample summary {cursor:pointer;margin-bottom:16px;}
.import-summary {display:grid;grid-template-columns:repeat(3,1fr);padding:24px 0;margin:12px 0 20px;border-block:1px solid var(--border);gap:20px;}
.import-summary strong {display:block;font-family:'Instrument Serif',serif;font-weight:400;font-size:38px;color:var(--primary);}
.import-summary span {display:block;color:var(--text-muted);font-size:13px;}
.import-confirm {display:flex;align-items:flex-start;gap:12px;padding:22px 0;line-height:1.6;}
.import-confirm input {margin-top:5px;accent-color:var(--primary);}
.import-step .notice {white-space:pre-wrap;}
.import-step .data-table td {max-width:260px;white-space:normal;overflow-wrap:anywhere;}
@media(max-width:650px){.import-intro{display:block;padding:20px;}.import-models{margin-top:20px;}.import-step,.import-history{padding:20px;}.import-form-grid,.import-mapping{grid-template-columns:1fr;gap:12px;}.import-progress{gap:12px;}.import-progress li{align-items:flex-start;font-size:12px;}.import-summary{gap:12px;}.import-summary strong{font-size:30px;}.import-summary span{font-size:12px;}.import-step .dialog-actions{flex-wrap:wrap;}}