/* TaskConstruct UI
   Layout: night-blue side rail with icon navigation, light working canvas,
   one accent (site green) reserved for the primary action, progress and "today". */
:root{
  --canvas:#f7f6f1; --surface:#ffffff; --sunken:#f0eee7; --line:#e4e1d8; --line-strong:#cfcbc0;
  --ink:#14211b; --ink-2:#36473f; --muted:#68786f;
  --rail:#0d2a20; --rail-ink:#cfe3da; --rail-muted:#86a89a; --rail-hover:#143628; --rail-active:#1b4434; --rail-accent:#5fd18c; --rail-line:#24503f;
  --accent:#0f7f40; --accent-ink:#ffffff; --accent-soft:#dcf3e5;
  --blue:#2f6fde; --blue-soft:#e8f0fd;
  --ok:#1f8a4c; --ok-soft:#e3f4ea; --warn:#b26a00; --warn-soft:#fdf0d9; --bad:#c62f2f; --bad-soft:#fbe6e6; --info:#2f6fde; --info-soft:#e8f0fd;
  --shadow:0 1px 2px rgb(16 24 32 / .06), 0 4px 16px rgb(16 24 32 / .05);
  --shadow-lg:0 12px 40px rgb(16 24 32 / .18);
  --r-sm:6px; --r:10px; --r-lg:14px;
  --font:"Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --canvas:#0d1512; --surface:#141f1a; --sunken:#1a2822; --line:#23342c; --line-strong:#31453b;
  --ink:#e6efea; --ink-2:#c2d0c8; --muted:#8a9d93;
  --rail:#08180f; --rail-ink:#cfe3da; --rail-muted:#76978a; --rail-hover:#10271c; --rail-active:#173727; --rail-accent:#5fd18c; --rail-line:#1f4433;
  --accent:#34c46f; --accent-ink:#04210f; --accent-soft:#123222;
  --blue:#6aa0ff; --blue-soft:#1a2b45;
  --ok:#5fcf8d; --ok-soft:#173326; --warn:#f0b54a; --warn-soft:#3a2c10; --bad:#ff7d7d; --bad-soft:#3d1d1f; --info:#6aa0ff; --info-soft:#1a2b45;
  --shadow:0 1px 2px rgb(0 0 0 / .3); --shadow-lg:0 12px 40px rgb(0 0 0 / .5);
  color-scheme:dark}}
:root[data-theme="dark"]{
  --canvas:#0d1512; --surface:#141f1a; --sunken:#1a2822; --line:#23342c; --line-strong:#31453b;
  --ink:#e6efea; --ink-2:#c2d0c8; --muted:#8a9d93;
  --rail:#08180f; --rail-ink:#cfe3da; --rail-muted:#76978a; --rail-hover:#10271c; --rail-active:#173727; --rail-accent:#5fd18c; --rail-line:#1f4433;
  --accent:#34c46f; --accent-ink:#04210f; --accent-soft:#123222;
  --blue:#6aa0ff; --blue-soft:#1a2b45;
  --ok:#5fcf8d; --ok-soft:#173326; --warn:#f0b54a; --warn-soft:#3a2c10; --bad:#ff7d7d; --bad-soft:#3d1d1f; --info:#6aa0ff; --info-soft:#1a2b45;
  --shadow:0 1px 2px rgb(0 0 0 / .3); --shadow-lg:0 12px 40px rgb(0 0 0 / .5);
  color-scheme:dark}

*{box-sizing:border-box}
html,body{height:100%;margin:0}
[hidden]{display:none!important}
img{max-width:100%}
body{background:var(--canvas);color:var(--ink);font-family:var(--font);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}
button,input,select,textarea{font:inherit;color:inherit}
h1{font-size:26px;line-height:1.15;font-weight:700;letter-spacing:-.015em;margin:0;text-wrap:balance}
h2{font-size:15px;font-weight:650;margin:0;letter-spacing:-.005em}
h3{font-size:13px;font-weight:600;margin:0}
.ico{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ---------- Shell ---------- */
.app{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100%}
aside{background:var(--rail);color:var(--rail-ink);padding:18px 14px;display:flex;flex-direction:column;gap:18px;position:sticky;top:0;height:100vh;overflow:auto}
.brand{display:flex;align-items:center;gap:10px;font-weight:750;font-size:17px;letter-spacing:-.01em;color:#fff;padding:2px 6px}
.brand i{display:block;width:30px;height:30px;border-radius:8px;background:url(/logo.svg) center/contain no-repeat;flex:none}
.auth-card .brand{color:var(--ink)}
.switcher{display:flex;flex-direction:column;gap:6px;padding:12px;border-radius:var(--r);background:var(--rail-hover)}
.switcher label{font-size:11.5px;color:var(--rail-muted)}
.switcher select{width:100%;border:1px solid var(--rail-line);background:var(--rail);color:#fff;border-radius:var(--r-sm);padding:7px 8px;font-weight:600;cursor:pointer}
.switcher select:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.switcher .meta{font-size:12px;color:var(--rail-muted);line-height:1.4}
nav{display:flex;flex-direction:column;gap:2px}
nav .sect{font-size:11.5px;color:var(--rail-muted);padding:12px 10px 4px}
nav button{all:unset;cursor:pointer;display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:8px;font-weight:500;color:var(--rail-ink)}
nav button:hover{background:var(--rail-hover);color:#fff}
nav button[aria-current="true"]{background:var(--rail-active);color:#fff;box-shadow:inset 3px 0 0 var(--rail-accent)}
nav button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
nav button span.lbl{flex:1}
nav .cnt{font-size:11px;font-weight:700;min-width:20px;text-align:center;border-radius:10px;padding:1px 6px;background:var(--bad);color:#fff}
.rail-foot{margin-top:auto;display:flex;align-items:center;gap:10px;padding:10px;border-radius:var(--r);background:var(--rail-hover)}
.avatar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;flex:none;color:#fff}
.user-chip{display:flex;flex-direction:column;min-width:0;flex:1;font-size:12px;color:var(--rail-muted)}
.user-chip b{color:#fff;font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-chip span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.iconbtn{all:unset;cursor:pointer;display:grid;place-items:center;width:30px;height:30px;border-radius:7px;color:var(--rail-muted)}
.iconbtn:hover{background:var(--rail-active);color:#fff}
.iconbtn:focus-visible{outline:2px solid var(--accent)}

main{padding-block:26px 56px;padding-inline:32px;min-width:0;max-width:1400px;width:100%}
.head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px;margin-bottom:22px}
.head .sub{color:var(--muted);font-size:13px;margin-top:4px}
.head-actions{display:flex;gap:8px;flex-wrap:wrap}
.eyebrow{font-size:12px;color:var(--muted);font-weight:500}

/* ---------- Controls ---------- */
.btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line-strong);background:var(--surface);padding:7px 13px;border-radius:8px;cursor:pointer;font-weight:550;font-size:13.5px;color:var(--ink);transition:background .12s,border-color .12s}
.btn:hover{border-color:var(--muted)}
.btn .ico{width:16px;height:16px}
.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:650}
.btn.primary:hover{filter:brightness(.96)}
.btn.danger{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 45%,transparent)}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff;font-weight:650}
.btn:disabled{opacity:.55;cursor:default}
.btn:focus-visible,.linkbtn:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.linkbtn{all:unset;cursor:pointer;color:var(--blue);font-weight:550;font-size:13px}
.linkbtn:hover{text-decoration:underline}

/* ---------- Surfaces ---------- */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);margin-bottom:20px;min-width:0;box-shadow:var(--shadow)}
.panel-h{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.panel-h .sub{color:var(--muted);font-size:12.5px;font-weight:400}
.grid2{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:20px}
.grid2 .panel{margin-bottom:0}
.stack{display:flex;flex-direction:column;gap:20px}
.note{font-size:12.5px;color:var(--muted)}
.empty{padding:28px 18px;color:var(--muted);text-align:center}

/* KPI strip: one panel split into segments rather than separate cards */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);margin-bottom:20px;box-shadow:var(--shadow);overflow:hidden}
.kpi{padding:16px 20px;border-left:1px solid var(--line);display:flex;flex-direction:column;gap:2px;min-width:0}
.kpi:first-child{border-left:0}
.kpi b{display:block;font-size:28px;font-weight:700;letter-spacing:-.02em;line-height:1.2}
.kpi small{color:var(--muted);font-size:12.5px}
.kpi .eyebrow{font-size:12.5px}
.ring{display:flex;align-items:center;gap:14px}
.ring svg{width:54px;height:54px;flex:none;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:7}
.ring .trk{stroke:var(--sunken)} .ring .val{stroke:var(--accent);stroke-linecap:round}

/* S-curve */
.scurve{padding:10px 14px 6px}
.scurve svg{width:100%;height:auto;display:block}
.scurve .grid{stroke:var(--line);stroke-width:1}
.scurve .axis{fill:var(--muted);font-size:11px;font-family:var(--font)}
.scurve .plan{fill:none;stroke:var(--blue);stroke-width:2.5}
.scurve .area{fill:var(--blue);opacity:.08}
.scurve .today{stroke:var(--accent);stroke-width:2;stroke-dasharray:4 4}
.scurve .actual{fill:var(--surface);stroke-width:3}
.scurve .tag{font-size:12px;font-weight:650;font-family:var(--font);paint-order:stroke;stroke:var(--surface);stroke-width:5px;stroke-linejoin:round}
.legend{display:flex;gap:16px;font-size:12.5px;color:var(--muted);flex-wrap:wrap;align-items:center}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}

/* Tables */
.tw{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{font-weight:550;font-size:12px;color:var(--muted);text-align:left;padding:10px 16px;border-bottom:1px solid var(--line);white-space:nowrap;background:var(--surface)}
td{padding:12px 16px;border-bottom:1px solid var(--line);vertical-align:top}
tbody tr:last-child td{border-bottom:0}
tbody tr.click{cursor:pointer;transition:background .1s}
tbody tr.click:hover{background:var(--sunken)}
tbody tr.click:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
td.num,th.num{text-align:right;white-space:nowrap}
td.mono{white-space:nowrap;color:var(--ink-2);font-weight:550}
td b{font-weight:600}
tfoot td{font-weight:700;border-top:1px solid var(--line-strong);border-bottom:0;background:var(--sunken)}
.chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;padding:2px 9px 2px 8px;border-radius:999px;white-space:nowrap;background:var(--sunken);color:var(--ink-2)}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.8}
.chip.plain::before{display:none}
.chip.ok{background:var(--ok-soft);color:var(--ok)} .chip.warn{background:var(--warn-soft);color:var(--warn)}
.chip.bad{background:var(--bad-soft);color:var(--bad)} .chip.info{background:var(--info-soft);color:var(--info)}
.neg{color:var(--bad)} .pos{color:var(--ok)}
.bar{height:6px;background:var(--sunken);border-radius:3px;overflow:hidden;min-width:60px}
.bar span{display:block;height:100%;background:var(--blue);border-radius:3px}
.bar.over span{background:var(--bad)}

/* Attention list & feed */
.att{list-style:none;margin:0;padding:6px 0}
.att li{display:flex;gap:12px;align-items:flex-start;padding:10px 18px;cursor:pointer}
.att li:hover{background:var(--sunken)}
.att li:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.att .dot{width:8px;height:8px;border-radius:50%;margin-top:7px;flex:none}
.att .dot.bad{background:var(--bad)} .att .dot.warn{background:var(--warn)}
.att li div{min-width:0;flex:1}
.att b{font-weight:600}
.att small{color:var(--muted);display:block;font-size:12.5px}
.feed{list-style:none;margin:0;padding:8px 0;max-height:360px;overflow:auto}
.feed li{display:flex;gap:12px;padding:9px 18px;font-size:13.5px}
.feed li .avatar{width:28px;height:28px;font-size:11px}
.feed small{color:var(--muted);display:block;font-size:12px}

/* Gantt */
.gantt{min-width:760px;font-size:13px}
.g-row{display:grid;grid-template-columns:240px 1fr;min-height:40px;align-items:center}
.g-row:nth-child(even){background:color-mix(in srgb,var(--sunken) 45%,transparent)}
.g-name{padding:6px 16px;display:flex;justify-content:space-between;gap:8px;cursor:pointer;min-width:0}
.g-name span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.g-name:hover{color:var(--blue)}
.g-name:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.g-track{position:relative;height:40px}
.g-bar{position:absolute;top:12px;height:16px;border-radius:999px;background:var(--blue-soft);overflow:hidden}
.g-bar i{display:block;height:100%;background:var(--blue);border-radius:999px}
.g-bar.late{background:var(--bad-soft)} .g-bar.late i{background:var(--bad)}
.g-head{display:grid;grid-template-columns:240px 1fr;border-bottom:1px solid var(--line)}
.g-months{position:relative;height:34px}
.g-months span{position:absolute;top:9px;font-size:12px;color:var(--muted);padding-left:6px;border-left:1px solid var(--line);height:25px}
.g-today{position:absolute;top:0;bottom:0;width:0;border-left:2px solid var(--accent);z-index:1}

/* Drawer (record editor) */
.scrim{position:fixed;inset:0;background:rgb(8 20 14 / .42);display:flex;justify-content:flex-end;z-index:40;animation:fade .15s ease}
.modal{background:var(--surface);width:min(520px,100%);height:100%;display:flex;flex-direction:column;box-shadow:var(--shadow-lg);animation:slide .2s ease;overflow:auto}
.modal header{padding:18px 22px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;background:var(--surface);z-index:1}
.modal header h2{font-size:17px}
.modal form{padding:20px 22px;display:grid;grid-template-columns:1fr 1fr;gap:14px;flex:1;align-content:start}
.modal label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:550;color:var(--ink-2);min-width:0}
.modal label.full,.modal .full{grid-column:1/-1}
.modal input,.modal select,.modal textarea{border:1px solid var(--line-strong);background:var(--surface);border-radius:8px;padding:9px 11px;font-size:14px;color:var(--ink);width:100%;font-weight:400}
.modal input:focus,.modal select:focus,.modal textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-soft)}
.modal input:disabled{background:var(--sunken)}
.modal footer{grid-column:1/-1;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-top:8px;padding-top:16px;border-top:1px solid var(--line)}
.modal footer div{display:flex;gap:8px}
.modal .actions{grid-column:1/-1;display:flex;gap:8px;flex-wrap:wrap;padding-top:14px;border-top:1px solid var(--line)}
.modal .readonly-val{color:var(--ink);font-size:14px;font-weight:400;white-space:pre-wrap}
.x{all:unset;cursor:pointer;display:grid;place-items:center;width:32px;height:32px;border-radius:8px;color:var(--muted);font-size:20px}
.x:hover{background:var(--sunken);color:var(--ink)}
.x:focus-visible{outline:2px solid var(--blue)}
@keyframes slide{from{transform:translateX(24px);opacity:.4}to{transform:none;opacity:1}}
@keyframes fade{from{opacity:0}to{opacity:1}}
.toast{position:fixed;bottom:calc(22px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);background:var(--ink);color:var(--surface);padding:10px 18px;border-radius:999px;font-size:13.5px;font-weight:550;z-index:20;box-shadow:var(--shadow-lg)}
.err{color:var(--bad);font-size:13px;min-height:1em}

/* Sign-in */
.auth-wrap{min-height:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.auth-side{background:var(--rail);color:var(--rail-ink);padding:48px;display:flex;flex-direction:column;justify-content:space-between;gap:24px;position:relative;overflow:hidden}
.auth-side h2{font-size:34px;line-height:1.1;color:#fff;font-weight:750;letter-spacing:-.02em;margin:0}
.auth-side p{color:var(--rail-muted);max-width:42ch;margin:0}
.auth-side .gridlines{position:absolute;inset:0;opacity:.07;background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:44px 44px;pointer-events:none}
.auth-main{display:grid;place-items:center;padding-block:40px;padding-inline:20px}
.auth-card{width:min(380px,100%);display:flex;flex-direction:column;gap:18px}
.auth-card form{display:flex;flex-direction:column;gap:14px}
.auth-card label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:550;color:var(--ink-2)}
.auth-card input{border:1px solid var(--line-strong);background:var(--surface);border-radius:8px;padding:10px 12px;font-size:15px;color:var(--ink)}
.auth-card input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-soft)}
.auth-card .btn.primary{padding:11px 14px;justify-content:center;font-size:14.5px}
.auth-card .btn{justify-content:center}

/* People, access, misc */
.checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px 18px;padding:14px 18px}
.checks label{display:flex;gap:10px;align-items:center;font-size:13.5px;padding:8px 10px;border-radius:8px;border:1px solid var(--line)}
.checks label:has(input:checked){border-color:var(--blue);background:var(--blue-soft)}
.checks small{color:var(--muted)}
.checks input{accent-color:var(--blue);width:16px;height:16px}
.group-h{padding:16px 18px 0;color:var(--ink-2);font-weight:600;font-size:13px}
.settings{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end;padding:16px 18px}
.settings label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:550;color:var(--ink-2)}
.settings input,.settings select{border:1px solid var(--line-strong);border-radius:8px;padding:8px 10px;background:var(--surface);min-width:200px}
.person{display:flex;align-items:center;gap:10px}
.person .avatar{width:30px;height:30px;font-size:11px}
.callout{background:var(--accent-soft);border-radius:var(--r);padding:12px 14px;margin-bottom:16px;font-size:13px}
.secret{font-size:17px;font-weight:600;letter-spacing:.02em;background:var(--sunken);border:1px dashed var(--line-strong);border-radius:8px;padding:12px;user-select:all;word-break:break-all;text-align:center}
.loading{padding:40px 16px;color:var(--muted)}
.mobile-bar{display:none}

/* ---------- Responsive ---------- */
@media (max-width:960px){
  .app{grid-template-columns:1fr}
  aside{position:sticky;top:0;height:auto;z-index:5;padding:10px 16px;gap:10px;flex-direction:column}
  .switcher{padding:8px 10px;flex-direction:row;align-items:center;gap:10px}
  .switcher label,.switcher .meta{display:none}
  nav{flex-direction:row;overflow-x:auto;gap:4px;scrollbar-width:none}
  nav .sect{display:none}
  nav button{white-space:nowrap;padding:7px 10px}
  nav button[aria-current="true"]{box-shadow:inset 0 -3px 0 var(--rail-accent)}
  .rail-foot{display:none}
  .mobile-bar{display:flex;align-items:center;justify-content:space-between;gap:10px}
  .mobile-bar .brand{font-size:15px}
  .brand.desk{display:none}
  main{padding-inline:16px;padding-block:18px 48px}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi:nth-child(3){border-left:0}
  .kpi:nth-child(n+3){border-top:1px solid var(--line)}
  .grid2{grid-template-columns:minmax(0,1fr)}
  .auth-wrap{grid-template-columns:1fr}
  .auth-side{display:none}
}
@media (max-width:480px){
  .modal form{grid-template-columns:1fr}
  .kpi{padding:14px}
  .kpi b{font-size:22px}
  h1{font-size:22px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* fixes */
#root{min-height:100%}
.auth-wrap{min-height:100vh}
.auth-card .brand{display:none}
.kpi.ring{flex-direction:row;align-items:center;gap:14px}
.kpi.ring>div{display:flex;flex-direction:column;gap:2px;min-width:0}
@media (max-width:960px){.auth-card .brand{display:flex}}

/* ---------- Attachments & photos ---------- */
.attach{display:flex;flex-direction:column;gap:10px;padding:14px;border:1px dashed var(--line-strong);border-radius:var(--r);background:color-mix(in srgb,var(--sunken) 50%,transparent)}
.attach-h{display:flex;justify-content:space-between;align-items:center;gap:8px;font-weight:600;font-size:13px;color:var(--ink-2)}
.attach-h span{display:inline-flex;align-items:center;gap:6px}
.attach-h .ico{width:16px;height:16px}
.attach .btn{padding:5px 10px;font-size:12.5px;cursor:pointer}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px}
.thumb{all:unset;cursor:zoom-in;display:block;aspect-ratio:1;max-width:100%;border-radius:8px;overflow:hidden;background:var(--sunken);border:1px solid var(--line)}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.doclist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.doclist li{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:6px;background:var(--surface);border:1px solid var(--line);min-width:0}
.doclist li .ico{width:16px;height:16px;color:var(--muted)}
.doclist a{color:var(--blue);font-weight:550;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0}
.doclist a:hover{text-decoration:underline}
.doclist small{color:var(--muted);font-size:12px;white-space:nowrap}
.iconbtn.sm{width:26px;height:26px;color:var(--muted)}
.iconbtn.sm:hover{background:var(--sunken);color:var(--bad)}
.iconbtn.sm .ico{width:15px;height:15px}
.armed{background:var(--bad-soft)!important;color:var(--bad)!important}
.clipchip{gap:3px;padding:1px 7px;vertical-align:1px;margin-left:4px}
.clipchip .ico{width:12px;height:12px}
.filelink{display:inline-flex;align-items:center;gap:5px;color:var(--blue);font-weight:550;text-decoration:none}
.filelink .ico{width:15px;height:15px}
.filelink:hover{text-decoration:underline}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px;padding:12px 18px 4px}
.pcard{margin:0;display:flex;flex-direction:column;gap:8px;min-width:0}
.pcard .thumb{aspect-ratio:4/3;border-radius:10px}
.pcard figcaption{display:flex;flex-direction:column;gap:1px;min-width:0}
.pcard figcaption b{font-weight:600;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcard figcaption small{color:var(--muted);font-size:12px}
.panel-h label.btn{cursor:pointer}
.lightbox{position:fixed;inset:0;z-index:30;background:rgb(5 14 10 / .93);display:flex;flex-direction:column;color:#fff;animation:fade .15s ease}
.lb-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;padding-top:calc(14px + env(safe-area-inset-top,0px))}
.lb-meta{display:flex;flex-direction:column;min-width:0}
.lb-meta b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb-meta span{font-size:12.5px;color:#aab6c2}
.lb-actions{display:flex;gap:6px;flex:none}
.lbbtn{all:unset;cursor:pointer;display:grid;place-items:center;width:38px;height:38px;border-radius:10px;color:#dfe6ec;font-size:22px}
.lbbtn:hover{background:rgb(255 255 255 / .12)}
.lbbtn:focus-visible{outline:2px solid var(--accent)}
.lbbtn.armed{background:#c62f2f!important;color:#fff!important}
.lb-stage{flex:1;display:flex;align-items:center;justify-content:center;gap:10px;padding:0 12px 18px;min-height:0}
.lb-stage img{max-width:min(100%,1400px);max-height:100%;object-fit:contain;border-radius:6px}
.lbnav{all:unset;cursor:pointer;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgb(255 255 255 / .1);flex:none}
.lbnav:hover{background:rgb(255 255 255 / .2)}
.lbnav .ico{width:22px;height:22px}
.lb-cap{display:flex;gap:8px;padding:0 18px 18px;padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))}
.lb-cap input{flex:1;min-width:0;border-radius:8px;border:1px solid #2f4a3d;background:#0d2a20;color:#fff;padding:9px 11px}
@media (max-width:600px){.pgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:10px 14px}.lbnav{display:none}}
.modal label.btn{flex-direction:row;color:var(--ink);font-weight:550}

/* ---------- Inspections ---------- */
.ins-meta{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:13px;color:var(--muted)}
.ck-sum{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:12.5px;color:var(--muted)}
.ck-sum .bar{flex:1;min-width:120px}
.cklist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.ck{padding:10px 12px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:6px;border-left:3px solid transparent}
.ck:first-child{border-top:0}
.ck.pass{border-left-color:var(--ok)} .ck.fail{border-left-color:var(--bad);background:color-mix(in srgb,var(--bad-soft) 55%,transparent)} .ck.na{border-left-color:var(--line-strong)}
.ck-row{display:flex;gap:10px;align-items:flex-start}
.ck-n{flex:none;width:22px;color:var(--muted);font-size:12.5px;font-weight:600;padding-top:3px}
.ck-t{flex:1;min-width:0;font-size:13.5px;color:var(--ink);padding-top:2px}
.segs{flex:none;display:inline-flex;border:1px solid var(--line-strong);border-radius:8px;overflow:hidden}
.seg{all:unset;cursor:pointer;padding:5px 10px;font-size:12.5px;font-weight:600;color:var(--muted);border-left:1px solid var(--line-strong);min-width:30px;text-align:center}
.seg:first-child{border-left:0}
.seg:hover:not([disabled]){background:var(--sunken);color:var(--ink)}
.seg:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.seg[disabled]{cursor:default}
.seg.pass.on{background:var(--ok);color:#fff} .seg.fail.on{background:var(--bad);color:#fff} .seg.na.on{background:var(--ink-2);color:var(--surface)}
.modal .ck-note,.ck-note{margin-left:32px;width:calc(100% - 32px);border:1px solid var(--line-strong);border-radius:6px;padding:6px 9px;font-size:13px;background:var(--surface)}
.ck-note-ro{margin-left:32px;font-size:13px;color:var(--ink-2)}
.ck-p{margin-left:32px;align-self:flex-start}
.mini{display:flex;flex-direction:column;gap:4px;min-width:120px}
.mini small{font-size:12px;color:var(--muted)}
.mini-bar{display:flex}
.mini-bar span{display:block;height:100%;border-radius:0}
.mini-bar .p{background:var(--ok)} .mini-bar .f{background:var(--bad)} .mini-bar .n{background:var(--line-strong)}
@media (max-width:520px){.ck-row{flex-wrap:wrap}.ck-t{flex-basis:calc(100% - 32px)}.segs{margin-left:32px}}

/* ---------- Reports page ---------- */
.rp-form{display:flex;flex-direction:column;gap:16px;padding:16px 18px 18px}
.rp-presets{display:flex;flex-wrap:wrap;gap:6px}
.rp-pre.on{border-color:var(--blue);background:var(--blue-soft);color:var(--blue)}
.rp-dates{display:flex;gap:12px;flex-wrap:wrap}
.rp-dates label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:550;color:var(--ink-2)}
.rp-dates input{border:1px solid var(--line-strong);border-radius:8px;padding:8px 10px;background:var(--surface);color:var(--ink)}
.rp-ver{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.rp-ver legend{font-size:12.5px;font-weight:550;color:var(--ink-2);margin-bottom:6px}
.rp-ver label{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:8px;cursor:pointer}
.rp-ver label:has(input:checked){border-color:var(--blue);background:var(--blue-soft)}
.rp-ver input{accent-color:var(--blue);margin-top:3px}
.rp-ver span{display:flex;flex-direction:column;gap:2px}
.rp-ver small{color:var(--muted);font-size:12.5px}
.exlist{list-style:none;margin:0;padding:6px 0}
.exlist li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 18px;border-bottom:1px solid var(--line)}
.exlist li:last-child{border-bottom:0}
.exlist li>span{display:flex;align-items:center;gap:10px;min-width:0}
.exlist li>span .ico{color:var(--muted)}
.exlist b{font-weight:600}
.exlist small{color:var(--muted);font-size:12px}
.exlist .btn{padding:5px 11px;font-size:12.5px}

/* ---------- Printable report (always light, A4) ---------- */
.rp-toolbar{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:10px 18px;background:var(--rail);color:var(--rail-ink);font-size:13px}
.rp-toolbar>div{display:flex;gap:8px}
.report{--r-ink:#14211b;--r-muted:#5b6b62;--r-line:#d8e0db;--r-soft:#f1f5f2;--r-accent:#0f7f40;
  background:#fff;color:var(--r-ink);width:min(210mm,100%);margin:24px auto;padding:16mm 15mm;box-shadow:var(--shadow-lg);font-size:11.5px;line-height:1.45;color-scheme:light}
.report .scurve .grid{stroke:var(--r-line)} .report .scurve .axis{fill:var(--r-muted)} .report .scurve .actual{fill:#fff} .report .scurve .tag{stroke:#fff}
.rp-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;border-bottom:3px solid var(--r-ink);padding-bottom:12px}
.rp-co{font-weight:700;font-size:12px;letter-spacing:.02em;color:var(--r-muted)}
.report h1{font-size:22px;margin:4px 0 2px;color:var(--r-ink)}
.rp-sub{font-size:13px;font-weight:600}
.rp-block{border-collapse:collapse;font-size:10.5px;min-width:230px}
.rp-block th,.rp-block td{border:1px solid var(--r-ink);padding:3px 7px;text-align:left;background:none;color:var(--r-ink)}
.rp-block th{font-weight:600;width:70px;background:var(--r-soft)}
.rp-head{border-bottom-color:var(--r-accent)!important}
.rp-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:14px 0 4px;border:1px solid var(--r-line);border-radius:6px;overflow:hidden}
.rp-kpis div{padding:9px 11px;border-left:1px solid var(--r-line);display:flex;flex-direction:column}
.rp-kpis div:first-child{border-left:0}
.rp-kpis span{font-size:10px;color:var(--r-muted)}
.rp-kpis b{font-size:19px;line-height:1.25}
.rp-kpis small{font-size:10px;color:var(--r-muted)}
.rp-sec{margin-top:16px;break-inside:avoid-page}
.rp-sec h2{font-size:13px;display:flex;gap:8px;align-items:center;border-bottom:1px solid var(--r-line);padding-bottom:4px;margin-bottom:6px;color:var(--r-ink)}
.rp-sec h2 span{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:4px;background:var(--r-accent);font-size:10.5px;color:#fff}
.rp-t{width:100%;border-collapse:collapse;font-size:10.5px}
.rp-t th{background:var(--r-soft);color:var(--r-muted);font-weight:600;font-size:10px;text-align:left;padding:4px 6px;border-bottom:1px solid var(--r-line);white-space:nowrap}
.rp-t td{padding:4px 6px;border-bottom:1px solid var(--r-line);vertical-align:top;color:var(--r-ink)}
.rp-t tr{break-inside:avoid}
.rp-t .num{text-align:right;white-space:nowrap}
.rp-t .nw{white-space:nowrap}
.rp-note{color:var(--r-muted);font-size:10px;margin-top:1px}
.rp-none{color:var(--r-muted);font-style:italic;margin:2px 0}
.rp-line{margin:2px 0 6px}
.rp-late{color:#c62f2f}
.rp-curve{max-width:460px}
.rp-curve .scurve{padding:0}
.rp-photos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.rp-photos figure{margin:0;break-inside:avoid}
.rp-photos img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px;display:block}
.rp-photos figcaption{font-size:10px;margin-top:3px;display:flex;justify-content:space-between;gap:6px}
.rp-photos small{color:var(--r-muted);white-space:nowrap}
.rp-sign{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:26px;break-inside:avoid}
.rp-sign div{display:flex;flex-direction:column;border-top:1px solid var(--r-ink);padding-top:6px}
.rp-sign span{font-size:10px;color:var(--r-muted)}
.rp-sign b{font-size:12px;min-height:16px}
.rp-sign small{font-size:10px;color:var(--r-muted)}
@media (max-width:700px){.report{padding:18px 14px;margin:0}.rp-head{flex-direction:column}.rp-kpis{grid-template-columns:1fr 1fr}.rp-kpis div:nth-child(3){border-left:0}.rp-photos{grid-template-columns:1fr 1fr}}
@page{size:A4;margin:12mm}
@media print{
  body{background:#fff}
  .rp-toolbar,.toast{display:none!important}
  .report{box-shadow:none;margin:0;padding:0;width:auto}
  .rp-kpis,.rp-sec h2 span{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .rp-block th,.rp-t th{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* ---------- Notifications & account ---------- */
.bell{position:relative}
.bell .bdg{position:absolute;top:1px;right:0;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--bad);color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center}
.acct-btn{all:unset;cursor:pointer;display:flex;align-items:center;gap:10px;flex:1;min-width:0;border-radius:8px;padding:2px}
.acct-btn:hover .user-chip b{text-decoration:underline}
.acct-btn:focus-visible{outline:2px solid var(--accent)}
.notes{display:flex;flex-direction:column;min-height:0;flex:1}
.notes-h{display:flex;justify-content:space-between;align-items:center;padding:12px 22px;font-size:13px;color:var(--muted);border-bottom:1px solid var(--line)}
.nlist{list-style:none;margin:0;padding:0}
.nlist li{border-bottom:1px solid var(--line)}
.nlist li button{all:unset;cursor:pointer;display:flex;gap:12px;padding:12px 22px;width:100%;box-sizing:border-box}
.nlist li button:hover{background:var(--sunken)}
.nlist li button:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.nlist li.unread{background:color-mix(in srgb,var(--blue-soft) 60%,transparent)}
.nlist li.unread b::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--blue);margin-right:7px;vertical-align:2px}
.nico{flex:none;width:32px;height:32px;border-radius:8px;display:grid;place-items:center;background:var(--sunken);color:var(--ink-2)}
.nico .ico{width:16px;height:16px}
.ntext{display:flex;flex-direction:column;gap:2px;min-width:0}
.ntext b{font-weight:600;font-size:13.5px}
.ntext span{font-size:12.5px;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ntext small{font-size:12px;color:var(--muted)}
.notes-f{padding:14px 22px;margin-top:auto;border-top:1px solid var(--line)}
.acct-card{display:flex;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:var(--r)}
.acct-card .avatar{width:42px;height:42px;font-size:14px}
.acct-card div{display:flex;flex-direction:column;min-width:0}
.acct-card b{font-weight:650}
.acct-card span,.acct-card small{color:var(--muted);font-size:12.5px}
.prefs{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.prefs legend{font-size:12.5px;font-weight:600;color:var(--ink-2);margin-bottom:6px}
.modal .prefs label{flex-direction:row;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:8px;cursor:pointer;color:var(--ink)}
.modal .prefs label:has(input:checked){border-color:var(--blue);background:var(--blue-soft)}
.prefs input{width:16px!important;height:16px;margin-top:2px;accent-color:var(--blue);flex:none}
.prefs span{display:flex;flex-direction:column;gap:2px}
.prefs small{color:var(--muted);font-weight:400;font-size:12.5px}
.modal footer div .btn+.btn{margin-left:0}
.email-stat{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:14px 18px;font-size:13.5px;color:var(--ink-2)}
.email-err{list-style:none;margin:0;padding:0 18px 14px;display:flex;flex-direction:column;gap:6px;font-size:13px}
.email-err small{display:block;color:var(--bad);font-size:12px}
.acct-card .avatar{color:#fff;font-size:14px}

/* sign-in welcome note */
.auth-side{justify-content:flex-start}
.welcome{position:relative;display:flex;flex-direction:column;gap:22px;max-width:46ch;margin-block:auto}
.welcome .lead{font-size:15px;line-height:1.55;color:var(--rail-ink);max-width:none}
.wl-block{display:flex;flex-direction:column;gap:10px}
.wl-block h3{font-size:12.5px;font-weight:650;color:var(--rail-accent);margin:0}
.wl-steps{margin:0;padding:0;list-style:none;counter-reset:s;display:flex;flex-direction:column;gap:8px}
.wl-steps li{counter-increment:s;display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.45}
.wl-steps li::before{content:counter(s);flex:none;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--rail-accent);color:var(--rail-accent);font-size:11.5px;font-weight:700;display:grid;place-items:center;margin-top:-1px}
.wl-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.wl-list li{font-size:13.5px;line-height:1.45;padding-left:14px;border-left:2px solid var(--rail-line)}
.wl-list b{color:#fff;font-weight:650}
.wl-foot{position:relative;font-size:12.5px;color:var(--rail-muted);margin:0}
.welcome .lead2{font-size:13.5px;line-height:1.55;color:var(--rail-muted);margin:-12px 0 0}
@media (max-width:960px){
  .auth-side{display:flex;order:2;padding:28px 20px 36px;gap:20px}
  .auth-side>.brand{display:none}
  .auth-side h2{font-size:24px}
  .auth-main{padding-block:28px 24px}
}

/* ===== Per-project roles ===== */
.switcher .my-role{margin-top:6px;font-size:12px;color:var(--rail-muted)}
.switcher .my-role b{color:var(--rail-accent);font-weight:650}
.callout.ok{background:var(--ok-soft)} .callout.bad{background:var(--bad-soft)}
.modal .callout{margin:0}
.callout div{margin-top:4px;color:var(--ink-2)}
.action-box{border:1px solid var(--line-strong);border-radius:var(--r);padding:14px;display:grid;grid-template-columns:1fr 1fr;gap:12px;background:var(--sunken)}
.action-box h3{grid-column:1/-1;margin:0;font-size:14px}
.action-box .full,.action-box .actions,.action-box p{grid-column:1/-1}
.role-guide{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1px;background:var(--line);border-block:1px solid var(--line)}
.role-guide div{background:var(--surface);padding:10px 14px;display:flex;flex-direction:column;gap:2px}
.role-guide b{font-size:13px} .role-guide small{color:var(--muted);font-size:12px;line-height:1.35}
.role-sel{min-width:170px}
tr.dim td{color:var(--muted)} tr.dim .avatar{opacity:.55}
tr.cur td{background:var(--accent-soft)}
.proj-chips{display:flex;flex-wrap:wrap;gap:4px;max-width:340px}
@media (max-width:640px){.action-box{grid-template-columns:1fr}}
.send-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.send-opt{display:flex;gap:8px;align-items:flex-start;border:1px solid var(--line-strong);border-radius:var(--r);padding:10px;background:var(--surface);cursor:pointer;font-weight:400}
.send-opt:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.send-opt.off{opacity:.55;cursor:not-allowed}
.send-opt input{margin-top:3px;accent-color:var(--accent)}
.send-opt span{display:flex;flex-direction:column;gap:2px} .send-opt b{font-size:13px} .send-opt small{color:var(--muted);font-size:12px;line-height:1.35}
.send-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.modal .send-opt{flex-direction:row;align-items:flex-start;text-align:left;color:var(--ink)}
.modal .send-opt input{width:auto;padding:0;flex:none}

/* ===== Contracts & specifications folder ===== */
.cf-up{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.cf-up label:not(.btn){display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:550;color:var(--ink-2)}
.cf-up select{border:1px solid var(--line-strong);border-radius:8px;padding:8px 10px;background:var(--surface);color:var(--ink);font:inherit;font-size:13.5px}
.cf-up .cf-int,.modal .cf-int{flex-direction:row!important;align-items:center;gap:6px;padding-bottom:9px;cursor:pointer}
.modal .cf-int input{width:auto;padding:0}
.cf-bar{display:flex;gap:12px;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:12px 18px;border-bottom:1px solid var(--line)}
.cf-chips{display:flex;gap:6px;flex-wrap:wrap}
.chipbtn{border:1px solid var(--line-strong);background:var(--surface);color:var(--ink-2);border-radius:999px;padding:5px 11px;font:inherit;font-size:12.5px;cursor:pointer}
.chipbtn small{color:var(--muted);margin-left:2px}
.chipbtn.on{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)} .chipbtn.on small{color:inherit;opacity:.8}
#cfQ{border:1px solid var(--line-strong);border-radius:8px;padding:8px 11px;min-width:240px;background:var(--surface);color:var(--ink);font:inherit;font-size:13.5px}
tr.grp td{background:var(--sunken);font-weight:650;font-size:12.5px;color:var(--ink-2);padding-top:8px;padding-bottom:8px}
tr.grp .ico{width:15px;height:15px;margin-right:6px;vertical-align:-3px}
.chip .ico{width:12px;height:12px;margin-right:3px;vertical-align:-2px}
td.nw,.nw{white-space:nowrap}
@media (max-width:640px){#cfQ{min-width:0;width:100%}}
td.nw .iconbtn{display:inline-grid;vertical-align:middle;margin-left:2px}

/* ===== Progress billing ===== */
.modal.wide{width:min(1000px,100%)}
.claim-t{width:100%;border-collapse:collapse;font-size:13px}
.claim-t th,.claim-t td{padding:8px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.claim-t th{font-size:11.5px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}
.claim-t .num{text-align:right;white-space:nowrap}
.modal .pct-in{width:78px;padding:5px 7px;text-align:right;font-variant-numeric:tabular-nums}
.claim-sum{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);margin-top:14px;overflow:hidden}
.claim-sum div{background:var(--surface);padding:10px 12px;display:flex;flex-direction:column;gap:3px}
.claim-sum span{font-size:11.5px;color:var(--muted)} .claim-sum b{font-size:16px;font-variant-numeric:tabular-nums}
.claim-sum .due{background:var(--accent-soft)} .claim-sum .due b{color:var(--accent);font-size:18px}
:root[data-theme="dark"] .claim-sum .due b{color:var(--ok)}
.claim-head{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.claim-trail{margin:0;padding:10px 14px 10px 28px;background:var(--sunken);border-radius:var(--r);font-size:13px;display:flex;flex-direction:column;gap:4px}
.rp-sign3{grid-template-columns:repeat(3,1fr)!important}
.rp-due{max-width:560px} .rp-tot td{font-weight:700;border-top:2px solid var(--ink)}
.empty .linkbtn{background:none;border:0;padding:0;color:var(--accent);font:inherit;text-decoration:underline;cursor:pointer}
@media (max-width:720px){.claim-sum{grid-template-columns:1fr 1fr}.claim-head{grid-template-columns:1fr 1fr}}

/* ===== Dashboards ===== */
.seg-switch{display:inline-flex;border:1px solid var(--line-strong);border-radius:10px;padding:3px;background:var(--surface);gap:2px}
.seg-switch button{border:0;background:none;padding:7px 12px;border-radius:7px;font:inherit;font-size:13px;font-weight:550;color:var(--muted);cursor:pointer}
.seg-switch button[aria-selected="true"]{background:var(--accent);color:var(--accent-ink)}
.queue td{vertical-align:middle}
.qtype{display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-weight:600}
.age{display:inline-block;min-width:44px;text-align:center;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:650;background:var(--sunken);color:var(--ink-2);font-variant-numeric:tabular-nums}
.age.warn{background:var(--warn-soft);color:var(--warn)} .age.bad{background:var(--bad-soft);color:var(--bad)}
.look{list-style:none;margin:0;padding:4px 0}
.look li{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:10px 18px;cursor:pointer;border-bottom:1px solid var(--line)}
.look li:last-child{border-bottom:0} .look li:hover{background:var(--sunken)}
.look li div:first-child{display:flex;flex-direction:column;min-width:0} .look small{color:var(--muted);font-size:12px}
.look .mini{width:120px;flex:none}
.dash-photos{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;padding:0 18px 16px}
.dash-photos .thumb{aspect-ratio:1;border-radius:6px;overflow:hidden;padding:0;border:0;cursor:pointer}
.dash-photos img{width:100%;height:100%;object-fit:cover;display:block}
.perf{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border-top:1px solid var(--line)}
.perf div{background:var(--surface);padding:14px 18px;display:flex;flex-direction:column;gap:2px}
.perf span{font-size:12px;color:var(--muted)} .perf b{font-size:22px;font-variant-numeric:tabular-nums} .perf small{font-size:12px;color:var(--muted)}
.head-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
@media (max-width:640px){.dash-photos{grid-template-columns:repeat(3,1fr)}.perf{grid-template-columns:1fr}}

/* ===== RFI & submittal logs ===== */
.sublog td{vertical-align:top} .sublog th{white-space:nowrap}
.sub-hist{border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.sub-hist h3{margin:0 0 8px;font-size:13.5px}
.sub-hist ol{list-style:none;margin:0;padding:0 0 0 14px;border-left:2px solid var(--line);display:flex;flex-direction:column;gap:10px}
.sub-hist li{position:relative;font-size:13px;display:flex;flex-direction:column;gap:2px}
.sub-hist li::before{content:"";position:absolute;left:-20px;top:4px;width:10px;height:10px;border-radius:50%;background:var(--info);border:2px solid var(--surface)}
.sub-hist li.reviewed::before{background:var(--accent)} .sub-hist li.status::before{background:var(--warn)}
.sub-hist small{color:var(--muted);font-size:12px} .sub-hist li div{color:var(--ink-2)}
.sublog .tcol{min-width:220px;max-width:380px}
.sublog .tcol .note{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ===== Drawing viewer & markups ===== */
.dv{position:fixed;inset:0;z-index:9;background:#1d2420;display:flex;flex-direction:column;color:#e9efec}
.dv-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;background:#0d2a20;border-bottom:1px solid #24503f;flex-wrap:wrap}
.dv-title{display:flex;gap:10px;align-items:center;min-width:0;flex-wrap:wrap}
.dv-title b{font-size:15px} .dv-title span:not(.chip){color:#b8c9c0;font-size:13.5px}
.dv-act{display:flex;gap:6px;align-items:center}
.dv-pg{font-size:12.5px;color:#b8c9c0;min-width:44px;text-align:center;font-variant-numeric:tabular-nums}
.dv .lbbtn{font-size:18px}
.dv-tools{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:8px 14px;background:#f4f7f5;color:var(--ink);border-bottom:1px solid #cbd5cf}
.dv-tools button{border:1px solid #cbd5cf;background:#fff;border-radius:7px;padding:6px 11px;font:inherit;font-size:13px;cursor:pointer;color:#14211b}
.dv-tools button.on{background:#0f7f40;border-color:#0f7f40;color:#fff}
.dv-tools button:disabled{opacity:.45;cursor:default}
.dv-tools button.primary{background:#0f7f40;border-color:#0f7f40;color:#fff;font-weight:650}
.dv-tools .dv-col{width:26px;height:26px;padding:0;border-radius:50%;background:var(--c);border:2px solid #fff;box-shadow:0 0 0 1px #cbd5cf}
.dv-tools .dv-col.on{box-shadow:0 0 0 2px #14211b}
.dv-sep{width:1px;height:22px;background:#cbd5cf;margin:0 4px}
#dvTitle{flex:1;min-width:180px;border:1px solid #cbd5cf;border-radius:7px;padding:7px 10px;font:inherit;font-size:13px}
.dv-share{display:flex;gap:6px;align-items:center;font-size:13px}
.dv-body{flex:1;display:flex;min-height:0}
.dv-stage{flex:1;overflow:auto;position:relative;padding:16px}
.dv-page{position:relative;margin:0 auto;width:max-content;box-shadow:0 4px 30px rgb(0 0 0 / .45);background:#fff}
.dv-page canvas,.dv-page img{display:block}
.dv-page svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.dv-page svg.drawing{pointer-events:auto;cursor:crosshair;touch-action:none}
.dv-page svg g.focus :is(path,rect,ellipse){filter:drop-shadow(0 0 3px rgb(255 200 0 / .9))}
.dv-text{position:absolute;transform:translateY(-50%);border:2px solid #e03131;border-radius:4px;padding:4px 6px;font:600 14px/1.2 inherit;min-width:180px;z-index:2}
.dv-stamp{position:sticky;bottom:12px;left:0;margin:12px auto 0;width:max-content;background:#c62f2f;color:#fff;font-weight:700;letter-spacing:.06em;padding:8px 16px;border-radius:8px}
.dv-empty{color:#b8c9c0;text-align:center;padding:80px 20px;display:flex;flex-direction:column;gap:8px}
.dv-side{width:320px;flex:none;background:var(--surface);color:var(--ink);overflow:auto;border-left:1px solid var(--line)}
.dv-sec{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.dv-sec h3{margin:0;font-size:13.5px}
.dv-revs,.dv-mks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.dv-revs button{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:2px 8px;padding:8px 10px;border:1px solid var(--line);border-radius:8px}
.dv-revs button.on{border-color:var(--accent);background:var(--accent-soft)}
.dv-revs small{grid-column:1/-1;color:var(--muted);font-size:12px}
.dv-mks li{display:grid;grid-template-columns:auto 1fr auto;gap:2px 8px;align-items:start;padding:8px;border:1px solid var(--line);border-radius:8px}
.dv-mks li.on{border-color:#f0b54a;background:var(--warn-soft)}
.dv-eye input{width:16px;height:16px;margin-top:2px;accent-color:var(--accent)}
.dv-mk{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:2px;min-width:0}
.dv-mk small{color:var(--muted);font-size:12px}
.dv-rfi{grid-column:2/3;font-size:12.5px;text-align:left}
.rfi-mk{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:13px;background:var(--warn-soft);padding:8px 12px;border-radius:var(--r)}
.rfi-mk .ico{width:16px;height:16px}
@media (max-width:820px){.dv-body{flex-direction:column}.dv-side{width:auto;max-height:40vh;border-left:0;border-top:1px solid var(--line)}}

/* ===== Meetings ===== */
.mt-head{display:grid;grid-template-columns:1.3fr 1.6fr 1fr .8fr 1.3fr;gap:10px}
.mt-att h3,.mt-h3{margin:0 0 8px;font-size:13.5px}
.mt-att ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:6px}
.mt-att li label{flex-direction:row!important;align-items:flex-start;gap:8px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;color:var(--ink);font-weight:550}
.mt-att li input{width:auto;margin-top:2px;accent-color:var(--accent)}
.mt-att li span{display:flex;flex-direction:column} .mt-att li small{color:var(--muted);font-weight:400;font-size:12px}
.mt-add{display:flex;gap:8px;margin-top:8px} .mt-add input{flex:1}
.mi-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.mi{border:1px solid var(--line);border-left:4px solid var(--line-strong);border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:8px;background:var(--surface)}
.mi-action{border-left-color:var(--warn)} .mi-decision{border-left-color:var(--accent)}
.mi-h{display:flex;gap:8px;align-items:center}
.mi-h select{width:120px;flex:none} .mi-h input{flex:1}
.mi-n{font-weight:700;color:var(--muted);width:20px;text-align:right;flex:none}
.mi-act{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.mi-act select{width:auto;min-width:180px} .mi-act input[data-f=owner_name]{width:220px}
.mi-act label{flex-direction:row!important;align-items:center;gap:6px;font-weight:550}
.mi-act input[type=date]{width:auto} .mi-done input{width:auto;accent-color:var(--accent)}
.mt-addi{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.mins{display:flex;flex-direction:column;gap:10px;font-size:13.5px}
.mins h3{margin:6px 0 0;font-size:13.5px}
.mins-meta{display:flex;gap:8px 14px;flex-wrap:wrap;color:var(--muted);font-size:13px}
.mins-att small,.mins-t small{color:var(--muted)}
.mins-t{width:100%;border-collapse:collapse}
.mins-t th,.mins-t td{padding:8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.mins-t th{font-size:11.5px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.mins-t td div{color:var(--ink-2);margin-top:3px;white-space:pre-wrap}
.mins-t tr.k-action td:nth-child(3){color:var(--warn);font-weight:650} .mins-t tr.k-decision td:nth-child(3){color:var(--accent);font-weight:650}
.mins-from{font-size:11.5px}
.report .mins{font-size:12.5px} .report .mins h3{font-size:13px}
@media (max-width:820px){.mt-head{grid-template-columns:1fr 1fr}}

/* ===== Correspondence ===== */
.cr-to{display:flex;gap:16px;border:1px solid var(--line);border-radius:8px;padding:8px 12px}
.cr-to legend{font-size:12.5px;font-weight:550;color:var(--ink-2);padding:0 4px}
.cr-to label{flex-direction:row!important;align-items:center;gap:6px;color:var(--ink)}
.cr-to input{width:auto;accent-color:var(--accent)}
.letter{border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;display:flex;flex-direction:column;gap:10px;background:var(--surface)}
.letter.compact{padding:10px 12px;gap:6px;font-size:13px}
.lt-h{display:flex;gap:10px;align-items:center} .lt-h span{color:var(--muted);font-size:13px}
.lt-meta{border-collapse:collapse;font-size:13px} .lt-meta th{text-align:left;color:var(--muted);font-weight:550;padding:2px 14px 2px 0;white-space:nowrap} .lt-meta td{padding:2px 0}
.letter h4{margin:4px 0 0;font-size:15px} .letter.compact h4{font-size:13.5px}
.lt-body{white-space:pre-wrap;line-height:1.55;font-size:14px}
.letter.compact .lt-body{max-height:5.5em;overflow:hidden;font-size:13px;color:var(--ink-2)}
.lt-parent{display:flex;flex-direction:column;gap:4px;opacity:.85}
.lt-replies{display:flex;flex-direction:column;gap:8px} .lt-replies h3{margin:0;font-size:13.5px}
.lt-reply{all:unset;cursor:pointer;display:block} .lt-reply:hover .letter{border-color:var(--accent)}
.lt-subj{font-size:15px;margin:18px 0 8px} .lt-body.print{font-size:13px;margin-bottom:14px}
.letter .lt-meta{width:auto} .letter .lt-meta th,.letter .lt-meta td{border:0;background:none}
.letter table.lt-meta{width:auto!important;min-width:0!important} .letter .lt-meta th{width:120px}

/* ===== Delays ===== */
.dl-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;counter-reset:s}
.dl-steps li{border:1px solid var(--line);border-top:4px solid var(--line-strong);border-radius:8px;padding:10px 12px;display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--muted)}
.dl-steps li b{color:var(--ink);font-size:13px}
.dl-steps li.done{border-top-color:var(--accent);background:var(--accent-soft)}
.causes{list-style:none;margin:0;padding:12px 18px 16px;display:flex;flex-direction:column;gap:8px}
.causes li{display:grid;grid-template-columns:220px 1fr 50px;gap:12px;align-items:center;font-size:13px}
.causes b{text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:720px){.dl-steps{grid-template-columns:1fr 1fr}.causes li{grid-template-columns:1fr 1fr 40px}}

/* ===== Camera photos ===== */
.pcard .thumb{position:relative}
.pside,.pstamp{position:absolute;top:6px;padding:2px 7px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.02em}
.pside{left:6px;background:#1971c2;color:#fff} .pside.cm{background:#7048e8}
.pstamp{right:6px;background:rgba(0,0,0,.6);color:#fff}
.cam-prev{background:#111;border-radius:var(--r);overflow:hidden;display:flex;justify-content:center}
.cam-prev img{max-width:100%;max-height:52vh;display:block}

/* ===== Phone layout: simple bottom bar (Dashboard · Take photo · Photos · More) ===== */
.mnav,.msheet-wrap{display:none}
@media (max-width:760px){
  aside nav{display:none}
  .desk-only{display:none!important}
  main{padding-bottom:110px}
  .mnav{display:grid;grid-template-columns:1fr 1.2fr 1fr 1fr;align-items:end;position:fixed;left:0;right:0;bottom:0;z-index:8;background:var(--rail);border-top:1px solid var(--rail-line);padding:6px 8px calc(8px + env(safe-area-inset-bottom));gap:4px}
  .mnav button,.mnav .mcam{all:unset;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;color:#b8c9c0;font-size:11.5px;font-weight:600;padding:6px 0;position:relative;-webkit-tap-highlight-color:transparent}
  .mnav .ico{width:22px;height:22px}
  .mnav button[aria-current="true"]{color:var(--rail-accent)}
  .mnav .mcam{color:#fff}
  .mnav .mcam .ico{width:28px;height:28px;box-sizing:content-box;padding:15px;border-radius:50%;background:var(--accent);color:var(--accent-ink);margin-top:-30px;border:4px solid var(--rail);box-shadow:0 6px 18px rgb(0 0 0 / .35)}
  .mdot{position:absolute;top:4px;right:calc(50% - 16px);width:8px;height:8px;border-radius:50%;background:var(--bad)}
  .msheet-wrap{display:flex;position:fixed;inset:0;z-index:12;background:rgb(8 20 14 / .45);align-items:flex-end}
  .msheet{background:var(--surface);width:100%;border-radius:16px 16px 0 0;padding:14px 14px calc(18px + env(safe-area-inset-bottom));max-height:80vh;overflow:auto;animation:slideup .18s ease}
  .msheet-h{display:flex;justify-content:space-between;align-items:center;padding:0 4px 10px}
  .msheet-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .msheet-grid button{all:unset;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 6px;border:1px solid var(--line);border-radius:12px;font-size:12.5px;font-weight:600;text-align:center;position:relative;color:var(--ink)}
  .msheet-grid .ico{width:22px;height:22px;color:var(--accent)}
  .msheet-grid .cnt{position:absolute;top:6px;right:8px;background:var(--bad);color:#fff;font-style:normal;font-size:11px;border-radius:999px;padding:0 6px}
  .head-actions .seg-switch{display:none}
}
@keyframes slideup{from{transform:translateY(30px);opacity:.4}to{transform:none;opacity:1}}
.co-sys{display:grid!important;grid-template-columns:repeat(2,1fr);gap:6px}

/* ===== Offline ===== */
.offbar{all:unset;box-sizing:border-box;display:block;width:100%;cursor:pointer;margin-bottom:14px;padding:10px 14px;border-radius:10px;font-size:13.5px;font-weight:600;line-height:1.35}
.offbar.off{background:#3a2c10;color:#ffd98a} .offbar.sync{background:var(--info-soft);color:var(--info)} .offbar.bad{background:var(--bad-soft);color:var(--bad)}
:root:not([data-theme="dark"]) .offbar.off{background:#fdf0d9;color:#8a5200}
.obx{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.obx li{display:flex;justify-content:space-between;gap:10px;align-items:center;border:1px solid var(--line);border-radius:8px;padding:8px 10px}
.obx li div{display:flex;flex-direction:column;gap:2px} .obx small{color:var(--muted);font-size:12px}
.up-thumbs{display:flex;flex-wrap:wrap;gap:6px}.up-thumbs img{width:72px;height:72px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}.up-thumbs span{align-self:center;color:var(--muted);font-weight:600}

/* ===== Help ===== */
#hQ{border:1px solid var(--line-strong);border-radius:8px;padding:8px 11px;min-width:240px;background:var(--surface);color:var(--ink);font:inherit;font-size:13.5px}
.help-list{display:flex;flex-direction:column;padding:0 18px 8px;gap:6px}
.help{border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.help summary{cursor:pointer;padding:11px 14px;font-weight:650;list-style:none;display:flex;justify-content:space-between;gap:10px}
.help summary::after{content:"+";color:var(--muted);font-weight:400}
.help[open] summary::after{content:"−"}
.help[open] summary{border-bottom:1px solid var(--line)}
.help ol{margin:0;padding:10px 14px 12px 34px;display:flex;flex-direction:column;gap:6px;font-size:13.5px;line-height:1.5;color:var(--ink-2)}
@media (max-width:640px){#hQ{min-width:0;width:100%}}

/* ---------- Email (Gmail) ---------- */
main.wide{max-width:none}
.mail-head{margin-bottom:14px}
.mail{display:grid;grid-template-columns:200px minmax(300px,380px) minmax(0,1fr);height:calc(100vh - 150px);min-height:480px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow)}
.mail-side{display:flex;flex-direction:column;gap:12px;padding:14px 10px;border-right:1px solid var(--line);background:var(--sunken);min-height:0}
.mail-compose{justify-content:center;padding:10px 14px;border-radius:12px}
.mail-boxes{display:flex;flex-direction:column;gap:1px;overflow:auto;min-height:0;flex:1}
.mail-boxes button{display:flex;align-items:center;gap:10px;border:0;background:none;padding:7px 10px;border-radius:0 999px 999px 0;cursor:pointer;text-align:left;color:var(--ink-2)}
.mail-boxes button span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-boxes button b{font-size:12px}
.mail-boxes button:hover{background:var(--line)}
.mail-boxes button[aria-current="true"]{background:var(--accent-soft);color:var(--ink);font-weight:650}
.mail-boxes .ico{width:16px;height:16px}
.mail-lh{font-size:11.5px;color:var(--muted);padding:10px 10px 2px}
.mail-acct{display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--muted);padding:8px 10px 0;border-top:1px solid var(--line)}
.mail-acct span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-acct .linkbtn{align-self:flex-start;font-size:12px}
.mail-list{display:flex;flex-direction:column;border-right:1px solid var(--line);min-height:0;min-width:0}
.mail-bar{display:flex;gap:6px;align-items:center;padding:10px;border-bottom:1px solid var(--line)}
.mail-bar select{display:none}
.mail-search{flex:1;min-width:0}
.mail-search input{width:100%;border:1px solid var(--line);background:var(--sunken);border-radius:999px;padding:7px 14px}
.mail-search input:focus{outline:2px solid var(--blue);outline-offset:-1px;background:var(--surface)}
#mList{overflow:auto;flex:1;min-height:0}
.mthreads{list-style:none;margin:0;padding:0}
.mthreads li{border-bottom:1px solid var(--line)}
.mthreads li button{display:grid;grid-template-columns:22px minmax(0,1fr) auto;grid-template-areas:"star who when" ". sub sub";gap:2px 8px;width:100%;border:0;background:none;text-align:left;padding:9px 12px 10px 8px;cursor:pointer;color:var(--ink-2)}
.mthreads li button:hover{background:var(--sunken)}
.mthreads li.on button{background:var(--blue-soft)}
.mthreads li.unread button{background:color-mix(in srgb,var(--surface) 70%,var(--accent-soft));color:var(--ink)}
.mthreads li.unread .mt-who,.mthreads li.unread .mt-sub b,.mthreads li.unread .mt-when{font-weight:750}
.mt-star{grid-area:star;color:var(--line-strong);display:grid;place-items:center;align-self:start;padding-top:1px}
.mt-star .ico{width:16px;height:16px}
.mt-star.on{color:#e3a21a}.mt-star.on .ico{fill:#f4b400;stroke:#e3a21a}
.mt-who{grid-area:who;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:550}
.mt-who small{color:var(--muted);font-weight:500}
.mt-when{grid-area:when;font-size:12px;color:var(--muted);display:flex;align-items:center;gap:4px;white-space:nowrap}
.mt-when .ico{width:13px;height:13px}
.mt-sub{grid-area:sub;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
.mt-sub b{color:var(--ink-2);font-weight:550}
.mail-pager{display:flex;align-items:center;justify-content:flex-end;gap:4px;padding:8px 10px;font-size:12px;color:var(--muted)}
.mail-pager span{margin-right:6px}
.mail-read{overflow:auto;min-height:0;min-width:0;padding:0 22px 22px}
.mail-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--muted)}
.mail-empty .ico{width:40px;height:40px;stroke-width:1.3}
.mr-head{display:flex;align-items:center;gap:10px;padding:16px 0 12px;position:sticky;top:0;background:var(--surface);z-index:1}
.mr-head h2{flex:1;font-size:19px;font-weight:650;line-height:1.3}
.mr-back{display:none}
.mr-tools{display:flex;gap:2px}
.mr-tools .starred{color:#e3a21a}.mr-tools .starred .ico{fill:#f4b400}
.mmsg{border-top:1px solid var(--line);padding:12px 0}
.mmsg header{display:flex;align-items:flex-start;gap:10px;cursor:pointer}
.mmsg.open header{cursor:default}
.mm-who{flex:1;min-width:0;font-size:13.5px}
.mm-who span{color:var(--muted);font-size:12.5px}
.mm-to{color:var(--muted);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mmsg time{font-size:12px;color:var(--muted);white-space:nowrap}
.mm-body{display:block;width:100%;border:0;margin-top:12px;background:#fff;border-radius:6px;color-scheme:light}
.mm-img{margin-top:10px;font-size:12.5px;background:var(--sunken);border-radius:8px;padding:6px 10px;color:var(--muted)}
.mm-saved{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.mm-saved .chip{border:0;cursor:pointer}
.mm-saved .ico{width:14px;height:14px}
.mm-files{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.mm-file{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:8px;padding:7px 10px;text-decoration:none;color:var(--ink);max-width:260px}
.mm-file:hover{border-color:var(--muted)}
.mm-file span{display:flex;flex-direction:column;min-width:0}
.mm-file b{font-size:12.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mm-file small{color:var(--muted);font-size:11.5px}
.mm-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.mm-act .btn{border-radius:999px}
.mail-setup{max-width:620px;padding:30px 30px 28px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.mail-setup .ms-ico{width:48px;height:48px;border-radius:12px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center}
.mail-setup .ms-ico .ico{width:26px;height:26px}
.mail-setup h2{font-size:19px}
.mail-setup p{margin:0;color:var(--ink-2)}
.mail-setup ul{margin:0 0 8px;padding-left:20px;color:var(--ink-2)}
.compose{position:fixed;right:24px;bottom:0;width:540px;max-width:calc(100vw - 32px);height:min(560px,calc(100vh - 80px));background:var(--surface);border-radius:12px 12px 0 0;box-shadow:var(--shadow-lg);z-index:15;display:flex;flex-direction:column;border:1px solid var(--line)}
.compose.min{height:auto}.compose.min .cx-body{display:none}
.compose header{display:flex;align-items:center;justify-content:space-between;padding:9px 12px 9px 16px;background:var(--rail);color:#fff;border-radius:12px 12px 0 0}
.compose header b{flex:1;cursor:pointer;font-weight:600}
.compose header button{border:0;background:none;color:#fff;font-size:20px;line-height:1;width:28px;height:28px;cursor:pointer;border-radius:6px}
.compose header button:hover{background:var(--rail-hover)}
.cx-body{display:flex;flex-direction:column;flex:1;min-height:0;padding:0 16px}
.cx-row{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--line);padding:4px 0}
.cx-row span{color:var(--muted);font-size:13px;min-width:30px}
.cx-row input{flex:1;border:0;background:none;padding:6px 0;min-width:0}
.cx-row input:focus{outline:none}
.cx-row:focus-within{border-bottom-color:var(--blue)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.cx-body textarea{flex:1;border:0;background:none;resize:none;padding:12px 0;min-height:120px;line-height:1.55}
.cx-body textarea:focus{outline:none}
.cx-quote{font-size:12px;color:var(--muted);padding-bottom:6px}
.cx-files{display:flex;flex-wrap:wrap;gap:6px;max-height:110px;overflow:auto}
.cx-file{display:inline-flex;align-items:center;gap:6px;background:var(--sunken);border-radius:6px;padding:4px 4px 4px 8px;font-size:12.5px;max-width:100%}
.cx-file .ico{width:14px;height:14px}
.cx-file small{color:var(--muted)}
.cx-file button{border:0;background:none;cursor:pointer;font-size:16px;color:var(--muted);padding:0 4px}
.cx-warn{flex-basis:100%;font-size:12.5px;color:var(--bad)}
.cx-err{color:var(--bad);font-size:13px}
.compose footer{display:flex;align-items:center;gap:6px;padding:10px 0 12px}
.compose footer .btn.primary{border-radius:999px;padding:8px 22px}
.compose footer label.iconbtn{cursor:pointer}
.cx-note{margin-left:auto;font-size:11.5px;color:var(--muted)}
.pf-bar{display:flex;gap:8px;margin-bottom:10px}
.pf-bar select{flex:1;min-width:0}
.pf-bar input{flex:1;min-width:0}
.pf-list{max-height:52vh;overflow:auto;border:1px solid var(--line);border-radius:8px}
.pf-row{display:flex;align-items:center;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line);cursor:pointer}
.pf-row:last-child{border-bottom:0}
.pf-row:hover{background:var(--sunken)}
.pf-row span{display:flex;flex-direction:column;min-width:0}
.pf-row b{font-weight:550;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pf-row small{color:var(--muted);font-size:12px}
.pf .actions{display:flex;align-items:center;gap:8px;justify-content:flex-end;margin-top:12px}
.pf .actions .note{margin-right:auto}
.fe-files{border:1px solid var(--line);border-radius:8px;padding:8px 12px;display:flex;flex-direction:column;gap:4px}
.fe-files legend{font-size:12.5px;color:var(--muted);padding:0 4px}
.fe-files small{color:var(--muted)}
@media (max-width:1180px){
  .mail{grid-template-columns:minmax(280px,360px) minmax(0,1fr)}
  .mail-side{display:none}
  .mail-bar select{display:block;max-width:120px;border:1px solid var(--line);border-radius:8px;padding:6px 8px;background:var(--surface)}
  .mail-list .mail-bar::before{content:none}
}
@media (max-width:760px){
  .mail{grid-template-columns:1fr;height:calc(100vh - 260px);border-radius:var(--r)}
  .mail.reading .mail-list{display:none}
  .mail:not(.reading) .mail-read{display:none}
  .mail-read{padding:0 14px 16px}
  .mr-back{display:grid}
  .mr-head h2{font-size:17px}
  .compose{right:0;left:0;width:auto;max-width:none;height:calc(100vh - 40px);border-radius:12px 12px 0 0;z-index:30}
  .cx-note{display:none}
}
.mail .iconbtn,.compose footer .iconbtn{color:var(--muted)}
.mail .iconbtn:hover,.compose footer .iconbtn:hover{background:var(--sunken);color:var(--ink)}
.mail .iconbtn:disabled{opacity:.35;cursor:default;background:none}

/* ---------- Management dashboard ---------- */
.mg-kpis{grid-template-columns:repeat(5,minmax(0,1fr))}
.mg-mix{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.hchip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:650;padding:2px 9px 2px 7px;border-radius:999px;white-space:nowrap;background:var(--sunken);color:var(--ink-2)}
.hchip i{width:8px;height:8px;border-radius:50%;background:var(--muted);flex:none}
.hchip.bad{background:var(--bad-soft);color:var(--bad)}.hchip.bad i{background:var(--bad)}
.hchip.warn{background:var(--warn-soft);color:var(--warn)}.hchip.warn i{background:var(--warn);border-radius:1px;transform:rotate(45deg)}
.hchip.ok{background:var(--ok-soft);color:var(--ok)}.hchip.ok i{background:var(--ok)}
.hchip.sm{font-size:11.5px;padding:1px 8px 1px 6px}
.chip.sm{font-size:11px;padding:0 7px}
.mg-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.mg-bar .cf-chips{margin-right:auto}
.mg-sort{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.mg-sort select{border:1px solid var(--line-strong);border-radius:8px;padding:6px 8px;background:var(--surface);color:var(--ink)}
.mg-table td{vertical-align:top}
.mg-name{min-width:200px}
.mg-name .mono{font-size:12px;color:var(--muted);display:block}
.mg-health{min-width:150px;max-width:220px}
.mg-health .note{margin-top:4px;line-height:1.35}
.mg-prog{display:flex;align-items:center;gap:10px;min-width:170px}
.mg-track{position:relative;flex:1;height:8px;background:var(--sunken);border-radius:4px}
.mg-act{position:absolute;left:0;top:0;bottom:0;background:var(--ok);border-radius:4px}
.mg-act.behind{background:var(--warn)}
.mg-plan{position:absolute;top:-4px;bottom:-4px;width:2px;margin-left:-1px;background:var(--ink);border-radius:1px}
.mg-pv{white-space:nowrap;font-size:12.5px}
.mg-pv small{color:var(--muted)}
.mg-cards{display:none}
.mg-att{list-style:none;margin:0;padding:0}
.mg-att li{border-top:1px solid var(--line)}
.mg-att button{display:grid;grid-template-columns:96px 84px minmax(0,1fr) auto;gap:12px;align-items:center;width:100%;border:0;background:none;text-align:left;padding:10px 18px;cursor:pointer;color:var(--ink)}
.mg-att button:disabled{cursor:default}
.mg-att button:not(:disabled):hover{background:var(--sunken)}
.mg-att .mono{font-size:12.5px;color:var(--muted)}
.mg-at{font-weight:550}
@media (max-width:1180px){.mg-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.mg-kpis .kpi:nth-child(4){border-left:0}.mg-kpis .kpi:nth-child(n+4){border-top:1px solid var(--line)}}
@media (max-width:760px){
  .mg-kpis{grid-template-columns:1fr 1fr}.mg-kpis .kpi{border-left:1px solid var(--line)!important;border-top:1px solid var(--line)}.mg-kpis .kpi:nth-child(odd){border-left:0!important}.mg-kpis .kpi:nth-child(-n+2){border-top:0}
  .mg-kpis .kpi:last-child{grid-column:1/-1;border-left:0!important}
  .mg-desk{display:none}
  .mg-cards{display:flex;flex-direction:column}
  .mg-card{display:flex;flex-direction:column;gap:10px;border:0;border-top:1px solid var(--line);background:none;text-align:left;padding:14px 16px;color:var(--ink);font:inherit}
  .mg-card:first-child{border-top:0}
  .mg-ch{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
  .mg-ch .mono{color:var(--muted);font-size:12px}
  .mg-cg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .mg-cg span{display:flex;flex-direction:column;font-size:11.5px;color:var(--muted)}
  .mg-cg b{font-size:14px;color:var(--ink)}
  .mg-bar .mg-sort{flex:1}.mg-bar .mg-sort select{flex:1}
  .mg-att button{grid-template-columns:auto minmax(0,1fr);gap:4px 10px;padding:10px 16px}
  .mg-att .note{grid-column:2}
}
@media print{.mg-bar,.mnav{display:none!important}.mg-desk{display:block!important}.mg-cards{display:none!important}}
.mg-open{display:grid;grid-template-columns:auto auto;gap:1px 10px;align-content:start;font-size:12.5px;white-space:nowrap}
.mg-open span{color:var(--muted)}
.mg-open b{font-weight:600}
.mg-upd{margin-top:4px;font-size:11.5px}
.mg-table th,.mg-table td{padding-inline:10px}
.mg-name{min-width:180px}
@media (max-width:760px){
  .mg-att button{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"sev code" "txt txt" "nm nm";gap:4px 10px}
  .mg-att button>.hchip{grid-area:sev;justify-self:start}
  .mg-att button>.mono{grid-area:code}
  .mg-att button>.mg-at{grid-area:txt}
  .mg-att button>.note{grid-area:nm;grid-column:auto}
}
.mg-bill{min-width:90px;max-width:150px}
.mg-att .mono{white-space:nowrap}
.mg-health{max-width:190px}
.mg-prog{min-width:150px}
.mg-open b{text-align:left}
.mg-open .chip.sm{margin-left:2px}

/* ---------- Fold the side menu (Email) ---------- */
.rail-handle{display:none}
@media (min-width:961px){
  .app.rail-min{grid-template-columns:22px minmax(0,1fr)}
  .rail-handle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;position:sticky;top:0;height:100vh;width:22px;padding:0;border:0;cursor:pointer;
    background:var(--rail);color:var(--rail-accent);box-shadow:inset -3px 0 0 var(--rail-accent);transition:width .12s,background .12s;z-index:6}
  .rail-handle span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:12px;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--rail-ink)}
  .rail-handle .ico{width:16px;height:16px;stroke-width:2.4}
  .rail-handle:hover,.rail-handle:focus-visible{background:var(--rail-active);outline:none}
  .rail-handle:focus-visible{box-shadow:inset -3px 0 0 var(--rail-accent),0 0 0 2px var(--blue)}
}
@media (max-width:960px){.rail-toggle{display:none!important}}
@media (min-width:961px){.app.rail-min>aside{display:none}}

/* ---------- Pop-out windows (other monitors) ---------- */
.app.solo{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr}
.app.solo>aside,.app.solo>.mnav{display:none!important}
.app.solo main{max-width:none;padding-top:18px}
.solo-bar{position:sticky;top:0;z-index:7;display:flex;align-items:center;gap:12px;padding:8px 18px;background:var(--rail);color:var(--rail-ink)}
.solo-bar .brand{padding:0}
.solo-bar .brand i{width:24px;height:24px}
.solo-bar b{color:#fff;font-size:14.5px}
.solo-bar select{border:1px solid var(--rail-line);background:var(--rail-hover);color:#fff;border-radius:var(--r-sm);padding:5px 8px;font-weight:600;max-width:360px}
.solo-bar>span:not(.brand){color:var(--rail-muted);font-size:13px}
.solo-sp{flex:1}
.solo-bar .btn{background:var(--rail-hover);border-color:var(--rail-line);color:var(--rail-ink);padding:5px 10px}
.solo-bar .btn:hover{border-color:var(--rail-muted)}
.solo-bar .iconbtn{color:var(--rail-ink)}
.solo .mail{height:calc(100vh - 160px)}
.scr-pick{display:flex;flex-direction:column;gap:8px;padding:4px 0}
.scr-pick .btn{justify-content:flex-start}
.scr-pick small{color:var(--muted);margin-left:auto}
.solo-bar a.btn{text-decoration:none}
main.wide:has(.mailwrap){padding-top:14px}
.mail{height:calc(100vh - 42px)}
.solo .mail{height:calc(100vh - 92px)}
@media (max-width:760px){.mail{height:calc(100vh - 210px)}}
.mail-top{display:flex;justify-content:flex-end;gap:8px;margin-bottom:8px;min-height:0}
.mail-top:empty{display:none}
.mail-top .btn{padding:4px 11px;font-size:12.5px}
.mail{height:calc(100vh - 80px)}
.solo .mail{height:calc(100vh - 92px)}
@media (max-width:960px){.mail-top{display:none}}
@media (max-width:760px){.mail{height:calc(100vh - 210px)}}
.mail-top{align-items:center}
.mail-top h1{font-size:22px}
.mail{height:calc(100vh - 86px)}
@media (max-width:960px){.mail-top{display:flex}.mail-top .btn{display:none}.mail-top h1{font-size:20px}}
.theme-pick .seg{display:flex;flex-wrap:wrap;gap:8px 18px}
.theme-pick .seg label{display:flex;align-items:center;gap:6px;cursor:pointer}
.first-time{border-top:1px solid var(--line);padding-top:14px}
.first-time h3{font-size:13px;color:var(--accent);margin:0 0 8px}
.first-time ol{margin:0;padding:0;list-style:none;counter-reset:ft;display:flex;flex-direction:column;gap:7px}
.first-time li{counter-increment:ft;display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--ink-2);line-height:1.4}
.first-time li::before{content:counter(ft);flex:none;width:20px;height:20px;border-radius:50%;border:1.5px solid var(--accent);color:var(--accent);font-size:11.5px;font-weight:700;display:grid;place-items:center;margin-top:1px}

/* ---------- Sign-in (light green welcome panel + card) ---------- */
.lg-wrap{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:#fbfcfb}
.lg-side{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:26px;padding:34px 72px 26px;color:#2c4a3c;
  background:linear-gradient(160deg,#f3f8f3 0%,#e8f2ea 45%,#d6e9d9 100%)}
.lg-side::before{content:"";position:absolute;inset:0;opacity:.35;background-image:linear-gradient(rgba(15,127,64,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(15,127,64,.06) 1px,transparent 1px);background-size:56px 56px;pointer-events:none}
.lg-beam{position:absolute;left:28%;top:46%;width:120%;height:90px;transform:rotate(-38deg);background:linear-gradient(90deg,rgba(255,255,255,.55),rgba(255,255,255,.1));pointer-events:none}
.lg-beam2{left:44%;top:60%;height:60px;opacity:.6}
.lg-top{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px}
.lg-top .brand{font-size:19px;padding:0;color:#17392a}
.lg-top .brand i{width:36px;height:36px;box-shadow:0 6px 16px rgba(15,127,64,.25)}
.lg-pill{font-size:12px;color:#2c4a3c;border:1px solid rgba(23,57,42,.2);border-radius:999px;padding:7px 13px;background:rgba(255,255,255,.55)}
.lg-hero{position:relative;display:flex;flex-direction:column;gap:20px;margin-block:auto;max-width:600px}
.lg-eyebrow{margin:0;font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#1d5a3d}
.lg-hero h2{margin:-4px 0 0;font-size:clamp(40px,4.6vw,60px);line-height:1.04;font-weight:750;letter-spacing:-.045em;color:#183f2d}
.lg-lead{margin:0;font-size:15.5px;line-height:1.7;color:#4c6558;max-width:58ch}
.lg-rows{display:flex;flex-direction:column;border-top:1px solid rgba(23,57,42,.14)}
.lg-row{display:flex;align-items:center;gap:16px;padding:13px 0;border-bottom:1px solid rgba(23,57,42,.14)}
.lg-row b{display:block;color:#183f2d;font-size:14px}
.lg-row span:not(.lg-ico){font-size:12.5px;color:#5b7468}
.lg-ico{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:rgba(15,127,64,.1);color:#1e7a4b;flex:none}
.ai{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.lg-cta{display:flex;align-items:center;gap:16px;margin-top:6px}
.lg-cta b{display:block;color:#183f2d;font-size:14px}
.lg-cta span:not(.lg-round){font-size:13px;color:#5b7468}
.lg-round{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(15,127,64,.1);color:#1e7a4b;flex:none}
.lg-foot{position:relative;display:flex;justify-content:space-between;border-top:1px solid rgba(23,57,42,.14);padding-top:16px;font-size:11.5px;color:#5b7468}
.lg-main{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px 22px;background:#fbfcfb}
.lg-card-main{width:min(420px,100%);display:flex;flex-direction:column;gap:16px;margin-block:auto;background:#fff;border:1px solid #e3ebe5;border-radius:22px;padding:30px 34px 26px;box-shadow:0 20px 60px rgba(24,63,45,.08)}
.lg-mbrand{display:none;color:#17392a;padding:0}
.lg-legal{width:min(500px,100%);display:flex;justify-content:space-between;font-size:11px;color:#8a9a91;margin-top:24px}
.lg-eyebrow.dark{color:#1e7a4b;font-size:11px;margin-bottom:-6px}
.lg-card-main h1{font-size:27px;line-height:1.12;letter-spacing:-.03em;color:#14211b}
.lg-sub{margin:-6px 0 4px;color:#68786f;font-size:12.5px}
.lg-card-main form{display:flex;flex-direction:column;gap:14px}
.lg-field{display:flex;flex-direction:column;gap:7px}
.lg-lab{display:flex;justify-content:space-between;align-items:baseline}
.lg-lab label{font-size:12.5px;font-weight:650;color:#14211b}
.lg-input{position:relative;display:flex;align-items:center}
.lg-input>.ai{position:absolute;left:13px;color:#7c8c84;width:16px;height:16px}
.lg-input input{flex:1;border:1px solid #d8e1db;background:#fff;border-radius:10px;padding:11px 40px 11px 38px;font-size:14.5px;color:#14211b;min-width:0}
.lg-input input::placeholder{color:#9aa8a0}
.lg-input input:focus{outline:none;border-color:#1e7a4b;box-shadow:0 0 0 3px rgba(30,122,75,.14)}
.lg-eye{all:unset;position:absolute;right:10px;cursor:pointer;color:#7c8c84;display:grid;place-items:center;width:26px;height:26px;border-radius:6px}
.lg-eye:hover{color:#14211b}
.lg-check{display:flex;align-items:center;gap:9px;font-size:12.5px;color:#4c5e55;cursor:pointer}
.lg-check input{width:16px;height:16px;accent-color:#1e7a4b}
.lg-btn{display:flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:10px;padding:13px 14px;background:linear-gradient(90deg,#1b8a52,#0f6f3e);color:#fff;font-weight:700;font-size:14.5px;cursor:pointer;box-shadow:0 8px 20px rgba(15,111,62,.22)}
.lg-btn:hover{filter:brightness(1.05)}
.lg-btn:disabled{opacity:.6;cursor:default}
.lg-btn.ghost{background:#fff;color:#14211b;border:1px solid #d8e1db;box-shadow:none}
.lg-btn .ai{width:16px;height:16px}
.lg-link{all:unset;cursor:pointer;color:#1e7a4b;font-weight:700}
.lg-link.sm{font-size:11.5px}
.lg-link:hover{text-decoration:underline}
.lg-link:focus-visible{outline:2px solid #2f6fde;outline-offset:2px}
.lg-link .ai{width:12px;height:12px;vertical-align:-1px}
.lg-back{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:#68786f;align-self:flex-start}
.lg-back:hover{color:#14211b}
.lg-back .ai{width:15px;height:15px}
.lg-note{display:flex;gap:12px;align-items:flex-start;border:1px solid #e3ebe5;background:#f5f9f6;border-radius:12px;padding:14px 16px;font-size:11.5px;color:#68786f;line-height:1.5;margin-top:10px}
.lg-note>.ai{color:#1e7a4b;width:20px;height:20px;padding:2px;border-radius:50%;background:#e2f1e7}
.lg-note b{display:block;color:#14211b;font-size:12.5px;margin-bottom:3px}
.lg-note span b{display:inline;font-size:inherit}
.lg-note.ok{border-color:#bfe2cc;background:#eaf6ee}
.lg-join{margin:0;text-align:center;font-size:12px;color:#68786f}
@media (max-width:1100px){.lg-side{padding:30px 40px 22px}}
@media (max-width:960px){
  .lg-wrap{grid-template-columns:1fr}
  .lg-side{display:none}
  .lg-mbrand{display:flex}
  .lg-main{min-height:100vh;justify-content:flex-start;padding:28px 16px 18px}
  .lg-card-main{padding:24px 20px 22px;border-radius:18px}
}
.lg-card-main .err:empty{display:none}