:root{
  --navy:#0E3B32; --navy2:#13493E; --orange:#008C6A; --orange-d:#006B51; --tint:#E7F5F0; --yel:#FFD21D;
  --ink:#1E2A30; --slate:#66727A; --line:#E3E6EA; --bg:#F3F5F7; --card:#FFFFFF;
  --green:#1E8E5A; --green-t:#E5F5EC; --red:#C8402F; --red-t:#FBE9E6; --blue:#2463A6; --blue-t:#E7F0FA; --amber:#B7791F; --amber-t:#FFF6E0;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;background:var(--bg);color:var(--ink);font-size:14px;height:100vh;overflow:hidden}
button{font-family:inherit;cursor:pointer}
.app{display:grid;grid-template-columns:210px 1fr 300px;grid-template-rows:56px 64px 1fr;height:100vh}
/* top bar */
.top{grid-column:1/4;background:#fff;color:var(--ink);border-bottom:3px solid var(--yel);display:flex;align-items:center;padding:0 18px;gap:16px}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:16px;letter-spacing:.3px}
.brand .mk{width:30px;height:30px;border-radius:7px;background:var(--orange);display:grid;place-items:center;font-weight:800;color:#fff}
.brand small{display:block;font-weight:400;font-size:11px;opacity:.7;letter-spacing:.2px}
.top .search{flex:1;max-width:300px;white-space:nowrap;overflow:hidden;margin-left:18px;background:#F1F4F3;border-radius:8px;padding:8px 12px;font-size:13px;color:var(--slate)}
.brand img{height:30px;display:block}.brand .sep{width:1px;height:28px;background:var(--line)}
.rolesel{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--slate);text-transform:uppercase;letter-spacing:.6px}.rolesel select{font-family:inherit;font-size:13px;font-weight:600;color:var(--ink);border:2px solid var(--orange);border-radius:8px;padding:6px 8px;background:#fff;text-transform:none;letter-spacing:0}
.app.noside{grid-template-columns:210px 1fr}.app.noside .side{display:none}
.rolebanner{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--ink)}.rolebanner b{color:var(--orange-d)}
.nav .built{margin:14px 6px 0;padding:10px;border-top:1px solid var(--line);font-size:10.5px;color:var(--slate)}.nav .built img{height:22px;display:block;margin-top:6px}
.top .spacer{flex:1}
.pill{font-size:11px;padding:4px 10px;border-radius:20px;background:var(--tint);color:var(--orange-d);font-weight:600;display:flex;align-items:center;gap:6px}
.pill .dot{width:7px;height:7px;border-radius:50%;background:#3DDC84}
.toggle{background:#fff;border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:6px 12px;font-size:12px}
.toggle.on{background:var(--orange);border-color:var(--orange);color:#fff}
.avatar{cursor:pointer;width:32px;height:32px;border-radius:50%;background:var(--orange);color:#fff;display:grid;place-items:center;font-weight:700;font-size:12px}
/* stepper */
.stepper{grid-column:1/4;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 18px;gap:6px}
.stepper .lbl{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--orange);margin-right:10px;white-space:nowrap}
.step{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;border:1px solid transparent;background:none;color:var(--slate);font-size:12.5px;white-space:nowrap}
.step .n{width:24px;height:24px;border-radius:50%;border:2px solid #C9CFD4;display:grid;place-items:center;font-weight:700;font-size:11px;background:#fff}
.step.done{color:var(--ink)} .step.done .n{background:var(--green);border-color:var(--green);color:#fff}
.step.active{background:var(--tint);border-color:#B9E2D5;color:var(--ink);font-weight:600} .step.active .n{border-color:var(--orange);background:var(--orange);color:#fff}
.chev{color:#C9CFD4;font-size:12px}
.nextbtn{margin-left:auto;background:var(--orange);color:#fff;border:none;border-radius:9px;padding:9px 16px;font-weight:600;font-size:13px;white-space:nowrap}
.nextbtn:disabled{background:#C9CFD4}
.resetbtn{background:none;border:1px solid var(--line);border-radius:9px;padding:8px 12px;font-size:12px;color:var(--slate);margin-left:8px}
/* nav */
.nav{background:#fff;border-right:1px solid var(--line);padding:14px 10px;overflow:auto}
.nav h6{font-size:10px;letter-spacing:1.8px;color:var(--slate);margin:10px 10px 6px}
.nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:13.5px;cursor:pointer}
.nav a:hover{background:var(--bg)}
.nav a.on{background:var(--navy);color:#fff}
.nav a .ic{width:18px;text-align:center;opacity:.8}
.nav .badge{margin-left:auto;background:var(--orange);color:#fff;font-size:10px;border-radius:10px;padding:1px 7px}
.nav .src{margin:18px 6px 0;padding:12px;border-radius:10px;background:var(--bg);font-size:11.5px;color:var(--slate);line-height:1.55}
.nav .src b{color:var(--ink)}
/* main */
.main{overflow:auto;padding:20px 22px 40px}
.view{display:none;animation:fade .25s ease}
.view.on{display:block}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.vh{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:14px;gap:12px}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:2.4px;color:var(--orange);text-transform:uppercase}
h1{font-size:22px;font-weight:700;margin-top:2px}
.sub{color:var(--slate);font-size:13px;margin-top:3px}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.g21{grid-template-columns:2fr 1fr}.g12{grid-template-columns:1fr 2fr}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px}
.card h3{font-size:14px;font-weight:600;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.card h3 .tag{margin-left:auto}
.kpi .v{font-size:24px;font-weight:700;margin-top:4px}
.kpi .l{font-size:11.5px;color:var(--slate);text-transform:uppercase;letter-spacing:.8px}
.kpi .d{font-size:12px;margin-top:4px}
.up{color:var(--green)}.dn{color:var(--red)}
.tag{font-size:11px;padding:3px 9px;border-radius:20px;font-weight:600;white-space:nowrap;display:inline-block}
.t-or{background:var(--tint);color:var(--orange-d)}.t-gr{background:var(--green-t);color:var(--green)}.t-rd{background:var(--red-t);color:var(--red)}.t-bl{background:var(--blue-t);color:var(--blue)}.t-am{background:var(--amber-t);color:var(--amber)}.t-gy{background:#EEF0F2;color:var(--slate)}
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;font-size:11px;letter-spacing:.6px;text-transform:uppercase;color:var(--slate);font-weight:600;padding:8px;border-bottom:1px solid var(--line)}
td{padding:9px 8px;border-bottom:1px solid #F0F2F4}
tr.sel td{background:var(--tint)}
tr.click{cursor:pointer} tr.click:hover td{background:#FAFBFC}
.ai{background:linear-gradient(135deg,#F0FAF6 0%,#FFFFFF 70%);border:1px solid #B9E2D5}
.ai h3::before{content:"✦";color:var(--orange);font-size:15px}
.row{display:flex;gap:10px;align-items:center}
.btn{border:none;border-radius:8px;padding:9px 14px;font-weight:600;font-size:13px}
.btn.p{background:var(--orange);color:#fff}.btn.s{background:#fff;border:1px solid var(--line);color:var(--ink)}.btn.g{background:var(--green);color:#fff}.btn.n{background:var(--navy);color:#fff}
.btn:disabled{opacity:.45;cursor:not-allowed}
.field{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--slate)}
.field .val{font-size:13.5px;color:var(--ink);background:var(--bg);border-radius:8px;padding:8px 10px;border:1px solid var(--line)}
.score{width:86px;height:86px;border-radius:50%;display:grid;place-items:center;font-size:26px;font-weight:800;color:var(--green);background:conic-gradient(var(--green) 0 87%, #E6ECEF 87% 100%);position:relative}
.score::after{content:"";position:absolute;inset:9px;background:#fff;border-radius:50%}
.score span{position:relative;z-index:1}
.bar{height:8px;background:#EDF0F2;border-radius:5px;overflow:hidden}.bar i{display:block;height:100%;background:var(--orange);border-radius:5px}
.list li{list-style:none;padding:8px 0;border-bottom:1px dashed var(--line);font-size:13px;display:flex;gap:10px;align-items:flex-start}
.list li:last-child{border:none}
.chk{width:20px;height:20px;border-radius:50%;border:2px solid #C9CFD4;flex:none;display:grid;place-items:center;font-size:11px;color:#fff;margin-top:1px;transition:.3s}
.chk.ok{background:var(--green);border-color:var(--green)}
.chk.spin{border-color:var(--orange);border-top-color:transparent;animation:sp .8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
/* pipeline */
.kan{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.col{background:#EBEEF1;border-radius:12px;padding:10px;min-height:380px}
.col h4{font-size:12px;letter-spacing:.6px;text-transform:uppercase;color:var(--slate);display:flex;justify-content:space-between;margin:2px 4px 10px}
.deal{background:#fff;border-radius:10px;padding:10px 11px;margin-bottom:8px;border:1px solid var(--line);font-size:12.5px;cursor:pointer;transition:.2s}
.deal:hover{box-shadow:0 3px 10px rgba(0,0,0,.07)}
.deal b{display:block;font-size:13px}
.deal .m{display:flex;justify-content:space-between;color:var(--slate);margin-top:5px;font-size:12px}
.deal.hl{border:2px solid var(--orange);box-shadow:0 0 0 4px rgba(0,140,106,.15)}
/* inventory pick */
.unit{border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;align-items:center;gap:12px;cursor:pointer;margin-bottom:8px;background:#fff}
.unit.on{border:2px solid var(--orange);background:var(--tint)}
.unit .ico{width:42px;height:42px;border-radius:9px;background:var(--bg);display:grid;place-items:center}
.opt{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #F0F2F4;font-size:13px}
.opt input{accent-color:var(--orange);width:16px;height:16px}
.opt span.p{margin-left:auto;font-weight:600}
input[type=range]{width:100%;accent-color:var(--orange)}
.sum td{border:none;padding:5px 0}.sum td:last-child{text-align:right;font-weight:600}
.sum tr.tot td{border-top:2px solid var(--ink);padding-top:9px;font-size:16px}
.gauge{font-size:30px;font-weight:800}
.warn{background:var(--amber-t);border:1px solid #F1D48B;color:#7A5410;padding:10px 12px;border-radius:10px;font-size:12.5px;display:flex;gap:8px}
.okbox{background:var(--green-t);border:1px solid #A9DDC0;color:#155B3B;padding:10px 12px;border-radius:10px;font-size:12.5px;display:flex;gap:8px}
/* timeline */
.side{background:#fff;border-left:1px solid var(--line);overflow:auto;padding:16px}
.side h5{font-size:11px;letter-spacing:2px;color:var(--orange);font-weight:700;margin-bottom:10px}
.tl{position:relative;padding-left:18px}
.tl::before{content:"";position:absolute;left:5px;top:4px;bottom:4px;width:2px;background:var(--line)}
.ev{position:relative;margin-bottom:13px;font-size:12.5px;animation:fade .4s}
.ev::before{content:"";position:absolute;left:-17px;top:4px;width:10px;height:10px;border-radius:50%;background:var(--ev,#9AA5AD);border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
.ev b{display:block;font-size:12.5px}
.ev small{color:var(--slate);font-size:11.5px;display:block;margin-top:1px}
.ev .sys{font-size:10.5px;color:var(--blue);font-weight:600;margin-top:2px;display:block}
.empty{color:var(--slate);font-size:12.5px;font-style:italic}
/* architecture overlay */
.arch{display:none;margin-top:16px;border:2px dashed var(--orange);border-radius:12px;padding:12px 14px;background:#fff}
body.archon .arch{display:block}
.arch .t{font-size:11px;font-weight:700;letter-spacing:2px;color:var(--orange);margin-bottom:8px}
.arch .chips{display:flex;flex-wrap:wrap;gap:8px}
.arch .chip{font-size:12px;border-radius:8px;padding:7px 10px;background:var(--navy);color:#fff}
.arch .chip i{font-style:normal;color:#FFD21D;font-weight:600}
.arch p{font-size:12px;color:var(--slate);margin-top:8px}
/* assistant */
.ask{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ask button{border:1px solid #B9E2D5;background:#fff;border-radius:16px;padding:5px 11px;font-size:12px;color:var(--orange-d)}
.ans{margin-top:10px;font-size:13px;line-height:1.55;background:#fff;border-radius:10px;padding:10px 12px;border:1px solid var(--line);display:none}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(30px);background:var(--navy);color:#fff;padding:11px 18px;border-radius:10px;font-size:13px;opacity:0;transition:.35s;z-index:99;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.toast.on{opacity:1;transform:translateX(-50%)}
.demo-flag{position:fixed;bottom:8px;right:310px;font-size:10.5px;color:var(--slate);background:rgba(255,255,255,.85);padding:3px 8px;border-radius:6px}
.mini{font-size:11.5px;color:var(--slate)}
.svgic{width:22px;height:22px;stroke:var(--navy);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.hide{display:none}
.mapbox{height:150px;border-radius:10px;background:#E9EEF1;position:relative;overflow:hidden}
.mapbox .p{position:absolute;width:12px;height:12px;border-radius:50%;background:var(--navy);border:2px solid #fff;transform:translate(-50%,-50%)}
.mapbox .p.me{background:var(--orange);width:16px;height:16px;box-shadow:0 0 0 6px rgba(0,140,106,.25)}
.mapbox .lb{position:absolute;font-size:10.5px;color:var(--ink);transform:translate(8px,-50%);white-space:nowrap}

.modesw{display:flex;background:#EEF1F3;border-radius:10px;padding:4px;gap:4px}.modesw button{white-space:nowrap;border:none;background:none;padding:7px 12px;border-radius:7px;font-size:12.5px;font-weight:600;color:var(--slate)}.modesw button.on{background:#fff;color:var(--orange-d);box-shadow:0 1px 3px rgba(0,0,0,.1)}
.chatwrap{background:#fff;border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;height:calc(100vh - 260px);min-height:520px;overflow:hidden}
.chhd{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line);background:#F7F9F8}.chhd .bi{width:34px;height:34px;border-radius:9px;background:var(--orange);display:grid;place-items:center;font-size:17px}
.chmsgs{flex:1;overflow:auto;padding:14px 16px;background:#FAFBFC}
.fm{margin-bottom:12px;max-width:94%;animation:fade .3s}.fm.u{margin-left:auto;background:var(--navy);color:#fff;padding:8px 13px;border-radius:13px 13px 2px 13px;width:fit-content;max-width:75%;font-size:13.5px}
.fm.b{background:#fff;border:1px solid var(--line);border-radius:13px 13px 13px 2px;padding:11px 13px;font-size:13.2px;line-height:1.5}
.fm.b.old{background:#F3F3F3;border-color:#DDD;color:#444;font-family:Consolas,Menlo,monospace;font-size:12.5px}
.fm.b table{margin-top:8px;font-size:12.3px}.fm.b td,.fm.b th{padding:6px 6px}
.fm .acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}.fm .acts button{border:1px solid #B9E2D5;background:#F0FAF6;color:#006B51;border-radius:7px;padding:5px 10px;font-size:12px;font-weight:600}
.fm .acts button:disabled{background:#E5F5EC;color:#1E8E5A;border-color:#A9DDC0}
.fm .src{font-size:10.5px;color:var(--blue);margin-top:7px}
.fit{display:inline-block;min-width:38px;text-align:center;font-weight:700;font-size:11px;border-radius:10px;padding:1px 6px;background:var(--green-t);color:var(--green)}
.chsugg{display:flex;flex-wrap:wrap;gap:6px;padding:9px 14px 0;border-top:1px solid var(--line)}.chsugg button{border:1px solid #B9E2D5;background:#fff;border-radius:15px;padding:5px 10px;font-size:11.8px;color:var(--orange-d)}
.chinp{display:flex;gap:8px;padding:10px 14px}.chinp input{flex:1;border:1px solid var(--line);border-radius:9px;padding:10px 12px;font-size:13.5px;font-family:inherit}.chinp button{background:var(--orange);color:#fff;border:none;border-radius:9px;padding:0 16px;font-weight:600}
.fmap{height:250px;border-radius:10px;background:#E9EEF1;position:relative;overflow:hidden;background-image:linear-gradient(#DCE3E6 1px,transparent 1px),linear-gradient(90deg,#DCE3E6 1px,transparent 1px);background-size:30px 30px;transition:.3s}
.fmap.dim{filter:grayscale(1);opacity:.45}
.fmap .br{position:absolute;transform:translate(-50%,-50%);font-size:10px;color:var(--slate);font-weight:600;white-space:nowrap}
.fmap .br::before{content:"";display:block;width:8px;height:8px;background:var(--navy);margin:0 auto 2px;border-radius:2px}
.fmap .u{position:absolute;width:13px;height:13px;border-radius:50%;border:2px solid #fff;transform:translate(-50%,-50%);box-shadow:0 1px 3px rgba(0,0,0,.3);cursor:pointer;transition:.3s}
.fmap .u.hl{width:20px;height:20px;box-shadow:0 0 0 7px rgba(255,210,29,.55);z-index:2}
.fmap .site{position:absolute;transform:translate(-50%,-50%);font-size:9.5px;color:#7A6200;background:#FFF6CC;border:1px solid #F3DD7A;border-radius:5px;padding:1px 5px;white-space:nowrap}
.fmap .note{position:absolute;inset:auto 8px 8px auto;font-size:10px;color:var(--slate);background:rgba(255,255,255,.8);padding:2px 6px;border-radius:5px}
i.lg{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:4px;vertical-align:-1px}
#login{position:fixed;inset:0;z-index:200;display:grid;grid-template-columns:1.05fr 1fr;background:#fff;font-family:"Segoe UI",system-ui,Arial,sans-serif}
#login.hide{display:none}
.lg-left{background:#0E3B32;color:#fff;position:relative;overflow:hidden;padding:48px 56px;display:flex;flex-direction:column}
.lg-left .grid{position:absolute;inset:0;background-image:linear-gradient(#1E5246 1px,transparent 1px),linear-gradient(90deg,#1E5246 1px,transparent 1px);background-size:44px 44px;opacity:.55}
.lg-left>*{position:relative}
.lg-left .eb{font-size:12px;font-weight:700;letter-spacing:3px;color:#FFD21D}
.lg-left h2{font-size:38px;line-height:1.15;font-weight:700;margin-top:14px;max-width:520px}
.lg-left h2 span{color:#FFD21D}
.lg-left p{font-size:15px;color:#B9E2D5;margin-top:14px;max-width:480px;line-height:1.55}
.lg-left .feat{display:flex;gap:22px;margin-top:26px;flex-wrap:wrap}
.lg-left .feat div{font-size:13px;color:#fff;display:flex;align-items:center;gap:8px}
.lg-left .feat i{width:28px;height:28px;border-radius:50%;background:rgba(255,210,29,.15);color:#FFD21D;display:grid;place-items:center;font-style:normal;font-size:14px}
.lg-left svg.art{margin-top:auto;width:100%;max-width:560px;height:auto}
.lg-left .foot{display:flex;align-items:center;gap:10px;font-size:11.5px;color:#B9E2D5;margin-top:18px}
.lg-left .foot span.chip{background:#fff;border-radius:8px;padding:5px 9px;display:inline-flex}
.lg-left .foot img{height:20px}
.lg-right{display:flex;align-items:center;justify-content:center;background:#F7F9F8;padding:30px}
.lg-card{width:100%;max-width:430px;background:#fff;border:1px solid #E3E6EA;border-radius:16px;padding:34px 34px 26px;box-shadow:0 12px 40px rgba(14,59,50,.08)}
.lg-card .lgo{height:40px;display:block}
.lg-card h3{font-size:22px;font-weight:700;margin-top:22px;color:#1E2A30}
.lg-card .s{font-size:13px;color:#66727A;margin-top:4px}
.msbtn{width:100%;margin-top:22px;display:flex;align-items:center;justify-content:center;gap:12px;background:#fff;border:1px solid #8C8C8C;border-radius:6px;padding:11px;font-size:15px;font-weight:600;color:#5E5E5E;cursor:pointer;font-family:inherit}
.msbtn:hover{background:#F3F3F3}
.lg-div{display:flex;align-items:center;gap:10px;margin:20px 0 14px;font-size:11.5px;color:#66727A;text-transform:uppercase;letter-spacing:1px}
.lg-div::before,.lg-div::after{content:"";flex:1;height:1px;background:#E3E6EA}
.lg-card label{font-size:12px;color:#66727A;font-weight:600}
.lg-in{width:100%;margin-top:6px;border:1px solid #CBD2D6;border-radius:9px;padding:11px 13px;font-size:15px;font-family:inherit;outline:none}
.lg-in:focus{border-color:#008C6A;box-shadow:0 0 0 3px rgba(0,140,106,.15)}
.lg-btn{width:100%;margin-top:12px;background:#008C6A;color:#fff;border:none;border-radius:9px;padding:12px;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit}
.lg-btn:disabled{opacity:.5;cursor:not-allowed}
.lg-btn.ghost{background:#fff;color:#008C6A;border:1px solid #B9E2D5}
.otp{display:flex;gap:8px;margin-top:10px}
.otp input{width:48px;height:56px;text-align:center;font-size:22px;font-weight:700;border:1px solid #CBD2D6;border-radius:10px;font-family:inherit;outline:none}
.otp input:focus{border-color:#008C6A;box-shadow:0 0 0 3px rgba(0,140,106,.15)}
.otp.err input{border-color:#C8402F;animation:shake .3s}
@keyframes shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.lg-err{color:#C8402F;font-size:12.5px;margin-top:8px;min-height:16px}
.lg-hint{background:#FFF6CC;border:1px solid #F3DD7A;border-radius:9px;padding:9px 11px;font-size:12.5px;color:#5A4700;margin-top:12px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.lg-hint button{border:none;background:#0E3B32;color:#fff;border-radius:6px;padding:5px 9px;font-size:12px;cursor:pointer;font-family:inherit}
.lg-link{background:none;border:none;color:#008C6A;font-weight:600;font-size:13px;cursor:pointer;padding:0;font-family:inherit}
.lg-demo{margin-top:18px;border-top:1px dashed #E3E6EA;padding-top:12px}
.lg-demo .t{font-size:10.5px;letter-spacing:1.5px;font-weight:700;color:#66727A}
.lg-demo .chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.lg-demo button{border:1px solid #B9E2D5;background:#F0FAF6;color:#006B51;border-radius:14px;padding:4px 10px;font-size:11.5px;cursor:pointer;font-family:inherit}
.lg-legal{font-size:11px;color:#8A949A;margin-top:16px;text-align:center}
.spin2{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;display:inline-block;animation:sp .8s linear infinite;vertical-align:-4px}
/* Microsoft modal */
#ms{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:300;display:none;align-items:center;justify-content:center}
#ms.on{display:flex}
.msbox{width:440px;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.2);padding:44px;font-family:"Segoe UI",Arial,sans-serif;min-height:380px;position:relative}
.msbox .mslogo{display:flex;align-items:center;gap:8px;font-size:15px;color:#5E5E5E;font-weight:600}
.msbox h4{font-size:24px;font-weight:600;color:#1B1B1B;margin:16px 0 4px}
.msbox .org{font-size:13px;color:#1B1B1B;margin-bottom:14px}
.acct{display:flex;align-items:center;gap:12px;padding:11px 8px;cursor:pointer;border-bottom:1px solid #EEE}
.acct:hover{background:#F2F2F2}
.acct .av{width:40px;height:40px;border-radius:50%;background:#E7F5F0;color:#006B51;display:grid;place-items:center;font-weight:700;font-size:14px}
.acct b{display:block;font-size:14px;font-weight:600;color:#1B1B1B}
.acct small{font-size:12.5px;color:#5E5E5E}
.acct .r{margin-left:auto;font-size:11px;color:#006B51;background:#E7F5F0;border-radius:10px;padding:2px 8px}
.msbox .back{font-size:13px;color:#0067B8;cursor:pointer;margin-top:16px;display:inline-block;background:none;border:none;padding:0;font-family:inherit}
.mfa{text-align:center;padding-top:10px}
.mfa .num{font-size:52px;font-weight:600;color:#1B1B1B;margin:14px 0}
.mfa p{font-size:14px;color:#1B1B1B;line-height:1.5}
.msbar{position:absolute;left:0;right:0;top:0;height:3px;overflow:hidden}
.msbar i{display:block;height:3px;width:30%;background:#0067B8;animation:msb 1.2s infinite linear}
@keyframes msb{from{margin-left:-30%}to{margin-left:100%}}
/* user menu */
.umenu{position:fixed;top:54px;right:14px;width:290px;background:#fff;border:1px solid #E3E6EA;border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.12);z-index:150;display:none;padding:14px}
.umenu.on{display:block}
.umenu .n{font-weight:700;font-size:14px}.umenu .e{font-size:12px;color:#66727A}
.umenu .m{font-size:11.5px;background:#E7F5F0;color:#006B51;border-radius:8px;padding:6px 8px;margin:10px 0;line-height:1.5}
.umenu button{width:100%;text-align:left;border:none;background:none;padding:8px 6px;border-radius:7px;font-size:13px;cursor:pointer;font-family:inherit}
.umenu button:hover{background:#F3F5F7}