html,body{height:100%;margin:0;padding:0;box-sizing:border-box;font-family:'Inter','Segoe UI','Roboto',Arial,sans-serif;color:#fff;min-height:100vh;}
body{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(115deg,#232336 0%,#373759 33%,#7f5cff 70%,#3abbb2 100%);background-size:300% 300%;animation:animatedGradient 44s ease-in-out infinite;}
@keyframes animatedGradient{0%{background-position:20% 50%;}33%{background-position:80% 50%;}66%{background-position:50% 20%;}100%{background-position:20% 50%;}}
.container{background:rgba(34,36,50,0.89);border-radius:22px;box-shadow:0 10px 40px 0 #7f5cff33,0 1.5px 20px 0 #0007;padding:2.6rem 3.2rem 2.2rem 3.2rem;max-width:410px;width:98vw;text-align:center;backdrop-filter:blur(10px) saturate(120%);border:1.2px solid #7f5cff33;position:relative;}
.logo-row{display:flex;align-items:center;justify-content:center;gap:0.7rem;margin-bottom:0.4rem;user-select:none;}
.logo-row img{width:38px;height:38px;border-radius:11px;box-shadow:0 0 14px #7f5cff44;background:#1a1a26;object-fit:contain;}
.logo-text{font-size:2.2rem;font-weight:900;letter-spacing:2px;color:#fff;text-shadow:0 3px 14px #7f5cff77,0 1px 6px #0008;background:linear-gradient(90deg,#7f5cff 20%,#46ffe3 80%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-left:0.12em;margin-right:-0.12em;}
.status-badge{display:inline-flex;align-items:center;gap:0.54em;margin-bottom:1.1rem;font-weight:700;font-size:1rem;background:#232f29bb;border-radius:12px;padding:0.28em 1.1em 0.28em 0.56em;box-shadow:0 0 6px #2228;border:1px solid #2227;position:relative;transition:filter .15s;filter:drop-shadow(0 0 8px #2224);animation:badgePop 0.7s cubic-bezier(.6,1.6,.4,1) both;}
@keyframes badgePop{from{transform:scale(0.8) translateY(20px);opacity:0;}to{transform:scale(1) translateY(0);opacity:1;}}
.status-dot{width:0.7em;height:0.7em;border-radius:50%;background:#bbb;box-shadow:0 0 16px #0000,0 0 3px #0000;animation:pulse 1.1s infinite alternate;}
@keyframes pulse{from{transform:scale(1);}to{transform:scale(1.27);}}
.api-label{display:inline-block;background:#7f5cff33;color:#7f5cff;border-radius:9px;padding:0.37rem 1.15rem;font-size:1.04rem;font-weight:700;letter-spacing:1.2px;margin-bottom:0.38rem;margin-top:0.18rem;box-shadow:0 1px 4px #7f5cff22;position:relative;overflow:visible;}
.api-label::after{content:"";display:block;height:2.5px;width:64%;background:linear-gradient(90deg,#7f5cff 10%,#46ffe3 90%);border-radius:3px;margin:0.34em auto 0 auto;opacity:0.7;box-shadow:0 0 9px #7f5cff99;}
.subtitle{font-size:1.08rem;color:#bdbdbd;margin-bottom:1.2rem;margin-top:0.48rem;line-height:1.6;}
.subtitle a{color:#7f5cff;text-decoration:underline wavy;transition:color .15s;font-weight:500;word-break:break-all;}
.subtitle a:hover{color:#46ffe3;text-shadow:0 0 5px #46ffe3;}
.stats-row{display:flex;gap:1.1rem;justify-content:center;margin-bottom:1.25rem;flex-wrap:wrap;margin-top:1.25rem;}
.stat-card{background:linear-gradient(120deg,#23253a 70%,#383b64 100%);border-radius:11px;padding:0.94rem 1.27rem 0.8rem 1.27rem;box-shadow:0 2px 16px #0004,0 0 0 #0000;min-width:90px;flex:1 1 80px;max-width:130px;text-align:center;border:1.2px solid #7f5cff44;margin-bottom:0.12rem;position:relative;overflow:hidden;}
.stat-label{font-size:0.92rem;color:#b7aefc;margin-bottom:0.19em;font-weight:700;letter-spacing:0.4px;}
.stat-value{font-size:1.18rem;font-weight:900;color:#46ffe3;letter-spacing:0.3px;text-shadow:0 1px 8px #46ffe355;}
.footer{margin-top:2.1rem;font-size:0.92rem;color:#888;opacity:0.83;letter-spacing:0.5px;user-select:none;}
@media (max-width:600px){.container{padding:1.5rem 0.6rem;}.stats-row{gap:0.5rem;}}