.health-page{max-width:1280px;margin:auto;padding:150px 5vw 90px}.health-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:48px;padding-bottom:54px}.health-hero h1{font-size:clamp(3.8rem,8vw,7.4rem);line-height:.87;letter-spacing:-.065em;margin:18px 0 26px}.health-hero h1 em{color:var(--red);font-style:normal}.health-hero>div>p:last-child{max-width:690px;font-size:1.14rem;color:#a9a9ae;line-height:1.7}.health-pulse{display:inline-block;width:9px;height:9px;border-radius:50%;background:#35d07f;box-shadow:0 0 0 7px rgba(53,208,127,.12);margin-right:8px}.health-help{min-width:300px;padding:24px 28px;border:1px solid rgba(255,255,255,.12);background:#141416;text-decoration:none;display:flex;flex-direction:column;gap:7px}.health-help span{font-size:.78rem;color:#999}.health-help strong{color:#fff}.health-overall{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;padding:30px 34px;border:1px solid rgba(255,255,255,.1);background:linear-gradient(110deg,#151617,#101011);position:relative;overflow:hidden}.health-overall:after{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:#35d07f}.health-overall.state-degraded:after,.health-overall.state-unknown:after{background:#f4b740}.health-overall.state-outage:after{background:#ef4b54}.health-overall-icon{width:18px;height:18px;border:4px solid #35d07f;border-radius:50%;box-shadow:0 0 22px rgba(53,208,127,.45)}.health-overall.state-degraded .health-overall-icon,.health-overall.state-unknown .health-overall-icon{border-color:#f4b740;box-shadow:0 0 22px rgba(244,183,64,.4)}.health-overall.state-outage .health-overall-icon{border-color:#ef4b54;box-shadow:0 0 22px rgba(239,75,84,.4)}.health-overall p{font-size:.67rem;letter-spacing:.18em;color:#818186;margin:0 0 6px}.health-overall h2{font-size:1.5rem;margin:0 0 5px}.health-overall div>span{color:#aaa;font-size:.9rem}.health-overall button{border:1px solid rgba(255,255,255,.14);background:transparent;color:#fff;padding:12px 18px;cursor:pointer}.health-overall button:disabled{opacity:.45}.health-meta{display:flex;justify-content:space-between;color:#737378;font-size:.75rem;padding:14px 4px 70px}.health-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:28px}.health-heading h2,.health-diagnosis h2{font-size:clamp(2rem,4vw,3.3rem);margin:10px 0 0;letter-spacing:-.045em}.health-heading>p{max-width:390px;color:#85858a}.health-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.health-card{background:#121214;border:1px solid rgba(255,255,255,.085);padding:25px;min-height:250px;display:flex;flex-direction:column;transition:border-color .2s,transform .2s}.health-card:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.18)}.health-card-top{display:flex;justify-content:space-between;align-items:center}.health-service-icon{width:42px;height:42px;border:1px solid rgba(255,255,255,.12);display:grid;place-items:center;color:#bfc0c3}.health-service-icon:after{font-weight:800;font-size:.72rem;letter-spacing:-.02em}.icon-discord:after{content:"DC"}.icon-steam:after{content:"ST"}.icon-wardogs:after{content:"WD"}.icon-pragma:after{content:"PR"}.icon-bot:after{content:"BOT"}.icon-vocal:after{content:"MIC"}.icon-turn:after{content:"↔";font-size:1.1rem}.health-state{display:flex;align-items:center;gap:8px;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:#8b8b90}.health-state i{width:7px;height:7px;border-radius:50%;background:#35d07f;box-shadow:0 0 9px rgba(53,208,127,.6)}.state-degraded .health-state i,.state-unknown .health-state i{background:#f4b740;box-shadow:0 0 9px rgba(244,183,64,.6)}.state-outage .health-state i{background:#ef4b54;box-shadow:0 0 9px rgba(239,75,84,.6)}.health-card h3{font-size:1.42rem;margin:28px 0 10px}.health-explanation{color:#96969b;line-height:1.55;font-size:.9rem;margin:0 0 18px}.health-card footer{border-top:1px solid rgba(255,255,255,.07);display:flex;justify-content:space-between;margin-top:auto;padding-top:15px;color:#6e6e73;font-size:.72rem}.health-card footer strong{color:#aaa}.health-details{display:flex;flex-direction:column;gap:7px;margin-bottom:17px}.health-details span{display:flex;justify-content:space-between;font-size:.72rem;color:#777}.health-details b{font-weight:600}.detail-operational{color:#35d07f}.detail-outage{color:#ef4b54}.detail-degraded,.detail-unknown{color:#f4b740}.health-diagnosis{display:grid;grid-template-columns:.75fr 1.25fr;gap:70px;margin:100px 0 28px;padding:45px 0;border-top:1px solid rgba(255,255,255,.09);border-bottom:1px solid rgba(255,255,255,.09)}#health-causes{display:flex;flex-direction:column;gap:10px}.health-diagnosis article{display:flex;gap:15px;background:#171416;border:1px solid rgba(239,75,84,.16);padding:18px}.health-diagnosis article>span{width:27px;height:27px;display:grid;place-items:center;flex:0 0 auto;background:rgba(239,75,84,.13);color:#ef6d74;font-weight:bold}.health-diagnosis article p{margin:0;color:#aaa;line-height:1.5}.health-diagnosis article strong{display:block;color:#fff;margin-bottom:3px}.health-diagnosis article.is-clear{background:#121815;border-color:rgba(53,208,127,.16)}.health-diagnosis article.is-clear>span{background:rgba(53,208,127,.12);color:#35d07f}.health-guide{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.health-guide article{padding:28px;border:1px solid rgba(255,255,255,.08)}.health-guide article>span{color:var(--red);font-size:.7rem;letter-spacing:.15em}.health-guide h3{margin:20px 0 10px}.health-guide p{color:#8f8f94;line-height:1.6;font-size:.9rem}.health-guide a{color:#fff;text-decoration:none;font-size:.82rem}.health-card.is-updating{opacity:.55}
@media(max-width:900px){.health-page{padding-top:120px}.health-hero{grid-template-columns:1fr}.health-help{min-width:0}.health-grid{grid-template-columns:repeat(2,1fr)}.health-diagnosis{grid-template-columns:1fr;gap:30px}.health-guide{grid-template-columns:1fr}.health-heading{align-items:start;flex-direction:column}.health-overall{grid-template-columns:auto 1fr}.health-overall button{grid-column:1/-1}.health-meta{gap:8px;flex-direction:column}}
@media(max-width:560px){.health-page{padding-inline:20px}.health-hero h1{font-size:3.6rem}.health-grid{grid-template-columns:1fr}.health-card{min-height:220px}.health-overall{padding:24px 20px}.health-meta{padding-bottom:50px}}

.health-card{min-height:430px}.health-history{border-top:1px solid rgba(255,255,255,.07);padding-top:17px;margin-top:auto}.health-history-head{display:flex;justify-content:space-between;gap:20px}.health-history-head>div{display:flex;flex-direction:column}.health-history-head>div:last-child{text-align:right}.health-history-head span{font-size:.61rem;letter-spacing:.09em;color:#65656b}.health-history-head strong{font-size:1.25rem;margin-top:5px;color:#f2f2f3}.health-history-head small{font-size:.62rem;color:#777;margin-top:3px}.health-chart-wrap{position:relative;margin-top:13px}.health-chart{width:100%;height:72px;display:block;overflow:visible}.health-chart line{stroke:rgba(255,255,255,.08);stroke-width:1}.health-chart-line{fill:none;stroke:#d82834;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgba(216,40,52,.32))}.health-chart-last{fill:#f1f1f2;stroke:#d82834;stroke-width:2}.health-chart-wrap>div{display:flex;justify-content:space-between;color:#55555b;font-size:.58rem;margin-top:-2px}.health-chart-max{position:absolute;top:-4px;right:0;color:#68686e;font-size:.58rem}.health-card footer{margin-top:14px;padding-top:12px;font-size:.66rem}.health-card footer strong{color:#85858a}@media(max-width:560px){.health-card{min-height:410px}}


/* Les relevés externes sont chargés après le shell de page. */
.health-overall.is-loading,.health-grid.is-loading{position:relative}
.health-overall.is-loading:after{content:"";width:16px;height:16px;margin-left:auto;border:2px solid #ffffff22;border-top-color:#ef626b;border-radius:50%;animation:health-loading .8s linear infinite}
.health-grid.is-loading:after{content:"";position:absolute;left:50%;top:24px;width:18px;height:18px;border:2px solid #ffffff18;border-top-color:#ef626b;border-radius:50%;animation:health-loading .8s linear infinite;pointer-events:none}
.health-card.state-unknown .health-state b{color:#c7c8cc}
@keyframes health-loading{to{transform:rotate(360deg)}}
