/* Vitals dashboard styles from the Vitals dashboard design (DashboardToday.dc.html). Demo fixes are at the end. */
:root,.shell{--x-000000:#000000;--x-0c5a44:#0c5a44;--x-111111:#111111;--x-12775a:#12775a;--x-17703a:#17703a;--x-2b2b2b:#2b2b2b;--x-2e2e2c:#2e2e2c;--x-3f3f3f:#3f3f3f;--x-55554f:#55554f;--x-6b6b65:#6b6b65;--x-6b6b66:#6b6b66;--x-7a4a00:#7a4a00;--x-85857f:#85857f;--x-8fbf9a:#8fbf9a;--x-9a9a95:#9a9a95;--x-a9a9a4:#a9a9a4;--x-b0b0aa:#b0b0aa;--x-b42318:#b42318;--x-b5b5b0:#b5b5b0;--x-c4c4bf:#c4c4bf;--x-d2d2cd:#d2d2cd;--x-d5d5d1:#d5d5d1;--x-dcdcd8:#dcdcd8;--x-e1e1dd:#e1e1dd;--x-e3e3df:#e3e3df;--x-e3f1eb:#e3f1eb;--x-e8e8e5:#e8e8e5;--x-e9a23b:#e9a23b;--x-efefed:#efefed;--x-f1f1ef:#f1f1ef;--x-f8f8f7:#f8f8f7;--x-fafaf9:#fafaf9;--x-fbf0d9:#fbf0d9;--x-fbfbfa:#fbfbfa;--x-fcecea:#fcecea;--x-fffffe:#fffffe;--x-ffffff:#ffffff}
.shell.is-dark{color-scheme:dark;--x-000000:#ffffff;--x-0c5a44:#6fd0a8;--x-111111:#ededea;--x-12775a:#3daa80;--x-17703a:#3daa80;--x-2b2b2b:#d6d6d2;--x-2e2e2c:#cfcfca;--x-3f3f3f:#c9c9c4;--x-55554f:#a3a39c;--x-6b6b65:#8f8f89;--x-6b6b66:#8f8f89;--x-7a4a00:#f2b860;--x-85857f:#7c7c76;--x-8fbf9a:#4f9a68;--x-9a9a95:#6b6b66;--x-a9a9a4:#5f5f5a;--x-b0b0aa:#595954;--x-b42318:#b42318;--x-b5b5b0:#55554f;--x-c4c4bf:#484844;--x-d2d2cd:#41413e;--x-d5d5d1:#3c3c39;--x-dcdcd8:#363634;--x-e1e1dd:#333331;--x-e3e3df:#30302e;--x-e3f1eb:#13281f;--x-e8e8e5:#2b2b29;--x-e9a23b:#e9a23b;--x-efefed:#262624;--x-f1f1ef:#232321;--x-f8f8f7:#0f0f0e;--x-fafaf9:#1d1d1c;--x-fbf0d9:#2e2310;--x-fbfbfa:#1d1d1c;--x-fcecea:#3a1512;--x-fffffe:#ffffff;--x-ffffff:#191918}
.shell.is-dark [fill="#111111" i]{fill:#ededea}.shell.is-dark [fill="#12775a" i]{fill:#3daa80}.shell.is-dark [fill="#6b6b66" i]{fill:#8f8f89}.shell.is-dark [fill="#b0b0aa" i]{fill:#595954}.shell.is-dark [fill="#d2d2cd" i]{fill:#41413e}.shell.is-dark [fill="#fffffe" i]{fill:#ffffff}.shell.is-dark [fill="#ffffff" i]{fill:#191918}.shell.is-dark [stroke="#12775A" i]{stroke:#3daa80}.shell.is-dark [stroke="#2e2e2c" i]{stroke:#cfcfca}
.shell.is-dark{--err-txt:#f07a6e}.shell.is-dark .m-label{background:rgba(25,25,24,.9)}.shell.is-dark .map-card{background:rgba(25,25,24,.96)}.shell.is-dark .map-legend{background:rgba(25,25,24,.94)}.shell.is-dark .card,.shell.is-dark .side{box-shadow:none}.shell.is-dark .map.is-street{background:#0b0b0a}.shell,.shell .card,.shell .side{transition:background-color .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease)}.theme-seg .seg button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px}.theme-seg .seg .ic{width:16px;height:16px;stroke-width:1.75}
:root,.shell{--ink:var(--x-111111);--ink-2:var(--x-3f3f3f);--muted:var(--x-55554f);--faint:var(--x-6b6b65);--line:var(--x-e8e8e5);--line-2:var(--x-d5d5d1);--bg:var(--x-f8f8f7);--surface:var(--x-ffffff);--soft:var(--x-f1f1ef);--err:var(--x-b42318);--err-t:var(--x-fcecea);--err-txt:var(--x-b42318);--warn:var(--x-7a4a00);--warn-f:var(--x-e9a23b);--warn-t:var(--x-fbf0d9);--ok:var(--x-12775a);--ok-d:var(--x-0c5a44);--ok-t:var(--x-e3f1eb);--mono:"Geist Mono",ui-monospace,monospace;--display:Archivo,ui-sans-serif,system-ui,sans-serif;--s-b:var(--x-111111);--s-q:var(--x-85857f);--s-l:var(--x-c4c4bf);--ease:cubic-bezier(.2,.8,.2,1);--spring:cubic-bezier(.34,1.45,.64,1)}
body{margin:0;background:var(--bg)}
a{color:var(--x-111111)}a:hover{color:var(--x-000000)}
*{box-sizing:border-box}
.num{font-variant-numeric:tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;padding:0;margin:-1px}
.ic{fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex:none}
.enter{animation:enter .55s var(--ease) both}
.d1{animation-delay:.05s}.d2{animation-delay:.1s}.d3{animation-delay:.15s}.d4{animation-delay:.2s}.d5{animation-delay:.25s}
.pop{animation:pop .45s var(--spring) both}
@keyframes enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:scale(.5)}to{opacity:1;transform:none}}
@keyframes growY{from{transform:scaleY(0)}to{transform:none}}
@keyframes growX{from{transform:scaleX(0)}to{transform:none}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
@keyframes ring{0%{transform:translate(-50%,-50%) scale(var(--ps)) ;box-shadow:0 0 0 0 rgba(255,255,255,.55)}100%{transform:translate(-50%,-50%) scale(var(--ps));box-shadow:0 0 0 7px rgba(255,255,255,0)}}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:10px;font:inherit;font-size:14px;font-weight:500;border:1px solid transparent;cursor:pointer;text-decoration:none;white-space:nowrap;transition:transform .25s var(--spring),background-color .2s,border-color .2s,color .2s}
.btn:active:not(:disabled){transform:scale(.97)}
.btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.btn .ic{width:18px;height:18px}
.btn-primary{background:var(--ink);color:var(--x-ffffff)}
.btn-primary:hover{background:var(--x-2b2b2b);color:var(--x-ffffff)}
.btn-primary .arrow{transition:transform .3s var(--spring)}
.btn-primary:hover .arrow{transform:translateX(3px)}
.btn-secondary{background:var(--surface);border-color:var(--line-2);color:var(--ink)}
.btn-secondary:hover{border-color:var(--ink-2);color:var(--ink)}
.btn-plain{background:transparent;color:var(--ink-2);padding:0 12px}
.btn-plain:hover{background:var(--soft);color:var(--ink)}
.btn-sm{min-height:36px;padding:0 12px;font-size:13px;border-radius:8px}
.icon-btn{width:34px;height:34px;display:grid;place-items:center;border-radius:8px;border:1px solid var(--line);background:var(--surface);color:var(--muted);cursor:pointer;transition:background-color .2s,color .2s,border-color .2s,transform .25s var(--spring)}
.icon-btn:hover{border-color:var(--ink-2);color:var(--ink)}
.icon-btn:active{transform:scale(.92)}
.icon-btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.icon-btn[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--x-ffffff)}
.icon-btn .ic{width:16px;height:16px}

.shell{display:flex;flex-wrap:wrap;min-height:100vh}
.side{position:sticky;top:0;align-self:flex-start;height:100vh;overflow-y:auto;flex:0 0 252px;background:var(--surface);border-right:1px solid var(--line);padding:20px 14px;display:flex;flex-direction:column;gap:18px;z-index:10}
.main{flex:999 1 640px;min-width:0;padding:28px 32px 96px;display:flex;flex-direction:column;gap:20px;max-width:1360px}
.nav{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none}
.nav a{display:flex;align-items:center;gap:12px;min-height:42px;padding:0 12px;border-radius:9px;font-size:14px;color:var(--ink-2);text-decoration:none;transition:background-color .2s,color .2s}
.nav a:hover{background:var(--soft);color:var(--ink)}
.nav a[aria-current="page"]{background:var(--ink);color:var(--x-ffffff);font-weight:500}
.nav .ic{width:18px;height:18px}
.nav-count{margin-left:auto;font-size:12px;opacity:.7}
.bizbtn{display:flex;align-items:center;gap:10px;width:100%;min-height:54px;padding:8px 10px 8px 12px;border:1px solid var(--line-2);border-radius:12px;background:var(--surface);font:inherit;color:var(--ink);text-align:left;cursor:pointer;transition:border-color .2s,box-shadow .25s}
.bizbtn:hover{border-color:var(--ink-2)}
.bizbtn[aria-expanded="true"]{border-color:var(--ink);box-shadow:0 0 0 3px rgba(17,17,17,.06)}
.bizbtn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.bizbtn .chev{transition:transform .3s var(--ease)}
.bizbtn[aria-expanded="true"] .chev{transform:rotate(180deg)}
.bdot{width:9px;height:9px;border-radius:50%;flex:none}
.bdot-healthy{background:var(--ok)}.bdot-watch{width:11px;height:10px;border-radius:0;background:var(--warn-f);clip-path:polygon(50% 0,100% 100%,0 100%)}.bdot-problem{width:11px;height:11px;border-radius:0;background:var(--err);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.bizmenu{position:absolute;left:0;right:0;top:calc(100% + 6px);padding:6px;border-radius:12px;background:var(--surface);border:1px solid var(--line);box-shadow:0 14px 34px rgba(0,0,0,.14);z-index:30;transform-origin:top center;animation:menuIn .22s var(--ease) both}
@keyframes menuIn{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:none}}
.bizopt{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:0 10px;align-items:center;width:100%;padding:10px;border:0;border-radius:8px;background:none;font:inherit;color:var(--ink);text-align:left;cursor:pointer;transition:background-color .15s}
.bizopt:hover,.bizopt:focus-visible{background:var(--soft);outline:none}
.bizopt[aria-selected="true"]{background:var(--soft)}
.biz{position:relative}
.biz select{appearance:none;-webkit-appearance:none;width:100%;min-height:44px;padding:0 36px 0 12px;border:1px solid var(--line-2);border-radius:10px;background:var(--surface);font:inherit;font-size:14px;font-weight:500;color:var(--ink);cursor:pointer;transition:border-color .2s}
.biz select:hover{border-color:var(--ink-2)}
.biz select:focus-visible{outline:2px solid var(--ink);outline-offset:1px}
.biz .ic{position:absolute;right:10px;top:50%;width:18px;height:18px;margin-top:-9px;pointer-events:none;color:var(--muted)}
@media (max-width:900px){
  .side{position:static;height:auto;flex:1 1 100%;border-right:0;border-bottom:1px solid var(--line);padding:12px 16px;gap:10px}
  .nav{flex-direction:row;overflow-x:auto}
  .nav a{white-space:nowrap}
  .side-foot{display:none !important}
  .theme-seg .eyebrow{display:none !important}
  .theme-seg .seg{max-width:220px}
  .main{padding:20px 16px 80px}
}
.live{width:8px;height:8px;border-radius:50%;background:var(--ink);animation:pulse 2s ease-in-out infinite;flex:none}

.card{background:var(--surface);border:1px solid var(--line);border-radius:12px}
.card-pad{padding:22px 24px}
.card-h{margin:0;font-size:16px;font-weight:600;letter-spacing:-.005em}
.card-sub{margin:2px 0 0;font-size:14px;color:var(--muted)}
.eyebrow{font-family:var(--mono);font-size:12px;font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ro{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:500 !important;letter-spacing:-.03em !important}
.disp{font-family:var(--display);font-weight:800 !important;letter-spacing:-.02em !important}
.row{display:flex;flex-wrap:wrap;gap:20px}
.t-warn{color:var(--warn)}.t-ok{color:var(--ok-d)}.t-err{color:var(--err-txt)}.t-muted{color:var(--muted)}

.pill{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px 0 10px;border-radius:99px;font-size:15px;font-weight:600}
.pill svg{width:16px;height:16px;flex:none}
.pill-watch{background:var(--warn-t);color:var(--warn)}
.pill-problem{background:var(--err);color:var(--x-fffffe)}
.pill-healthy{background:var(--ok-t);color:var(--ok-d)}
.pend-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.pend-steps li{display:flex;gap:12px;align-items:flex-start;font-size:15px}
.pend-n{flex:none;width:26px;height:26px;border-radius:6px;display:grid;place-items:center;background:var(--ink);color:var(--surface);font-family:var(--mono);font-size:13px;font-weight:500}
.nav-sep{height:1px;margin:8px 10px;background:var(--line)}
.hero{display:flex;flex-direction:column;gap:18px}
.hero .pend-copy{gap:14px}
.hero-pend{display:flex;flex-direction:column;gap:6px;padding-top:14px;border-top:1px solid var(--line)}
.hero .pend-stats{border-top:0;padding-top:0}
.todo{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.todo-i{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 0;border-top:1px solid var(--line);transition:opacity .3s var(--ease)}
.todo-i:first-child{border-top:0;padding-top:4px}
.todo-t{font-size:15px;font-weight:600;line-height:1.35}
.todo-chk{width:28px;height:28px;border-radius:7px;border:1.5px solid var(--line-2);background:var(--surface);color:transparent;display:grid;place-items:center;cursor:pointer;transition:background-color .2s,border-color .2s,color .2s,transform .25s var(--spring)}
.todo-chk .ic{width:16px;height:16px;stroke-width:2.5}
.todo-chk:hover{border-color:var(--ink-2)}
.todo-chk:active{transform:scale(.9)}
.todo-chk:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.todo-chk[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--surface)}
.todo-i.is-done{opacity:.55}.todo-i.is-done .todo-t{text-decoration:line-through}
@media (max-width:640px){.todo-i{grid-template-columns:auto minmax(0,1fr)}.todo-i > .btn{grid-column:2;justify-self:start}}
.pend-card{display:flex;flex-wrap:wrap;gap:20px 36px;align-items:center}
.pend-copy{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:12px}
.pend-fig{flex:1 1 440px;min-width:0;max-width:640px;margin:0 auto;display:flex;flex-direction:column;gap:6px}
.pend-fig svg{display:block;width:100%;height:auto;overflow:visible}
.pend-arm{transform-origin:300px 26px;transition:transform 1.6s var(--spring)}
.pend-intro{transform-origin:300px 26px;animation:pendIntro 2.6s cubic-bezier(.45,0,.55,1) both,pendSway 6s 2.6s ease-in-out infinite alternate}
@keyframes pendIntro{0%{transform:rotate(32deg)}27%{transform:rotate(-21deg)}49%{transform:rotate(12deg)}67%{transform:rotate(-6deg)}83%{transform:rotate(2.5deg)}100%{transform:none}}
@keyframes pendSway{from{transform:rotate(-.7deg)}to{transform:rotate(.7deg)}}
.pend-seg{transition:opacity .5s var(--ease)}
.pend-zones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.pend-zones span:nth-child(2){text-align:center}.pend-zones span:nth-child(3){text-align:right}
.ps-watch{color:var(--warn)}.ps-problem{color:var(--err-txt)}.ps-healthy{color:var(--ok-d)}
.pz-leads{color:var(--err-txt)}.pz-ok{color:var(--ok-d)}.pz-over{color:#a8480c}
.shell.is-dark .pz-over{color:#f2a15c}
.pend-stats{display:flex;flex-wrap:wrap;gap:12px 28px;padding-top:12px;border-top:1px solid var(--line)}
.pend-stats div{display:flex;flex-direction:column;gap:2px}
.nr-row{display:grid;grid-template-columns:140px minmax(0,1fr) 64px;align-items:center;gap:12px;padding:10px 0}
.lap-row{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) 40px;align-items:center;gap:12px;font-size:14px;padding:5px 0}
.vtag{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-stretch:75%;font-weight:800;font-size:22px;letter-spacing:.05em;text-transform:uppercase;line-height:1}
.vtag svg{width:18px;height:18px;flex:none}
.vtag-watch{color:var(--warn)}.vtag-healthy{color:var(--ok-d)}
.vtag-problem{color:var(--x-fffffe);background:var(--err);padding:8px 12px 8px 10px;border-radius:4px}
.vstamp{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.statusbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.sb{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--faint)}
.sb i{display:block;height:6px;border-radius:99px;background:var(--line);transition:background-color .4s}
.sb.on{color:var(--ink);font-weight:600}
.sb.on.sb-healthy i{background:var(--ok)}.sb.on.sb-watch i{background:var(--warn-f)}.sb.on.sb-problem i{background:var(--err)}
.why{display:grid;transition:grid-template-rows .45s var(--ease)}
.why > div{overflow:hidden;min-height:0}

.seg{position:relative;display:grid;background:var(--soft);border-radius:10px;padding:3px}
.seg-pill{position:absolute;top:3px;bottom:3px;left:3px;background:var(--surface);border-radius:8px;box-shadow:0 1px 2px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.05);transition:transform .5s var(--spring)}
.seg button{position:relative;z-index:1;min-height:34px;padding:0 12px;border:0;background:none;font:inherit;font-size:13px;color:var(--muted);cursor:pointer;border-radius:8px;transition:color .2s;white-space:nowrap}
.seg button[aria-pressed="true"]{color:var(--ink);font-weight:500}
.seg button:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}

.proj{position:relative;height:18px;border-radius:6px;background:var(--soft);margin:30px 0 22px}
.proj-fill{position:absolute;inset:0 auto 0 0;display:flex;border-radius:6px;overflow:hidden;transform-origin:left;animation:growX .9s .2s var(--ease) both;transition:width .6s var(--ease)}
.proj-fill span{display:block;height:100%;transition:width .6s var(--ease)}
.proj-fill span + span{border-left:2px solid var(--x-ffffff)}
.proj-mark{position:absolute;top:-8px;bottom:-8px;width:0;border-left:2px dashed var(--ink);transition:left .6s var(--ease)}
.proj-mark b{position:absolute;bottom:100%;left:0;transform:translate(-50%,-2px);font-size:11px;font-weight:600;white-space:nowrap}
.proj-ly{position:absolute;top:100%;width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:6px solid var(--ink-2);transform:translate(-50%,4px);transition:left .6s var(--ease)}
.proj-ly b{position:absolute;top:8px;left:0;transform:translateX(-50%);font-size:11px;font-weight:500;color:var(--muted);white-space:nowrap}
.key{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--ink-2)}
.key span{display:inline-flex;align-items:center;gap:7px}
.sw{display:inline-block;width:10px;height:10px;border-radius:3px;flex:none}

.meter{flex:1 1 240px;padding:18px 20px;display:flex;flex-direction:column;gap:8px}
.mt{position:relative;height:10px;border-radius:99px;background:var(--soft);margin-top:6px}
.mt > span{position:absolute;inset:0 auto 0 0;border-radius:99px;background:var(--ink);transform-origin:left;animation:growX .9s .25s var(--ease) both;transition:width .6s var(--ease)}
.mt.is-warn > span{background:var(--warn-f)}
.mt.is-err > span{background:var(--err)}
.mt i{position:absolute;top:-5px;bottom:-5px;width:2px;background:var(--ink);border-radius:1px;transition:left .6s var(--ease)}
.mt-scale{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}

.cap-wrap{display:flex;flex-wrap:wrap;gap:20px 28px;align-items:stretch}
.cap-chart{flex:none;min-width:0;display:flex;gap:10px}
.cap-y{position:relative;width:44px;flex:none}
.cap-y span{position:absolute;right:0;transform:translateY(50%);font-size:11px;color:var(--muted)}
.cap-plot{position:relative;flex:1 1 auto;min-width:0}
.gl{position:absolute;left:0;right:0;height:1px;background:var(--line)}
.cap-cols{position:relative;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px;height:100%}
.cw{display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch;padding:0;border:0;background:none;font:inherit;cursor:pointer;border-radius:10px;transition:opacity .25s}
.cw:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.cw-pct{font-size:12px;font-weight:600;text-align:center;margin-bottom:6px;transition:color .2s}
.cw-pct.is-low{color:var(--warn)}
.cw-track{position:relative;display:flex;flex-direction:column;justify-content:flex-end;margin:0 10%;border-radius:8px;background:var(--soft);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;transition:height .6s var(--ease),box-shadow .25s}
.cw:hover .cw-track{box-shadow:inset 0 0 0 1.5px var(--ink-2)}
.cw.is-sel .cw-track{box-shadow:inset 0 0 0 2px var(--ink)}
.cw-fill{display:flex;flex-direction:column;justify-content:flex-end;transform-origin:bottom center;animation:growY .9s var(--ease) both}
.cw-s{display:block;flex:none;transition:height .6s var(--ease)}
.cw-b{background:var(--s-b)}
.cw-q{background:var(--s-q);box-shadow:inset 0 -2px 0 var(--x-ffffff)}
.cw-l{background:var(--s-l);box-shadow:inset 0 -2px 0 var(--x-ffffff)}
.cw-x{height:34px;margin-top:8px;font-size:12px;line-height:1.3;color:var(--muted);text-align:center}
.ax-y{writing-mode:vertical-rl;transform:rotate(180deg);align-self:center;font-size:11px;font-weight:500;letter-spacing:.04em;color:var(--muted);white-space:nowrap;flex:none}
.ax-x{font-size:11px;font-weight:500;letter-spacing:.04em;color:var(--muted);text-align:center}
.cw.is-sel .cw-x{color:var(--ink);font-weight:600}
.cap-detail{flex:1 1 240px;padding:18px;border-radius:14px;background:var(--soft);display:flex;flex-direction:column;gap:10px}
.dr{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;font-size:14px}
.dr-bar{height:6px;border-radius:99px;background:var(--x-e3e3df);overflow:hidden}
.dr-bar span{display:block;height:100%;border-radius:99px;transition:width .5s var(--ease)}

.alert{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:4px 12px;align-items:start;padding:14px 0;border-top:1px solid var(--line)}
.alert:first-child{border-top:0;padding-top:2px}
.al-ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center}
.al-ic .ic{width:16px;height:16px;stroke-width:2}
.al-err{background:var(--err);color:var(--x-fffffe)}.al-warn{background:var(--warn-t);color:var(--warn)}.al-info{background:var(--soft);color:var(--ink-2)}.al-ok{background:var(--ok-t);color:var(--ok-d)}
.al-metric{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;background:var(--soft);font-size:12px;font-weight:600}

.conv{display:grid;grid-template-columns:120px minmax(0,1fr) 76px;align-items:center;gap:12px;padding:10px 0}
.ct{position:relative;height:14px;border-radius:4px;background:var(--soft)}
.ct > span{position:absolute;inset:0 auto 0 0;border-radius:4px;background:var(--ink);transform-origin:left;animation:growX .9s var(--ease) both;transition:width .6s var(--ease)}
.ct i{position:absolute;top:-4px;bottom:-4px;width:2px;background:var(--warn-f);border-radius:1px;transition:left .6s var(--ease)}
.jb-row{display:grid;grid-template-columns:118px minmax(0,1fr) 132px;gap:12px;align-items:center;padding:9px 0;border-top:1px solid var(--line)}
.jb-row:first-of-type{border-top:0}
.jb-bar{display:flex;height:14px;border-radius:4px;overflow:hidden;background:var(--soft)}
.jb-bar span{display:block;height:100%;transform-origin:left;transition:width .6s var(--ease)}
.jb-key{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.qstack{display:flex;height:22px;border-radius:6px;overflow:hidden;transform-origin:left;animation:growX .9s .2s var(--ease) both}
.qstack span{display:block;height:100%;transition:width .6s var(--ease)}
.qstack span + span{border-left:2px solid var(--x-ffffff)}
.qr{display:grid;grid-template-columns:auto minmax(0,1fr) 70px 80px;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:14px}

.yo{display:flex;gap:10px}
.yo-y{position:relative;width:48px;flex:none}
.yo-y span{position:absolute;right:0;transform:translateY(50%);font-size:11px;color:var(--muted)}
.yo-plot{position:relative;flex:1 1 auto;min-width:0}
.yo-cols{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:4px}
.ym{display:flex;flex-direction:column;align-items:stretch;padding:0;border:0;background:none;font:inherit;cursor:pointer;border-radius:8px}
.ym:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.ym-area{position:relative;border-radius:8px;transition:background-color .2s}
.ym:hover .ym-area,.ym.is-sel .ym-area{background:rgba(17,17,17,.04)}
.ym-bar{position:absolute;bottom:0;left:24%;right:24%;border-radius:4px 4px 0 0;background:var(--ink);transform-origin:bottom center;animation:growY .9s var(--ease) both;transition:height .6s var(--ease),background-color .3s}
.ym-bar.is-proj{background:repeating-linear-gradient(135deg,var(--x-c4c4bf) 0 3px,var(--x-dcdcd8) 3px 6px)}
.ym-bar.is-now{background:linear-gradient(to top,var(--x-111111) var(--done),var(--x-c4c4bf) var(--done))}
.ym-goal{position:absolute;bottom:0;left:24%;right:24%;border:1.5px solid var(--x-9a9a95);border-bottom:0;border-radius:4px 4px 0 0;background:transparent;transform-origin:bottom center;animation:growY .9s var(--ease) both;transition:height .6s var(--ease),opacity .3s}
.ym-ly{position:absolute;left:12%;right:12%;height:0;margin-bottom:-1px;border-top:2.5px dotted var(--err);transition:bottom .6s var(--ease)}
.ym-x{height:22px;margin-top:6px;font-size:12px;color:var(--muted);text-align:center}
.ym.is-sel .ym-x{color:var(--ink);font-weight:600}
.lg-dash{display:inline-block;width:10px;height:12px;border:1.5px solid var(--x-9a9a95);border-bottom:0;border-radius:3px 3px 0 0}
.lg-dot{display:inline-block;width:18px;height:0;border-top:2.5px dotted var(--err)}
.lg-hatch{display:inline-block;width:10px;height:10px;border-radius:3px;background:repeating-linear-gradient(135deg,var(--x-c4c4bf) 0 3px,var(--x-dcdcd8) 3px 6px)}

.map{position:relative;width:100%;padding-top:52.5%;border-radius:14px;overflow:hidden;background:var(--x-fafaf9);box-shadow:inset 0 0 0 1px var(--line);transition:background-color .8s var(--ease)}
.map.is-street{background:#1c1c1b}
.map-world{position:absolute;inset:0;transform-origin:0 0;transition:transform 1s var(--ease)}
.map-world svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.m-dots{transition:opacity .6s}
.m-streets{opacity:0;transition:opacity .8s .2s}
.map.is-street .m-dots{opacity:0}
.map.is-street .m-streets{opacity:1}
.area{cursor:pointer;stroke:var(--x-ffffff);stroke-width:1.5;vector-effect:non-scaling-stroke;transition:stroke .2s,opacity .3s}
.area:hover,.area.is-hover{stroke:var(--x-111111);stroke-width:2.5}
.map.is-street .area{fill:rgba(255,255,255,.03);stroke:#4a4a47}
.map.is-street .area.is-zoom{fill:rgba(255,255,255,.07);stroke:#ffffff;stroke-width:2}
.road{fill:none;stroke:var(--x-e1e1dd);stroke-width:1.2;vector-effect:non-scaling-stroke;transition:stroke .8s}
.map.is-street .road{stroke:#5a5a56;stroke-width:1.6}
.m-label{position:absolute;transform:translate(-50%,-50%) scale(var(--ps));font-size:12px;font-weight:600;color:var(--x-111111);background:rgba(255,255,255,.88);padding:2px 7px;border-radius:6px;white-space:nowrap;pointer-events:none;transition:opacity .4s}
.map.is-street .m-label{opacity:0}
.pin{position:absolute;width:9px;height:9px;border-radius:50%;transform:translate(-50%,-50%) scale(var(--ps));pointer-events:none;animation:pinIn .5s var(--spring) both}
@keyframes pinIn{from{opacity:0;transform:translate(-50%,-50%) scale(0)}to{opacity:1;transform:translate(-50%,-50%) scale(var(--ps))}}
.pin-done{background:var(--x-ffffff)}
.pin-quote{background:transparent;border:2px solid var(--x-b5b5b0)}
.pin-lead{background:var(--x-e9a23b)}
.map-card{position:absolute;left:14px;bottom:14px;width:250px;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.96);box-shadow:0 6px 20px rgba(0,0,0,.12);font-size:13px;display:flex;flex-direction:column;gap:6px;transition:opacity .3s}
.map-legend{position:absolute;right:14px;bottom:14px;padding:8px 12px;border-radius:10px;background:rgba(255,255,255,.94);font-size:12px;display:flex;flex-wrap:wrap;gap:4px 12px;max-width:60%}
.map-legend span{display:inline-flex;align-items:center;gap:6px}
.map-back{position:absolute;right:14px;top:14px}
.mstat{display:flex;justify-content:space-between;gap:10px}
.mstat span:first-child{color:var(--muted)}
.chip{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border-radius:99px;border:1px solid var(--line-2);background:var(--surface);font:inherit;font-size:13px;color:var(--ink-2);cursor:pointer;transition:background-color .2s,border-color .2s,color .2s,transform .25s var(--spring)}
.chip:hover{border-color:var(--ink-2)}
.chip:active{transform:scale(.95)}
.chip:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--x-ffffff)}

.fun{display:flex;flex-direction:column;align-items:stretch}
.fun-row{display:grid;grid-template-columns:200px minmax(0,1fr) 110px;align-items:center;gap:16px}
.fun-bar{display:flex;justify-content:center}
.fun-bar span{display:block;height:44px;border-radius:8px;background:var(--ink);transform-origin:center;animation:growX .9s var(--ease) both;transition:width .6s var(--ease)}
.fun-step{display:grid;grid-template-columns:200px minmax(0,1fr) 110px;gap:16px;height:30px;align-items:center}
.fun-step em{font-style:normal;justify-self:center;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--ink-2);padding:2px 10px;border-radius:99px;background:var(--soft)}
@media (max-width:640px){.fun-row,.fun-step{grid-template-columns:110px minmax(0,1fr) 80px;gap:8px}}

.board{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:12px;overflow-x:auto}
.bcol{background:var(--soft);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:8px;min-width:220px}
.bcard{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:4px;animation:enter .45s var(--ease) both;transition:transform .25s var(--spring),box-shadow .25s}
.bcard:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,0,0,.06)}

.lead{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding:14px 0;border-top:1px solid var(--line);transition:opacity .3s}
.lead:first-child{border-top:0;padding-top:2px}
.lead.is-done{opacity:.55}
.odds{display:block;width:72px;height:4px;border-radius:99px;background:var(--soft);overflow:hidden;margin-top:6px}
.odds span{display:block;height:100%;background:var(--ink);border-radius:99px}

.mrow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:16px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}
.mrow:first-child{border-top:0;padding-top:2px}
.input{height:40px;width:100%;border:1px solid var(--line-2);border-radius:8px;padding:0 10px;font:inherit;font-size:14px;color:var(--ink);background:var(--surface);text-align:right;transition:border-color .2s,box-shadow .2s}
.input:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 3px rgba(17,17,17,.08)}
.mg{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.toggle{position:relative;width:44px;height:26px;border-radius:99px;border:0;background:var(--line-2);cursor:pointer;transition:background-color .25s;flex:none}
.toggle::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--x-ffffff);box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .35s var(--spring)}
.toggle[aria-checked="true"]{background:var(--ink)}
.toggle[aria-checked="true"]::after{transform:translateX(18px)}
.toggle:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.move{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 16px;align-items:center;padding:16px 0;border-top:1px solid var(--line);transition:opacity .3s}
.move:first-child{border-top:0;padding-top:4px}
.move.is-done{opacity:.55}
.move-n{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:600;background:var(--soft);transition:background-color .3s,color .3s}
.move.is-done .move-n{background:var(--ink);color:var(--x-ffffff)}
.move-n .ic{width:15px;height:15px;stroke-width:2.5}
.impact{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:7px;background:var(--x-e8e8e5);color:var(--ink);font-family:var(--mono);font-size:12px;font-weight:600}
.phone{width:300px;max-width:100%;padding:18px 14px;border-radius:28px;background:var(--x-f1f1ef);box-shadow:inset 0 0 0 1px var(--line);display:flex;flex-direction:column;gap:8px}
.bubble{align-self:flex-start;max-width:92%;padding:10px 13px;border-radius:16px 16px 16px 4px;background:var(--x-ffffff);box-shadow:0 1px 2px rgba(0,0,0,.06);font-size:14px;line-height:1.4;animation:enter .45s var(--ease) both}
.svc-wrap{display:flex;flex-wrap:wrap;gap:20px 28px;align-items:stretch}
.svc-chart{flex:999 1 520px;min-width:0;display:flex;flex-direction:column;gap:6px}
.svc-row{display:flex;gap:10px;height:340px}
.svc-y{position:relative;width:44px;flex:none}
.svc-y span{position:absolute;right:0;transform:translateY(50%);font-size:11px;color:var(--muted)}
.svc-plot{position:relative;flex:1 1 auto;min-width:0;border-left:1px solid var(--line-2);border-bottom:1px solid var(--line-2)}
.svc-x{position:relative;height:18px;margin-left:54px}
.svc-x span{position:absolute;top:0;transform:translateX(-50%);font-size:11px;color:var(--muted)}
.q{position:absolute;padding:8px 10px;font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.q-bg{position:absolute;background:rgba(23,112,58,.05)}
.q-ref{position:absolute;border-color:var(--line-2);border-style:dashed;border-width:0}
.bub{position:absolute;transform:translate(-50%,50%);border-radius:50%;border:2px solid var(--x-ffffff);padding:0;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.18);transition:left .6s var(--ease),bottom .6s var(--ease),width .6s var(--ease),height .6s var(--ease),box-shadow .25s,transform .3s var(--spring);animation:pop .5s var(--spring) both}
.bub:hover{transform:translate(-50%,50%) scale(1.08)}
.bub:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.bub.is-sel{box-shadow:0 0 0 3px var(--ink),0 4px 14px rgba(0,0,0,.2)}
.bub-l{position:absolute;top:50%;transform:translateY(-50%);font-size:12px;font-weight:600;color:var(--ink);white-space:nowrap;pointer-events:none}
.bub-l.r{left:calc(100% + 6px)}.bub-l.l{right:calc(100% + 6px)}
@media (max-width:640px){.bub-l{display:none}}
.c-grow{background:var(--ok)}.c-protect{background:var(--ink)}.c-fix{background:var(--warn-f)}.c-trim{background:var(--x-b0b0aa)}
.svc-detail{flex:1 1 260px;padding:18px;border-radius:14px;background:var(--soft);display:flex;flex-direction:column;gap:10px}
.qtag{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:7px;font-size:12px;font-weight:600}
.qtag i{width:8px;height:8px;border-radius:50%}
.qt-grow{background:var(--ok-t);color:var(--ok-d)}.qt-protect{background:var(--x-e8e8e5);color:var(--ink)}.qt-fix{background:var(--warn-t);color:var(--warn)}.qt-trim{background:var(--x-efefed);color:var(--muted)}
.rank{width:100%;border:0;background:none;font:inherit;color:inherit;text-align:left;display:grid;grid-template-columns:28px minmax(120px,1.2fr) minmax(0,2fr) 84px auto;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line);cursor:pointer;transition:background-color .2s}
.rank:first-child{border-top:0}
.rank:hover{background:var(--x-fbfbfa)}
.rank:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.rank.is-sel{background:var(--soft)}
.rank-bar{height:14px;border-radius:4px;background:var(--soft);overflow:hidden}
.rank-bar span{display:block;height:100%;border-radius:4px;transform-origin:left;animation:growX .8s var(--ease) both;transition:width .6s var(--ease)}
.chip-n{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:7px;background:var(--soft);font-size:12px;font-weight:500;white-space:nowrap}
@media (max-width:700px){.rank{grid-template-columns:24px minmax(0,1fr) 72px}.rank .rank-bar,.rank .chip-n{display:none}}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:12px;background:var(--ink);color:var(--x-ffffff);font-size:14px;box-shadow:0 10px 30px rgba(0,0,0,.2);animation:enter .35s var(--ease) both;z-index:40}

@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-delay:0ms !important;transition-duration:.01ms !important}}

/* Demo fixes */
.bizbtn .chev,.bizopt .ic{position:static;margin:0;flex:none}
