/* SQUARE field apps — shared styles */
:root{
  --red:#E52E33; --red-dark:#C5272C; --ink:#0B0B0B; --text:#222; --muted:#666;
  --line:#e3e3e6; --bg:#eef0f3; --card:#ffffff;
  --grn:#1FA463; --grn-bg:#e9f8f0; --grn-ln:#bfe8d4;
  --amb:#E08A1E; --amb-bg:#fdf3e3; --amb-ln:#f3dcae;
  --crit:#E52E33; --crit-bg:#fdebec; --crit-ln:#f6c4c6;
  --wa:#25D366; --wa-dark:#1da851;
  --radius:16px;
  --role:#E52E33; --role-dark:#C5272C; --role-bg:#fdebec;
  --appw:480px;            /* app column width — widens on larger screens */
}
/* responsive app width: phone = full; tablet/desktop = wider, multi-column lists */
@media (min-width:760px){ :root{ --appw:760px } }
@media (min-width:1180px){ :root{ --appw:1080px } }
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent}
html,body{margin:0; padding:0}
body{
  font-family:"Heebo",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  background:var(--bg); color:var(--text); direction:rtl;
  -webkit-font-smoothing:antialiased; padding-bottom:30px;
}

/* ===== top app bar ===== */
.topbar{position:sticky; top:0; z-index:45; display:flex; align-items:center; gap:8px;
  min-height:52px; padding:8px 10px; padding-top:calc(8px + env(safe-area-inset-top, 0px));
  max-width:var(--appw); margin:0 auto;
  background:var(--role-dark); color:#fff; box-shadow:0 2px 10px rgba(0,0,0,.16)}
.topbar .tb-btn{width:44px; height:44px; flex:none; border:none; cursor:pointer;
  background:rgba(255,255,255,.16); color:#fff; border-radius:10px; font-size:19px; font-weight:800;
  display:flex; align-items:center; justify-content:center}
.topbar .tb-btn.ghost{background:transparent; pointer-events:none}
.topbar .tb-btn:active{transform:scale(.94)}
.topbar .tb-title{flex:1; font-weight:800; font-size:16px; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

/* ===== drawer ===== */
.scrim{position:fixed; inset:0; z-index:60; background:rgba(0,0,0,.42); opacity:0; pointer-events:none; transition:opacity .2s}
.scrim.open{opacity:1; pointer-events:auto}
.drawer{position:absolute; top:0; bottom:0; left:0; width:80%; max-width:310px; background:#fff;
  transform:translateX(-100%); transition:transform .22s ease; overflow:auto; padding:0 0 20px;
  box-shadow:4px 0 24px rgba(0,0,0,.18)}
.scrim.open .drawer{transform:translateX(0)}
.drawer .dr-head{background:linear-gradient(135deg,var(--role),var(--role-dark)); color:#fff;
  padding:20px 18px; font-size:15px; font-weight:700; display:flex; align-items:center; gap:4px}
.drawer .dr-head .brandlogo{height:30px; width:auto}
.drawer .dr-head .dr-role{font-weight:700; opacity:.9}
.drawer .dr-sec{font-size:11.5px; font-weight:800; color:var(--muted); padding:16px 18px 6px}
.drawer .dlink{display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--text);
  padding:13px 18px; font-size:16px; font-weight:700}
.drawer .dlink .de{font-size:21px; width:26px; text-align:center}
.drawer .dlink:active{background:#f3f4f6}
.drawer .dlink.on{color:var(--role); background:var(--role-bg)}
.drawer .dlink .now{font-size:11.5px; font-weight:800; opacity:.8; margin-inline-start:auto}
.drawer .dr-foot{color:var(--muted); font-size:11.5px; font-weight:600; text-align:center; margin-top:18px}

/* waze button on building view */
.btn.waze{display:flex; align-items:center; justify-content:center; gap:8px; margin-top:12px;
  background:#33ccff; color:#062a35; border:none}

/* ===== PIN screen ===== */
.pin-card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); margin:34px auto; max-width:min(430px, calc(100% - 32px)); padding:28px 22px; text-align:center; box-shadow:0 4px 18px rgba(0,0,0,.06)}
.pin-card .pin-logo{font-size:46px}
.pin-brand{margin-bottom:16px}
.pin-brand .pin-logo-img{width:188px; max-width:74%; height:auto; display:block; margin:0 auto}
.pin-brand .pb-wm{font-size:24px; font-weight:900; letter-spacing:4px; color:var(--ink); line-height:1}
.pin-brand .pb-tag{font-size:11.5px; font-weight:800; color:var(--red); letter-spacing:1.5px; margin-top:3px}
.pin-card h2{margin:10px 0 4px; font-size:21px; font-weight:800}
.pin-card p{margin:0 0 16px; color:var(--muted); font-size:14px; font-weight:600}
.pin-input{width:100%; text-align:center; font-size:30px; letter-spacing:14px; font-weight:800; padding:12px; border:1.5px solid var(--line); border-radius:13px; margin-bottom:12px; direction:ltr}
.pin-input:focus{outline:none; border-color:var(--role)}
.login-input{width:100%; box-sizing:border-box; text-align:center; font-size:18px; font-weight:700; padding:13px; border:1.5px solid var(--line); border-radius:13px; margin-bottom:10px; font-family:inherit; direction:rtl}
.login-input:focus{outline:none; border-color:var(--role)}
/* branded login */
.login-card{background:var(--card); border:1px solid var(--line); border-radius:24px; margin:30px auto; max-width:min(430px, calc(100% - 32px)); overflow:hidden; box-shadow:0 12px 36px rgba(0,0,0,.11)}
/* forms stay readable (centered) even when the app column is wide on desktop */
.formpad{padding:16px; max-width:600px; margin:0 auto}
.login-brand{padding:32px 22px 24px; text-align:center; background:radial-gradient(130% 130% at 50% -10%, #fff 0%, var(--role-bg) 100%); border-bottom:1px solid var(--line)}
.login-logo{width:215px; max-width:74%; height:auto; display:block; margin:0 auto}
.login-wm{font-size:31px; font-weight:900; letter-spacing:5px; color:var(--ink); line-height:1}
.login-tag{font-size:12.5px; font-weight:800; color:var(--role); letter-spacing:1.5px; margin-top:5px}
.login-body{padding:22px}
.login-body h2{margin:0 0 4px; font-size:20px; font-weight:800; text-align:center}
.login-body p{margin:0 0 16px; color:var(--muted); font-size:14px; font-weight:600; text-align:center}

/* ===== caretaker task cards ===== */
.tcard{display:flex; align-items:stretch; gap:0; margin:10px 0; cursor:pointer; overflow:hidden; transition:transform .05s ease}
.tcard:active{transform:scale(.99)}
.tcard .tnum{flex:none; width:42px; display:flex; align-items:center; justify-content:center; font-size:17px; font-weight:800; color:#fff; background:var(--role)}
.tcard.is-done{opacity:.6}
.tcard.is-done .tnum{background:var(--grn)}
.tcard .tbody{flex:1; padding:12px 13px; min-width:0}
.tcard .tbtitle{font-size:16.5px; font-weight:800; color:var(--ink); line-height:1.3}
.tcard .twhat{font-size:14.5px; color:var(--text); margin-top:4px; line-height:1.45}
.tcard .tgo{display:flex; align-items:center; padding:0 12px; color:var(--muted); font-size:22px}
.tcard .row2{display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; align-items:center}
.tag.est{background:#eef1f4; color:#555}
.tdone{font-size:11.5px; font-weight:800; color:#15784a; background:var(--grn-bg); border-radius:999px; padding:3px 9px}
.tstuck{font-size:11.5px; font-weight:800; color:#9a5e07; background:var(--amb-bg); border-radius:999px; padding:3px 9px}
.task-what{font-size:16.5px; font-weight:800; line-height:1.4; color:var(--ink); margin-bottom:4px}

/* cleaning spec (per building) */
.spec{background:var(--card); border:1px solid var(--line); border-radius:12px; padding:11px 13px; margin:8px 0}
.spec .spec-a{font-size:14.5px; font-weight:800; color:var(--ink)}
.spec ul{margin:6px 0 0; padding-inline-start:18px}
.spec li{font-size:13px; color:var(--text); line-height:1.6; font-weight:500}
.btn.solid.eod{margin-top:16px; background:var(--ink)}
#eodBox{margin-top:10px}

/* ===== attendance / hours ===== */
.clock-card{background:var(--card); border:1px solid var(--line); border-radius:16px; padding:20px 16px; text-align:center; box-shadow:0 2px 8px rgba(0,0,0,.05)}
.clock-card.live{border-color:#f6c4c6; background:#fff8f8}
.clock-card .cl-lbl{font-size:13px; font-weight:700; color:var(--muted)}
.clock-card .cl-big{font-size:22px; font-weight:800; color:var(--ink); margin-top:3px}
.clock-big{display:block; width:100%; border:none; cursor:pointer; border-radius:18px; padding:24px 16px; font-size:22px; font-weight:800; color:#fff; margin-top:16px; box-shadow:0 8px 20px rgba(0,0,0,.18); transition:transform .06s ease}
.clock-big:active{transform:scale(.98)}
.clock-big.in{background:linear-gradient(135deg,#1FA463,#178551)}
.clock-big.out{background:linear-gradient(135deg,#E52E33,#C5272C)}
.manual{background:var(--card); border:1px solid var(--line); border-radius:13px; padding:12px}
.manual input{width:100%; border:1.5px solid var(--line); border-radius:10px; padding:10px 11px; font-size:16px; font-family:inherit; margin-bottom:8px}
.manual .ml{display:block; font-size:11.5px; font-weight:800; color:var(--muted); margin:2px 2px 4px}
.manual .mrow2{display:flex; align-items:flex-end; gap:10px}
.manual .mrow2 .mcol{flex:1}
.manual .mrow2 input{margin-bottom:8px}
.manual .btn{margin-top:2px}
.hrow{display:flex; align-items:center; gap:8px; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:11px 12px; margin:7px 0}
.hrow .hd{font-size:14px; font-weight:700; width:74px; flex:none}
.hrow .ht{flex:1; font-size:14px; font-weight:600; color:var(--text); direction:ltr; text-align:right}
.hrow .ht .run{font-size:11px; font-weight:800; color:#9a5e07; background:var(--amb-bg); border-radius:999px; padding:1px 7px}
.hrow .hh{font-size:14px; font-weight:800; color:var(--role); width:54px; text-align:left}
.hrow .hx{border:none; background:#f3f4f6; color:var(--muted); width:28px; height:28px; border-radius:8px; font-size:13px; cursor:pointer; flex:none}
.wrap{max-width:var(--appw); margin:0 auto; padding:0 0 24px}
a{color:inherit}
button{font-family:inherit}

/* header */
.hdr{
  background:linear-gradient(135deg,var(--role) 0%,var(--role-dark) 100%);
  color:#fff; padding:16px 18px 18px; position:relative;
  border-bottom-left-radius:22px; border-bottom-right-radius:22px;
  box-shadow:0 6px 20px rgba(0,0,0,.12);
  max-width:var(--appw); margin:0 auto;
}
/* responsive multi-column card lists (1 col on phone, more on wider screens) */
.cardgrid{display:flex; flex-direction:column; gap:10px; margin:10px 0}
.cardgrid > *{margin:0 !important}
@media (min-width:760px){
  .cardgrid{display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:start}
}
@media (min-width:1180px){
  .cardgrid{grid-template-columns:1fr 1fr 1fr}
}
.hdr .brand{display:flex; align-items:center; gap:8px; opacity:.98}
.hdr .brand .brandlogo{height:27px; width:auto}
.hdr .brand .brandlabel{font-weight:700; font-size:13px; opacity:.88}
.hdr h1{margin:9px 0 2px; font-size:22px; font-weight:800; display:flex; align-items:center; gap:9px}
.hdr .sub{font-size:13.5px; opacity:.92; font-weight:500}
.hdr .who-chip{
  display:inline-flex; align-items:center; gap:6px; margin-top:11px;
  background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.35);
  border-radius:999px; padding:5px 12px 5px 9px; font-size:13.5px; font-weight:700;
}
.hdr .who-chip .x{opacity:.85; font-weight:800; margin-inline-start:2px}
.hdr .backbtn{
  position:absolute; inset-inline-start:14px; top:16px;
  background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.32);
  color:#fff; border-radius:10px; padding:6px 11px; font-size:13px; font-weight:700; cursor:pointer;
}

/* generic card */
.card{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); box-shadow:0 1px 3px rgba(0,0,0,.04)}
.sec{padding:14px 16px 0}
.sec-t{font-size:13px; font-weight:800; color:var(--muted); margin:18px 4px 9px; display:flex; align-items:center; gap:7px}
.sec-t .pill{background:var(--role-bg); color:var(--role-dark); border-radius:999px; padding:1px 9px; font-size:12px; font-weight:800}

/* worker picker */
.pick-grid{display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:4px}
.pick{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  background:var(--card); border:1.5px solid var(--line); border-radius:14px;
  padding:18px 8px; font-size:16px; font-weight:800; color:var(--text); cursor:pointer; min-height:84px;
  transition:transform .05s ease;
}
.pick:active{transform:scale(.97)}
.pick .av{
  width:40px; height:40px; border-radius:50%; background:var(--role-bg); color:var(--role-dark);
  display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:800;
}
.pick .cnt{font-size:12px; font-weight:700; color:var(--muted)}

/* building list cards */
.bcard{
  display:flex; align-items:stretch; gap:0; margin:10px 0; cursor:pointer; overflow:hidden;
  transition:transform .05s ease;
}
.bcard:active{transform:scale(.99)}
.bcard .body{flex:1; padding:13px 14px}
.bcard .title{font-size:16px; font-weight:800; color:var(--ink); line-height:1.25}
.bcard .meta{font-size:12.5px; color:var(--muted); margin-top:3px; font-weight:600}
.bcard .row2{display:flex; flex-wrap:wrap; gap:6px; margin-top:9px}
.bcard .go{display:flex; align-items:center; padding:0 14px; color:var(--muted); font-size:22px}

.tag{display:inline-flex; align-items:center; gap:4px; border-radius:999px; padding:3px 9px; font-size:11.5px; font-weight:800; border:1px solid var(--line); background:#f7f7f9; color:var(--text)}
.tag.today{background:var(--role-dark); border-color:var(--role-dark); color:#fff}
.tag.ok{background:var(--grn-bg); border-color:var(--grn-ln); color:#15784a}
.tag.watch{background:var(--amb-bg); border-color:var(--amb-ln); color:#9a5e07}
.tag.crit{background:var(--crit-bg); border-color:var(--crit-ln); color:#b71f24}

/* today banner */
.today-band{
  background:linear-gradient(135deg,var(--role) 0%,var(--role-dark) 100%); color:#fff;
  border-radius:var(--radius); padding:14px 16px; margin:4px 0 2px; box-shadow:0 6px 18px rgba(229,46,51,.22);
}
.today-band .lbl{font-size:12.5px; font-weight:700; opacity:.92}
.today-band .big{font-size:18px; font-weight:800; margin-top:2px}
.today-band .small{font-size:13px; opacity:.95; margin-top:4px; font-weight:500}

.empty{color:var(--muted); font-size:14px; text-align:center; padding:22px 12px; font-weight:600}

/* note / gap banner */
.note{
  background:#fff8e8; border:1px solid var(--amb-ln); color:#7a5408;
  border-radius:13px; padding:11px 13px; font-size:12.5px; font-weight:600; margin:12px 0; line-height:1.5;
}
.note b{color:#5e4106}

/* plan + tasks */
.plan-head{padding:2px 2px 0}
.plan-head .addr{font-size:13px; color:var(--muted); font-weight:600; margin-top:2px}
.kv{display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 2px}
.kv .item{background:#f6f7f9; border:1px solid var(--line); border-radius:11px; padding:8px 11px; font-size:12.5px; font-weight:700; flex:1; min-width:46%}
.kv .item .k{color:var(--muted); font-weight:700; font-size:11px; display:block; margin-bottom:2px}

.task{
  display:flex; align-items:center; gap:11px; padding:13px 14px; border:1px solid var(--line);
  border-radius:13px; background:var(--card); margin:8px 0; cursor:pointer; transition:transform .05s ease;
}
.task:active{transform:scale(.99)}
.task .box{
  width:24px; height:24px; border-radius:7px; border:2px solid var(--line); flex:none;
  display:flex; align-items:center; justify-content:center; font-size:14px; color:#fff; background:#fff;
}
.task.on{border-color:var(--role); background:var(--role-bg)}
.task.on .box{background:var(--role); border-color:var(--role)}
.task .tx{font-size:15px; font-weight:700; flex:1}
.task .em{font-size:18px}
.task .day{font-size:11.5px; font-weight:800; color:var(--role-dark); background:var(--role-bg); border-radius:999px; padding:2px 8px}

/* maintenance rows (caretaker) */
.mrow{
  display:flex; align-items:center; gap:11px; padding:12px 14px; border:1px solid var(--line);
  border-radius:13px; background:var(--card); margin:8px 0;
}
.mrow .em{font-size:20px; width:26px; text-align:center}
.mrow .tx{flex:1}
.mrow .tx .t{font-size:14.5px; font-weight:800}
.mrow .tx .d{font-size:12.5px; color:var(--muted); font-weight:600; margin-top:1px}
.mrow .st{font-size:11.5px; font-weight:800; border-radius:999px; padding:3px 10px; white-space:nowrap}
.mrow.ok .st{background:var(--grn-bg); color:#15784a}
.mrow.soon{border-color:var(--amb-ln); background:#fffdf7}
.mrow.soon .st{background:var(--amb-bg); color:#9a5e07}
.mrow.over{border-color:var(--crit-ln); background:#fff8f8}
.mrow.over .st{background:var(--crit-bg); color:#b71f24}
.mrow.none .st{background:#f1f1f3; color:#9a9a9a}

/* status picker */
.stats{display:flex; gap:8px; margin:8px 0 2px}
.stat{flex:1; border:1.5px solid var(--line); border-radius:13px; background:var(--card); padding:12px 6px; text-align:center; cursor:pointer; transition:transform .05s ease}
.stat:active{transform:scale(.97)}
.stat .em{font-size:22px; display:block}
.stat .t{font-size:12.5px; font-weight:800; margin-top:4px}
.stat.on{border-color:var(--role); background:var(--role-bg)}

textarea{
  width:100%; border:1.5px solid var(--line); border-radius:13px; padding:12px 13px; font-size:16px;
  font-family:inherit; resize:vertical; min-height:74px; background:var(--card); color:var(--text);
}
textarea:focus{outline:none; border-color:var(--role)}

/* preview + send */
.prev{background:#0d1418; color:#e8eef0; border-radius:14px; padding:13px 14px; font-size:13px; white-space:pre-wrap; line-height:1.55; margin-top:6px; font-family:ui-monospace,Menlo,Consolas,monospace; direction:rtl}
.send{
  display:flex; align-items:center; justify-content:center; gap:9px; text-decoration:none;
  background:var(--wa); color:#fff; border-radius:14px; padding:15px; font-size:17px; font-weight:800;
  margin-top:12px; box-shadow:0 6px 16px rgba(37,211,102,.3);
}
.send.off{background:#c7ccce; color:#41464a; box-shadow:none; pointer-events:none}
.hint{font-size:12.5px; color:var(--muted); text-align:center; margin-top:9px; font-weight:600}
.hint.warn{color:var(--crit); font-weight:800}

.btn{display:block; width:100%; text-align:center; text-decoration:none; border:none; cursor:pointer;
  border-radius:13px; padding:13px; font-size:15px; font-weight:800; margin-top:10px}
.btn.solid{background:var(--role); color:#fff}
.btn.ghost{background:var(--card); border:1.5px solid var(--line); color:var(--text)}

.foot{text-align:center; color:var(--muted); font-size:11.5px; margin:20px 8px 0; font-weight:600; line-height:1.6}

/* ===== live field tasks (caretaker) ===== */
.hint.ok{color:#0a7d33; font-weight:800}
.livebar{font-size:12px; font-weight:800; text-align:center; border-radius:10px; padding:7px 10px; margin:0 16px 4px; border:none; box-sizing:border-box; width:auto; display:block; font-family:inherit}
button.livebar{cursor:pointer; width:calc(100% - 32px)}
.livebar.ok{background:#e6f6ee; color:#0a7d33}
.livebar.off{background:#fff4e5; color:#9a6400}
.sec-row{display:flex; align-items:center; justify-content:space-between; margin:18px 6px 2px}
.sec-row .sec-t{margin:0}
.addbtn{border:none; cursor:pointer; background:var(--role-dark); color:#fff; font-weight:800; font-size:13px; border-radius:999px; padding:8px 14px; font-family:inherit}
.addbtn:active{transform:scale(.96)}
.tag.wait{background:#eaf2ff; color:#1d4ed8}
.mini{font-weight:600; color:var(--muted); font-size:11.5px}

/* building info disclosure */
.binfo{margin-top:12px; background:var(--card); border:1px solid var(--line); border-radius:13px; overflow:hidden}
.binfo summary{list-style:none; cursor:pointer; padding:12px 14px; font-weight:800; font-size:13.5px; color:var(--ink); display:flex; align-items:center; gap:6px}
.binfo summary::-webkit-details-marker{display:none}
.binfo summary::after{content:"▾"; margin-inline-start:auto; color:var(--muted)}
.binfo[open] summary::after{content:"▴"}
.bi-body{padding:2px 14px 12px}
.bi-row{display:flex; gap:10px; padding:8px 0; border-top:1px solid var(--line); font-size:13.5px; align-items:center}
.bi-row:first-child{border-top:none}
.bi-k{flex:none; width:94px; color:var(--muted); font-weight:700}
.bi-v{flex:1; font-weight:700; color:var(--text)}
.bi-call{color:var(--role-dark); font-weight:800; text-decoration:none; white-space:nowrap}

/* status picker */
.stpick{display:flex; flex-wrap:wrap; gap:8px; margin-top:4px}
.stchip{display:inline-flex; align-items:center; gap:5px; border:1.5px solid var(--line); background:var(--card);
  color:var(--text); border-radius:999px; padding:9px 13px; font-size:13.5px; font-weight:700; cursor:pointer; font-family:inherit}
.stchip .e{font-size:14px}
.stchip:active{transform:scale(.96)}
.stchip.on{background:var(--role-dark); border-color:var(--role-dark); color:#fff}

/* instructions / update timeline */
.tl{display:flex; flex-direction:column; gap:8px; margin-top:4px}
.tlitem{background:var(--card); border:1px solid var(--line); border-inline-start:3px solid var(--role); border-radius:11px; padding:9px 12px}
.tlhead{font-size:11.5px; font-weight:800; color:var(--muted); margin-bottom:3px}
.tlbody{font-size:13.5px; font-weight:600; color:var(--text); line-height:1.5; white-space:pre-wrap; word-break:break-word}

/* form fields (new task) */
.fld{width:100%; padding:12px 13px; border:1.5px solid var(--line); border-radius:13px; font-size:16px; font-family:inherit; background:var(--card); color:var(--text); margin-top:2px}
.fld:focus{outline:none; border-color:var(--role)}

/* loading */
.loadwrap{display:flex; flex-direction:column; align-items:center; gap:14px; padding:60px 0}
.spin{width:40px; height:40px; border:4px solid var(--line); border-top-color:var(--role); border-radius:50%; animation:sq-spin .9s linear infinite}
.loadtx{color:var(--muted); font-weight:700; font-size:14px}
@keyframes sq-spin{to{transform:rotate(360deg)}}

/* OXS resident service-call cards */
.oxscard{border-inline-start:3px solid #0E7C86}
.oxscard.urg{border-inline-start-color:var(--crit); background:#fff7f7}
.waze-tag{text-decoration:none; background:#eef4ff !important; color:#1d4ed8 !important}
/* OXS closed-call history */
.oxscard.hist{border-inline-start-color:#94a3b8; background:#fafafa}
.histnote{margin:6px 0 2px; padding:7px 10px; background:#f0fdf4; border:1px solid #bbf7d0; border-radius:8px; font-size:13px; color:#166534; line-height:1.5}
.tag.done{background:#dcfce7 !important; color:#166534 !important}
.histlink{display:block; width:100%; margin:10px 0 2px; padding:11px; background:none; border:1px dashed var(--line,#e3e3e3); border-radius:10px; color:var(--muted,#666); font:inherit; font-size:13px; cursor:pointer; text-align:center}
.histlink:active{background:#f5f5f5}

/* ops metrics — per-building table */
.mrow{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 11px; background:#fff; border:1px solid var(--line,#eee); border-radius:10px; margin-bottom:6px}
.mrow.mhead{background:#f6f7f9; font-size:12px; color:var(--muted,#777); font-weight:700; margin-bottom:8px}
.mname{font-weight:600; font-size:14px; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mcells{display:flex; gap:6px; flex-shrink:0}
.mc{min-width:46px; text-align:center; font-size:13px; padding:3px 6px; border-radius:7px; background:#f3f4f6}
.mrow.mhead .mc{background:none; padding:0}
.mc.hot{background:#fee2e2; color:var(--crit,#c0392b); font-weight:700}

/* "מה עכשיו" focus hero (caretaker day) */
.nowcard{display:block; width:100%; text-align:start; font-family:inherit; cursor:pointer; background:#fff; border:1.5px solid var(--line); border-inline-start:5px solid var(--role); border-radius:16px; padding:13px 15px; margin:8px 0 4px; box-shadow:0 2px 9px rgba(0,0,0,.06)}
.nowcard.urg{border-inline-start-color:var(--crit); background:linear-gradient(135deg,#fff6f6,#fff)}
.nowcard.calm{border-inline-start-color:#22c55e; cursor:default; background:#f5fef9}
.nowcard:active:not(.calm){transform:scale(.99)}
.nowtag{font-size:12px; font-weight:800; color:var(--role); letter-spacing:.2px}
.nowcard.urg .nowtag{color:var(--crit)}
.nowcard.calm .nowtag{color:#16a34a}
.nowtitle{font-size:17px; font-weight:800; color:var(--ink); margin-top:3px; line-height:1.25}
.nowwhat{font-size:14px; color:var(--text); margin-top:3px; line-height:1.4}
.nowacts{display:flex; align-items:center; gap:11px; margin-top:11px; flex-wrap:wrap}
.nowwaze{display:inline-flex; align-items:center; gap:5px; background:var(--crit); color:#fff !important; text-decoration:none; font-weight:800; font-size:14px; border-radius:999px; padding:9px 18px}
.nowgo{font-size:13px; font-weight:800; color:var(--muted)}

/* נהלים ותפעול מערכות (procedures legend) */
.proc{background:var(--card); border:1px solid var(--line); border-radius:13px; margin-bottom:9px; overflow:hidden}
.proc>summary{display:flex; align-items:center; gap:11px; padding:14px 13px; cursor:pointer; list-style:none; font-weight:800; font-size:16px; color:var(--ink)}
.proc>summary::-webkit-details-marker{display:none}
.proc-i{font-size:24px; flex:none}
.proc-t{flex:1; min-width:0}
.proc-x{color:var(--muted); font-size:20px; transition:transform .15s ease}
.proc[open] .proc-x{transform:rotate(90deg)}
.proc-body{padding:2px 15px 15px; border-top:1px solid var(--line)}
.proc-intro{font-size:14px; color:var(--text); line-height:1.5; margin:10px 0}
.proc-h{font-size:13px; font-weight:800; color:var(--role); margin:12px 0 5px}
.proc-h.warn{color:#b45309}
.proc-ol,.proc-ul{margin:0; padding-inline-start:20px}
.proc-ol li,.proc-ul li{font-size:14px; color:var(--text); line-height:1.55; margin-bottom:6px}
.proc-pro{margin-top:12px; padding:9px 11px; background:#eef4ff; border:1px solid #c7d7f5; border-radius:9px; font-size:13.5px; font-weight:600; color:#1d4ed8; line-height:1.5}

/* multiple committee phones */
.phchip{display:inline-flex; align-items:center; gap:5px; margin:0 6px 6px 0}
.phn{font-size:12.5px; font-weight:800; color:var(--muted); margin-inline-end:2px}

/* supplier-intake selectable chips */
.supchips{display:flex; flex-wrap:wrap; gap:8px; margin:4px 0 6px}
.supchip{border:1.5px solid var(--line); background:var(--card); color:var(--text); border-radius:999px; padding:9px 14px; font-size:14px; font-weight:700; cursor:pointer; font-family:inherit; -webkit-tap-highlight-color:transparent; transition:background .12s,border-color .12s,color .12s}
.supchip.on{background:var(--role-dark); border-color:var(--role-dark); color:#fff}
.splbl{display:flex; align-items:center; gap:9px; margin:16px 4px; font-weight:700; font-size:14px; cursor:pointer}
.splbl input{width:20px; height:20px; accent-color:var(--role)}

/* global quick-add task FAB (caretaker) */
.add-fab{position:fixed; bottom:calc(18px + env(safe-area-inset-bottom, 0px)); inset-inline-end:max(18px, calc(50vw - var(--appw)/2 + 18px)); width:60px; height:60px; border-radius:50%; border:none;
  background:linear-gradient(135deg,#E52E33,#C5272C); color:#fff; font-size:36px; font-weight:300; line-height:1; padding-bottom:4px;
  display:flex; align-items:center; justify-content:center; box-shadow:0 6px 20px rgba(229,46,51,.45); cursor:pointer; z-index:50}
.add-fab:active{transform:scale(.92)}
.add-fab.open{transform:rotate(45deg)}
.fab-scrim{position:fixed; inset:0; z-index:49; display:none}
.fab-scrim.open{display:block}
.fab-menu{position:fixed; bottom:90px; inset-inline-end:16px; z-index:51; display:flex; flex-direction:column; gap:10px; align-items:flex-end;
  opacity:0; transform:translateY(10px) scale(.96); pointer-events:none; transition:opacity .15s ease, transform .15s ease}
.fab-menu.open{opacity:1; transform:none; pointer-events:auto}
.fab-opt{display:inline-flex; align-items:center; gap:9px; background:#fff; border:1px solid var(--line); border-radius:999px; padding:12px 17px;
  font-family:inherit; font-size:14.5px; font-weight:800; color:var(--ink); box-shadow:0 5px 16px rgba(0,0,0,.14); cursor:pointer; white-space:nowrap}
.fab-opt span{font-size:18px}
.fab-opt:active{transform:scale(.96)}

/* in-app Claude assistant */
.ai-fab{position:fixed; bottom:calc(18px + env(safe-area-inset-bottom, 0px)); inset-inline-start:max(18px, calc(50vw - var(--appw)/2 + 18px)); width:56px; height:56px; border-radius:50%; border:none;
  background:linear-gradient(135deg,#E52E33,#C5272C); color:#fff; font-size:25px; box-shadow:0 6px 18px rgba(229,46,51,.4); cursor:pointer; z-index:50}
.ai-fab:active{transform:scale(.94)}
.ai-panel{position:fixed; bottom:0; inset-inline-start:0; inset-inline-end:0; max-width:var(--appw); margin:0 auto; height:0; overflow:hidden; visibility:hidden;
  background:#fff; border-radius:18px 18px 0 0; box-shadow:0 -8px 30px rgba(0,0,0,.2); z-index:51; transition:height .25s ease; display:flex; flex-direction:column}
.ai-panel.open{height:74vh; visibility:visible}
.ai-head{background:linear-gradient(135deg,#E52E33,#C5272C); color:#fff; padding:14px 16px; font-weight:800; font-size:15px; display:flex; justify-content:space-between; align-items:center; flex:none}
.ai-x{background:rgba(255,255,255,.2); border:none; color:#fff; border-radius:8px; width:40px; height:40px; cursor:pointer; font-size:15px}
.ai-body{flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:10px; background:#f4f5f7}
.aimsg{max-width:86%; padding:10px 13px; border-radius:14px; font-size:14px; line-height:1.55; white-space:pre-wrap; word-break:break-word}
.aimsg.me{align-self:flex-start; background:var(--red-dark); color:#fff; border-bottom-inline-start-radius:4px}
.aimsg.ai{align-self:flex-end; background:#fff; border:1px solid var(--line); color:var(--text); border-bottom-inline-end-radius:4px}
.aimsg.typing{color:var(--muted); font-style:italic}
.aihello{color:var(--muted); font-size:13.5px; line-height:1.6; text-align:center; padding:18px 14px 6px}
.aiquick{display:flex; flex-direction:column; gap:8px; padding:4px 8px}
.aqchip{border:1.5px solid var(--line); background:var(--card); color:var(--text); border-radius:13px; padding:12px 14px; font-size:14px; font-weight:700; cursor:pointer; font-family:inherit; text-align:start}
.aqchip:active{transform:scale(.98)}
.ai-input{display:flex; gap:8px; padding:10px; padding-bottom:calc(10px + env(safe-area-inset-bottom, 0px)); border-top:1px solid var(--line); background:#fff; flex:none}
.ai-input input{flex:1; border:1.5px solid var(--line); border-radius:12px; padding:11px 13px; font-size:16px; font-family:inherit}
.ai-input input:focus{outline:none; border-color:var(--red)}
.ai-input button{border:none; background:var(--red); color:#fff; font-weight:800; border-radius:12px; padding:0 18px; cursor:pointer; font-family:inherit}

/* committee care + proactive tours */
.carebar{display:block; box-sizing:border-box; width:auto; text-align:start; border:none; cursor:pointer; background:#fff4e5; color:#9a6400; font-weight:800; font-size:13.5px; border-radius:12px; padding:11px 14px; margin:2px 16px 6px; box-shadow:0 1px 3px rgba(0,0,0,.05)}
.carebar:active{transform:scale(.99)}
.carecard{padding:13px 14px; margin:10px 0}
.carecard .tbtitle{font-size:15.5px; font-weight:800; color:var(--ink); line-height:1.25}
.carecard .meta{font-size:12.5px; color:var(--muted); margin-top:3px; font-weight:600; line-height:1.5}
.carecard .row2{display:flex; flex-wrap:wrap; gap:6px; margin-top:9px; align-items:center}
.careopen{background:#fff7e8; border:1px solid #f3e3c0; border-radius:10px; padding:8px 11px; margin-top:8px; font-size:13px; color:#7a5b12; font-weight:600; line-height:1.5}
.careacts{display:flex; gap:7px; margin-top:11px; flex-wrap:wrap}
.cbtn{border:1.5px solid var(--line); background:var(--card); color:var(--text); border-radius:11px; padding:9px 12px; font-size:13px; font-weight:800; cursor:pointer; font-family:inherit; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; gap:5px}
.cbtn.v{flex:1}
.cbtn.d{flex:1; background:var(--role-bg); border-color:transparent; color:var(--role-dark)}
.cbtn.s{width:46px}
.cbtn.s.on{background:#fff3cd; border-color:#ffd454}
.cbtn:active{transform:scale(.97)}
.careform:empty{display:none}
.vf{background:#f7f8fa; border:1px solid var(--line); border-radius:12px; padding:12px; margin-top:10px}
.vf-l{font-size:12px; font-weight:800; color:var(--muted); margin:9px 2px 5px}
.vf-l:first-child{margin-top:0}
.vf textarea{width:100%; box-sizing:border-box; border:1.5px solid var(--line); border-radius:11px; padding:10px 12px; font-size:16px; font-family:inherit; min-height:50px}
.vf textarea:focus{outline:none; border-color:var(--role)}
.vf .save{background:var(--wa); border:none; color:#fff; width:100%; margin-top:10px; padding:12px; border-radius:11px}
.satpick{display:flex; flex-wrap:wrap; gap:6px}
.satchip{border:1.5px solid var(--line); background:#fff; color:var(--text); border-radius:999px; padding:7px 12px; font-size:13px; font-weight:700; cursor:pointer; font-family:inherit}
.satchip.on{background:var(--role-dark); border-color:var(--role-dark); color:#fff}

/* proximity tour route */
.routebtn{width:100%; margin-top:11px; background:#fff; color:var(--role-dark); border:none; border-radius:12px; padding:12px; font-size:14.5px; font-weight:800; font-family:inherit; cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.12)}
.routebtn:active{transform:scale(.985)}
.routebtn[disabled]{opacity:.75; cursor:default}
.routebtn.off{background:rgba(255,255,255,.16); color:#fff; box-shadow:none; border:1.5px solid rgba(255,255,255,.55)}
.routebar{background:linear-gradient(135deg,var(--role) 0%,var(--role-dark) 100%); color:#fff; border-radius:var(--radius); padding:15px 16px; margin:4px 0 10px; box-shadow:0 6px 18px rgba(229,46,51,.22)}
.routebar .rb-t{font-size:13px; font-weight:800; opacity:.95}
.routebar .rb-big{font-size:19px; font-weight:800; margin-top:3px}
.routebar .rb-s{font-size:12.5px; opacity:.95; margin-top:5px; font-weight:500; line-height:1.5}
.rb-err{margin-top:9px; background:rgba(255,255,255,.18); border-radius:9px; padding:8px 10px; font-size:12.5px; font-weight:700}
.seqno{display:inline-flex; align-items:center; justify-content:center; width:23px; height:23px; border-radius:999px; background:var(--role-dark); color:#fff; font-size:13px; font-weight:800; margin-inline-end:7px; vertical-align:middle}
.distline{margin-top:6px; font-size:12.5px; font-weight:800; color:var(--role-dark); background:var(--role-bg); border-radius:8px; padding:5px 9px; display:inline-block}
.carecard.routed{border-inline-start:4px solid var(--role)}
.routenote{font-size:12.5px; font-weight:800; color:var(--muted); margin:16px 2px 2px}
.emptybox{background:var(--card); border:1px solid var(--line); border-radius:13px; padding:18px 14px; text-align:center; font-size:13.5px; font-weight:700; color:var(--muted); margin:8px 0}

/* in-app photo attach (task card) */
.photolist{display:flex; flex-direction:column; gap:8px; margin:8px 0 2px}
.ph-item{display:flex; align-items:center; gap:10px; background:#f7f8fa; border:1px solid var(--line); border-radius:11px; padding:8px 10px}
.ph-thumb{width:46px; height:46px; object-fit:cover; border-radius:8px; border:1px solid var(--line); flex:none}
.ph-st{font-size:13px; font-weight:800; color:var(--muted)}
.ph-st.ok{color:#1a7f37}
.ph-st.bad{color:var(--red)}

/* building info hub (מידע בניינים) */
.bhubcard{cursor:pointer}
.bhead{display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-bottom:6px}
.tag.btnlike{cursor:pointer; border-style:dashed}
.bsec{font-size:13px; font-weight:800; color:var(--ink); margin:16px 0 6px; padding-bottom:5px; border-bottom:2px solid var(--line)}
.brow{display:flex; align-items:center; gap:8px; padding:8px 2px; border-bottom:1px solid var(--line)}
.brow .bk{font-size:12.5px; font-weight:800; color:var(--muted); flex:0 0 38%}
.brow .bv{font-size:14px; font-weight:700; color:var(--ink); flex:1; word-break:break-word}
.brow .bacts{display:flex; gap:5px; align-items:center; flex:none}
.brow .cbtn{padding:6px 9px; font-size:12.5px}
.bmuted{color:var(--muted); font-weight:600}
.bwork{display:flex; flex-direction:column; gap:6px; margin:4px 0}
.bwork .tasklink{justify-content:flex-start; text-align:right; width:100%}
.bchip{background:#fdebec; border:1px solid var(--crit-ln); color:#b71f24; border-radius:9px; padding:7px 10px; font-size:12.5px; font-weight:700}
.bsubt{font-size:12px; font-weight:800; color:var(--muted); margin:10px 0 4px}
.specblk{margin:6px 0}
.specA{font-size:13px; font-weight:800; color:var(--ink)}
.specT{margin:3px 18px 0; padding:0; font-size:12.5px; color:var(--text); line-height:1.6}

/* task detail editors (priority/due/category) */
.chipline{display:flex; flex-wrap:wrap; gap:6px; margin:2px 0 8px}
.taskedit{margin:10px 0}
.taskedit summary{font-weight:800; color:var(--ink)}
.taskedit .fld{margin-bottom:6px}

/* operational pulse (דופק תפעולי) */
.pulsebar{display:flex; align-items:center; gap:9px; box-sizing:border-box; width:auto; border:none; cursor:pointer; background:linear-gradient(135deg,var(--role),var(--role-dark)); color:#fff; border-radius:13px; padding:12px 15px; margin:4px 16px 8px; box-shadow:0 4px 14px rgba(229,46,51,.25); font-family:inherit; text-align:start}
.pulsebar .pbt{font-weight:800; font-size:14.5px; white-space:nowrap}
.pulsebar .pbnums{font-weight:600; font-size:12px; opacity:.95; flex:1; line-height:1.3}
.pulsebar .pbgo{font-size:20px; font-weight:800; flex:none}
.kpis{display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; margin:6px 0 4px}
.kpi{background:var(--card); border:1px solid var(--line); border-radius:13px; padding:12px 6px; text-align:center}
.kpi .kpin{font-size:25px; font-weight:800; color:var(--ink); line-height:1}
.kpi .kpil{font-size:11px; font-weight:700; color:var(--muted); margin-top:5px; line-height:1.2}
.kpi.crit{background:var(--crit-bg); border-color:var(--crit-ln)} .kpi.crit .kpin{color:var(--red)}
.kpi.watch{background:#fff4e5; border-color:#f3dcae} .kpi.watch .kpin{color:#9a6400}
.kpi.ok .kpin{color:var(--grn)}
.prow{display:flex; align-items:flex-start; gap:10px; background:var(--card); border:1px solid var(--line); border-radius:12px; padding:11px 12px; margin:7px 0; cursor:pointer}
.prow:active{transform:scale(.99)}
.prow.crit{background:var(--crit-bg); border-color:var(--crit-ln)}
.prow.watch{background:#fff4e5; border-color:#f3dcae}
.prow .pi{font-size:18px; flex:none; line-height:1.3}
.prow .pt{font-size:13.5px; font-weight:800; color:var(--ink); line-height:1.45}
.prow .ps{font-size:12px; font-weight:600; color:var(--muted); margin-top:2px}
.pbcard{display:flex; align-items:center; cursor:pointer; margin:8px 0}
.pbcard .tbody{flex:1; padding:12px 13px; min-width:0}
.pbcard .tbtitle{font-size:15px; font-weight:800; color:var(--ink)}
.pbcard .meta{font-size:12px; color:var(--muted); font-weight:600; margin-top:2px}
.pbcard .row2{display:flex; flex-wrap:wrap; gap:6px; margin-top:7px}
.pbcard .tgo{padding:0 12px; color:var(--muted); font-size:22px; flex:none}
.ok-note{background:var(--grn-bg); border:1px solid var(--grn-ln); color:#15784a}
/* OXS close action */
.oxsacts{margin-top:10px; display:flex; gap:7px}
.oxsacts .cbtn{flex:1; font-weight:800}
.cbtn.oxsclose{background:var(--grn-bg); border-color:var(--grn-ln); color:#15784a}
.cbtn.oxsupdate{background:#e7f0ff; border-color:#c3d9f7; color:#1a52b0}
.cbtn.oxsclose:disabled,.cbtn.oxsupdate:disabled{opacity:.7}
.oxscontact{margin-top:8px}
.cbtn.oxsreporter{width:100%; background:#fff; border-color:var(--line); color:var(--ink); font-weight:800}
.rinfo{font-size:13px; font-weight:700; color:var(--ink); line-height:1.5; margin:2px 0 7px; background:#f7f8fa; border:1px solid var(--line); border-radius:9px; padding:8px 10px}
.racts{display:flex; gap:7px}
.racts .cbtn{flex:1; font-weight:800}
.racts .cbtn.wa{background:var(--grn-bg); border-color:var(--grn-ln); color:#15784a}
.racts .cbtn.call{background:#e7f0ff; border-color:#c3d9f7; color:#1a52b0}
.tourguide{background:#eef4ff; border:1px solid #d6e4ff; border-radius:10px; padding:9px 12px; font-size:12.5px; color:#1d4ed8; font-weight:600; line-height:1.7}
.cbtn.call{background:#e6f6ee; border-color:#bfe6cf; color:#0a7d33}
.cbtn.wa{background:var(--wa); border:none; color:#fff; width:46px}
.search-in{width:100%; box-sizing:border-box; margin:14px 0 4px; padding:13px 15px; border:1.5px solid var(--line); border-radius:13px; font-size:16px; font-family:inherit; background:var(--card)}
.search-in:focus{outline:none; border-color:var(--role)}
.leave-row{display:flex; gap:10px; margin-top:6px}
.leave-row .btn{margin-top:0}
.quicktiles{display:flex; gap:8px; margin:8px 16px 4px}
.qtile{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; min-height:74px; border:1px solid var(--line); background:var(--card); border-radius:15px; padding:13px 4px; font-size:12.5px; font-weight:800; color:var(--text); cursor:pointer; font-family:inherit; line-height:1.2; text-align:center}
.qtile:active{transform:scale(.96); background:#fafafa}
.qtile .qe{font-size:27px}
.qtile:active{transform:scale(.96)}

/* respect the OS "reduce motion" setting (vestibular accessibility) */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important}
  .spin{animation:none; border-top-color:var(--role); opacity:.6}
}