:root{--color-bg:#413030;--color-text:#ffffff;--color-primary:#ff3366;--color-secondary:#3366ff;--color-tertiary:#33ddff;--color-accent:#ffcc00;--color-success:#10B981;--color-warning:#FBBF24;--color-danger:#EF4444;--card-radius:clamp(12px, 4vw, 16px);--card-bg:rgba(255, 255, 255, 0.03);--card-border:rgba(255, 255, 255, 0.1);--card-shadow:0 15px 30px -12px rgba(0, 0, 0, 0.5);--transition:all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);--spacing-xs:clamp(0.3rem, 2vw, 0.5rem);--spacing-sm:clamp(1rem, 3vw, 1.25rem);--spacing-md:clamp(1.5rem, 4vw, 2rem);--spacing-lg:clamp(2rem, 6vw, 3rem);--text-xs:clamp(0.75rem, 2vw, 0.875rem);--text-sm:clamp(0.875rem, 2.5vw, 1rem);--text-md:clamp(1rem, 3vw, 1.25rem);--text-lg:clamp(1.5rem, 5vw, 2.5rem);--text-xl:clamp(2rem, 8vw, 4.5rem);--font-tiny:0.7rem;--bg-translucent:rgba(255, 255, 255, 0.05)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:"Inter",-apple-system,BlinkMacSystemFont,sans-serif;background-color:var(--color-bg);color:var(--color-text);min-height:100vh;overflow-x:hidden;line-height:1.5}.background{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;overflow:hidden}.gradient-blob{position:absolute;border-radius:100%;filter:blur(80px);opacity:.5;-webkit-animation:float 20s infinite alternate ease-in-out;animation:float 20s infinite alternate ease-in-out}.gradient-blob:nth-child(1){background:linear-gradient(to right,var(--color-primary),var(--color-secondary));width:60vw;height:60vw;top:-20%;left:-10%;-webkit-animation-delay:0s;animation-delay:0s}.gradient-blob:nth-child(2){background:linear-gradient(to right,var(--color-tertiary),var(--color-secondary));width:60vw;height:60vw;bottom:-30%;right:-10%;-webkit-animation-delay:-5s;animation-delay:-5s}.gradient-blob:nth-child(3){background:linear-gradient(to right,var(--color-accent),var(--color-primary));width:40vw;height:40vw;top:40%;left:30%;-webkit-animation-delay:-10s;animation-delay:-10s}@-webkit-keyframes float{0%{transform:translate(0,0) scale(1)}50%{transform:translate(2%,2%) scale(1.02)}100%{transform:translate(-2%,-2%) scale(.98)}}@keyframes float{0%{transform:translate(0,0) scale(1)}50%{transform:translate(2%,2%) scale(1.02)}100%{transform:translate(-2%,-2%) scale(.98)}}main{width:100%;padding:var(--spacing-md) var(--spacing-sm) var(--spacing-sm);position:relative;z-index:1;max-width:1500px;margin:0 auto;display:flex;flex-direction:column;align-items:stretch}h1{font-size:var(--text-xl);font-weight:800;background:linear-gradient(90deg,#395492,#0099c0,#3dd5a8);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:#fff0;display:inline-block;text-align:center}.subtitle{font-size:var(--text-sm);text-align:center;margin-bottom:var(--spacing-xs);opacity:.8;color:#3dd5a8}footer{width:100%;padding:.5rem 0 1rem 0;text-align:center}.footer-info{font-size:var(--text-sm);color:var(--color-text);opacity:.7;margin:0;margin-top:.8rem}.cards-container{display:grid;grid-template-columns:1fr;gap:var(--spacing-md);perspective:1000px;padding:0 var(--spacing-xs);margin-bottom:0}.card{position:relative;min-height:auto;height:auto;width:100%;border-radius:24px;background:var(--card-bg);border:1px solid var(--card-border);box-shadow:var(--card-shadow);transform-style:preserve-3d;transition:var(--transition);overflow:hidden;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.card::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--x,50%) var(--y,50%),rgb(255 255 255 / .1) 0%,transparent 50%);opacity:0;transition:opacity 0.3s ease}.card:hover::before{opacity:1}.card-content{position:relative;height:auto;width:250px;padding:.75rem;display:flex;flex-direction:column;transform-style:preserve-3d;transition:transform 0.5s ease}.card:hover .card-content{transform:scale(1.03) translateZ(0)}.card-content>*:last-child{margin-bottom:0}.server-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--spacing-xs)}.server-header h2{font-size:clamp(1.1rem, 4vw, 1.4rem);margin:0;color:var(--color-tertiary);text-align:left;flex-grow:1;transform:translateZ(20px);display:flex;align-items:center;gap:.3rem}.status-indicator{width:15px;height:15px;border-radius:50%;display:inline-block;margin-right:8px;position:relative}.status-online{background-color:var(--color-success);box-shadow:0 0 6px rgb(16 185 129 / .6)}.status-online::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-color:var(--color-success);border-radius:50%;opacity:.6;animation:pulse 2s infinite}.status-offline{background-color:var(--color-danger);box-shadow:0 0 6px rgb(239 68 68 / .6)}@keyframes pulse{0%{transform:scale(1);opacity:.6}50%{transform:scale(1.5);opacity:0}100%{transform:scale(1);opacity:0}}.country-flag{width:40px;height:24px;border-radius:4px;overflow:hidden;background-color:rgb(255 255 255 / .1);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgb(0 0 0 / .2);transform:translateZ(15px)}.country-flag img{width:100%;height:100%;object-fit:cover}.os-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:4px}.os-icon img{width:100%;height:100%;object-fit:contain;display:block}.server-info{display:flex;flex-direction:column;gap:12px;padding:.5rem 12px;background-color:rgb(255 255 255 / .05);border-radius:12px;margin-bottom:.5rem;border:1px solid rgb(255 255 255 / .05)}.uptime-row{display:flex;align-items:center;justify-content:space-between;color:rgb(255 255 255 / .9);font-size:.9rem;margin-bottom:0;line-height:1;padding-bottom:0}.uptime-label{display:flex;align-items:center;gap:6px;color:rgb(255 255 255 / .6);font-size:.85rem}.uptime-value{font-weight:600;color:#fff}.uptime-progress-bar{display:flex;gap:3px;margin-top:-8px;margin-bottom:-8px;height:10px;width:100%}.progress-segment{flex:1;background-color:var(--color-success);border-radius:2px;opacity:.9}.progress-segment.status-gray{background-color:rgb(255 255 255 / .15);opacity:.6}.progress-segment.status-green{background-color:var(--color-success);opacity:.9}.progress-segment.status-yellow{background-color:var(--color-warning);opacity:.9}.progress-segment.status-red{background-color:var(--color-danger);opacity:.9}.divider{width:100%;height:1px;background:rgb(255 255 255 / .08);margin:0}.speed-row{display:flex;align-items:center;justify-content:space-between;width:100%;gap:4px;margin-top:-10px;margin-bottom:0;position:relative;line-height:normal}.speed-row::after{content:'';position:absolute;left:50%;top:10%;bottom:10%;width:1px;background:rgb(255 255 255 / .08);transform:translateX(-50%)}.speed-item{display:flex;flex-direction:row;align-items:center;gap:0;flex:1;justify-content:center;min-width:0}.speed-item.left{justify-content:center}.speed-item.right{justify-content:center}.speed-label{display:flex;align-items:center;gap:0;font-size:.82rem;color:rgb(255 255 255 / .6)}.traffic-total{font-size:.7rem;color:rgb(255 255 255 / .75);font-weight:600;white-space:nowrap}.icon-sm{width:15px;height:15px;fill:currentColor;flex-shrink:0;transform:translateY(1px)}.speed-value{font-weight:700;font-size:.75rem;color:#fff;text-shadow:0 2px 4px rgb(0 0 0 / .2);white-space:nowrap}.icon-up{fill:var(--color-secondary)}.icon-down{fill:var(--color-success)}.info-row{display:flex;justify-content:space-between;align-items:center;font-size:var(--text-xs);margin-top:2px}.info-value{color:rgb(255 255 255 / .7);font-weight:500;font-size:.8rem}.usage-bars{display:flex;flex-direction:column;gap:.35rem;padding:.5rem;background-color:var(--bg-translucent);border-radius:.75rem;margin-bottom:.5rem;transform:translateZ(15px)}.usage-item{display:flex;flex-direction:column;gap:.1rem}.usage-header{display:flex;justify-content:space-between;align-items:center;font-size:var(--text-xs)}.usage-name{color:rgb(255 255 255 / .7);font-weight:500;display:flex;align-items:center;gap:.25rem;white-space:nowrap;flex-shrink:1;min-width:0}.usage-capacity{opacity:.8;font-size:1em;color:var(--color-text);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cpu-usage .usage-capacity,.traffic-display .info-value,.traffic-display .usage-percentage{font-size:var(--font-tiny)}.traffic-display .info-value{text-align:left}.traffic-display .usage-percentage{width:auto;margin-left:.5rem}.usage-progress{flex-grow:1;height:8px;background-color:rgb(255 255 255 / .1);border-radius:4px;overflow:hidden;position:relative}.usage-fill{height:100%;background:linear-gradient(90deg,var(--color-secondary),var(--color-tertiary));border-radius:4px;transition:width 0.5s ease;position:relative}.usage-fill.low{background:var(--color-success)}.usage-fill.medium{background:linear-gradient(90deg,var(--color-secondary),var(--color-tertiary))}.usage-fill.high{background:var(--color-warning)}.usage-fill.very-high{background:var(--color-danger)}.usage-fill::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent,rgb(255 255 255 / .3),transparent);animation:shimmer 2s infinite}@keyframes shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}.usage-percentage{font-size:var(--text-xs);font-weight:600;color:var(--color-text);width:40px;text-align:right}.usage-percentage.low{color:var(--color-success)}.traffic-usage .usage-percentage.infinite{font-size:1.2rem;line-height:1}.usage-percentage.medium{color:var(--color-tertiary)}.usage-percentage.high{color:var(--color-warning)}.usage-percentage.very-high{color:var(--color-danger)}h1{font-size:4.5rem;display:inline-block}.subtitle{font-size:2.25rem}.cards-container{grid-template-columns:repeat(4,1fr);max-width:1400px;margin:0 auto;padding:0 var(--spacing-sm);gap:var(--spacing-lg)}.card h2{font-size:1.5rem;transform:translateZ(30px)}@media (max-width:767px){body{padding:0}main{padding:var(--spacing-sm)}h1{font-size:2.5rem;text-align:center;display:block}.subtitle{font-size:1.25rem}.cards-container{grid-template-columns:1fr;max-width:100%;padding:0;gap:var(--spacing-sm);width:100%}.card{border-radius:20px;max-width:none;width:95%;margin:0 auto}@media (max-width:375px){.subtitle{font-size:1rem}.usage-percentage{width:35px;font-size:var(--text-sm)}.card-content{padding:.6rem}.info-row,.usage-header{gap:.3rem}}.card-content{width:100%!important;min-width:0;max-width:none!important;padding:.8rem;box-sizing:border-box}.card:hover::before{opacity:0}.card:hover .card-content{transform:none!important}.server-header{flex-direction:row;align-items:center;justify-content:space-between;gap:.5rem}.server-header h2{font-size:clamp(1.2rem, 4vw, 1.3rem);flex-grow:1}.info-row{flex-direction:row;justify-content:space-between;align-items:center;gap:.5rem}.usage-header{flex-direction:row;align-items:center;gap:.5rem}.info-value{font-size:var(--text-sm);flex-grow:1;text-align:right}.usage-percentage{width:40px;text-align:right;flex-shrink:0;font-size:var(--text-sm)}.usage-progress{flex-grow:1}.gradient-blob{filter:blur(40px);opacity:.35}.gradient-blob:nth-child(1),.gradient-blob:nth-child(2){width:80vw;height:80vw}.gradient-blob:nth-child(3){width:50vw;height:50vw}.card{transform-style:flat;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgb(65 48 48 / .15);will-change:auto;box-shadow:0 4px 12px rgb(0 0 0 / .3)}.card-content{transform-style:flat;transform:none!important}.cards-container{-webkit-overflow-scrolling:touch}footer{padding:1.5rem 0}.footer-info{font-size:var(--text-xs);padding:0 var(--spacing-sm)}}@media (min-width:768px) and (max-width:1023px){body{padding:0 var(--spacing-md)}main{padding:var(--spacing-md);max-width:100%}h1{font-size:clamp(2.5rem, 5vw, 3rem);text-align:center}.subtitle{font-size:clamp(1.25rem, 3vw, 1.5rem);text-align:center}.cards-container{grid-template-columns:repeat(2,1fr);gap:var(--spacing-md);max-width:1000px;margin:0 auto;width:100%}.card{border-radius:20px;max-width:none;width:100%;margin:0;min-width:0}.card-content{width:100%!important;min-width:0;max-width:none!important;padding:1rem;box-sizing:border-box}.server-header{flex-direction:row;align-items:center;justify-content:space-between;gap:.8rem}.server-header h2{font-size:clamp(1.1rem, 3vw, 1.3rem);flex-grow:1}.info-row{gap:.8rem}.info-value{font-size:var(--text-sm);flex-grow:1;text-align:right}.usage-header{flex-direction:row;align-items:center;gap:.8rem}.usage-percentage{width:40px;text-align:right;flex-shrink:0}.gradient-blob{filter:blur(70px)}.gradient-blob:nth-child(1),.gradient-blob:nth-child(2){width:60vw;height:60vw}.gradient-blob:nth-child(3){width:40vw;height:40vw}.card:hover::before{opacity:0}.card:hover .card-content{transform:none!important}}@media (min-width:1024px) and (max-width:1229px){.cards-container{grid-template-columns:repeat(2,1fr);gap:var(--spacing-md);max-width:1100px;margin:0 auto;width:95%}.card{max-width:none;width:100%;margin:0;min-width:0;box-sizing:border-box}.card-content{width:100%!important;min-width:0;max-width:none!important;padding:1rem;box-sizing:border-box}main{padding:var(--spacing-md) var(--spacing-lg);max-width:100%;margin:0 auto}}.network-latency-section{padding:0;display:flex;flex-direction:column;margin-bottom:.5rem;transform:translateZ(15px)}.latency-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));background:var(--bg-translucent);border-radius:.75rem;padding:.5rem 0;position:relative}.latency-grid.cols-3{grid-template-columns:1fr 1fr 1fr}.latency-grid.cols-2{grid-template-columns:1fr 1fr}.latency-item{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;padding:0 .2rem;gap:.2rem}.latency-item:not(:last-child)::after{content:'';position:absolute;right:0;top:20%;height:60%;width:1px;background-color:rgb(255 255 255 / .1)}.provider-row{display:flex;align-items:center;gap:2px;justify-content:center}.status-dot{width:6px;height:6px;border-radius:50%;background-color:var(--color-success);flex-shrink:0}.status-dot.yellow{background-color:var(--color-warning)}.status-dot.red{background-color:var(--color-danger)}.provider-name{font-size:.75rem;color:rgb(255 255 255 / .9);font-weight:500;white-space:nowrap}.packet-loss{font-size:.7rem;color:rgb(255 255 255 / .4)}.latency-value{font-size:.95rem;font-weight:600;color:rgb(255 255 255 / .95);line-height:1.2}