/* ESS SIL Portal, brand system shared with the other ESS portals */
:root{
  --dg:#00473D; --dg2:#0B5446; --dg3:#06392F; --lg:#70FF8E; --lg2:#A5EC6A;
  --ink:#18221E; --muted:#5E706A; --mint:#E9F8E1; --mint2:#F4FBF1; --line:#E3ECE8;
  --paper:#fff; --bg:#F4F6F5; --off:#F4F4F2; --blush:#F6E6E3; --purple:#532EA0;
  --red:#B42318; --redbg:#FDECEA; --amber:#B8791A; --amberbg:#FFF4E0; --green:#2E7D4F; --greenbg:#E7F6EC;
  --grey:#7A8A85; --greybg:#EEF2F0;
  --disp:'Poppins','Segoe UI',Helvetica,Arial,sans-serif;
  --body:'Inter','Segoe UI',Helvetica,Arial,sans-serif;
  --r:12px; --sh:0 1px 2px rgba(16,40,32,.06),0 1px 1px rgba(16,40,32,.03);
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{font-family:var(--body);color:var(--ink);background:var(--bg);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;}
a{color:var(--dg);}
button{font-family:inherit;}
h1,h2,h3,h4{font-family:var(--disp);color:var(--dg);letter-spacing:-.2px;}

/* ---------- layout ---------- */
.app{display:grid;grid-template-columns:248px 1fr;min-height:100vh;}
.side{background:var(--dg);color:#CFE8DC;position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column;}
.side .brand{padding:20px 20px 14px;border-bottom:1px solid rgba(255,255,255,.08);}
.side .brand img{height:26px;display:block;}
.side .brand .prod{font-family:var(--disp);font-weight:700;font-size:10px;letter-spacing:3px;color:var(--lg);margin-top:10px;text-transform:uppercase;}
.nav{padding:10px 10px 20px;flex:1;}
.nav .grp{font-family:var(--disp);font-weight:700;font-size:9.5px;letter-spacing:2px;color:rgba(207,232,220,.55);text-transform:uppercase;padding:14px 10px 6px;}
.nav a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:9px;color:#DCEFE6;text-decoration:none;font-size:13.5px;font-weight:500;}
.nav a:hover{background:rgba(255,255,255,.06);}
.nav a.on{background:rgba(112,255,142,.14);color:#fff;}
.nav a.on svg{color:var(--lg);}
.nav a svg{width:17px;height:17px;flex:none;color:#9FC9B8;}
.nav a .cnt{margin-left:auto;background:var(--lg);color:var(--dg);font-family:var(--disp);font-weight:700;font-size:10.5px;border-radius:20px;padding:1px 7px;}
.nav a .cnt.red{background:#FF8A7A;color:#4a0d06;}
.side .me{padding:14px 18px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:#BFDCCF;}
.side .me b{display:block;color:#fff;font-weight:600;font-size:13px;}

.main{min-width:0;}
.top{display:flex;align-items:center;gap:14px;padding:16px 30px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;}
.top .crumb{font-size:12px;color:var(--muted);}
.top h1{font-size:21px;font-weight:700;}
.top .sp{flex:1;}
.search{position:relative;}
.search input{border:1px solid var(--line);background:var(--off);border-radius:10px;padding:8px 12px 8px 32px;width:260px;font:inherit;font-size:13px;}
.search svg{position:absolute;left:10px;top:9px;width:15px;height:15px;color:var(--grey);}
.search .res{position:absolute;top:40px;right:0;width:360px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.12);padding:6px;display:none;max-height:380px;overflow:auto;}
.search .res.show{display:block;}
.search .res a{display:block;padding:8px 10px;border-radius:8px;text-decoration:none;color:var(--ink);font-size:13px;}
.search .res a:hover{background:var(--mint2);}
.search .res a small{display:block;color:var(--muted);font-size:11.5px;}
.content{padding:24px 30px 60px;max-width:1400px;}
.demo{background:#FFF7DB;border:1px solid #F1DB8F;color:#5c4808;border-radius:10px;padding:9px 14px;font-size:12.5px;margin-bottom:18px;display:flex;gap:12px;align-items:center;}
.demo b{color:#5c4808;}
.demo button{margin-left:auto;}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--dg);background:var(--dg);color:#fff;border-radius:10px;padding:8px 14px;font-weight:600;font-size:13px;cursor:pointer;text-decoration:none;white-space:nowrap;}
.btn:hover{background:var(--dg2);}
.btn.lime{background:var(--lg);border-color:var(--lg);color:var(--dg);}
.btn.ghost{background:#fff;color:var(--dg);border-color:#C9D8D2;}
.btn.ghost:hover{background:var(--mint2);}
.btn.sm{padding:5px 10px;font-size:12px;border-radius:8px;}
.btn.danger{background:#fff;color:var(--red);border-color:#EBC4BF;}
.btn svg{width:15px;height:15px;}
.btns{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}

/* ---------- cards ---------- */
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);}
.card .hd{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);}
.card .hd h3{font-size:14.5px;font-weight:700;}
.card .hd .sub{font-size:12px;color:var(--muted);}
.card .hd .sp{flex:1;}
.card .bd{padding:16px 18px;}
.card .bd.np{padding:0;}
.grid{display:grid;gap:16px;}
.g2{grid-template-columns:1fr 1fr;} .g3{grid-template-columns:repeat(3,1fr);} .g4{grid-template-columns:repeat(4,1fr);}
.g21{grid-template-columns:2fr 1fr;} .g12{grid-template-columns:1fr 2fr;}
.mt{margin-top:16px;} .mt2{margin-top:24px;} .mb{margin-bottom:16px;}
@media (max-width:1100px){.g3,.g4{grid-template-columns:1fr 1fr;}.g21,.g12{grid-template-columns:1fr;}}
@media (max-width:980px){.g2{grid-template-columns:1fr;}.app{grid-template-columns:210px 1fr;}.content{padding:20px 18px 50px;}.top{padding:14px 18px;}.kv{grid-template-columns:140px 1fr;}.kanban{grid-template-columns:repeat(5,200px);}}
.card .bd.hdr{display:flex;gap:16px;align-items:center;flex-wrap:wrap;}
.card .bd.hdr .who{flex:1;min-width:220px;}
.card .bd np,.card .bd.np{overflow-x:auto;}
@media (max-width:760px){.app{grid-template-columns:1fr;}.side{position:relative;height:auto;}.g2,.g3,.g4{grid-template-columns:1fr;}.search input{width:160px;}}

.stat{padding:16px 18px;}
.stat .k{font-size:11.5px;color:var(--muted);font-weight:500;}
.stat .v{font-family:var(--disp);font-weight:800;font-size:28px;color:var(--dg);line-height:1.1;margin-top:4px;}
.stat .s{font-size:12px;color:var(--muted);margin-top:3px;}
.stat.hero{background:var(--dg);border-color:var(--dg);}
.stat.hero .k,.stat.hero .s{color:#BFDCCF;} .stat.hero .v{color:var(--lg);}

.ring{width:118px;height:118px;flex:none;}
.hero-row{display:flex;gap:22px;align-items:center;}

/* ---------- tables ---------- */
table.tb{width:100%;border-collapse:collapse;}
.tb th{font-family:var(--disp);font-weight:600;font-size:10.5px;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);background:#FAFCFB;}
.tb td{padding:11px 14px;border-bottom:1px solid #EEF3F1;font-size:13px;vertical-align:top;}
.tb tr:last-child td{border-bottom:none;}
.tb tr.click{cursor:pointer;} .tb tr.click:hover td{background:var(--mint2);}
.tb td.num{font-family:var(--disp);font-weight:700;color:var(--dg);}
.empty{padding:26px;text-align:center;color:var(--muted);font-size:13px;}

/* ---------- pills ---------- */
.pill{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;padding:2px 9px;border-radius:20px;white-space:nowrap;line-height:1.6;}
.pill.g{background:var(--greenbg);color:var(--green);} .pill.a{background:var(--amberbg);color:var(--amber);}
.pill.r{background:var(--redbg);color:var(--red);} .pill.n{background:var(--greybg);color:var(--grey);}
.pill.dg{background:var(--dg);color:var(--lg);} .pill.p{background:#EEE8F8;color:var(--purple);}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block;flex:none;}
.dot.g{background:#3BA466;} .dot.a{background:#E0A030;} .dot.r{background:#D9473A;} .dot.n{background:#B9C5C1;}

/* ---------- lists ---------- */
.list .it{display:flex;gap:12px;align-items:flex-start;padding:11px 18px;border-bottom:1px solid #EEF3F1;}
.list .it:last-child{border-bottom:none;}
.list .it .t{font-weight:600;font-size:13px;}
.list .it .m{font-size:12px;color:var(--muted);margin-top:1px;}
.list .it .rt{margin-left:auto;text-align:right;flex:none;}
.list .it.click{cursor:pointer;} .list .it.click:hover{background:var(--mint2);}

.av{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:700;font-size:13px;color:#fff;flex:none;}
.av.lg{width:58px;height:58px;font-size:20px;}

/* ---------- tabs ---------- */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:18px;overflow-x:auto;}
.tabs a{padding:10px 14px;font-size:13px;font-weight:600;color:var(--muted);text-decoration:none;border-bottom:2.5px solid transparent;white-space:nowrap;}
.tabs a.on{color:var(--dg);border-color:var(--dg);}

/* ---------- key value ---------- */
.kv{display:grid;grid-template-columns:190px 1fr;gap:0;}
.kv div{padding:8px 0;border-bottom:1px solid #EEF3F1;font-size:13px;}
.kv .k{color:var(--muted);font-weight:500;}
.kv .v{white-space:pre-wrap;}
.muted{color:var(--muted);} .small{font-size:12px;}
.sec-title{font-family:var(--disp);font-weight:700;font-size:15px;color:var(--dg);margin:22px 0 10px;}
.help{background:var(--mint2);border-left:4px solid var(--lg2);border-radius:0 10px 10px 0;padding:11px 14px;font-size:12.5px;color:#2f463e;line-height:1.55;}
.help b{color:var(--dg);}
.warnbox{background:var(--redbg);border-left:4px solid #E0776B;border-radius:0 10px 10px 0;padding:11px 14px;font-size:12.5px;color:#5a1f19;}

/* ---------- kanban ---------- */
.kanban{display:grid;grid-template-columns:repeat(5,minmax(200px,1fr));gap:12px;overflow-x:auto;}
.col{background:#EDF2F0;border-radius:12px;padding:10px;min-height:120px;}
.col h4{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);padding:2px 4px 8px;display:flex;justify-content:space-between;}
.kc{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 11px;margin-bottom:8px;cursor:pointer;box-shadow:var(--sh);}
.kc:hover{border-color:#A9C4BA;}
.kc .t{font-weight:600;font-size:13px;} .kc .m{font-size:11.5px;color:var(--muted);margin-top:3px;}

/* ---------- picture cards ---------- */
.pcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px;}
.pcard{border:1.5px solid #DDE7E3;border-radius:12px;padding:10px 8px;text-align:center;cursor:pointer;background:#fff;user-select:none;}
.pcard .ic{font-size:26px;line-height:1;}
.pcard .lb{font-size:12px;font-weight:600;margin-top:6px;color:#42524d;}
.pcard.on{border-color:var(--dg);background:#EAF7EE;}
.pcard.on .lb{color:var(--dg);}
.pcard.bad.on{border-color:#D9473A;background:var(--redbg);}
.pcard.ro{cursor:default;}

/* ---------- modal + forms ---------- */
.ov{position:fixed;inset:0;background:rgba(6,30,24,.45);z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;overflow:auto;}
.modal{background:#fff;border-radius:16px;width:100%;max-width:720px;box-shadow:0 30px 70px rgba(0,0,0,.25);}
.modal.wide{max-width:980px;}
.modal .mh{display:flex;align-items:center;padding:18px 22px;border-bottom:1px solid var(--line);}
.modal .mh h3{font-size:17px;}
.modal .mh .x{margin-left:auto;border:none;background:none;font-size:22px;cursor:pointer;color:var(--muted);}
.modal .mb{padding:18px 22px;max-height:70vh;overflow:auto;}
.modal .mf{display:flex;gap:8px;justify-content:flex-end;padding:14px 22px;border-top:1px solid var(--line);background:#FAFCFB;border-radius:0 0 16px 16px;}
.f{margin-bottom:14px;}
.f label.l{display:block;font-weight:600;font-size:12.5px;color:#33423d;margin-bottom:5px;}
.f .hint{font-size:11.5px;color:var(--muted);margin:-2px 0 6px;}
.f input[type=text],.f input[type=date],.f input[type=number],.f input[type=time],.f select,.f textarea{width:100%;border:1px solid #CFDCD6;border-radius:9px;padding:9px 11px;font:inherit;font-size:13.5px;background:#fff;color:var(--ink);}
.f textarea{min-height:76px;resize:vertical;}
.f input:focus,.f select:focus,.f textarea:focus{outline:2px solid #9EE7B0;border-color:#5DBB7A;}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.checks{display:flex;flex-wrap:wrap;gap:6px;}
.chk{display:inline-flex;align-items:center;gap:6px;border:1px solid #D5E1DC;border-radius:20px;padding:5px 11px;font-size:12.5px;cursor:pointer;background:#fff;}
.chk input{accent-color:var(--dg);}
.chk.on{background:#EAF7EE;border-color:#86C99B;color:var(--dg);font-weight:600;}
.seg{display:inline-flex;border:1px solid #CFDCD6;border-radius:10px;overflow:hidden;}
.seg button{border:none;background:#fff;padding:7px 13px;font-size:12.5px;cursor:pointer;color:#42524d;border-right:1px solid #E3ECE8;}
.seg button:last-child{border-right:none;}
.seg button.on{background:var(--dg);color:#fff;font-weight:600;}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);background:var(--dg);color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;z-index:200;box-shadow:0 10px 30px rgba(0,0,0,.2);}
.toast b{color:var(--lg);}

/* ---------- timeline ---------- */
.tl{position:relative;padding-left:22px;}
.tl:before{content:"";position:absolute;left:7px;top:4px;bottom:4px;width:2px;background:#DCE8E3;}
.tl .e{position:relative;padding:0 0 14px;}
.tl .e:before{content:"";position:absolute;left:-19px;top:5px;width:10px;height:10px;border-radius:50%;background:#fff;border:2.5px solid var(--dg);}
.tl .e .d{font-size:11.5px;color:var(--muted);}
.tl .e .t{font-weight:600;font-size:13px;}
.tl .e .x{font-size:12.5px;color:#42524d;white-space:pre-wrap;}

/* ---------- progress ---------- */
.bar{height:8px;background:#E6EEEA;border-radius:6px;overflow:hidden;}
.bar i{display:block;height:100%;background:var(--dg);border-radius:6px;}
.bar.g i{background:#3BA466;} .bar.a i{background:#E0A030;} .bar.r i{background:#D9473A;}

/* ---------- standards ---------- */
.std{border:1px solid var(--line);border-radius:12px;background:#fff;margin-bottom:10px;}
.std .row{display:flex;gap:12px;align-items:flex-start;padding:12px 16px;cursor:pointer;}
.std .code{font-family:var(--disp);font-weight:800;font-size:13px;color:var(--dg);width:38px;flex:none;}
.std .txt{flex:1;font-size:13px;}
.std .txt .q{font-weight:600;}
.std .txt .mv{font-size:12px;color:var(--muted);margin-top:2px;}
.std .more{display:none;padding:0 16px 14px 66px;font-size:12.5px;color:#42524d;}
.std.open .more{display:block;}
.std .more h5{font-family:var(--disp);font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:var(--muted);margin:10px 0 3px;}

/* ---------- easy read check-in (resident facing) ---------- */
.er{position:fixed;inset:0;background:#F3FBF5;z-index:150;display:flex;flex-direction:column;}
.er .erh{display:flex;align-items:center;padding:18px 26px;background:var(--dg);}
.er .erh img{height:30px;}
.er .erh .x{margin-left:auto;}
.er .erb{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;text-align:center;}
.er .who{font-family:var(--disp);font-weight:700;color:var(--muted);letter-spacing:2px;font-size:13px;text-transform:uppercase;}
.er .qq{font-family:var(--disp);font-weight:800;font-size:40px;color:var(--dg);margin:14px 0 30px;max-width:820px;line-height:1.15;}
.er .faces{display:flex;gap:22px;flex-wrap:wrap;justify-content:center;}
.er .face{width:190px;border:3px solid #CFE3D8;border-radius:24px;background:#fff;padding:20px 10px;cursor:pointer;}
.er .face:hover,.er .face:focus-visible{border-color:var(--dg);outline:none;}
.er .face svg{width:100px;height:100px;}
.er .face .lb{font-family:var(--disp);font-weight:800;font-size:24px;margin-top:10px;color:var(--dg);}
.er .prog{display:flex;gap:8px;margin-top:34px;}
.er .prog i{width:40px;height:8px;border-radius:5px;background:#D5E6DC;}
.er .prog i.on{background:var(--dg);}
.er .say{margin-top:18px;}
.er textarea{width:min(700px,90vw);min-height:120px;font:inherit;font-size:20px;border:2px solid #CFE3D8;border-radius:16px;padding:14px;}

/* ---------- print (audit pack) ---------- */
@media print{
  .side,.top,.demo,.noprint,.btns{display:none!important;}
  .app{display:block;} .content{padding:0;max-width:none;}
  body{background:#fff;font-size:11.5px;}
  .card{box-shadow:none;break-inside:avoid;}
  .ov{position:static;background:none;padding:0;} .modal{box-shadow:none;max-width:none;}
  .modal .mb{max-height:none;overflow:visible;} .modal .mh .x,.modal .mf{display:none;}
}

/* ---------- sign in gate + save state ---------- */
.gate{position:fixed;inset:0;z-index:300;background:var(--dg);display:none;align-items:center;justify-content:center;padding:20px;}
.gatebox{width:100%;max-width:440px;text-align:center;color:#CFE8DC;}
.gatebox .gbird{width:96px;margin-bottom:14px;}
.gatebox .gk{font-family:var(--disp);font-weight:700;letter-spacing:4px;font-size:10.5px;color:var(--lg2);}
.gatebox h1{color:#fff;font-size:34px;font-weight:800;margin:6px 0 10px;}
.gatebox p{font-size:14px;line-height:1.6;margin-bottom:22px;}
.btn.big{width:100%;justify-content:center;padding:13px 18px;font-size:15px;border-radius:12px;}
.btn.big.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.35);}
.btn[disabled]{opacity:.45;cursor:not-allowed;}
.gor{margin:14px 0;font-size:12px;color:rgba(207,232,220,.6);}
.savestate{font-size:12px;white-space:nowrap;}
.savestate.ok{color:var(--green);} .savestate.busy{color:var(--amber);} .savestate.err{color:var(--red);font-weight:600;}
.savestate.ok:before{content:"● ";} .savestate.busy:before{content:"● ";} .savestate.err:before{content:"● ";}