/* HAConnect styles */
:root{
  --bg:#F6F5F1; --surface:#FFFFFF; --surface-2:#FAF9F6; --ink:#141414; --ink-2:#3A3935; --muted:#77736A;
  --line:#E6E3DA; --line-2:#EFEDE6;
  --khaki:#B1A276; --khaki-deep:#857849; --khaki-soft:#F3F0E6; --black:#111111;
  --red:#B42318; --red-soft:#FDECEA; --amber:#9A6A00; --amber-soft:#FFF4D6;
  --blue:#2D5B86; --blue-soft:#E8F0F8; --green:#2F7A4F; --green-soft:#E6F4EC; --gray-soft:#F0EFEA;
  --radius:12px; --shadow:0 1px 2px rgba(20,20,20,.04),0 2px 8px rgba(20,20,20,.04);
  --side:240px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font:14px/1.45 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit}
.num{font-variant-numeric:tabular-nums}
svg.i.xs{width:13px;height:13px}
svg.i{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- Shell ---------- */
.app{display:flex;min-height:100vh}
.side{position:fixed;inset:0 auto 0 0;width:var(--side);background:var(--black);color:#EDEBE4;display:flex;flex-direction:column;padding:20px 14px;z-index:20}
.brand{display:flex;align-items:center;gap:10px;padding:4px 8px 22px}
.brand-mark{width:34px;height:34px;border-radius:9px;border:1.5px solid var(--khaki);display:grid;place-items:center;color:var(--khaki);font-weight:700;font-size:13px;letter-spacing:.02em}
.brand-logo{flex-direction:column;align-items:flex-start;gap:10px;padding:2px 8px 22px}
.brand-logo img{width:150px;height:auto;display:block}
.brand-name{font-weight:600;font-size:16px;letter-spacing:-.01em}
.brand-name span{color:var(--khaki)}
.brand-sub{font-size:11px;color:#9C988D;margin-top:1px}
.nav{display:flex;flex-direction:column;gap:2px}
.nav a{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:9px;text-decoration:none;color:#CFCBC0;font-weight:500}
.nav a:hover{background:#1D1D1C;color:#fff}
.nav a.on{background:#232321;color:#fff}
.nav a.on svg{color:var(--khaki)}
.nav .count{margin-left:auto;font-size:11px;background:#2C2B28;color:#D9D5C9;padding:1px 7px;border-radius:20px}
.nav .count.red{background:#5A1F1A;color:#FFD8D3}
.nav-admin{margin-top:auto;padding-top:10px;border-top:1px solid #262624;margin-bottom:12px}
.side-foot{border-top:1px solid #262624;padding:14px 8px 0;font-size:12px;color:#9C988D}
.side-foot .who{color:#EDEBE4;font-weight:500;font-size:13px;margin-bottom:2px;overflow:hidden;text-overflow:ellipsis}
.side-foot button{background:none;border:0;color:#9C988D;padding:6px 0;cursor:pointer;display:flex;gap:8px;align-items:center}
.side-foot button:hover{color:#fff}
.main{flex:1;margin-left:var(--side);min-width:0}
.topbar{display:none}
.page{max-width:1240px;margin:0 auto;padding:28px 32px 80px}
.bottomnav{display:none}

/* ---------- Page header ---------- */
.ph{display:flex;align-items:flex-end;gap:16px;margin-bottom:22px;flex-wrap:wrap}
.ph h1{font-size:24px;font-weight:650;letter-spacing:-.02em;margin:0}
.ph .sub{color:var(--muted);margin-top:4px}
.ph .actions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.crumb{display:inline-flex;align-items:center;gap:4px;color:var(--muted);text-decoration:none;font-size:13px;margin-bottom:8px}
.crumb:hover{color:var(--ink)}

/* ---------- Buttons / inputs ---------- */
.btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--surface);padding:8px 13px;border-radius:9px;cursor:pointer;font-weight:500;white-space:nowrap}
.btn:hover{border-color:#CFCBBF}
a.btn{text-decoration:none;color:inherit}
a.btn.primary{color:#fff}
.btn.primary{background:var(--black);border-color:var(--black);color:#fff}
.btn.primary:hover{background:#2A2A28}
.btn.khaki{background:var(--khaki);border-color:var(--khaki);color:#111}
.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}
.btn.ghost:hover{background:var(--gray-soft);color:var(--ink)}
.btn.danger{color:var(--red)}
.btn.sm{padding:5px 10px;font-size:13px;border-radius:8px}
.btn svg.i{width:16px;height:16px}
.input,.select,.textarea{width:100%;border:1px solid var(--line);background:var(--surface);border-radius:9px;padding:8px 11px;outline:none;transition:border-color .12s,box-shadow .12s}
.input:focus,.select:focus,.textarea:focus{border-color:var(--khaki);box-shadow:0 0 0 3px rgba(177,162,118,.22)}
.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2377736A' stroke-width='2.4'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:30px}
.textarea{resize:vertical;min-height:84px}
.input:disabled,.select:disabled,.textarea:disabled{background:var(--surface-2);color:var(--ink-2);cursor:default;opacity:1;-webkit-text-fill-color:var(--ink-2)}
.select:disabled{background-image:none}
.dtitle:disabled{background:transparent;color:var(--ink);-webkit-text-fill-color:var(--ink)}
.seg button:disabled{cursor:default}
.label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin-bottom:5px;letter-spacing:.01em}

/* ---------- Cards ---------- */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.card-h{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line-2)}
.card-h h2{font-size:14px;font-weight:600;margin:0}
.card-h .meta{margin-left:auto;color:var(--muted);font-size:12px}
.card-b{padding:6px 0}
.grid2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}
.grid2>*{min-width:0}
.stack{display:flex;flex-direction:column;gap:18px}

/* KPI tiles */
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:20px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;cursor:pointer;box-shadow:var(--shadow);text-align:left;transition:border-color .12s,transform .12s}
.kpi:hover{border-color:var(--khaki)}
.kpi .k{font-size:12px;color:var(--muted);font-weight:500}
.kpi .v{font-size:28px;font-weight:650;letter-spacing:-.02em;margin-top:4px}
.kpi.red .v{color:var(--red)}
.kpi.amber .v{color:var(--amber)}
.kpi.green .v{color:var(--green)}

/* Pills */
.pill{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;padding:3px 9px;border-radius:20px;white-space:nowrap;line-height:1.5}
.pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.85}
.pill.nodot::before{display:none}
.s-open{background:var(--gray-soft);color:#5B5850}
.s-in_progress{background:var(--blue-soft);color:var(--blue)}
.s-waiting{background:var(--amber-soft);color:var(--amber)}
.s-done{background:var(--green-soft);color:var(--green)}
.b-open{background:var(--gray-soft);color:#5B5850}
.b-in_review{background:var(--amber-soft);color:var(--amber)}
.b-closed{background:var(--green-soft);color:var(--green)}
.b-none{background:transparent;color:#A9A598;border:1px dashed #D8D4C8}
.b-none::before{display:none}
.prio{font-size:11px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;padding:2px 7px;border-radius:5px}
.p-immediate{background:var(--red-soft);color:var(--red)}
.p-high{background:#FCEFE3;color:#A1490F}
.tag{display:inline-flex;align-items:center;font-size:12px;color:var(--ink-2);background:var(--khaki-soft);border-radius:6px;padding:2px 8px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}

/* Avatar */
.av{width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;font-size:10px;font-weight:600;color:#fff;flex:none;letter-spacing:.02em}
.who-cell{display:flex;align-items:center;gap:8px;min-width:0}
.who-cell span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.unassigned{color:#A9A598}

/* ---------- Task list ---------- */
.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.toolbar .search{position:relative;flex:1 1 220px;max-width:320px}
.toolbar .search svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--muted);width:16px;height:16px}
.toolbar .search .input{padding-left:33px}
.toolbar .select{width:auto;min-width:130px}
.filters{display:contents}
.seg{display:inline-flex;background:var(--gray-soft);border-radius:10px;padding:3px;gap:2px;flex-wrap:wrap}
.seg button{border:0;background:transparent;padding:6px 11px;border-radius:8px;cursor:pointer;font-weight:500;color:var(--muted);font-size:13px;white-space:nowrap}
.seg button.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.seg button .c{font-size:11px;margin-left:4px;color:var(--muted)}
.list{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.group-h{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--surface-2);border-bottom:1px solid var(--line-2);border-top:1px solid var(--line-2);font-weight:600;font-size:13px}
.group-h:first-child{border-top:0}
.group-h a{text-decoration:none}
.group-h a:hover{text-decoration:underline}
.group-h .gc{color:var(--muted);font-weight:500}
.group-h .gx{margin-left:auto;display:flex;gap:6px;align-items:center}
.trow{display:grid;grid-template-columns:28px minmax(0,1fr) 140px 132px 84px 74px 84px 108px;gap:12px;align-items:center;padding:11px 16px;border-bottom:1px solid var(--line-2);cursor:pointer;transition:background .1s}
.trow.noprop{grid-template-columns:28px minmax(0,1fr) 132px 84px 74px 84px 108px}
.trow.th{cursor:default;background:var(--surface-2);padding-top:8px;padding-bottom:8px}
.trow.th:hover{background:var(--surface-2)}
.trow.th button{border:0;background:none;padding:0;font:inherit;font-size:12px;font-weight:500;color:var(--muted);text-align:left;cursor:pointer;white-space:nowrap;display:block}
.trow.th button:hover,.trow.th button.on{color:var(--ink)}
.trow.th .tstatus{justify-self:end}
.tcreated{font-size:13px;color:var(--ink-2)}
.c-mute2{color:var(--muted);font-size:12.5px}
.prio-in{display:none}
.tsortsel{display:none}
.trow.noprop .tprop{display:none}
.trow.compact{grid-template-columns:28px minmax(0,1fr) 84px 108px}
.trow:last-child{border-bottom:0}
.trow:hover{background:#FBFAF7}
.tcheck{width:20px;height:20px;border-radius:6px;border:1.6px solid #C9C5B8;background:#fff;display:grid;place-items:center;cursor:pointer;padding:0;color:transparent}
.tcheck:hover{border-color:var(--green);color:var(--green)}
.tcheck svg{width:13px;height:13px;stroke-width:3}
.is-done .tcheck{background:var(--green);border-color:var(--green);color:#fff}
.is-done .ttitle{color:var(--muted);text-decoration:line-through;text-decoration-color:#C9C5B8}
.ttitle{font-weight:500;display:flex;align-items:center;gap:8px;min-width:0}
.ttitle .t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tsub{color:var(--muted);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}
.tsub .wait{color:var(--amber);font-weight:500}
.tdue{font-size:13px;color:var(--ink-2)}
.tdue.over{color:var(--red);font-weight:600}
.tdue.none{color:#B5B1A5}
.tstatus{justify-self:end}
.tmob{display:none}
.quickadd{display:flex;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line-2);background:var(--surface)}
.quickadd .input{border-style:dashed}
.empty{padding:36px 20px;text-align:center;color:var(--muted)}
.empty b{display:block;color:var(--ink);font-weight:600;margin-bottom:4px}

/* ---------- Property board ---------- */
.kind{font-size:10.5px;font-weight:600;color:var(--khaki-deep);background:var(--khaki-soft);padding:1px 6px;border-radius:4px;margin-left:6px;vertical-align:1px;letter-spacing:.02em}
.board .brow{display:grid;grid-template-columns:minmax(0,1.5fr) 104px 104px 104px 52px 60px 56px minmax(0,1.2fr);gap:12px;align-items:center;padding:12px 18px;border-bottom:1px solid var(--line-2);cursor:pointer}
.board.ob .brow{grid-template-columns:minmax(0,1.6fr) 112px 112px 112px 60px 66px 62px}
.board .bh>div{line-height:1.25}
.bcell{display:grid;gap:3px;justify-items:start;min-width:0}
.bdue{font-size:11.5px;color:var(--muted);white-space:nowrap}
.bdue.late{color:var(--red);font-weight:600}
.home{text-decoration:none;color:inherit}
.vabar{position:sticky;top:0;z-index:18;display:flex;align-items:center;gap:10px;background:var(--khaki);color:#111;padding:8px 16px 8px 18px;font-size:13px}
.vabar svg.i{width:16px;height:16px}
.vabar .va-t{flex:1;min-width:0}
.vabar .btn{background:#111;border-color:#111;color:#fff}
.vabar .btn:hover{background:#2A2A28}
.glance{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:18px}
.gl{padding:14px 16px;display:grid;gap:9px}
.gl-h{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.gl-h b{font-size:14px;font-weight:600}
.gl-h span{margin-left:auto;font-size:12.5px;color:var(--muted)}
.gbar{height:8px;background:var(--gray-soft);border-radius:8px;overflow:hidden;display:flex}
.gbar i{display:block;height:100%}
.g-c{background:var(--green)}.g-r{background:#D99A00}.g-o{background:#CFCBBF}
.gl-k{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.gl-k .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:0}
.gl-f{display:flex;gap:4px 12px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-2);min-height:18px}
.orow{display:flex;align-items:center;gap:12px;padding:11px 18px;border-bottom:1px solid var(--line-2);cursor:pointer}
.orow:last-child{border-bottom:0}
.orow:hover{background:#FBFAF7}
.b-late{background:var(--red-soft);color:var(--red)}
.pc-form{display:grid;gap:8px;padding:14px 18px;border-bottom:1px solid var(--line-2)}
.pc-list{padding:0 18px}
.pc-list .upd:first-child{border-top:0}
.board .brow:not(.bh):nth-child(even){background:#F8F6F1}
.board .brow:hover,.board .brow:not(.bh):nth-child(even):hover{background:#F1EEE5}
.board .brow:last-child{border-bottom:0}
.board .bh{cursor:default;font-size:12px;color:var(--muted);font-weight:500;background:var(--surface-2)}
.board .bh:hover{background:var(--surface-2)}
.pname{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.paddr{color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-red{color:var(--red);font-weight:600}
.c-amber{color:var(--amber);font-weight:600}
.c-mute{color:#B5B1A5}
.bar{height:6px;background:var(--gray-soft);border-radius:6px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--khaki)}
.barlbl{font-size:11px;color:var(--muted);margin-top:4px}
.health{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:8px;vertical-align:middle}
.h-red{background:var(--red)}.h-amber{background:#D99A00}.h-green{background:var(--green)}.h-gray{background:#CFCBBF}
.bmob{display:none}
.nextdue{font-size:12.5px;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Feed */
.feed .fi{display:flex;gap:12px;padding:11px 18px;border-bottom:1px solid var(--line-2);cursor:pointer}
.feed .fi:hover{background:#FBFAF7}
.feed .fi:last-child{border-bottom:0}
.feed .ficon{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;flex:none}
.feed .ficon svg{width:14px;height:14px;stroke-width:2.4}
.fi-done{background:var(--green-soft);color:var(--green)}
.fi-note{background:var(--khaki-soft);color:var(--khaki-deep)}
.fi-new{background:var(--gray-soft);color:#5B5850}
.feed .ft{font-size:13px;min-width:0}
.feed .ft b{font-weight:600}
.feed .fm{color:var(--muted);font-size:12px;margin-top:2px}
.feed .fq{color:var(--ink-2);font-size:12.5px;margin-top:3px;background:var(--surface-2);border-left:2px solid var(--khaki);padding:4px 8px;border-radius:0 6px 6px 0;white-space:pre-wrap;word-break:break-word}

/* ---------- Properties grid ---------- */

/* ---------- Properties table ---------- */
.sect{font-size:13px;font-weight:600;color:var(--muted);margin:22px 0 10px;text-transform:uppercase;letter-spacing:.06em}
.sect span{font-weight:500;margin-left:4px}
.ptable .prow{display:grid;grid-template-columns:minmax(0,2fr) 104px 108px 100px 50px 60px 56px 100px 100px minmax(0,1.5fr);gap:10px;align-items:center;padding:11px 16px;border-bottom:1px solid var(--line-2);cursor:pointer;font-size:13px}
.ptable .prow:last-child{border-bottom:0}
.ptable .prow:not(.ph-row):nth-child(odd){background:#F8F6F1}
.ptable .prow:hover,.ptable .prow:not(.ph-row):nth-child(odd):hover{background:#F1EEE5}
.ptable .ph-row{background:var(--surface-2);cursor:default;padding-top:9px;padding-bottom:9px}
.ptable .ph-row:hover{background:var(--surface-2)}
.ptable .ph-row button{border:0;background:none;padding:0;font:inherit;font-size:12px;font-weight:500;color:var(--muted);text-align:left;cursor:pointer;white-space:nowrap}
.ptable .ph-row button.pc-n{white-space:normal;line-height:1.25}
.ptable .ph-row button:hover,.ptable .ph-row button.on{color:var(--ink)}
.ptable .r{text-align:right;justify-self:end}
.ptable .ph-row button.r{text-align:right}
.ptable .pc-status,.ptable .pc-keeper,.ptable .pc-sw{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink-2)}
.pmob{display:none}

/* ---------- Property detail ---------- */
.phero{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:14px 18px 12px;margin-bottom:12px;box-shadow:var(--shadow)}
.pbar{display:flex;align-items:center;gap:10px 18px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px solid var(--line-2)}
.pnums{display:flex;gap:6px;flex-wrap:wrap}
.pnums span{font-size:12.5px;color:var(--muted);background:var(--surface-2);border:1px solid var(--line-2);border-radius:7px;padding:3px 9px}
.pnums b{color:var(--ink);font-weight:650;margin-right:2px}
.pnums .red b{color:var(--red)}.pnums .amber b{color:var(--amber)}
.pbooks{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:auto}
.pb-l{font-size:12px;color:var(--muted);font-weight:500;display:inline-flex;align-items:center;gap:3px;margin-right:2px}
.hbtn{border:0;background:none;padding:0;color:#A9A598;cursor:pointer;display:inline-grid;place-items:center}
.hbtn svg.i{width:14px;height:14px}
.hbtn:hover{color:var(--ink)}
.bchip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:4px 8px 4px 9px;font-size:12.5px;cursor:pointer;font-family:inherit;line-height:1.3}
span.bchip{cursor:default}
.bchip .bc-l{color:var(--muted)}
.bchip .bc-s{font-weight:600}
.bchip .bc-d{font-size:11.5px;color:var(--muted);padding-left:6px;border-left:1px solid rgba(0,0,0,.1)}
.bchip .bc-d.late{color:var(--red);font-weight:600}
.bchip svg.i{width:13px;height:13px;color:var(--muted)}
.bchip.b-open .bc-s{color:#5B5850}
.bchip.b-in_review{background:var(--amber-soft);border-color:#F1DFA6}.bchip.b-in_review .bc-s{color:var(--amber)}
.bchip.b-closed{background:var(--green-soft);border-color:#C9E6D3}.bchip.b-closed .bc-s{color:var(--green)}
button.bchip:hover{border-color:var(--khaki)}
.phero h1{font-size:20px;font-weight:650;letter-spacing:-.015em;margin:0}
.phero .facts{display:flex;flex-wrap:wrap;gap:2px 14px;color:var(--muted);margin-top:3px;font-size:12.5px}
.phero .row{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.phero .row .actions{margin-left:auto;display:flex;gap:8px}
.pstats{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:18px;border-top:1px solid var(--line-2);padding-top:14px}
.pstats div{padding-right:12px}
.pstats .k{font-size:12px;color:var(--muted)}
.pstats .v{font-size:20px;font-weight:650;margin-top:2px}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:12px;overflow-x:auto;scrollbar-width:none}
.tabs a{padding:10px 12px;text-decoration:none;color:var(--muted);font-weight:500;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs a:hover{color:var(--ink)}
.tabs a.on{color:var(--ink);border-color:var(--khaki)}
.tabs a .c{font-size:11px;background:var(--gray-soft);padding:1px 6px;border-radius:10px;margin-left:5px;color:var(--muted)}
.kv{display:grid;grid-template-columns:160px 1fr;gap:0;font-size:13.5px}
.kv div{padding:9px 18px;border-bottom:1px solid var(--line-2)}
.kv div:nth-child(odd){color:var(--muted)}
.kv div:nth-last-child(-n+2){border-bottom:0}
.kv .blank{color:#B5B1A5;font-style:italic}

/* Recurring */
.rsec{margin-bottom:16px}
.rsec .card-h{flex-wrap:wrap}
.pernav{display:inline-flex;align-items:center;gap:2px;margin-left:auto}
.pernav button{border:0;background:transparent;border-radius:7px;width:28px;height:28px;display:grid;place-items:center;cursor:pointer;color:var(--muted)}
.pernav button:hover{background:var(--gray-soft);color:var(--ink)}
.pernav span{font-size:13px;font-weight:500;min-width:140px;text-align:center}
.ritem{display:flex;align-items:center;gap:12px;padding:10px 18px;border-bottom:1px solid var(--line-2)}
.ritem:last-child{border-bottom:0}
.ritem .rt{flex:1;min-width:0}
.ritem .rm{font-size:12px;color:var(--muted)}
.ritem.done .rt>div:first-child{color:var(--muted);text-decoration:line-through;text-decoration-color:#C9C5B8}
.ritem .x{opacity:0;border:0;background:none;color:var(--muted);cursor:pointer;padding:4px;border-radius:6px}
.ritem:hover .x{opacity:1}
.ritem .x:hover{background:var(--gray-soft);color:var(--red)}
.rprog{font-size:12px;color:var(--muted);font-weight:500}
.books{display:flex;align-items:center;gap:10px;padding:12px 18px;background:var(--surface-2);border-bottom:1px solid var(--line-2);flex-wrap:wrap}
.books .select{width:auto;min-width:140px;padding-top:6px;padding-bottom:6px}
.books .note{font-size:12px;color:var(--muted)}

/* ---------- Drawer ---------- */
.scrim{position:fixed;inset:0;background:rgba(17,17,17,.32);z-index:40;opacity:0;pointer-events:none;transition:opacity .18s}
.scrim.on{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(520px,100%);background:var(--surface);z-index:41;transform:translateX(100%);transition:transform .22s ease;display:flex;flex-direction:column;box-shadow:-8px 0 30px rgba(0,0,0,.12)}
.drawer.on{transform:none}
.dh{display:flex;align-items:center;gap:8px;padding:14px 18px;border-bottom:1px solid var(--line-2)}
.dh .saved{font-size:12px;color:var(--green);opacity:0;transition:opacity .2s}
.dh .saved.on{opacity:1}
.dh .sp{flex:1}
.iconbtn{border:0;background:none;border-radius:8px;width:34px;height:34px;display:grid;place-items:center;cursor:pointer;color:var(--muted)}
.iconbtn:hover{background:var(--gray-soft);color:var(--ink)}
.db{flex:1;overflow-y:auto;padding:18px 20px 30px}
.dtitle{width:100%;border:0;outline:none;font-size:20px;font-weight:600;letter-spacing:-.01em;padding:4px 0;resize:none;background:transparent;line-height:1.3}
.dtitle::placeholder{color:#B5B1A5}
.dseg{margin:12px 0 18px}
.dseg .seg{display:flex}
.dseg .seg button{flex:1}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fgrid .full{grid-column:1/-1}
.dmeta{font-size:12px;color:var(--muted);margin-top:14px;display:flex;flex-wrap:wrap;gap:4px 14px}
.dsec{margin-top:24px}
.dsec h3{font-size:13px;font-weight:600;margin:0 0 10px;display:flex;align-items:center;gap:8px}
.upd{display:flex;gap:10px;padding:10px 0;border-top:1px solid var(--line-2)}
.upd .body{font-size:13.5px;white-space:pre-wrap;word-break:break-word}
.upd .m{font-size:12px;color:var(--muted);margin-bottom:2px}
.upd.sys .body{color:var(--muted);font-size:12.5px}
.ck h3 .ck-n{margin-left:auto;font-weight:500;color:var(--muted);font-size:12px}
.ckbar{height:5px;background:var(--gray-soft);border-radius:5px;overflow:hidden;margin:-2px 0 8px}
.ckbar i{display:block;height:100%;background:var(--green)}
.ck-list{display:grid}
.ck-row{display:flex;align-items:center;gap:10px;padding:5px 0;border-bottom:1px solid var(--line-2);min-width:0}
.ck-row .tcheck{flex:none}
.ck-row .tcheck.on{background:var(--green);border-color:var(--green);color:#fff}
.ck-t{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:13.5px;line-height:1.4;padding:4px 6px;margin-left:-6px;border-radius:6px;outline:none;color:var(--ink);resize:none;overflow:hidden;display:block;word-break:break-word}
.ck-row{align-items:flex-start}.ck-row .tcheck{margin-top:3px}.ck-row .ck-by{margin-top:6px}.ck-row .ck-x{margin-top:1px}
textarea.ck-t:hover{background:var(--surface-2)}
textarea.ck-t:focus{background:var(--surface);box-shadow:0 0 0 2px rgba(177,162,118,.35)}
span.ck-t{padding-left:0;margin-left:0}
.ck-row.done .ck-t{color:var(--muted);text-decoration:line-through;text-decoration-color:#C9C5B8}
.ck-by{font-size:11.5px;color:var(--muted);white-space:nowrap;flex:none}
.ck-x{border:0;background:none;color:var(--muted);cursor:pointer;padding:4px;border-radius:6px;opacity:0;display:grid;place-items:center;flex:none}
.ck-x svg.i{width:14px;height:14px}
.ck-row:hover .ck-x,.ck-x:focus{opacity:1}
.ck-x:hover{background:var(--gray-soft);color:var(--red)}
.ck-add{display:flex;align-items:center;gap:10px;padding:6px 0}
.ck-plus{width:20px;display:grid;place-items:center;color:var(--muted);flex:none}
.ck-plus svg.i{width:15px;height:15px}
.ck-new{flex:1;min-width:0;border:0;border-bottom:1px dashed var(--line);background:transparent;font:inherit;font-size:13.5px;padding:6px 0;outline:none}
.ck-new:focus{border-bottom-color:var(--khaki)}
.ckp{display:inline-flex;align-items:center;gap:3px;font-size:11.5px;font-weight:500;color:var(--muted);background:var(--gray-soft);border-radius:5px;padding:1px 6px;flex:none}
.ckp.all{background:var(--green-soft);color:var(--green)}
.df{padding:12px 18px;border-top:1px solid var(--line-2);display:flex;gap:8px;align-items:center}

/* Modal */
.modal{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:20px;background:rgba(17,17,17,.35)}
.modal .box{background:var(--surface);border-radius:14px;width:min(520px,100%);max-height:90vh;overflow:auto;box-shadow:0 20px 50px rgba(0,0,0,.2)}
.modal .mh{display:flex;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line-2)}
.modal .mh h2{font-size:16px;margin:0;font-weight:600}
.modal .mb{padding:18px 20px;display:grid;gap:14px;grid-template-columns:minmax(0,1fr)}
.modal .mb>*{min-width:0}
.modal .box{overflow-x:hidden}
.modal .kv div{overflow-wrap:anywhere}
.modal .mf{padding:14px 20px;border-top:1px solid var(--line-2);display:flex;justify-content:flex-end;gap:8px}

/* Toast / banners */
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--black);color:#fff;padding:10px 16px;border-radius:10px;z-index:60;font-size:13px;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.toast.err{background:var(--red)}
.banner{background:var(--amber-soft);color:#6B4A00;border:1px solid #F1DFA6;padding:10px 14px;border-radius:10px;margin-bottom:16px;font-size:13px}
.banner.info{background:var(--khaki-soft);color:#4E4630;border-color:#E3DCC6}

/* Login */
.login{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}
.login .art{background:var(--black);color:#fff;padding:48px;display:flex;flex-direction:column;justify-content:space-between}
.login .art h2{font-size:34px;font-weight:600;letter-spacing:-.02em;line-height:1.15;margin:0;max-width:420px}
.login .art h2 em{font-style:normal;color:var(--khaki)}
.login .art p{color:#A9A598;max-width:400px}
.login .form{display:grid;place-items:center;padding:40px 24px}
.login .form .inner{width:min(360px,100%);display:grid;gap:14px}
.login h1{font-size:22px;margin:0 0 4px;font-weight:650}

.loading{min-height:100vh;display:grid;place-items:center;color:var(--muted)}
.hide{display:none!important}

/* ---------- Admin ---------- */
.prow-p{display:grid;grid-template-columns:36px minmax(0,1fr) 80px 150px 100px 40px;gap:12px;align-items:center;padding:11px 16px;border-bottom:1px solid var(--line-2);cursor:pointer}
.prow-p:last-child{border-bottom:0}
.zebra>.prow-p:nth-child(even){background:#F8F6F1}
.zebra>.prow-p:hover{background:#F1EEE5}
.tcheck.ro{cursor:default;opacity:.55}
.tcheck.ro:hover{border-color:#C9C5B8;color:transparent}
.is-done .tcheck.ro{opacity:.7}
.modal .box.wide{width:min(760px,100%)}
.atabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:16px;overflow-x:auto;scrollbar-width:none}
.atabs a{padding:10px 12px;text-decoration:none;color:var(--muted);font-weight:500;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.atabs a.on{color:var(--ink);border-color:var(--khaki)}
.atabs a .c{font-size:11px;background:var(--red);color:#fff;padding:1px 6px;border-radius:10px;margin-left:5px}
.urow{display:grid;grid-template-columns:36px minmax(0,1.4fr) 100px minmax(0,1fr) 130px 90px;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line-2);cursor:pointer}
.urow:last-child{border-bottom:0}
.urow:hover{background:#FBFAF7}
.urow .m{font-size:12.5px;color:var(--muted)}
.rpill{font-size:11.5px;font-weight:600;padding:2px 8px;border-radius:6px;background:var(--gray-soft);color:#5B5850;justify-self:start}
.r-admin{background:#111;color:#fff}.r-finance{background:var(--blue-soft);color:var(--blue)}.r-owner{background:var(--khaki-soft);color:var(--khaki-deep)}.r-external{background:#F3E8F7;color:#7A4E8C}
.acc-list{max-height:34vh;overflow:auto;border:1px solid var(--line);border-radius:10px}
.acc-row{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line-2);font-size:13px}
.acc-row:last-child{border-bottom:0}
.acc-row .n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acc-row .select{width:auto;min-width:110px;padding-top:5px;padding-bottom:5px}
.check{display:flex;gap:8px;align-items:flex-start;font-size:13.5px;line-height:1.35}
.check input{margin-top:2px;flex:none}
.perm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px;border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.perm-h{font-size:11.5px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}
.perm-i{font-size:13px;padding:3px 0;align-items:center}
.perm-i input{margin-top:0}
.perm-ch{display:none;font-size:10.5px;font-weight:600;color:var(--khaki-deep);background:var(--khaki-soft);border-radius:4px;padding:0 5px;margin-left:auto}
.perm-i.changed .perm-ch{display:inline-block}
.perm-i.locked{opacity:.45}
.rp-c{font-size:10px;font-weight:600;background:rgba(0,0,0,.08);border-radius:4px;padding:0 4px;margin-left:3px;text-transform:uppercase;letter-spacing:.03em}
/* SOPs */
.srow2{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line-2);cursor:pointer;min-width:0}
.srow2:last-child{border-bottom:0}
.srow2:hover{background:#FBFAF7}
.sicon{width:30px;height:30px;border-radius:8px;background:var(--khaki-soft);color:var(--khaki-deep);display:grid;place-items:center;flex:none}
.sicon svg.i{width:16px;height:16px}
.sst{font-size:11px;font-weight:600;padding:1px 7px;border-radius:5px;white-space:nowrap;flex:none}
.st-draft{background:var(--gray-soft);color:#5B5850}.st-pending{background:var(--amber-soft);color:var(--amber)}.st-changes_requested{background:var(--red-soft);color:var(--red)}
.sbanner{display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap;background:var(--khaki-soft);border:1px solid #E3DCC6;border-radius:10px;padding:10px 14px;margin-bottom:12px;font-size:13px}
.sbanner.pend{background:var(--amber-soft);border-color:#F1DFA6;color:#5A4200}
.sbanner.ret{background:var(--red-soft);border-color:#F4C7C2;color:#6E1A12}
.sbanner>div:first-child{flex:1 1 260px;min-width:0}
.sb-acts{display:flex;gap:6px;flex-wrap:wrap}
.sb-note{margin-top:4px;white-space:pre-wrap;word-break:break-word;color:var(--ink)}
.sop-tabs{margin-bottom:12px}
.sop-card{padding:4px 6px}
.sop-doc{padding:16px 20px;font-size:15px;line-height:1.6;color:var(--ink);overflow-wrap:anywhere}
.sop-doc>*:first-child{margin-top:0}
.sop-doc p{margin:0 0 8px}
.sop-doc h2{font-size:18px;font-weight:650;margin:20px 0 6px;letter-spacing:-.01em}
.sop-doc h3{font-size:15.5px;font-weight:650;margin:16px 0 4px}
.sop-doc ol,.sop-doc ul{margin:0 0 10px;padding-left:26px}
.sop-doc li{margin:3px 0;padding-left:2px}
.sop-doc ol>li::marker{font-weight:600;color:var(--khaki-deep)}
.sop-doc li[data-list]{list-style:none;position:relative}
.sop-doc li[data-list]::before{content:"";position:absolute;left:-24px;top:5px;width:14px;height:14px;border:1.6px solid #C9C5B8;border-radius:4px;background:#fff}
.sop-doc li[data-list="checked"]::before{background:var(--green);border-color:var(--green)}
.sop-doc li[data-list="checked"]::after{content:"";position:absolute;left:-19px;top:7px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.sop-doc img{max-width:100%;height:auto;border:1px solid var(--line);border-radius:8px;margin:6px 0}
.sop-doc a{color:var(--blue)}
.sop-doc blockquote{border-left:3px solid var(--khaki);margin:8px 0;padding:2px 0 2px 12px;color:var(--ink-2)}
.se-card{padding:16px 18px}
.se-all{display:flex}.se-all button{flex:1}
.se-props{max-height:220px}
.se-ed{margin-top:16px}
.se-ed .ql-toolbar.ql-snow{border:1px solid var(--line);border-radius:10px 10px 0 0;background:var(--surface-2);font-family:inherit}
.se-ed .ql-container.ql-snow{border:1px solid var(--line);border-top:0;border-radius:0 0 10px 10px;font:15px/1.6 Inter,system-ui,sans-serif}
.se-ed .ql-editor{min-height:340px}
.se-ed .ql-editor img{max-width:100%}
.se-bar{position:sticky;bottom:0;z-index:12;display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-top:12px;box-shadow:0 -4px 16px rgba(0,0,0,.05)}
.se-state{font-size:12.5px}
.rtable .rrow{display:grid;grid-template-columns:minmax(0,1fr) repeat(3,104px);gap:10px;align-items:center;padding:9px 16px;border-bottom:1px solid var(--line-2);font-size:13.5px}
.rtable .rrow:last-child{border-bottom:0}
.rtable .rh{background:var(--surface-2);align-items:end}
.rtable .rg{background:var(--surface-2);font-size:11.5px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;padding-top:7px;padding-bottom:7px}
.rtable .rc{text-align:center}
.rtable input{width:17px;height:17px;cursor:pointer}
/* Categories, vault, contacts, details */
.crow{display:flex;align-items:center;gap:10px;padding:11px 16px;border-bottom:1px solid var(--line-2);min-width:0}
.crow:last-child{border-bottom:0}
.cord{display:flex;flex-direction:column}
.cord .iconbtn{width:26px;height:20px}
.cord .iconbtn:first-child svg{transform:rotate(180deg)}
.cord .iconbtn:disabled{opacity:.25;cursor:default}
.lrow{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1.2fr) auto;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line-2)}
.lrow:last-child{border-bottom:0}
.l-open{font-size:12px;font-weight:500;color:var(--blue);text-decoration:none;display:inline-flex;align-items:center;gap:2px;white-space:nowrap}
.l-notes{white-space:normal}
.l-field{display:grid;gap:1px;min-width:0}
.l-k{font-size:11px;color:var(--muted);font-weight:500;text-transform:uppercase;letter-spacing:.04em}
.l-v{display:flex;align-items:center;gap:6px;min-width:0;font-size:13.5px;overflow-wrap:anywhere;flex-wrap:wrap}
.pw{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:.06em}
.pw.shown{background:var(--amber-soft);padding:0 5px;border-radius:4px;letter-spacing:0}
.cpy{border:1px solid var(--line);background:var(--surface);border-radius:6px;font-size:11.5px;padding:1px 7px;cursor:pointer;color:var(--ink-2)}
.cpy:hover{border-color:var(--khaki)}
.l-acts{display:flex;gap:2px;justify-content:flex-end}
.pwbox{display:flex;gap:6px;align-items:center}
.corow{display:grid;grid-template-columns:34px minmax(0,1.4fr) minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line-2)}
.corow:last-child{border-bottom:0}
.co-links{display:flex;flex-direction:column;gap:2px;min-width:0}
.co-l{font-size:13px;color:var(--blue);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.co-notes{white-space:normal}
.ctype{font-size:11px;font-weight:600;background:var(--khaki-soft);color:var(--khaki-deep);border-radius:5px;padding:1px 6px;white-space:nowrap}
.bn-dot{position:absolute;top:6px;right:calc(50% - 16px);width:8px;height:8px;border-radius:50%;background:var(--red)}
.bottomnav a{position:relative}
.dtiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:12px}
.dtile{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:10px 14px;text-decoration:none;display:flex;align-items:baseline;gap:8px;box-shadow:var(--shadow);color:var(--muted);font-size:13px}
.dtile .num{font-size:20px;font-weight:650;color:var(--ink)}
.dtile:hover{border-color:var(--khaki)}
.dgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.dgrid .full{grid-column:1/-1}
.dcard .card-h{padding:11px 16px}
.dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px;padding:14px 16px}
.dl-i.full{grid-column:1/-1}
.dl-k{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:2px}
.dl-v{font-size:14px;overflow-wrap:anywhere}
.dl-link{font-size:12px;margin-left:6px;color:var(--blue)}
.dnotes{padding:14px 16px;white-space:pre-wrap;font-size:14px;overflow-wrap:anywhere}
.ufoot{display:flex;gap:4px;flex-wrap:wrap;border-top:1px solid var(--line-2);padding-top:10px;margin-top:2px}
.audit .ar{display:grid;grid-template-columns:120px 150px minmax(0,1fr);gap:12px;padding:11px 16px;border-bottom:1px solid var(--line-2);font-size:13px}
.audit .ar:last-child{border-bottom:0}
.audit .ar.click{cursor:pointer}.audit .ar.click:hover{background:#FBFAF7}
.audit .when{color:var(--muted);font-size:12px}
.audit .who{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px}
.audit .act{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:1px 6px;border-radius:4px;margin-right:6px}
.act-INSERT{background:var(--green-soft);color:var(--green)}.act-UPDATE{background:var(--blue-soft);color:var(--blue)}.act-DELETE{background:var(--red-soft);color:var(--red)}
.audit .diff{margin-top:5px;display:grid;gap:2px;font-size:12.5px}
.audit .diff .f{color:var(--muted)}
.audit .diff del{color:var(--red);text-decoration:line-through;text-decoration-color:rgba(180,35,24,.4);word-break:break-word}
.audit .diff ins{color:var(--green);text-decoration:none;word-break:break-word}
.audit.compact .ar{grid-template-columns:1fr;gap:2px;padding:10px 0}
.srow{padding:14px 18px;border-bottom:1px solid var(--line-2);display:grid;gap:6px}
.srow:last-child{border-bottom:0}
.srow .vals{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;font-size:13.5px}
.srow del{color:var(--red);word-break:break-word}.srow ins{color:var(--green);text-decoration:none;font-weight:500;word-break:break-word}
.afilters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.afilters .select,.afilters .input{width:auto;flex:1 1 150px;min-width:0}

/* ---------- Quick menus, selection, bulk bar, search, my work ---------- */
.menu{position:fixed;z-index:70;width:250px;max-height:360px;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.16);padding:6px;display:none}
.menu.on{display:block}
.menu-h{font-size:11.5px;font-weight:600;color:var(--muted);padding:6px 10px 4px;text-transform:uppercase;letter-spacing:.05em}
.menu-g{font-size:11px;color:#A9A598;padding:8px 10px 2px;font-weight:600}
.menu-i{display:flex;width:100%;align-items:center;gap:8px;border:0;background:none;text-align:left;padding:8px 10px;border-radius:8px;cursor:pointer;font-size:13.5px;justify-content:space-between}
.menu-i:hover{background:var(--gray-soft)}
.menu-i.on{font-weight:600}
.menu-i svg.i{width:15px;height:15px;color:var(--green)}
.qbtn{border:0;cursor:pointer;font:inherit;font-size:12px;font-weight:500}
.qbtn:hover{filter:brightness(.95);box-shadow:0 0 0 2px rgba(177,162,118,.35)}
.qa{border:0;background:none;padding:3px 6px;margin:-3px -6px;border-radius:7px;cursor:pointer;font:inherit;max-width:100%;text-align:left}
.qa:hover{background:var(--gray-soft)}
.tsel{width:20px;height:20px;border-radius:50%;border:1.8px solid #C9C5B8;background:#fff;display:grid;place-items:center;padding:0;cursor:pointer;color:transparent}
.tsel svg{width:12px;height:12px;stroke-width:3.2}
.tsel.on{background:var(--khaki);border-color:var(--khaki);color:#111}
.tsel.ro{opacity:.35;cursor:default}
.selecting .trow{user-select:none}
.bulkbar{position:fixed;left:calc(var(--side) + 24px);right:24px;bottom:18px;z-index:30;background:var(--black);color:#fff;border-radius:14px;padding:10px 12px 10px 18px;display:flex;align-items:center;gap:12px;box-shadow:0 12px 30px rgba(0,0,0,.25);flex-wrap:wrap}
.bulkbar .bb-acts{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.bulkbar .btn{background:#262624;border-color:#3A3935;color:#fff}
.bulkbar .btn:hover{background:#333230}
.bulkbar .btn.danger{color:#FFB4AA}
.bulkbar .btn:disabled{opacity:.45;cursor:default}
.bb-date{position:relative;overflow:hidden}
.bb-date input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.page:has(.bulkbar){padding-bottom:120px}
.sbtn{display:flex;align-items:center;gap:9px;width:100%;margin:0 0 14px;padding:8px 10px;border-radius:9px;border:1px solid #2C2B28;background:#1A1A19;color:#9C988D;cursor:pointer;font-size:13px}
.sbtn:hover{border-color:#3A3935;color:#EDEBE4}
.sbtn kbd,.search-hint kbd{margin-left:auto;font:inherit;font-size:11px;background:#2C2B28;color:#B5B1A5;border-radius:5px;padding:1px 6px}
.search-hint kbd{background:var(--gray-soft);color:var(--muted);margin:0 2px}
.search-ov{position:fixed;inset:0;z-index:65;background:rgba(17,17,17,.35);display:none;padding:10vh 16px 16px}
.search-ov.on{display:block}
.search-box{max-width:600px;margin:0 auto;background:var(--surface);border-radius:14px;box-shadow:0 20px 50px rgba(0,0,0,.25);overflow:hidden}
.search-in{display:flex;align-items:center;gap:10px;padding:10px 12px 10px 16px;border-bottom:1px solid var(--line-2)}
.search-in svg.i{color:var(--muted)}
.search-in input{flex:1;border:0;outline:none;font-size:16px;padding:6px 0;background:transparent;min-width:0}
.search-res{max-height:60vh;overflow:auto;padding:6px}
.search-hint{padding:18px 12px;color:var(--muted);font-size:13px}
.sr-g{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;padding:10px 10px 4px}
.sr{display:flex;align-items:center;gap:10px;width:100%;border:0;background:none;text-align:left;padding:9px 10px;border-radius:9px;cursor:pointer;min-width:0}
.sr:hover,.sr:focus{background:var(--gray-soft);outline:none}
.sr svg.i{color:var(--muted);width:16px;height:16px}
.sr-t{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.sr-m{margin-left:auto;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:45%;padding-left:8px}
.mywork{margin-bottom:18px}
.mywork .seg button{font-size:12.5px}

.req{color:var(--red);font-weight:700}
.invalid{border-color:var(--red)!important;box-shadow:0 0 0 3px rgba(180,35,24,.12)!important}
.dtitle.invalid{box-shadow:none!important;border-bottom:2px solid var(--red)!important}
.mention{color:var(--blue);font-weight:600;background:var(--blue-soft);border-radius:4px;padding:0 3px}
.sbar{display:flex;gap:6px;margin:0 0 14px}
.sbar .sbtn{margin:0;flex:1;min-width:0}
.bellbtn{position:relative;width:38px;flex:none;border-radius:9px;border:1px solid #2C2B28;background:#1A1A19;color:#9C988D;cursor:pointer;display:grid;place-items:center}
.bellbtn:hover{border-color:#3A3935;color:#EDEBE4}
.bellbtn .dot,.bellm .dot{position:absolute;top:-5px;right:-5px;min-width:17px;height:17px;border-radius:9px;background:var(--red);color:#fff;font-size:10.5px;font-weight:700;display:grid;place-items:center;padding:0 4px}
.bellm{position:relative}
.nrow{display:flex;gap:10px;width:100%;border:0;background:none;text-align:left;padding:10px;border-radius:10px;cursor:pointer;align-items:flex-start}
.nrow:hover{background:var(--gray-soft)}
.nrow.unread{background:#F7F4EA}
.nrow .nt{display:grid;gap:2px;flex:1;min-width:0;font-size:13.5px}
.nrow .nm{font-size:12px;color:var(--muted)}
.nrow .nb{font-size:12.5px;color:var(--ink-2);background:var(--surface-2);border-left:2px solid var(--khaki);padding:4px 8px;border-radius:0 6px 6px 0;margin-top:3px;white-space:pre-wrap;word-break:break-word}
.ndot{width:8px;height:8px;border-radius:50%;background:var(--red);flex:none;margin-top:6px}

/* ---------- Mobile ---------- */
@media (max-width:1240px){
  .ptable .prow{grid-template-columns:minmax(0,1.8fr) 100px 104px 50px 60px 56px 100px minmax(0,1.3fr)}
  .ptable .pc-sw,.ptable .pc-hide{display:none}
}
@media (max-width:1180px){
  .trow{grid-template-columns:28px minmax(0,1fr) 120px 118px 76px 80px 100px}
  .trow.noprop{grid-template-columns:28px minmax(0,1fr) 118px 76px 80px 100px}
  .trow.compact{grid-template-columns:28px minmax(0,1fr) 84px 108px}
  .trow .tprio,.trow.th button.tprio{display:none}
  .prio-in{display:inline-block}
  .toolbar .tsortsel{display:block;width:auto;min-width:0;flex:0 1 auto}
}
@media (max-width:1100px){
  .kpis{grid-template-columns:repeat(3,1fr)}
  .board .brow{grid-template-columns:minmax(0,1.6fr) 104px 52px 60px 56px minmax(0,1.2fr)}
  .board.ob .brow{grid-template-columns:minmax(0,1.6fr) 112px 60px 66px 62px}
  .board .brow .bq{display:none}
}
@media (max-width:860px){
  .side{display:none}
  .main{margin-left:0}
  .topbar{display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:15;background:var(--black);color:#fff;padding:10px 16px;padding-top:calc(10px + env(safe-area-inset-top))}
  .topbar .brand{padding:0}
  .topbar .brand-mark{width:30px;height:30px;font-size:12px}
  .topbar .sp{flex:1}
  .topbar .iconbtn{color:#CFCBC0}
  .bottomnav{display:flex;position:fixed;left:0;right:0;bottom:0;background:var(--surface);border-top:1px solid var(--line);z-index:15;padding-bottom:env(safe-area-inset-bottom)}
  .bottomnav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 0 7px;font-size:11px;color:var(--muted);text-decoration:none;font-weight:500}
  .bottomnav a.on{color:var(--ink)}
  .bottomnav a.on svg{color:var(--khaki-deep)}
  .page{padding:18px 16px 96px}
  .ph h1{font-size:21px}
  .kpis{grid-template-columns:repeat(2,1fr);gap:10px}
  .kpis .kpi:last-child{grid-column:1/-1}
  .kpi .v{font-size:24px}
  .grid2{grid-template-columns:minmax(0,1fr)}
  .orow{padding:11px 14px}
  .orow .tsub{white-space:normal}
  .board .bh{display:none}
  .board .brow,.board.ob .brow{grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:12px 16px}
  .board .bbooks .bcell{justify-items:end}
  .glance{grid-template-columns:minmax(0,1fr);gap:10px}
  .main.va .topbar{position:static}
  .vabar{padding:8px 12px;font-size:12.5px}
  .vabar .va-s{display:none}
  .board .brow .bmob{flex-wrap:wrap}
  .board .brow>*{display:none}
  .board .brow .bname,.board .brow .bbooks{display:block}
  .board .brow .bmob{display:flex;grid-column:1/-1;gap:14px;font-size:12px;color:var(--muted)}
  .ptable .prow{grid-template-columns:minmax(0,1fr) auto;padding:12px 14px}
  .ptable .prow>*{display:none}
  .ptable .prow>.pc-name,.ptable .prow>.pc-book:not(.pc-hide){display:block}
  .ptable .ph-row{display:none}
  .pmob{display:block;font-size:12px;color:var(--muted);margin-top:3px}
  .trow,.trow.noprop,.trow.compact{grid-template-columns:24px minmax(0,1fr);gap:10px;padding:12px 14px}
  .trow .tprop,.trow .tassignee,.trow .tdue,.trow .tstatus,.trow .tcreated{display:none}
  .trow.th{display:none}
  .tmob{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin-top:6px;font-size:12px;color:var(--muted)}
  .toolbar .search{max-width:none;flex:1 1 60%}
  .filters{display:none;flex-wrap:wrap;gap:8px;width:100%}
  .filters.on{display:flex}
  .toolbar .select{flex:1 1 130px;min-width:0}
  .seg button{padding:6px 9px}
  .phero{padding:12px 14px}
  .pbooks{margin-left:0}
  .phero h1{font-size:20px}
  .kv{grid-template-columns:120px 1fr}
  .kv div{padding:9px 14px}
  .fgrid{grid-template-columns:minmax(0,1fr)}
  .modal{padding:10px}
  .modal .mb{padding:16px}
  .acc-row .select{min-width:96px}
  .perm-grid{grid-template-columns:minmax(0,1fr)}
  .lrow{grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;padding:12px 14px}
  .lrow .l-main{grid-column:1}.lrow .l-acts{grid-column:2;grid-row:1}
  .lrow .l-field{grid-column:1/-1;grid-template-columns:76px minmax(0,1fr);align-items:center}
  .corow{grid-template-columns:34px minmax(0,1fr) auto;gap:6px 10px;padding:12px 14px}
  .corow .co-links{grid-column:2/-1;flex-direction:row;flex-wrap:wrap;gap:4px 12px}
  .dgrid{grid-template-columns:minmax(0,1fr)}
  .dl{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px 14px;padding:12px 14px}
  .crow{padding:11px 14px;flex-wrap:wrap}
  .rtable .rrow{grid-template-columns:minmax(0,1fr) repeat(3,62px);gap:6px;padding:9px 12px;font-size:13px}
  .rtable .rh .rpill{font-size:10.5px;padding:2px 5px}
  .se-card{padding:14px}
  .se-ed .ql-editor{min-height:260px}
  .se-bar{bottom:calc(60px + env(safe-area-inset-bottom));padding:8px 10px}
  .se-bar .se-state{display:none}
  .sop-doc{padding:12px 14px;font-size:14.5px}
  .login{grid-template-columns:1fr}
  .login .art{display:none}
  .ritem .x{opacity:1}
  .ck-x{opacity:1}
  .ck-by{display:none}
  .urow{grid-template-columns:32px minmax(0,1fr) auto;gap:4px 10px}
  .prow-p{grid-template-columns:32px minmax(0,1fr) 36px;gap:10px;padding:12px 14px}
  .urow .u-access,.urow .u-seen{display:none}
  .urow .u-mob{display:block!important}
  .audit .ar{grid-template-columns:1fr;gap:3px;padding:11px 14px}
  .bottomnav a{font-size:10.5px}
  .menu{left:8px!important;right:8px;bottom:calc(8px + env(safe-area-inset-bottom));top:auto!important;width:auto;max-height:60vh;border-radius:16px;padding:8px}
  .menu-i{padding:12px 10px;font-size:15px}
  .bulkbar{left:8px;right:8px;bottom:calc(66px + env(safe-area-inset-bottom));padding:10px;gap:8px}
  .bulkbar .bb-acts{margin-left:0;width:100%}
  .bulkbar .bb-acts .btn{flex:1 1 auto;justify-content:center}
  .search-ov{padding:8px}
  .sr-m{display:none}
  .mywork .card-h .seg{margin-left:0!important;width:100%}
  .mywork .card-h .seg button{flex:1;padding:6px 4px;font-size:12px}
  .fab{position:fixed;right:16px;bottom:calc(72px + env(safe-area-inset-bottom));width:52px;height:52px;border-radius:50%;background:var(--black);color:#fff;border:0;display:grid;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.25);z-index:16}
  .fab svg{width:22px;height:22px}
  .desk{display:none!important}
}
@media (min-width:861px){ .fab{display:none} .mob{display:none!important} }

/* Where something belongs: Company / All properties / Selected (scope.js) */
.scope{display:inline-flex;align-items:center;font-size:11px;font-weight:600;border-radius:5px;padding:1px 7px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis;letter-spacing:0;text-transform:none;vertical-align:1px}
.sc-company{background:#111;color:#F3F0E6}
.sc-all{background:var(--blue-soft);color:var(--blue)}
.sc-selected{background:var(--khaki-soft);color:var(--khaki-deep)}
.sect .scope{font-size:11.5px;padding:2px 8px}
.subhead{display:flex;align-items:center;gap:8px;padding:9px 16px;background:var(--surface-2);border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2);font-size:12px;color:var(--muted);font-weight:500}
.co-sub{display:flex;align-items:center;gap:6px;flex-wrap:wrap;white-space:normal}
.scopebox{display:grid;gap:8px}
.scope-seg{display:flex}.scope-seg button{flex:1}
.scope-help{font-size:12px}

/* AI (ai.js) */
.ai-tag{display:inline-flex;align-items:center;font-size:11px;font-weight:700;letter-spacing:.03em;color:var(--khaki-deep);background:var(--khaki-soft);border-radius:5px;padding:2px 7px;white-space:nowrap}
.ai-bar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:14px;padding:8px 10px;border:1px dashed #D9CFAF;border-radius:10px;background:#FCFBF6}
.ai-bar + .se-ed{margin-top:10px}
.ai-tools{display:flex;align-items:center;gap:4px 10px;flex-wrap:wrap;margin-top:6px}
.ai-link{border:0;background:none;padding:2px 0;color:var(--blue);font:inherit;font-size:12.5px;font-weight:500;cursor:pointer}
.ai-link:hover{text-decoration:underline}
.ai-inline{flex-basis:100%;border:1px solid #E3DCC6;background:#FCFBF6;border-radius:10px;padding:10px 12px;display:grid;gap:8px}
.ai-inline[hidden]{display:none}
.ai-out{white-space:pre-wrap;font-size:13.5px;overflow-wrap:anywhere}
.ai-acts{display:flex;gap:6px;flex-wrap:wrap}
.ai-items{margin:0;padding-left:20px;font-size:13.5px}
.ai-note{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ai-prev{border:1px solid var(--line);border-radius:10px;max-height:55vh;overflow:auto}
.ai-sugg{margin:0;padding-left:20px;display:grid;gap:6px;font-size:14px}
.ai-busy{position:fixed;left:50%;top:18px;transform:translateX(-50%);z-index:80;background:var(--black);color:#fff;border-radius:20px;padding:8px 16px;font-size:13px;display:flex;align-items:center;gap:8px;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.ai-dot{width:8px;height:8px;border-radius:50%;background:var(--khaki);animation:aipulse 1s ease-in-out infinite}
@keyframes aipulse{0%,100%{opacity:.35}50%{opacity:1}}


/* Admin › Emails (emails.js) */
.em-status{display:flex;align-items:center;gap:12px 16px;flex-wrap:wrap;padding:12px 16px;border-radius:12px;border:1px solid var(--line);background:var(--surface);margin-bottom:14px}
.em-status.test{background:var(--amber-soft);border-color:#F1DFA6}
.em-status.live{background:var(--green-soft);border-color:#CDE7D7}
.em-status.off{background:var(--gray-soft)}
.em-st-t{display:flex;gap:10px;align-items:flex-start;flex:1;min-width:240px}
.em-st-d{font-size:12.5px;color:var(--ink-2);margin-top:2px}
.em-dot{width:10px;height:10px;border-radius:50%;margin-top:5px;flex:none;background:var(--muted)}
.test .em-dot{background:var(--amber)}.live .em-dot{background:var(--green)}
.em-st-a{display:flex;gap:6px;flex-wrap:wrap}
.em-sub{margin-bottom:14px}
.em-sub button .c{color:var(--red)}
.em-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.em-wide,.em-save{grid-column:1/-1}
.em-card .card-h{padding:12px 16px}
.em-cb{padding:14px 16px;display:grid;gap:12px}
.em-help{font-size:12.5px;line-height:1.45;margin-top:4px}
.em-save{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.em-days{display:flex;gap:6px;flex-wrap:wrap}
.em-day{position:relative;cursor:pointer}
.em-day input{position:absolute;opacity:0;pointer-events:none}
.em-day span{display:inline-block;min-width:44px;text-align:center;padding:7px 8px;border:1px solid var(--line);border-radius:8px;font-size:13px;font-weight:500;color:var(--muted);background:var(--surface)}
.em-day input:checked + span{background:var(--black);border-color:var(--black);color:#fff}
.em-day input:focus-visible + span{outline:2px solid var(--khaki);outline-offset:2px}
.em-checks{display:grid;gap:6px}
.select.sm{height:32px;padding-top:4px;padding-bottom:4px;font-size:13px}
.em-p-blue{background:var(--blue-soft);color:var(--blue)}
.emt .emt-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 18px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line-2)}
.emt .emt-row:last-child{border-bottom:0}
.emt .emt-row:nth-child(even){background:var(--surface-2)}
.emt .emt-row.off .emt-main b,.emt .emt-row.off .emt-subj{color:var(--muted)}
.emt-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.emt-who{white-space:normal;margin-top:3px}
.emt-subj{font-size:12.5px;color:var(--ink-2);margin-top:4px;overflow-wrap:anywhere}
.emt-acts{display:flex;gap:14px;margin-top:4px}
.emt-roles{display:grid;grid-template-columns:repeat(4,142px);gap:8px}
.emt-roles.emt-na{display:block;max-width:300px;font-size:12.5px}
.emt-role{display:grid;gap:4px}
.emt-role .rpill{font-size:10.5px}
.em-switch{position:relative;display:inline-block;width:34px;height:20px;flex:none;cursor:pointer}
.em-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.em-switch span{position:absolute;inset:0;border-radius:20px;background:#D6D2C6;transition:background .15s;pointer-events:none}
.em-switch span::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .15s}
.em-switch input:checked + span{background:var(--green)}
.em-switch input:checked + span::after{transform:translateX(14px)}
.em-switch input:focus-visible + span{outline:2px solid var(--khaki);outline-offset:2px}
.em-vars{font-size:12.5px;line-height:1.55;background:var(--surface-2);border-radius:8px;padding:10px 12px;display:grid;gap:4px}
.em-prow{grid-template-columns:36px minmax(0,1fr) 90px auto}
.emp{display:grid;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.emp-h{font-size:11.5px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;padding:8px 12px;background:var(--surface-2);border-bottom:1px solid var(--line-2)}
.emp-row{display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:6px 12px;align-items:center;padding:9px 12px;border-bottom:1px solid var(--line-2);font-size:13.5px}
.emp-row:last-child{border-bottom:0}
.emp-row.off b{color:var(--muted)}
.em-pa{display:flex;gap:8px;flex-wrap:wrap}
.em-cb .select{max-width:100%}
.em-frame-h b{min-width:0}
.em-frame-wrap{margin-top:14px;display:grid;gap:10px;justify-items:center}
.em-frame-h{justify-self:stretch;font-size:13.5px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;overflow-wrap:anywhere}
.em-frame{width:100%;height:700px;border:1px solid var(--line);border-radius:12px;background:#F6F5F1}
.em-logbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.em-l1{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
@media (max-width:1100px){
  .emt .emt-row{grid-template-columns:minmax(0,1fr)}
  .emt-roles{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:860px){
  .em-grid{grid-template-columns:minmax(0,1fr)}
  .emt-roles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .emp-row{grid-template-columns:minmax(0,1fr)}
  .em-prow{grid-template-columns:32px minmax(0,1fr) auto}
  .em-prow > div:last-child{grid-column:2/-1}
  .em-st-a{width:100%}
  .em-st-a .btn{flex:1}
}

/* Property setup (property-setup.js) */
.phero-img{flex:none;width:64px;height:64px;border-radius:10px;overflow:hidden;border:1px solid var(--line);display:block}
.phero-img img{width:100%;height:100%;object-fit:cover;display:block}
.pphoto{margin:14px 16px 0;border-radius:10px;overflow:hidden;position:relative;background:var(--surface-2);height:240px;display:flex;align-items:center;justify-content:center}
.dgrid{align-items:start}
.pphoto img{width:100%;height:100%;object-fit:cover;display:block}
.pphoto.empty{height:auto;min-height:84px;border:1px dashed var(--line)}
.pphoto-add{border:0;background:none;display:flex;align-items:center;gap:6px;color:var(--muted);font:inherit;font-weight:500;cursor:pointer;padding:22px}
.pphoto-add:hover{color:var(--ink)}
.pphoto-acts{position:absolute;right:8px;bottom:8px;display:flex;gap:6px}
.pphoto-acts .btn{background:rgba(255,255,255,.92)}
.scard .card-h{flex-wrap:wrap}
.scard .card-h .meta{margin-left:auto}
.sbody{padding:10px 16px 12px;display:grid;gap:8px}
.srow{display:grid;grid-template-columns:170px minmax(0,1fr);gap:12px;align-items:center}
.srow-l{min-width:0;display:grid}
.srow-l b{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.srow-l span{font-size:11.5px;color:var(--muted)}
.sblks{display:flex;gap:4px;flex-wrap:wrap}
.sblk{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:30px;padding:0 6px;border-radius:7px;border:1px solid transparent;font:inherit;font-size:11.5px;font-weight:600;cursor:default;line-height:1}
button.sblk{cursor:pointer}
button.sblk:hover{filter:brightness(.96);box-shadow:0 0 0 2px var(--khaki-soft)}
.sblk i{font-style:normal;font-weight:500;opacity:.7;font-size:10px;margin-left:2px}
.s-closed,.s-done{background:var(--green-soft);color:var(--green);border-color:#C9E6D3}
.s-in_review{background:var(--amber-soft);color:var(--amber);border-color:#F1DFA6}
.sblk.s-open{background:var(--gray-soft);color:#5B5850;border-color:var(--line)}
.s-late{background:var(--red-soft);color:var(--red);border-color:#F3C5C0}
.s-none{background:var(--surface);color:var(--faint,#A9A598);border-color:var(--line);border-style:dashed}
.slegend{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;font-size:11.5px;color:var(--muted);padding-top:4px;border-top:1px solid var(--line-2);margin-top:2px}
.slegend .sblk{min-width:14px;width:14px;height:14px;padding:0;border-radius:4px;margin-left:6px}
.slegend .sblk:first-child{margin-left:0}
.slegend .sblk{flex:none!important}
.own-list{display:grid;gap:4px}
.own-list > div{display:flex;justify-content:space-between;gap:10px;font-size:13.5px;padding:4px 0;border-bottom:1px solid var(--line-2)}
.own-list > div:last-child{border-bottom:0}
.own-warn{color:var(--amber);font-size:12px;border:0!important}
.own-h{display:flex;align-items:center;justify-content:space-between;margin:14px 0 6px}
.own-total{font-size:12.5px;color:var(--green);font-weight:600}
.own-total.bad{color:var(--amber)}
.own-row{display:grid;grid-template-columns:minmax(0,1fr) 120px 32px;gap:6px;align-items:center;margin-bottom:6px}
.own-pct{display:flex;align-items:center;gap:4px}
.own-pct span{color:var(--muted)}
.trk-list{display:grid;gap:6px;max-height:40vh;overflow:auto;padding:2px}
.trk-new{display:grid;gap:10px;border-top:1px solid var(--line-2);padding-top:12px}
@media (max-width:860px){
  .srow{grid-template-columns:minmax(0,1fr);gap:5px}
  .sblk{min-width:0;flex:1 0 calc(16.66% - 4px)}
  .phero-img{width:48px;height:48px}
  .own-row{grid-template-columns:minmax(0,1fr) 92px 32px}
}

/* Maps (maps.js) */
.map-slot{position:relative;border-radius:10px;overflow:hidden;background:var(--surface-2);border:1px solid var(--line)}
.map-slot.mini{height:200px;margin:0 16px 16px}
.map-slot.big{height:min(68vh,640px);min-height:360px}
.map-el{position:absolute;inset:0}
.map-msg{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:16px;font-size:13px;color:var(--muted);gap:6px;flex-wrap:wrap}
.map-none{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 16px 16px;padding:10px 12px;border:1px dashed var(--line);border-radius:10px;font-size:13px}
.map-legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--muted);margin-bottom:10px}
.map-legend span{display:inline-flex;align-items:center;gap:6px}
.map-legend i{width:11px;height:11px;border-radius:50%;display:inline-block}
.map-off{font-size:12.5px;color:var(--muted);margin-top:10px;line-height:1.6}
.map-test{height:180px;border-radius:10px;overflow:hidden;border:1px solid var(--line)}
.toolbar .pview{margin-left:auto}
.pin-card{font-family:inherit;max-width:240px;display:grid;gap:3px;font-size:13px;color:var(--ink)}
.pin-card b{font-size:14px}
.pin-img{width:240px;max-width:100%;height:120px;border-radius:8px;overflow:hidden;margin-bottom:4px;background:var(--surface-2)}
.pin-img img{width:100%;height:100%;object-fit:cover;display:block}
.pin-img.sv-none{display:none}
.pin-sub{color:var(--muted);font-size:12px}
.pin-st{display:flex;align-items:center;gap:6px;font-weight:600;font-size:12.5px}
.pin-dot{width:9px;height:9px;border-radius:50%}
.pin-go{margin-top:4px;font-weight:600;color:var(--khaki-deep);text-decoration:none}
.pphoto.sv .sv-tag{position:absolute;left:8px;top:8px;font-size:11px;font-weight:600;color:#fff;background:rgba(0,0,0,.55);padding:2px 7px;border-radius:5px}
.pphoto.sv .sv-alt{display:none}
.pphoto.sv.sv-none{height:auto;min-height:84px;border:1px dashed var(--line)}
.pphoto.sv.sv-none .sv-alt{display:flex}
.pphoto.sv.sv-none .sv-tag,.pphoto.sv.sv-none .pphoto-acts{display:none}
.phero-img.sv-none{display:none}
.ac-wrap{position:relative}
.ac-list{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:90;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.12);overflow:hidden}
.ac-list[hidden]{display:none}
.ac-i{display:grid;gap:1px;width:100%;text-align:left;border:0;background:none;padding:9px 12px;font:inherit;font-size:13.5px;cursor:pointer;border-bottom:1px solid var(--line-2)}
.ac-i span{color:var(--muted);font-size:12px}
.ac-i:hover,.ac-i.on{background:var(--khaki-soft)}
.ac-by{font-size:10.5px;color:var(--muted);text-align:right;padding:4px 10px}
.em-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.em-stats div{background:var(--surface-2);border-radius:10px;padding:10px 12px;display:grid}
.em-stats b{font-size:20px}
.em-stats span{font-size:12px;color:var(--muted)}
@media (max-width:860px){
  .map-slot.big{height:62vh;min-height:320px}
  .toolbar .pview{margin-left:0}
}

/* Map panel, pins and groups (maps.js) */
.mappanel{margin-bottom:16px;overflow:hidden}
.mappanel .map-slot{border:0;border-radius:0;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
.map-slot.strip{height:280px}
.map-slot.dash{height:300px}
.mp-h{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;padding:10px 14px}
.mp-h h2{font-size:14px;font-weight:600;margin:0}
.mp-chips{display:flex;gap:6px;flex-wrap:wrap;flex:1;min-width:0}
.mchip{border:1px solid var(--line);background:var(--surface);border-radius:20px;padding:4px 10px;font:inherit;font-size:12.5px;cursor:pointer;color:var(--ink-2);white-space:nowrap}
.mchip b{font-weight:600;color:var(--muted);margin-left:2px}
.mchip:hover{border-color:var(--khaki)}
.mchip.on{background:var(--black);border-color:var(--black);color:#fff}.mchip.on b{color:var(--khaki)}
.mp-tools{display:flex;gap:6px;align-items:center;margin-left:auto;flex-wrap:wrap}
.mp-color{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.mp-color .select{width:auto;min-width:150px}
.mp-f{padding:8px 14px 10px;display:grid;gap:6px}
.mp-f .map-legend{margin:0}
details.map-off{margin:0;font-size:12.5px}
details.map-off summary{cursor:pointer;color:var(--muted)}
.hpin{position:relative;display:flex;flex-direction:column;align-items:center;cursor:pointer;transform-origin:50% 100%;transition:transform .15s}
.hpin-b{min-width:26px;height:26px;padding:0 6px;box-sizing:border-box;border-radius:14px;background:var(--c);border:2px solid #fff;color:#fff;font:700 12px/22px Inter,system-ui,sans-serif;text-align:center;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.hpin::after{content:"";width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid var(--c);margin-top:-2px;filter:drop-shadow(0 2px 1px rgba(0,0,0,.2))}
.hpin.big .hpin-b{min-width:32px;height:32px;line-height:28px;font-size:13px;border-radius:17px}
.hpin.hl{transform:scale(1.35);z-index:10}
.hpin-n{position:absolute;left:calc(100% + 4px);top:3px;white-space:nowrap;background:#fff;color:var(--ink);font:600 11.5px/1 Inter,system-ui,sans-serif;padding:4px 7px;border-radius:6px;box-shadow:0 1px 4px rgba(0,0,0,.2);display:none}
.show-names .hpin-n,.hpin.hl .hpin-n,.hpin.big .hpin-n{display:block}
.hclus{display:flex;flex-direction:column;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;background:#fff;border:3px solid var(--black);box-shadow:0 2px 8px rgba(0,0,0,.3);cursor:pointer;font-family:Inter,system-ui,sans-serif}
.hclus b{font-size:15px;line-height:1;color:var(--black)}
.hclus span{font-size:8.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.prow.flash{animation:rowflash 1.6s ease}
@keyframes rowflash{0%,40%{background:var(--khaki-soft)}100%{background:inherit}}
@media (max-width:860px){
  .map-slot.strip{height:220px}
  .map-slot.dash{height:240px}
  .mp-tools{margin-left:0;width:100%;flex-wrap:nowrap}
  .mp-color{flex:1;min-width:0}.mp-color span{display:none}.mp-color .select{flex:1;min-width:0}
  .mp-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;flex-basis:100%}
}

/* Two balanced columns of cards (ui.js balanceCols) */
.cols2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
.cols2.one{grid-template-columns:minmax(0,1fr)}
.c2col{display:grid;gap:14px;align-content:start;min-width:0}
.c2col > *, .cols2 > *{min-width:0;margin:0}
.dstack{display:grid;gap:14px}
.em-form{display:grid;gap:14px}
@media (max-width:860px){ .cols2{grid-template-columns:minmax(0,1fr)} }

/* Dashboard: one screen (dashboard.js) */
.dash{display:grid;gap:14px;grid-template-columns:repeat(6,minmax(0,1fr));
  grid-template-areas:"close close close attn attn attn" "work work work map map map" "up up wait wait act act";margin-bottom:14px}
.dash.nomap{grid-template-areas:"close close close attn attn attn" "work work work work work work" "up up wait wait act act"}
.dash.owner{grid-template-areas:"behind behind behind wo wo wo" "map map map map map map" "recent recent recent act act act"}
.dash.owner.nomap{grid-template-areas:"behind behind behind wo wo wo" "recent recent recent act act act"}
.d-close{grid-area:close}.d-attn{grid-area:attn}.d-work{grid-area:work}.d-map{grid-area:map}.d-up{grid-area:up}.d-wait{grid-area:wait}.d-act{grid-area:act}
.d-behind{grid-area:behind}.d-wo{grid-area:wo}.d-recent{grid-area:recent}
.dash > div{min-width:0;display:flex}
.dash > div > .card{flex:1;min-width:0;margin:0;display:flex;flex-direction:column}
.dash .card-h a.meta{text-decoration:none;color:var(--khaki-deep);font-weight:500}
.dlist{flex:1}
.dfoot{padding:9px 16px;border-top:1px solid var(--line-2);display:flex;gap:16px;flex-wrap:wrap;margin-top:auto}
.dfoot a{font-size:13px;color:var(--muted);text-decoration:none}.dfoot a:hover{color:var(--ink)}
.dash .mappanel{margin:0}
.dash .mappanel .map-slot.dash{flex:1;height:auto;min-height:250px}
.dash .mywork .seg button{font-size:12px;padding:5px 8px}
.ccard .cc-main{display:block;padding:12px 16px 10px;text-decoration:none;color:inherit;border-bottom:1px solid var(--line-2)}
.ccard .cc-main:hover,.cc-row:hover{background:var(--surface-2)}
.cc-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;font-size:14px}
.cc-top .num{color:var(--muted);font-size:13px}.cc-top .num b{color:var(--ink);font-size:18px}
.ccard .gbar{height:10px}
.ccard .gl-k{margin-top:8px;flex-wrap:wrap;row-gap:4px}
.cc-row{display:grid;grid-template-columns:70px minmax(0,1fr) 46px 64px;gap:10px;align-items:center;padding:9px 16px;text-decoration:none;color:inherit;font-size:13px;border-bottom:1px solid var(--line-2)}
.cc-row:last-child{border-bottom:0}
.cc-l{font-weight:600}.cc-n{text-align:right;color:var(--muted)}.cc-late{font-size:12px;font-weight:600;text-align:right}
.gbar.sm{height:6px;display:flex}
.arow{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;width:100%;padding:10px 16px;border:0;border-bottom:1px solid var(--line-2);background:none;font:inherit;font-size:13.5px;text-align:left;color:var(--ink);text-decoration:none;cursor:pointer}
.arow:last-child{border-bottom:0}
.arow:hover{background:var(--surface-2)}
.arow .pill{font-size:11px;padding:2px 7px}
.arow-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink-2)}.arow-t b{color:var(--ink);font-weight:600}
.arow-d{font-size:12.5px;font-weight:600;white-space:nowrap}
a.card.gl{display:block;text-decoration:none;color:inherit}
a.card.gl:hover{border-color:var(--khaki)}
@media (max-width:1100px){
  .dash{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"close attn" "work work" "map map" "up wait" "act act"}
  .dash.nomap{grid-template-areas:"close attn" "work work" "up wait" "act act"}
  .dash.owner{grid-template-areas:"behind wo" "map map" "recent act"}
  .dash.owner.nomap{grid-template-areas:"behind wo" "recent act"}
}
@media (max-width:860px){
  .dash,.dash.nomap,.dash.owner,.dash.owner.nomap{grid-template-columns:minmax(0,1fr);grid-template-areas:none}
  .dash > div{grid-area:auto!important}
  .d-attn{order:1}.d-work{order:2}.d-close{order:3}.d-map{order:4}.d-up{order:5}.d-wait{order:6}.d-act{order:7}
  .d-behind{order:1}.d-wo{order:2}.d-recent{order:4}
  .arow{grid-template-columns:minmax(0,1fr) auto}.arow .pill{grid-column:1/-1;justify-self:start}
}

/* Status page (status.js) */
.stcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;margin-bottom:16px}
.stc{display:flex;flex-direction:column;gap:5px;padding:13px 15px;text-decoration:none;color:inherit;min-width:0}
.stc:hover{border-color:var(--khaki)}
.stc-f{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.stc-t{font-size:14px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;min-height:2.6em}
.stc-p{font-size:12.5px;color:var(--muted);margin-top:auto}
.stc .gbar{height:8px}
.stc-n{display:flex;gap:4px 10px;font-size:12.5px;flex-wrap:wrap}.stc-n b{font-size:15px}
.smx-card{overflow:hidden}
.smx-wrap{overflow-x:auto}
.smx{border-collapse:collapse;width:100%;font-size:13px}
.smx th,.smx td{padding:8px 8px;border-bottom:1px solid var(--line-2);text-align:center}
.smx td{white-space:nowrap}
.smx thead th{background:var(--surface-2);font-size:12px;font-weight:600;color:var(--ink-2);vertical-align:bottom;line-height:1.3}
.smx thead th.stk{min-width:92px;max-width:130px;width:120px}
.smx thead th a{color:var(--ink);text-decoration:none;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.smx thead th a:hover{text-decoration:underline}
.smx thead th span{display:block;font-weight:400;color:var(--muted);font-size:11.5px;margin-top:3px;white-space:nowrap}
.smx tbody tr:nth-child(even){background:#FBFAF7}
.smx tbody tr:hover{background:var(--khaki-soft)}
.smx .stp{text-align:left;position:sticky;left:0;background:inherit;z-index:1;min-width:170px;max-width:220px;width:200px}
.smx thead .stp{background:var(--surface-2)}
.smx tbody .stp{background:var(--surface)}.smx tbody tr:nth-child(even) .stp{background:#FBFAF7}
.smx tbody tr:hover .stp{background:var(--khaki-soft)}
.smx .stp a{color:var(--ink);text-decoration:none;font-weight:600;display:flex;align-items:flex-start;gap:6px}
.smx .stp a .health{margin-top:5px;flex:none}
.stp-n{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;line-height:1.35}
.smx .stp > span{display:block;font-size:11.5px;color:var(--muted);font-weight:400;margin-top:1px}
.smx .stn{width:64px;white-space:normal}
.scell{display:inline-flex;align-items:center;justify-content:center;min-width:72px;height:28px;padding:0 7px;border-radius:7px;border:1px solid transparent;font:inherit;font-size:12px;font-weight:600}
button.scell{cursor:pointer}button.scell:hover{box-shadow:0 0 0 2px var(--khaki-soft);filter:brightness(.97)}
.scell.s-open{background:var(--gray-soft);color:#5B5850;border-color:var(--line)}
.scell.s-na{background:none;color:var(--line);min-width:0;border:0}
.smx.tr .scell{min-width:50px}
.smx.tr thead th:not(.stp){min-width:64px}
.smx-nav{display:flex;align-items:center;gap:8px;padding:8px 12px;border-bottom:1px solid var(--line-2);font-size:13px;font-weight:600}
.smx-nav .iconbtn:disabled{opacity:.35}
.st-title{overflow-wrap:anywhere}
@media (max-width:860px){
  .smx .stp{min-width:120px;max-width:140px;width:130px}
  .smx thead th.stk{min-width:84px;max-width:100px}
  .stcards{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .stc{padding:11px 12px}
  .scell{min-width:64px;font-size:11.5px}
}
.mrow{display:grid;gap:2px;width:100%;padding:9px 16px;border:0;border-bottom:1px solid var(--line-2);background:none;font:inherit;text-align:left;cursor:pointer;color:var(--ink)}
.mrow:last-child{border-bottom:0}
.mrow:hover{background:var(--surface-2)}
.mrow-t{font-size:13.5px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mrow-s{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.toolbar select[data-change="st-keeper"]{flex:1 1 160px;min-width:150px}
/* Status on phones: property cards instead of the wide table */
.smob{display:none}
@media (max-width:860px){
  .smx-card .smx-wrap,.smx-desk{display:none}
  .smob{display:grid;gap:10px}
  .smob-c{padding:12px 14px;display:grid;gap:10px}
  .smob-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;text-decoration:none;color:var(--ink)}
  .smob-h b{font-size:14.5px;flex:1;min-width:0;overflow-wrap:anywhere}
  .smob-t{font-size:12px;color:var(--muted);white-space:nowrap}
  .smob-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
  .smob-i{display:grid;gap:4px;align-content:start;min-width:0}
  .smob-l{font-size:11.5px;font-weight:600;color:var(--ink-2);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
  .smob-l i{font-style:normal;font-weight:400;color:var(--muted);margin-left:4px}
  .smob-i .scell{width:100%;min-width:0;height:30px}
  .smob-tr{gap:0}
  .smob-r{display:grid;gap:6px;padding:10px 12px;border-bottom:1px solid var(--line-2)}
  .smob-r:last-child{border-bottom:0}
  .smob-r a{color:var(--ink);text-decoration:none;font-size:13.5px;overflow-wrap:anywhere}
  .smob-b{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px}
  .smob-b .scell{min-width:0;width:100%;padding:0 2px;font-size:11px;height:30px}
  .smx-nav{justify-content:space-between}
}
/* Admin › Platform (platform.js) */
.pf-mods{display:grid}
.pf-mod{display:flex;gap:12px;align-items:flex-start;padding:11px 16px;border-bottom:1px solid var(--line-2);cursor:pointer}
.pf-mod:last-child{border-bottom:0}
.pf-mod > span:last-child{display:grid;gap:2px;font-size:13.5px}
.pf-mod .c-mute{font-size:12px}
.pf-mod .em-switch{margin-top:2px}
.pf-prev{font-size:13px;background:var(--surface-2);border-radius:8px;padding:9px 12px;color:var(--ink-2)}
.dash.noclose{grid-template-areas:"attn attn attn attn attn attn" "work work work map map map" "up up wait wait act act"}
.dash.noclose.nomap{grid-template-areas:"attn attn attn attn attn attn" "work work work work work work" "up up wait wait act act"}
@media (max-width:1100px){
  .dash.noclose{grid-template-areas:"attn attn" "work work" "map map" "up wait" "act act"}
  .dash.noclose.nomap{grid-template-areas:"attn attn" "work work" "up wait" "act act"}
}

/* Phone "More" menu: an icon beside each section */
.menu-i .mi-ic{display:flex;align-items:center;gap:12px;min-width:0}
.menu-i .mi-ic svg.i{width:19px;height:19px;color:var(--muted);flex:none}
.menu-i.on .mi-ic svg.i{color:var(--ink,#111)}

/* Key dates (keydates.js) */
.kd-card{overflow:hidden}
.kd-month{padding:9px 16px;background:var(--surface-2);border-bottom:1px solid var(--line-2);font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.kd-row{display:grid;grid-template-columns:52px minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line-2)}
.kd-row:last-child{border-bottom:0}
.kd-row.is-past{opacity:.62}
.kd-date{display:flex;flex-direction:column;align-items:center;justify-content:center;width:52px;padding:5px 0;border:1px solid var(--line);border-radius:10px;background:var(--surface);line-height:1.1}
.kd-date b{font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--red)}
.kd-date span{font-size:19px;font-weight:600;color:var(--ink)}
.kd-date small{font-size:10px;color:var(--muted)}
.kd-main{min-width:0}
.kd-t{font-weight:600;font-size:14px;overflow-wrap:anywhere}
.kd-sub{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:4px;font-size:12.5px;color:var(--muted);align-items:center}
.kd-sub>span,.kd-sub>a{display:inline-flex;align-items:center;gap:5px;min-width:0}
.kd-sub svg.i{width:13px;height:13px}
.kd-sub a{color:var(--ink-2);text-decoration:none;font-weight:500}
.kd-sub a:hover{text-decoration:underline}
.kd-notes{margin-top:4px;font-size:12.5px;color:var(--ink-2);white-space:pre-wrap;overflow-wrap:anywhere}
.kd-right{display:flex;flex-direction:column;align-items:flex-end;gap:6px}
.kd-chip{display:inline-block;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:500;background:var(--gray-soft);color:var(--ink-2);white-space:nowrap}
.kd-chip.near{background:var(--amber-soft);color:var(--amber)}
.kd-chip.soon{background:var(--red-soft);color:var(--red)}
.kd-chip.past{background:var(--gray-soft);color:var(--muted)}
.kd-task{display:inline-flex;align-items:center;gap:4px;border:0;background:none;padding:0;font-size:12.5px;color:var(--blue);cursor:pointer;white-space:nowrap}
.kd-task svg.i{width:13px;height:13px}
.kd-task:hover{text-decoration:underline}
.kd-foot{padding:10px 16px 14px;font-size:12.5px;border-top:1px solid var(--line-2)}
@media (max-width:640px){
  .kd-row{grid-template-columns:46px minmax(0,1fr) auto;gap:6px 12px;padding:12px 14px;align-items:start}
  .kd-date{width:46px}
  .kd-right{grid-column:2;grid-row:2;flex-direction:row;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:10px}
  .kd-row .l-acts{grid-column:3;grid-row:1}
}
.kd-also{display:grid;gap:8px}
.kd-roles{display:flex;flex-wrap:wrap;gap:6px}
.kd-pick{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid var(--line);border-radius:999px;font-size:13px;cursor:pointer;background:var(--surface);min-width:0}
.kd-pick:has(input:checked){border-color:var(--ink-2);background:var(--gray-soft)}
.kd-pick input{margin:0}
.kd-pick span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kd-hint{font-size:12px;margin-top:-2px}
.kd-people{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:6px;max-height:176px;overflow:auto;padding:2px}
.kd-people .kd-pick{border-radius:10px}
/* Phone menus opened from the bottom bar or the + button sit above the bar, so the bar stays tappable */
@media (max-width:860px){
  .menu.menu-up{bottom:calc(66px + env(safe-area-inset-bottom))}
}
/* + button: its Add menu opens above it, and the + turns into an × you can tap to close the menu */
.fab svg{transition:transform .18s ease}
.fab.open svg{transform:rotate(45deg)}
@media (max-width:860px){
  .menu.menu-fab{bottom:calc(134px + env(safe-area-inset-bottom))}
}

/* Bugs and ideas (feedback.js) */
.side-foot .sf-link{display:flex;gap:8px;align-items:center;color:#9C988D;text-decoration:none;padding:6px 0}
.side-foot .sf-link:hover{color:#fff}
.side-foot .sf-link svg.i{width:15px;height:15px}
.side-foot .sf-link .count{margin-left:auto}
.fb-tools{flex-wrap:wrap;gap:8px}
.fb-tools .seg{overflow-x:auto;max-width:100%}
.fb-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line-2);text-decoration:none;color:inherit}
.fb-row:last-child{border-bottom:0}
.fb-row:hover{background:var(--surface-2)}
.fb-t{font-weight:600;font-size:14px;overflow-wrap:anywhere}
.fb-sub{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:3px;font-size:12.5px;color:var(--muted);align-items:center}
.fb-sub span{display:inline-flex;align-items:center;gap:4px}
.fb-sub svg.i{width:13px;height:13px}
.fb-kind{display:inline-block;padding:3px 8px;border-radius:6px;font-size:11.5px;font-weight:600;letter-spacing:.02em}
.fb-kind.bug{background:var(--red-soft);color:var(--red)}
.fb-kind.feature{background:var(--blue-soft);color:var(--blue)}
.fb-st{display:inline-block;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:500;white-space:nowrap;background:var(--gray-soft);color:var(--ink-2)}
.fb-st.s-new{background:var(--amber-soft);color:var(--amber)}
.fb-st.s-planned,.fb-st.s-in_progress{background:var(--blue-soft);color:var(--blue)}
.fb-st.s-done{background:var(--green-soft);color:var(--green)}
.fb-st.s-wont_do{background:var(--gray-soft);color:var(--muted)}
.fb-h1{display:flex;align-items:center;gap:10px;flex-wrap:wrap;overflow-wrap:anywhere}
.fb-body{padding:14px 16px 16px;display:grid;gap:10px;min-width:0}
.fb-body p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.55}
.fb-body h3{margin:6px 0 0;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600}
.fb-shot{max-width:100%;max-height:420px;border:1px solid var(--line);border-radius:10px;display:block}
.fb-adm{display:grid;gap:12px}
.fb-status-big .fb-st{font-size:14px;padding:6px 14px}
.fb-seg{justify-self:start}
.fb-auto{font-size:12.5px}
@media (max-width:640px){ .fb-row{grid-template-columns:minmax(0,1fr) auto;padding:12px 14px} .fb-row .fb-kind{grid-column:1;justify-self:start} .fb-row .fb-main{grid-column:1} .fb-row .fb-st{grid-column:2;grid-row:1} }

/* Task templates (templates.js) */
.tpl-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line-2)}
.tpl-row:last-child{border-bottom:0}
.tpl-t{font-weight:600;font-size:14.5px;overflow-wrap:anywhere}
.tpl-d{font-size:13px;color:var(--ink-2);margin-top:2px;overflow-wrap:anywhere}
.tpl-sub{display:flex;gap:12px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);margin-top:4px}
.tpl-acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.tpl-head{padding:14px 16px;margin-bottom:12px}
.tpl-items{display:grid;gap:10px}
.tpl-item{padding:12px 14px;display:grid;gap:10px;min-width:0}
.tpl-item-h{display:flex;gap:8px;align-items:center;min-width:0}
.tpl-item-h .input{flex:1;min-width:0;font-weight:600}
.tpl-n{flex:none;width:24px;height:24px;border-radius:50%;background:var(--gray-soft);display:grid;place-items:center;font-size:12px;font-weight:600;color:var(--ink-2)}
.tpl-move{display:flex;flex:none}
.tpl-move .iconbtn:first-child svg{transform:rotate(180deg)}
.tpl-move .iconbtn[disabled]{opacity:.3;pointer-events:none}
.tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.tpl-more summary{cursor:pointer;font-size:13px;color:var(--muted);padding:2px 0}
.tpl-more .fgrid{margin-top:8px}
.tpl-more .textarea{min-height:70px}
.tpl-foot{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:14px}
.tpl-props{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:4px 12px;max-height:200px;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.tpl-prev{border-top:1px solid var(--line-2);padding-top:10px}
.tpl-prev-h{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px}
.tpl-prev-i{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--line-2);font-size:13px}
.tpl-prev-i:last-child{border-bottom:0}
.tpl-prev-i .t{min-width:0;overflow-wrap:anywhere}
.tpl-prev-i .m{flex:none;color:var(--muted);white-space:nowrap;font-size:12.5px}
@media (max-width:640px){ .tpl-row{grid-template-columns:1fr} .tpl-acts{justify-content:flex-start} .tpl-prev-i{flex-direction:column;gap:2px} .tpl-prev-i .m{white-space:normal} }

/* Documents and requests (documents.js) */
.doc-card{overflow:hidden;margin-bottom:14px}
.doc-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 16px;border-bottom:1px solid var(--line-2)}
.doc-row:last-child{border-bottom:0}
.doc-ic{width:40px;height:44px;border-radius:7px;display:grid;place-items:center;font-size:10px;font-weight:700;letter-spacing:.04em;background:var(--gray-soft);color:var(--ink-2);border:1px solid var(--line)}
.doc-ic.k-pdf{background:#FDECEA;color:#B42318;border-color:#F6D3CF}
.doc-ic.k-img{background:var(--blue-soft);color:var(--blue);border-color:#D3E1EE}
.doc-ic.k-xls{background:var(--green-soft);color:var(--green);border-color:#CDE7D7}
.doc-ic.k-doc{background:#EEF0FB;color:#3F4CA8;border-color:#D9DCF3}
.doc-main{min-width:0}
.doc-t{border:0;background:none;padding:0;font:inherit;font-weight:600;font-size:14px;color:var(--ink);cursor:pointer;text-align:left;overflow-wrap:anywhere;display:inline-flex;flex-wrap:wrap;gap:6px;align-items:center}
.doc-t:hover{text-decoration:underline}
.doc-fn{font-size:12px;color:var(--muted);overflow-wrap:anywhere}
.doc-sub{display:flex;flex-wrap:wrap;gap:3px 12px;margin-top:3px;font-size:12.5px;color:var(--muted);align-items:center}
.doc-sub a{color:var(--ink-2);text-decoration:none;font-weight:500}
.doc-sub a:hover{text-decoration:underline}
.doc-notes{margin-top:4px;font-size:12.5px;color:var(--ink-2);white-space:pre-wrap;overflow-wrap:anywhere}
.doc-conf{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--amber);background:var(--amber-soft);border-radius:999px;padding:2px 8px}
.doc-conf svg.i{width:11px;height:11px}
.doc-tools{display:flex;gap:8px;padding:10px 16px;border-bottom:1px solid var(--line-2);flex-wrap:wrap}
.doc-tools .search{flex:1;min-width:180px}
.doc-hint{font-size:12px;margin-top:4px}
.doc-pv{min-width:0}
.doc-pv .input,.doc-pv .select{width:100%}
.doc-q{display:flex;gap:6px}
.doc-view{margin:-4px 0 0}
.doc-view iframe{width:100%;height:70vh;border:1px solid var(--line);border-radius:10px;background:#fff}
.doc-view img{max-width:100%;max-height:70vh;display:block;margin:0 auto;border-radius:10px;border:1px solid var(--line)}
.req-card{padding:12px 16px;border-bottom:1px solid var(--line-2);display:grid;gap:6px;min-width:0}
.req-card:last-child{border-bottom:0}
.req-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.req-t{font-size:14px;overflow-wrap:anywhere}
.req-again{font-size:12.5px;color:var(--amber);background:var(--amber-soft);padding:6px 10px;border-radius:8px}
.req-files{display:flex;flex-wrap:wrap;gap:6px}
.req-file{border:1px solid var(--line);background:var(--surface-2);border-radius:8px;padding:4px 10px;font-size:12.5px;cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.req-acts{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.req-done summary{cursor:pointer;padding:10px 16px;font-size:13px;color:var(--muted);border-top:1px solid var(--line-2)}
.req-who{margin-bottom:0}
.du-list{display:grid;gap:6px}
.du-list>div{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;font-size:13px;align-items:center}
.du-list span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.du-table{width:100%;border-collapse:collapse;font-size:12.5px;margin-top:10px}
.du-table th,.du-table td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line-2);vertical-align:top;overflow-wrap:anywhere}
.du-table th{color:var(--muted);font-weight:600}
@media (max-width:640px){
  .doc-row{grid-template-columns:34px minmax(0,1fr) auto;gap:10px;padding:11px 14px}
  .doc-ic{width:34px;height:38px;font-size:9px}
  .req-card{padding:12px 14px}
  .du-table thead{display:none} .du-table tr{display:grid;grid-template-columns:1fr 1fr;padding:6px 0;border-bottom:1px solid var(--line-2)} .du-table td{border:0;padding:2px 4px}
}

/* Automatic follow-ups (followups.js) */
.fu-list{display:grid;gap:6px}
.fu-row{display:flex;gap:8px;align-items:flex-start;padding:8px 10px;border:1px solid var(--line-2);border-radius:10px;background:var(--surface-2)}
.fu-row.made{opacity:.75}
.fu-main{flex:1;min-width:0}
.fu-t{font-size:13.5px;font-weight:600;overflow-wrap:anywhere}
.fu-sub{font-size:12px;color:var(--muted);margin-top:2px}
.fu-sub a{color:var(--blue)}
.fu-add{margin-top:8px}
.fu-add summary{cursor:pointer;font-size:13px;color:var(--ink-2);display:inline-flex;gap:6px;align-items:center}
.fu-add summary svg.i{width:14px;height:14px}
.fu-form{display:grid;gap:10px;margin-top:10px}
.fu-log{display:grid}
.fu-log-r{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 16px;border-top:1px solid var(--line-2);font-size:13px}
.fu-log-d{overflow-wrap:anywhere}
.fu-log-d a{color:var(--ink);text-decoration:none}
.fu-log-d a:hover{text-decoration:underline}
.tpl-after{font-size:13px}
@media (max-width:640px){ .fu-log-r{grid-template-columns:1fr;gap:4px;padding:10px 14px} }

/* Month-end close report (reports.js) */
.rp-opts{padding:14px 16px;margin-bottom:14px;display:grid;gap:10px}
.rp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.rp-pick{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:4px 12px;max-height:200px;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:8px 10px}
.rp-incl{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px}
.rp-tiles{margin-bottom:14px}
.rp-tiles .dtile{cursor:default}
.rp-card{overflow:hidden}
.rp-row{padding:12px 16px;border-bottom:1px solid var(--line-2);display:grid;gap:6px;min-width:0}
.rp-row:last-child{border-bottom:0}
.rp-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.rp-name{font-weight:600;font-size:14.5px;color:var(--ink);text-decoration:none}
.rp-name:hover{text-decoration:underline}
.rp-meta{font-size:12.5px;color:var(--muted)}
.rp-line{font-size:13px;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;overflow-wrap:anywhere}
.rp-items{margin:0;padding-left:18px;font-size:13px;display:grid;gap:3px}
.rp-items li span:first-child{margin-right:8px;overflow-wrap:anywhere}
.rp-items li span.c-mute{font-size:12px}
.rp-chip{font-size:12px;padding:2px 8px;border-radius:999px;background:var(--gray-soft)}
.rp-chip.ok{background:var(--green-soft);color:var(--green)}
.rp-chip.no{background:var(--red-soft);color:var(--red)}
.rp-to{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:4px 12px;max-height:170px;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:8px 10px}

/* ---------- SOP extras (sop-extras.js) ---------- */
.sop-extras{display:grid;gap:14px;margin-top:14px}
.sop-extras .card-h h2{display:flex;align-items:center;gap:6px}
.sop-extras .card-h h2 svg{width:16px;height:16px;color:var(--muted)}
.sx-n{font-size:12px;font-weight:600;color:var(--muted);background:var(--gray-soft);border-radius:99px;padding:1px 8px}
.sop-printnote{display:none}
.sfile{display:flex;align-items:center;gap:8px;padding:8px 14px;border-top:1px solid var(--line-2)}
.sf-open{flex:1;min-width:0;display:flex;align-items:center;gap:12px;border:0;background:none;padding:4px 0;text-align:left;cursor:pointer;font:inherit;color:inherit}
.sf-open:hover b{text-decoration:underline}
.sf-ext{flex:0 0 auto;min-width:42px;padding:6px 4px;border-radius:6px;background:var(--gray-soft);font-size:10.5px;font-weight:700;letter-spacing:.04em;text-align:center;color:var(--muted)}
.sf-t{min-width:0;display:flex;flex-direction:column}
.sf-t b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sf-t span{font-size:12px;color:var(--muted)}
.su-row{padding:9px 18px;border-top:1px solid var(--line-2);font-size:14px;line-height:1.45}
.sr-body{padding:4px 18px 16px;display:grid;gap:4px;font-size:14px}
.sop-pick{display:flex;gap:8px;align-items:center}
.sop-pick .select{flex:1;min-width:0}
.sop-link{display:inline-flex;align-items:center;gap:6px;font-weight:600}
.sop-link svg,.r-sop svg{width:15px;height:15px}
.r-sop{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:600;color:var(--khaki-deep);white-space:nowrap;padding:4px 6px;border-radius:6px;text-decoration:none}
.r-sop:hover{background:var(--gray-soft)}
.ritem .x.r-sopset:hover{color:var(--ink)}

/* Print / Save as PDF: only the SOP itself */
@media print{
  body.printing-sop{background:#fff !important}
  body.printing-sop .side, body.printing-sop .topbar, body.printing-sop .bottomnav, body.printing-sop .fab, body.printing-sop .vabar,
  body.printing-sop .crumb, body.printing-sop .actions, body.printing-sop .banner, body.printing-sop .sbanner, body.printing-sop .sop-tabs, body.printing-sop .noprint,
  body.printing-sop #drawer, body.printing-sop .drawer, body.printing-sop .scrim, body.printing-sop #modal, body.printing-sop .toast{display:none !important}
  body.printing-sop .app, body.printing-sop .main, body.printing-sop .page{display:block !important;margin:0 !important;padding:0 !important;max-width:none !important;width:auto !important;overflow:visible !important;height:auto !important}
  body.printing-sop .phero{box-shadow:none !important;border:0 !important;padding:0 0 10px !important;background:none !important}
  body.printing-sop .card{box-shadow:none !important;border:0 !important;break-inside:auto}
  body.printing-sop .sop-files{border-top:1px solid #ccc !important;margin-top:10px}
  body.printing-sop .sop-doc img{max-width:100% !important;break-inside:avoid}
  body.printing-sop .sop-doc h1, body.printing-sop .sop-doc h2, body.printing-sop .sop-doc h3{break-after:avoid}
  body.printing-sop .sop-printnote{display:block;font-size:11px;color:#666;margin:14px 0 0}
  @page{margin:16mm 14mm}
}

/* Keyboard focus on rows that open something (tasks, SOPs, users) */
.trow[role="button"]:focus-visible, .srow2[role="button"]:focus-visible, .urow[role="button"]:focus-visible{outline:2px solid var(--khaki);outline-offset:-2px}