@font-face{font-family:Archivo;src:url(../fonts/archivo-latin-wdth-normal.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}
:root{--ink:#16324f;--ink2:#3f5870;--concrete:#e9ecea;--sheet:#fbfcfb;--line:#c8d0d4;--mute:#5b6875;--hazard:#f2b705;--rust:#a23b22;--ok:#2c7a57;
--bs-body-font-family:Archivo,system-ui,sans-serif;--bs-body-color:#1c2730;--bs-body-bg:var(--concrete);--bs-primary:#16324f;--bs-link-color:#1d4d7c;--bs-link-color-rgb:29,77,124;--bs-border-color:var(--line)}
body{font-variant-numeric:tabular-nums;font-size:15px;line-height:1.45}
.btn-primary{--bs-btn-bg:#16324f;--bs-btn-border-color:#16324f;--bs-btn-hover-bg:#0f2438;--bs-btn-hover-border-color:#0f2438;--bs-btn-active-bg:#0f2438;--bs-btn-disabled-bg:#16324f}
.btn-outline-primary{--bs-btn-color:#16324f;--bs-btn-border-color:#16324f;--bs-btn-hover-bg:#16324f;--bs-btn-hover-border-color:#16324f;--bs-btn-active-bg:#16324f}
:focus-visible{outline:2px solid var(--hazard);outline-offset:2px}
.shell{display:flex;min-height:100vh}
.rail{width:232px;flex:none;background:var(--ink);color:#d9e2ea;display:flex;flex-direction:column;padding:14px 0;position:sticky;top:0;height:100vh;overflow-y:auto}
.brand{display:flex;gap:10px;align-items:center;color:#fff;text-decoration:none;padding:4px 18px 14px;font-weight:800;font-stretch:80%;font-size:20px;line-height:1}
.brand i{font-size:26px;color:var(--hazard)}
.rail nav a,.sheets a{display:block;color:#d9e2ea;text-decoration:none;padding:6px 18px;border-left:3px solid transparent}
.rail nav a i{margin-right:9px}
.rail nav a:hover,.sheets a:hover{background:#1f4264;color:#fff}
.rail a.on{border-left-color:var(--hazard);color:#fff;background:#1f4264}
.sheets{margin-top:12px;padding-top:10px;border-top:1px solid #2f4d6b}
.sheets-title{padding:0 18px 4px;font-weight:700;color:var(--hazard)}
.sheet-group{padding:10px 18px 2px;font-size:12.5px;color:#9fb2c4}
.sheets a{padding:4px 18px 4px 26px;font-size:14px}
.who{margin-top:auto;padding:14px 18px 0;font-size:13px;color:#9fb2c4}.who a{color:#fff;margin-left:6px}
.work{flex:1;min-width:0}
main{padding:22px 28px 60px;max-width:1320px}
.page-title{font-weight:800;font-stretch:85%;font-size:30px;margin-bottom:18px;color:var(--ink)}
h2{font-size:18px;font-weight:700;color:var(--ink);margin:22px 0 10px}
h3{font-size:15px;font-weight:700;color:var(--ink)}
.titleblock{display:grid;grid-template-columns:2.2fr 1fr 1.4fr 1fr 1.6fr;border:2px solid var(--ink);background:var(--sheet);margin-bottom:18px}
.titleblock>div{padding:6px 12px;border-left:1px solid var(--ink);min-width:0}
.titleblock>div:first-child{border-left:0}
.titleblock span{display:block;font-size:11.5px;color:var(--mute)}
.tb-name strong{font-size:21px;font-weight:800;font-stretch:85%;color:var(--ink);line-height:1.1;display:block}
.tb-sheet{background:var(--ink);color:#fff;font-weight:700}.tb-sheet span{color:#b7c6d4}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));margin-bottom:20px;padding:0 0 1px 1px}
.tile{background:var(--sheet);padding:12px 14px;min-width:0;border:1px solid var(--line);margin:0 0 -1px -1px}
.tile span{display:block;font-size:13px;color:var(--mute)}
.tile strong{display:block;font-size:23px;font-weight:700;font-stretch:88%;color:var(--ink);line-height:1.2;overflow-wrap:anywhere}
.tile small{color:var(--mute);display:block;font-size:12.5px}
.tile.warn{box-shadow:inset 3px 0 0 var(--hazard)}.tile.bad{box-shadow:inset 3px 0 0 var(--rust)}.tile.bad strong{color:var(--rust)}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:8px 0 12px;flex-wrap:wrap}.section-head h2{margin:0}
.table{--bs-table-bg:var(--sheet);background:var(--sheet);border:1px solid var(--line);font-size:14.5px}
.table thead th{background:#dfe5e8;color:var(--ink);font-weight:600;border-bottom:1px solid var(--ink2);white-space:nowrap}
.meter{height:8px;background:#dfe3e4;overflow:hidden}.meter i{display:block;height:100%;background:var(--ink)}
.empty{background:var(--sheet);border:1px dashed var(--ink2);padding:28px;text-align:center}
.hint{color:var(--mute);font-size:13.5px}
.form-sheet{background:var(--sheet);border:1px solid var(--line);padding:18px 22px;max-width:960px}.form-sheet.wide{max-width:none}
.form-sheet h2:first-child{margin-top:0}
.form-label{font-size:13.5px;font-weight:600;margin-bottom:3px}
.area-out{font-weight:700;color:var(--ink)}
.req input{min-width:74px}
.req th[scope=row]{font-weight:500;white-space:nowrap}
.stepper{display:flex;flex-wrap:wrap;list-style:none;padding:0;margin:0 0 16px;counter-reset:s;border:1px solid var(--line);background:var(--sheet)}
.stepper li{counter-increment:s;flex:1 1 170px;padding:9px 12px;border-left:1px solid var(--line)}
.stepper li:first-child{border-left:0}
.stepper li::before{content:counter(s) ". ";font-weight:700}
.stepper li.done{color:var(--ok)}.stepper li.done a{color:var(--ok)}.stepper li.done::before{content:"\2713  "}
.attn{padding-left:18px}
/* designs */
.option-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px;margin-bottom:10px}
.option{background:var(--sheet);border:1px solid var(--line);padding:10px 12px}.option.sel{border:2px solid var(--ok)}
.option header{display:flex;align-items:center;gap:8px;margin-bottom:6px}.option h3{margin:0;font-size:16px}
.optno{width:26px;height:26px;background:var(--ink);color:#fff;font-weight:700;display:grid;place-items:center;flex:none}
.option p{font-size:13.5px;color:var(--mute);margin:6px 0 0}
.thumb{width:100%;height:250px;background:#fff;display:block}
.plan-tools{display:flex;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.plan-wrap{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:14px;align-items:start}
.plan-stage{background:#fff;border:1px solid var(--line);padding:6px}
#plan{width:100%;height:calc(100vh - 240px);min-height:460px;touch-action:none;display:block}
.room-panel{background:var(--sheet);border:1px solid var(--line);padding:12px;max-height:calc(100vh - 230px);overflow:auto}
.sched table{font-size:13px;border:0}.sched tbody tr{cursor:pointer}
.op-row{display:grid;grid-template-columns:1fr 1fr 58px 58px 30px;gap:3px;margin-bottom:4px}
.op-row .form-select,.op-row .form-control{padding-left:4px;padding-right:2px;font-size:12px}
.plan-svg .rm{stroke:var(--ink);fill:#fff;cursor:pointer}
.plan-svg .rm.open{stroke-dasharray:.5 .35}
.plan-svg .rm.sel{fill:#fbeeba}
.t-bedroom,.t-guest{fill:#e9eef5!important}.t-lounge,.t-drawing,.t-dining,.t-custom{fill:#f3ecdc!important}.t-kitchen{fill:#e8f0e6!important}.t-bath{fill:#dfeef2!important}.t-porch{fill:#ececec!important}.t-stairs{fill:#e4e4e4!important}.t-lift{fill:#d0d0d0!important}.t-shop{fill:#f4e8e0!important}.t-office{fill:#ece8f3!important}.t-terrace,.t-balcony{fill:#f1f5ec!important}.t-lawn,.t-court{fill:#dcebd3!important}.t-store,.t-dress{fill:#efefef!important}.t-shaft{fill:#dcdcdc!important}
.plan-svg .rm.sel{fill:#fbeeba!important}
.plan-svg .gap{stroke:#fff}.plan-svg .glz{stroke:var(--ink);stroke-width:.07}.plan-svg .leaf{stroke:var(--ink);stroke-width:.07}.plan-svg .swing{fill:none;stroke:#7a8894;stroke-width:.04}
.plan-svg .shut{stroke:var(--rust);stroke-width:.12;stroke-dasharray:.3 .2}.plan-svg .tread{stroke:#7a8894;stroke-width:.05}.plan-svg .car{fill:none;stroke:#7a8894;stroke-width:.08}
.plan-svg .lbl{text-anchor:middle;font-weight:700;fill:var(--ink)}.plan-svg .dimv{text-anchor:middle;fill:#3f4d5a}.plan-svg .roadl{text-anchor:middle;fill:var(--mute)}
.plan-svg .dimline{stroke:var(--ink);stroke-width:.06}.plan-svg .handle{fill:var(--hazard);stroke:var(--ink);stroke-width:.08;cursor:nwse-resize}
.elev-wrap{background:#eef4f8;border:1px solid var(--line);padding:10px}
.elev{width:100%;max-height:70vh;display:block}.elev .dim{stroke:var(--ink);stroke-width:.06}.elev .dimt{font-size:.9px;fill:var(--ink)}
.view3d{width:100%;height:68vh;min-height:420px;border:1px solid var(--line);background:#dde5ea}.view3d canvas{display:block;touch-action:none}
.checks{list-style:none;padding:0}.checks li{padding:4px 0;border-bottom:1px solid var(--line);font-size:14px}
.chk-fail i{color:var(--rust)}.chk-warn i{color:#b58900}.chk-info i{color:var(--mute)}
/* gantt */
.gantt{background:var(--sheet);border:1px solid var(--line);padding:10px 12px;overflow-x:auto}
.g-row{display:grid;grid-template-columns:210px minmax(420px,1fr);align-items:center;gap:8px;padding:3px 0;border-bottom:1px solid #e4e8ea;font-size:14px}
.g-track{position:relative;height:18px;background:repeating-linear-gradient(90deg,transparent 0 calc(var(--wk) - 1px),#e4e8ea calc(var(--wk) - 1px) var(--wk))}
.g-bar{position:absolute;top:3px;bottom:3px;background:#b9c7d4}.g-bar i{display:block;height:100%;background:var(--ink)}
.g-today{position:absolute;top:0;bottom:0;width:2px;background:var(--rust)}
.money-pos{color:var(--rust)}
.login{display:grid;place-items:center;min-height:100vh;background:var(--ink)}
.login-card{background:var(--sheet);padding:30px;width:min(380px,92vw);border-top:5px solid var(--hazard)}
.login-card h1{font-weight:800;font-stretch:85%;color:var(--ink);margin:0}
.inline-form{display:flex;gap:6px;flex-wrap:wrap;align-items:end}
@media(max-width:991px){.shell{display:block}.rail{position:fixed;z-index:30;left:-250px;transition:left .15s}.rail.open{left:0}.titleblock{grid-template-columns:1fr 1fr}.titleblock>div{border-left:0;border-top:1px solid var(--ink)}.tb-name{grid-column:1/3;border-top:0!important}.plan-wrap{grid-template-columns:1fr}#plan{height:62vh}main{padding:12px 16px 50px}.room-panel{max-height:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{.rail,.btn,form{display:none!important}main{padding:0}}

.render-thumb{display:block;background:#dfe6ea;aspect-ratio:16/9;margin-bottom:6px;overflow:hidden}.render-thumb img{width:100%;height:100%;object-fit:cover;display:block}.render-thumb img:not([src]),.render-thumb img[src=""]{visibility:hidden}
.option .thumb{height:170px}
.brand img{width:34px;height:34px}.brand span{display:block}.brand small{display:block;font-size:11px;font-weight:500;color:#b7c6d4;font-stretch:90%}
.login-logo{width:56px;height:56px;margin-bottom:8px}
.topline{display:flex;align-items:center;gap:10px;justify-content:flex-end;padding:8px 28px 0;max-width:1320px}
.topline .co{margin-right:auto;font-size:13.5px;color:var(--mute)}
.bell{position:relative;font-size:21px;color:var(--ink)}.bell b{position:absolute;top:-3px;right:-9px;background:var(--rust);color:#fff;font-size:11px;padding:0 5px;border-radius:9px}
.alert-box{position:fixed;right:16px;bottom:16px;width:min(380px,calc(100vw - 32px));z-index:2000;display:grid;gap:8px}
.alert-card{background:#fff;border:1px solid var(--line);border-left:5px solid var(--ink);padding:10px 12px;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.alert-card.stock,.alert-card.payment,.alert-card.receivable{border-left-color:var(--hazard)}.alert-card strong{display:block;color:var(--ink)}.alert-card p{margin:3px 0 6px;font-size:13.5px}
.perm td{white-space:nowrap}.perm label{margin-right:5px;font-size:12px}.perm input{margin-right:1px}
.chat{display:grid;grid-template-columns:240px minmax(0,1fr);gap:14px;height:calc(100vh - 210px);min-height:440px}
.chat-side{background:var(--sheet);border:1px solid var(--line);overflow:auto}.chat-side h3{padding:9px 11px 0;font-size:13px;color:var(--mute);margin:0}
.chat-side a{display:flex;justify-content:space-between;padding:6px 11px;text-decoration:none;color:inherit;font-size:14px}.chat-side a.on{background:#fbeeba}.chat-side b{background:var(--ink);color:#fff;font-size:11px;padding:0 6px;border-radius:9px}
.chat-main{display:flex;flex-direction:column;background:var(--sheet);border:1px solid var(--line);min-height:0}
.chat-log{flex:1;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:7px}
.msg{max-width:75%;background:#eef1f3;padding:6px 10px;align-self:flex-start;overflow-wrap:anywhere}.msg.mine{align-self:flex-end;background:#dfe9f3}.msg.announcement{max-width:100%;align-self:stretch;background:#fbeeba}
.msg small{display:block;color:var(--mute);font-size:11.5px}.msg audio{width:240px;max-width:100%;display:block}.msg .tag{font-size:12px;color:var(--mute)}
.chat-form{display:flex;gap:6px;padding:8px;border-top:1px solid var(--line);flex-wrap:wrap;align-items:center}.chat-form textarea{flex:1 1 240px;resize:none;height:40px}
.rec-on{background:var(--rust)!important;color:#fff!important}
@media(max-width:800px){.chat{grid-template-columns:1fr;height:auto}.chat-side{max-height:170px}.chat-log{height:50vh}}
.chat-person{display:block;width:100%;text-align:left;border:0;background:none;padding:5px 11px;font-size:14px}.chat-person:hover{background:#eef1f3}

.login-card h1{font-size:27px;line-height:1.1}.login-card p{color:var(--mute)}
.linkbox{display:flex;gap:5px;margin-top:6px}.linkbox input{min-width:0;font-size:12.5px}
.perm-line{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:13.5px;margin-top:6px}
.media-edit{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}.media-edit figure{margin:0}.media-edit img,.media-edit video{width:100%;aspect-ratio:4/3;object-fit:cover;background:#000;display:block}.media-edit figcaption{font-size:12.5px;color:var(--mute)}
/* Side menu: flat design. Solid blocks and colour-coded icon squares, with no borders or shadows. */
.rail{padding:0;--fi:#3f5870;scrollbar-width:thin;scrollbar-color:#3f5870 var(--ink)}
.brand{background:#0f2438;padding:14px 16px;margin-bottom:8px}
.rail nav a,.sheets a{display:flex;align-items:center;gap:10px;border-left:0;padding:5px 12px;margin:0;color:#e6edf3;font-size:14.5px}
.sheets a{padding:3px 12px;font-size:14px}
.rail nav a i,.sheets a i{margin:0;flex:none;width:28px;height:28px;display:grid;place-items:center;background:var(--fi);color:#fff;font-size:15px}
.sheets a i{width:24px;height:24px;font-size:13px}
.rail nav a:hover,.sheets a:hover{background:#21476c;color:#fff}
.rail a.on,.rail nav a.on,.sheets a.on{background:var(--hazard);color:#0f2438;font-weight:700}
.rail a.on i{background:#0f2438;color:var(--hazard)}
.c-dashboard{--fi:#1f6fb2}.c-projects{--fi:#0e7c7b}.c-suppliers{--fi:#c2570c}.c-workers{--fi:#7a5230}.c-rates{--fi:#2c7a57}.c-clients{--fi:#6a4c93}.c-staff{--fi:#a23b22}.c-admin,.c-me{--fi:#55636f}
.g-planning{--fi:#1f6fb2}.g-site{--fi:#c2570c}.g-money{--fi:#2c7a57}.g-people{--fi:#7a5230}.g-clients{--fi:#6a4c93}.g-output{--fi:#0e7c7b}
.sheets{margin-top:8px;padding-top:0;border-top:0}
.sheets-title{background:#0f2438;color:var(--hazard);padding:8px 14px;font-size:15px}
.sheet-group{padding:10px 14px 3px;font-size:12.5px;font-weight:700;color:#b9c8d6}
.who{background:#0f2438;padding:10px 14px;margin-top:auto;position:sticky;bottom:0;color:#b9c8d6}
.sheets+.who,nav+.who{margin-top:auto}
