
:root{--bg:#f4f6f9;--card:#fff;--ink:#111a22;--mut:#64748b;--line:#e2e8f0;--brand:#111a22;--brand2:#4338ca;--orange:#4f46e5;--ok:#15803d;--okbg:#dcfce7;--half:#b45309;--halfbg:#fef3c7;--bad:#b91c1c;--badbg:#fee2e2;--in:#1d4ed8;--inbg:#dbeafe;--r:14px}
*{box-sizing:border-box}html,body{margin:0}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",sans-serif;background:var(--bg);color:var(--ink);font-size:16px;line-height:1.4;-webkit-text-size-adjust:100%}
header.top{background:#fff;color:var(--ink);padding:10px 14px;border-bottom:3px solid var(--orange);display:flex;align-items:center;gap:10px;position:sticky;top:0;z-index:50}
.mark{width:34px;height:34px;border-radius:9px;background:#fff;color:var(--brand);display:grid;place-items:center;font-weight:800;font-size:15px;letter-spacing:-.5px;flex:none}
header.top h1{margin:0;line-height:1;display:flex;flex-direction:column;gap:2px}header.top h1 img{height:28px;width:auto;display:block}header.top small{display:block;font-weight:600;color:var(--brand2);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
header.top .sp{flex:1}
header.top button{background:#f1f5f9;color:var(--ink);border:0;border-radius:10px;padding:8px 12px;font-size:14px}
main{max-width:560px;margin:0 auto;padding:14px}
main.wide{max-width:1100px}
.card{background:var(--card);border-radius:var(--r);padding:16px;box-shadow:0 1px 2px rgba(15,23,42,.06),0 1px 1px rgba(15,23,42,.04);margin-bottom:12px;border:1px solid var(--line)}
h2{font-size:18px;margin:0 0 10px}h3{font-size:15px;margin:0 0 8px}
.muted{color:var(--mut)}.small{font-size:13px}
label{display:block;font-size:13px;color:var(--mut);margin:10px 0 4px;font-weight:600}
input,select,textarea{width:100%;font-size:16px;padding:11px 12px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;color:var(--ink)}
input:focus,select:focus,button:focus-visible,a:focus-visible{outline:3px solid #a5b4fc;outline-offset:1px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:12px;padding:12px 16px;font-size:16px;font-weight:700;background:var(--brand2);color:#fff;cursor:pointer;text-decoration:none}
.btn.block{width:100%}.btn.big{padding:18px;font-size:19px;border-radius:16px}
.btn.green{background:var(--ok)}.btn.red{background:var(--bad)}.btn.ghost{background:#eef2ff;color:#3730a3}.btn.light{background:#f1f5f9;color:var(--ink)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.row{display:flex;gap:10px;align-items:center}.row>*{flex:1}.wrap{flex-wrap:wrap}
.pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}
.s-P{background:var(--okbg);color:var(--ok)}.s-H{background:var(--halfbg);color:var(--half)}.s-A{background:var(--badbg);color:var(--bad)}.s-IN{background:var(--inbg);color:var(--in)}.s-PENDING{background:#f1f5f9;color:var(--mut)}
.err{background:var(--badbg);color:var(--bad);padding:10px 12px;border-radius:10px;font-size:14px;margin-top:10px}
.okmsg{background:var(--okbg);color:var(--ok);padding:10px 12px;border-radius:10px;font-size:14px;margin-top:10px}
.hidden{display:none!important}
.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;font-size:14px}.kv b{font-weight:600}
.big-time{font-size:30px;font-weight:800;letter-spacing:-.5px}
.status-hero{text-align:center;padding:20px 16px}
.status-hero .pill{font-size:14px;padding:5px 14px}
.cam-wrap{position:relative;background:#000;border-radius:16px;overflow:hidden;aspect-ratio:3/4;max-height:60vh;margin:0 auto}
.cam-wrap video,.cam-wrap img{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}
.cam-wrap img{transform:none}
.loc{padding:10px 12px;border-radius:10px;font-size:14px;margin:10px 0;font-weight:600}
.loc.ok{background:var(--okbg);color:var(--ok)}.loc.bad{background:var(--badbg);color:var(--bad)}.loc.wait{background:#f1f5f9;color:var(--mut)}
.hist{width:100%;border-collapse:collapse;font-size:14px}.hist td,.hist th{padding:8px 6px;border-bottom:1px solid var(--line);text-align:left}
table.t{width:100%;border-collapse:collapse;font-size:14px}table.t th{background:#f8fafc;font-size:12px;color:var(--mut);text-transform:uppercase;letter-spacing:.03em}
table.t td,table.t th{padding:9px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tabs{display:flex;gap:6px;overflow-x:auto;padding:10px 14px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:61px;z-index:40}
.tabs button{border:0;background:#f1f5f9;color:var(--ink);padding:9px 14px;border-radius:999px;font-weight:600;font-size:14px;white-space:nowrap;cursor:pointer}
.tabs button.on{background:var(--brand);color:#fff}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px}
.stat{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;text-align:center}.stat b{display:block;font-size:24px}.stat span{font-size:11px;color:var(--mut);font-weight:600}
.live{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.person{display:flex;gap:12px;align-items:flex-start}
.thumbs{display:flex;gap:6px;flex:none}
.thumb{width:56px;height:56px;border-radius:10px;object-fit:cover;background:#e2e8f0;cursor:pointer;border:0;padding:0}
.thumb.empty{display:grid;place-items:center;color:#94a3b8;font-size:11px}
.person .info{flex:1;min-width:0}.person .nm{font-weight:700}.person .sub{font-size:13px;color:var(--mut);overflow:hidden;text-overflow:ellipsis}
#map{height:320px;border-radius:12px;border:1px solid var(--line);margin-top:8px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid #cbd5e1;border-radius:999px;padding:6px 12px;font-size:14px;cursor:pointer;background:#fff;user-select:none}
.chip input{width:auto;margin:0}
.chip.on{background:#eef2ff;border-color:var(--brand2)}
.modal{position:fixed;inset:0;background:rgba(15,23,42,.6);z-index:100;display:flex;align-items:flex-end;justify-content:center}
.modal .sheet{background:#fff;width:100%;max-width:560px;max-height:92vh;overflow:auto;border-radius:18px 18px 0 0;padding:16px}
@media(min-width:700px){.modal{align-items:center}.modal .sheet{border-radius:18px}}
.modal img.full{width:100%;border-radius:12px}
.demo{background:#fef3c7;color:#92400e;font-size:11px;font-weight:700;padding:2px 7px;border-radius:6px;margin-left:6px}
.foot{font-size:12px;color:var(--mut);text-align:center;padding:16px}
.list-item{display:flex;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}.list-item:last-child{border-bottom:0}.list-item .grow{flex:1;min-width:0}
.howto ol{padding-left:20px;margin:6px 0}.howto li{margin:4px 0}
@media(max-width:420px){.stats{grid-template-columns:repeat(2,1fr)}.stat b{font-size:22px}}

a{color:#3730a3}
.loginlogo{display:block;margin:4px auto 12px;width:220px;max-width:70%;height:auto}
.status-hero .row{align-items:flex-start}

.loc-preview{margin-top:8px;padding:10px 12px;border-radius:10px;background:#f5f3ff;border:1px solid #c7d2fe;font-size:15px}
.loc-preview.bad{background:#fff0f0;border-color:#f5a3a3;color:#b42318}
.ok-note{color:#1a7f37}
.site-toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%) translateY(150%);background:#1a1a1a;color:#fff;padding:12px 16px;border-radius:12px;font-size:14px;max-width:92vw;z-index:9999;transition:transform .25s;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.site-toast.on{transform:translateX(-50%) translateY(0)}

/* ---- v5: leave / WFH / regularize / managers ---- */
.s-L{background:#e0f2fe;color:#0369a1}.s-W{background:#ede9fe;color:#6d28d9}.s-R{background:#ccfbf1;color:#0f766e}.s-FUT,.s-NA{background:#f8fafc;color:#94a3b8}
.s-pending{background:#e0e7ff;color:#3730a3}.s-approved{background:var(--okbg);color:var(--ok)}.s-rejected{background:var(--badbg);color:var(--bad)}.s-cancelled{background:#f1f5f9;color:var(--mut)}
.etabs{top:61px}
.badge{display:inline-block;min-width:18px;padding:0 5px;border-radius:9px;background:var(--orange);color:#fff;font-size:11px;line-height:18px;text-align:center;margin-left:4px}
.tabs button.on .badge{background:#fff;color:var(--brand2)}
.cnts{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin:12px 0 6px}
.cnt{border-radius:10px;padding:6px 2px;text-align:center}.cnt b{display:block;font-size:20px}.cnt span{font-size:10px;font-weight:700}
.cntline{grid-column:1/-1;margin-top:2px;color:var(--mut)}
.c-P{background:var(--okbg);color:var(--ok)}.c-H{background:var(--halfbg);color:var(--half)}.c-A{background:var(--badbg);color:var(--bad)}.c-L{background:#e0f2fe;color:#0369a1}.c-W{background:#ede9fe;color:#6d28d9}.c-R{background:#ccfbf1;color:#0f766e}.c-IN{background:var(--inbg);color:var(--in)}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-top:8px}
.cal-h{font-size:11px;color:var(--mut);text-align:center;font-weight:700;padding:2px 0}
.cal-d{position:relative;border:1px solid var(--line);border-radius:10px;min-height:48px;padding:4px 2px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;font:inherit;cursor:pointer;background:#fff}
.cal-d .n{font-size:12px;font-weight:600;opacity:.75}.cal-d .k{font-size:13px;font-weight:800;line-height:1}
.cal-d.c-FUT,.cal-d.c-NA,.cal-d.c-PENDING{background:#fff;color:var(--ink)}.cal-d.c-NA{opacity:.35}
.cal-d.today{outline:2px solid var(--orange);outline-offset:1px}
.pdot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--orange);vertical-align:middle}
.cal-d .pdot{position:absolute;top:3px;right:3px}
.legend{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;margin-top:10px;color:var(--mut)}
.legend span[class^=c-]{display:inline-block;padding:1px 6px;border-radius:6px;font-weight:800;font-size:11px}
.day-row{display:flex;gap:10px;align-items:center;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);padding:10px 0;font:inherit;color:inherit;cursor:pointer}
.day-row:last-child{border-bottom:0}.day-row .dt{display:flex;flex-direction:column;width:52px;flex:none}.day-row .dt small{color:var(--mut);font-size:11px}.day-row .grow{flex:1;min-width:0}
.reqbtns{display:grid;gap:8px}
.rq{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;border:1px solid #c7d2fe;background:#eef2ff;border-radius:14px;padding:12px 14px;font:inherit;color:var(--ink);cursor:pointer}
.rq b{font-size:17px}.rq span{font-size:13px;color:var(--mut)}
.req{border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:8px}
.btn.wa{background:#16a34a;color:#fff}.btn.wa.light{background:#dcfce7;color:#166534}
textarea{font-family:inherit;resize:vertical}
.appr{border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:10px;background:#fff}
.appr .tp{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.appr img.rp{width:100%;max-height:280px;object-fit:cover;border-radius:12px;margin-top:8px;cursor:pointer;border:0;padding:0}
.stats.six{grid-template-columns:repeat(6,1fr)}
@media(max-width:700px){.stats.six{grid-template-columns:repeat(3,1fr)}}
@media(max-width:380px){.cnt b{font-size:17px}.cal-d{min-height:42px}}
.etabs{gap:5px;padding:8px 10px}.etabs button{padding:8px 11px;font-size:13.5px}
.mo-card{display:block;width:100%;text-align:left;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:8px;font:inherit;color:inherit;cursor:pointer}
.mo-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}
.mo-cards{display:none}@media(max-width:700px){.mo-cards{display:block}.mo-table{display:none}}

/* ---- HaaziriPro: company branding + weekly off / holiday ---- */
.s-OFF,.c-OFF{background:#f1f5f9;color:#475569}.s-HOL,.c-HOL{background:#fce7f3;color:#9d174d}
.co-logo{width:36px;height:36px;border-radius:9px;object-fit:contain;background:#fff;border:1px solid var(--line);flex:none}
.co-name{font-size:17px;font-weight:800;color:var(--ink);letter-spacing:-.2px;max-width:58vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.demo-tag{background:#fef3c7;color:#92400e;border-radius:6px;padding:1px 6px;font-size:10px;margin-left:4px;letter-spacing:.04em}
.foot a{color:inherit}
.bill-banner{border-radius:12px;padding:12px 14px;margin-bottom:12px;font-size:14px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.bill-banner.warn{background:#fef3c7;color:#78350f;border:1px solid #fcd34d}.bill-banner.bad{background:#fee2e2;color:#7f1d1d;border:1px solid #fca5a5}.bill-banner.info{background:#eef2ff;color:#312e81;border:1px solid #c7d2fe}
.bill-banner .grow{flex:1;min-width:200px}
.planpick{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.planpick label{margin:0;border:2px solid var(--line);border-radius:12px;padding:10px;cursor:pointer;color:var(--ink);font-weight:600}
.planpick input{width:auto;margin-right:6px}.planpick label:has(input:checked){border-color:var(--brand2);background:#eef2ff}
.qr{display:block;margin:10px auto;background:#fff;padding:8px;border-radius:12px;border:1px solid var(--line);max-width:240px;width:100%;height:auto}
.wdays{display:flex;flex-wrap:wrap;gap:6px}.wdays label{margin:0;display:inline-flex;align-items:center;gap:4px;border:1px solid var(--line);border-radius:999px;padding:6px 10px;color:var(--ink);font-weight:600}.wdays input{width:auto}

/* =================== HaaziriPro v3 polish (premium, consistent, 390px-first) =================== */
:root{--bg:#f5f6fb;--card:#fff;--ink:#0f172a;--mut:#5b6478;--line:#e6e8f0;--line2:#d7dbe8;--brand:#0b1033;--brand2:#4338ca;--ind2:#6366f1;--vio:#8b5cf6;--orange:#4f46e5;--r:16px;--sh:0 1px 2px rgba(15,23,42,.05),0 10px 28px -16px rgba(15,23,42,.22);--sh2:0 2px 6px rgba(15,23,42,.06),0 18px 40px -20px rgba(67,56,202,.35);--grad:linear-gradient(135deg,#4338ca 0%,#6366f1 55%,#8b5cf6 100%);--warn:#b45309;--warnbg:#fff7ed}
body{font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","Noto Sans Devanagari",sans-serif;background:var(--bg);background-image:radial-gradient(1200px 400px at 100% -10%,rgba(99,102,241,.08),transparent 60%),radial-gradient(900px 300px at -10% 0,rgba(139,92,246,.06),transparent 60%);background-attachment:fixed;letter-spacing:-.005em}
h2{font-size:19px;letter-spacing:-.02em;font-weight:800}h3{font-size:15.5px;letter-spacing:-.01em;font-weight:750}
header.top{background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--line);box-shadow:0 1px 0 rgba(255,255,255,.6) inset;padding:10px max(14px,env(safe-area-inset-left));min-height:60px}
header.top::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--grad);opacity:.9}
header.top button{background:#f1f2f9;border:1px solid var(--line);border-radius:11px;padding:8px 12px;font-size:13.5px;font-weight:650;color:var(--ink);cursor:pointer;white-space:nowrap}
header.top button:hover{background:#e9ebf7}
header.top small{color:var(--brand2);font-weight:700}
.co-logo{border-radius:11px;box-shadow:0 1px 2px rgba(15,23,42,.06)}
main{padding:16px 14px 28px}main.wide{max-width:1180px}
.card{border-radius:var(--r);border:1px solid var(--line);box-shadow:var(--sh);padding:16px;margin-bottom:14px}
@media(min-width:760px){.card{padding:20px}}
.tabs{background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:9px 12px;gap:6px;scrollbar-width:none;top:60px}
.tabs::-webkit-scrollbar{display:none}
.tabs button{background:transparent;border:1px solid transparent;color:var(--mut);padding:8px 13px;border-radius:999px;font-weight:650;font-size:13.5px;transition:background .15s,color .15s}
.tabs button:hover{background:#f1f2f9;color:var(--ink)}
.tabs button.on{background:var(--grad);color:#fff;box-shadow:0 6px 16px -8px rgba(67,56,202,.7)}
.etabs{top:60px;justify-content:space-between}.etabs button{flex:1;min-width:max-content}
label{color:#475069;font-size:12.5px;letter-spacing:.01em;margin:12px 0 5px}
input,select,textarea{border:1px solid var(--line2);border-radius:12px;padding:11px 12px;background:#fff;transition:border-color .15s,box-shadow .15s;min-height:44px}
input:focus,select:focus,textarea:focus{outline:0;border-color:#818cf8;box-shadow:0 0 0 4px rgba(99,102,241,.15)}
input[type=checkbox],input[type=radio]{min-height:0}
select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%235b6478' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:34px}
.btn{border-radius:12px;font-weight:750;letter-spacing:-.005em;background:var(--grad);box-shadow:0 8px 20px -12px rgba(67,56,202,.8);transition:transform .12s,box-shadow .15s,filter .15s;min-height:44px}
.btn:hover{filter:brightness(1.05);box-shadow:0 12px 26px -12px rgba(67,56,202,.85)}.btn:active{transform:translateY(1px) scale(.99)}
.btn.green{background:linear-gradient(135deg,#15803d,#22c55e);box-shadow:0 8px 20px -12px rgba(22,163,74,.8)}
.btn.red{background:linear-gradient(135deg,#b91c1c,#ef4444);box-shadow:0 8px 20px -12px rgba(220,38,38,.8)}
.btn.ghost{background:#eef0ff;color:#3730a3;box-shadow:none;border:1px solid #dcdffb}.btn.ghost:hover{background:#e4e7ff}
.btn.light{background:#fff;color:var(--ink);border:1px solid var(--line2);box-shadow:0 1px 2px rgba(15,23,42,.05)}.btn.light:hover{background:#f7f8fc}
.btn.sm{padding:7px 12px;font-size:13.5px;min-height:36px;border-radius:10px}
.btn.danger,.btn.light.danger{color:var(--bad)}
.btn.wa{background:linear-gradient(135deg,#15803d,#22c55e)}
.btn.big{border-radius:16px;min-height:56px}
.pill{padding:3px 10px;font-weight:750;letter-spacing:.005em}
.s-R{background:var(--okbg);color:var(--ok)}.c-R{background:var(--okbg);color:var(--ok)}
.s-RP,.c-RP{background:#fff7ed;color:#c2410c;box-shadow:inset 0 0 0 1px #fed7aa}
.stats{gap:10px}
.stat{border-radius:14px;padding:12px 8px;box-shadow:var(--sh);position:relative;overflow:hidden}
.stat::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--grad);opacity:.85}
.stat b{font-size:26px;letter-spacing:-.03em}.stat span{font-size:11.5px}
.stats.six .stat:nth-child(1)::before{background:#2563eb}.stats.six .stat:nth-child(2)::before{background:#16a34a}.stats.six .stat:nth-child(3)::before{background:#d97706}.stats.six .stat:nth-child(4)::before{background:#0284c7}.stats.six .stat:nth-child(5)::before{background:#7c3aed}.stats.six .stat:nth-child(6)::before{background:#dc2626}
.live{gap:12px}.live>.card{margin:0;transition:box-shadow .15s,transform .15s}.live>.card:hover{box-shadow:var(--sh2)}
.thumb{border-radius:12px}
.list-item{padding:13px 2px;gap:12px}
.appr{border-radius:16px;box-shadow:var(--sh);padding:16px}
.appr .row .btn{min-height:46px}
.tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:14px;background:#fff;max-height:70vh}
table.t th{position:sticky;top:0;z-index:2;background:#f7f8fc;color:#5b6478;font-weight:750;font-size:11.5px;border-bottom:1px solid var(--line)}
table.t td,table.t th{padding:10px 10px;white-space:nowrap}
table.t tbody tr:nth-child(even) td{background:#fbfbfe}table.t tbody tr:hover td{background:#f3f4ff}
table.t td:first-child,table.t th:first-child{position:sticky;left:0;z-index:1;background:inherit}
table.t th:first-child{z-index:3;background:#f7f8fc}table.t td:first-child{background:#fff}table.t tbody tr:nth-child(even) td:first-child{background:#fbfbfe}
.hist td,.hist th{padding:10px 6px}.hist th{font-size:11.5px;color:var(--mut);text-transform:uppercase;letter-spacing:.04em}
.modal{background:rgba(11,16,51,.5);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.modal .sheet{border-radius:22px 22px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px rgba(11,16,51,.25)}
@media(min-width:700px){.modal .sheet{border-radius:22px;padding:22px}}
.chip{border-color:var(--line2);font-weight:600;transition:all .15s}.chip.on{background:#eef0ff;border-color:#818cf8;color:#3730a3}
.foot{padding:20px 16px 28px}
.err,.okmsg{border-radius:12px}
.rq{border-radius:16px;border-color:#dcdffb;background:linear-gradient(180deg,#fff,#f5f6ff);box-shadow:0 1px 2px rgba(15,23,42,.05);transition:transform .12s,box-shadow .15s}.rq:hover{box-shadow:var(--sh2)}.rq:active{transform:scale(.99)}
.status-hero{background:linear-gradient(180deg,#fff 0%,#fafaff 100%)}
.big-time{font-variant-numeric:tabular-nums}
.cal-d{border-radius:12px;transition:transform .1s}.cal-d:active{transform:scale(.96)}
/* section header + toolbar + search */
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:2px 0 12px}
.sec-head h2{margin:0}.sec-head p{margin:4px 0 0}.sec-act{display:flex;gap:8px;flex-wrap:wrap}
.sec-act .btn{flex:none}
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:8px}
.toolbar .search{flex:1 1 240px;min-width:0}
.toolbar select{flex:0 1 180px;width:auto}
.search input{padding-left:14px;background:#f7f8fc}
.search input:focus{background:#fff}
.cnt-lbl{flex:none;white-space:nowrap}
.empty{text-align:center;padding:28px 12px;color:var(--ink)}.empty-ic{font-size:34px;margin-bottom:6px}.empty b{display:block;font-size:15px}.empty p{margin:4px 0 0}
.empty.small{padding:16px 8px}.empty.small .empty-ic{font-size:26px}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em;letter-spacing:0}
.hidden-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.grid2{display:grid;grid-template-columns:1fr;gap:0 12px}@media(min-width:560px){.grid2{grid-template-columns:1fr 1fr}}
.form-sec{margin:16px 0 0;padding-top:12px;border-top:1px dashed var(--line2);font-size:12px;font-weight:800;color:var(--brand2);letter-spacing:.06em;text-transform:uppercase}
/* people list */
.person-row{align-items:flex-start}
.av{flex:none;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-weight:800;font-size:14px;color:#fff;background:var(--dc,#64748b);background-image:linear-gradient(135deg,rgba(255,255,255,.18),rgba(0,0,0,.08));position:relative;letter-spacing:.02em}
.pr-top{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.pr-top b{font-size:15.5px}
.pr-meta{display:flex;flex-wrap:wrap;gap:2px 12px;margin-top:3px}
.pr-act{display:flex;gap:6px;flex:none}
@media(max-width:520px){.person-row{flex-wrap:wrap}.person-row .grow{flex:1 1 calc(100% - 56px)}.pr-act{width:100%;justify-content:flex-end}}
.dchip{display:inline-flex;align-items:center;gap:5px;padding:2px 9px 2px 7px;border-radius:999px;font-size:11.5px;font-weight:700;color:var(--dc);background:color-mix(in srgb,var(--dc) 12%,#fff);border:1px solid color-mix(in srgb,var(--dc) 28%,#fff);white-space:nowrap}
.dchip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--dc)}
.rchip{display:inline-block;padding:1px 8px;border-radius:7px;font-size:11px;font-weight:800;letter-spacing:.03em;text-transform:uppercase}
.rchip.r-manager{background:#e0e7ff;color:#3730a3}.rchip.r-ceo{background:linear-gradient(135deg,#f59e0b,#f97316);color:#fff}
.chip.swatch{padding:6px}.chip.swatch input{display:none}.chip.swatch i{display:block;width:22px;height:22px;border-radius:50%;background:var(--dc)}.chip.swatch.on{box-shadow:0 0 0 2px var(--dc)}
/* org chart */
.ostats{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0}
.ostat{background:#f7f8fc;border:1px solid var(--line);border-radius:10px;padding:5px 10px;font-size:13px;color:var(--mut)}.ostat b{color:var(--ink)}
#orgLegend{margin:4px 0 10px}
.org-wrap{margin-top:6px}
.oc,.oc ul{list-style:none;margin:0;padding:0}
.oc-card{position:relative;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--dc);border-radius:14px;padding:10px 12px;box-shadow:var(--sh);text-align:left;cursor:default;transition:box-shadow .15s,transform .15s}
body:not([data-role=mgr]) .oc-card{cursor:pointer}
.oc-card:hover{box-shadow:var(--sh2)}
.oc-card.me{outline:2px solid #818cf8;outline-offset:2px}
.oc-card .av{width:40px;height:40px;font-size:13.5px}
.oc-info{display:flex;flex-direction:column;min-width:0;flex:1}.oc-info b{font-size:14px;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.oc-info>span{font-size:12px;color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.oc-tags{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}
.oc-tog{flex:none;border:1px solid var(--line2);background:#f7f8fc;border-radius:999px;padding:3px 9px;font-size:12px;font-weight:800;color:var(--brand2);cursor:pointer;font-family:inherit}
.oc-tog small{font-weight:600;color:var(--mut)}.oc-tog.closed{background:var(--grad);color:#fff;border-color:transparent}.oc-tog.closed small{color:#e0e7ff}
.av .dot{position:absolute;right:-3px;bottom:-3px;width:12px;height:12px;border-radius:50%;border:2px solid #fff;background:#94a3b8}.av .dot.in{background:#2563eb}.av .dot.p{background:#16a34a}.av .dot.h{background:#d97706}
.oc ul.collapsed{display:none}
/* phone: indented collapsible list */
.oc li{position:relative;padding-top:8px}
.oc ul{margin-left:18px;padding-left:14px;border-left:2px solid #e2e5f0}
.oc ul>li::before{content:"";position:absolute;left:-14px;top:34px;width:12px;border-top:2px solid #e2e5f0}
/* desktop: top-down chart */
@media(min-width:900px){
  .oc-scroll{overflow-x:auto;padding:8px 4px 18px}
  .oc{display:flex;gap:28px;width:max-content;margin:0 auto;padding:0 8px}
  .oc ul{display:flex;justify-content:center;margin:0;padding:22px 0 0;border:0;position:relative}
  .oc li{display:flex;flex-direction:column;align-items:center;padding:22px 7px 0}
  .oc>li{padding-top:0}
  .oc-card{width:200px;align-items:flex-start}.oc-info b{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.oc-tog{position:absolute;right:8px;bottom:8px}.oc-card .oc-info{padding-bottom:4px}.oc-card:has(.oc-tog) .oc-info{padding-bottom:22px}
  .oc ul>li::before,.oc ul>li::after{content:"";position:absolute;top:0;right:50%;left:auto;width:50%;height:22px;border-top:2px solid #cfd4e6}
  .oc ul>li::after{right:auto;left:50%;border-left:2px solid #cfd4e6}
  .oc ul>li:only-child::before,.oc ul>li:only-child::after{display:none}.oc ul>li:only-child{padding-top:0}
  .oc ul>li:first-child::before,.oc ul>li:last-child::after{border:0 none}
  .oc ul>li:last-child::before{border-right:2px solid #cfd4e6;border-radius:0 10px 0 0}
  .oc ul>li:first-child::after{border-radius:10px 0 0 0}
  .oc ul::before{content:"";position:absolute;top:0;left:50%;width:0;height:22px;border-left:2px solid #cfd4e6}
}
.oc-results{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.oc-res .oc-chain{margin:5px 4px 0}
/* missing check-out + proof camera */
.warn-card{background:linear-gradient(180deg,#fff7ed,#fff);border-color:#fed7aa}
.mo-h{font-weight:800;color:#c2410c;margin-bottom:6px}
.mo-row{display:flex;align-items:center;gap:10px;justify-content:space-between;padding:8px 0;border-top:1px dashed #fed7aa}.mo-row .btn{flex:none;background:linear-gradient(135deg,#ea580c,#f97316);box-shadow:0 8px 18px -12px rgba(234,88,12,.9)}
.proof{border:1.5px dashed #c7cbe6;border-radius:16px;padding:12px;background:#fafaff}
.proof-cam{aspect-ratio:4/3;max-height:52vh}.proof-cam video{transform:none}
.proof-shot{width:100%;max-height:300px;object-fit:cover;border-radius:12px;display:block}
.proof-act{margin-top:10px}
.proof-thumb{display:block;width:100%;height:auto;background:none;position:relative;margin-top:8px}.proof-thumb span{position:absolute;left:8px;bottom:8px;background:rgba(11,16,51,.72);color:#fff;font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:8px}
.appr img.rp{margin-top:0}
@media(max-width:420px){main{padding:12px 10px 24px}.card{padding:14px}.stats.six{grid-template-columns:repeat(3,1fr);gap:8px}.stat b{font-size:22px}header.top{gap:8px}header.top button{padding:7px 10px;font-size:12.5px}.co-name{max-width:44vw}}

header.top h1{min-width:0;flex:1 1 auto}header.top .sp{flex:0 1 auto}header.top small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;max-width:100%}
@media(max-width:480px){.hb-txt{display:none}header.top small{font-size:10px}}

/* ---- dark theme (html[data-theme=dark]) ---- */
.thsw{all:unset;cursor:pointer;flex:none;width:34px;height:34px;display:grid;place-items:center;border-radius:999px;border:1px solid var(--line2);background:#fff;font-size:15px;line-height:1}
html[data-theme=dark]{color-scheme:dark;--bg:#080c2a;--card:#11173f;--ink:#e9ebfa;--mut:#a4abcf;--line:#232b63;--line2:#2f3a7c;--okbg:rgba(34,197,94,.16);--ok:#4ade80;--halfbg:rgba(245,158,11,.16);--half:#fbbf24;--badbg:rgba(239,68,68,.16);--bad:#f87171;--inbg:rgba(59,130,246,.18);--in:#93c5fd;--sh:0 1px 2px rgba(0,0,0,.3),0 12px 30px -18px rgba(0,0,0,.7);--sh2:0 2px 8px rgba(0,0,0,.35),0 18px 40px -20px rgba(99,102,241,.45)}
html[data-theme=dark] body{background-color:var(--bg);background-image:radial-gradient(1000px 420px at 100% -10%,rgba(99,102,241,.22),transparent 60%),radial-gradient(800px 340px at -10% 10%,rgba(139,92,246,.16),transparent 60%)}
html[data-theme=dark] header.top,html[data-theme=dark] .tabs{background:rgba(13,18,52,.82);border-color:var(--line)}
html[data-theme=dark] header.top button,html[data-theme=dark] .thsw{background:#18205a;border-color:var(--line2);color:var(--ink)}
html[data-theme=dark] .langsw{background:#18205a!important;border-color:var(--line2)!important}html[data-theme=dark] .langsw button{color:#c7cbe8!important}html[data-theme=dark] .langsw button.on{color:#fff!important}
html[data-theme=dark] .tabs button{color:var(--mut)}html[data-theme=dark] .tabs button:hover{background:#18205a;color:var(--ink)}html[data-theme=dark] .tabs button.on{color:#fff}
html[data-theme=dark] .card,html[data-theme=dark] .stat,html[data-theme=dark] .appr,html[data-theme=dark] .mo-card,html[data-theme=dark] .modal .sheet,html[data-theme=dark] .oc-card,html[data-theme=dark] .cal-d,html[data-theme=dark] .tscroll{background:var(--card);border-color:var(--line);color:var(--ink)}
html[data-theme=dark] input,html[data-theme=dark] select,html[data-theme=dark] textarea{background-color:#0d1338;border-color:var(--line2);color:var(--ink)}
html[data-theme=dark] .search input{background-color:#0d1338}
html[data-theme=dark] label{color:#b8bee0}
html[data-theme=dark] .btn.light{background:#18205a;color:var(--ink);border-color:var(--line2)}html[data-theme=dark] .btn.light:hover{background:#1e2768}
html[data-theme=dark] .btn.ghost{background:rgba(99,102,241,.18);color:#c7d2fe;border-color:rgba(129,140,248,.35)}
html[data-theme=dark] .chip{background:#141b4d;border-color:var(--line2);color:var(--ink)}html[data-theme=dark] .chip.on{background:rgba(99,102,241,.25);border-color:#818cf8;color:#e0e7ff}
html[data-theme=dark] table.t th,html[data-theme=dark] table.t th:first-child{background:#161e55;color:#b8bee0;border-color:var(--line)}
html[data-theme=dark] table.t td,html[data-theme=dark] table.t td:first-child{background:var(--card);border-color:var(--line)}html[data-theme=dark] table.t tbody tr:nth-child(even) td{background:#141b4b}html[data-theme=dark] table.t tbody tr:hover td{background:#1b2463}
html[data-theme=dark] .hist td,html[data-theme=dark] .hist th,html[data-theme=dark] .list-item,html[data-theme=dark] .day-row{border-color:var(--line)}
html[data-theme=dark] .rq{background:linear-gradient(180deg,#151c50,#11173f);border-color:var(--line2);color:var(--ink)}
html[data-theme=dark] .status-hero{background:linear-gradient(180deg,#141b4d,#11173f)}
html[data-theme=dark] .ostat,html[data-theme=dark] .oc-tog,html[data-theme=dark] .proof{background:#141b4d;border-color:var(--line2)}
html[data-theme=dark] .oc ul,html[data-theme=dark] .oc ul>li::before{border-color:#2a3474}
html[data-theme=dark] .dchip{background:color-mix(in srgb,var(--dc) 20%,#11173f);border-color:color-mix(in srgb,var(--dc) 45%,#11173f);color:color-mix(in srgb,var(--dc) 60%,#fff)}
html[data-theme=dark] .warn-card{background:linear-gradient(180deg,rgba(234,88,12,.16),var(--card));border-color:rgba(251,146,60,.4)}html[data-theme=dark] .mo-row{border-color:rgba(251,146,60,.3)}html[data-theme=dark] .mo-h{color:#fdba74}
html[data-theme=dark] .s-RP,html[data-theme=dark] .c-RP{background:rgba(234,88,12,.18);color:#fdba74;box-shadow:inset 0 0 0 1px rgba(251,146,60,.4)}
html[data-theme=dark] .s-L,html[data-theme=dark] .c-L{background:rgba(14,165,233,.18);color:#7dd3fc}html[data-theme=dark] .s-W,html[data-theme=dark] .c-W{background:rgba(139,92,246,.2);color:#c4b5fd}html[data-theme=dark] .s-OFF,html[data-theme=dark] .c-OFF,html[data-theme=dark] .s-PENDING,html[data-theme=dark] .s-cancelled{background:#1b2358;color:#b8bee0}html[data-theme=dark] .s-HOL,html[data-theme=dark] .c-HOL{background:rgba(236,72,153,.18);color:#f9a8d4}html[data-theme=dark] .s-pending{background:rgba(99,102,241,.2);color:#c7d2fe}
html[data-theme=dark] .cal-d.c-P{background:var(--okbg)}html[data-theme=dark] .cal-d.c-H{background:var(--halfbg)}html[data-theme=dark] .cal-d.c-A{background:var(--badbg)}html[data-theme=dark] .cal-d.c-R{background:var(--okbg)}
html[data-theme=dark] .loc.wait{background:#141b4d}html[data-theme=dark] .demo,html[data-theme=dark] .demo-tag{background:rgba(245,158,11,.2);color:#fcd34d}
html[data-theme=dark] .rchip.r-manager{background:rgba(99,102,241,.25);color:#c7d2fe}
html[data-theme=dark] .bill-banner.info{background:rgba(99,102,241,.16);color:#c7d2fe;border-color:var(--line2)}html[data-theme=dark] .bill-banner.warn{background:rgba(245,158,11,.14);color:#fde68a;border-color:rgba(245,158,11,.4)}html[data-theme=dark] .bill-banner.bad{background:rgba(239,68,68,.16);color:#fecaca;border-color:rgba(239,68,68,.4)}
html[data-theme=dark] a{color:#a5b4fc}html[data-theme=dark] .co-name{color:var(--ink)}html[data-theme=dark] header.top small{color:#a5b4fc}
html[data-theme=dark] [style*="background:#fff"],html[data-theme=dark] [style*="background: #fff"],html[data-theme=dark] [style*="background:#f8fafc"],html[data-theme=dark] [style*="background:#f1f5f9"]{background:var(--card)!important;color:var(--ink)}
html[data-theme=dark] [style*="background:#eef2ff"],html[data-theme=dark] [style*="background:#f5f3ff"]{background:rgba(99,102,241,.16)!important;color:var(--ink)}
html[data-theme=dark] .cms-save,html[data-theme=dark] .cms-logo img,html[data-theme=dark] .cms-logo span{background:var(--card)}
html[data-theme=dark] .site-toast{background:#e9ebfa;color:#0b1033}
html[data-theme=dark] img[src$="brand.svg"]{filter:brightness(0) invert(1)}

header.top .thsw{all:unset;box-sizing:border-box;cursor:pointer;flex:none;width:34px;height:34px;padding:0;display:grid;place-items:center;border-radius:999px;border:1px solid var(--line2);background:#fff;font-size:15px;line-height:1}
html[data-theme=dark] header.top .thsw{background:#18205a;border-color:var(--line2)}
.co-acts{flex:0 1 auto;justify-content:flex-end}.co-acts>.btn{flex:none}
@media(max-width:700px){#coList .row{flex-wrap:wrap}#coList .row>*{min-width:0}.co-acts{width:100%;justify-content:flex-start}}

@media(min-width:900px){
  .oc ul.leafs{flex-direction:column;align-items:center;gap:10px}
  .oc ul.leafs>li{padding:0}
  .oc ul.leafs>li::before,.oc ul.leafs>li::after{display:none}
  .oc ul.leafs::after{content:"";position:absolute;left:50%;top:22px;bottom:24px;border-left:2px solid #cfd4e6;z-index:0}
  html[data-theme=dark] .oc ul.leafs::after{border-color:#2a3474}
  .oc ul.leafs .oc-card{z-index:1}
}
html[data-theme=dark] .oc ul>li::before,html[data-theme=dark] .oc ul>li::after,html[data-theme=dark] .oc ul::before{border-color:#2a3474}

html[data-theme=dark] .oc-tog{color:#c7d2fe}html[data-theme=dark] .oc-tog small{color:#a4abcf}

/* batch 3: small phones — company name wraps to 2 lines instead of being cut; compact language pill */
@media(max-width:420px){.co-name{max-width:none;white-space:normal;text-overflow:clip;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:15px;line-height:1.15;word-break:break-word}header.top .langsw .lbtn{padding:7px 7px}.langsw .lfull{display:none}}
@media(min-width:421px){.langsw .lshort{display:none}}
.table-wrap,.tblwrap{overflow-x:auto}

/* ===== live tracking (hp12) ===== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.trk{margin-top:12px;display:grid;gap:8px}
.trk-pill{display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:9px 12px;border-radius:12px;font-size:14px;background:var(--okbg);color:#14532d;border:1px solid #bbf7d0}
.trk-pill.warn{background:var(--halfbg);color:#78350f;border-color:#fde68a}
.trk-dot{width:10px;height:10px;border-radius:50%;background:#16a34a;flex:none;box-shadow:0 0 0 0 rgba(22,163,74,.6);animation:trkp 2s infinite}
.trk-pill.warn .trk-dot{background:#d97706;animation:none}
@keyframes trkp{0%{box-shadow:0 0 0 0 rgba(22,163,74,.55)}70%{box-shadow:0 0 0 9px rgba(22,163,74,0)}100%{box-shadow:0 0 0 0 rgba(22,163,74,0)}}
@media (prefers-reduced-motion:reduce){.trk-dot{animation:none}}
.trk-help{margin:0}.trk-wake{display:flex;align-items:center;gap:8px;margin:0;color:var(--mut);font-weight:600}.trk-wake input{width:auto}
.trk-alert{background:var(--badbg);color:#7f1d1d;border:1px solid #fecaca;border-radius:12px;padding:10px 12px;display:grid;gap:6px}.trk-alert .btn{justify-self:start;background:#fff;color:#7f1d1d;border:1px solid #fecaca}
.trk-ul{padding-left:18px;margin:8px 0 14px}.trk-ul li{margin:4px 0}
.trk-rev{margin-top:6px;padding:7px 10px;border-radius:10px;background:var(--halfbg);color:#78350f}.trk-rev.r-approved{background:var(--okbg);color:#14532d}.trk-rev.r-rejected{background:var(--badbg);color:#7f1d1d}.trk-rev.r-deducted{background:var(--inbg);color:#1e3a8a}
.tk-top{margin-bottom:10px;gap:10px}.tk-ctl{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}.tk-ctl input,.tk-ctl select{width:auto;min-width:0;padding:8px 10px;font-size:15px}.tk-ctl .btn{padding:8px 14px}
.tk-counts{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}
.tk-c{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-size:13px}.tk-c i{width:9px;height:9px;border-radius:50%;display:inline-block}
.tk-c.live i{background:#16a34a}.tk-c.stale i{background:#d97706}.tk-c.off i{background:#dc2626}.tk-c.out i{background:#64748b}.tk-c b{font-size:14px}
.tk-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:12px;align-items:start}
.tk-mapcard{padding:8px}#tkMap{height:560px;border-radius:10px;z-index:0}
.tk-upd{padding:6px 4px 0}
.tk-side{max-height:620px;display:flex;flex-direction:column}.tk-list{overflow:auto;display:grid;gap:6px;margin:0 -4px;padding:0 4px}
.tk-row{display:flex;gap:10px;align-items:flex-start;text-align:left;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;cursor:pointer;width:100%;font:inherit;color:inherit}
.tk-row:hover{border-color:#c7d2fe;background:#f8faff}.tk-row.on{border-color:var(--brand2);box-shadow:0 0 0 2px #e0e7ff}
.tk-dot{width:12px;height:12px;border-radius:50%;margin-top:4px;flex:none}.tk-dot.s-live{background:#16a34a}.tk-dot.s-stale{background:#d97706}.tk-dot.s-off{background:#dc2626}.tk-dot.s-out{background:#94a3b8}
.tk-rt{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}.tk-rt b{font-size:15px}
.tk-st.s-live{color:#15803d}.tk-st.s-stale{color:#b45309}.tk-st.s-off{color:#b91c1c;font-weight:700}.tk-st.s-out{color:var(--mut)}
.tk-rr{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex:none}
.tk-badge{background:var(--badbg);color:#991b1b;border-radius:999px;padding:2px 8px;font-size:12px;font-weight:700}
.tk-pill{display:inline-block;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:700;white-space:nowrap}
.tk-pill.amber{background:#fef3c7;color:#92400e;border:1px solid #fcd34d}.tk-pill.green{background:var(--okbg);color:#166534}.tk-pill.red{background:var(--badbg);color:#991b1b}.tk-pill.blue{background:var(--inbg);color:#1e40af}.tk-pill.violet{background:#ede9fe;color:#5b21b6}
.tk-pin-wrap{background:none;border:0}
.tk-pin{width:34px;height:34px;border-radius:50%;background:#fff;border:3px solid var(--c);display:grid;place-items:center;box-shadow:0 2px 6px rgba(15,23,42,.35);font-weight:800;font-size:12px;color:#0f172a}
.tk-pin.s-live{box-shadow:0 0 0 4px rgba(22,163,74,.25),0 2px 6px rgba(15,23,42,.35)}.tk-pin.s-off{background:#fee2e2}
.tk-flag{display:inline-block;padding:2px 6px;border-radius:6px;font-size:11px;font-weight:800;color:#fff;white-space:nowrap;box-shadow:0 1px 4px rgba(0,0,0,.3)}.tk-flag.in{background:#16a34a}.tk-flag.out{background:#dc2626}
.tk-detail{border-left:4px solid var(--brand2)}.tk-dh{align-items:flex-start;margin-bottom:10px}
.tk-stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-bottom:10px}
.tk-stats div{background:#f8fafc;border:1px solid var(--line);border-radius:10px;padding:8px 10px;display:flex;flex-direction:column}.tk-stats b{font-size:17px}.tk-stats span{font-size:12px;color:var(--mut)}.tk-stats .bad{background:var(--badbg);border-color:#fecaca}.tk-stats .bad b{color:#b91c1c}
.tk-rev{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:8px 10px;margin-bottom:10px}
.tk-act{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.tk-rev .tk-act{margin:0}
.tk-legend{display:flex;flex-wrap:wrap;gap:12px;color:var(--mut);margin-bottom:8px}.tk-legend i{display:inline-block;width:14px;height:6px;border-radius:3px;margin-right:5px;vertical-align:middle}.tk-legend i.dash{background:repeating-linear-gradient(90deg,#dc2626 0 5px,transparent 5px 9px);height:4px}
.tk-tlist{list-style:none;padding:0;margin:0;display:grid;gap:2px;max-height:320px;overflow:auto}
.tk-tlist li{display:flex;gap:10px;padding:6px 4px;border-bottom:1px dashed var(--line);font-size:14px}.tk-tlist li.bad{color:#991b1b;background:#fff5f5}
.tk-tlist time{font-variant-numeric:tabular-nums;color:var(--mut);min-width:44px}
.tk-tl{display:inline-block;min-width:30px;text-align:center;border-radius:6px;font-size:11px;font-weight:800;padding:1px 4px;margin-right:4px;color:#fff;background:#64748b}.tk-tl.in{background:#16a34a}.tk-tl.out{background:#dc2626}.tk-tl.stop{background:#d97706}.tk-tl.bad{background:#dc2626}
.tk-alerts{display:grid;gap:8px}
.tk-al{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:#fff}.tk-al.rev{border-color:#fcd34d;background:#fffbeb}
.tk-alh{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.tk-all{margin:6px 0 2px;padding-left:18px;font-size:14px}.tk-all li{margin:2px 0}
.tk-set{display:grid;gap:4px}.tk-set2{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.tk-set .chk{display:flex;align-items:center;gap:8px;color:var(--ink);font-size:15px;margin:8px 0}.tk-set .chk input{width:auto}
@media (max-width:1100px){.tk-grid{grid-template-columns:1fr}.tk-side{max-height:none}.tk-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){#tkMap{height:380px}.tk-set2{grid-template-columns:1fr}.tk-ctl{margin-left:0;width:100%}.tk-ctl input,.tk-ctl select{flex:1}.tk-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}

html[data-theme=dark] .tk-row,html[data-theme=dark] .tk-c,html[data-theme=dark] .tk-al,html[data-theme=dark] .tk-stats div{background:var(--card);border-color:var(--line);color:var(--ink)}
html[data-theme=dark] .tk-row:hover{background:var(--line)}html[data-theme=dark] .tk-al.rev,html[data-theme=dark] .tk-rev{background:var(--halfbg);border-color:#92400e}
html[data-theme=dark] .tk-tlist li.bad{background:var(--badbg);color:#fecaca}html[data-theme=dark] .trk-pill{color:#bbf7d0;border-color:transparent}html[data-theme=dark] .trk-pill.warn{color:#fde68a}
html[data-theme=dark] .trk-alert{color:#fecaca;border-color:transparent}html[data-theme=dark] .trk-alert .btn{background:var(--card);color:#fecaca;border-color:var(--line)}
html[data-theme=dark] .trk-rev{color:#fde68a}html[data-theme=dark] .trk-rev.r-approved{color:#bbf7d0}html[data-theme=dark] .trk-rev.r-rejected{color:#fecaca}html[data-theme=dark] .trk-rev.r-deducted{color:#bfdbfe}
html[data-theme=dark] .tk-st.s-live{color:#4ade80}html[data-theme=dark] .tk-st.s-stale{color:#fbbf24}html[data-theme=dark] .tk-st.s-off{color:#f87171}

.trk-alert .btn.trk-retry{background:#fff!important;color:#7f1d1d!important;border:1px solid #fecaca;box-shadow:none}html[data-theme=dark] .trk-alert .btn.trk-retry{background:var(--card)!important;color:#fecaca!important}

/* hp19: date picker on Aaj (Live) — any past date in the same view */
.day-head{gap:8px 10px;align-items:center;margin-bottom:10px}
.day-head h2{white-space:nowrap}
.day-live{flex:none;font-size:12px;font-weight:700;color:#16a34a;background:#dcfce7;border-radius:999px;padding:3px 10px}
.day-head.past .day-live{color:#92400e;background:#fef3c7}
.day-head.past h2{color:#92400e}
.daypick{display:flex;align-items:center;gap:6px;flex:none;margin-left:auto}
.daypick .dp-arrow{flex:none;width:38px;height:38px;padding:0;font-size:22px;line-height:1;display:grid;place-items:center}
.daypick input[type=date]{width:auto;min-width:0;height:38px;padding:6px 10px;margin:0;font-size:14px}
.daypick .dp-today{flex:none;padding:8px 12px;height:38px}
.daypick button:disabled{opacity:.4;cursor:default}
.day-head #refreshBtn{margin-left:0}
.live>.card.day-card{cursor:pointer}
.live>.card.day-card:focus-visible{outline:2px solid var(--brand,#4338ca);outline-offset:2px}
.pill.s-mo{background:#ffedd5;color:#9a3412}
.warn-t{color:#c2410c;font-weight:600}
.dd-p{display:flex;gap:12px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.dd-map{height:240px;border-radius:12px;margin:12px 0 4px;overflow:hidden}
@media(max-width:640px){.daypick{width:100%;margin-left:0}.daypick input[type=date]{flex:1}.day-head #refreshBtn{padding:8px 10px!important}}
