/* ==========================================================================
   Staged app screens, round 2 (1 Oct 2026): the field app (v3 design) phone screens, the orb,
   the Assistant panel and its Confirm card. Loaded on Home, Work (/modules/) and How it works,
   after base.css and the page's own stylesheet. Every animation has a reduced-motion fallback.
   ========================================================================== */
/* ---------- Small "new" line used inside existing sections ---------- */
.newin{display:inline-flex;align-items:flex-start;gap:9px;margin-top:14px;font-size:14.5px;font-weight:700;line-height:1.45;color:#e6f1ed;max-width:440px}
.newin::before{content:"New";flex:0 0 auto;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;background:var(--gold);color:var(--green);border-radius:999px;padding:3px 8px;margin-top:1px}
.newin.on-light{color:var(--text)}

/* ---------- The orb (field app v3 / Assistant voice) ---------- */
.orb{--s:64px;position:relative;width:var(--s);height:var(--s);border-radius:50%;flex:0 0 var(--s);
  background:radial-gradient(circle at 34% 30%,#d9ffe9 0,#5fe3a4 14%,#139a66 38%,#0a4a35 64%,#04241a 100%);
  box-shadow:0 0 0 4px #fff,0 0 0 5px #d7efe2,0 10px 26px -6px rgba(16,140,90,.65);overflow:hidden}
.orb::before{content:"";position:absolute;inset:-30%;background:conic-gradient(from 0deg,transparent 0 30%,rgba(190,255,220,.55) 40%,transparent 52%,transparent 70%,rgba(234,197,27,.35) 80%,transparent 90%);animation:orbSpin 6s linear infinite;mix-blend-mode:screen}
.orb::after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 -6px 14px rgba(0,0,0,.35),inset 0 4px 10px rgba(255,255,255,.35)}
.orb.glow{animation:orbGlow 2.8s ease-in-out infinite}
@keyframes orbSpin{to{transform:rotate(360deg)}}
@keyframes orbGlow{0%,100%{box-shadow:0 0 0 4px #fff,0 0 0 5px #d7efe2,0 10px 26px -6px rgba(16,140,90,.65)}50%{box-shadow:0 0 0 4px #fff,0 0 0 5px #bfe8d2,0 0 34px 6px rgba(47,211,138,.55)}}
.orb.dark{box-shadow:0 0 0 3px rgba(255,255,255,.12),0 0 30px 4px rgba(47,211,138,.45)}

/* ---------- Field app v3 phone screens (390 x 844, scaled by base.js) ---------- */
.fv{background:#f2f3f6;color:#14171f;font-family:Inter,"Segoe UI",system-ui,sans-serif}
.fv .sb2{height:54px;display:flex;justify-content:space-between;align-items:flex-end;padding:0 34px 4px;font-weight:700;font-size:16px}
.fv .sb2 i{font-style:normal;letter-spacing:2px;font-size:12px}
.fv .pad{padding:14px 18px 0;display:flex;flex-direction:column;gap:12px;flex:1;min-height:0;overflow:hidden}
.fv .kick{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#5b6170}
.fv .ttl{display:flex;justify-content:space-between;align-items:center;gap:10px}
.fv .ttl b{font-size:30px;font-weight:800;letter-spacing:-.03em;line-height:1.05}
.fv .sync{font-size:13px;font-weight:700;color:#16824f;background:#e3f6ec;border-radius:999px;padding:6px 11px;white-space:nowrap}
.fv .meta2{display:flex;gap:16px;color:#4d5361;font-size:13.5px;font-weight:600}
.fv .cv{background:#fff;border-radius:20px;padding:16px;box-shadow:0 1px 0 rgba(0,0,0,.04),0 0 0 1px #e7e9ee}
.fv .pb2{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:#1d5fd1;background:#e5eefc;border-radius:999px;padding:6px 11px}
.fv .tg{font-size:12.5px;font-weight:700;color:#4d5361;background:#eef0f3;border-radius:999px;padding:5px 10px;white-space:nowrap}
.fv .jt{font-size:21px;font-weight:800;letter-spacing:-.02em;margin:12px 0 2px;line-height:1.2}
.fv .js{color:#5b6170;font-size:14.5px}
.fv .map{height:96px;border-radius:14px;margin:12px 0;background:
  linear-gradient(90deg,transparent 46%,#fff 46% 49%,transparent 49%),
  linear-gradient(0deg,transparent 40%,#fff 40% 44%,transparent 44%),
  linear-gradient(90deg,transparent 72%,#fff 72% 75%,transparent 75%),
  linear-gradient(160deg,#d6e6f6 0 22%,#e6e9ee 22%);position:relative;overflow:hidden}
.fv .map::before{content:"";position:absolute;left:14%;top:24%;width:66%;height:52%;border:4px solid #1f6feb;border-color:#1f6feb transparent transparent transparent;border-radius:50% 50% 0 0/100% 100% 0 0;transform:rotate(14deg)}
.fv .map::after{content:"";position:absolute;right:16%;bottom:16%;width:14px;height:14px;border-radius:50%;background:#c2570c;box-shadow:0 0 0 5px rgba(194,87,12,.2)}
.fv .addr{display:flex;gap:10px;font-weight:700;font-size:15.5px;line-height:1.3}
.fv .addr small{display:block;font-weight:500;color:#5b6170;font-size:13px}
.fv .chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.fv .chips span{font-size:12.5px;font-weight:600;background:#f1f2f5;border-radius:999px;padding:6px 10px}
.fv .big{display:flex;align-items:center;justify-content:center;gap:10px;border-radius:16px;padding:15px;font-size:17px;font-weight:800;color:#fff;background:#1f6feb}
.fv .big.or{background:#c2570c}
.fv .big.gr{background:#16824f}
.fv .big.soft{background:#a9c5f7}
.fv .three{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
.fv .three span{background:#e8f0fd;color:#1d5fd1;border-radius:14px;padding:11px 4px;text-align:center;font-size:14px;font-weight:700}
.fv .tabv{margin-top:auto;height:84px;background:#fff;border-top:1px solid #e7e9ee;display:grid;grid-template-columns:repeat(5,1fr);align-items:center;padding:0 6px 14px;font-size:11.5px;font-weight:600;color:#5b6170;text-align:center;position:relative}
.fv .tabv span{display:flex;flex-direction:column;align-items:center;gap:4px}
.fv .tabv span.on{color:#1f6feb}
.fv .tabv i{width:22px;height:22px;border-radius:6px;border:2px solid currentColor;opacity:.8;display:block}
.fv .tabv .orb{--s:62px;margin:-34px auto 0}
.fv .row2{display:flex;justify-content:space-between;align-items:center;gap:10px}
.fv .lbl2{font-size:12px;font-weight:800;letter-spacing:.08em;color:#5b6170;text-transform:uppercase}
.fv .sheet{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:26px 26px 0 0;padding:12px 18px 26px;box-shadow:0 -20px 50px -20px rgba(0,0,0,.35);transform:translateY(0);transition:transform .7s var(--ease)}
.fv .sheet::before{content:"";display:block;width:44px;height:5px;border-radius:5px;background:#d5d8de;margin:0 auto 12px}
.fv .dim{position:absolute;inset:0;background:rgba(20,23,31,.35)}
.fv .bub{background:#f1f2f5;border-radius:16px;padding:12px 14px;font-size:15px;line-height:1.45}
.fv .bub .lk{color:#1d5fd1;font-weight:700}
.fv .tgl{width:46px;height:28px;border-radius:999px;background:#16824f;position:relative;flex:0 0 46px}
.fv .tgl::after{content:"";position:absolute;right:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff}
.fv .toast3{position:absolute;left:16px;right:16px;bottom:100px;background:#14171f;color:#fff;border-radius:14px;padding:12px 14px;font-size:14px;font-weight:700;display:flex;gap:10px;align-items:center;opacity:0;transform:translateY(12px);transition:all .5s var(--ease)}
.fv .toast3.show{opacity:1;transform:none}
.fv .wave{display:flex;align-items:center;gap:3px;height:28px}
.fv .wave i{width:3px;border-radius:2px;background:#e0413a;height:30%;animation:vpbar .9s ease-in-out infinite}
.fv .wave i:nth-child(3n){animation-delay:-.3s}.fv .wave i:nth-child(3n+1){animation-delay:-.55s}.fv .wave i:nth-child(4n){animation-delay:-.15s}
.fv .wave.bl i{background:#1f6feb}
.fv .sig{height:96px;border:2px dashed #cfd3da;border-radius:14px;position:relative;overflow:hidden}
.fv .sig svg{position:absolute;left:8%;top:12%;width:84%;height:70%}
.fv .sig path{fill:none;stroke:#14171f;stroke-width:3;stroke-linecap:round;stroke-dasharray:600;stroke-dashoffset:600;animation:sign 3.2s var(--ease) 1s forwards}
@keyframes sign{to{stroke-dashoffset:0}}
.fv .photos3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.fv .photos3 span{height:70px;border-radius:10px;background:linear-gradient(160deg,#7f97ad,#5f7488);position:relative}
.fv .photos3 span:nth-child(2){background:linear-gradient(160deg,#b6906b,#8d6c4f)}
.fv .photos3 span::after{content:attr(data-t);position:absolute;left:5px;bottom:5px;font-size:10.5px;font-weight:800;color:#fff;background:rgba(0,0,0,.5);border-radius:5px;padding:2px 5px}
.fv .qr{width:190px;height:190px;margin:4px auto;border-radius:14px;border:1px solid #e3e5ea;padding:12px;background:#fff}
.fv .qr div{width:100%;height:100%;background:
  conic-gradient(#14171f 25%,#fff 0 50%,#14171f 0 75%,#fff 0) 0 0/22px 22px;
  -webkit-mask:radial-gradient(circle,#000 62%,transparent 64%) 0 0/11px 11px;mask:radial-gradient(circle,#000 62%,transparent 64%) 0 0/11px 11px;position:relative}
.fv .qrw{position:relative}
.fv .qrw::before,.fv .qrw::after{content:"";position:absolute;width:40px;height:40px;border:7px solid #14171f;border-radius:6px;background:#fff;box-shadow:inset 0 0 0 5px #fff,inset 0 0 0 20px #14171f;z-index:1}
.fv .qrw::before{left:calc(50% - 83px);top:16px}.fv .qrw::after{right:calc(50% - 83px);top:16px}
.fv .tick{width:74px;height:74px;border-radius:50%;background:#16a05a;display:grid;place-items:center;margin:4px auto 6px;animation:popIn .6s var(--ease) both}
.fv .tick svg{width:36px;height:36px;color:#fff}
.fv .cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px 0;text-align:center;font-weight:700;font-size:15px}
.fv .cal small{font-size:12px;color:#5b6170;padding-bottom:4px}
.fv .cal span{padding:6px 0 10px;border-radius:10px;position:relative}
.fv .cal span.mu{color:#9aa0ab}
.fv .cal span.td{background:#1f6feb;color:#fff}
.fv .cal span.sel{box-shadow:inset 0 0 0 2px #1f6feb}
.fv .cal span[data-d]::after{content:attr(data-d);position:absolute;left:0;right:0;bottom:-1px;font-size:9px;letter-spacing:1px;color:#9aa0ab}
.fv .cal span.td[data-d]::after{color:#fff}
.fv .tl{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid #eef0f3;font-size:14.5px}
.fv .tl:first-child{border-top:0}
.fv .tl b{display:block}
.fv .tl small{color:#5b6170;font-size:12.5px}
.fv .tl .bar{width:5px;border-radius:4px;background:#16824f;flex:0 0 5px}
.fv .tl .bar.dr{background:#c2570c}
.fv .run{display:flex;align-items:center;gap:10px}
.fv .live{display:inline-flex;align-items:center;gap:6px;background:#e3f6ec;color:#16824f;font-weight:800;font-size:13px;border-radius:999px;padding:6px 10px}
.fv .live::before{content:"";width:7px;height:7px;border-radius:50%;background:#16a05a;animation:live 2s infinite}
.fv .prog{height:8px;border-radius:8px;background:#e7e9ee;overflow:hidden}
.fv .prog i{display:block;height:100%;width:82%;background:#1f6feb;border-radius:8px}
.fv .steps5{display:flex;gap:5px}
.fv .steps5 i{flex:1;height:5px;border-radius:5px;background:#e3e5ea}
.fv .steps5 i.d{background:#16a05a}.fv .steps5 i.c{background:#1f6feb}
/* voice on the phone */
.fv .vtalk{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center;padding:0 10px}
.fv .vtalk .orb{--s:150px}
.fv .vq{font-size:19px;font-weight:700;line-height:1.35;color:#14171f}
.fv .va{font-size:16px;line-height:1.5;color:#3b404c}
.fv .vdock{display:flex;align-items:center;gap:12px;background:#fff;border-radius:18px;padding:12px 12px 12px 16px;box-shadow:0 0 0 1px #e7e9ee}
.fv .vdock .st{font-weight:700;font-size:14px;display:flex;align-items:center;gap:7px}
.fv .vdock .st::before{content:"";width:8px;height:8px;border-radius:50%;background:#1f6feb;animation:live 2s infinite}
.fv .stop{margin-left:auto;background:#d92d20;color:#fff;font-weight:800;font-size:14px;border-radius:12px;padding:10px 14px}
/* new phone screen bits */
.fv .ck{width:22px;height:22px;border-radius:50%;background:#e3f6ec;color:#16824f;display:grid;place-items:center;flex:0 0 22px;margin-top:2px;font-size:12px;font-weight:800}
.fv .ck svg{width:13px;height:13px}
.fv .ck.st{background:#fff6d6;color:#b58a00}
.fv .ck.nx{background:#e5eefc;color:#1d5fd1}
.fv .tl .un{color:#1d5fd1;font-weight:700;font-size:13px}
.fv .bolt{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,#0e7a52,#0a4a35);color:#c9ffe4;display:grid;place-items:center;flex:0 0 36px}
.fv .bolt svg{width:18px;height:18px}
.fv .toast3 svg{width:16px;height:16px;color:#5fe3a4}
.fv .wkd{display:grid;grid-template-columns:52px 1fr;gap:8px;align-items:start}
.fv .wkd > span{font-size:11.5px;font-weight:800;letter-spacing:.06em;color:#5b6170;padding-top:12px}
.fv .wkd.td > span{color:#1f6feb}
.fv .wkd > div{display:grid;gap:6px}
.fv .wj{background:#fff;border-radius:14px;padding:9px 12px;box-shadow:0 0 0 1px #e7e9ee;display:flex;gap:10px;font-size:13.5px}
.fv .wkd.td .wj{box-shadow:inset 3px 0 0 #1f6feb,0 0 0 1px #e7e9ee}
.fv .wj > b{width:40px;flex:0 0 40px}
.fv .wj span b{display:block}
.fv .wj small{color:#5b6170;font-size:12px}
.fv.sms{background:#fff}
.fv .smsh{display:flex;flex-direction:column;align-items:center;gap:3px;padding:6px 0 12px;border-bottom:1px solid #eceef2;background:#f7f7f9}
.fv .smsh .sav{width:46px;height:46px;border-radius:50%;background:#172C43;color:#f2ad47;display:grid;place-items:center;font-weight:800;font-size:16px}
.fv .smsh b{font-size:15px}
.fv .smsh small{color:#6b7385;font-size:12px}
.fv .smsb{align-self:flex-start;max-width:84%;background:#e9e9eb;border-radius:18px 18px 18px 6px;padding:10px 14px;font-size:15px;line-height:1.4}
.fv .smsb .lk{color:#1d5fd1;font-weight:700;text-decoration:underline}
.fv .smsb.me{align-self:flex-end;background:#1f6feb;color:#fff;border-radius:18px 18px 6px 18px}
.fv .smsl{align-self:flex-start;width:80%;border-radius:14px;overflow:hidden;background:#f1f2f5;box-shadow:0 0 0 1px #e3e5ea}
.fv .smsin{border:1px solid #dfe2ea;border-radius:999px;padding:10px 16px;color:#9aa0ab;font-size:14px}
.fv .ph4{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.fv .ph4 span{height:86px;border-radius:10px;position:relative;overflow:hidden}
.fv .ph4 .b1{background:linear-gradient(160deg,#8a8f86,#5d625a)}
.fv .ph4 .b2{background:linear-gradient(170deg,#9b8a72,#6f604d)}
.fv .ph4 .b3{background:linear-gradient(150deg,#7a7f88,#4f545c)}
.fv .ph4 .a1{background:linear-gradient(160deg,#f1ede4 0 45%,#c9b89c 45%)}
.fv .ph4 .a2{background:radial-gradient(circle at 50% 30%,#fff7d6 0 12%,transparent 13%),linear-gradient(170deg,#ece7dd,#b7a98f)}
.fv .ph4 .a3{background:linear-gradient(150deg,#f4f1ea,#cfc4b2)}
.fv .ph4 span::after{content:"";position:absolute;left:6px;bottom:6px;width:16px;height:4px;border-radius:2px;background:rgba(255,255,255,.8)}
.fv .big svg{width:20px;height:20px;flex:0 0 20px}

/* ---------- Assistant + Confirm card on the laptop (1120 x 700 app) ---------- */
.asst{position:absolute;top:0;right:0;bottom:0;width:470px;background:#fff;border-left:1px solid #e3e6ec;box-shadow:-30px 0 60px -30px rgba(15,23,42,.35);display:flex;flex-direction:column;z-index:3;font-size:14px}
.app .dimmer{position:absolute;inset:0;background:rgba(16,24,40,.28);z-index:2}
.asst .ah{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid #eceef2}
.asst .ah .ic,.aside2 .ic{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,#5b5bf0,#7b4fd6);display:grid;place-items:center;color:#fff;flex:0 0 38px}
.asst .ah .ic svg,.aside2 .ic svg{width:18px;height:18px}
.asst .ah b{display:block;font-size:15.5px}
.asst .ah small{color:#6b7385;font-size:12px}
.vchip{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#1d5fd1;background:#e5eefc;border-radius:8px;padding:6px 9px}
.vchip i{display:flex;gap:2px;align-items:center;height:12px}
.vchip i b{width:2px;height:60%;background:currentColor;border-radius:2px;animation:vpbar .9s ease-in-out infinite}
.vchip i b:nth-child(2){animation-delay:-.3s}.vchip i b:nth-child(3){animation-delay:-.6s}
.cv2{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:10px;padding:14px 18px}
.ub{align-self:flex-end;background:#1f6feb;color:#fff;border-radius:16px 16px 4px 16px;padding:9px 14px;font-weight:600;max-width:82%;min-height:1.4em}
.thk{font-size:12px;color:#6b7385;display:flex;gap:6px;align-items:center}
.thk::before{content:"";width:12px;height:12px;border-radius:50%;border:2px solid #c7cbd4;border-top-color:#5b5bf0;animation:orbSpin .9s linear infinite}
.thk.done::before{animation:none;border-color:#c7cbd4}
.bb{align-self:flex-start;background:#fff;border:1px solid #e6e8ee;border-radius:16px 16px 16px 4px;padding:10px 14px;line-height:1.5;max-width:92%;color:#1d2433}
.bb a,.lnk{color:#1d5fd1;font-weight:600;text-decoration:underline;text-underline-offset:2px}
.bb table{width:100%;border-collapse:collapse;margin:8px 0 4px;font-size:12.5px}
.bb th{text-align:left;color:#8a91a1;font-size:10.5px;letter-spacing:.08em;padding:4px 0}
.bb td{padding:5px 0;border-top:1px solid #f0f1f4}
.bb td:nth-child(2){font-weight:700;font-variant-numeric:tabular-nums}
.chips2{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.chips2 span{font-size:12px;font-weight:600;border:1px solid #dfe2ea;border-radius:999px;padding:5px 10px;color:#2c3446;background:#fff}
.cfm{border:1px solid #e3e6ec;border-top:3px solid #1f6feb;border-radius:14px;background:#fff;padding:14px 16px;box-shadow:0 18px 40px -24px rgba(15,23,42,.45);transform:translateY(24px);opacity:0;transition:transform .6s var(--ease),opacity .45s var(--ease)}
.cfm.show{transform:none;opacity:1}
.cfm .ch{display:flex;align-items:center;gap:10px;font-weight:700;font-size:14.5px}
.cfm .ch .ei{width:28px;height:28px;border-radius:8px;background:#e5eefc;color:#1d5fd1;display:grid;place-items:center}
.cfm .ch .ei svg{width:15px;height:15px}
.cfm .wt{margin-left:auto;font-size:11px;font-weight:700;color:#8a5b00;background:#fff3d6;border-radius:999px;padding:3px 9px}
.cfm .wt.ok{color:#1f7a45;background:#e3f5ea}
.cfm .to{font-size:12px;color:#6b7385;margin:6px 0 8px 38px}
.cfm .pv{background:#f7f8fa;border-radius:10px;padding:10px 12px;font-size:12.5px;line-height:1.5;color:#2c3446}
.cfm .att{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-size:12px;font-weight:600;border:1px solid #e3e6ec;border-radius:8px;padding:4px 9px}
.cfm .att::before{content:"";width:10px;height:12px;border-radius:2px;background:#e0413a}
.cfm .acts2{display:flex;align-items:center;gap:8px;margin-top:10px}
.cfm .go{display:inline-flex;align-items:center;gap:8px;background:#1f6feb;color:#fff;font-weight:700;font-size:13.5px;border-radius:10px;padding:9px 16px;transition:background .3s,transform .2s}
.cfm .go svg{width:14px;height:14px}
.cfm .go.pulse{animation:glowB 1.4s ease-out infinite}
.cfm .go.sent{background:#1f7a45}
@keyframes glowB{0%{box-shadow:0 0 0 0 rgba(31,111,235,.55)}100%{box-shadow:0 0 0 12px rgba(31,111,235,0)}}
.cfm .ed{border:1px solid #dfe2ea;border-radius:10px;padding:8px 12px;font-weight:600;font-size:13px}
.cfm .cx{font-size:13px;color:#4b5467;padding:8px 6px}
.cfm .nb2{font-size:11.5px;color:#6b7385;margin-top:8px}
.ain{margin:0 18px 6px;border:1px solid #dfe2ea;border-radius:14px;padding:10px 10px 10px 14px;display:flex;align-items:center;gap:10px;color:#8a91a1;font-size:13px}
.ain > svg{width:15px;height:15px;flex:0 0 15px}
.ain .mic{margin-left:auto;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#5b5bf0,#7b4fd6);display:grid;place-items:center;color:#fff}
.ain .mic svg{width:15px;height:15px}
.afoot{font-size:11px;color:#8a91a1;text-align:center;padding:0 18px 10px}
/* full-page Assistant (story step 4) */
.aside2{width:220px;border-right:1px solid #eceef2;padding:16px 14px;display:flex;flex-direction:column;gap:2px;font-size:13px;background:#fff}
.aside2 .lbl{margin:6px 6px 6px}
.aside2 .it{padding:8px 10px;border-radius:9px;color:#2c3446;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aside2 .it.on{background:#eef3fd;color:#1d5fd1;font-weight:600}
/* Do it for me */
.dofm{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#a8530f,#6d3bd1);color:#fff;font-weight:700;font-size:13.5px;border-radius:10px;padding:9px 14px;position:relative}
.dofm svg{width:15px;height:15px}
.menu4{position:absolute;right:0;top:calc(100% + 8px);width:300px;background:#fff;border:1px solid #e3e6ec;border-radius:14px;box-shadow:0 24px 50px -20px rgba(15,23,42,.45);padding:6px;color:#1d2433;font-weight:500;opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top right;transition:all .35s var(--ease);z-index:4}
.menu4.show{opacity:1;transform:none}
.menu4 div{padding:9px 11px;border-radius:9px;font-size:13.5px}
.menu4 div b{display:block;font-weight:700}
.menu4 div small{color:#6b7385;font-size:12px}
.menu4 div.hl{background:#f3f0fd}
.tiles4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.tiles4 .card{padding:14px 16px}
.tiles4 .v{font:800 25px/1.1 Inter,"Segoe UI",sans-serif;margin:6px 0 4px;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.tiles4 small{color:#6b7385;font-size:12.5px}
.tiles4 .pr{background:#fffaf0;border-color:#f3dfb4}
.tiles4 .pct{display:inline-block;font-size:12px;font-weight:700;color:#8a5b00;background:#fff0c7;border-radius:999px;padding:2px 8px}
.stagebar{display:grid;grid-template-columns:repeat(6,1fr);border:1px solid #e6e8ee;border-radius:12px;overflow:hidden;font-size:12.5px;font-weight:600;background:#fff}
.stagebar span{padding:10px 10px;color:#4b5467;border-right:1px solid #f0f1f4}
.stagebar span.d{background:#e8f6ee;color:#1f7a45}
.stagebar span.now{background:#176457;color:#fff}
.stagebar span.now small{display:block;font-weight:500;opacity:.85}
.tabs7{display:flex;gap:18px;font-size:13.5px;color:#4b5467;border-bottom:1px solid #e6e8ee;padding-bottom:9px}
.tabs7 b{color:var(--t-ink);border-bottom:2px solid var(--t-ink);padding-bottom:8px}
.qline{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid #f0f1f4;font-size:13.5px}
.qline:first-child{border-top:0}
.qline small{display:block;color:#6b7385;font-size:12px}
.qline .opt2{font-size:10.5px;font-weight:700;background:#fff3d6;color:#8a5b00;border-radius:999px;padding:2px 7px;margin-left:6px}
.qstat{display:flex;gap:6px;align-items:center}
.qstat span{font-size:11.5px;font-weight:700;border-radius:999px;padding:4px 9px;background:#eef0f4;color:#8a91a1;transition:all .4s}
.qstat span.on{background:#e3f5ea;color:#1f7a45}
.qstat span.cur{background:#5925CE;color:#fff}
.evrow{display:flex;gap:10px;align-items:center;font-size:12.5px;padding:7px 0;color:#2c3446;opacity:.35;transition:opacity .5s}
.evrow.on{opacity:1}
.evrow i{width:8px;height:8px;border-radius:50%;background:#5925CE;flex:0 0 8px}

@media (prefers-reduced-motion:reduce){
  .orb::before,.orb.glow,.vchip i b,.fv .wave i,.thk::before,.cfm .go.pulse,.fv .live::before,.fv .vdock .st::before{animation:none}
  .fv .sig path{animation:none;stroke-dashoffset:0}
  .cfm{transition:none}
}
