/* N06 Managed AI Monitoring — health monitor */
.page-mm main>section{overflow-x:clip}
.mono{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--p3)}
.crumbs{display:flex;flex-wrap:wrap;gap:10px;font-size:14px;color:var(--mut);margin-bottom:22px}
.crumbs a:hover{color:var(--p3)}.crumbs b{color:var(--p3);font-weight:600}
:root{--okg:#1c9d61;--okb:#e6f7ee;--amb:#c97a00;--ambb:#fff4e0;--redc:#d9435f;--redb:#fdecef;--mint:#22c38a}

/* hero */
.mm-hero{position:relative;padding:60px 0 0;background:radial-gradient(620px 440px at 75% 55%,#e3f7ee,transparent 70%),linear-gradient(180deg,#fff,var(--lav2));overflow:hidden}
.ecg{position:absolute;left:0;right:0;top:46%;width:100%;height:120px;pointer-events:none;opacity:.5}
.ecg path{fill:none;stroke:var(--mint);stroke-width:2.5;stroke-dasharray:1800;stroke-dashoffset:1800;animation:ecgRun 5s linear infinite}
@keyframes ecgRun{0%{stroke-dashoffset:1800}70%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
.mm-hin{position:relative;display:grid;grid-template-columns:1.08fr .92fr;gap:24px;align-items:end}
.mm-hin>*{min-width:0}
.mm-copy{padding-bottom:90px}
.mm-h1{font-size:clamp(32px,3.6vw,52px);margin:18px 0 22px}
.qv,.cv{position:relative;display:inline-block}
.qv:after,.cv:after{content:"";position:absolute;left:0;right:0;bottom:-.02em;height:.12em;border-radius:3px;transform:scaleX(0);transform-origin:left;animation:impIn3 .6s var(--ease) forwards}
.qv:after{background:var(--mint);animation-delay:1.1s}.cv:after{background:#f0a020;animation-delay:1.4s}
@keyframes impIn3{to{transform:scaleX(1)}}
.qv:before,.cv:before{content:"";position:absolute;top:-.02em;right:-.22em;width:.2em;height:.2em;border-radius:50%;opacity:0;animation:blinkD 1.6s 1.8s infinite}
.qv:before{background:var(--mint)}.cv:before{background:#f0a020;animation-delay:2.1s}
@keyframes blinkD{0%,100%{opacity:0}40%,60%{opacity:1}}
.mm-vis{position:relative;min-height:620px;display:flex;justify-content:flex-end;align-items:flex-end}
.mm-eagle{position:relative;width:auto;height:590px;max-width:86%;object-fit:contain}
.dash{position:absolute;left:-20px;bottom:40px;z-index:2;width:260px;padding:14px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:0 22px 44px rgba(60,60,120,.18);opacity:0;animation:fadeUp .6s var(--ease) 1.1s forwards}
.dr{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:13px;font-weight:600;color:var(--mut)}
.dr b{font-size:11.5px;font-weight:800;padding:3px 8px;border-radius:8px}
.on-ok{background:var(--okb);color:var(--okg)}
.dn{background:var(--ambb);color:var(--amb)}
.sp{display:block;width:100%;height:28px;margin-top:4px}
.sp path{fill:none;stroke-width:2.5;stroke-dasharray:260;stroke-dashoffset:260;animation:spDraw 1.4s var(--ease) forwards}
.sp-ok path{stroke:var(--mint);animation-delay:1.5s}.sp-dn path{stroke:#f0a020;animation-delay:2s}
@keyframes spDraw{to{stroke-dashoffset:0}}
.alert{margin-top:10px;padding:8px 10px;border-radius:10px;background:var(--redb);color:#a62a44;font-size:12.5px;font-weight:800;display:flex;gap:8px;align-items:center;opacity:0;animation:fadeIn .4s 3.2s forwards}
.alert:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--redc);animation:pulse 1.6s infinite}

/* monitor */
.mo-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:28px}
.mons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.mon{padding:18px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh)}
.mon svg{display:block;width:100%;height:44px;margin-bottom:10px;border-radius:10px;background:var(--lav2)}
.mon path{fill:none;stroke:var(--p);stroke-width:2.5;stroke-dasharray:200;stroke-dashoffset:200;transition:stroke-dashoffset 1.4s var(--ease);transition-delay:calc(.3s + var(--k)*.12s)}
.mon.vis path{stroke-dashoffset:0}
.mon:nth-child(3) path{stroke:#f0a020}.mon:nth-child(4) path{stroke:var(--redc)}.mon:nth-child(6) path{stroke:var(--mint)}
.mon b{display:block;font-size:17px}.mon span{font-size:14px;color:var(--mut)}
.vs{display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:center;margin-top:26px}
.vs-a,.vs-b{padding:20px;border-radius:18px;border:1px solid var(--line)}
.vs-a{background:var(--okb);border-color:#bfe8d3}.vs-b{background:var(--ambb);border-color:#f1d9a8}
.vs-a b,.vs-b b{display:block;font-size:16px;margin:6px 0 12px}
.vs-a i,.vs-b i{display:block;height:10px;border-radius:5px;background:rgba(0,0,0,.06);position:relative;overflow:hidden}
.vs-a i:after,.vs-b i:after{content:"";position:absolute;inset:0;border-radius:5px;transform-origin:left;transform:scaleX(0);transition:transform 1.2s var(--ease) .4s}
.bar-ok:after{background:var(--mint)}.bar-dn:after{background:#f0a020}
.vs.vis .bar-ok:after{transform:scaleX(1)}.vs.vis .bar-dn:after{transform:scaleX(.46)}
.vs-x{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#fff;font-size:28px;font-weight:800}
.vs-note{margin-top:16px;text-align:center;font-weight:600}
.vs-note small{display:block;font-weight:400;color:var(--mut);margin-top:4px}

/* eval */
.es-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.es-grid>*{min-width:0}
.trig{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.trig button{padding:10px 14px;border-radius:12px;border:1.5px solid var(--line);background:#fff;font:inherit;font-size:14px;font-weight:700;color:var(--mut);cursor:pointer;transition:.25s}
.trig button[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.cmp{padding:22px;border-radius:22px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh)}
.cmp-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.run-dot{width:10px;height:10px;border-radius:50%;background:#cfc6e2}
.cmp.running .run-dot{background:var(--p);animation:pulse 1s infinite}
.cmp-r{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:10px;align-items:center;padding:12px 4px;border-bottom:1px solid var(--line);font-size:14.5px}
.cmp-h{font-family:"JetBrains Mono",monospace;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--mut)}
.pv,.cv2{justify-self:start;padding:4px 10px;border-radius:9px;font-size:12.5px;font-weight:800}
.pv{background:var(--okb);color:var(--okg)}
.cv2{background:#f1eef7;color:#a39fb5;transition:.3s}
.cv2.pass{background:var(--okb);color:var(--okg);animation:popIn .35s cubic-bezier(.3,1.6,.5,1)}
.cv2.reg{background:var(--redb);color:var(--redc);animation:popIn .35s cubic-bezier(.3,1.6,.5,1)}
@keyframes popIn{from{transform:scale(.6)}}
.decision{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding:14px;border-radius:14px;background:var(--lav2)}
.dec{font-size:15px;padding:5px 12px;border-radius:10px;background:#f1eef7;color:var(--mut)}
.dec.hold{background:var(--ambb);color:var(--amb)}
.dec.rel{background:var(--okb);color:var(--okg)}
.cmp small{display:block;margin-top:10px;color:var(--mut);font-size:11.5px}

/* changes */
.ch-head{max-width:760px;margin-bottom:30px}
.vline{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:40px 0 70px}
.vline:before{content:"";position:absolute;left:8%;right:8%;top:48px;height:3px;background:var(--line)}
.vn{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;opacity:0;transform:translateY(10px);transition:.45s var(--ease);transition-delay:calc(.2s + var(--k)*.3s)}
.vline.vis .vn{opacity:1;transform:none}
.vdot{width:20px;height:20px;border-radius:50%;background:var(--p);border:4px solid #fff;box-shadow:0 0 0 2px var(--p);margin-bottom:10px}
.vn:nth-child(2) .vdot{background:var(--mint);box-shadow:0 0 0 2px var(--mint),0 0 0 8px rgba(34,195,138,.2)}
.vbad .vdot{background:#f0a020;box-shadow:0 0 0 2px #f0a020}
.vn b{font-size:17px}.vn small{font-size:13px;color:var(--mut);font-weight:600}
.vbad small{color:var(--amb)}
.rev{position:absolute;left:50%;width:34%;bottom:6px;height:60px;overflow:visible}
.rev path{fill:none;stroke:#f0a020;stroke-width:3;stroke-dasharray:400;stroke-dashoffset:400;transition:stroke-dashoffset 1s var(--ease) 1.3s}
.rev .ah{stroke-dasharray:40;stroke-dashoffset:40;transition-delay:2.2s;transition-duration:.3s}
.vline.vis .rev path{stroke-dashoffset:0}
.ctrl2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.ctrl2>div{padding:22px;border-radius:18px;background:var(--okb);border:1px solid #bfe8d3}
.ctrl2 .mono{color:#136b43}
.ctrl2 ul{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}
.ctrl2 li{padding:9px 12px;border-radius:10px;background:#fff;font-weight:700;font-size:14.5px}
.ctrl2 .vend{background:#f7f5fb;border:1.5px dashed #cfc6e2}
.ctrl2 .vend .mono{color:var(--mut)}
.ctrl2 .vend li{color:var(--mut)}
.vend p{margin:12px 0 0;font-size:14.5px;font-weight:600}

/* incidents */
.in-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center}
.in-grid>*{min-width:0}
.sla{display:flex;align-items:center;gap:18px;margin-top:20px;padding:18px;border-radius:16px;background:#fff;border:1px solid var(--line)}
.sla-n{position:relative;flex:none;font-size:30px;font-weight:800;color:#b9b3cc;letter-spacing:-.02em}
.sla-n:after{content:"";position:absolute;left:-6px;right:-6px;top:52%;height:4px;border-radius:2px;background:var(--redc);transform:scaleX(0) rotate(-8deg);transform-origin:left;transition:transform .5s var(--ease) .5s}
.sla.vis .sla-n:after{transform:scaleX(1) rotate(-8deg)}
.sla p{margin:0;font-weight:600;font-size:15px}
.irep{padding:22px;border-radius:22px;background:var(--ink);color:#fff;box-shadow:0 30px 60px rgba(23,22,52,.25)}
.ir-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.ir-top .mono{color:#c9b3ff}
.sev{padding:4px 10px;border-radius:9px;background:rgba(240,160,32,.18);color:#ffc15a;font-size:12px;font-weight:800}
.irf{display:grid;grid-template-columns:140px 1fr;gap:14px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.08);opacity:0;transform:translateX(-10px);transition:.45s var(--ease);transition-delay:calc(.3s + var(--k)*.4s)}
.irf:last-child{border-bottom:0}
.irep.vis .irf{opacity:1;transform:none}
.irf span{font-family:"JetBrains Mono",monospace;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:#a9a3cc;padding-top:2px}
.irf b{font-size:14.5px;font-weight:600}

/* report */
.rp-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.rp-grid>*{min-width:0}
.lgd{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.tg{display:inline-block;font-style:normal;padding:5px 11px;border-radius:10px;font-size:12.5px;font-weight:800;white-space:nowrap}
.tg.ms{background:var(--okb);color:var(--okg)}
.tg.es{background:var(--ambb);color:var(--amb);border:1px dashed #e8c07a}
.tg.mi{background:#f1eef7;color:var(--mut);border:1px dashed #cfc6e2}
.report{padding:24px;border-radius:6px;background:#fff;border:1px solid var(--line);box-shadow:0 24px 50px rgba(60,40,120,.14);border-top:6px solid var(--p)}
.rp-top{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:12px;margin-bottom:6px;border-bottom:2px solid var(--ink)}
.rp-top b{font-size:18px}
.rr2{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px dashed var(--line);font-weight:600;font-size:15px}
.rr2 .tg{opacity:0;transform:scale(.6);transition:.35s cubic-bezier(.3,1.5,.5,1);transition-delay:calc(.3s + var(--k)*.18s)}
.report.vis .rr2 .tg{opacity:1;transform:none}
.rr2.miss span{color:var(--mut)}

/* faq */
.mfq-in{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:start}
.mfq-in>*{min-width:0}
.qn{font-family:"JetBrains Mono",monospace;font-size:12px;color:var(--p);margin-right:14px;flex:none}
.qa button{justify-content:flex-start}.qa button .pm{margin-left:auto}

@media (max-width:1100px){
 .mm-hin{grid-template-columns:1fr;gap:0}
 .mm-copy{padding-bottom:10px}
 .mm-vis{min-height:0;max-width:640px;margin:0 auto;width:100%}
 .mm-eagle{height:500px}
 .dash{left:0}
 .mo-head,.es-grid,.in-grid,.rp-grid,.mfq-in{grid-template-columns:1fr;gap:28px}
 .mons{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
 .mm-hero{padding-top:34px}
 .mm-vis{flex-direction:column;align-items:center}
 .mm-eagle{height:380px;max-width:100%}
 .dash{position:relative;left:auto;bottom:auto;width:100%;max-width:340px;margin:-30px auto 26px}
 .mons{grid-template-columns:1fr}
 .vs{grid-template-columns:1fr}
 .vs-x{justify-self:center;width:44px;height:44px;font-size:22px}
 .vline{grid-template-columns:1fr;gap:18px;padding:10px 0}
 .vline:before,.rev{display:none}
 .vn{flex-direction:row;text-align:left;gap:12px}
 .vdot{margin:0}
 .ctrl2{grid-template-columns:1fr}
 .irf{grid-template-columns:1fr;gap:4px}
 .sla{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
 .ecg path,.sp path{animation:none;stroke-dashoffset:0}
 .qv:after,.cv:after{animation:none;transform:none}
 .dash,.alert{animation:none;opacity:1}
}
