:root { --blue:#06498d; --ink:#0a1c34; --muted:#64748b; --line:#dce5ee; --paper:#f4f7fa; --cyan:#eaf5ff; --green:#1f9d68; --yellow:#d6920b; --red:#d4473e; --shadow:0 16px 45px rgba(8,33,62,.09); }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
html { scroll-behavior:smooth; }
body { margin:0; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; color:var(--ink); background:var(--paper); }
button,a { font:inherit; }
button { color:inherit; }
button:focus-visible,a:focus-visible { outline:3px solid #69b9ff; outline-offset:2px; }
.draftbar { position:fixed; inset:0 0 auto 0; z-index:50; height:34px; display:flex; justify-content:center; align-items:center; gap:12px; color:white; background:#092b50; font-size:12px; letter-spacing:.03em; }
.draftbar strong { background:#f2b11b; color:#17243a; padding:3px 9px; border-radius:2px; letter-spacing:.12em; }
.app-shell { min-height:100vh; padding-top:34px; display:grid; grid-template-columns:232px 1fr; }
.rail { position:fixed; top:34px; bottom:0; width:232px; padding:28px 18px 20px; background:#fff; border-right:1px solid var(--line); display:flex; flex-direction:column; z-index:10; }
.brand { display:flex; align-items:center; gap:11px; padding:0 7px 28px; text-decoration:none; color:var(--ink); }
.brand-mark { width:42px; height:42px; display:grid; place-items:center; color:#fff; font-weight:900; font-style:italic; letter-spacing:-.12em; border-radius:5px 13px 5px 13px; background:linear-gradient(145deg,#0c65b9,#00366a); box-shadow:inset 0 0 0 2px rgba(255,255,255,.2); }
.brand b { display:block; color:var(--blue); font-size:13px; letter-spacing:.07em; }.brand small { display:block; margin-top:2px; color:var(--muted); font-size:11px; }
.rail nav { display:grid; gap:6px; }
.nav-link { display:flex; align-items:center; gap:13px; color:#52637a; padding:12px 13px; border-radius:8px; text-decoration:none; font-size:14px; font-weight:650; }
.nav-link span { width:20px; font-size:21px; text-align:center; }.nav-link:hover,.nav-link.active { color:var(--blue); background:var(--cyan); }
.nav-link.active { box-shadow:inset 3px 0 var(--blue); }
.rail-note { margin-top:auto; padding:15px; border:1px solid #cfe2f5; background:#f4faff; }.rail-note p { margin:9px 0 0; color:#607086; font-size:11px; line-height:1.5; }
.lock { display:inline-flex; align-items:center; color:var(--blue); border:1px solid #9fc5e8; background:#eaf5ff; padding:3px 7px; font-size:9px; font-weight:900; letter-spacing:.1em; border-radius:3px; }
.profile { display:flex; align-items:center; gap:10px; margin-top:15px; padding:13px 8px 0; border-top:1px solid var(--line); }.avatar { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:#092b50; color:#fff; font-size:11px; font-weight:800; }.profile b,.profile small { display:block; font-size:12px; }.profile small { color:var(--muted); margin-top:2px; }
main { grid-column:2; min-width:0; padding:0 38px 56px; }.topbar { height:104px; margin-bottom:22px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }.eyebrow { margin:0 0 7px; color:#688098; font-size:10px; font-weight:800; letter-spacing:.13em; }.topbar h1 { margin:0; font-size:25px; letter-spacing:-.03em; }.top-actions { display:flex; gap:10px; }.role-switch,.icon-btn { min-height:44px; border:1px solid var(--line); background:#fff; border-radius:6px; cursor:pointer; }.role-switch { display:flex; align-items:center; gap:9px; padding:8px 12px; font-size:12px; font-weight:700; }.icon-btn { width:44px; position:relative; color:var(--blue); }.notification-dot { position:absolute; right:9px; top:9px; width:6px; height:6px; border-radius:50%; background:var(--red); }
.view { display:none; animation:appear .2s ease; }.view.active { display:block; }@keyframes appear { from { opacity:.25; transform:translateY(5px); } }
.context-line { display:flex; align-items:center; gap:9px; font-size:12px; color:var(--muted); margin-bottom:17px; }.context-line span { color:var(--ink); font-weight:800; }.context-line i { width:1px; height:13px; background:#cad5df; }.danger-text { color:var(--red); }
.filter-row { display:flex; gap:8px; overflow:auto; padding-bottom:4px; margin-bottom:22px; }.filter { border:1px solid #cfdbe6; background:#fff; color:#55677e; padding:9px 13px; border-radius:5px; font-size:12px; font-weight:750; cursor:pointer; white-space:nowrap; }.filter span { margin-left:5px; padding:1px 6px; border-radius:8px; background:#edf2f6; }.filter.active { color:#fff; background:var(--blue); border-color:var(--blue); }.filter.active span { background:rgba(255,255,255,.18); }.problem-filter { color:#b6322e; border-color:#efc6c3; }
.workspace-grid { display:grid; grid-template-columns:minmax(0,1fr) 285px; gap:20px; align-items:start; }.job-panel,.pulse-panel,.detail-main,.model-card,.report-summary,.issue-box,.checklist-box,.photo-box { background:#fff; border:1px solid var(--line); box-shadow:var(--shadow); }.job-panel { min-width:0; }.section-head { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:23px 24px 18px; }.section-head h2 { margin:0; font-size:17px; letter-spacing:-.02em; }.section-head.compact { padding:21px 20px 15px; }.quiet-btn { border:0; background:transparent; color:var(--blue); font-size:11px; font-weight:750; cursor:pointer; }.live-dot { color:var(--green); font-size:9px; font-weight:900; letter-spacing:.12em; }
.job-row { border-top:1px solid var(--line); }.job-row.open { background:#f8fbfe; box-shadow:inset 3px 0 var(--blue); }.job-summary { width:100%; min-height:82px; display:grid; grid-template-columns:60px 4px minmax(145px,1.3fr) minmax(150px,1fr) minmax(90px,.75fr) auto 18px; align-items:center; gap:14px; padding:13px 19px; border:0; background:transparent; cursor:pointer; text-align:left; }.job-time { color:#34506d; font-weight:850; font-size:12px; }.status-bar { width:4px; height:35px; border-radius:2px; background:#aab6c3; }.status-bar.red { background:var(--red); }.status-bar.yellow { background:var(--yellow); }.status-bar.green { background:var(--green); }.status-bar.blue { background:var(--blue); }.job-address b,.job-address small,.job-meta b,.job-meta small { display:block; }.job-address b { font-size:13px; }.job-address small { color:var(--muted); font-size:10px; margin-top:4px; }.job-meta small,.job-details small { color:#8291a2; font-size:8px; font-weight:850; letter-spacing:.1em; }.job-meta b { margin-top:4px; font-size:11px; line-height:1.35; }.status-pill { display:inline-flex; align-items:center; justify-content:center; gap:5px; padding:6px 8px; border-radius:3px; font-size:8px; font-weight:900; letter-spacing:.08em; white-space:nowrap; }.red-pill { color:#a32926; background:#fdebea; }.yellow-pill { color:#8f5b00; background:#fff4d6; }.green-pill { color:#126e48; background:#e5f6ef; }.gray-pill { color:#607080; background:#edf2f6; }.blue-pill { color:var(--blue); background:#e4f1fc; }.status-dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:#9aa7b4; }.status-dot.red { background:var(--red); }.status-dot.yellow { background:var(--yellow); }.status-dot.green { background:var(--green); }.status-dot.blue { background:var(--blue); }.chevron { color:#7c8ca0; transition:.2s; }.job-row.open .chevron { transform:rotate(180deg); }.job-details { display:grid; grid-template-columns:1fr 1.6fr auto; gap:20px; align-items:center; margin:0 20px 14px 97px; padding:14px 0 2px; border-top:1px dashed #c9d6e2; }.job-details b { display:block; font-size:10px; margin-top:4px; line-height:1.4; }.row-action,.primary-btn { border:0; background:var(--blue); color:#fff; min-height:38px; padding:9px 13px; border-radius:4px; font-size:10px; font-weight:800; cursor:pointer; }
.pulse-panel { padding-bottom:18px; }.pulse-score { margin:3px 20px 15px; padding:18px 0; display:flex; align-items:end; gap:7px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.pulse-score span { color:var(--blue); font-size:52px; line-height:.8; font-weight:900; letter-spacing:-.08em; }.pulse-score small { color:var(--muted); font-size:10px; line-height:1.3; }.pulse-line { display:flex; justify-content:space-between; padding:8px 20px; font-size:11px; }.pulse-line span { display:flex; align-items:center; gap:8px; }.alert-card { width:calc(100% - 40px); margin:15px 20px 0; display:grid; grid-template-columns:27px 1fr auto; align-items:center; gap:9px; text-align:left; border:1px solid #efc2be; background:#fff6f5; padding:12px; cursor:pointer; }.alert-icon { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:var(--red); color:#fff; font-weight:900; }.alert-card small,.alert-card b,.alert-card em { display:block; }.alert-card small { color:var(--red); font-size:8px; font-weight:900; letter-spacing:.1em; }.alert-card b { font-size:11px; margin:3px 0; }.alert-card em { color:#7a5b5b; font-size:9px; font-style:normal; }.scope-note { margin:16px 20px 0; color:#778798; font-size:9px; line-height:1.5; }.scope-note .lock { margin-right:5px; }
.object-head { padding:0 0 20px; }.object-head h2 { font-size:23px; }.primary-btn { min-height:42px; font-size:11px; }.object-grid { display:grid; gap:10px; }.object-tile { display:grid; grid-template-columns:62px 1fr auto 20px; gap:16px; align-items:center; width:100%; padding:17px; border:1px solid var(--line); background:#fff; box-shadow:0 7px 24px rgba(8,33,62,.05); cursor:pointer; text-align:left; }.object-tile:hover { border-color:#8bbbe7; transform:translateY(-1px); }.object-number { width:55px; height:47px; display:grid; place-items:center; color:var(--blue); font-size:12px; font-weight:900; background:var(--cyan); }.object-tile b,.object-tile small { display:block; }.object-tile b { font-size:14px; }.object-tile small { margin-top:4px; color:var(--muted); font-size:10px; }.cycle { color:var(--blue); background:#edf6fe; padding:6px 9px; font-size:10px; font-weight:800; }
.empty-view { max-width:650px; margin:80px auto; text-align:center; }.big-lock { display:grid; place-items:center; width:75px; height:75px; margin:0 auto 24px; border-radius:50%; background:var(--cyan); color:var(--blue); font-size:38px; }.empty-view h2 { font-size:25px; }.empty-view>p:not(.eyebrow) { color:var(--muted); line-height:1.7; }.empty-view .primary-btn { margin-top:13px; }
.back-btn { margin:0 0 17px; padding:0; color:var(--blue); border:0; background:transparent; font-size:11px; font-weight:800; cursor:pointer; }.detail-hero,.report-header { min-height:125px; padding:26px 29px; display:flex; align-items:center; justify-content:space-between; color:white; background:linear-gradient(115deg,#063768,#07579f); box-shadow:var(--shadow); }.detail-hero h2,.report-header h2 { margin:0; font-size:27px; }.detail-hero p:not(.eyebrow),.report-header p:not(.eyebrow) { margin:7px 0 0; color:#c7def2; font-size:12px; }.detail-hero .eyebrow,.report-header .eyebrow { color:#9fcff7; }.active-chip { color:#8ee1ba; border:1px solid rgba(142,225,186,.45); padding:7px 10px; font-size:9px; font-weight:900; letter-spacing:.1em; }.detail-columns { display:grid; grid-template-columns:minmax(0,1fr) 275px; gap:20px; margin-top:20px; }.info-strip { display:grid; grid-template-columns:1.4fr 1fr 1fr; border-bottom:1px solid var(--line); }.info-strip div { padding:19px 22px; border-right:1px solid var(--line); }.info-strip div:last-child { border:0; }.info-strip small,.info-strip b { display:block; }.info-strip small { color:#8292a3; font-size:8px; font-weight:900; letter-spacing:.1em; }.info-strip b { margin-top:7px; font-size:11px; }.count-chip { padding:5px 8px; color:#5d7287; background:#edf2f6; font-size:9px; font-weight:800; }.timeline { padding:0 24px 23px; }.timeline-item { position:relative; width:100%; display:grid; grid-template-columns:48px 1fr auto 16px; align-items:center; gap:13px; padding:14px 0; border:0; border-top:1px solid var(--line); background:#fff; text-align:left; cursor:pointer; }.timeline-item.current { cursor:default; }.timeline-date { width:42px; height:45px; display:grid; place-items:center; align-content:center; color:#667c92; background:#f1f5f8; font-size:8px; font-weight:800; }.timeline-date b { display:block; color:var(--ink); font-size:15px; }.timeline-item small,.timeline-item b,.timeline-item em { display:block; }.timeline-item>span:nth-child(2) small { color:#73869a; font-size:8px; letter-spacing:.09em; font-weight:800; }.timeline-item>span:nth-child(2) b { font-size:11px; margin:4px 0; }.timeline-item em { color:var(--muted); font-size:9px; font-style:normal; }.model-card { padding:22px; }.model-card h3 { margin:0 0 22px; font-size:17px; }.model-card ol { margin:0; padding:0; list-style:none; }.model-card li { position:relative; display:grid; grid-template-columns:29px 1fr; column-gap:9px; padding-bottom:21px; }.model-card li:not(:last-child):before { content:""; position:absolute; top:29px; bottom:3px; left:14px; border-left:1px dashed #9eb2c6; }.model-card li>span { grid-row:1/3; width:29px; height:29px; display:grid; place-items:center; border-radius:50%; color:#fff; background:var(--blue); font-size:10px; font-weight:900; }.model-card li b { font-size:11px; }.model-card li small { margin-top:3px; color:var(--muted); font-size:9px; }
.report-grade { display:grid; grid-template-columns:auto 1fr; column-gap:8px; align-items:center; min-width:120px; padding-left:20px; border-left:1px solid rgba(255,255,255,.2); }.report-grade .status-dot { grid-row:1/3; width:14px; height:14px; }.report-grade small,.report-grade b { display:block; }.report-grade small { color:#b7d3eb; font-size:8px; letter-spacing:.1em; }.report-grade b { margin-top:3px; font-size:16px; }.report-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:18px; margin-top:18px; }.report-summary { grid-column:1/-1; display:grid; grid-template-columns:repeat(3,1fr); }.report-stat { padding:19px 23px; border-right:1px solid var(--line); }.report-stat:last-child { border:0; }.report-stat b { color:var(--blue); font-size:22px; }.report-stat span { display:block; margin-top:4px; color:var(--muted); font-size:10px; }.issue-box { grid-column:1/-1; padding:21px 24px; border-left:4px solid var(--yellow); background:#fffaf0; }.issue-title { display:flex; align-items:center; gap:11px; }.issue-title .alert-icon { background:var(--yellow); }.issue-title small { color:#966000; font-size:8px; font-weight:900; letter-spacing:.1em; }.issue-title h3 { margin:3px 0 0; font-size:14px; }.issue-box>p { margin:14px 0; color:#5e6268; font-size:11px; line-height:1.6; }.issue-meta { display:flex; gap:8px; flex-wrap:wrap; }.issue-meta span { color:#775514; background:#fff1c9; padding:6px 8px; font-size:9px; font-weight:700; }.checklist-box,.photo-box { min-width:0; }.check-row { display:grid; grid-template-columns:27px 1fr auto; align-items:center; gap:10px; padding:12px 23px; border-top:1px solid var(--line); }.check,.warn { width:23px; height:23px; display:grid; place-items:center; border-radius:50%; color:#fff; background:var(--green); font-size:10px; font-weight:900; }.warn { background:var(--yellow); }.check-row b,.check-row small { display:block; }.check-row b { font-size:10px; }.check-row small { margin-top:3px; color:var(--muted); font-size:9px; }.check-row>span:last-child { color:#617388; font-size:9px; font-weight:800; }.warning-row { background:#fffaf0; }.photo-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:0 20px; }.photo-placeholder { aspect-ratio:1.1; display:flex; flex-direction:column; justify-content:space-between; padding:10px; color:white; background:linear-gradient(145deg,#63809c,#203b57); }.photo-placeholder.bath { background:linear-gradient(145deg,#7999a5,#345565); }.photo-placeholder.kitchen { background:linear-gradient(145deg,#a28a71,#564638); }.photo-placeholder span { width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:rgba(20,40,60,.7); font-size:10px; }.photo-placeholder.kitchen span { background:var(--yellow); }.photo-placeholder small { font-size:8px; font-weight:800; text-shadow:0 1px 3px #000; }.photo-note { margin:13px 20px 18px; color:#758596; font-size:9px; line-height:1.5; }
.employee-view { margin:-22px -38px -56px; min-height:calc(100vh - 104px); background:#eef4f8; }.employee-banner { min-height:54px; padding:8px 38px; display:flex; align-items:center; gap:10px; color:#6e7d8c; background:#fff; border-bottom:1px solid var(--line); font-size:10px; }.employee-lock { color:#177448; background:#e6f6ef; border-color:#8cd0b1; }.employee-banner button { margin-left:auto; border:0; color:var(--blue); background:transparent; font-size:10px; font-weight:800; cursor:pointer; }.employee-content { max-width:780px; margin:auto; padding:45px 25px; }.employee-content h2 { margin:0; font-size:27px; }.employee-lead { max-width:580px; color:var(--muted); font-size:12px; line-height:1.6; }.employee-jobs { display:grid; gap:10px; margin-top:27px; }.employee-jobs article { display:grid; grid-template-columns:70px 1fr auto; align-items:center; gap:18px; background:#fff; border:1px solid var(--line); padding:17px; box-shadow:0 10px 30px rgba(8,33,62,.06); }.time-block { display:grid; place-items:center; min-height:59px; color:#fff; background:var(--blue); }.time-block b { font-size:16px; }.time-block small { font-size:8px; }.employee-jobs article>div small { color:#6f8599; font-size:8px; font-weight:900; letter-spacing:.1em; }.employee-jobs h3 { margin:4px 0; font-size:15px; }.employee-jobs p { margin:0; color:var(--muted); font-size:10px; }.employee-jobs button { border:0; color:#fff; background:var(--blue); padding:10px 13px; font-size:10px; font-weight:800; cursor:pointer; }.hidden-note { margin-top:20px; padding:14px; color:#667b90; background:#e2eaf1; font-size:10px; }.hidden-note span { margin-right:6px; font-size:15px; }
.mobile-nav { display:none; }.rail.employee-mode { display:none; }#toast { position:fixed; left:50%; bottom:30px; z-index:100; transform:translate(-50%,20px); opacity:0; padding:11px 15px; border-radius:4px; color:#fff; background:#0a243f; font-size:11px; pointer-events:none; transition:.2s; }#toast.show { opacity:1; transform:translate(-50%,0); }
@media (max-width:1050px) { .app-shell { grid-template-columns:190px 1fr; }.rail { width:190px; }.brand span:last-child { display:none; }.workspace-grid { grid-template-columns:1fr; }.pulse-panel { display:grid; grid-template-columns:1fr 1fr; align-items:start; }.pulse-panel .section-head,.pulse-score,.scope-note { grid-column:1/-1; }.detail-columns { grid-template-columns:1fr; }.model-card ol { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }.model-card li:before { display:none; }.report-grid { grid-template-columns:1fr; }.report-grid>* { grid-column:1!important; } }
@media (max-width:760px) { body { padding-bottom:64px; }.draftbar { justify-content:flex-start; padding:0 12px; height:38px; }.draftbar span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.app-shell { display:block; padding-top:38px; }.rail { display:none; }main { padding:0 14px 34px; }.topbar { height:86px; margin-bottom:14px; }.topbar h1 { font-size:20px; }.role-switch span:not(.lock) { display:none; }.top-actions { gap:6px; }.context-line { margin-bottom:13px; }.filter-row { margin-right:-14px; }.section-head { padding:18px 15px 14px; }.job-summary { min-height:78px; grid-template-columns:52px 4px 1fr auto 16px; gap:9px; padding:11px 12px; }.job-meta { display:none; }.status-pill { grid-column:4; }.chevron { grid-column:5; }.job-details { grid-template-columns:1fr; gap:11px; margin:0 14px 14px 79px; }.row-action { justify-self:start; }.pulse-panel { display:block; }.object-head { align-items:end; }.object-head h2 { font-size:20px; }.object-head .primary-btn { padding:8px; }.object-tile { grid-template-columns:53px 1fr 18px; gap:10px; padding:12px; }.object-tile .cycle { grid-column:2; justify-self:start; }.detail-hero,.report-header { padding:21px 17px; min-height:118px; align-items:flex-start; gap:15px; }.detail-hero h2,.report-header h2 { font-size:22px; }.info-strip { grid-template-columns:1fr; }.info-strip div { border-right:0; border-bottom:1px solid var(--line); padding:14px 17px; }.timeline { padding:0 15px 17px; }.timeline-item { grid-template-columns:43px 1fr auto; }.timeline-item .status-pill { display:none; }.model-card ol { grid-template-columns:1fr 1fr; }.report-header { display:block; }.report-grade { margin-top:17px; padding:12px 0 0; border-left:0; border-top:1px solid rgba(255,255,255,.2); }.report-summary { grid-template-columns:1fr; }.report-stat { border-right:0; border-bottom:1px solid var(--line); padding:13px 17px; }.photo-grid { grid-template-columns:1fr 1fr; }.employee-view { margin:-14px -14px -34px; min-height:calc(100vh - 86px); }.employee-banner { padding:8px 14px; }.employee-banner>span:nth-child(2) { display:none; }.employee-content { padding:32px 14px; }.employee-content h2 { font-size:22px; }.employee-jobs article { grid-template-columns:59px 1fr; gap:12px; }.employee-jobs button { grid-column:2; justify-self:start; }.mobile-nav { position:fixed; display:grid; grid-template-columns:repeat(3,1fr); inset:auto 0 0; z-index:40; height:64px; padding-bottom:env(safe-area-inset-bottom); background:#fff; border-top:1px solid var(--line); box-shadow:0 -8px 25px rgba(8,33,62,.08); }.mobile-nav[hidden] { display:none; }.mobile-nav a { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; color:#7a8b9e; text-decoration:none; font-size:19px; }.mobile-nav span { font-size:9px; font-weight:700; }.mobile-nav a.active { color:var(--blue); }.model-card { display:none; } }
@media (max-width:390px) { .job-address b { font-size:12px; }.status-pill { padding:5px; }.report-header h2 { font-size:20px; }.photo-grid { grid-template-columns:1fr; }.topbar .eyebrow { display:none; } }
